:root{--bg:#0a1018;--panel:#111c2b;--line:#2b3b4e;--text:#edf3fa;--muted:#a9bbcd;--cyan:#54e1dc;--orange:#ffba69;--gold:#d6b56e;--blue:#324b67}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}main{max-width:1400px;margin:auto;padding:32px}header{display:flex;gap:24px;align-items:flex-start;justify-content:space-between}h1{font-size:clamp(27px,3.5vw,44px);line-height:1.12;letter-spacing:-.04em;margin:10px 0}h2{font-size:17px;margin:0}.eyebrow{color:var(--gold);font-weight:700;font-size:11px;letter-spacing:.14em;margin:0}.intro{color:var(--muted);margin:10px 0 0;max-width:680px}.badge{border:1px solid #366061;border-radius:50px;padding:7px 12px;color:var(--cyan);font-size:11px;white-space:nowrap;margin-top:8px}.flow{display:flex;align-items:center;justify-content:space-between;margin:28px 0;gap:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;color:var(--muted);font-size:13px}.flow b{color:var(--gold);margin-right:7px;font-size:11px}.flow i{font-style:normal;color:#526779}.controls{display:grid;grid-template-columns:200px 1fr 145px 75px;gap:22px;align-items:center;background:#10243b;border:1px solid #2b4561;border-radius:14px;padding:18px}label{font-size:12px;font-weight:600;color:var(--muted)}select,input[type=number]{display:block;width:100%;border:1px solid #4b6177;color:var(--text);background:#0b1726;border-radius:7px;padding:8px 10px;font:inherit;margin-top:5px}button{border:1px solid #56738e;border-radius:8px;padding:9px 14px;color:var(--text);font:600 12px system-ui;background:#1d3652;cursor:pointer}button:hover{background:#2b4867}button:disabled{opacity:.5;cursor:default}input[type=range]{width:100%;accent-color:var(--orange);margin:10px 0 0;cursor:pointer}.phase-label{display:flex;justify-content:space-between;align-items:center}.phase-label output{font-size:19px;font-variant-numeric:tabular-nums;color:var(--orange);font-weight:700}.phase-ends{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.free-phase small{font-size:9px;font-weight:400;display:block;margin-top:4px}#status{font-size:11px;color:var(--muted);min-height:17px;margin:12px 0}.viewer-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:16px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:19px;min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}.panel-head>span{font-size:10px;color:var(--muted)}.panel-head .live-dot{color:var(--cyan)}.live-dot:before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);margin:0 6px 1px 0}svg{display:block;width:100%;overflow:hidden;background:#08111b;border-radius:7px}#initial-svg{height:185px}#prediction-svg{height:250px}#snapshot-svg{height:180px}#snapshot-panel{margin-top:16px}.caption{font-size:10px;color:var(--muted);margin:11px 0 0;line-height:1.5}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:10px;color:var(--muted);margin:12px 0}.legend span:before{content:"";display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:currentColor}.legend .initial{color:#75869d}.legend .predicted{color:var(--orange)}.legend .observed{color:var(--cyan)}.legend .missing{color:#71829a}.legend .missing:before{background:none;border:1px dashed currentColor}.toggles{display:flex;gap:12px;flex-wrap:wrap}.toggles label{font-size:10px;font-weight:400}.toggles input{vertical-align:middle;accent-color:var(--orange)}#snapshots{display:flex;gap:8px;margin-top:16px}#snapshots button{flex:1;min-width:0;padding:6px;font-size:10px;color:var(--muted);background:#0b1827;border-color:#354c63}#snapshots button.active{border-color:var(--orange);color:var(--orange)}#snapshots img{width:100%;height:35px;object-fit:contain;display:block;margin-bottom:5px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:16px 0}.metrics>div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:15px 18px}.metrics span{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}.metrics strong{font-size:23px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.bottom-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:16px}#node{width:90px;margin:0;font-size:11px;padding:5px}.node-values{font:12px/1.8 ui-monospace,monospace;color:var(--muted);white-space:pre-line}details{font-size:11px;color:var(--muted)}summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--text)}details p{margin:12px 0}a{color:var(--cyan)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--orange);outline-offset:4px}.sr-only{position:absolute;left:-10000px}.error{color:#ffadad!important}.graph-node{cursor:pointer}noscript{display:block;padding:24px;color:#ffb3b3}@media(max-width:800px){main{padding:20px}header{display:block}.badge{display:inline-block;margin-top:14px}.controls{grid-template-columns:1fr 1fr;gap:14px}.phase-control{grid-column:1/-1;grid-row:2}.viewer-grid,.bottom-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.flow{font-size:10px;gap:5px}.flow b{display:block}.flow i{display:none}#initial-svg{height:150px}#prediction-svg{height:190px}.metrics strong{font-size:21px}.free-phase{grid-column:1;grid-row:3}.controls>button{grid-column:2;grid-row:3;align-self:center}.controls>label:first-child{grid-column:1/-1}}