@import "https://fonts.googleapis.com/css2?family=Azeret+Mono:wght@400;500;600;700&family=DM+Sans:wght@400;500;600;700&display=swap";:root{--bg:#05060b;--surface:#0c0d14;--surface-2:#111219;--surface-3:#16171f;--border:#ffffff0f;--border-2:#ffffff1a;--text:#d4d4d8;--text-bright:#fafafa;--dim:#52525b;--dim-2:#3f3f46;--clr-cyan:#00e5ff;--clr-magenta:#ff2d78;--clr-gold:#fbbf24;--clr-white:#e4e4e7;--font-mono:"Azeret Mono", "JetBrains Mono", "Fira Code", monospace;--font-sans:"DM Sans", -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);min-height:100vh;line-height:1.5;overflow-x:hidden}.scanlines{pointer-events:none;z-index:999;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#00000008 2px 4px);position:fixed;inset:0}.noise{pointer-events:none;z-index:998;opacity:.015;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:128px;position:fixed;inset:0}.app{max-width:1160px;margin:0 auto;padding:2rem 1.5rem;position:relative}.app:before{content:"";pointer-events:none;z-index:-1;opacity:.12;background:radial-gradient(ellipse at 30% 20%, var(--clr-cyan) 0%, transparent 60%);width:140%;height:100%;transition:background 1s;position:fixed;top:-40%;left:-20%}.app[data-phase=implement]:before,.app[data-phase=transition]:before{background:radial-gradient(ellipse at 70% 20%, var(--clr-magenta) 0%, transparent 60%)}.app[data-phase=complete]:before{background:radial-gradient(ellipse at 50% 20%, var(--clr-gold) 0%, transparent 60%)}header{border-bottom:1px solid var(--border);margin-bottom:2rem;padding-bottom:1.5rem}.header-inner{justify-content:space-between;align-items:center;gap:2rem;display:flex}.brand{align-items:center;gap:.9rem;display:flex}.brand-icon{color:var(--clr-cyan);flex-shrink:0}.brand h1{font-family:var(--font-mono);letter-spacing:.15em;color:var(--text-bright);font-size:1.35rem;font-weight:700}.tagline{color:var(--dim);letter-spacing:.04em;margin-top:.1rem;font-size:.72rem}.header-stats{gap:1.5rem;display:flex}.stat{flex-direction:column;align-items:flex-end;display:flex}.stat-value{font-family:var(--font-mono);color:var(--text-bright);font-size:.85rem;font-weight:600}.stat-value[data-color=cyan]{color:var(--clr-cyan)}.stat-value[data-color=magenta]{color:var(--clr-magenta)}.stat-value[data-color=gold]{color:var(--clr-gold)}.stat-value[data-color=dim]{color:var(--dim)}.stat-label{font-family:var(--font-mono);color:var(--dim);letter-spacing:.12em;margin-top:.15rem;font-size:.55rem}.grid{grid-template-columns:340px 1fr;align-items:start;gap:1.5rem;display:grid}@media (width<=860px){.grid{grid-template-columns:1fr}.header-inner{flex-direction:column;align-items:flex-start}.header-stats{align-self:flex-start}}.section-tag{font-family:var(--font-mono);letter-spacing:.18em;color:var(--dim);text-transform:uppercase;font-size:.55rem;font-weight:600}.pipeline{flex-direction:column;gap:0;display:flex}.pipeline-header{margin-bottom:1rem}.p-node{background:var(--surface);border:1px solid var(--border);border-radius:8px;align-items:center;gap:.65rem;padding:.65rem .9rem;transition:border-color .3s,background .3s;display:flex;position:relative;overflow:hidden}.p-active{background:var(--surface-2)}.node-glow{pointer-events:none;opacity:.06;position:absolute;inset:0}.node-glow[data-color=white]{background:var(--clr-white)}.node-glow[data-color=gold]{background:var(--clr-gold)}.node-icon{color:var(--dim);flex-shrink:0;display:flex}.p-active .node-icon{color:var(--text)}.node-title{font-family:var(--font-mono);color:var(--text);font-size:.78rem;font-weight:600}.node-sub{color:var(--dim);font-size:.65rem}.connector{flex-direction:column;align-items:center;height:28px;margin:0;display:flex;position:relative}.conn-line{background:var(--border-2);flex:1;width:1px;transition:background .3s}[data-active=true] .conn-line{background:var(--dim)}.conn-pulse{pointer-events:none;border-radius:2px;width:3px;height:8px;position:absolute}.conn-pulse[data-color=cyan]{background:var(--clr-cyan);box-shadow:0 0 8px var(--clr-cyan)}.conn-pulse[data-color=magenta]{background:var(--clr-magenta);box-shadow:0 0 8px var(--clr-magenta)}.conn-pulse[data-color=gold]{background:var(--clr-gold);box-shadow:0 0 8px var(--clr-gold)}.conn-arrow{color:var(--dim-2);font-size:.5rem;line-height:1}[data-active=true] .conn-arrow{color:var(--dim)}.conn-label{font-family:var(--font-mono);letter-spacing:.1em;white-space:nowrap;font-size:.55rem;font-weight:700;position:absolute;top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.conn-label[data-color=cyan]{color:var(--clr-cyan)}.conn-label[data-color=magenta]{color:var(--clr-magenta)}.phase-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:.9rem 1rem;transition:border-color .4s,background .4s;position:relative;overflow:hidden}.pc-active{background:var(--surface-2)}.pc-done{opacity:.6}.pc-glow-bar{height:2px;position:absolute;top:0;left:0;right:0}.pc-glow-bar[data-color=cyan]{background:var(--clr-cyan);box-shadow:0 0 12px var(--clr-cyan)}.pc-glow-bar[data-color=magenta]{background:var(--clr-magenta);box-shadow:0 0 12px var(--clr-magenta)}.pc-top{justify-content:space-between;align-items:center;margin-bottom:.4rem;display:flex}.pc-label{font-family:var(--font-mono);letter-spacing:.14em;font-size:.55rem;font-weight:700}.pc-label[data-color=cyan]{color:var(--clr-cyan)}.pc-label[data-color=magenta]{color:var(--clr-magenta)}.pc-metric{font-family:var(--font-mono);color:var(--dim);font-size:.6rem}.pc-title{font-family:var(--font-mono);color:var(--text-bright);letter-spacing:.06em;margin-bottom:.65rem;font-size:.82rem;font-weight:700}.pc-steps{flex-direction:column;gap:.2rem;display:flex}.pc-step{color:var(--dim);border-radius:4px;align-items:center;gap:.5rem;padding:.2rem .35rem;font-size:.7rem;transition:all .2s;display:flex}.pcs-marker{font-family:var(--font-mono);text-align:center;width:18px;color:var(--dim-2);flex-shrink:0;font-size:.6rem;font-weight:600}.pcs-active{color:var(--text-bright)}.pcs-active[data-color=cyan]{background:#00e5ff14}.pcs-active[data-color=cyan] .pcs-marker{color:var(--clr-cyan)}.pcs-active[data-color=magenta]{background:#ff2d7814}.pcs-active[data-color=magenta] .pcs-marker{color:var(--clr-magenta)}.pcs-done .pcs-marker{color:var(--clr-gold)}.pc-exit{border-top:1px solid var(--border);font-family:var(--font-mono);color:var(--dim);letter-spacing:.05em;margin-top:.6rem;padding-top:.5rem;font-size:.55rem}.pc-exit code{font-family:var(--font-mono);color:var(--dim);background:#ffffff0a;border-radius:3px;padding:.1em .35em;font-size:.55rem}.memory-layer{border-top:1px solid var(--border);margin-top:1.2rem;padding-top:1rem}.memory-layer .section-tag{margin-bottom:.6rem;display:block}.memory-grid{grid-template-columns:1fr 1fr;gap:.35rem;display:grid}.mem-chip{background:var(--surface);border:1px solid var(--border);border-radius:5px;flex-direction:column;padding:.4rem .55rem;display:flex}.mem-name{font-family:var(--font-mono);color:var(--text);font-size:.62rem;font-weight:600}.mem-desc{color:var(--dim);font-size:.55rem}.right-col{flex-direction:column;gap:1rem;display:flex}.panel{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden}.panel-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.7rem 1rem;display:flex}.panel-meta{font-family:var(--font-mono);color:var(--dim);font-size:.6rem}.live-dot{font-family:var(--font-mono);letter-spacing:.1em;color:var(--clr-magenta);font-size:.55rem;font-weight:700}.story-list{padding:.35rem}.story-row{border-radius:6px;align-items:center;gap:.5rem;padding:.5rem .65rem;transition:background .3s;display:flex}.s-pending{background:0 0}.s-refined{background:#00e5ff0a}.s-pass{background:#fbbf240f}.story-indicator{flex-shrink:0;align-items:center;display:flex}.story-id-tag{font-family:var(--font-mono);color:var(--dim);flex-shrink:0;width:38px;font-size:.62rem}.story-name{text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.78rem;overflow:hidden}.story-flags{flex-shrink:0;gap:.25rem;display:flex}.flag{font-family:var(--font-mono);border-radius:3px;justify-content:center;align-items:center;width:16px;height:16px;font-size:.5rem;font-weight:700;display:flex}.flag-cyan{color:var(--clr-cyan);background:#00e5ff1f}.flag-gold{color:var(--clr-gold);background:#fbbf241f}.terminal{background:var(--bg);border-color:var(--border)}.terminal-body{font-family:var(--font-mono);scroll-behavior:smooth;max-height:320px;padding:.75rem 1rem;font-size:.68rem;line-height:1.65;overflow-y:auto}.terminal-idle{color:var(--dim);padding:1rem 0}.prompt-char{color:var(--clr-cyan);margin-right:.3em}kbd{font-family:var(--font-mono);border:1px solid var(--border-2);color:var(--text-bright);border-radius:3px;padding:.1em .4em;font-size:.62rem}.term-line{color:var(--dim);padding:.05rem 0}.term-header{color:var(--text-bright);font-weight:600}.term-success{color:var(--clr-gold)}.term-hook{color:var(--clr-magenta);font-weight:500}.term-promise{color:var(--clr-cyan);font-weight:600}.controls{gap:.6rem;display:flex}.cta{cursor:pointer;font-family:var(--font-mono);letter-spacing:.1em;border:none;border-radius:8px;flex:1;padding:0;font-size:.72rem;font-weight:700;transition:transform .15s;position:relative;overflow:hidden}.cta:active:not(:disabled){transform:scale(.98)}.cta:disabled{cursor:not-allowed;opacity:.7}.cta-inner{background:linear-gradient(135deg, var(--clr-cyan), #08c);color:#000;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.2rem;display:flex}.cta:not(:disabled):hover .cta-inner{background:linear-gradient(135deg,#3ef,#0ad)}.cta-play{font-size:.6rem}.cta-spinner{display:inline-block}.cta-ghost{flex:0;min-width:80px}.cta-ghost .cta-inner{background:var(--surface-2);color:var(--dim);border:1px solid var(--border-2)}.cta-ghost:hover .cta-inner{background:var(--surface-3);color:var(--text)}footer{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:2.5rem;padding-top:1.2rem;display:flex}.footer-links{font-family:var(--font-mono);gap:.5rem;font-size:.62rem;display:flex}.footer-links a{color:var(--dim);text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--clr-cyan)}.footer-sep{color:var(--dim-2)}.footer-install code{font-family:var(--font-mono);color:var(--dim);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:.3em .7em;font-size:.6rem}::-webkit-scrollbar{width:3px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--dim-2);border-radius:2px}
