@font-face {font-family:Golos;src:url('shared/fonts/golostext.ttf') format('truetype');font-weight:400 900;font-display:swap}
@font-face {font-family:Cormorant;src:url('shared/fonts/cormorantgaramond.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face {font-family:Oswald;src:url('shared/fonts/oswald.ttf') format('truetype');font-weight:200 700;font-display:swap}
@font-face {font-family:Nunito;src:url('shared/fonts/nunito.ttf') format('truetype');font-weight:200 1000;font-display:swap}
[data-theme="gold"] {--base:#0c0d10;--ink:#fff3d4;--muted:#dfcda9;--accent:#f3cf83;--button-ink:#211500;--panel:#17140ff2;--line:#846b3b;--heading:Cormorant;--material:linear-gradient(110deg,#a7772c,#ffe6a5 32%,#fff5d9 42%,#c38b35 55%,#ffe4a0 75%,#a7772c);--desktop:url('gold/background.webp');--mobile:url('gold/mobile.webp')}
[data-theme="ice"] {--base:#e4efff;--ink:#142c53;--muted:#345478;--accent:#174d91;--button-ink:#fff;--panel:#f0f7fff2;--line:#8ba7ce;--heading:Cormorant;--material:linear-gradient(110deg,#16467d,#527fb1 32%,#183d68 45%,#6897bc 55%,#16467d);--desktop:url('ice/background.webp');--mobile:url('ice/mobile.webp')}
[data-theme="mandarin"] {--base:#fff0d8;--ink:#173b28;--muted:#54603a;--accent:#a63806;--button-ink:#fff;--panel:#fff4e1f5;--line:#c39b67;--heading:Nunito;--material:linear-gradient(110deg,#8c2a00,#bd4504 32%,#a13500 55%,#bf4a06 75%,#8c2a00);--desktop:url('mandarin/background.webp');--mobile:url('mandarin/mobile.webp')}
[data-theme="disco"] {--base:#210012;--ink:#fff1f8;--muted:#f8b1d1;--accent:#ff81bd;--button-ink:#350018;--panel:#27051ff2;--line:#b3497b;--heading:Oswald;--material:linear-gradient(110deg,#ff5aaf,#fff1fa 34%,#ff8fc9 55%,#ffc7e6 80%,#ff5aaf);--desktop:url('disco/background.webp');--mobile:url('disco/mobile.webp')}
[data-theme="forest"] {--base:#031b14;--ink:#fff1d6;--muted:#d7cbae;--accent:#e2bd73;--button-ink:#192611;--panel:#09271ef2;--line:#89723e;--heading:Cormorant;--material:linear-gradient(110deg,#bc8b3a,#fff0ca 34%,#ddb56c 55%,#f2d79c 80%,#bc8b3a);--desktop:url('forest/background.webp');--mobile:url('forest/mobile.webp')}
.theme-surface {background-color:var(--base);color:var(--ink);font-family:Golos,Arial,sans-serif}
.theme-heading {font-family:var(--heading),Georgia,serif;font-weight:700;line-height:.98;overflow-wrap:anywhere}
.material-text {color:var(--accent);background-image:var(--material);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.theme-panel {background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:24px}
.theme-button {border:1px solid transparent;background:var(--accent);color:var(--button-ink);padding:14px 20px;border-radius:12px;font:600 14px Golos,sans-serif;min-height:48px;cursor:pointer;transition:filter .2s,transform .2s}
.theme-button:hover {filter:brightness(1.09)}
.theme-button:active {transform:translateY(1px)}
.theme-button:disabled {opacity:.48;cursor:not-allowed;filter:none}
.theme-button.secondary {background:var(--panel);color:var(--ink);border-color:var(--line)}
.theme-input {width:100%;box-sizing:border-box;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:14px;font:400 16px Golos,sans-serif;min-height:48px}
.theme-input::placeholder {color:var(--muted)}
.theme-input[aria-invalid="true"] {border:2px solid var(--accent)}
.theme-chip {display:inline-block;background:var(--panel);border:1px solid var(--line);border-radius:30px;padding:8px 13px;font-size:13px;color:var(--ink)}
.theme-chip[aria-pressed="true"] {background:var(--accent);color:var(--button-ink)}
.theme-surface :focus-visible {outline:3px solid var(--accent);outline-offset:4px}
.theme-icon {width:24px;height:24px;vertical-align:middle;color:currentColor}
.sway {animation:holiday-sway 4s ease-in-out infinite;transform-origin:50% 12%}
.breathe {animation:holiday-breathe 4s ease-in-out infinite}
@keyframes holiday-sway {0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@keyframes holiday-breathe {0%,100%{transform:scale(.88)}50%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce) {.sway,.breathe{animation:none} .theme-button{transition:none}}
@media(forced-colors:active) {.material-text {background:none;-webkit-text-fill-color:CanvasText;color:CanvasText}}

.icon {display:inline-block;width:24px;height:24px;background:currentColor;mask:var(--icon) center/contain no-repeat;-webkit-mask:var(--icon) center/contain no-repeat;vertical-align:middle}
