:root{--red:#b5122b;--ink:#111;--paper:#f6f3ec;--line:#d7d0c4;--muted:#706a62;--gold:#d5a941}
.billing-page{padding-bottom:30px}
.billing-hero{padding:25px 0 20px;border-bottom:1px solid var(--line)}
.billing-kicker{font:900 9px/1 Arial;letter-spacing:.16em;color:var(--red);margin-bottom:8px}
.billing-hero h1{font:900 clamp(50px,7vw,80px)/.88 Georgia,serif;letter-spacing:-3px;margin:0}
.billing-hero .dek{max-width:820px;font:18px/1.43 Georgia,serif;color:#48433d;margin:13px 0 0}
.billing-datebar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-top:20px;border-top:3px solid #111;border-bottom:1px solid #111;padding:9px 0}
.billing-date-arrow,.billing-archive-open{font:900 8px/1 Arial;letter-spacing:.1em;text-decoration:none;color:#111}
#tb-next{text-align:right}.billing-date-arrow.disabled{opacity:.28;pointer-events:none}
.billing-archive-open{border:0;background:transparent;cursor:pointer;color:var(--red);padding:4px 8px}
.billing-layout{display:grid;grid-template-columns:minmax(0,820px) 250px;gap:28px;margin-top:24px;align-items:start}
.billing-scoreline{display:flex;justify-content:space-between;gap:15px;border-top:4px solid #111;border-bottom:1px solid #111;padding:10px 0;font:900 9px/1 Arial;letter-spacing:.08em}
.billing-scoreline b{color:var(--red);margin-left:4px}
.billing-brief{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-top:5px solid #111;margin-top:14px;padding:16px}
.billing-label{font:900 8px/1 Arial;letter-spacing:.14em;color:var(--red)}
.billing-brief h2{font:900 27px/1 Georgia,serif;margin:5px 0 5px}.billing-brief p{font:14px/1.45 Georgia,serif;color:#555;margin:0}
.billing-difficulty{white-space:nowrap;border:1px solid #111;padding:7px 9px;font:900 8px/1 Arial;letter-spacing:.1em}
.billing-board{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:14px;margin-top:14px;align-items:start}
.billing-slots,.billing-bank{background:#fff;border:1px solid var(--line);padding:13px}
.billing-column-head{display:grid;grid-template-columns:1fr minmax(170px,.85fr);gap:10px;border-bottom:3px solid #111;padding:0 3px 8px;font:900 7px/1 Arial;letter-spacing:.12em;color:#777}
.billing-column-head span:last-child{text-align:center}
.tb-row{display:grid;grid-template-columns:1fr minmax(170px,.85fr);gap:10px;align-items:stretch;padding:8px 0;border-bottom:1px solid var(--line)}
.tb-row:last-child{border-bottom:0}
.tb-left{display:flex;align-items:center;min-height:55px;padding:9px 10px;background:#f6f2ea;border-left:4px solid #111;font:800 14px/1.25 Georgia,serif}
.tb-slot{display:flex;align-items:center;justify-content:center;min-height:55px;border:1px dashed #9c958b;background:#fbfaf7;padding:6px;position:relative;transition:border-color .1s ease,background .1s ease}
.tb-slot:before{content:'DROP BILLING';font:900 7px/1 Arial;letter-spacing:.12em;color:#aaa}
.tb-slot.hover{border-color:var(--red);background:#fff6f6}
.tb-slot.selected-target{border-color:#111;background:#f5f5f2}
.tb-slot.matched{border-style:solid;border-color:#111;background:#fff}
.tb-slot.matched:before{display:none}
.tb-match{width:100%;padding:10px;background:#111;color:#fff;font:900 11px/1.25 Arial;text-align:center}
.billing-bank>p{font:12px/1.4 Georgia,serif;color:#666;margin:6px 0 12px}
.billing-bank-list{display:grid;gap:8px}
.tb-choice{position:relative;border:1px solid #111;background:#fff;padding:11px 31px 11px 11px;min-height:48px;display:flex;align-items:center;font:900 10px/1.25 Arial;cursor:grab;touch-action:none;user-select:none;transition:transform .08s ease,box-shadow .08s ease,background .08s ease}
.tb-choice:after{content:'⋮⋮';position:absolute;right:9px;top:50%;transform:translateY(-50%);color:#777;letter-spacing:-2px}
.tb-choice:hover,.tb-choice.selected{background:#f1ede5}.tb-choice.selected{outline:3px solid var(--red);outline-offset:1px}
.tb-choice:focus-visible,.tb-slot:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.tb-drag-ghost{position:fixed;z-index:99999;pointer-events:none;width:230px;max-width:70vw;padding:11px;background:#111;color:#fff;border:1px solid #111;box-shadow:0 10px 26px #0004;font:900 10px/1.25 Arial;transform:translate(-50%,-50%);opacity:.93}
.billing-feedback{min-height:22px;margin-top:9px;font:900 9px/1.35 Arial;color:var(--red)}
.billing-actions{display:flex;justify-content:flex-end;margin-top:2px}.billing-actions button{border:0;background:transparent;color:#777;font:900 8px/1 Arial;letter-spacing:.09em;text-decoration:underline;cursor:pointer}
.billing-result{background:#111;color:#fff;border-top:7px solid var(--red);margin-top:16px;padding:23px}.billing-result[hidden]{display:none}.billing-result .billing-label{color:#f1c55d}.billing-result h2{font:900 clamp(35px,5vw,50px)/.95 Georgia,serif;margin:6px 0 8px}.billing-rating{font:900 10px/1 Arial;letter-spacing:.12em;color:#f1c55d}.billing-summary{display:grid;gap:6px;margin-top:18px;border-top:1px solid #444;padding-top:13px}.billing-summary-row{display:grid;grid-template-columns:1fr auto 1fr;gap:9px;align-items:center;font:13px/1.3 Georgia,serif}.billing-summary-row i{font-style:normal;color:#f1c55d;font-family:Arial,sans-serif;font-weight:900}
.result-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.result-actions button,.result-actions a{border:1px solid #fff;background:#fff;color:#111;padding:11px 14px;font:900 9px/1 Arial;letter-spacing:.09em;cursor:pointer;text-decoration:none}.result-actions a{background:transparent;color:#fff}
.billing-rail{display:grid;gap:13px}.billing-rail-card{background:#fff;border:1px solid var(--line);border-top:4px solid #111;padding:15px}.billing-rail-card.note{border-top-color:var(--red)}.billing-rail-card h2{font:900 23px/1 Georgia,serif;margin:5px 0 8px}.billing-rail-card p{font:13px/1.5 Georgia,serif;color:#555;margin:0}.billing-rail-card b{color:#111}
.billing-archive{margin:32px 0;background:#fff;border-top:7px solid var(--red);padding:23px}.billing-archive[hidden]{display:none}.archive-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.archive-head h2{font:900 34px/.95 Georgia,serif;margin:5px 0 0}.archive-head button{border:1px solid #111;background:#fff;padding:9px 10px;font:900 8px/1 Arial;letter-spacing:.08em;cursor:pointer}.billing-archive>p{font:14px/1.45 Georgia,serif;color:#555}
.billing-archive-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:17px}.billing-archive-item{display:block;border:1px solid #d9d2c7;background:#f8f5ef;padding:11px;text-decoration:none;color:#111;min-height:92px}.billing-archive-item:hover{border-color:#111;background:#fff}.billing-archive-item.current{border:2px solid var(--red)}.billing-archive-item.solved{box-shadow:inset 0 4px 0 #111}.billing-archive-item.future{opacity:.42;cursor:default;background:#eee9df}.billing-archive-item.future:hover{border-color:#d9d2c7;background:#eee9df}.billing-archive-item .bdate{display:block;font:900 8px/1 Arial;letter-spacing:.08em;color:var(--red);margin-bottom:6px}.billing-archive-item .bnum{display:block;font:900 16px/1 Georgia,serif}.billing-archive-item .btheme{display:block;font:800 7px/1.15 Arial;color:#333;margin-top:5px}.billing-archive-item .bstatus{display:block;font:800 7px/1 Arial;letter-spacing:.08em;color:#777;margin-top:8px}
@media(max-width:920px){.billing-layout{grid-template-columns:1fr}.billing-rail{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.billing-board{grid-template-columns:1fr}.billing-bank{position:relative}.billing-column-head{grid-template-columns:1fr minmax(130px,.8fr)}.tb-row{grid-template-columns:1fr minmax(130px,.8fr)}.billing-archive-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:520px){.billing-hero h1{letter-spacing:-2px}.billing-scoreline{font-size:7px}.billing-datebar{grid-template-columns:1fr 1fr}.billing-archive-open{grid-column:1/3;grid-row:2}.billing-board{display:flex;flex-direction:column}.billing-bank{order:-1}.billing-column-head{grid-template-columns:1fr 1fr}.tb-row{grid-template-columns:1fr 1fr}.tb-left{font-size:12px}.tb-slot{min-height:58px}.billing-rail{grid-template-columns:1fr}.billing-archive-grid{grid-template-columns:repeat(2,1fr)}.billing-summary-row{grid-template-columns:1fr auto 1fr;font-size:11px}}
