/* Accent is independent of the surface theme and used by every primary control. */
html[data-accent=cyan]{--accent:#a6d8ed;--accent-ink:#183746}
html[data-accent=violet]{--accent:#d5c2ef;--accent-ink:#302442}
html[data-accent=lime]{--accent:#e7d0a1;--accent-ink:#3b3020}
html[data-theme]{--accent-soft:color-mix(in srgb,var(--accent) 16%,transparent)}
html[data-theme] :is(.primary,.brandmark,.filters button.active,.today .day-number),html[data-theme] #everyday-calculator .everyday-keys .equals{background:var(--accent);color:var(--accent-ink)}
html[data-theme] :is(.primary:hover,#everyday-calculator .everyday-keys .equals:hover){background:color-mix(in srgb,var(--accent) 85%,white);color:var(--accent-ink)}
html[data-theme] :is(.everyday-keys .operator,.everyday-top button,.result-value,#journey-result>strong,#carry-banner strong,.number-bridge strong,.number-bridge>span:last-child,.journey-toolbar button,.tax-context a,.tax-context summary,.tax-breakdown summary,.graph-table summary){color:var(--accent)}
html[data-theme] :is(.everyday-keys .operator,.ws-link.active,.view-switch button.active,#month-projection,#carry-banner){background:var(--accent-soft)}
html[data-theme] .workspace-nav{color:var(--accent)!important}
html[data-theme] .series-0{color:var(--accent);stroke:var(--accent);fill:var(--accent)}
html[data-theme] .graph-line{fill:none}html[data-theme] .graph-dot{stroke:#2e3947}
html[data-theme] .interactive-chart input[type=range]{accent-color:var(--accent)}
html[data-theme] :is(.everyday-top i,.status-dot,.live-label i){background:var(--accent)}
.appearance-form{margin-top:28px;display:grid;gap:18px}.appearance-hint{grid-column:1/-1;font-size:16px!important;color:var(--muted)!important;margin:0 0 12px}
html[data-theme=sage]{--bg:#3c453c;--panel:#4b5749;--muted:#d1d9c8;--text:#faf7ee}
html[data-theme=sage] body{background:radial-gradient(ellipse at 85% 20%,#d6d3b71c,transparent 50%),#3c453c}
html[data-theme=sage] :is(header,.workspace-active header){background:#414c41ed}
html[data-theme=sage] :is(dialog,#journey-dialog,.dialog-top){background:#465243}
html[data-theme=sage] :is(.everyday-display,input,select,textarea,option){background-color:#313d2a;color:#f6f5eb}
html[data-theme=sage] :is(#everyday-calculator,.card,.next-suggestions button,.number-bridge,.summary-card,.calendar-shell,.saved-card,.outlook-card){border-color:#d4e0c32c;box-shadow:none}
html[data-theme=midnight]{--bg:#090d16;--panel:#111827;--muted:#b7c8de;--text:#eef4ff}
html[data-theme=midnight] body{background:radial-gradient(ellipse at 85% 0,#25385850,transparent 48%),#090d16}
html[data-theme=midnight] :is(header,.workspace-active header){background:#0b101cf0}
html[data-theme=midnight] :is(dialog,#journey-dialog,.dialog-top){background:#111c2e}
html[data-theme=midnight] :is(.everyday-display,input,select,textarea,option){background-color:#0e1827;color:#eef4ff}
html[data-theme=midnight] :is(#everyday-calculator,.card,.summary-card,.calendar-shell,.saved-card,.outlook-card){background:linear-gradient(140deg,#19273b,#101725);border-color:#30415b;box-shadow:0 8px 28px #0003}
/* Realistic desk edition: satin casing, an inset LCD, and tactile keycaps. */
html[data-theme=desk]{--bg:#333532;--panel:#444743;--muted:#cdd0c8;--text:#faf6ed;--shadow-surface:0 3px 7px #10120e25,0 12px 24px #10120e30}
html[data-theme=desk] body{background:repeating-linear-gradient(94deg,#ffffff02 0 1px,transparent 1px 5px),radial-gradient(ellipse at 20% 5%,#c3b49218,transparent 60%),#333532}
html[data-theme=desk] :is(header,.workspace-active header){background:#343934ed}
html[data-theme=desk] :is(dialog,#journey-dialog,.dialog-top){background:#3b413c}
html[data-theme=desk] :is(input,select,textarea,option){background-color:#272e29;color:#f5f3e9}
html[data-theme=desk] #everyday-calculator{position:relative;padding:26px;background:linear-gradient(135deg,#858b88 0%,#626b68 28%,#515b58 70%,#717a76 100%);border:0;border-radius:24px;box-shadow:inset 0 2px 2px #ffffff60,inset 0 -5px 2px #232d29,0 5px 0 #26312c,0 16px 25px #0d160d60,0 28px 50px #0b100b25}
html[data-theme=desk] #everyday-calculator::after{content:'';position:absolute;pointer-events:none;inset:8px;border-radius:18px;box-shadow:inset 0 1px 2px #1d292820}
html[data-theme=desk] .everyday-top{color:#f0f1e9;text-shadow:0 1px 1px #17251c80;letter-spacing:.2px}
html[data-theme=desk] .everyday-top i{width:9px;height:9px;box-shadow:0 1px 1px #eaffee50,inset 0 1px 2px #0008}
html[data-theme=desk] #everyday-calculator .everyday-display{background:linear-gradient(155deg,#aab89e,#c2ccad 45%,#adbba0);border:7px solid #3a4740;border-radius:12px;box-shadow:inset 0 3px 8px #26372065,inset 0 -1px 3px #edf8d180,0 1px 1px #dbe6de70;padding:16px}
html[data-theme=desk] #basic-expression{font-family:'Google Sans','Roboto',Arial,sans-serif;font-weight:500;letter-spacing:-2px;color:#253526;background:transparent;text-shadow:1px 2px 1px #334c2220}
html[data-theme=desk] :is(#basic-expression-label,#basic-feedback){color:#344a32;text-shadow:0 1px #e5efd540;font-weight:500}
html[data-theme=desk] #everyday-calculator .everyday-keys{gap:12px;padding:8px 2px 10px}
html[data-theme=desk] #everyday-calculator .everyday-keys button{position:relative;background:linear-gradient(#f4efe4,#d9d5c9);border:0;color:#313a34;border-radius:10px;box-shadow:inset 0 1px 1px #fff,inset 0 -2px 2px #aaa99e,0 4px 0 #363f39,0 5px 6px #17241c70;text-shadow:0 1px #fff8;font-weight:550;transition:transform .1s,box-shadow .1s}
html[data-theme=desk] #everyday-calculator .everyday-keys .operator{background:linear-gradient(#53635b,#3b4b43);color:#edf5e9;box-shadow:inset 0 1px 1px #829286,inset 0 -2px 1px #293b30,0 4px 0 #25362c,0 5px 6px #17241c70;text-shadow:0 1px #101b13}
html[data-theme=desk] #everyday-calculator .everyday-keys button[data-basic-key=AC]{background:linear-gradient(#e1aa8d,#c78669);color:#382b25;text-shadow:0 1px #f8d0b960}
html[data-theme=desk] #everyday-calculator .everyday-keys .equals{background:linear-gradient(color-mix(in srgb,var(--accent) 85%,white),var(--accent));color:var(--accent-ink)}
html[data-theme=desk] #everyday-calculator .everyday-keys button:hover{filter:brightness(1.05);transform:none}
html[data-theme=desk] #everyday-calculator .everyday-keys button:active{transform:translateY(3px);box-shadow:inset 0 1px 3px #29382c30,0 1px 0 #25362c,0 2px 3px #17241c50}
html[data-theme=desk] #everyday-calculator.expanded{background:linear-gradient(135deg,#535f58,#424e46);padding:24px}
html[data-theme=desk] .graph-scenario{background:#25352a50}
html[data-theme=desk] .interactive-chart{background:linear-gradient(135deg,#b9c8af0e,#d7caac0b)}
html[data-theme=desk] .card:has([data-open=scientific]) .card-icon,html[data-theme=desk] .card:has([data-open=percentage]) .card-icon{color:transparent;position:relative;background:linear-gradient(#8b9388,#596456);box-shadow:inset 0 1px #e0e8d570,0 3px 0 #202b23,0 6px 8px #17231b50;border:0;width:37px;height:48px;border-radius:6px}
html[data-theme=desk] .card:has([data-open=scientific]) .card-icon::after,html[data-theme=desk] .card:has([data-open=percentage]) .card-icon::after{content:'';position:absolute;inset:6px;background:linear-gradient(#bdcba9,#bdcba9) center top/100% 10px no-repeat,radial-gradient(ellipse,#e6e2d4 55%,transparent 60%) left bottom/8px 8px repeat-x,radial-gradient(ellipse,#e6e2d4 55%,transparent 60%) left 20px/8px 8px repeat-x;border-radius:2px}
html[data-theme=desk] :is(button,a,input,select,textarea):focus-visible{outline-color:var(--accent);outline-offset:5px}
@media(max-width:720px){html[data-theme=desk] #everyday-calculator{padding:19px}html[data-theme=desk] .everyday-display{padding:12px;border-width:5px}html[data-theme=desk] #everyday-calculator .everyday-keys{gap:10px}html[data-theme=desk] #everyday-calculator.expanded{padding:16px}}
html[data-theme] #everyday-calculator #basic-expression{box-shadow:none;border:0;background:transparent}
@media(prefers-reduced-motion:reduce){html[data-theme=desk] #everyday-calculator .everyday-keys button{transition:none}}