/* Klarkorb: seven selectable, persistent color palettes. */
html[data-palette="sage"] {
  --palette-bg:#e8eeeb;--palette-surface:#f1f5f3;--palette-soft:#bcc9c5;--palette-soft2:#b1c0bc;
  --palette-swatch:#9db0ac;--palette-border:#9db0ac;--palette-muted:#5d7975;
  --palette-primary:#3e5d58;--palette-dark:#18332f;--palette-ink:#18332f;--palette-nav:#d4e0dc;
}
html[data-palette="slate"] {
  --palette-bg:#e9eef0;--palette-surface:#f4f7f8;--palette-soft:#d9e1e2;--palette-soft2:#a4bcc2;
  --palette-swatch:#98a4ae;--palette-border:#98a4ae;--palette-muted:#768692;
  --palette-primary:#425563;--palette-dark:#253746;--palette-ink:#131e29;--palette-nav:#d9e1e2;
}
html[data-palette="rose"] {
  --palette-bg:#f5e9e9;--palette-surface:#fbf3f3;--palette-soft:#e9c4c7;--palette-soft2:#e5bac1;
  --palette-swatch:#daa5ad;--palette-border:#daa5ad;--palette-muted:#926369;
  --palette-primary:#7a3e3a;--palette-dark:#512f2e;--palette-ink:#512f2e;--palette-nav:#f0d9da;
}
html[data-palette="crimson"] {
  --palette-bg:#f8eff1;--palette-surface:#fff7f8;--palette-soft:#ecc7cd;--palette-soft2:#e89cae;
  --palette-swatch:#df4661;--palette-border:#dca4ae;--palette-muted:#9d2235;
  --palette-primary:#ba0c2f;--palette-dark:#862633;--palette-ink:#862633;--palette-nav:#f1d8de;
}
html[data-palette="mauve"] {
  --palette-bg:#f1eaee;--palette-surface:#faf5f7;--palette-soft:#dbcdd3;--palette-soft2:#d0bec7;
  --palette-swatch:#af95a6;--palette-border:#c6b0bc;--palette-muted:#86647a;
  --palette-primary:#66435a;--palette-dark:#4a3041;--palette-ink:#4a3041;--palette-nav:#e7dce3;
}
html[data-palette="olive"] {
  --palette-bg:#f1f0df;--palette-surface:#faf9ed;--palette-soft:#e5e0a8;--palette-soft2:#d9d176;
  --palette-swatch:#bbb323;--palette-border:#b4a91f;--palette-muted:#716135;
  --palette-primary:#635939;--palette-dark:#4e4934;--palette-ink:#4e4934;--palette-nav:#e8e4bc;
}
html[data-palette="taupe"] {
  --palette-bg:#f0ede8;--palette-surface:#faf8f5;--palette-soft:#d6d2c4;--palette-soft2:#c5b9ac;
  --palette-swatch:#b7a99a;--palette-border:#a39382;--palette-muted:#7a6855;
  --palette-primary:#63513d;--palette-dark:#473729;--palette-ink:#473729;--palette-nav:#e5ddd1;
}
html[data-palette] {
  --bg:var(--palette-bg);
  --mint:var(--palette-soft);
  --line:var(--palette-border);
  --green:var(--palette-primary);
  --green2:var(--palette-primary);
  --ink:var(--palette-ink);
  --muted:var(--palette-muted);
  color:var(--palette-ink);
  background:var(--palette-bg);
}
html[data-palette] .stage {background:var(--palette-bg);}
html[data-palette] .phone {border-color:var(--palette-dark);}
html[data-palette] .app-header,
html[data-palette] .phone {background:var(--palette-bg);}
html[data-palette] .bottom-nav {background:var(--palette-nav);border-top-color:var(--palette-border);}
html[data-palette] .nav-item {color:var(--palette-muted);}
html[data-palette] .nav-item.active {color:var(--palette-primary);}
html[data-palette] .nav-item.active:before {background:var(--palette-primary);}
html[data-palette] .nav-bubble {background:var(--palette-soft);color:var(--palette-primary);}
html[data-palette] .brand-icon,
html[data-palette] .stage-mark-icon,
html[data-palette] .primary-btn {background:var(--palette-primary);color:#fff;}
html[data-palette] .stage-mark,
html[data-palette] .stage-copy h1 em {color:var(--palette-primary);}
html[data-palette] .stage-copy>p:not(.eyebrow),
html[data-palette] .eyebrow {color:var(--palette-muted);}
html[data-palette] .period-switch {background:var(--palette-soft2);border-color:var(--palette-border);}
html[data-palette] .period-switch button {color:var(--palette-ink);}
html[data-palette] .period-switch button.active {color:var(--palette-primary);background:var(--palette-surface);}
html[data-palette] .home-cost-card {background:linear-gradient(126deg,var(--palette-dark),var(--palette-primary));}
html[data-palette] .home-cost-top {color:#fff;}
html[data-palette] .home-budget-metric {background:var(--palette-soft2);border-color:var(--palette-border);color:var(--palette-ink);}
html[data-palette] .home-budget-metric .metric-label {color:var(--palette-primary);}
html[data-palette] .home-budget-left {background:var(--palette-soft);}
html[data-palette] .home-budget-left strong {color:var(--palette-primary);}
html[data-palette] .home-budget-left.over {background:#f7eae1;border-color:#edccbb;}
html[data-palette] .home-budget-left.over strong,
html[data-palette] .home-budget-left.over .metric-label {color:#ac5948;}
html[data-palette] .home-spent-tile,
html[data-palette] .home-savings-row,
html[data-palette] .home-idle-note {background:var(--palette-soft);border-color:var(--palette-border);color:var(--palette-primary);}
html[data-palette] .home-spent-icon,
html[data-palette] .home-savings-icon {background:var(--palette-soft2);color:var(--palette-primary);}
html[data-palette] .home-spent-details>span,
html[data-palette] .home-savings-copy small {color:var(--palette-muted);}
html[data-palette] .home-spent-details strong {color:var(--palette-primary);}
html[data-palette] .list-compact-stats>div,
html[data-palette] .list-compact-stats>button {background:var(--palette-soft2);border-color:var(--palette-border);color:var(--palette-ink);}
html[data-palette] .list-compact-stats>button:not(.over) {background:var(--palette-soft);}
html[data-palette] .list-compact-stats span,
html[data-palette] .list-count {color:var(--palette-muted);}
html[data-palette] .list-compact-stats>button.over {background:#f5e6dd;border-color:#e7c8b9;}
html[data-palette] .list-entry {background:var(--palette-soft2);border-color:var(--palette-border);}
html[data-palette] .list-entry>label {color:var(--palette-primary);}
html[data-palette] .list-search-box {background:var(--palette-surface);border-color:var(--palette-border);color:var(--palette-primary);}
html[data-palette] .list-search-box:focus-within {border-color:var(--palette-primary);box-shadow:0 0 0 3px var(--palette-soft);}
html[data-palette] .list-search-box input::placeholder {color:var(--palette-muted);}
html[data-palette] .view-switch {background:var(--palette-soft2);border-color:var(--palette-border);}
html[data-palette] .view-switch-btn.active {background:var(--palette-surface);color:var(--palette-primary);}
html[data-palette] .quick-panel {background:var(--palette-surface);border-color:var(--palette-border);}
html[data-palette] .quick-panel-head,
html[data-palette] .quick-result-name small {color:var(--palette-muted);}
html[data-palette] .quick-result {border-bottom-color:var(--palette-border);color:var(--palette-ink);}
html[data-palette] .quick-result:active,
html[data-palette] .quick-result-emoji,
html[data-palette] .quick-create {background:var(--palette-soft);}
html[data-palette] .quick-result-price,
html[data-palette] .quick-result>svg,
html[data-palette] .quick-create {color:var(--palette-primary);}
html[data-palette] .list-rows>.tip-card:nth-child(odd),
html[data-palette] .tile-grid>.item-tile:nth-child(odd) {background:var(--palette-soft);}
html[data-palette] .list-rows>.tip-card:nth-child(even),
html[data-palette] .tile-grid>.item-tile:nth-child(even) {background:var(--palette-soft2);}
html[data-palette] .tip-card,
html[data-palette] .tile-grid>.item-tile {border-color:var(--palette-border);}
html[data-palette] .tip-card {background:var(--palette-soft);}
html[data-palette] .tip-card .product-emoji,
html[data-palette] .tile-quantity {background:var(--palette-swatch);color:var(--palette-dark);}
html[data-palette] .tip-card .product-text,
html[data-palette] .tip-card .product-name,
html[data-palette] .tile-name {color:var(--palette-ink);}
html[data-palette] .tip-card .product-meta,
html[data-palette] .tip-card .product-price-note {color:var(--palette-muted);}
html[data-palette] .tip-card .product-price,
html[data-palette] .tile-price {color:var(--palette-primary);}
html[data-palette] .tip-card .check {background:var(--palette-surface);border-color:var(--palette-primary);}
html[data-palette] .tip-card .check.checked {background:var(--palette-primary);color:#fff;}
html[data-palette] .tile-check svg {background:var(--palette-surface);border-color:var(--palette-border);}
html[data-palette] .tile-check.checked svg {background:var(--palette-primary);color:#fff;}
html[data-palette] .tile-grid>.item-tile.is-checked {background:var(--palette-swatch);}
html[data-palette] .mini-add,
html[data-palette] .secondary-btn,
html[data-palette] .ghost-btn {background:var(--palette-soft);border-color:var(--palette-border);color:var(--palette-primary);}
html[data-palette] .danger-btn {background:#fff9f7;border-color:#f4dbd6;color:#bd6254;}
html[data-palette] .saving-card,
html[data-palette] .history-item,
html[data-palette] .soft-card,
html[data-palette] .stat-card,
html[data-palette] .summary-hero,
html[data-palette] .empty-state,
html[data-palette] .prompt-card {background:var(--palette-surface);border-color:var(--palette-border);}
/* The savings summary still carries an early prototype inline green background. */
html[data-palette] .soft-card[style*="background:#eaf5ed"] {
  background:var(--palette-soft)!important;
  border-color:var(--palette-border)!important;
}
html[data-palette] .soft-card[style*="background:#eaf5ed"] [style*="color:#"] {
  color:var(--palette-muted)!important;
}
html[data-palette] .prompt-icon,
html[data-palette] .summary-icon,
html[data-palette] .empty-state .large-icon {background:var(--palette-soft);color:var(--palette-primary);}
html[data-palette] .chip.active {background:var(--palette-soft);border-color:var(--palette-primary);color:var(--palette-primary);}
html[data-palette] .text-link,
html[data-palette] .saving-sum,
html[data-palette] .top-back {color:var(--palette-primary);}
html[data-palette] .sheet {background:var(--palette-surface);color:var(--palette-ink);}
html[data-palette] .sheet-close,
html[data-palette] .stepper-btn {background:var(--palette-soft);color:var(--palette-primary);border-color:var(--palette-border);}
html[data-palette] .sheet-sub,
html[data-palette] .form-section label {color:var(--palette-muted);}
html[data-palette] .form-section input,
html[data-palette] .field-input {background:#fff;border-color:var(--palette-border);color:var(--palette-ink);}
html[data-palette] .toast {background:var(--palette-dark);}
html[data-palette] button,
html[data-palette] input {accent-color:var(--palette-primary);}

/* The palette button is deliberately quieter than the budget-period switch. */
.brand {gap:10px;letter-spacing:normal}
.brand .brand-icon {width:35px;height:35px;border-radius:11px}
.brand-wordmark {display:flex;flex-direction:column;min-width:0;gap:3px}
.brand-name {font-size:19px;line-height:1;letter-spacing:-.055em;font-weight:810;color:var(--palette-ink);white-space:nowrap}
.brand-tagline {font-size:10.5px;line-height:1.1;letter-spacing:.005em;font-weight:680;color:var(--palette-muted);white-space:nowrap}
.home-period-row {justify-content:space-between;}
.palette-trigger {
  height:34px;min-width:43px;display:flex;align-items:center;justify-content:center;gap:4px;
  border:1px solid var(--palette-border);border-radius:12px;background:var(--palette-surface);
  color:var(--palette-primary);padding:0 9px;
}
.palette-mini-dot {width:7px;height:7px;border-radius:50%;background:var(--palette-swatch);border:1px solid var(--palette-border);}
.palette-options {display:grid;gap:10px;margin-top:6px;}
.palette-option {
  display:grid;grid-template-columns:1fr auto;gap:9px;align-items:center;text-align:left;
  padding:12px 13px;border:1px solid var(--palette-border);border-radius:15px;
  background:var(--palette-bg);color:var(--palette-ink);
}
.palette-option.selected {border:2px solid var(--palette-primary);padding:11px 12px;}
.palette-option-title {font-size:13px;font-weight:760;}
.palette-option-swatches {display:flex;grid-column:1;grid-row:2;gap:0;overflow:hidden;border-radius:8px;height:25px;width:100%;border:1px solid #00000010;}
.palette-option-swatches span {flex:1;min-width:0;}
.palette-option-mark {grid-column:2;grid-row:1 / span 2;width:22px;color:var(--palette-primary);display:grid;place-items:center;}
.budget-dialog-preview {
  display:flex;justify-content:space-between;align-items:center;gap:9px;
  border-radius:13px;background:var(--palette-soft);border:1px solid var(--palette-border);
  padding:12px 13px;color:var(--palette-ink);margin-top:-6px;
}
.budget-dialog-preview span {font-size:11px;font-weight:650;}
.budget-dialog-preview strong {font-size:17px;white-space:nowrap;color:var(--palette-primary);font-variant-numeric:tabular-nums;}

/* iOS Safari zooms the entire page on focus when a form control is below 16px. */
@media (max-width:900px) {
  .list-search-box input,
  .search-wrap input,
  .form-section input:not(.big-money),
  .form-section select,
  .field-input,
  input[type="search"] {font-size:16px!important;}
}