:root{
  --bg:#f4f5f7;--card:#fff;--line:#e3e5e9;--text:#1c1f24;--sub:#5d6470;--mute:#8a919c;
  --accent:#2563eb;--accent-bg:#e7efff;
  --ok:#15803d;--ok-bg:#e6f4ea;--warn:#b45309;--warn-bg:#fdf1dc;--bad:#b91c1c;--bad-bg:#fdeaea;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#14161a;--card:#1d2026;--line:#2d323b;--text:#eceef2;--sub:#a4abb7;--mute:#7b8290;
    --accent:#6ea0ff;--accent-bg:#1e2c4a;--ok:#5fd18a;--ok-bg:#16301f;--warn:#f0b35a;--warn-bg:#3a2d14;--bad:#f28b8b;--bad-bg:#3b1c1c}
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:Tahoma,"Segoe UI",system-ui,sans-serif;line-height:1.7;font-size:15px}
.page{max-width:520px;margin:0 auto;padding:24px 16px 40px}
.head{text-align:center;margin:8px 0 20px}
.logo{width:48px;height:48px;border-radius:14px;background:var(--accent-bg);color:var(--accent);display:inline-flex;align-items:center;justify-content:center}
h1{font-size:20px;font-weight:600;margin:10px 0 2px}
.sub{margin:0;font-size:13px;color:var(--sub)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
textarea{width:100%;font:12px/1.5 Consolas,"Courier New",monospace;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px;resize:none}
textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
button{width:100%;margin-top:6px;font:inherit;font-weight:600;color:#fff;background:var(--accent);border:0;border-radius:10px;padding:11px;cursor:pointer}
button:disabled{opacity:.6;cursor:wait}
@media (prefers-color-scheme:dark){button{color:#0b1020}}
.err{min-height:22px;margin-top:4px;font-size:13px;color:var(--bad)}
#res{margin-top:14px}
.top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}
.name{font-weight:600;word-break:break-all}
.badge{font-size:12px;font-weight:600;padding:3px 10px;border-radius:8px;white-space:nowrap}
.s-active{background:var(--ok-bg);color:var(--ok)}
.s-low{background:var(--warn-bg);color:var(--warn)}
.s-expired,.s-no_data,.s-disabled{background:var(--bad-bg);color:var(--bad)}
.row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:13px;color:var(--sub);margin:0 0 6px}
.row b{color:var(--text);font-weight:600}
.bar{height:8px;border-radius:4px;background:var(--bg);border:1px solid var(--line);overflow:hidden;margin-bottom:16px}
.bar>div{height:100%;border-radius:4px}
.c-ok{background:var(--ok)}.c-warn{background:var(--warn)}.c-bad{background:var(--bad)}.c-inf{background:var(--accent)}
.foot{border-top:1px solid var(--line);padding-top:10px;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--sub)}
.msg{text-align:center}
.msg p{margin:4px 0 0;font-size:13px;color:var(--sub)}
.act{display:block;text-align:center;margin-top:12px;font-size:13px;color:var(--accent);text-decoration:none}
.note{text-align:center;font-size:12px;color:var(--mute);margin:14px 0 0}
.note a{color:var(--accent);text-decoration:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
