:root{font-family:system-ui,-apple-system,sans-serif;color:#20382f;background:#f5f6f2;--surface:#fff;--line:#dce3db;--muted:#68766e;--accent:#28654c;--soft:#eaf1e8;--danger:#b74335;color-scheme:light}*{box-sizing:border-box}body{margin:0}main{max-width:1240px;margin:auto;padding:48px 32px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:32px}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--accent);font-weight:750}h1{font-size:36px;letter-spacing:-1.5px;margin:10px 0}h1 span{color:var(--accent)}h2{font-size:19px;margin:0 0 18px}p{color:var(--muted);line-height:1.6}header p{margin:0}#status{font-size:12px;color:var(--muted)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}article,.panel,.group{background:var(--surface);border:1px solid var(--line);border-radius:14px}article{padding:22px;min-width:0}article label{font-size:12px;color:var(--muted)}article strong{display:block;font-size:28px;letter-spacing:-1px;margin:12px 0}small{display:block;color:var(--muted);font-size:11px;line-height:1.6}.balance{background:var(--soft)}.money-input{display:flex;align-items:center;gap:6px;height:58px}.money-input input{border:0;background:transparent;font-size:28px;font-weight:700;width:100%;padding:0;color:inherit;letter-spacing:-1px}.money-input span{font-weight:600}.panel{padding:24px;margin:24px 0}form#add{display:grid;grid-template-columns:2fr 1.6fr 1.25fr .8fr .85fr auto;gap:12px;align-items:end}label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:600}input,select{min-width:0;width:100%;border:1px solid var(--line);border-radius:8px;padding:11px;font:inherit;font-size:14px;color:inherit;background:var(--surface)}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:2px}button{border:0;border-radius:8px;padding:12px 16px;background:var(--accent);color:white;font-weight:650;cursor:pointer;font-size:13px}button:disabled{opacity:.5;cursor:wait}.secondary{background:var(--soft);color:inherit}.hint{font-size:12px;margin:12px 0 0}nav{display:flex;justify-content:space-between;gap:16px;align-items:center;margin:30px 0 20px}nav input{max-width:240px}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs button{background:transparent;color:var(--muted)}.tabs button.active{background:var(--soft);color:var(--accent)}.group{overflow:hidden;margin-bottom:18px}.group-title{padding:16px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;font-size:14px}.group-title small{margin-top:4px}.row{display:flex;align-items:center;gap:15px;padding:17px 20px;border-bottom:1px solid var(--line)}.row:last-child{border:0}.row input[type=checkbox]{width:21px;height:21px;accent-color:var(--accent);cursor:pointer}.item-info{flex:1}.item-info b{font-size:14px}.price{text-align:right;font-weight:650;font-size:14px}.text-button{background:none;color:var(--muted);padding:7px;font-size:12px}.text-button:hover{color:var(--danger)}.empty{padding:60px 20px;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}.empty b{display:block;font-size:20px;color:var(--accent);margin-bottom:10px}footer{font-size:11px;color:var(--muted);margin-top:28px}dialog{width:480px;max-width:calc(100% - 28px);border:1px solid var(--line);border-radius:18px;padding:28px;background:var(--surface);color:inherit}dialog::backdrop{background:#142d2580;backdrop-filter:blur(3px)}.modal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.close{background:transparent;color:var(--muted);font-size:24px;padding:0 5px}.two{display:grid;grid-template-columns:1fr 1fr;gap:15px}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:26px;flex-wrap:wrap}.total{display:flex;justify-content:space-between;padding:18px;background:var(--soft);border-radius:9px;color:inherit}#warning:not(:empty){padding:12px 16px;background:var(--soft);border-left:3px solid var(--danger);font-size:13px;border-radius:6px}.negative{color:var(--danger)}[data-theme=dark]{color-scheme:dark;color:#e1ece5;background:#141e19;--surface:#1d2a23;--line:#35463c;--muted:#a3b5a9;--accent:#78b794;--soft:#293e30;--danger:#f29483}[data-theme=dark] button:not(.secondary):not(.text-button):not(.close){color:#11271a}@media(max-width:1000px){form#add{grid-template-columns:repeat(3,1fr)}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){main{padding:25px 16px}h1{font-size:29px}header{align-items:flex-start;flex-direction:column}.metrics{gap:8px}article{padding:15px}article strong,.money-input input{font-size:23px}form#add{grid-template-columns:1fr 1fr}nav{align-items:stretch;flex-direction:column}nav input{max-width:none}.row{padding:15px 12px;gap:10px}.group-title{padding:15px 12px}.price{max-width:115px}.panel{padding:18px}}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;color:#e1ece5;background:#141e19;--surface:#1d2a23;--line:#35463c;--muted:#a3b5a9;--accent:#78b794;--soft:#293e30;--danger:#f29483}:root:not([data-theme=light]) button:not(.secondary):not(.text-button):not(.close){color:#11271a}}
html{-webkit-text-size-adjust:100%}body{-webkit-tap-highlight-color:transparent}button,.tabs button{touch-action:manipulation}
@media(max-width:600px){
main{padding:max(16px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
header{gap:8px;margin-bottom:18px}h1{font-size:26px;letter-spacing:-1px;margin:6px 0}header p{font-size:13px;line-height:1.4}
input,select,textarea{font-size:16px;padding:12px}button{min-height:44px;padding:12px 16px;font-size:14px}
.panel{padding:14px;margin:14px 0;border-radius:12px}h2{font-size:17px;margin-bottom:12px}
.two{grid-template-columns:1fr}.panel .two>div[style]{display:grid!important;grid-template-columns:1fr 1fr}
.metrics{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}article{padding:12px;border-radius:12px}article strong{font-size:19px;margin:6px 0}article label{font-size:11px}.money-input{height:40px}.money-input input{font-size:19px;padding:0}.balance{grid-column:1/-1}
form#add{grid-template-columns:1fr 1fr;gap:10px}form#add label:nth-child(1),form#add label:nth-child(2),form#add button{grid-column:1/-1}form#add label:nth-child(3){grid-column:1/-1}
nav{position:sticky;top:0;z-index:5;background:var(--surface);margin:14px -12px;padding:8px 12px;border-bottom:1px solid var(--line);gap:8px}
.tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tabs button{white-space:nowrap;flex:1}
.row{flex-wrap:wrap;padding:14px 12px;gap:8px 12px}.row input[type=checkbox]{width:26px;height:26px;flex:none}.item-info{flex:1 1 0;min-width:0;overflow-wrap:anywhere}.price{max-width:none;flex:none}.text-button{min-height:36px;margin-left:auto;flex-basis:100%;text-align:right;padding:4px 0}
.group-title{flex-wrap:wrap;padding:12px}
dialog{width:100%;max-width:100%;margin:auto 0 0;border-radius:18px 18px 0 0;border-bottom:0;padding:20px 16px max(20px,env(safe-area-inset-bottom));max-height:92dvh}
.actions{flex-direction:column-reverse}.actions button{width:100%}
.empty{padding:36px 16px}footer{margin-bottom:8px}
}
@media(max-width:360px){.metrics{grid-template-columns:1fr}.balance{grid-column:auto}}
@media(pointer:coarse){input,select,textarea,.money-input input{font-size:16px}}
