:root,:root[data-theme=dark]{--bg:#0b0e14;--panel:#131722;--panel-2:#1a1f2e;--border:#232a3a;--text:#d7dce5;--muted:#8b93a7;--heading:#ffffff;--accent:#3b82f6;--green:#16c784;--red:#ea3943;--amber:#f0b90b;--overlay:rgba(0,0,0,.6);--shadow:rgba(0,0,0,.5);--hover:#222a3c}:root[data-theme=light]{--bg:#f4f6f9;--panel:#ffffff;--panel-2:#eef1f6;--border:#dde2ea;--text:#232a3a;--muted:#66708a;--heading:#0b0e14;--accent:#2563eb;--green:#0a9d6e;--red:#d92d3a;--amber:#b07d07;--overlay:rgba(15,23,42,.4);--shadow:rgba(15,23,42,.18);--hover:#e4e8f0}html{color-scheme:dark}html[data-theme=light]{color-scheme:light}.btn,.card,.help-modal,.panel,.sidebar,body,input,select,textarea{transition:background-color .18s ease,border-color .18s ease,color .18s ease}*{box-sizing:border-box}body,html{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.layout{display:flex;min-height:100vh}.sidebar{width:220px;background:var(--panel);border-right:1px solid var(--border);padding:20px 14px;position:-webkit-sticky;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.theme-toggle{margin-top:auto;display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;cursor:pointer;background:var(--panel-2);border:1px solid var(--border);color:var(--text);font-size:13px;font-weight:500;font-family:inherit}.theme-toggle:hover{background:var(--hover);border-color:var(--accent)}.theme-toggle svg{color:var(--muted);flex-shrink:0}.brand{font-weight:700;font-size:16px;margin-bottom:24px;color:var(--heading)}.brand small{display:block;color:var(--muted);font-weight:400;font-size:11px}.nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--text);margin-bottom:4px}.nav a:hover{background:var(--panel-2);text-decoration:none}.nav a svg{color:var(--muted);flex-shrink:0}.nav-sep{height:1px;background:var(--border);margin:12px 4px}.nav a:hover svg{color:var(--accent)}.btn svg{width:16px;height:16px}.main{flex:1 1;padding:28px 32px;max-width:1200px}h1{font-size:20px;margin:0 0 20px}h2{font-size:15px;margin:0 0 12px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-gap:14px;gap:14px;margin-bottom:28px}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:16px}.card .label{color:var(--muted);font-size:12px;margin-bottom:6px}.card .value{font-size:22px;font-weight:700}.panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:18px;margin-bottom:22px}table{width:100%;border-collapse:collapse;font-size:13px}td,th{text-align:left;padding:9px 10px;border-bottom:1px solid var(--border)}th{color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase}tr:last-child td{border-bottom:none}.btn{display:inline-flex;align-items:center;gap:6px;cursor:pointer;background:var(--panel-2);color:var(--text);border:1px solid var(--border);padding:8px 14px;border-radius:8px;font-size:13px;font-weight:500}.btn:hover{background:var(--hover)}.btn-primary:hover{background:var(--accent);filter:brightness(1.12)}.btn-danger:hover{background:var(--red);filter:brightness(1.12)}.btn-green:hover{background:var(--green);filter:brightness(1.06)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-danger{background:var(--red);border-color:var(--red);color:#fff}.btn-green{background:var(--green);border-color:var(--green);color:#04211a}.btn:disabled{opacity:.5;cursor:not-allowed}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600}.badge.on{background:rgba(22,199,132,.15);color:var(--green)}.badge.off{background:rgba(139,147,167,.15);color:var(--muted)}.badge.warn{background:rgba(240,185,11,.15);color:var(--amber)}.badge.err{background:rgba(234,57,67,.15);color:var(--red)}.pos{color:var(--green)}.neg{color:var(--red)}input,select,textarea{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 10px;font-size:13px;width:100%;font-family:inherit}textarea{min-height:120px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}label{display:block;font-size:12px;color:var(--muted);margin:12px 0 5px}.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));grid-gap:14px;gap:14px}.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:18px;flex-wrap:wrap}.hint{color:var(--muted);font-size:12px;margin-top:4px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.banner{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:8px;margin-bottom:16px;font-size:13px}.banner svg{width:18px;height:18px;flex-shrink:0}.banner.warn{background:rgba(240,185,11,.12);border:1px solid rgba(240,185,11,.3);color:var(--amber)}.banner.err{background:rgba(234,57,67,.12);border:1px solid rgba(234,57,67,.3);color:var(--red)}.banner.info{background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.3);color:var(--accent)}.mode-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-size:13px;font-weight:700;border:1px solid}.mode-badge .dot{width:9px;height:9px;border-radius:50%;background:currentColor}.mode-badge.live{color:var(--red);background:rgba(234,57,67,.12);border-color:rgba(234,57,67,.4)}.mode-badge.observe{color:var(--accent);background:rgba(59,130,246,.12);border-color:rgba(59,130,246,.4)}.mode-badge.live .dot{animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.help-btn{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:5px;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--panel-2);color:var(--muted);font-size:11px;font-weight:700;line-height:1;cursor:pointer;vertical-align:middle;flex-shrink:0}.help-btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}th .help-btn{width:15px;height:15px}.help-overlay{position:fixed;inset:0;z-index:100;background:var(--overlay);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:24px}.help-modal{background:var(--panel);border:1px solid var(--border);border-radius:14px;width:100%;max-width:620px;max-height:85vh;overflow-y:auto;padding:22px 24px;box-shadow:0 24px 60px var(--shadow)}.help-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.help-modal-head h3{margin:0;font-size:19px;color:var(--heading)}.help-short{font-size:14px;color:var(--text);background:var(--panel-2);border-left:3px solid var(--accent);padding:11px 13px;border-radius:6px;margin:0 0 16px}.help-body p{font-size:13.5px;line-height:1.75;color:var(--text);margin:0 0 12px}.help-body p:last-child{margin-bottom:0}.help-example{margin-top:14px;padding:12px 14px;background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.25);border-radius:8px;display:flex;flex-direction:column;gap:5px}.help-example-label{font-size:11px;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.5px}.help-related{margin-top:18px}.help-foot,.help-related-label{font-size:12px;color:var(--muted)}.help-related-label{display:block;margin-bottom:8px;font-weight:600}.help-related>div{display:flex;flex-wrap:wrap;gap:7px}.help-chip{cursor:pointer;background:var(--panel-2);border:1px solid var(--border);color:var(--text);font-size:12px;padding:5px 10px;border-radius:999px}.help-chip:hover{background:var(--hover);border-color:var(--accent)}.help-foot{margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}h2 .help-btn,label .help-btn{vertical-align:middle}.guide .panel h2{color:var(--heading);text-transform:none;letter-spacing:0;font-size:17px;margin-bottom:14px}.guide .guide-h3{color:var(--accent);font-size:14px;margin:20px 0 8px}.guide p{font-size:14px;line-height:1.8;color:var(--text);margin:0 0 12px}.guide-list{margin:0 0 8px;padding-left:20px}.guide-list li{font-size:14px;line-height:1.85;color:var(--text);margin-bottom:8px}.guide-steps{margin:0;padding-left:22px}.guide-steps li{font-size:14px;line-height:1.8;color:var(--text);margin-bottom:10px}.guide-list b,.guide-steps b{color:var(--heading)}.callout{margin-top:14px;padding:12px 15px;border-radius:8px;font-size:13.5px;line-height:1.7;background:rgba(240,185,11,.1);border:1px solid rgba(240,185,11,.28);color:var(--text)}.callout.info{background:rgba(59,130,246,.1);border-color:rgba(59,130,246,.28)}.guide .callout b{color:var(--heading)}