:root{
  --page:#f3eee4;--surface:#fffdf7;--surface-soft:#eae3d7;--field:#fffdf8;
  --text:#172c43;--muted:#59616b;--faint:#686964;--border:#d0c7b8;--border-strong:#8e9aa5;
  --accent:#203e59;--accent-ink:#fffdf7;--focus:#b34d31;--danger-bg:#f9e5dd;--danger-ink:#a03c2b;
  --notice-bg:#f4e8d0;--notice-border:#d9c59d;--notice-ink:#725326;--overlay:#14283c66;--selected:#a94b32;
  color-scheme:light;
}
:root[data-theme=dark]{
  --page:#101a28;--surface:#17263a;--surface-soft:#203148;--field:#132137;
  --text:#f5ecdd;--muted:#bdc0c6;--faint:#aeb7c3;--border:#38495e;--border-strong:#7d8999;
  --accent:#edb28d;--accent-ink:#17263a;--focus:#f1b997;--danger-bg:#402b2c;--danger-ink:#ffc1a8;
  --notice-bg:#352c22;--notice-border:#7e6247;--notice-ink:#eed7ad;--overlay:#050b15b3;--selected:#edb28d;
  color-scheme:dark;
}
:root,body{background:var(--page);color:var(--text)}
header{border-color:var(--border)}
.brand{color:var(--text)}.dot{color:var(--accent)}
p,.saved,.totals-line,.hint,footer,.help,.help p,.badge,.check-meta small{color:var(--muted)}
.totals-line b,.check-total .left-row,.savings-preview{color:var(--text)}
.check-total .total-row{color:var(--muted)}.check-total .left-row{color:var(--text)}
.outline,.sound-toggle,.appearance-toggle{border-color:var(--border);background:transparent;color:var(--text)}
.primary{background:var(--accent);color:var(--accent-ink)}
.icon{color:var(--muted)}.check-heading .icon{background:var(--page)}
.check-shell{background:var(--bubble-fill,var(--surface));border-color:var(--bubble-outline,var(--border-strong))}
.bill-section{border-color:var(--border-strong)}
.bill{--bubble-fill:var(--surface);--bubble-outline:var(--border-strong);--bubble-fill-dark:var(--surface);--bubble-outline-dark:var(--border-strong)}
.bill .pill-main{color:#24352e}
.bill .pill-edit{background:var(--surface);border-color:var(--bubble-outline,var(--border-strong));color:var(--text)}
.bill.selected{outline-color:var(--selected)}
.empty{color:var(--faint)}
dialog{background:var(--surface);color:var(--text);border-color:var(--border-strong);box-shadow:0 20px 100px #0003;max-height:calc(100dvh - 32px);overflow-y:auto}
dialog::backdrop{background:var(--overlay)}
input,#editAssignment,#savingsEditor select,.editor-sort select{background:var(--field);color:var(--text);border-color:var(--border)}
input::placeholder{color:var(--faint);opacity:1}
input:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,.bill-section:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
.danger{background:var(--danger-bg);color:var(--danger-ink)}
.negative{color:var(--danger-ink)!important}
#notice:not(:empty){background:var(--notice-bg);border-color:var(--notice-border);color:var(--notice-ink)}
#confirmationMessage,#colorName{color:var(--muted)}
.color-swatch:first-child{background:var(--surface);color:var(--text)}
.color-swatch[aria-pressed=true]{outline-color:var(--text)}
.custom-color input{background:var(--field);border-color:var(--border)}
.color-preview{background:var(--bubble-fill,var(--surface));border-color:var(--bubble-outline,var(--border-strong));color:#24352e}
.drop-over{background:var(--surface-soft)!important;outline-color:var(--selected)}
.check.drop-over{background:transparent!important}
.check.drop-over .check-shell{background:var(--bubble-fill,var(--surface-soft));outline-color:var(--selected);border-color:var(--bubble-outline,var(--selected))}
.bill-section.drop-over{border-color:var(--selected)}
[data-theme=dark] .check-shell{background:var(--bubble-fill-dark,var(--surface));border-color:var(--bubble-outline-dark,var(--border-strong))}
[data-theme=dark] .bill{background:var(--bubble-fill-dark,var(--surface));border-color:var(--bubble-outline-dark,var(--border-strong))}
[data-theme=dark] .bill .pill-main{color:var(--text)}
[data-theme=dark] .bill .pill-edit{border-color:var(--bubble-outline-dark,var(--border-strong))}
[data-theme=dark] .color-preview{background:var(--bubble-fill-dark,var(--surface));border-color:var(--bubble-outline-dark,var(--border-strong));color:var(--text)}
[data-theme=dark] .check.drop-over .check-shell{background:var(--bubble-fill-dark,var(--surface-soft));border-color:var(--bubble-outline-dark,var(--selected))}
.header-buttons{display:flex;align-items:center;gap:8px}
.appearance-toggle{font-size:11px;font-weight:400;padding:6px 10px;border:1px solid var(--border);border-radius:20px;white-space:nowrap}
#appearanceEditor{width:min(365px,calc(100% - 30px))}
.appearance-options{border:0;padding:0;margin:0;display:grid;gap:10px}
.appearance-options legend{padding:0;margin-bottom:12px;font-size:12px;color:var(--muted)}
.appearance-option{display:flex;align-items:center;gap:12px;border:1px solid var(--border);background:var(--field);padding:14px;border-radius:12px;margin:0;cursor:pointer;font-weight:400}
.appearance-option input{width:17px;height:17px;padding:0;margin:0;flex:0 0 17px}
.appearance-option strong{display:block;font-size:14px;font-weight:500}
.appearance-option small{display:block;margin-top:4px;font-size:11px;color:var(--muted)}
.appearance-option:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:var(--surface-soft)}
#appearanceStatus{margin-top:16px;font-size:12px}
#appearanceEditor .modal-actions{justify-content:flex-end}
@media(max-width:650px){.header-buttons{gap:6px}.appearance-toggle{font-size:10px;padding:5px 8px}}
@media(max-width:350px){.brand{font-size:21px}}