:root{--bg: #0a0a0a;--surface: #1a1a1a;--border: #333;--text: #e0e0e0;--text-dim: #888;--accent: #4ade80;--accent-dim: #166534;--danger: #ef4444;--warning: #f59e0b;--font-mono: "SF Mono", "Cascadia Code", "Fira Code", "Menlo", monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);line-height:1.5;min-height:100vh}#app{min-height:100vh}.landing{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:2rem;text-align:center}.landing h1{font-size:3rem;font-weight:700;letter-spacing:-.03em}.landing .tagline{color:var(--text-dim);font-size:1.1rem;margin:.5rem 0 2rem}.landing ul{list-style:none;text-align:left;margin-bottom:2rem}.landing li{padding:.4rem 0;color:var(--text-dim)}.landing li:before{content:"▸";color:var(--accent);margin-right:.6rem}.btn-start{background:var(--accent);color:#000;border:none;padding:.9rem 2.5rem;font-size:1.1rem;font-weight:600;border-radius:6px;cursor:pointer;transition:opacity .15s}.btn-start:hover{opacity:.85}.btn-start:disabled{opacity:.5;cursor:not-allowed}.landing .disclosure{color:var(--text-dim);font-size:.8rem;margin-top:1.5rem}.landing .footer-link{color:var(--text-dim);font-size:.8rem;margin-top:1rem;text-decoration:underline;text-underline-offset:2px}.landing .swarm-count{color:var(--accent);font-family:var(--font-mono);font-size:.9rem;margin-bottom:1rem}.dashboard{display:flex;flex-direction:column;height:100vh}.top-bar{display:flex;align-items:center;gap:1rem;padding:.6rem 1rem;border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0}.top-bar .status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.top-bar .status-dot.green{background:var(--accent)}.top-bar .status-dot.yellow{background:var(--warning)}.top-bar .status-dot.red{background:var(--danger)}.top-bar .spacer{flex:1}.top-bar .peer-badge{font-family:var(--font-mono);font-size:.85rem;color:var(--text-dim)}.btn-stop{background:transparent;color:var(--danger);border:1px solid var(--danger);padding:.3rem 1rem;border-radius:4px;cursor:pointer;font-size:.85rem;transition:background .15s}.btn-stop:hover{background:#ef444426}.grid{display:flex;flex-wrap:wrap;flex:1;min-height:0}.grid>.card{flex:1 1 50%;min-width:280px;border:1px solid var(--border);background:var(--surface);display:flex;flex-direction:column;overflow:hidden}.card-header{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-dim);padding:.5rem .75rem;border-bottom:1px solid var(--border)}.card-body{flex:1;padding:.75rem;overflow:auto}.loss-chart-wrap{position:relative;width:100%;height:100%;min-height:200px}.loss-chart-wrap canvas{width:100%;height:100%;display:block}.loss-overlay{position:absolute;top:.5rem;right:.75rem;font-family:var(--font-mono);font-size:1.6rem;font-weight:700;color:var(--accent);text-shadow:0 0 12px rgba(74,222,128,.3)}.model-demo-output{font-family:var(--font-mono);font-size:.85rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:.75rem;min-height:100px;max-height:200px;overflow-y:auto;color:var(--text)}.model-demo-output .cursor{display:inline-block;width:2px;height:1em;background:var(--accent);animation:blink .8s step-end infinite;vertical-align:text-bottom;margin-left:1px}@keyframes blink{50%{opacity:0}}.btn-generate{background:transparent;color:var(--accent);border:1px solid var(--accent-dim);padding:.3rem .8rem;border-radius:4px;cursor:pointer;font-size:.8rem;margin-top:.5rem;transition:background .15s}.btn-generate:hover{background:#4ade801a}.btn-generate:disabled{opacity:.4;cursor:not-allowed}.controls-grid{display:flex;flex-direction:column;gap:.75rem}.control-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.btn-toggle{background:transparent;border:1px solid var(--border);color:var(--text);padding:.35rem 1rem;border-radius:4px;cursor:pointer;font-size:.85rem;transition:border-color .15s,color .15s}.btn-toggle:hover{border-color:var(--accent);color:var(--accent)}.btn-toggle.active{border-color:var(--warning);color:var(--warning)}.intensity-slider{-webkit-appearance:none;appearance:none;width:100%;height:4px;background:var(--border);border-radius:2px;outline:none}.intensity-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);cursor:pointer}.stat-label{font-size:.75rem;color:var(--text-dim)}.stat-value{font-family:var(--font-mono);font-size:.9rem}.peer-count-big{font-family:var(--font-mono);font-size:3rem;font-weight:700;color:var(--accent);line-height:1}.peer-status{font-size:.85rem;color:var(--text-dim);margin-top:.25rem}.peer-status .dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:.4rem;vertical-align:middle}.connecting-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:1rem}.spinner{width:32px;height:32px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
