/* Checkmate's paper-and-ink identity. */
:root{--body-font:'Avenir Next','Trebuchet MS',Arial,sans-serif;--display-font:'Iowan Old Style','Palatino Linotype','Book Antiqua',Georgia,serif;--number-font:'SFMono-Regular',Consolas,'Liberation Mono',monospace;--brand-coral:#a1442f;--paper-rule:#203e5910;--paper-grain:#273b4a0a;font-family:var(--body-font)}
:root[data-theme=dark]{--brand-coral:#f0ac87;--paper-rule:#d3dbea0d;--paper-grain:#e4cfa304}
body{background-image:radial-gradient(var(--paper-grain) .6px,transparent .6px);background-size:5px 5px}
header{height:91px;padding:0 max(26px,calc((100vw - 1032px)/2));border-bottom:1px solid var(--border-strong);background:var(--page)}
.brand{gap:11px;color:var(--text);letter-spacing:-1.2px;text-decoration:none;align-items:center}
.brand-mark{width:36px;height:40px;flex:none}
.brand-wordmark{font-family:var(--display-font);font-size:33px;font-weight:700;line-height:.95}
.brand .dot{color:var(--brand-coral)}
.brand-wordmark small{display:block;font-family:var(--number-font);font-size:8px;letter-spacing:1.8px;font-weight:400;margin-top:9px}
.header-status{gap:19px}.header-buttons{gap:16px}
.appearance-toggle,.sound-toggle{padding:5px 0;border:0;border-radius:0;font-size:11px;color:var(--muted);font-family:var(--body-font)}
.appearance-toggle:hover,.sound-toggle:hover{color:var(--text);transform:none;text-decoration:underline;text-underline-offset:5px}
.saved{font-family:var(--number-font);font-size:9px;letter-spacing:-.2px;color:var(--muted)}
.saved::before{content:'';display:inline-block;width:5px;height:5px;border-radius:0;background:var(--brand-coral);margin-right:7px;vertical-align:1px}
main{max-width:1080px;padding:30px 24px 36px}
.month-bar{position:relative;gap:24px;background:none;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:0 0 24px;margin:0 0 27px}
.month-switcher{gap:18px}.month-title{min-width:248px}
.month-title::before{content:'MONTHLY LEDGER';display:block;font-family:var(--number-font);font-size:9px;letter-spacing:2.2px;color:var(--brand-coral);margin-bottom:4px}
.month-title h2{font-family:var(--display-font);font-size:36px;line-height:1.15;font-weight:500;letter-spacing:-1.1px}
.month-title small{font-family:var(--number-font);font-size:9px;letter-spacing:0;margin-top:6px}
.month-arrow{background:transparent;border:1px solid var(--border-strong);border-radius:4px;height:34px;width:34px;font-size:25px;color:var(--text)}
.month-arrow:hover{background:var(--surface-soft);transform:none}
.month-actions{gap:9px}.outline,#saveMonth,#exportPdf{border-radius:4px;background:transparent;border-color:var(--border-strong);font-weight:500}
#saveMonth,#exportPdf{font-size:11px;padding:10px 13px}
#exportPdf{border-color:var(--text);background:var(--text);color:var(--page)}
#planContent>.toolbar{margin-bottom:22px;align-items:flex-end}
.plan-eyebrow{display:block;margin:0 0 7px;font-family:var(--number-font);font-size:9px;letter-spacing:1.7px;color:var(--brand-coral)}
h1{font-family:var(--display-font);font-size:29px;font-weight:600;letter-spacing:-.65px;margin:0 0 5px}
.toolbar p{font-size:11px;line-height:1.5;color:var(--muted)}
.actions{gap:8px;flex-wrap:wrap}.actions button{min-height:38px;padding:10px 12px;font-size:11px;font-family:var(--body-font);border-radius:4px;letter-spacing:0}
.primary{border-radius:4px;background:var(--accent);color:var(--accent-ink);box-shadow:none}
#balance{background:var(--text);color:var(--page);border-bottom:3px solid var(--brand-coral);padding-bottom:7px}
#newPlan{border-color:transparent;font-size:10px;padding-left:3px;padding-right:3px;color:var(--muted)}
button:hover{filter:none;transform:translateY(-1px)}button:disabled:hover{transform:none}
.totals-line{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid var(--text);border-bottom:1px solid var(--border-strong);margin:0 0 28px;padding:17px 0 15px;gap:0}
.totals-line>span{font-family:var(--number-font);font-size:9px;text-transform:uppercase;letter-spacing:1.3px;padding:0 20px;border-left:1px solid var(--border);color:var(--muted);min-width:0}
.totals-line>span:first-child{padding-left:0;border:0}
.totals-line b{display:block;margin:7px 0 0;font-family:var(--number-font);font-size:27px;letter-spacing:-1.5px;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.totals-line>span:last-child b{color:var(--brand-coral)}
#notice:not(:empty){border:0;border-left:3px solid var(--notice-ink);border-radius:0;background:var(--notice-bg);padding:10px 13px;font-size:11px;margin-bottom:25px}
.checks{gap:28px;padding:4px 3px 12px;justify-content:center;align-items:stretch;overflow-x:auto}
.check{flex:1 0 240px;max-width:416px;min-height:424px;scroll-snap-align:start}
.check-top,.check:nth-child(3n + 2) .check-top,.check:nth-child(3n) .check-top{padding:0 11px 12px!important}
.check-heading{min-height:28px;padding:0 28px 0 30px}
.check-heading h3{font-family:var(--display-font);font-size:23px;font-weight:600;letter-spacing:-.5px}
.check-number{position:absolute;left:0;top:7px;color:var(--brand-coral);font-family:var(--number-font);font-size:10px;letter-spacing:1px;font-weight:500}
.check-heading .icon{background:var(--page);border-radius:3px;right:-3px;top:0;font-size:18px;color:var(--brand-coral)}
.check-meta{margin-top:9px;align-items:center;gap:7px}
.check-meta small{font-family:var(--number-font);font-size:10px;letter-spacing:-.4px;color:var(--muted)}
.check-amount{font-family:var(--number-font);font-size:16px;letter-spacing:-.8px;font-weight:500;color:var(--text)}
.check-shell{border:1px solid var(--bubble-outline,var(--border-strong));border-radius:17px;background:var(--bubble-fill,var(--surface));box-shadow:2px 3px 0 var(--border),4px 5px 0 var(--page);overflow:visible}
.check-bills{padding:17px 14px;gap:12px;min-height:225px;background-image:repeating-linear-gradient(to bottom,transparent 0px,transparent 31px,var(--paper-rule) 31px,var(--paper-rule) 32px);background-position:0 8px;border-radius:17px 17px 0 0}
.bill{--bubble-fill:var(--surface);--bubble-outline:var(--border-strong);border:1px solid var(--bubble-outline);border-radius:15px 15px 15px 5px;background:var(--bubble-fill);box-shadow:0 2px 0 var(--paper-rule);width:max-content;max-width:100%}
.bill .pill-main{font-family:var(--body-font);font-size:12px;font-weight:400;padding:9px 12px;gap:10px;border-radius:15px 15px 15px 5px;color:#172c43;line-height:1.3}
.pill-main strong{font-family:var(--number-font);font-weight:500;font-size:11px;letter-spacing:-.6px}
.bill .pill-edit{background:var(--surface);border-radius:5px;border-color:var(--bubble-outline);color:var(--text);top:-13px;right:-6px;width:27px;height:27px;min-height:27px}
.bill.selected{outline-color:var(--brand-coral)}
.check-total{margin:0 14px;padding:14px 1px 15px;border-top:1px dashed var(--border-strong)}
.check-total .total-row{font-size:10px;line-height:1.5;margin-bottom:5px;color:var(--muted)}
.check-total .total-row>span:last-child{font-family:var(--number-font);font-size:11px;letter-spacing:-.4px}
.check-total .left-row{margin:7px 0 0;color:var(--text)}
.check-total .left-row>span:last-child{font-size:13px;font-weight:600}
.bill-section{border:1px dashed var(--border-strong);border-radius:14px;background:var(--surface-soft);padding:18px 20px 21px;min-height:145px;margin-top:27px}
.bill-section h2{font-family:var(--display-font);font-size:23px;font-weight:600;letter-spacing:-.4px}
.bill-section .toolbar{margin-bottom:17px;align-items:center}
.bill-section .toolbar p{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.badge{display:inline-grid;place-items:center;vertical-align:3px;background:var(--page);border:1px solid var(--border);min-width:22px;height:22px;border-radius:4px;font-family:var(--number-font);font-size:10px;color:var(--brand-coral);margin-left:6px;padding:0 5px}
.tray-actions button{font-size:11px;border-radius:4px;padding:9px 11px;min-height:36px}
.unassigned{gap:11px;min-height:42px}
.bill-section.drop-over{border-color:var(--brand-coral);box-shadow:0 0 0 3px var(--paper-rule)}
.check.drop-over .check-shell{outline-color:var(--brand-coral);border-color:var(--brand-coral);box-shadow:0 0 0 4px var(--paper-rule)}
.empty{font-family:var(--body-font);font-size:11px;color:var(--muted)}
footer{font-family:var(--number-font);font-size:9px;letter-spacing:0;color:var(--muted);margin:20px 0 14px}
.help{border-top:1px solid var(--border);padding-top:13px;font-size:10px;font-family:var(--body-font)}
.help p{font-size:11px;line-height:1.6}
dialog{border:1px solid var(--border-strong);border-top:4px solid var(--brand-coral);border-radius:8px;padding:25px 26px;box-shadow:8px 10px 0 #0b1a2a1f,0 18px 80px #0b1a2a24;background:var(--surface);color:var(--text);font-family:var(--body-font)}
dialog::backdrop{background:var(--overlay);backdrop-filter:blur(2px)}
.modal-top{margin-bottom:21px}.modal-top h2{font-family:var(--display-font);font-size:25px;font-weight:600;letter-spacing:-.5px}
.modal-top .icon{color:var(--muted);border-radius:3px}
label,.color-picker legend{font-size:11px;font-weight:500}
input,#editAssignment,#savingsEditor select,.editor-sort select{border-radius:4px;background:var(--field);border-color:var(--border-strong);font-family:var(--body-font);font-size:13px}
input[type=number],input[type=date]{font-family:var(--number-font);font-size:12px;letter-spacing:-.3px}
input[type=checkbox],input[type=radio]{accent-color:var(--brand-coral)}
#billDueMonth{width:100%;margin-top:7px;padding:12px;border:1px solid var(--border-strong);border-radius:4px;background:var(--field);color:var(--text);font-size:12px}
#billFundingHint{font-size:11px;line-height:1.5;margin:-5px 0 18px;color:var(--muted)}
.bill-label{min-width:0;text-align:left}
.bill-label .bill-due{display:block;margin-top:3px;font-family:var(--number-font);font-size:9px;font-weight:400;opacity:.8}
.modal-actions button{font-size:12px;border-radius:4px}
.savings-tabs{border-radius:4px;padding:3px;background:var(--surface-soft)}
.savings-tabs button{border-radius:2px;font-size:12px}.savings-tabs button[aria-selected=true]{box-shadow:0 2px 0 var(--brand-coral)}
.calc-result{border-radius:5px;border-top:2px solid var(--brand-coral)}
#calcProjected{font-family:var(--number-font);font-size:29px;letter-spacing:-1.5px}
.calc-breakdown strong,.calc-source strong{font-family:var(--number-font);letter-spacing:-.6px;font-weight:500}
.repeat-options,.appearance-option,.pdf-file-details{border-radius:5px}
.appearance-option:has(input:checked){box-shadow:inset 3px 0 0 var(--brand-coral);border-color:var(--border-strong)}
.color-preview{border-radius:15px 15px 15px 5px;color:#172c43}
.check-preview{border-radius:8px}
.pdf-file-icon{border-radius:2px;background:var(--page);font-family:var(--number-font);color:var(--brand-coral)}
.pdf-file-details strong{font-family:var(--number-font);font-size:12px;letter-spacing:-.5px}
.pdf-export-actions a,.pdf-export-actions button{border-radius:4px}
[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,[data-theme=dark] .color-preview{color:var(--text)}
[data-theme=dark] .check-total{border-color:var(--border-strong)}
@media(max-width:760px){.header-status{gap:11px}.header-buttons{gap:12px}.saved{font-size:8px}.month-title{min-width:215px}.month-title h2{font-size:32px}.month-switcher{gap:13px}.totals-line b{font-size:24px}#planContent>.toolbar{flex-wrap:wrap;align-items:flex-start}.actions{width:100%;justify-content:flex-start}.totals-line>span{padding:0 14px}}
@media(max-width:650px){header{height:79px;padding:0 18px}.brand-mark{width:28px;height:34px}.brand{gap:8px}.brand-wordmark{font-size:27px}.brand-wordmark small{font-size:6.5px;letter-spacing:1.35px;margin-top:7px}.header-status{gap:6px;align-items:flex-end}.header-buttons{gap:12px}.appearance-toggle,.sound-toggle{font-size:10px}.saved{font-size:7px;max-width:145px;white-space:nowrap}.saved::before{width:4px;height:4px;margin-right:5px}main{padding:22px 15px 28px}.month-bar{padding:0 0 20px;margin-bottom:23px;gap:15px}.month-switcher{gap:14px;justify-content:space-between;flex-basis:100%;width:100%}.month-title{min-width:0;flex:1}.month-title::before{font-size:8px;letter-spacing:1.6px;margin-bottom:4px}.month-title h2{font-size:32px}.month-title small{font-size:8px;margin-top:5px}.month-arrow{flex:0 0 32px;width:32px;height:34px;border-radius:3px}.month-actions{width:100%;justify-content:center;gap:9px}#saveMonth,#exportPdf{margin:0;font-size:10px;padding:8px 15px}.plan-eyebrow{font-size:8px;letter-spacing:1.25px;margin-bottom:5px}h1{font-size:26px}#planContent>.toolbar{gap:14px;margin-bottom:18px}.toolbar p{font-size:10px;max-width:330px;line-height:1.6}.actions{display:flex;flex-wrap:nowrap;gap:6px;justify-content:space-between}.actions button{font-size:10px;min-height:36px;padding:8px 10px;flex:1}.actions #newPlan{flex:.75;padding-inline:0;font-size:9px}.totals-line{padding:14px 0 13px;margin-bottom:25px}.totals-line>span{font-size:8px;letter-spacing:.7px;padding:0 9px}.totals-line b{font-size:18px;letter-spacing:-1.1px;margin-top:7px}.checks{gap:13px;justify-content:flex-start;padding:3px 2px 10px}.check{flex:1 0 calc(50% - 7px);min-width:0;max-width:none;min-height:371px}.check:only-child{max-width:370px}.checks:has(.check:nth-child(3)) .check{flex:0 0 185px}.check-top,.check:nth-child(3n + 2) .check-top,.check:nth-child(3n) .check-top{padding:0 5px 9px!important}.check-heading{padding:0 14px 0 15px;min-height:24px}.check-heading h3{font-size:17px;letter-spacing:-.5px}.check-number{top:6px;left:-1px;font-size:8px;letter-spacing:0}.check-heading .icon{font-size:16px}.check-meta{margin-top:7px;gap:4px}.check-meta small{font-size:8px;letter-spacing:-.45px}.check-amount{font-size:12px;letter-spacing:-.8px}.check-shell{border-radius:14px;box-shadow:1px 2px 0 var(--border),3px 4px 0 var(--page)}.check-bills{padding:13px 8px;gap:10px;min-height:199px;border-radius:14px 14px 0 0;background-size:100% 30px}.bill .pill-main{padding:8px 9px;font-size:10px;gap:5px;line-height:1.35}.pill-main strong{font-size:10px;letter-spacing:-.5px}.check-total{margin:0 9px;padding:12px 0 13px}.check-total .total-row{font-size:9px;gap:5px}.check-total .total-row>span:last-child{font-size:9px;letter-spacing:-.5px}.check-total .left-row>span:last-child{font-size:11px}.bill-section{margin-top:24px;padding:16px 14px 18px;border-radius:10px}.bill-section h2{font-size:22px}.bill-section .toolbar{align-items:flex-start;gap:12px;margin-bottom:15px;flex-wrap:wrap}.bill-section .toolbar p{font-size:9px}.tray-actions{gap:7px}.tray-actions button{font-size:10px;padding:7px 10px;min-height:33px}.badge{min-width:20px;height:20px;font-size:9px;vertical-align:3px}.unassigned .bill .pill-main{font-size:11px;padding:9px 11px}.unassigned{gap:10px}footer{font-size:8px;line-height:1.6}.help{font-size:9px}.help p{font-size:10px}dialog{padding:22px 20px}.modal-top h2{font-size:25px}}
@media(max-width:370px){header{padding-inline:13px}.brand-wordmark{font-size:24px}.brand-mark{width:25px}.header-buttons{gap:10px}.appearance-toggle,.sound-toggle{font-size:9px}.saved{font-size:6.5px}.totals-line>span{padding:0 7px}.totals-line b{font-size:16px}.actions button{font-size:9px;padding-inline:7px}.check-heading h3{font-size:16px}.check-amount{font-size:11px}.check-meta small{font-size:7.5px}}
@media(prefers-reduced-motion:reduce){button{transition:none}.month-arrow:hover{transform:none}}

.touch-hint{display:none}
@media(max-width:650px),(hover:none){.desktop-hint{display:none}.touch-hint{display:inline}}
@media(max-width:650px){.header-buttons .appearance-toggle,.header-buttons .sound-toggle{min-height:29px;font-size:10px}.header-status .saved{font-size:8px}.totals-line>span{padding-inline:6px}.totals-line>span:first-child{padding-left:0}.totals-line b{font-size:14px;letter-spacing:-.8px}.actions #balance{flex:1.25;white-space:nowrap;padding-inline:8px}}
@media(max-width:370px){.totals-line>span{padding-inline:5px}.totals-line b{font-size:12px;letter-spacing:-.8px}}