@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--primary:#5e6ad2;--primary-hover:#828fff;--primary-focus:#5e69d1;--on-primary:#fff;--ink:#f7f8f8;--ink-muted:#d0d6e0;--ink-subtle:#8a8f98;--ink-tertiary:#62666d;--canvas:#010102;--surface-1:#0f1011;--surface-2:#141516;--surface-3:#18191a;--surface-4:#191a1b;--hairline:#23252a;--hairline-strong:#34343a;--hairline-t:#3e3e44;--success:#27a644;--error:#e5484d;--warning:#f59e0b;--r-xs:4px;--r-sm:6px;--r-md:8px;--r-lg:12px;--r-xl:16px;--r-xxl:24px;--r-pill:9999px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--canvas);color:var(--ink);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px}.app{flex-direction:column;min-height:100vh;display:flex}.header{background:var(--canvas);border-bottom:1px solid var(--hairline);z-index:100;justify-content:space-between;align-items:center;height:56px;padding:0 28px;display:flex;position:sticky;top:0}.header-left{align-items:center;gap:12px;display:flex}.logo{color:var(--ink);letter-spacing:-.4px;font-size:15px;font-weight:600}.logo-dot{color:var(--primary)}.ws-badge{border-radius:var(--r-pill);padding:2px 8px;font-size:11px;font-weight:500}.ws-badge.connected{color:var(--success);background:#27a64426;border:1px solid #27a64440}.ws-badge.disconnected{color:var(--error);background:#e5484d1a;border:1px solid #e5484d33}.tabs{gap:2px;display:flex}.tab{color:var(--ink-subtle);border-radius:var(--r-pill);cursor:pointer;letter-spacing:0;background:0 0;border:none;padding:6px 14px;font-family:inherit;font-size:14px;font-weight:500;transition:all .12s}.tab:hover{background:var(--surface-2);color:var(--ink-muted)}.tab.active{background:var(--surface-2);color:var(--ink)}.main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:32px 28px}.section{flex-direction:column;gap:16px;display:flex}.card{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:20px 24px}.card-elevated{background:var(--surface-2);border:1px solid var(--hairline-strong);border-radius:var(--r-lg);padding:20px 24px}.card-screenshot{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-xl);padding:20px 24px}.card-title{letter-spacing:.5px;text-transform:uppercase;color:var(--ink-tertiary);margin-bottom:8px;font-size:11px;font-weight:500}.stat-val{letter-spacing:-.8px;color:var(--ink);font-size:28px;font-weight:600;line-height:1.15}.stat-sub{color:var(--ink-subtle);margin-top:5px;font-size:12px}.grid-2{grid-template-columns:1fr 1fr;gap:12px;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.green{color:var(--success)}.red{color:var(--error)}.yellow{color:var(--warning)}.lavender{color:var(--primary-hover)}.gray{color:var(--ink-subtle)}.muted{color:var(--ink-muted)}.badge{border-radius:var(--r-pill);letter-spacing:.2px;white-space:nowrap;align-items:center;gap:3px;padding:2px 8px;font-size:11px;font-weight:500;display:inline-flex}.badge-up{color:var(--success);background:#27a64426;border:1px solid #27a64440}.badge-down{color:var(--error);background:#e5484d1f;border:1px solid #e5484d38}.badge-idle{background:var(--surface-2);color:var(--ink-subtle);border:1px solid var(--hairline)}.badge-running{color:var(--success);background:#27a64426;border:1px solid #27a64440}.badge-dry{color:var(--primary-hover);background:#5e6ad226;border:1px solid #5e6ad24d}.badge-live{color:var(--error);background:#e5484d1f;border:1px solid #e5484d38}.badge-entry{color:var(--primary-hover);background:#5e6ad233;border:1px solid #5e6ad266}.btn{border-radius:var(--r-md);cursor:pointer;letter-spacing:0;border:none;align-items:center;gap:6px;padding:8px 14px;font-family:inherit;font-size:14px;font-weight:500;line-height:1.2;transition:all .12s;display:inline-flex}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--surface-1);color:var(--ink);border:1px solid var(--hairline)}.btn-secondary:hover{background:var(--surface-2);border-color:var(--hairline-strong)}.btn-danger{color:var(--error);background:#e5484d1f;border:1px solid #e5484d40}.btn-danger:hover{background:#e5484d33}.btn:disabled{opacity:.35;cursor:not-allowed}.btn-green{background:var(--primary);color:var(--on-primary)}.btn-green:hover{background:var(--primary-hover)}.btn-red{color:var(--error);background:#e5484d1f;border:1px solid #e5484d40}.btn-red:hover{background:#e5484d33}.btn-blue{background:var(--primary);color:var(--on-primary)}.btn-blue:hover{background:var(--primary-hover)}.signal-box{background:var(--canvas);border:1px solid var(--hairline);border-radius:var(--r-md);color:var(--ink-muted);word-break:break-word;min-height:40px;padding:10px 14px;font-family:JetBrains Mono,SF Mono,Menlo,monospace;font-size:12px;line-height:1.6}.toggle-row{align-items:center;gap:10px;display:flex}.toggle{cursor:pointer;width:36px;height:20px;position:relative}.toggle input{opacity:0;width:0;height:0}.slider{background:var(--surface-3);border:1px solid var(--hairline);border-radius:20px;transition:all .15s;position:absolute;inset:0}.slider:before{content:"";background:var(--ink-subtle);border-radius:50%;width:14px;height:14px;transition:all .15s;position:absolute;top:2px;left:2px}input:checked+.slider{background:var(--primary);border-color:var(--primary)}input:checked+.slider:before{background:#fff;transform:translate(16px)}.input-field{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-md);width:100%;color:var(--ink);letter-spacing:0;outline:none;padding:8px 12px;font-family:inherit;font-size:14px;transition:border .12s}.input-field::placeholder{color:var(--ink-tertiary)}.input-field:focus{border-color:var(--primary-focus);box-shadow:0 0 0 2px #5e6ad226}.input-label{color:var(--ink-subtle);margin-bottom:6px;font-size:12px;font-weight:500}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%}th{text-align:left;color:var(--ink-tertiary);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--hairline);padding:8px 14px;font-size:11px;font-weight:500}td{border-bottom:1px solid var(--hairline);color:var(--ink-muted);padding:11px 14px;font-size:13px}tr:last-child td{border-bottom:none}tr:hover td{background:var(--surface-2)}.timer-bar-wrap{background:var(--surface-3);border-radius:2px;height:3px;margin-top:10px;overflow:hidden}.timer-bar{border-radius:2px;height:100%;transition:width .5s linear}.profile-select{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--r-md);color:var(--ink);cursor:pointer;outline:none;padding:8px 12px;font-family:inherit;font-size:14px}.profile-select:focus{border-color:var(--primary-focus)}.warn-banner{border-radius:var(--r-md);color:var(--error);background:#e5484d14;border:1px solid #e5484d33;padding:9px 14px;font-size:12px}.divider{border:none;border-top:1px solid var(--hairline);margin:4px 0}.stat-card-primary{background:linear-gradient(135deg,#5e6ad22e 0%,#5e6ad20f 100%);border:1px solid #5e6ad240}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--hairline-strong);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--hairline-t)}