
:root{--bg:#f6f7f2;--card:#fff;--text:#1c1d19;--dim:#6b6d63;--acc:#4f6b2f;--warn:#a26b00;--bad:#b3261e;--line:#e2e4da}
@media (prefers-color-scheme:dark){:root{--bg:#121410;--card:#1d201a;--text:#e4e6dc;--dim:#a0a395;--acc:#b5d48c;--warn:#e9c46a;--bad:#f2b8b5;--line:#2c3027}}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.4 system-ui,sans-serif;padding:16px;max-width:560px;margin:auto}
h1{font-size:18px;margin:4px 0 14px;display:flex;justify-content:space-between;align-items:center}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:12px}
.row{display:flex;justify-content:space-between;gap:10px;padding:3px 0}.dim{color:var(--dim)}.k{color:var(--dim)}
.bar{height:8px;border-radius:4px;background:var(--line);overflow:hidden;margin:6px 0 2px}.bar i{display:block;height:100%;width:0;background:var(--acc)}
.on{color:var(--acc);font-weight:600}.warn{color:var(--warn)}.bad{color:var(--bad)}
button{font:inherit;border:0;border-radius:12px;padding:12px 14px;background:var(--line);color:var(--text);flex:1}
button.acc{background:var(--acc);color:var(--bg)}.btns{display:flex;gap:8px;flex-wrap:wrap}
input{font:inherit;width:100%;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);margin:8px 0}
small{color:var(--dim)}
.bar i.w{background:var(--warn)}.bar i.b{background:var(--bad)}.bar{margin-bottom:8px}
button.danger{background:var(--bad);color:var(--bg)}
.pk{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 0}.pk button{flex:0;padding:6px 10px}
