:root{--bg:#f3f5f9;--card:#fff;--ink:#14213d;--mut:#5b6785;--line:#e1e6f0;--pri:#0b5fff;--ok:#0f9d58;--bad:#d93025;--warn:#c77700;--nav:#0b1b3a}
*{box-sizing:border-box;min-width:0;overflow-wrap:anywhere}
html,body{margin:0;overflow-x:hidden;max-width:100%;background:var(--bg);color:var(--ink);font:15px/1.35 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-text-size-adjust:100%;touch-action:manipulation}
#app{min-height:100vh;display:flex;flex-direction:column;max-width:760px;margin:0 auto}
header{position:sticky;top:0;z-index:5;background:var(--nav);color:#fff;display:flex;align-items:center;gap:8px;padding:calc(8px + env(safe-area-inset-top)) 10px 8px}
header h1{font-size:16px;margin:0;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
header .bal{background:#ffffff22;border-radius:12px;padding:3px 9px;font-weight:600;font-size:13px}
header button{background:#ffffff22;color:#fff;border:0;border-radius:8px;padding:6px 9px;font-size:13px}
main{flex:1;padding:8px 8px 80px;display:flex;flex-direction:column;gap:8px}
nav{position:fixed;bottom:0;left:0;right:0;background:var(--nav);display:flex;justify-content:center;padding-bottom:env(safe-area-inset-bottom);z-index:6}
nav div{display:flex;width:100%;max-width:760px}
nav a{flex:1;text-align:center;color:#9fb0d6;padding:11px 2px;font-size:12.5px;text-decoration:none;font-weight:600}
nav a.on{color:#fff;box-shadow:inset 0 3px var(--pri)}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 10px}
.row{display:flex;align-items:center;gap:8px}.row>.grow{flex:1}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 10px}.kpi b{display:block;font-size:22px}.kpi span{color:var(--mut);font-size:12px}
.kpi.k-ok b{color:var(--ok)}.kpi.k-bad b{color:var(--bad)}.kpi.k-warn b{color:var(--warn)}.kpi.k-pri b{color:var(--pri)}
input,select,textarea,button{font:inherit;font-size:16px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=url],select,textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 9px;background:#fff;color:var(--ink)}
input[type=color]{width:44px;height:36px;border:1px solid var(--line);border-radius:8px;padding:2px;background:#fff}
textarea{resize:none;min-height:64px}
[hidden]{display:none!important}
.col{display:flex;flex-direction:column;gap:6px}
.b{flex:none;white-space:nowrap;display:inline-block;text-decoration:none;text-align:center;background:var(--pri);color:#fff;border:0;border-radius:8px;padding:9px 12px;font-weight:600}
.b.alt{background:#e8edf8;color:var(--ink)}.b.red{background:var(--bad)}.b:disabled{opacity:.5}
.chip{display:inline-block;white-space:nowrap;flex:none;border-radius:10px;padding:1px 8px;font-size:12px;font-weight:600;background:#e8edf8;color:var(--mut)}
.c-ok{background:#d9f2e4;color:#0a6b3b}.c-bad{background:#fbdcd9;color:#a1160c}.c-warn{background:#fdebc8;color:#8a5200}.c-pri{background:#dbe7ff;color:#0a3fa8}
.item{display:flex;gap:8px;align-items:center;padding:8px 10px;background:var(--card);border:1px solid var(--line);border-radius:10px;text-decoration:none;color:inherit}
.item img{width:36px;height:36px;border-radius:8px;flex:none}.item .t{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item .s{font-size:12.5px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.item input[type=checkbox]{width:20px;height:20px;flex:none}
.bar{position:sticky;top:46px;z-index:4;background:#fff;border:1px solid var(--bad);border-radius:10px;padding:6px 10px;display:flex;gap:8px;align-items:center}
.seg{display:flex;background:#e8edf8;border-radius:9px;padding:2px}.seg a{flex:1;text-align:center;padding:7px 2px;border-radius:7px;font-weight:600;font-size:13px;color:var(--mut);text-decoration:none}.seg a.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px #0002}
.sug{border:1px solid var(--line);border-radius:8px;background:#fff;max-height:220px;overflow:auto}.sug div{padding:9px 10px;border-bottom:1px solid var(--line)}.sug div:last-child{border:0}
.chk{display:flex;gap:8px;align-items:flex-start;padding:5px 0;border-bottom:1px solid var(--line)}.chk:last-child{border:0}.chk .d{font-size:12.5px;color:var(--mut)}
.neg{color:var(--bad);font-weight:600}.pos{color:var(--ok);font-weight:600}
pre{margin:0;white-space:pre-wrap;word-break:break-all;font-size:12px;background:#f3f5f9;border-radius:8px;padding:8px}
.login{margin:auto;width:100%;padding:16px;display:flex;flex-direction:column;gap:8px}
.err{color:var(--bad);font-size:13px}.toast{position:fixed;left:8px;right:8px;bottom:70px;background:#14213d;color:#fff;border-radius:10px;padding:10px;z-index:9;text-align:center}
.sk{color:var(--mut);text-align:center;padding:10px;font-size:13px}.lbl{font-size:12px;color:var(--mut);font-weight:600;margin:2px 0 0}
.ph{border:1px dashed var(--warn);background:#fff8e9;border-radius:10px;padding:8px 10px;color:#8a5200;font-weight:600}
.item .s.w{white-space:normal;overflow:visible}
