:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:light;--bg:#f2f5f8;--card:#fff;--text:#172c40;--muted:#708093;--line:#e3eaf0;--accent:#167b70;--soft:#e5f3ee;--danger:#b63a45;--danger-bg:#fcebee;--warning:#96701c;--shadow:0 5px 22px #1c354308}
:root[data-theme=dark]{color-scheme:dark;--bg:#111b25;--card:#1b2937;--text:#ecf2f6;--muted:#a4b4c3;--line:#2e4051;--accent:#6ed4bb;--soft:#203e3a;--danger:#ff9da8;--danger-bg:#452832;--warning:#ecc875;--shadow:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}main{max-width:660px;margin:auto;padding:24px 18px calc(28px + env(safe-area-inset-bottom))}header{display:flex;justify-content:space-between;align-items:center;margin:6px 0 25px}h1{font-size:32px;letter-spacing:-1px;margin:5px 0}header p{margin:0;color:var(--muted);font-size:14px}.eyebrow{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:2px}.brand{width:54px;height:54px;border-radius:19px;background:var(--soft);color:var(--accent);font-size:42px;text-align:center}h2{font-size:18px;margin:0 0 12px}p{line-height:1.55}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{border:0;border-radius:12px;background:var(--accent);color:var(--bg);padding:12px 16px;min-height:44px;font-weight:650;cursor:pointer}button:disabled{opacity:.42;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.secondary{background:var(--bg);color:var(--text)}.card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px;margin-bottom:14px;box-shadow:var(--shadow)}.connection{background:var(--soft);color:var(--accent);border-radius:12px;padding:12px;text-align:center;font-size:13px;font-weight:600}.connection.offline{background:var(--danger-bg);color:var(--danger)}nav{display:flex;gap:4px;background:var(--line);padding:4px;border-radius:15px;margin:20px 0}nav button{flex:1;background:transparent;color:var(--muted);padding:10px 6px;font-size:13px}nav button[aria-pressed=true]{background:var(--card);color:var(--text);box-shadow:var(--shadow)}.environment{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}.environment div{padding:12px 16px;border-left:2px solid var(--line)}.environment span,.metric span{display:block;color:var(--muted);font-size:12px}.environment strong{display:block;margin-top:5px;font-size:18px}.unit-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.unit-head h2{margin:0;font-size:22px}.status{font-size:12px;padding:7px 10px;border-radius:9px;background:var(--bg);color:var(--muted)}.status.running{background:var(--soft);color:var(--accent)}.status.error{background:var(--danger-bg);color:var(--danger)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px}.metric strong{display:block;margin-top:7px;font-size:21px;font-weight:600}.actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.actions .reset{grid-column:1/-1;background:transparent;border:1px solid var(--line);color:var(--muted)}.actions .stop{background:var(--danger-bg);color:var(--danger)}.muted{color:var(--muted);font-size:13px}.alarm{border-left:3px solid var(--danger);font-size:14px}.alarm.warning{border-left-color:var(--warning)}.alarm small{display:block;margin-bottom:7px;color:var(--muted)}label{display:block;font-size:14px;margin:15px 0 8px}select{width:100%;padding:12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--text)}footer{display:flex;align-items:center;flex-direction:column;gap:12px;margin:24px 0 0}footer span{font-size:12px;color:var(--muted)}#notice{position:fixed;bottom:20px;left:18px;right:18px;max-width:624px;margin:auto;border:1px solid var(--line);padding:16px;border-radius:14px;background:var(--card);box-shadow:0 4px 35px #0003;font-size:14px;z-index:5}dialog{background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:22px;padding:25px;width:calc(100% - 36px);max-width:440px}dialog::backdrop{background:#051526a0}dialog h2{margin-top:14px;font-size:24px}.dialog-actions{display:flex;gap:10px;margin-top:24px}.dialog-actions button{flex:1}[hidden]{display:none!important}#open-bot{display:inline-block;color:var(--accent);font-weight:650;margin:8px 0}.section-title{margin:22px 0 15px}@media(max-width:350px){main{padding-left:12px;padding-right:12px}.metric strong{font-size:17px}.card{padding:16px}}