:root{color:#111;font-synthesis:none;text-rendering:optimizelegibility;background:#fff;font-family:Noto Sans,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}button{color:inherit;cursor:pointer}.page{width:min(760px,100% - 32px);margin:0 auto;padding:32px 0}header{padding-bottom:24px}.topline,.summary-line,.summary-note,.list-heading,footer{justify-content:space-between;align-items:baseline;gap:16px;display:flex}h1,h2,p{margin-top:0}h1{letter-spacing:-.06em;margin-bottom:0;font-family:Noto Sans Mono,monospace;font-size:1.3rem;font-weight:800}.topline>span,.list-heading>span,.summary-note,footer{font-family:Noto Sans Mono,monospace;font-size:.72rem}.numbers{grid-template-columns:1fr 1fr;gap:24px;padding:0 0 32px;display:grid}label{flex-direction:column;gap:6px;min-width:0;display:flex}label>span:first-child,.summary-line>div>span{text-transform:uppercase;font-family:Noto Sans Mono,monospace;font-size:.7rem;font-weight:650}input{color:#111;background:#fff;border:1px solid #999;border-radius:0;outline:none;width:100%;min-width:0;height:42px;padding:0 10px}input:focus{border:2px solid #315efb}.input-with-unit{display:block;position:relative}.input-with-unit>span{color:#666;font-family:Noto Sans Mono,monospace;font-size:.8rem;position:absolute;top:50%;left:10px;transform:translateY(-50%)}.input-with-unit input{padding-left:25px;font-family:Noto Sans Mono,monospace}.hours-input>span{left:auto;right:10px}.hours-input input{padding-left:10px;padding-right:35px}.summary{border-bottom:1px solid #111;padding:0 0 24px}.summary-line>div>span,.summary-line strong{display:block}.summary-line strong{letter-spacing:-.07em;margin-top:4px;font-family:Noto Sans Mono,monospace;font-size:clamp(1.6rem,7vw,3.4rem);font-weight:650;line-height:1}.summary-target{text-align:right}.summary-note{color:#555;margin-top:18px}.summary-note span:last-child{text-align:right}.goal-chart{width:100%;margin-top:20px;position:relative}.goal-chart svg{width:100%;height:100%;display:block;position:absolute;inset:0;overflow:visible}.goal-track{fill:#fff;stroke:#111;vector-effect:non-scaling-stroke}.goal-fill{fill:#315efb}.goal-fill-want{fill:#e66b00}.goal-connector polyline{fill:none;stroke:#111;stroke-width:1px;vector-effect:non-scaling-stroke}.goal-connector.reached.need polyline{stroke:#315efb}.goal-connector.reached.want polyline{stroke:#e66b00}.goal-label{justify-content:space-between;align-items:baseline;gap:12px;display:flex;position:absolute;left:14.5%;right:0;transform:translateY(-50%)}.goal-label>div{align-items:baseline;gap:8px;min-width:0;display:flex}.goal-label.reached.need{color:#315efb}.goal-label.reached.want{color:#e66b00}.goal-label button,.edit-name,.manage-amount{background:0 0;border:0;padding:0}.goal-name,.edit-name{overflow-wrap:anywhere;text-align:left;font-weight:700}.goal-name:hover,.edit-name:hover,.goal-amount:hover,.manage-amount:hover{text-underline-offset:3px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.kind-button{text-transform:uppercase;background:#fff;border:1px solid #999;font-family:Noto Sans Mono,monospace;font-size:.58rem}.goal-amount,.manage-amount{flex:none;font-family:Noto Sans Mono,monospace;font-size:.76rem}.goal-placeholder{color:#666;margin:0;font-family:Noto Sans Mono,monospace;font-size:.75rem;position:absolute;top:50%;left:14.5%;transform:translateY(-50%)}.expenses{padding-top:24px}.list-heading{margin-bottom:16px}h2{margin-bottom:0;font-size:1.15rem;font-weight:750}.add-form{grid-template-columns:minmax(0,1fr) 160px auto auto;align-items:end;gap:12px;padding:0 0 20px;display:grid}.add-form>button{color:#fff;background:#111;border:1px solid #111;border-radius:0;height:42px;padding:0 22px;font-weight:700}.add-form>button:hover{background:#315efb}.kind-toggle{border:0;min-width:0;margin:0;padding:0}.kind-toggle legend{text-transform:uppercase;margin-bottom:6px;padding:0;font-family:Noto Sans Mono,monospace;font-size:.7rem;font-weight:650}.kind-toggle>div{border:1px solid #999;height:42px;display:flex}.kind-toggle label{flex:1;display:block;position:relative}.kind-toggle label+label{border-left:1px solid #999}.kind-toggle input{opacity:0;width:1px;height:1px;position:absolute}.kind-toggle label span{cursor:pointer;place-items:center;height:100%;padding:0 10px;font-family:Noto Sans Mono,monospace;font-size:.7rem;display:grid}.kind-toggle input:checked+span{color:#fff;background:#111}.kind-toggle input:focus-visible+span{outline-offset:2px;outline:2px solid #315efb}.manage-list{border-top:1px solid #111;margin:0;padding:0;list-style:none}.manage-list li{border-bottom:1px solid #bbb;grid-template-columns:28px minmax(0,1fr) auto 90px auto;align-items:center;gap:10px;min-height:50px;display:grid}.rank{color:#666;font-family:Noto Sans Mono,monospace;font-size:.65rem}.kind-button{padding:3px 6px}.kind-button:hover{color:#fff;background:#111}.manage-amount{justify-self:end}.row-actions{gap:4px;display:flex}.row-actions button{background:#fff;border:1px solid #999;border-radius:0;width:26px;height:26px;padding:0}.row-actions button:hover:not(:disabled){color:#fff;background:#111}.row-actions button:disabled{opacity:.25;cursor:default}.empty{color:#666;border-top:1px solid #111;border-bottom:1px solid #bbb;margin:0;padding:20px 0;font-family:Noto Sans Mono,monospace;font-size:.8rem}footer{color:#666;margin-top:28px}footer button{background:0 0;border:0;padding:0;text-decoration:underline}.data-actions{gap:12px;display:flex}[hidden]{display:none!important}@media (width<=600px){.page{width:min(100% - 24px,760px);padding-top:20px}.numbers{grid-template-columns:1fr;gap:14px}.summary-line strong{font-size:clamp(1.4rem,9vw,2.5rem)}.summary-note,.summary-note span{display:block}.summary-note span:last-child{text-align:left;margin-top:5px}.goal-label,.goal-placeholder{left:17%}.add-form{grid-template-columns:1fr 1fr}.add-form>label:first-child,.add-form>button{grid-column:1/-1}.manage-list li{grid-template-columns:24px minmax(0,1fr) auto;gap:8px;padding:11px 0}.rank{grid-area:1/1}.edit-name{grid-area:1/2}.kind-button{grid-area:1/3}.manage-amount{grid-area:2/2;justify-self:start}.row-actions{grid-area:2/3}}@media (width<=400px){.topline,.list-heading{align-items:flex-start}.topline>span,.list-heading>span{text-align:right}.summary-line{display:block}.summary-target{text-align:left;margin-top:16px}.add-form{grid-template-columns:1fr}.add-form>label:first-child,.add-form>button{grid-column:auto}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
