:root{--bg:#fff;--fg:#222;--mut:#666;--line:#ccc;--ok:#22aa66;--okbg:#dfd;--errbg:#fdd;--chip:#eee}
@media (prefers-color-scheme:dark){
 :root{--bg:#161a18;--fg:#eee;--mut:#9aa;--line:#444;--okbg:#17321f;--errbg:#3a1b1b;--chip:#2a2f2c}
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:18px system-ui,sans-serif}
main{max-width:560px;margin:auto;padding:16px;padding-bottom:calc(16px + env(safe-area-inset-bottom))}
h1{font-size:26px;margin:0 0 4px}
h2{margin:8px 0 2px}
.small{font-size:14px;color:var(--mut)}
.card{border:1px solid var(--line);border-radius:12px;padding:14px;margin:10px 0}
.acc{cursor:pointer;font-weight:600}
.role{font-size:13px;background:var(--chip);border-radius:8px;padding:2px 8px;margin-left:8px;font-weight:400}
button,input,select{font:inherit;color:inherit;background:var(--bg);padding:14px;width:100%;margin:6px 0;border-radius:10px;border:1px solid var(--line)}
button.main{background:var(--ok);color:#fff;border:0}
button.back{width:auto;padding:8px 14px;margin:0 0 8px}
button:disabled{opacity:.6}
.seg{display:flex;gap:8px}
.seg button.on{background:var(--fg);color:var(--bg)}
.cats{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.cats button{width:auto;padding:12px 16px;margin:0}
.cats button.on{background:var(--ok);color:#fff;border-color:var(--ok)}
#amount{font-size:32px;text-align:center}
.msg{padding:10px;border-radius:8px;margin:10px 0}
.err{background:var(--errbg)}.ok{background:var(--okbg)}
.row{display:flex;justify-content:space-between;gap:8px}
.neg{color:#d33}.pos{color:#2a2}
details{margin:8px 0}
summary{padding:8px 0;color:var(--mut)}
pre{white-space:pre-wrap;font-size:13px}
.dbg{margin-top:24px}
[hidden]{display:none!important}