:root{--bg:#071522;--ink:#d7ebef;--muted:#86a5b3;--cyan:#75e6dd;--cyan-soft:#12383f;--stroke:#24424d;--panel:#102431;--panel2:#0c1e2b}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:radial-gradient(ellipse at 15% 0%,#143443 0,#071522 43%)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,.machine-row:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.mast{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-bottom:1px solid #25414c;background:#0b1b27;gap:16px}.brand{display:flex;align-items:center;gap:13px}.mark{font-weight:900;font-size:33px;border:2px solid #72dad2;border-radius:10px;width:49px;height:49px;display:grid;place-items:center;position:relative;color:#bdf5ee}.mark-dot{font-size:15px;color:#efad66;position:absolute;right:0;top:0}.brand strong{font-size:15px;letter-spacing:.11em;display:block}.brand em{font-style:normal;color:var(--cyan)}.brand small{font-size:10px;letter-spacing:.16em;color:#8aa9b8}.desktop-note{font-size:11px;color:#6f8f9e;letter-spacing:.13em}.live-label{font-size:10px;font-weight:800;letter-spacing:.13em;color:#9ee7ca;white-space:nowrap}.live-label i{display:inline-block;background:#79e7ad;width:6px;height:6px;border-radius:50%;box-shadow:0 0 15px #79e7ad;margin-right:10px}.app{display:grid;grid-template-columns:minmax(0,1fr) 330px;max-width:1900px;margin:auto;min-height:90vh}.viewer-shell{padding:30px 37px 35px;min-width:0}.viewer-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:12px 0 26px}.eyebrow{font-size:10px;color:#6ce0d5;font-weight:800;letter-spacing:.20em;margin:0 0 16px;text-transform:uppercase}h1{font-size:clamp(34px,3.25vw,62px);line-height:1.07;letter-spacing:-.05em;margin:0 0 19px;color:#f1faf9;font-weight:850}h1 span{color:#8de5db}.lead{color:#9cb9c4;line-height:1.65;max-width:620px;margin:0;font-size:14px}.stat-column{display:grid;grid-auto-flow:column;align-items:center;gap:22px;padding-bottom:4px}.stat-column>div{border-left:1px solid var(--stroke);padding-left:17px}.stat-column strong{font-size:29px;color:#f1fbfc;display:block}.stat-column span{display:block;font-size:9px;white-space:nowrap;letter-spacing:.1em;color:#86a6b4}.scene-container{height:clamp(470px,50vw,730px);position:relative;overflow:hidden;border:1px solid #2e5660;border-radius:17px;background:#091b27;box-shadow:0 30px 90px #0006}#viewport{height:100%;width:100%;display:block;cursor:grab;touch-action:none}#viewport:active{cursor:grabbing}#static-preview{width:100%;height:100%;object-fit:cover}.scene-top,.scene-bottom{position:absolute;left:22px;right:22px;display:flex;justify-content:space-between;align-items:center;gap:12px;pointer-events:none}.scene-top{top:22px}.scene-bottom{bottom:18px}.scene-tag{background:#0c302ecf;color:#a7f4e5;font-size:10px;font-weight:800;letter-spacing:.11em;padding:9px 11px;border:1px solid #317569;border-radius:6px}.hint,.scene-status{color:#95afbd;font-size:10px;font-weight:750;letter-spacing:.11em;text-shadow:0 2px 4px #000}.controls{display:flex;gap:6px;flex-wrap:wrap;pointer-events:auto}.controls button{border:1px solid #42616d;background:#102632e8;color:#d5efee;border-radius:7px;padding:10px 12px;font-size:11px;font-weight:750;transition:background .2s}.controls button:hover{background:#21505b}.scene-status{display:flex;gap:15px}.load-chip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#0b202de8;border:1px solid #497784;border-radius:10px;padding:17px 21px;font-size:12px;font-weight:800;letter-spacing:.09em;color:#d6f4f2;box-shadow:0 18px 45px #0008}.load-chip b{color:#7de3d9;margin-left:12px}.metric-strip{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--stroke);border-top:0;background:#0e2430;border-radius:0 0 14px 14px;padding:23px 10px;margin:0 11px}.metric-strip div{text-align:center;border-right:1px solid var(--stroke)}.metric-strip div:last-child{border:0}.metric-strip span,.data-label{font-size:10px;color:#7c9ba8;letter-spacing:.13em;font-weight:800;display:block}.metric-strip strong{display:block;font-size:16px;margin-top:5px;color:#dff9f7}.data-section{margin-top:45px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px;gap:12px}.section-head .eyebrow{margin-bottom:8px}h2{font-size:27px;letter-spacing:-.035em;margin:0;color:#eef9f8}.muted{color:#809faa;font-size:12px}.flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.flow-card{border:1px solid var(--stroke);background:#102633;border-radius:11px;padding:20px;min-height:171px}.flow-card label{display:block;font-size:13px;font-weight:750}.flow-card output{color:var(--cyan);float:right}.flow-card input{width:100%;accent-color:#74d8cd;margin:19px 0 10px}.flow-card strong{font-size:22px;display:block;margin:14px 0 6px;color:#e9f7f8}.flow-card p,.report p{font-size:12px;line-height:1.6;color:#85a3b1;margin:9px 0 0}.report{background:#0e2330;border:1px solid var(--stroke);border-radius:11px;margin-top:13px;padding:21px;display:flex;justify-content:space-between;align-items:center;gap:25px}.report strong{font-size:15px}.report p{max-width:490px}.report-stats{display:grid;grid-template-columns:repeat(3,100px);gap:10px}.report-stats div{border-left:1px solid #31515a;padding-left:12px}.report-stats strong{font-size:19px;color:#91e9dd;display:block}.report-stats span{font-size:9px;color:#93acb8;letter-spacing:.05em}.experiments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.exp{background:#0d222f;border:1px solid #233f4e;border-radius:9px;padding:17px 18px}.exp[open]{border-color:#3f787b;background:#112c37}.exp summary{cursor:pointer;display:flex;align-items:center;gap:13px;list-style:none}.exp summary::-webkit-details-marker{display:none}.exp .index{font-size:10px;color:#81e2d6;background:#163e43;border-radius:5px;padding:7px 8px;font-weight:800}.exp summary span:last-child{font-size:13px;font-weight:700}.exp p{font-size:12px;color:#9bb5be;line-height:1.65;margin:12px 0 0}.exp code{display:block;background:#081925;white-space:pre-wrap;word-break:break-word;border:1px solid #294a53;border-radius:6px;padding:10px;color:#c7e5e5;font-size:12px;margin-top:10px}.page-footer{border-top:1px solid var(--stroke);margin-top:30px;padding:24px 5px;color:#688795;font-size:10px;letter-spacing:.1em;line-height:1.8}.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;border-left:1px solid #2b4954;background:#0b202c;overflow:hidden}.aside-top{padding:32px 24px 20px;flex-shrink:0;border-bottom:1px solid #213f4c}.aside-top .eyebrow{margin-bottom:9px}.aside-top h2{font-size:28px}.aside-top input{margin-top:19px;width:100%;border:1px solid #335460;background:#081b27;padding:12px 13px;border-radius:7px;color:#daf3f2;font-size:13px}.aside-top input::placeholder{color:#668894}.machine-list{overflow:auto;flex:1;min-height:140px;scrollbar-color:#305965 transparent}.machine-row{border:0;background:transparent;color:#d8edef;text-align:left;width:100%;display:flex;align-items:center;gap:12px;padding:12px 22px;cursor:pointer;border-bottom:1px solid #193541;transition:background .15s}.machine-row:hover,.machine-row.active{background:#18404b}.machine-row.active{box-shadow:inset 3px 0 #6bdfd3}.machine-row .num{color:#60c6c5;background:#123540;border:1px solid #2c656c;padding:5px 6px;border-radius:4px;font-size:10px;font-weight:800}.machine-row .name{font-size:12px;line-height:1.3;font-weight:700;display:block}.machine-row .stage{color:#7898a4;font-size:10px;text-transform:uppercase;letter-spacing:.08em;display:block;margin-top:3px}.machine-row .capacity{margin-left:auto;white-space:nowrap;color:#9fc4cb;font-size:10px}.selected-info{border-top:1px solid #2d5360;padding:23px;background:#102a36;max-height:42vh;overflow:auto;flex-shrink:0}.selected-info .eyebrow{margin-bottom:8px}.selected-info h3{margin:0;font-size:19px;color:#e1f6f3}.selected-info p{font-size:12px;line-height:1.5;color:#93b0bb}.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}.spec-grid div{border-top:1px solid #34606b;padding-top:8px}.spec-grid span{font-size:10px;color:#92adb8;display:block;text-transform:uppercase}.spec-grid strong{font-size:14px;color:#d9f5f1;margin-top:3px;display:block}.joint-list{font-size:10px;line-height:1.7;word-break:break-word;color:#a5bbc6;margin-top:12px}.select-preview{width:100%;aspect-ratio:16/9;object-fit:cover;margin-top:12px;border:1px solid #315763;border-radius:7px}.aside-button{margin-top:14px;border:1px solid #3c7777;border-radius:6px;background:#1c4f51;padding:11px 12px;color:#d1f4e9;font-size:12px;font-weight:800;width:100%}@media(max-width:1230px){.app{grid-template-columns:minmax(0,1fr) 285px}.viewer-shell{padding:26px}.stat-column{display:none}.report{display:block}.report-stats{margin-top:16px}.scene-container{height:580px}}@media(max-width:800px){.mast{height:68px;padding:0 17px}.desktop-note,.live-label{display:none}.app{display:flex;flex-direction:column}.viewer-shell{padding:17px}.viewer-head{padding:21px 4px 23px}.lead{font-size:13px}.scene-container{height:490px}.scene-top .hint{display:none}.scene-bottom{flex-direction:column;align-items:start;bottom:12px}.controls button{padding:9px 10px}.metric-strip{grid-template-columns:repeat(2,1fr);gap:18px}.metric-strip div:nth-child(2){border-right:0}.flow-grid,.experiments{grid-template-columns:1fr}.side{position:static;height:auto;border-left:0;border-top:1px solid var(--stroke)}.machine-list{height:360px;flex:initial}.selected-info{max-height:none}.report-stats{grid-template-columns:repeat(3,1fr)}.section-head{display:block}.section-head .muted{display:block;margin-top:12px}}@media(max-width:460px){.viewer-shell{padding:11px}.scene-container{height:440px}.scene-bottom{left:9px;right:9px}.controls{gap:3px}.controls button{font-size:10px;padding:7px}.scene-status{font-size:9px}.metric-strip strong{font-size:13px}h1{font-size:35px}.brand strong{font-size:12px}}
