:root{--bg-primary:#0d1117;--bg-secondary:#161b22;--bg-tertiary:#1c2128;--bg-hover:#21262d;--border:#30363d;--border-light:#3d444d;--text-primary:#e6edf3;--text-secondary:#8b949e;--text-muted:#6e7681;--accent:#58a6ff;--accent-soft:#58a6ff26;--accent-hover:#79c0ff;--success:#3fb950;--warning:#d29922;--danger:#f85149;--class-0:#ff6b6b;--class-1:#4ecdc4;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 8px 24px #00000080;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono:"SF Mono", "Cascadia Code", "Fira Code", monospace;--transition-fast:.12s ease;--transition-normal:.2s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{overflow:hidden auto}@media (width>=769px){html,body{overflow:hidden}}body{font-family:var(--font);color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5}#root{flex-direction:column;height:100%;display:flex}@media (width<=768px){#root{height:auto;min-height:100%}}button{font-family:var(--font);border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;padding:6px 14px;font-size:13px;font-weight:500}button:hover{background:var(--bg-hover);border-color:var(--border-light)}button:active{transform:scale(.97)}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}button.danger{border-color:var(--danger);color:var(--danger)}button.danger:hover{background:#f8514926}button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}select{font-family:var(--font);background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:border-color var(--transition-fast);outline:none;padding:5px 8px;font-size:13px}select:hover{border-color:var(--border-light)}select:focus{border-color:var(--accent)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border-light)}canvas{border-radius:var(--radius-md);display:block}.app{flex-direction:column;height:100vh;display:flex;position:relative;overflow:hidden}.page-wrapper{background:var(--bg-deep);scroll-behavior:smooth;height:100vh;overflow:hidden auto}.top-bar{background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:12px;min-height:52px;padding:10px 20px;display:flex}.top-bar__title{color:var(--accent);letter-spacing:-.3px;white-space:nowrap;margin-right:8px;font-size:15px;font-weight:700}.top-bar__divider{background:var(--border);flex-shrink:0;width:1px;height:24px}.top-bar__stat{color:var(--text-secondary);white-space:nowrap;align-items:center;gap:6px;font-size:13px;display:flex}.top-bar__stat-value{font-family:var(--mono);color:var(--text-primary);font-size:13px;font-weight:500}.top-bar__controls{align-items:center;gap:8px;margin-left:auto;display:flex}.top-bar__label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-weight:600}.main-grid{flex:1;grid-template-columns:200px 1fr 1fr;min-height:0;display:grid;overflow:hidden}.panel{flex-direction:column;min-height:0;padding:16px;display:flex;overflow-y:auto}.panel--border-right{border-right:1px solid var(--border)}.panel__heading{text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:12px;font-size:11px;font-weight:700}.dataset-list{flex-direction:column;gap:6px;display:flex}.dataset-btn{border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-tertiary);cursor:pointer;transition:all var(--transition-fast);text-align:left;align-items:center;gap:10px;width:100%;padding:10px 12px;display:flex}.dataset-btn:hover{background:var(--bg-hover);border-color:var(--border-light)}.dataset-btn.active{background:var(--accent-soft);border-color:var(--accent)}.dataset-btn__preview{border-radius:var(--radius-sm);flex-shrink:0;width:36px;height:36px}.dataset-btn__info{flex-direction:column;display:flex}.dataset-btn__name{color:var(--text-primary);font-size:13px;font-weight:600}.dataset-btn__desc{color:var(--text-muted);font-size:11px}.network-panel{background:var(--bg-secondary);flex-direction:column;justify-content:center;align-items:center;display:flex}.network-svg{width:100%;height:100%;max-height:100%}.heatmap-panel{background:var(--bg-secondary);flex-direction:column;justify-content:center;align-items:center;display:flex}.heatmap-canvas{border:1px solid var(--border);image-rendering:pixelated}.status-pill{text-transform:uppercase;letter-spacing:.5px;border-radius:100px;align-items:center;gap:6px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-flex}.status-pill--running{color:var(--success);background:#3fb9501f}.status-pill--stopped{color:var(--text-muted);background:var(--bg-tertiary)}.status-dot{background:currentColor;border-radius:50%;width:6px;height:6px}.status-pill--running .status-dot{animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.feature-list{flex-wrap:wrap;gap:4px;display:flex}.feature-toggle{border-radius:var(--radius-sm);cursor:pointer;color:var(--text-muted);background:var(--bg-tertiary);border:1px solid var(--border);transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;align-items:center;gap:5px;padding:4px 8px;font-size:12px;display:flex}.feature-toggle:hover{border-color:var(--border-light)}.feature-toggle.active{color:var(--accent);background:var(--accent-soft);border-color:var(--accent)}.feature-toggle input[type=checkbox]{display:none}.feature-toggle__label{font-family:var(--mono);font-size:11px;font-weight:600}.hidden-size-control{align-items:center;gap:10px;display:flex}.hidden-slider{appearance:none;background:var(--border);border-radius:2px;outline:none;flex:1;height:4px}.hidden-slider::-webkit-slider-thumb{appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:14px;height:14px}.hidden-size-value{font-family:var(--mono);color:var(--accent);text-align:center;min-width:18px;font-size:14px;font-weight:700}@media (width<=900px){.app{height:auto;overflow:auto}.main-grid{flex-direction:column;grid-template-columns:none;height:auto;display:flex;overflow:visible}.panel{border-bottom:1px solid var(--border);flex:none;height:auto;min-height:300px;overflow:visible;border-right:none!important}.network-panel,.heatmap-panel{min-height:450px}.network-svg,.heatmap-canvas{max-width:100%;height:auto!important}}.loss-graph-container{border:1px solid var(--border);background:#0d111766;border-radius:6px;flex-direction:column;align-items:center;gap:4px;margin:0 12px;padding:4px 8px;display:flex}.loss-graph-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);font-size:9px;font-weight:700}.loss-graph-svg{overflow:visible}.explanation-section{background:var(--bg-deep);border-top:1px solid var(--border);padding:80px 20px}.explanation-container{max-width:1000px;margin:0 auto}.explanation-header{text-align:center;margin-bottom:60px}.explanation-title{background:linear-gradient(135deg, #fff 0%, var(--text-dim) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px;font-size:32px;font-weight:800}.explanation-subtitle{color:var(--text-dim);font-size:18px}.explanation-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;display:grid}.explanation-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;padding:30px;transition:transform .2s,border-color .2s}.explanation-card:hover{border-color:var(--accent);transform:translateY(-4px)}.card-icon{margin-bottom:20px;font-size:32px}.explanation-card h3{color:var(--accent);margin-bottom:12px;font-size:20px}.explanation-card p{color:var(--text-dim);font-size:15px;line-height:1.6}.scroll-arrow{border:1px solid var(--border);color:var(--accent);cursor:pointer;z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0d1117bf;border-radius:50%;justify-content:center;align-items:center;width:54px;height:54px;transition:all .2s;animation:2s infinite pulse-arrow;display:flex;position:absolute;bottom:12px;left:50%;transform:translate(-50%)}.scroll-arrow:hover{background:var(--accent);color:var(--bg-deep);transform:translate(-50%)scale(1.1)}@keyframes pulse-arrow{0%,to{opacity:.6;bottom:12px}50%{opacity:1;bottom:20px}}@media (width<=768px){.app{height:auto;min-height:100vh;overflow:visible}.page-wrapper{height:auto;overflow:visible}.main-grid{flex:none;grid-template-columns:1fr;height:auto;overflow:visible}.top-bar{justify-content:center;gap:15px;padding:15px}.top-bar__controls{flex-wrap:wrap;justify-content:center;width:100%;margin-left:0}.scroll-arrow{display:none}}