:root { color-scheme: dark; }
.cookie-hidden { display: none !important; }
.cookie-banner, .cookie-modal { font-family: Aptos, "Segoe UI", sans-serif; color: #f8fafc; }
.cookie-banner { position: fixed; z-index: 70; right: 1rem; bottom: 1rem; left: 1rem; max-width: 58rem; margin: auto; padding: 1.4rem; border: 1px solid rgba(255,255,255,.16); border-radius: 1rem; background: rgba(16,22,37,.98); box-shadow: 0 24px 70px rgba(0,0,0,.45); }
.cookie-banner__layout { display: flex; align-items: end; gap: 2rem; }
.cookie-copy { flex: 1; min-width: 0; }
.cookie-eyebrow { margin: 0 0 .35rem; color: #a5b4fc; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.cookie-title { margin: 0; color: #fff; font-size: 1.35rem; line-height: 1.2; }
.cookie-text { margin: .6rem 0 0; color: #cbd5e1; font-size: .9rem; line-height: 1.55; }
.cookie-link { display: inline-block; margin-top: .55rem; color: #a5b4fc; font-size: .88rem; text-underline-offset: .22rem; }
.cookie-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: .5rem; flex-shrink: 0; }
.cookie-button { min-height: 2.65rem; padding: .65rem 1rem; border: 1px solid rgba(255,255,255,.22); border-radius: .55rem; background: transparent; color: #fff; font: inherit; font-size: .88rem; font-weight: 700; cursor: pointer; }
.cookie-button:hover, .cookie-button:focus-visible { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.06); }
.cookie-button--primary { border-color: #4f46e5; background: #4f46e5; }
.cookie-button--primary:hover, .cookie-button--primary:focus-visible { border-color: #4338ca; background: #4338ca; }
.cookie-modal { position: fixed; z-index: 80; inset: 0; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(3,5,10,.82); }
.cookie-modal__panel { width: 100%; max-width: 34rem; max-height: calc(100vh - 2rem); overflow: auto; padding: 1.75rem; border: 1px solid rgba(255,255,255,.16); border-radius: 1rem; background: #101625; box-shadow: 0 24px 80px rgba(0,0,0,.55); }
.cookie-modal__header { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.cookie-close { width: 2.4rem; height: 2.4rem; border: 0; border-radius: .45rem; background: transparent; color: #cbd5e1; font-size: 1.5rem; cursor: pointer; }
.cookie-close:hover, .cookie-close:focus-visible { background: rgba(255,255,255,.06); color: #fff; }
.cookie-options { display: grid; gap: .7rem; margin-top: 1.3rem; }
.cookie-option { display: flex; align-items: center; justify-content: space-between; gap: 1.3rem; padding: 1rem; border: 1px solid rgba(255,255,255,.1); border-radius: .75rem; background: rgba(255,255,255,.025); }
.cookie-option strong { display: block; color: #fff; }
.cookie-option p { margin: .3rem 0 0; color: #cbd5e1; font-size: .78rem; line-height: 1.5; }
.cookie-always { flex-shrink: 0; color: #86efac; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cookie-switch { position: relative; display: inline-flex; flex-shrink: 0; cursor: pointer; }
.cookie-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.cookie-switch__track { position: relative; width: 2.75rem; height: 1.5rem; border-radius: 999px; background: #64748b; transition: background-color .2s; }
.cookie-switch__track::after { content: ""; position: absolute; top: .125rem; left: .125rem; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: #fff; transition: transform .2s; }
.cookie-switch input:checked + .cookie-switch__track { background: #4f46e5; }
.cookie-switch input:checked + .cookie-switch__track::after { transform: translateX(1.25rem); }
.cookie-switch input:focus-visible + .cookie-switch__track { outline: 2px solid #a5b4fc; outline-offset: 3px; }
.cookie-modal__actions { display: flex; justify-content: end; gap: .5rem; margin-top: 1.3rem; }
.cookie-scroll-lock { overflow: hidden !important; }
@media (max-width: 720px) { .cookie-banner__layout { display: block; } .cookie-actions { display: grid; grid-template-columns: 1fr 1fr; margin-top: 1rem; } .cookie-button--primary { grid-column: 1 / -1; } .cookie-modal__panel { padding: 1.25rem; } .cookie-modal__actions { flex-direction: column-reverse; } }
