:root{color-scheme:light;--bg: #eef1f4;--panel: #ffffff;--panel-soft: #f7f8fa;--text: #17202a;--muted: #64717f;--line: #d8dde3;--accent: #176c76;--accent-strong: #0f535b;--danger: #b42318;--ok: #1f7a4d;--warn: #b7791f}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button{font:inherit}.app-shell{display:grid;grid-template-columns:288px 1fr;min-height:100vh}.sidebar{display:flex;flex-direction:column;gap:22px;border-right:1px solid var(--line);background:#fbfcfd;padding:22px}.brand{display:flex;align-items:center;gap:12px}.brand strong,.brand span{display:block}.brand span{color:var(--muted);font-size:12px}.role-switch{display:grid;grid-template-columns:1fr;gap:6px}.role-switch button,.channel-list button{min-height:38px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--text);text-align:left;cursor:pointer}.role-switch button{padding:8px 10px}.role-switch button.active,.channel-list button.selected{border-color:var(--line);background:var(--panel)}.channel-list{display:grid;gap:8px}.channel-list button{display:flex;align-items:center;gap:10px;padding:10px}.status-dot{width:10px;height:10px;flex:0 0 auto;border-radius:999px;background:var(--muted)}.status-dot.running{background:var(--ok)}.status-dot.starting{background:var(--warn)}.status-dot.error{background:var(--danger)}.workspace{min-width:0;padding:24px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.eyebrow{color:var(--accent);font-size:12px;font-weight:700;text-transform:uppercase}h1,h2{margin:0;letter-spacing:0}h1{font-size:28px}h2{font-size:15px}.actions{display:flex;gap:8px}.icon-button{display:inline-flex;width:40px;height:40px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--text);cursor:pointer}.icon-button.primary{background:var(--accent);color:#fff}.icon-button.danger{color:var(--danger)}.icon-button:disabled{cursor:not-allowed;opacity:.45}.content-grid{display:grid;grid-template-columns:minmax(320px,1.3fr) minmax(260px,.8fr);gap:16px}.content-grid.two{grid-template-columns:repeat(2,minmax(280px,1fr))}.panel{min-width:0;border:1px solid var(--line);border-radius:8px;background:var(--panel);padding:16px}.panel-title{display:flex;align-items:center;gap:8px;margin-bottom:14px}.preview-panel{grid-row:span 2}.preview-surface{display:grid;min-height:360px;place-items:center;border-radius:6px;background:linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.08) 1px,transparent 1px),#1d252d;background-size:32px 32px;color:#fff}.preview-surface span{align-self:start;border-radius:4px;background:#00000073;padding:5px 8px;font-size:12px;font-weight:700}.telemetry{display:grid;gap:10px}.telemetry div,.details div{display:flex;min-height:36px;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.telemetry div:last-child,.details div:last-child{border-bottom:0}.telemetry span,.details dt{color:var(--muted)}.details{margin:0}.details dd{margin:0;max-width:65%;overflow-wrap:anywhere;text-align:right;font-weight:700}.signal-path{display:grid;gap:8px}.signal-node{display:flex;min-height:38px;align-items:center;gap:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel-soft);padding:8px 10px;color:var(--muted)}.signal-node.active{border-color:#1f7a4d59;background:#1f7a4d14;color:var(--ok)}.meter-block{display:grid;gap:8px;margin-bottom:18px}.meter{height:12px;overflow:hidden;border-radius:999px;background:var(--line)}.meter i{display:block;height:100%;background:var(--accent)}.empty-state{border:1px dashed var(--line);border-radius:8px;padding:24px;color:var(--muted)}@media(max-width:900px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.content-grid,.content-grid.two{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}}