/* Theme overrides change colors only, retaining existing component dimensions. */
html[data-theme]:not([data-theme=original]),html[data-theme]:not([data-theme=original]) body,html[data-theme]:not([data-theme=original]) .phone,html[data-theme]:not([data-theme=original]) .phone .nav,html[data-theme]:not([data-theme=original]) .center{background:var(--theme-bg)!important}
html[data-theme]:not([data-theme=original]) :is(.budget,.budget-overview,.balance,.total,.settings-hero){background:var(--theme-card)!important;color:#34312D!important}
html[data-theme]:not([data-theme=original]) :is(.settings-list,.settings-group,.settings-back,.settings-top,.top-settings,.calendar-review,.detail-view-toggle,.calendar-toolbar #calendar-today,.keypad button,.theme-panel,.category,.setting,.goal-card){background:var(--theme-surface)!important}
html[data-theme]:not([data-theme=original]) :is(.primary,.save,.fixed-add,.nav-create .nav-icon,.detail-view-toggle button[aria-pressed=true],.calendar-day[aria-pressed=true],.filter button.active){background:var(--theme-accent)!important;color:var(--theme-on-accent)!important}
html[data-theme]:not([data-theme=original]) .phone .app-nav .is-current{color:var(--theme-accent)!important}
html[data-theme]:not([data-theme=original]) .phone .app-nav .nav-create .nav-icon{background:var(--theme-accent)!important;color:var(--theme-on-accent)!important}
html[data-theme]:not([data-theme=original]) :is(.nav-item:active,.nav-item.is-pressed,.is-current:not(.nav-create) .nav-icon){background:var(--theme-surface)!important}
html[data-theme]:not([data-theme=original]) :is(.track span,.budget-track span){background:var(--theme-accent)!important}
html[data-theme]:not([data-theme=original]) :is(.settings-top,.top-settings,.calendar-toolbar button,.calendar-all,.history-link,.review-icon,.calendar-selection>span){color:var(--theme-accent)!important}
html[data-theme]:not([data-theme=original]) .category[aria-pressed=true]{border-color:var(--theme-accent)!important}
html[data-theme]:not([data-theme=original]) .calendar-day[aria-pressed=true] small{color:var(--theme-on-accent)!important}
.theme-panel{background:#F2EEE7;border-radius:18px;padding:16px}.theme-description{font-size:12px;color:#81786D;line-height:1.7;margin:0 0 12px}.theme-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.theme-preset{display:flex;align-items:center;gap:8px;padding:12px 8px;background:#FAF7F0;border:1px solid transparent;border-radius:12px;color:#34312D;font-size:12px}.theme-preset[aria-pressed=true]{border-color:var(--theme-accent,#76624F)}.theme-dot{width:24px;height:24px;border-radius:50%;border:2px solid;flex-shrink:0}.theme-custom{display:flex;justify-content:space-between;gap:10px;margin:18px 0}.theme-custom label{font-size:12px;color:#81786D;display:flex;align-items:center;gap:8px}.theme-custom input{width:36px;height:36px;padding:2px;border:1px solid #E6DFD5;border-radius:8px;background:none}.theme-panel #theme-status{margin-bottom:0}

html[data-theme]:not([data-theme=original]) a[aria-label="設定"] circle{fill:var(--theme-surface)!important}

/* Coordinated rose milk surfaces, category accents and secondary actions. */
html[data-theme=rose] body{color:#493940!important}
html[data-theme=rose] :is(.category-budget,.goal,.goal-card,.fixed-card,.card){background:color-mix(in srgb,var(--theme-card) 50%,var(--theme-bg))!important}
html[data-theme=rose] .category-budget:nth-child(6n+1){background:#F2DBD1!important}
html[data-theme=rose] .category-budget:nth-child(6n+2){background:#EED2DC!important}
html[data-theme=rose] .category-budget:nth-child(6n+3){background:#E5DAEC!important}
html[data-theme=rose] .category-budget:nth-child(6n+4){background:#EFE0DC!important}
html[data-theme=rose] .category-budget:nth-child(6n+5){background:#E2E5EE!important}
html[data-theme=rose] .category-budget:nth-child(6n+6){background:#F1E5E7!important}
html[data-theme=rose] :is(.filter button,.quiet,.cancel,.actions button:not([type=submit]),.fixed-actions button,.add,.settings-symbol,.goal-icon-option,.allocation .category-icon,.tx .icon,.review-icon){background:var(--theme-surface)!important;color:#875D70!important;border-color:#DBC2CC!important}
html[data-theme=rose] :is(.category[aria-pressed=true],.goal-icon-option[aria-pressed=true]){background:var(--theme-card)!important;border-color:var(--theme-accent)!important}
html[data-theme=rose] .filter button.active{background:var(--theme-accent)!important;color:var(--theme-on-accent)!important}
html[data-theme=rose] :is(.muted,.note,.eyebrow,.label,.overview-label,.overview-footer,.settings-label,.settings-copy small,.percent,.budget-meta,.fixed-meta){color:#8A737C!important}
html[data-theme=rose] :is(.track,.budget-track){background:#EADCE2!important}
html[data-theme=rose] :is(input,select,textarea,dialog){background:var(--theme-bg)!important;border-color:#E5D5DC!important;color:#493940}
html[data-theme=rose] :is(.phone .nav,.tx,.allocation,.field,.fields,.settings-item,.calendar-selection){border-color:#EADBE1!important}
html[data-theme=rose] :is(.danger,.danger-button,.delete){color:#A65F72!important;background:#F6E6EB!important}
html[data-theme=rose] .phone .app-nav .nav-item:active{color:var(--theme-accent)!important}
.theme-presets{grid-template-columns:1fr}

/* Livelier coordinated category palette, shared by charts and category rows. */
html[data-theme=rose] .category-budget:nth-child(6n+1){background:#F8D9E4!important}
html[data-theme=rose] .category-budget:nth-child(6n+2){background:#FBE0D5!important}
html[data-theme=rose] .category-budget:nth-child(6n+3){background:#F6D1E0!important}
html[data-theme=rose] .category-budget:nth-child(6n+4){background:#E8DDF7!important}
html[data-theme=rose] .category-budget:nth-child(6n+5){background:#E0E7FA!important}
html[data-theme=rose] .category-budget:nth-child(6n+6){background:#F6E7D3!important}
html[data-theme=rose] .allocation{background:color-mix(in srgb,var(--category-color) 28%,var(--theme-bg))!important;border-color:color-mix(in srgb,var(--category-color) 35%,var(--theme-bg))!important}
html[data-theme=rose] .allocation .category-icon{background:color-mix(in srgb,var(--category-color) 45%,var(--theme-bg))!important;color:#795368!important;display:grid;place-items:center;border-radius:10px;height:30px}
.allocation .category-icon svg{width:22px;height:22px;display:block}
html[data-theme=rose] .allocation .budget-track span{background:var(--category-color)!important}
html[data-theme=rose] .allocation .budget-track{background:color-mix(in srgb,var(--category-color) 16%,var(--theme-bg))!important}
html[data-theme=rose] .source-dot{box-shadow:0 0 0 3px #FFF1F6}
html[data-theme=rose] .income-center{background:var(--theme-bg)!important;color:#493940}

/* Category color options wrap on small screens and match saved category cards. */
.colors{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px!important;padding:8px 0}
.colors .swatch{width:32px;height:32px;margin:auto;min-height:32px;touch-action:manipulation}
html[data-theme=rose] .colors .swatch[aria-pressed=true]{border-color:var(--theme-accent)!important;box-shadow:0 0 0 2px var(--theme-bg)}
html[data-theme=rose] .phone .card[style*="--color"]{background:color-mix(in srgb,var(--color) 28%,var(--theme-bg))!important}

html[data-theme=rose] .category-budget:nth-child(6n+6){background:#DDEFE7!important}

/* Theme swatches retain their own prepared colors, independent of selection. */
.theme-presets{display:flex!important;gap:14px;align-items:center}
.theme-preset{width:64px;height:64px;justify-content:center;padding:8px;border-radius:16px;border:2px solid transparent}
.theme-preset .theme-dot{width:36px;height:36px;border-width:3px}
.theme-preset[aria-pressed=true]{border-color:var(--theme-accent,#76624F);box-shadow:0 0 0 2px var(--theme-bg,#FAF7F0)}

html[data-theme=rose] .category-budget:nth-child(6n+6){background:#F7E1D3!important}

/* Explicit original category surfaces prevent rose colors leaking across themes. */
html[data-theme=original] .category-budget:nth-child(6n+1){background:#F1D8BD!important}
html[data-theme=original] .category-budget:nth-child(6n+2){background:#EAD1D6!important}
html[data-theme=original] .category-budget:nth-child(6n+3){background:#DED6E9!important}
html[data-theme=original] .category-budget:nth-child(6n+4){background:#DCD0BA!important}
html[data-theme=original] .category-budget:nth-child(6n+5){background:#D5E7F1!important}
html[data-theme=original] .category-budget:nth-child(6n+6){background:#EDE8DF!important}
html[data-theme=original] .allocation{background:color-mix(in srgb,var(--category-color) 30%,#FAF7F0)!important}
html[data-theme=original] .allocation .budget-track span{background:var(--category-color)!important}
html[data-theme=original] .phone .card[style*="--color"]{background:color-mix(in srgb,var(--color) 25%,#FAF7F0)!important}
html[data-theme=original] .allocation .category-icon{background:transparent!important;color:#76624F!important}

/* Both themes share one settings icon and surface treatment. */
html[data-theme] .settings-page{background:var(--theme-bg)!important;color:#34312D}
html[data-theme] .settings-page .settings-list,html[data-theme] .settings-page .theme-panel{background:var(--theme-surface)!important}
html[data-theme] .settings-page .settings-hero{background:var(--theme-card)!important}
html[data-theme] .settings-page .settings-symbol,html[data-theme] .settings-page .settings-item:nth-child(2) .settings-symbol,html[data-theme] .settings-page .settings-item:nth-child(3) .settings-symbol{background:var(--theme-card)!important;color:var(--theme-accent)!important;width:38px;height:38px;border-radius:12px;display:grid;place-items:center}
html[data-theme] .settings-page .settings-symbol svg{display:block;width:22px;height:22px}
html[data-theme] .settings-page .settings-back{background:var(--theme-surface)!important;color:var(--theme-accent)!important}
html[data-theme] .settings-page .settings-item{border-color:color-mix(in srgb,var(--theme-accent) 15%,var(--theme-bg))!important}
html[data-theme] .settings-page .settings-label,html[data-theme] .settings-page .settings-copy small,html[data-theme] .settings-page .settings-arrow{color:color-mix(in srgb,var(--theme-accent) 70%,#81786D)!important}

/* A deeper rose frame separates settings icons from their pale cards. */
html[data-theme=rose] .settings-page .settings-symbol,
html[data-theme=rose] .settings-page .settings-item:nth-child(2) .settings-symbol,
html[data-theme=rose] .settings-page .settings-item:nth-child(3) .settings-symbol{background:#DDA7BB!important;color:#713D53!important;box-shadow:inset 0 0 0 1px #CF91A9}

/* Solid icon tiles, matching the milk-tea theme's treatment. */
html[data-theme=rose] .settings-page .settings-symbol,
html[data-theme=rose] .settings-page .settings-item:nth-child(2) .settings-symbol,
html[data-theme=rose] .settings-page .settings-item:nth-child(3) .settings-symbol{background:#DDA7BB!important;color:#713D53!important;box-shadow:none!important;border:0!important}

/* Override the general rose surface rule with the specific settings tile. */
html[data-theme=rose] body.settings-page .phone .settings-list .settings-item .settings-symbol{background:#DDA7BB!important;background-color:#DDA7BB!important;color:#713D53!important;box-shadow:none!important;border:0!important}

html[data-theme=rose] .phone header .entry-notebook{color:var(--theme-accent)!important}

/* Selected entry category retains its own color within either theme. */
html[data-theme] .phone #categories .category[aria-pressed=true]{background:color-mix(in srgb,var(--category-color) 42%,var(--theme-bg))!important;border-color:var(--category-color)!important;color:#493940!important}
html[data-theme] .phone #categories .category[aria-pressed=false]{background:var(--theme-surface)!important;border-color:transparent!important}

html[data-theme=rose] .category-icon-choice{background:var(--theme-surface);color:var(--theme-accent)}html[data-theme=rose] .category-icon-choice[aria-pressed=true]{border-color:var(--theme-accent);background:var(--theme-card)}html[data-theme=rose] .category-preview-icon{background:color-mix(in srgb,var(--color) 40%,var(--theme-bg));color:var(--theme-accent)}

html[data-theme=rose] .phone>header .entry-settings{background:var(--theme-surface)!important;color:var(--theme-accent)!important}
html[data-theme=rose] .phone>header .entry-settings circle{fill:var(--theme-surface)!important}

html[data-theme=rose] #entry .amount{background:#F9EAF0;border-color:#DDA7BB}
html[data-theme=rose] #entry .amount:focus-within{border-color:var(--theme-accent);box-shadow:0 0 0 3px #975B7212}
html[data-theme=rose] #entry .amount>span{color:var(--theme-accent)}
html[data-theme=rose] #entry .amount input::placeholder{color:#B38B9B}

/* Income selector follows the active theme. */
html[data-theme] .income-select-arrow{background:var(--theme-surface,#EDE7DD)!important;color:var(--theme-accent,#76624F)!important}
html[data-theme] .income-select-wrap #income-source,html[data-theme] #other-income-name{background:var(--theme-bg,#FFFCF7)!important;border-color:var(--theme-card,#E3DCD0)!important}

/* Savings goal cards: balanced surfaces for each palette. */
html[data-theme=original]{--goal-surface:#F0E8DB;--goal-icon-surface:#DCD0BA;--goal-ink:#76624F;--goal-line:#C9B99F;--goal-track:#FFF9F0}
html[data-theme=rose]{--goal-surface:#F8E7ED;--goal-icon-surface:#EBC4D2;--goal-ink:#975B72;--goal-line:#DDB3C3;--goal-track:#FFF9FA}
html[data-theme] #goals .savings-goal-card{background:var(--goal-surface)!important;color:#34312D}
html[data-theme] #goals .goal-symbol{background:var(--goal-icon-surface)!important;color:var(--goal-ink)!important}
html[data-theme] #goals .goal-amount small,html[data-theme] #goals .goal-monthly{color:var(--goal-ink)!important}
html[data-theme] #goals .goal-monthly{border-color:var(--goal-line)!important}
html[data-theme] #goals .track{background:var(--goal-track)!important}
html[data-theme] #goals .track span,html[data-theme] #goals .goal-deposit{background:var(--goal-ink)!important}
html[data-theme] #goals .goal-deposit{color:white!important}
html[data-theme] #goals .small-button{background:var(--goal-icon-surface)!important;color:var(--goal-ink)!important}

/* Preserve each savings goal's chosen color within the active theme. */
html[data-theme] #goals .savings-goal-card{background:color-mix(in srgb,var(--color,#DED6E9) 65%,var(--theme-bg,#FAF7F0))!important}
html[data-theme] #goals .goal-symbol{background:color-mix(in srgb,var(--color,#DED6E9) 85%,var(--theme-bg,#FAF7F0))!important;color:#514651!important}
html[data-theme] #goals .track span{background:var(--goal-accent,#B4A5CE)!important}
html[data-theme] #goals .goal-monthly{border-color:var(--goal-accent,#B4A5CE)!important}
html[data-theme] #goals .small-button{background:color-mix(in srgb,var(--color,#DED6E9) 80%,var(--theme-bg,#FAF7F0))!important;color:var(--theme-accent,#76624F)!important}

/* Goal palettes are coordinated separately for each theme. */
html[data-theme=original] [data-goal-palette="0"]{--goal-base:#F3E5D4;--goal-tile:#E6C7A5;--goal-bar:#B8885B}
html[data-theme=original] [data-goal-palette="1"]{--goal-base:#F0E1DF;--goal-tile:#DDBAB5;--goal-bar:#B17D78}
html[data-theme=original] [data-goal-palette="2"]{--goal-base:#EAE4EF;--goal-tile:#CDC0DA;--goal-bar:#9783AD}
html[data-theme=original] [data-goal-palette="3"]{--goal-base:#E4EBEF;--goal-tile:#BFCFD9;--goal-bar:#829FAF}
html[data-theme=original] [data-goal-palette="4"]{--goal-base:#EEE7DA;--goal-tile:#D8C9B1;--goal-bar:#A59173}
html[data-theme=rose] [data-goal-palette="0"]{--goal-base:#FBE9E3;--goal-tile:#F0C4B6;--goal-bar:#D59887}
html[data-theme=rose] [data-goal-palette="1"]{--goal-base:#F9E5ED;--goal-tile:#EBBBD0;--goal-bar:#BF829B}
html[data-theme=rose] [data-goal-palette="2"]{--goal-base:#EFE7F8;--goal-tile:#D8C2ED;--goal-bar:#AA8ACB}
html[data-theme=rose] [data-goal-palette="3"]{--goal-base:#EBECFA;--goal-tile:#C9CEED;--goal-bar:#929FD0}
html[data-theme=rose] [data-goal-palette="4"]{--goal-base:#F8EEDC;--goal-tile:#EBD6AF;--goal-bar:#C4A372}
html[data-theme] #goals .savings-goal-card{background:var(--goal-base,var(--theme-surface))!important}
html[data-theme] #goals .goal-symbol,html[data-theme] #goals .small-button{background:var(--goal-tile,var(--theme-card))!important;color:var(--theme-accent)!important}
html[data-theme] #goals .track span{background:var(--goal-bar,var(--theme-accent))!important}
html[data-theme] #goals .goal-monthly{border-color:color-mix(in srgb,var(--goal-bar,var(--theme-accent)) 55%,transparent)!important}

/* All goal card actions share the same filled theme treatment. */
html[data-theme] #goals .savings-goal-card :is(.small-button,.goal-deposit,.danger){background:var(--theme-accent,#76624F)!important;color:#fff!important;border:0!important;border-radius:12px;padding:10px 13px;font-size:12px;line-height:1.4;min-height:38px}
html[data-theme] #goals .savings-goal-card :is(.small-button,.goal-deposit,.danger):active{filter:brightness(.93)}

/* Budget adjustments and feedback follow the rose palette. */
html[data-theme=rose] .adjust{background:var(--theme-surface)!important;color:var(--theme-accent)!important;border-color:var(--theme-card)!important}
html[data-theme=rose] .adjust:hover{background:var(--theme-card)!important}
html[data-theme=rose] .badge{background:var(--theme-surface)!important;color:var(--theme-accent)!important}
html[data-theme=rose] :is(.allocation-message,.fixed-status,.chart-label,.status){color:var(--theme-accent)!important}
html[data-theme=rose] :is(.adjust:focus-visible,.ratio input:focus-visible){outline-color:var(--theme-accent)!important}
html[data-theme=rose] :is(.ratio input,#total){border-color:var(--theme-card)!important;color:var(--theme-accent)!important}
html[data-theme=rose] :is(.back,a[aria-label="設定"]){color:var(--theme-accent)!important}

/* Monthly savings: option C */
.money-summary.savings-summary{padding:0;background:var(--theme-bg,#FAF7F0)!important;border:1px solid var(--theme-card,#DCD0BA);border-radius:23px;overflow:hidden}
.money-summary.savings-summary>.savings-summary-main{padding:19px 22px;background:var(--theme-surface,#EDE7DD)!important;border:0}
.money-summary .savings-summary-main strong{font-size:28px;font-weight:500;font-variant-numeric:tabular-nums}
.money-summary.savings-summary>.savings-summary-details{display:flex;flex-direction:column;gap:11px;padding:17px 22px;margin:0;border:0;background:transparent}
.money-summary .savings-summary-details>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0;border:0;background:transparent}
.money-summary .savings-summary-details span{font-size:12px;margin:0;color:var(--theme-accent,#76624F);line-height:1.5}
.money-summary .savings-summary-details strong{font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:350px){.money-summary .savings-summary-main strong{font-size:24px}.money-summary.savings-summary>.savings-summary-main,.money-summary.savings-summary>.savings-summary-details{padding-left:17px;padding-right:17px}}

.money-summary.savings-summary>.savings-summary-main[hidden]{display:none!important}

.settings-page .settings-login-button{display:flex;align-items:center;justify-content:center;gap:15px;margin:28px 0 0;padding:16px;border-radius:15px;background:var(--theme-accent,#76624F)!important;color:var(--theme-on-accent,#fff)!important;text-decoration:none;font-size:15px;font-weight:500}.settings-login-button:active{transform:scale(.98)}

.settings-page button.settings-login-button{width:100%;border:0;font-family:inherit;cursor:pointer}

.money-summary .savings-summary-details>div[hidden]{display:none!important}