:root{--bg:#0a0a0a;--surface:#111;--surface-hover:#1a1a1a;--border:#222;--text:#ededed;--muted:#888;--accent:#00e5ff;--accent-dim:#00e5ff1f;--accent-glow:#00e5ff0f;--gradient-start:#00d2ff;--gradient-end:#9d50bb;--green:#4ade80;--radius:12px;--radius-sm:6px;--font:"Geist", system-ui, -apple-system, sans-serif;--font-mono:"Geist Mono", ui-monospace, monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:15px}body{font-family:var(--font);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6}#app{max-width:1120px;min-height:100vh;margin:0 auto;padding:32px 24px}.state-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:70vh;display:flex}.state-screen h2{letter-spacing:-.01em;font-size:1.4rem;font-weight:600}.landing{gap:20px}.landing-logo{filter:drop-shadow(0 0 24px #00d2ff4d);width:80px;height:auto;margin-bottom:4px;animation:3s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,to{filter:drop-shadow(0 0 24px #00d2ff4d)}50%{filter:drop-shadow(0 0 36px #00d2ff80)drop-shadow(0 0 60px #9d50bb26)}}.landing h1{letter-spacing:-.03em;font-size:2.6rem;font-weight:300}.landing h1 .accent{background:linear-gradient(135deg, var(--gradient-start), var(--gradient-end));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-weight:400}.landing .tagline{color:var(--muted);max-width:340px;font-size:1rem;line-height:1.5}.landing .hint{color:var(--muted);opacity:.6;font-size:.8rem;font-family:var(--font-mono);margin-top:8px}.accent{color:var(--accent)}.spinner{border:2.5px solid var(--border);border-top-color:var(--accent);width:36px;height:36px;box-shadow:0 0 16px var(--accent-glow);border-right-color:#9d50bb80;border-radius:50%;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.session-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;padding-bottom:20px;animation:.4s ease-out both fade-in;display:flex}.header-left h1{letter-spacing:-.02em;font-size:1.5rem;font-weight:500}.header-left .muted{font-family:var(--font-mono);font-size:.8rem}.header-right{flex-wrap:wrap;gap:12px 24px;display:flex}.meta-item{flex-direction:column;gap:3px;display:flex}.meta-item .label,.label{text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-size:.65rem;font-family:var(--font-mono)}.meta-item span:last-child{font-size:.9rem;font-family:var(--font-mono)}.meta-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;display:grid}.meta-grid .meta-item{background:var(--bg);border-radius:var(--radius-sm);border:1px solid var(--border);padding:12px 14px;transition:border-color .2s,box-shadow .2s}.meta-grid .meta-item:hover{border-color:#333;box-shadow:0 0 16px #00e5ff0a}.tags{flex-wrap:wrap;gap:6px;margin-bottom:16px;display:flex}.tag{background:var(--accent-dim);color:var(--accent);font-size:.75rem;font-family:var(--font-mono);letter-spacing:.02em;border-radius:9999px;padding:3px 12px;transition:background .2s,box-shadow .2s}.tag:hover{background:#00e5ff2e;box-shadow:0 0 12px #00e5ff1a}.tag-trigger{color:#facc15;background:#facc151f}.tag-trigger:hover{background:#facc1533;box-shadow:0 0 12px #facc151a}.tag-artifact{color:#f472b6;background:#f472b61f}.tag-artifact:hover{background:#f472b633;box-shadow:0 0 12px #f472b61a}.note{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:20px;padding:14px 18px;font-size:.9rem;line-height:1.5}.note .label{margin-right:8px}@keyframes fade-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.5s ease-out both fade-in}.chart-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:16px;padding:20px;transition:border-color .3s,box-shadow .3s;position:relative}.chart-section:before{content:"";border-radius:var(--radius);background:linear-gradient(135deg, transparent 40%, var(--accent-dim) 100%);-webkit-mask-composite:xor;opacity:0;pointer-events:none;padding:1px;transition:opacity .3s;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.chart-section:hover{border-color:#333;box-shadow:0 0 30px #00e5ff08}.chart-section:hover:before{opacity:1}.chart-section h2{letter-spacing:-.01em;margin-bottom:10px;font-size:.95rem;font-weight:500}.section-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;display:flex}.chart-hint{color:var(--muted);font-size:.72rem;font-family:var(--font-mono);opacity:.6}.chart-canvas{border-radius:var(--radius-sm);width:100%;height:220px;display:block}.chart-canvas.tall{height:360px}.chart-canvas.square{height:280px}.row{gap:16px;display:flex}.chart-half{flex:1;min-width:0}.time-nav{align-items:center;gap:8px;margin-top:12px;display:flex}.time-nav input[type=range]{appearance:none;background:var(--border);border-radius:2px;outline:none;flex:1;height:4px}.time-nav input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;width:14px;height:14px;box-shadow:0 0 8px var(--accent-glow);border:none;border-radius:50%}.time-nav input[type=range]::-moz-range-thumb{background:var(--accent);cursor:pointer;border:none;border-radius:50%;width:14px;height:14px}.btn-icon{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;width:30px;height:30px;font-size:.7rem;transition:all .15s;display:flex}.btn-icon:hover{background:var(--surface-hover);border-color:var(--accent);color:var(--accent)}select,.ch-select{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);font-family:var(--font-mono);cursor:pointer;padding:5px 10px;font-size:.8rem;transition:border-color .15s}select:hover{border-color:#444}select:focus{border-color:var(--accent);outline:none}.channel-toggles{flex-wrap:wrap;gap:5px;display:flex}.ch-toggle{border:1.5px solid var(--border);color:var(--muted);font-family:var(--font-mono);cursor:pointer;background:0 0;border-radius:9999px;padding:3px 12px;font-size:.72rem;transition:all .15s}.ch-toggle.active{color:var(--text);background:#ffffff0a}.ch-toggle:hover{background:#ffffff0f;border-color:#444}.btn{background:var(--accent);color:var(--bg);font-family:var(--font);cursor:pointer;border:none;border-radius:9999px;padding:10px 28px;font-size:.85rem;font-weight:500;text-decoration:none;transition:opacity .15s,box-shadow .15s;display:inline-block}.btn:hover{opacity:.9;box-shadow:0 0 20px var(--accent-glow)}.footer{text-align:center;border-top:1px solid var(--border);margin-top:8px;padding:32px 0 12px}.footer a{color:var(--accent);text-decoration:none;transition:opacity .15s}.footer a:hover{opacity:.8}.muted{color:var(--muted)}.small{font-size:.8rem}@media (width<=700px){#app{padding:20px 16px}.row,.session-header{flex-direction:column}.chart-canvas.tall{height:280px}.chart-canvas.square{height:240px}.landing h1{font-size:2rem}}