:root[data-theme]{--surface:#fff;--soft:#edf1e7;--soft-alt:#eee9f2;--accent:#82987b;--accent-strong:#51694f;--accent-alt:#a58ab9;--button-text:#fff;--text:#303a36;--input:#fff;--sidebar:#f0f1e8;--chart:#8da995;--chart-alt:#b2a1c9}
:root[data-theme=terracotta]{--bg:#faf3e9;--surface:#fffaf3;--soft:#f1dfcd;--soft-alt:#e7e5d3;--line:#dec8b5;--ink:#673a2b;--text:#49382e;--muted:#705746;--lime:#ead0b6;--peach:#f0d2bc;--purple:#e6dbe1;--accent:#ac6246;--accent-strong:#87442e;--accent-alt:#747950;--sidebar:#f1e6d7;--input:#fffcf6;--chart:#ad6044;--chart-alt:#7e865b}
:root[data-theme=coastal]{--bg:#eef6f7;--surface:#fbfefe;--soft:#e0eff0;--soft-alt:#e5edf7;--line:#cfdee2;--ink:#30595d;--text:#2f484c;--muted:#526c71;--lime:#cbe4e1;--peach:#dfded0;--purple:#d9e7f3;--accent:#59979a;--accent-strong:#33767b;--accent-alt:#779cbe;--sidebar:#e1eef0;--input:#fbfefe;--chart:#6aa7a4;--chart-alt:#89a8cb}
:root[data-theme=lavender]{--bg:#f5f2fa;--surface:#fefcff;--soft:#eee7f4;--soft-alt:#e8e5f3;--line:#ddd4e8;--ink:#59466e;--text:#4b4255;--muted:#6c5d77;--lime:#e2d5ed;--peach:#ecd9dd;--purple:#ded5ef;--accent:#9580ad;--accent-strong:#76578f;--accent-alt:#a098c0;--sidebar:#ede6f4;--input:#fefcff;--chart:#a58abf;--chart-alt:#aaa4ce}
:root[data-theme=midnight]{color-scheme:dark;--bg:#192523;--surface:#22322e;--soft:#30433b;--soft-alt:#3c3548;--line:#46574e;--ink:#c4ddce;--text:#e4ece7;--muted:#acbcb3;--lime:#3d5747;--peach:#694a40;--purple:#4b405b;--accent:#adc8b4;--accent-strong:#bdd6c4;--accent-alt:#bba7ce;--button-text:#1b2c22;--sidebar:#1d2c27;--input:#293c33;--chart:#94b69d;--chart-alt:#b9a5ce}
html[data-theme]:not([data-theme="mosaic"]) body{background:var(--bg);color:var(--text)}html[data-theme]:not([data-theme="mosaic"]) .side{background:var(--sidebar)}html[data-theme]:not([data-theme="mosaic"]) .card,html[data-theme]:not([data-theme="mosaic"]) dialog,html[data-theme]:not([data-theme="mosaic"]) .bottomnav,html[data-theme]:not([data-theme="mosaic"]) .learning-category,html[data-theme]:not([data-theme="mosaic"]) .learning-subtopic{background:var(--surface);border-color:var(--line);color:var(--text)}html[data-theme]:not([data-theme="mosaic"]) button{background:var(--ink);color:var(--button-text)}html[data-theme]:not([data-theme="mosaic"]) button.ghost,html[data-theme]:not([data-theme="mosaic"]) .pill,html[data-theme]:not([data-theme="mosaic"]) .metric,html[data-theme]:not([data-theme="mosaic"]) .noteblock,html[data-theme]:not([data-theme="mosaic"]) .hint,html[data-theme]:not([data-theme="mosaic"]) .lab-focus-tile,html[data-theme]:not([data-theme="mosaic"]) .lab-guidance,html[data-theme]:not([data-theme="mosaic"]) .care-note,html[data-theme]:not([data-theme="mosaic"]) .learning-next,html[data-theme]:not([data-theme="mosaic"]) .learning-icon,html[data-theme]:not([data-theme="mosaic"]) .explore-entry-icon{background:var(--soft);color:var(--ink)}html[data-theme]:not([data-theme="mosaic"]) button.link,html[data-theme]:not([data-theme="mosaic"]) .navbtn,html[data-theme]:not([data-theme="mosaic"]) .bottomnav button,html[data-theme]:not([data-theme="mosaic"]) .training-word-tabs .training-word,html[data-theme]:not([data-theme="mosaic"]) .explore-entry,html[data-theme]:not([data-theme="mosaic"]) .learning-sub-open,html[data-theme]:not([data-theme="mosaic"]) .learning-chapter,html[data-theme]:not([data-theme="mosaic"]) .dayheading{background:transparent;color:var(--ink)}html[data-theme]:not([data-theme="mosaic"]) .navbtn.active,html[data-theme]:not([data-theme="mosaic"]) .bottomnav button.active,html[data-theme]:not([data-theme="mosaic"]) .stretch-day.planned,html[data-theme]:not([data-theme="mosaic"]) .stretch-day.selected{background:var(--lime);color:var(--ink)}html[data-theme]:not([data-theme="mosaic"]) input,html[data-theme]:not([data-theme="mosaic"]) select,html[data-theme]:not([data-theme="mosaic"]) textarea{background:var(--input);color:var(--text);border-color:var(--line)}html[data-theme]:not([data-theme="mosaic"]) small,html[data-theme]:not([data-theme="mosaic"]) .muted,html[data-theme]:not([data-theme="mosaic"]) .eyebrow,html[data-theme]:not([data-theme="mosaic"]) .sidefoot,html[data-theme]:not([data-theme="mosaic"]) .gentle-caption,html[data-theme]:not([data-theme="mosaic"]) .wellbeing-legend,html[data-theme]:not([data-theme="mosaic"]) .wellbeing-stats span{color:var(--muted)}html[data-theme]:not([data-theme="mosaic"]) .profile-avatar,html[data-theme]:not([data-theme="mosaic"]) .learning-reflect,html[data-theme]:not([data-theme="mosaic"]) .care-rest,html[data-theme]:not([data-theme="mosaic"]) .explore-groups>.card:nth-child(2) .explore-entry-icon{background:var(--soft-alt);color:var(--ink)}html[data-theme]:not([data-theme="mosaic"]) .profile-intro,html[data-theme]:not([data-theme="mosaic"]) .learning-fact,html[data-theme]:not([data-theme="mosaic"]) .gentle-tile{background:linear-gradient(120deg,var(--surface),var(--soft));color:var(--text)}html[data-theme]:not([data-theme="mosaic"]) .learning-prose p,html[data-theme]:not([data-theme="mosaic"]) .learning-prose h3,html[data-theme]:not([data-theme="mosaic"]) .learning-fact p,html[data-theme]:not([data-theme="mosaic"]) .learning-fact-heading,html[data-theme]:not([data-theme="mosaic"]) .learning-sub-open p,html[data-theme]:not([data-theme="mosaic"]) .learning-category p,html[data-theme]:not([data-theme="mosaic"]) .wellbeing-stats b,html[data-theme]:not([data-theme="mosaic"]) .food-support-item a,html[data-theme]:not([data-theme="mosaic"]) .learning-reader a{color:var(--text)}html[data-theme]:not([data-theme="mosaic"]) .training-word-tabs .training-word.active{border-bottom-color:var(--accent-alt)}html[data-theme]:not([data-theme="mosaic"]) .learning-divider span,html[data-theme]:not([data-theme="mosaic"]) .budget-track{background:var(--line)}html[data-theme]:not([data-theme="mosaic"]) .learning-divider i,html[data-theme]:not([data-theme="mosaic"]) .budget-track span{background:var(--accent)}html[data-theme]:not([data-theme="mosaic"]) .learning-divider i:nth-of-type(2){background:var(--accent-alt)}html[data-theme]:not([data-theme="mosaic"]) .wellbeing-chart svg{fill:var(--muted)}html[data-theme]:not([data-theme="mosaic"]) .wellbeing-chart rect[fill="#8da995"]{fill:var(--chart)}html[data-theme]:not([data-theme="mosaic"]) .wellbeing-chart rect[fill="#b2a1c9"]{fill:var(--chart-alt)}html[data-theme]:not([data-theme="mosaic"]) .wellbeing-chart line[stroke="#e5e8df"]{stroke:var(--line)}html[data-theme]:not([data-theme="mosaic"]) .wellbeing-chart line[stroke="#9577aa"]{stroke:var(--accent-alt)}html[data-theme]:not([data-theme="mosaic"]) .budget-progress{accent-color:var(--accent)}
html:is([data-theme=midnight],[data-theme=twilight]) .card.dark{background:#334d3e;color:#eff7ee}html:is([data-theme=midnight],[data-theme=twilight]) .entry,html:is([data-theme=midnight],[data-theme=twilight]) .activity-summary,html:is([data-theme=midnight],[data-theme=twilight]) .planner-inbox,html:is([data-theme=midnight],[data-theme=twilight]) .hourly-card{background:var(--surface);color:var(--text)}html:is([data-theme=midnight],[data-theme=twilight]) .hourly-track,html:is([data-theme=midnight],[data-theme=twilight]) .hourly-labels{background:var(--surface)}html:is([data-theme=midnight],[data-theme=twilight]) .hourly-slot{background:transparent;border-color:var(--line)}html:is([data-theme=midnight],[data-theme=twilight]) .hourly-block,html:is([data-theme=midnight],[data-theme=twilight]) .hourly-block-body{background:var(--soft);color:var(--text)}html:is([data-theme=midnight],[data-theme=twilight]) .hourly-help,html:is([data-theme=midnight],[data-theme=twilight]) .settings-facts dd{color:var(--text)}
.theme-current{display:flex;gap:16px;align-items:center;margin-top:22px}.theme-current small,.theme-option small{display:block;font-size:12px;font-weight:400;margin-top:5px}.theme-swatches{display:inline-flex;flex-shrink:0;padding:4px}.theme-swatches i{display:block;width:25px;height:25px;border-radius:50%;border:2px solid var(--surface,#fff);margin-left:-5px;box-shadow:0 0 0 1px #00000012}.theme-options{display:grid;gap:10px;margin:22px 0}.theme-option{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:15px;padding:15px;margin:0;cursor:pointer}.theme-option:has(input:checked){border-color:var(--accent-alt);background:var(--soft-alt);box-shadow:0 0 0 1px var(--accent-alt)}.theme-option input{width:17px;height:17px;margin:0;accent-color:var(--accent-strong)}.theme-option .theme-swatches i{width:20px;height:20px}.theme-option>span:last-child{min-width:0}
html[data-theme]:not([data-theme="mosaic"]) .brand.mosaic-brand{color:var(--ink)}html[data-theme]:not([data-theme="mosaic"]) button.danger{background:var(--peach);color:var(--ink)}
/* Paired foregrounds and surfaces preserve the original tonal hierarchy. */
:root[data-theme=terracotta]{--feature-bg:#703d2b;--feature-fg:#fff9ef;--feature-muted:#ecd4be;--feature-track:#99654d;--feature-accent:#e9c697;--feature-chip:#efddc7;--feature-chip-text:#673a2b}
:root[data-theme=coastal]{--feature-bg:#30595d;--feature-fg:#f1ffff;--feature-muted:#c8e1e3;--feature-track:#537f83;--feature-accent:#b8e2db;--feature-chip:#d4eeeb;--feature-chip-text:#30595d}
:root[data-theme=lavender]{--feature-bg:#59466e;--feature-fg:#fff9ff;--feature-muted:#dfd2eb;--feature-track:#7d6893;--feature-accent:#dbcaed;--feature-chip:#eee2f8;--feature-chip-text:#59466e}
:root[data-theme=midnight]{--feature-bg:#d8e7dd;--feature-fg:#203b2b;--feature-muted:#486452;--feature-track:#afc6b6;--feature-accent:#416a50;--feature-chip:#355240;--feature-chip-text:#f0f8f2}
html[data-theme]:not([data-theme="mosaic"]) .card.dark{background:var(--feature-bg);color:var(--feature-fg);border-color:transparent}
html[data-theme]:not([data-theme="mosaic"]) .card.dark :is(h2,h3,b,.big,.macrogrid p,.stats){color:var(--feature-fg)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark :is(small,.muted,.eyebrow){color:var(--feature-muted)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .ringinner{background:var(--feature-bg);color:var(--feature-fg)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .ring{background:conic-gradient(var(--feature-accent) var(--pct),var(--feature-track) 0)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .bar{background:var(--feature-track)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .bar span{background:var(--feature-accent)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .pill{background:var(--feature-chip);color:var(--feature-chip-text)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark button{background:var(--feature-fg);color:var(--feature-bg)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark button.link{background:transparent;color:var(--feature-fg)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark :is(summary,a){color:var(--feature-fg)}
html[data-theme]:not([data-theme="mosaic"]) :is(input,textarea)::placeholder{color:var(--muted);opacity:1}
/* Multiple accent families give each theme the same visual variety as Mosaic. */
:root[data-theme=terracotta]{--tone-sage:#e4e6cf;--tone-sage-text:#515b35;--tone-clay:#f0d6c2;--tone-clay-text:#7b432e;--tone-blue:#dde7e3;--tone-blue-text:#3e625c;--tone-purple:#e9dce1;--tone-purple-text:#6e4e60}
:root[data-theme=coastal]{--tone-sage:#dcebe2;--tone-sage-text:#3e6551;--tone-clay:#f1dfce;--tone-clay-text:#785137;--tone-blue:#d9e9f4;--tone-blue-text:#385d7c;--tone-purple:#e7e1ef;--tone-purple-text:#66537d}
:root[data-theme=lavender]{--tone-sage:#e2e9dc;--tone-sage-text:#4c623f;--tone-clay:#eddbd6;--tone-clay-text:#7c5147;--tone-blue:#dfe8f0;--tone-blue-text:#455f78;--tone-purple:#e7ddf2;--tone-purple-text:#68507f}
:root[data-theme=midnight]{--tone-sage:#344d3d;--tone-sage-text:#c9e2c7;--tone-clay:#583e34;--tone-clay-text:#f0c7af;--tone-blue:#314552;--tone-blue-text:#c1dcec;--tone-purple:#473a55;--tone-purple-text:#e0cbef}
html[data-theme]:not([data-theme="mosaic"]) :is(.care-food,.gentle-steps,.life-body,.learning-next){background:var(--tone-sage);color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.care-move,.life-everyday,.lab-low){background:var(--tone-clay);color:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.care-rest,.life-grow){background:var(--tone-blue);color:var(--tone-blue-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.gentle-sleep,.life-mind,.learning-fact,.learning-reflect){background:var(--tone-purple);color:var(--tone-purple-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.care-note,.gentle-tile,.life-tile,.learning-fact,.learning-reflect,.learning-next) :is(h2,h3,p,small,b,.muted,.eyebrow,.gentle-caption,.learning-fact-heading){color:inherit}
html[data-theme]:not([data-theme="mosaic"]) .care-icon{color:inherit;background:var(--surface)}
html[data-theme]:not([data-theme="mosaic"]) .learning-category:nth-child(4n+1) .learning-icon{background:var(--tone-sage);color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) .learning-category:nth-child(4n+2) .learning-icon{background:var(--tone-purple);color:var(--tone-purple-text)}
html[data-theme]:not([data-theme="mosaic"]) .learning-category:nth-child(4n+3) .learning-icon{background:var(--tone-blue);color:var(--tone-blue-text)}
html[data-theme]:not([data-theme="mosaic"]) .learning-category:nth-child(4n) .learning-icon{background:var(--tone-clay);color:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) .explore-groups>.card:first-child .explore-entry-icon{background:var(--tone-sage);color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) .explore-groups>.card:nth-child(2) .explore-entry-icon{background:var(--tone-purple);color:var(--tone-purple-text)}
html[data-theme]:not([data-theme="mosaic"]) .explore-groups>.card:nth-child(3) .explore-entry-icon{background:var(--tone-clay);color:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) .profile-avatar{background:var(--tone-purple);color:var(--tone-purple-text)}
/* Preserve the default's distinct accent roles in every alternative palette. */
html[data-theme]:not([data-theme="mosaic"]) :is(.routinecard,.exerciseguide,.builderitem,.restcontrols,.cardioestimates,.stretchroutine,.stretchbrowsecard,.stretchbuilderitem,.attachoption,.guidenextpreview,.pr-list,.food-notes span,.more-nutrients,.nutrient-explainer,.food-detail-macros>div,.blood-trend-summary,.nutrition-recommendation,.macro-split-editor [data-macro-total],.today-cycle-brief,.grocery-intro,.life-focus,.hourly-block,.planner-all-day-item,.foodresult){background:var(--tone-sage);color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.life-mind,.period-select-note,.planner-drop-marker,.hourly-block.hourly-workout){background:var(--tone-clay);color:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.life-everyday,.ocr-source){background:var(--tone-blue);color:var(--tone-blue-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.life-grow,.hourly-block.hourly-event){background:var(--tone-purple);color:var(--tone-purple-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.life-welcome,.today-checkin,.life-reflection,.recommended-macros>div,.measurement-toggle,.shared-calendar-day,#plannerrepeatfields){background:var(--soft);color:var(--text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.cardioestimates,.nutrition-recommendation,.blood-trend-summary,.today-cycle-brief,.grocery-intro,.life-focus,.period-select-note,.planner-drop-marker,.food-detail-macros,.foodresult) :is(b,h2,h3,small,p,span,.muted){color:inherit}
html[data-theme]:not([data-theme="mosaic"]) :is(.restdisplay b,.restdisplay span:last-child,.estimatesources,.estimatesources a){color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) .hourly-block .hourly-block-body{background:transparent;color:inherit}
html[data-theme]:not([data-theme="mosaic"]) .hourly-block .hourly-block-body small{color:inherit}
html[data-theme]:not([data-theme="mosaic"]) :is(.calendar-key,.calendar-week-label,.calendar-agenda-item small,.cycle-weekday,.nutrient-row small,.grocery-check small,.life-task-row small,.life-history-row span,.macro-split-head,.explore-groups h3,.learning-sub-open small){color:var(--muted)}
html[data-theme]:not([data-theme="mosaic"]) .calendar-strength{background:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.calendar-cardio,.calendar-goal,.calendar-period){background:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) .calendar-stretch{background:var(--tone-purple-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.calendar-task,.calendar-event){background:var(--tone-blue-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.shared-calendar-day.has-period,.daycell.bleed,.daycell.predict){background:var(--tone-clay);color:var(--tone-clay-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.shared-calendar-day.selected,.planner-weekdays input:checked+span,.tabs button.active){background:var(--ink);color:var(--button-text)}
html[data-theme]:not([data-theme="mosaic"]) .planner-weekdays span{background:var(--soft);color:var(--text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.weekday,.stretch-day,.tabs button,.waterbtns button){background:var(--tone-sage);color:var(--tone-sage-text)}
html[data-theme]:not([data-theme="mosaic"]) :is(.weekday.active,.stretch-day.selected,.stretch-day.planned,.set-complete,.session-rest:not(:empty)){background:var(--lime);color:var(--ink);border-color:var(--accent)}
html[data-theme]:not([data-theme="mosaic"]) .card.dark .home-drag-handle{color:var(--feature-muted)}
html[data-theme]:not([data-theme="mosaic"]) .chart .column{background:var(--chart)}
/* Drag affordances are dots only; preserve contrast on each host surface. */
html body button:is(.home-drag-handle,.planner-task-grip),
html[data-theme] body button:is(.home-drag-handle,.planner-task-grip){background:transparent;color:var(--ink);border:0;box-shadow:none}
html body .card.dark button.home-drag-handle,
html[data-theme] body .card.dark button.home-drag-handle{background:transparent;color:var(--feature-fg,#ffffff);border:0;box-shadow:none}
html body .hourly-block button.planner-task-grip,
html[data-theme] body .hourly-block button.planner-task-grip{background:transparent;color:inherit}
html body button:is(.home-drag-handle,.planner-task-grip):hover,
html[data-theme] body button:is(.home-drag-handle,.planner-task-grip):hover{background:transparent;filter:none}
/* A quiet water garden, coloured by the chosen theme. */
html body .card.water-garden{background:linear-gradient(135deg,var(--surface,#ffffff),var(--tone-blue,#eaf0f4));border-color:var(--line);color:var(--ink)}
.water-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.water-heading .eyebrow{font-size:9px;letter-spacing:1.4px;line-height:1.6}.water-percent{border:1px solid var(--line);border-radius:50%;min-width:45px;height:45px;display:grid;place-items:center;font-size:12px;font-weight:650;background:var(--surface,#ffffff)}.water-moment{display:flex;gap:20px;align-items:center;margin:20px 0}.water-drop{width:95px;flex:0 0 95px;color:var(--tone-blue-text,#466779)}.water-drop svg{display:block;width:100%;height:auto}.water-drop-shell{fill:var(--surface,#ffffff);stroke:var(--tone-blue-text,#466779);stroke-width:1.5;stroke-opacity:.35}.water-drop-fill{fill:var(--tone-blue-text,#466779);opacity:.45}.water-tally{min-width:0}.water-tally .waterbig{margin:0;font-size:34px;line-height:1.25}.water-tally .waterbig span{font-size:18px;font-weight:500}.water-tally p{font-size:13px;color:var(--muted);margin:5px 0 12px}.water-message{display:block;font-size:12px;color:var(--ink);line-height:1.6}.water-progress{height:8px;border-radius:20px;background:var(--surface,#ffffff);overflow:hidden}.water-progress>span{display:block;height:100%;border-radius:inherit;background:var(--tone-blue-text,#466779)}
html body .water-garden .waterbtns{gap:8px;margin-top:20px;align-items:center}
html body .water-garden .waterbtns button{min-height:42px;border-radius:24px;padding:10px 13px;background:var(--surface,#ffffff);color:var(--ink);border:1px solid var(--line);font-size:12px}
html body .water-garden .waterbtns button.link{background:transparent;border-color:transparent;padding-inline:8px}
@media(max-width:360px){.water-moment{gap:12px}.water-drop{width:76px;flex-basis:76px}.water-tally .waterbig{font-size:30px}.water-garden .waterbtns{gap:6px}}
.savings-section>.row{flex-wrap:wrap}.savings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:22px 0}.savings-goal{padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--soft,#edf1e7);min-width:0}.savings-goal:nth-child(even){background:var(--soft-alt,#eee9f2)}.savings-symbol{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;background:var(--surface,#fff);color:var(--ink)}.savings-symbol svg{width:24px;height:24px}.savings-goal h3{margin:18px 0;overflow-wrap:anywhere}.savings-amount{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline}.savings-amount b{font-size:23px}.savings-amount small{font-size:12px}.savings-goal progress{display:block;width:100%;height:9px;margin:15px 0;accent-color:var(--accent-strong,#51694f)}.savings-goal p{font-size:12px;line-height:1.7}.savings-goal .actions{gap:6px}.savings-goal button{font-size:12px}.savings-empty{padding:28px 16px;text-align:center;background:var(--soft,#edf1e7);border-radius:18px;line-height:1.9}.savings-note{font-size:11px;margin:16px 0 0}@media(max-width:620px){.savings-grid{grid-template-columns:1fr}.savings-goal{padding:20px}}

:root[data-theme=twilight]{color-scheme:dark;--bg:#231e2c;--surface:#302838;--soft:#41364b;--soft-alt:#3b3a50;--line:#65576f;--ink:#e2ccec;--text:#f0e8f4;--muted:#c6b6ce;--lime:#51405f;--peach:#65453f;--purple:#493f60;--accent:#c3a3d8;--accent-strong:#ddc1ed;--accent-alt:#d8ad95;--button-text:#2b2034;--sidebar:#292230;--input:#392f43;--chart:#c1a3d9;--chart-alt:#dbb298}
:root[data-theme=twilight]{--feature-bg:#e5d7eb;--feature-fg:#3d294b;--feature-muted:#644d70;--feature-track:#bfaacb;--feature-accent:#74548c;--feature-chip:#563e68;--feature-chip-text:#f5eafa}
:root[data-theme=twilight]{--tone-sage:#39453e;--tone-sage-text:#d1e4cf;--tone-clay:#594039;--tone-clay-text:#f4ccb8;--tone-blue:#354253;--tone-blue-text:#c8def5;--tone-purple:#4b3b5d;--tone-purple-text:#ead2fb}
/* Menstruation markers must remain visible over generic theme button styles. */
html body button.cycle-date,
html[data-theme] body button.cycle-date{background:var(--surface,#ffffff);color:var(--ink)}
html body button.cycle-date.menstruation,
html[data-theme] body button.cycle-date.menstruation,
html body button.shared-calendar-day.has-period,
html[data-theme] body button.shared-calendar-day.has-period{background:var(--tone-clay,#f7e1dc);color:var(--tone-clay-text,#854b3c)}
html body button.cycle-date small,
html[data-theme] body button.cycle-date small{color:inherit;opacity:.85}
html body button.cycle-date.logged{border-bottom:4px solid var(--tone-clay-text,#854b3c)}
html body button:is(.cycle-date,.shared-calendar-day).period-estimated{border:2px dashed var(--tone-clay-text,#ad6c5b)}
html body button:is(.cycle-date,.shared-calendar-day).selected{outline:2px solid var(--ink);outline-offset:2px}
html body button.cycle-date.is-today{box-shadow:inset 0 0 0 1px var(--ink)}
html body button.cycle-date.period-picked{background:var(--ink)!important;color:var(--button-text,#ffffff);border:2px solid var(--ink);box-shadow:0 0 0 2px var(--line)}
html body button.cycle-date.period-picked small{color:inherit}