:root{color-scheme:dark;--bg:#090d12;--panel:#111923;--card:#18232f;--line:#2b3948;--text:#f2f6fa;--muted:#8fa2b7;--yellow:#f2c318;--green:#19d37e;--red:#ff324a;--cyan:#49c4ee;font-family:"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -20%,#21303e 0,#090d12 42%);color:var(--text);min-height:100vh}header{height:82px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1080px)/2));background:rgba(9,13,18,.9)}.brand{display:flex;align-items:center;gap:13px}.mark{border:2px solid var(--text);border-radius:50%;width:48px;height:48px;display:grid;place-items:center;font-size:18px;font-weight:900}.brand strong,.brand small{display:block;letter-spacing:.12em}.brand small{font-size:11px;color:var(--yellow);margin-top:3px}.live{font-size:13px;font-weight:700;color:var(--green)}.live i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);margin-right:7px}main{width:min(1080px,calc(100% - 32px));margin:30px auto 60px}.status-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.status-grid article{position:relative;min-height:128px;background:linear-gradient(145deg,#192532,#111923);border:1px solid var(--line);border-top:3px solid var(--yellow);padding:20px}.status-grid span{font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.1em}.status-grid strong{display:block;margin:10px 0 5px;font-size:20px}.status-grid small{color:var(--muted)}.green{color:var(--green)}.yellow{color:var(--yellow)}.capacity{height:4px;background:#283541;margin-top:15px}.capacity i{display:block;width:26%;height:100%;background:var(--yellow)}.toolbar{display:flex;align-items:flex-end;justify-content:space-between;margin:34px 0 14px}.toolbar h1{margin:0;font-size:29px}.toolbar p{margin:5px 0 0;color:var(--muted)}button{border:1px solid #536273;background:#263444;color:var(--text);border-radius:5px;min-height:42px;padding:0 18px;font:700 14px inherit;cursor:pointer}button:hover:not(:disabled){border-color:var(--cyan);background:#304255}button:disabled{opacity:.35;cursor:not-allowed}.stop{border-color:#7d6713;color:var(--yellow)}.danger{border-color:#7a2a37;color:#ff8796}.log-panel{border:1px solid var(--line);background:rgba(17,25,35,.94)}.table-head,.log-row{display:grid;grid-template-columns:minmax(230px,1fr) 150px 120px 155px;align-items:center;padding:0 18px}.table-head{height:42px;background:#18232f;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.08em}.log-row{min-height:72px;border-top:1px solid var(--line)}.file{display:flex;align-items:center;gap:13px}.file input{accent-color:var(--yellow);width:18px;height:18px}.file strong,.file small{display:block}.file small,.meta{color:var(--muted);margin-top:4px}.log-row button{justify-self:end;min-height:36px}.actions{display:flex;align-items:center;justify-content:space-between;margin-top:18px}.actions>span,.note{font-size:14px;color:var(--muted)}.actions div{display:flex;gap:9px}.note{text-align:right}.empty{padding:50px;text-align:center;color:var(--muted)}.modal{position:fixed;inset:0;background:rgba(0,0,0,.75);display:grid;place-items:center;padding:20px}.modal[hidden],.toast[hidden]{display:none}.modal>div{width:min(430px,100%);background:#18232f;border:1px solid #536273;border-top:4px solid var(--red);padding:25px}.modal h2{margin-top:0}.modal p{color:var(--muted);line-height:1.5}.modal>div>div{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:#263444;border:1px solid var(--green);padding:13px 20px;border-radius:5px;box-shadow:0 10px 30px #000}
@media(max-width:720px){header{height:70px;padding:0 16px}.mark{width:42px;height:42px}.status-grid{grid-template-columns:1fr}.status-grid article{min-height:106px}.toolbar{align-items:center}.toolbar h1{font-size:24px}.table-head{display:none}.log-row{grid-template-columns:1fr auto;padding:15px}.log-row>.meta{grid-column:1;margin-left:31px}.log-row button{grid-column:2;grid-row:1/3}.actions{align-items:flex-start;gap:15px}.actions div{flex-direction:column}.note{text-align:left}.brand strong{font-size:14px}}
.open-log{border-color:#46657a;color:#bdeeff}.back{background:transparent;border:0;padding:0;color:var(--cyan);margin-bottom:24px}.analysis-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:22px}.analysis-head h1{font-size:32px;margin:5px 0}.analysis-head p,.chart-toolbar p{color:var(--muted);margin:4px 0}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.13em;color:var(--yellow)}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.summary-grid article{background:var(--card);border:1px solid var(--line);padding:17px;border-left:3px solid var(--yellow)}.summary-grid span,.summary-grid small{display:block;color:var(--muted);font-size:12px}.summary-grid strong{display:block;font-size:23px;margin:7px 0}.chart-panel,.events-panel{background:rgba(17,25,35,.95);border:1px solid var(--line);padding:20px;margin-top:16px}.chart-toolbar{display:flex;justify-content:space-between;align-items:center}.chart-toolbar h2,.events-panel h2{margin:0;font-size:20px}.zoom{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.zoom input{accent-color:var(--yellow)}.channel-row{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.channel-chip{border:1px solid var(--line);background:#111923;color:var(--muted);border-radius:20px;padding:7px 12px;cursor:pointer;font-size:13px}.channel-chip input{display:none}.channel-chip:has(input:checked){border-color:var(--chip);color:var(--text);box-shadow:inset 0 0 0 1px var(--chip)}.canvas-wrap{position:relative;width:100%;height:430px}.canvas-wrap canvas{display:block;width:100%;height:100%;cursor:crosshair}.chart-tooltip{position:absolute;pointer-events:none;min-width:155px;background:#091018ed;border:1px solid #5c6b7b;padding:10px;font-size:12px;line-height:1.55;box-shadow:0 8px 25px #000}.chart-tooltip strong{color:var(--yellow)}.timeline{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin:3px 10px 0 48px}.event-row{display:grid;grid-template-columns:95px 1fr auto;gap:15px;padding:14px 4px;border-top:1px solid var(--line);align-items:center}.event-row:first-child{margin-top:12px}.event-row time{color:var(--muted)}.event-row b.warning{color:var(--yellow)}.event-row b.critical{color:var(--red)}
@media(max-width:720px){.analysis-head{align-items:flex-start;gap:15px}.analysis-head h1{font-size:24px}.summary-grid{grid-template-columns:repeat(2,1fr)}.chart-panel{padding:12px}.chart-toolbar{align-items:flex-start;gap:12px}.canvas-wrap{height:350px}.event-row{grid-template-columns:70px 1fr}.event-row b{grid-column:2}.analysis-head button{padding:0 10px}.timeline{margin-left:35px}}
.connection{display:flex;align-items:center;gap:14px}.connection button{min-height:38px}.live.offline{color:var(--muted)}.live.offline i{background:#657587;box-shadow:none}.status-grid{grid-template-columns:repeat(4,1fr)}
@media(max-width:720px){.connection{gap:8px}.connection .live{display:none}.connection button{padding:0 11px}.status-grid{grid-template-columns:1fr}}
