/* Cookie consent sheet, after Yazio's. Bottom sheet on phones, a 420px card in the bottom-left on desktop. */
.ck { position: fixed; z-index: 150; left: 16px; right: 16px; bottom: 16px; display: flex; justify-content: flex-start; pointer-events: none;
  font-family: "Inter", system-ui, sans-serif; color: #191C1F; -webkit-font-smoothing: antialiased; }
.ck[hidden] { display: none; }
.ck-card { pointer-events: auto; width: min(420px, 100%); max-height: min(560px, calc(100dvh - 32px)); display: flex; flex-direction: column; overflow: hidden;
  border-radius: 20px; background: #fff; box-shadow: 0 0 0 1px rgba(28, 28, 28, .06), 0 20px 50px rgba(20, 14, 10, .22);
  animation: ck-in .45s cubic-bezier(.22, .8, .24, 1) both; }
@keyframes ck-in { from { opacity: 0; transform: translateY(16px); } }
.ck-scroll { flex: 1 1 auto; min-height: 0; max-height: 210px; overflow: auto; overscroll-behavior: contain; padding: 22px 22px 14px; scrollbar-width: thin;
  -webkit-mask-image: linear-gradient(#000 calc(100% - 22px), transparent); mask-image: linear-gradient(#000 calc(100% - 22px), transparent); }
.ck-card.is-settings .ck-scroll { max-height: 360px; }
.ck-title { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font: 700 19px/24px "Inter", system-ui, sans-serif !important; letter-spacing: -.02em !important; text-transform: none !important; color: #191C1F; }
.ck-ic { width: 22px; height: 22px; flex: none; }
.ck p { margin: 0 0 14px; font-size: 14.5px; line-height: 22px; color: #55524E; letter-spacing: -.01em; }
.ck-lead { color: #55524E; }
.ck-sub { margin: 4px 0 2px; font: 600 14.5px/22px "Inter", system-ui, sans-serif !important; letter-spacing: -.01em !important; text-transform: none !important; color: #191C1F; }
.ck-settings { display: grid; gap: 4px; margin: 2px 0 6px; }
.ck-row { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid #F0ECE6; cursor: pointer; }
.ck-row span { flex: 1; display: grid; gap: 2px; }
.ck-row b { font-size: 14.5px; font-weight: 600; }
.ck-row small { font-size: 13px; line-height: 18px; color: #6F6A64; }
.ck-row input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ck-sw { flex: none; position: relative; width: 42px; height: 26px; border-radius: 999px; background: #E2DCD3; transition: background-color .2s ease; }
.ck-sw::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .2); transition: transform .22s cubic-bezier(.3, .7, .3, 1); }
.ck-row input:checked ~ .ck-sw { background: #191C1F; }
.ck-row input:checked ~ .ck-sw::after { transform: translateX(16px); }
.ck-row input:disabled ~ .ck-sw { opacity: .55; }
.ck-row input:focus-visible ~ .ck-sw { outline: 2px solid #191C1F; outline-offset: 2px; }
.ck-actions { flex: none; display: grid; gap: 8px; padding: 14px 22px 16px; border-top: 1px solid #F0ECE6; }
.ck-btn { height: 48px; border: 1px solid #E3DED7; border-radius: 12px; background: #fff; color: #191C1F; font: 600 15px/1 "Inter", system-ui, sans-serif; letter-spacing: -.01em;
  cursor: pointer; transition: transform .12s ease, background-color .15s ease; -webkit-tap-highlight-color: transparent; }
.ck-btn:active { transform: translateY(1px); }
.ck-btn--dark { border-color: #262626; background: #262626; color: #fff; }
.ck-btn:focus-visible { outline: 2px solid #191C1F; outline-offset: 2px; }
.ck-legal { flex: none; display: flex; justify-content: center; gap: 28px; padding: 12px 22px 14px; background: #F7F5F2; border-top: 1px solid #F0ECE6; }
.ck-legal a { font-size: 13.5px; font-weight: 500; color: #55524E; text-decoration: none; }
.ck-legal a:hover { color: #191C1F; }
@media (max-width: 520px) {
  .ck { left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); }
  .ck-card { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .ck-card { animation: none; } .ck-sw, .ck-sw::after { transition: none; } }
.ck .ck-title, .ck .ck-sub { color: #191C1F; margin-bottom: 10px; } .ck .ck-sub { margin: 4px 0 2px; }

/* Desktop: bottom-right, narrower, and no inner scrollbar (the text fits). */
@media (min-width: 521px) {
  .ck { justify-content: flex-end; left: auto; right: 20px; bottom: 20px; }
  .ck-card { width: 340px; max-height: none; border-radius: 18px; }
  .ck-scroll { max-height: none !important; overflow: visible; padding: 18px 18px 10px; -webkit-mask-image: none; mask-image: none; }
  .ck-title { font-size: 16px !important; line-height: 20px !important; margin-bottom: 8px !important; }
  .ck-ic { width: 18px; height: 18px; }
  .ck p { font-size: 13px; line-height: 19px; margin-bottom: 10px; }
  .ck .ck-sub { font-size: 13px !important; line-height: 19px !important; }
  .ck-row { padding: 8px 0; } .ck-row b { font-size: 13px; } .ck-row small { font-size: 12px; line-height: 16px; }
  .ck-actions { gap: 6px; padding: 10px 18px 12px; }
  .ck-btn { height: 40px; font-size: 13.5px; border-radius: 10px; }
  .ck-legal { gap: 22px; padding: 9px 18px 10px; }
  .ck-legal a { font-size: 12px; }
}
.ck-scroll { scrollbar-width: none; } .ck-scroll::-webkit-scrollbar { display: none; }
.ck-settings[hidden] { display: none; }
/* Desktop keeps the short scrolling text area (scrollbar hidden, soft fade at the foot), so the card stays compact. */
@media (min-width: 521px) {
  .ck-scroll { max-height: 128px !important; overflow: auto !important; padding-bottom: 14px;
    -webkit-mask-image: linear-gradient(#000 calc(100% - 20px), transparent) !important; mask-image: linear-gradient(#000 calc(100% - 20px), transparent) !important; }
  .ck-card.is-settings .ck-scroll { max-height: 260px !important; }
}
.ck-btn, .ck .ck-btn { border-radius: 999px !important; }
