/* One composition, eight complete palettes. Decoration stays beside the cup. */
:root{--paper:#f5e8d8;--wash:#ead2b8;--glow:#fffaf0;--accent:#98482f;--ink:#493022;--body:#705442;--gold:#926329;--line:#d9c2a8;--card:#fff9f0;--card-end:#f9eddd;--disc:#ebd6b8;--decor:#a26838;--halo:#d9ab7770}
:root[data-theme="winter"]{--paper:#e7eff4;--wash:#c8dce8;--glow:#fafcff;--accent:#41627d;--ink:#283e52;--body:#51697b;--gold:#5a7890;--line:#bfd0dc;--card:#f8fcff;--card-end:#edf4f9;--disc:#dce9f1;--decor:#779bb5;--halo:#a7c8de60}
:root[data-theme="spring"]{--paper:#edf1e3;--wash:#cfdfbf;--glow:#fcfbef;--accent:#506b45;--ink:#354631;--body:#58654b;--gold:#6b794b;--line:#cbd6bc;--card:#fcfdf4;--card-end:#edf3e2;--disc:#dfe8ce;--decor:#779464;--halo:#bfd0a970}
:root[data-theme="summer"]{--paper:#fbefd4;--wash:#f3d592;--glow:#fffcef;--accent:#8b591e;--ink:#523b21;--body:#79613f;--gold:#987329;--line:#e4cc99;--card:#fffdf2;--card-end:#fbf0d5;--disc:#f2e2b5;--decor:#b88b3c;--halo:#ebc96765}
:root[data-theme="new-year"]{--paper:#e4ece3;--wash:#b9ccbb;--glow:#fbf7e9;--accent:#365d48;--ink:#2b4536;--body:#526754;--gold:#8a702e;--line:#bdcdbb;--card:#fcfcf1;--card-end:#eaf0e3;--disc:#e5e4c9;--decor:#6b875d;--halo:#9cb48b65}
:root[data-theme="christmas"]{--paper:#e6e7f1;--wash:#c1c8e0;--glow:#fff9e9;--accent:#505c85;--ink:#333c5b;--body:#5d637d;--gold:#8c7138;--line:#c8cce0;--card:#fcfbff;--card-end:#eeedf7;--disc:#e6e0cd;--decor:#a28c51;--halo:#afbad360}
:root[data-theme="valentine"]{--paper:#f6e5e7;--wash:#eabec7;--glow:#fff8f1;--accent:#98465e;--ink:#593443;--body:#795665;--gold:#a06270;--line:#dfbec7;--card:#fff9f8;--card-end:#f8e9ec;--disc:#f0d9df;--decor:#bd8392;--halo:#e5afb965}
:root[data-theme="march-8"]{--paper:#eee6f0;--wash:#d9c6e2;--glow:#fffae5;--accent:#79517f;--ink:#4c3654;--body:#715c78;--gold:#8b7331;--line:#d7c4db;--card:#fffaff;--card-end:#f2eaf5;--disc:#eee5bb;--decor:#a19350;--halo:#dfcdd770}
html{min-height:100%;background:var(--paper)}
body{isolation:isolate;background:radial-gradient(ellipse at 4% 8%,var(--wash),transparent 48%),radial-gradient(ellipse at 95% 90%,var(--wash),transparent 50%),linear-gradient(115deg,var(--glow),var(--paper) 65%);background-attachment:fixed;min-height:100vh}
.paper-grain{z-index:0;opacity:.035}header,main,footer{position:relative;z-index:1}
.menu-card{background:linear-gradient(115deg,var(--card),var(--card-end));border-color:var(--line);box-shadow:0 5px 22px color-mix(in srgb,var(--ink) 5%,transparent)}
.menu-card:hover{border-color:var(--accent);box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 12%,transparent)}
.daily-card{border-color:color-mix(in srgb,var(--gold) 55%,var(--line))}
.account-button,.theme-option{background:var(--card);border-color:var(--line)}
.message-paper,.modal{background:linear-gradient(140deg,var(--card),var(--card-end));border-color:var(--line)}
.message-paper p{color:var(--ink)}.message-paper:before{color:var(--decor)}
.free-badge{background:var(--disc);color:var(--body)}
.hero-note,.access-note,footer,.prototype-label,.menu-trailing,.close-button,.demo-note,.date-dot{color:var(--body)}
.modal-footnote{color:var(--body)!important}.footer-dot{color:var(--gold)}footer{border-color:var(--line)}
.modal input{background:var(--card);border-color:var(--line)}
.cup-wrap{position:relative;isolation:isolate}.cup-wrap:before{content:'';position:absolute;inset:14%;border-radius:50%;z-index:-1;background:radial-gradient(circle,var(--halo),transparent 70%);transform:scale(1.45)}
.theme-decor{position:absolute;inset:-7% -15%;pointer-events:none;z-index:-1;color:var(--decor)}
.ornament{position:absolute;width:48px;height:48px;opacity:.65}
.ornament-0{left:1%;top:19%;transform:rotate(-19deg)}
.ornament-1{right:3%;top:9%;width:32px;height:32px;transform:rotate(17deg);opacity:.5}
.ornament-2{right:0;bottom:18%;width:23px;height:23px;transform:rotate(-12deg);opacity:.38}
[data-theme="spring"] .ornament-0,[data-theme="autumn"] .ornament-0,[data-theme="march-8"] .ornament-0{width:68px;height:68px}
[data-theme="summer"] .ornament-0{width:65px;height:65px}
[data-theme="valentine"] .ornament-1{transform:rotate(20deg)}
[data-theme="new-year"] .cup-wrap:after,[data-theme="christmas"] .cup-wrap:after{content:'';position:absolute;inset:4%;border:1px solid color-mix(in srgb,var(--gold) 18%,transparent);border-radius:50%;z-index:-1}
[data-theme="winter"] .theme-decor{background:radial-gradient(circle at 17% 62%,#fff 0 2px,transparent 3px),radial-gradient(circle at 80% 22%,#fff 0 3px,transparent 4px),radial-gradient(circle at 91% 64%,#fff 0 2px,transparent 3px)}
.theme-option{box-shadow:inset 4px 0 color-mix(in srgb,var(--accent) 12%,transparent)}
@media(max-width:720px){.theme-decor{inset:0 -17%}.ornament{width:36px;height:36px}.ornament-1{width:26px;height:26px}.ornament-2{width:18px;height:18px}[data-theme="spring"] .ornament-0,[data-theme="autumn"] .ornament-0,[data-theme="march-8"] .ornament-0,[data-theme="summer"] .ornament-0{width:46px;height:46px}.ornament-0{left:0;top:24%}.ornament-1{right:2%;top:15%}}

/* Still-life accent anchored to the cup, matching the album's lower-left composition. */
.theme-accent{position:absolute;width:36%;height:36%;background:url('./assets/accents/autumn.png') center/contain no-repeat;left:0;bottom:4%;z-index:2;pointer-events:none;user-select:none;filter:drop-shadow(0 4px 4px #40302012)}
[data-theme="spring"] .theme-accent{width:40%;height:40%;left:-1%;bottom:3%}
[data-theme="summer"] .theme-accent,[data-theme="christmas"] .theme-accent,[data-theme="valentine"] .theme-accent{width:30%;height:30%;left:2%;bottom:7%}
@media(max-width:720px){.cup-wrap{max-width:300px;width:100%;margin-bottom:8px}.theme-decor{inset:0 -5%}.ornament-0{left:0;top:17%}.ornament-1{right:0;top:10%}.ornament-2{right:0;bottom:21%}}
@media(max-width:720px){[data-theme="valentine"] .ornament-1{right:4%}}

/* Keep tablet ornaments within the cup column instead of outside the viewport. */
@media(min-width:721px) and (max-width:1000px){.theme-decor{inset:0}.ornament-0{left:0}.ornament-1{right:0}.ornament-2{right:0}}

/* Evening Coffee is a display preference; seasonal art and shared cards keep their theme. */
:root{color-scheme:light}
:root[data-appearance="dark"]{color-scheme:dark;--paper:#251e1a;--wash:#352820;--glow:#30251e;--ink:#edddc7;--body:#c2ad96;--gold:#d4ac70;--line:#69533f;--card:#30261f;--card-end:#382b22;--disc:#463525;--decor:#c29b68;--halo:#c99a4f20;--accent:#e2b587;--accent-deep:#d4a574}
[data-appearance="dark"] .primary-button{color:#251e1a}
[data-appearance="dark"] .skip{background:var(--card);color:var(--ink)}
[data-appearance="dark"] .error-message{color:#ffbaaa!important;background:#4b2923}
[data-appearance="dark"] .sent-card>span{color:#c1d0a4}
[data-appearance="dark"] input::placeholder{color:#b59d87;opacity:1}
[data-appearance="dark"] .toast{background:var(--card);color:var(--ink);border:1px solid var(--line)}
[data-appearance="dark"] .modal::backdrop{background:#100c0ab3}
[data-appearance="dark"] .cup{filter:drop-shadow(0 12px 20px #08050360)}
.appearance-options{border:0;padding:0;margin:18px 0;display:grid;grid-template-columns:1fr 1fr;gap:8px;text-align:left}
.appearance-options legend{font-size:12px;color:var(--body);margin-bottom:10px}
.appearance-options button{border:1px solid var(--line);border-radius:var(--radius-control);padding:12px 8px;min-height:44px;background:var(--card);color:var(--body);font-size:12px}
.appearance-options button[aria-pressed="true"]{border-color:var(--gold);color:var(--ink);box-shadow:inset 0 0 0 1px var(--gold)}

/* Declarative images, like the cup: no load-handler or hidden-state dependency. */
:root[data-theme="winter"] .theme-accent{background-image:url('./assets/accents/winter.png')}
:root[data-theme="spring"] .theme-accent{background-image:url('./assets/accents/spring.png')}
:root[data-theme="summer"] .theme-accent{background-image:url('./assets/accents/summer.png')}
:root[data-theme="new-year"] .theme-accent{background-image:url('./assets/accents/new-year.png')}
:root[data-theme="christmas"] .theme-accent{background-image:url('./assets/accents/christmas.png')}
:root[data-theme="valentine"] .theme-accent{background-image:url('./assets/accents/valentine.png')}
:root[data-theme="march-8"] .theme-accent{background-image:url('./assets/accents/march-8.png')}