@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{font-family:DM Sans,Pretendard,-apple-system,BlinkMacSystemFont,Noto Sans KR,sans-serif;color:#e7eff6;background:#0b1220;font-synthesis:none;--muted:#94a9bc;--line:#243345;--cyan:#38bdf8}*{box-sizing:border-box}body{margin:0}button,select,input{font:inherit}button,select{cursor:pointer}button,a,select,input{touch-action:manipulation}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #7dd3fc;outline-offset:4px}button:disabled{cursor:default;opacity:.3}button{color:inherit;border:1px solid var(--line);background:#111e2e;border-radius:8px;padding:11px 14px;transition:background .2s,border-color .2s}button:hover:enabled{background:#1a2e42;border-color:#52738c}a{color:var(--cyan)}select{background:#0e1a29;border:1px solid var(--line);border-radius:6px;color:#dbe8f2;padding:8px 26px 8px 10px}input[type=range]{accent-color:var(--cyan);width:100%;height:18px}input[type=checkbox]{accent-color:var(--cyan)}.lab{max-width:1600px;margin:auto;padding:28px 42px 20px}.masthead{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}.brand{font-family:Space Grotesk,sans-serif;font-size:14px;letter-spacing:2.6px;display:flex;gap:12px;align-items:center}.brandmark{width:23px;height:29px;display:inline-block;border-radius:60% 40% 55% 45%;background:linear-gradient(140deg,#90e9ff,#178dcc);transform:rotate(25deg);box-shadow:0 0 25px #38bdf82a}.lab-id{font:11px monospace;letter-spacing:1.5px;color:var(--muted)}.intro{padding:27px 0 22px;display:flex;align-items:end;justify-content:space-between;gap:24px}.eyebrow{font:11px Space Grotesk,monospace;letter-spacing:2.2px;color:var(--cyan);margin:0 0 11px}.intro h1{font-family:Space Grotesk,sans-serif;font-weight:500;font-size:clamp(28px,3.2vw,48px);letter-spacing:-1.8px;margin:0 0 9px;line-height:1.1}.intro p{font-size:14px;color:var(--muted);margin:0;line-height:1.8}.mode-switch{display:flex;background:#111e2e;border:1px solid var(--line);border-radius:8px;padding:3px;flex-shrink:0}.mode-switch button{border:0;padding:8px 12px;background:transparent;font-size:12px;color:#9eb0c1}.mode-switch button.active{color:#e5f6ff;background:#284258}.experiment{display:grid;grid-template-columns:minmax(0,1fr) 292px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0b1422}.stage{position:relative;min-height:610px;background:radial-gradient(ellipse at 50% 48%,#19324877,#0b142200 66%);overflow:hidden}.stage:before{content:"";position:absolute;inset:0;background-image:radial-gradient(#35506a55 .7px,transparent .7px);background-size:24px 24px;pointer-events:none;mask-image:linear-gradient(black,transparent)}#viewport{position:absolute;inset:20px 0 45px}#viewport canvas{display:block;touch-action:none}.stage-header{position:absolute;z-index:2;left:22px;right:22px;top:19px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.stage-number{font:11px monospace;letter-spacing:1.5px;color:#738ba0}.status{font-size:11px;color:#a0d7ec;background:#0d2432;border:1px solid #1b4559;padding:6px 10px;border-radius:20px;display:flex;align-items:center;gap:7px}.status:before{content:"";height:5px;width:5px;border-radius:50%;background:#38bdf8;box-shadow:0 0 9px #38bdf8}.stage-footer{position:absolute;bottom:19px;left:22px;right:22px;display:flex;justify-content:space-between;gap:14px;align-items:center;color:#8198aa;font-size:11px}.legend{display:flex;flex-wrap:wrap;gap:15px}.legend span{display:flex;gap:6px;align-items:center}.dot{height:6px;width:6px;background:var(--c);border-radius:50%}.camera-hint{opacity:.85}.floating-tools{position:absolute;right:18px;top:58px;z-index:2;display:flex;gap:6px}.iconbtn{width:32px;height:32px;padding:0;font-size:15px;background:#0d1c2bc9}.panel{border-left:1px solid var(--line);padding:25px 22px;background:#0e1928}.panel-label{display:flex;justify-content:space-between;color:#7892a7;font:10px monospace;letter-spacing:1.8px;margin-bottom:23px}.steps{display:flex;flex-direction:column;gap:9px}.step{display:grid;grid-template-columns:26px 1fr 15px;text-align:left;align-items:center;padding:14px 12px;background:#101f30;border-color:#293c50;border-radius:7px;gap:5px}.step em{font:11px monospace;font-style:normal;color:#66869c}.step strong{font-weight:500;font-size:13px}.step small{font-size:10px;color:#7994a7}.step.primary{background:#178dbe;border-color:#28b5ed;color:#fff}.step.primary em,.step.primary small{color:#c7efff}.step.done{border-color:#23516a;background:#0f2637}.explanation{border-left:2px solid #2f8db4;padding:0 0 0 12px;margin:25px 0 22px;min-height:100px}.explanation h2{font-size:14px;margin:0 0 8px;font-weight:600}.explanation p{color:#9bafbf;font-size:12px;line-height:1.85;margin:0}.readouts{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;gap:12px}.readout label{display:block;font-size:10px;color:#7892a7;margin-bottom:7px}.readout strong{font:23px Space Grotesk,sans-serif;font-weight:400}.readout strong small{font:10px sans-serif;color:#8aa0b2;margin-left:4px}.controls{padding-top:17px}.control{margin-bottom:13px}.control-line{display:flex;justify-content:space-between;align-items:center;color:#a8bdcd;font-size:11px;margin-bottom:7px}.control-line output{font:11px monospace;color:#68cbf5}.checks{display:flex;gap:10px;flex-wrap:wrap;color:#8da6ba;font-size:11px;line-height:1.7}.checks label{display:flex;gap:4px;align-items:center}.toolbar{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:12px}.playback{display:flex;gap:7px;align-items:center}.playback button{padding:8px 12px;font-size:11px;background:transparent}.speed{display:flex;gap:2px;margin-left:9px}.speed button{padding:5px 7px;border:none;color:#7c99ae}.speed button.active{color:#74d0fb;background:#183047}.timeline{display:flex;gap:7px;align-items:center;flex:1;max-width:480px;margin:0 20px}.timeline-segment{height:2px;background:#22354a;flex:1;transition:background .5s}.timeline-segment.active{background:#38bdf8}.time{font:11px monospace;color:#829bb0;min-width:60px}.new-maze{font-size:11px;padding:8px 11px;background:transparent}.footnote{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:17px 0;font-size:10px;color:#7d94a7;line-height:1.9}.footnote a{color:#8ba9bf;text-decoration:none}.comparison{display:none;background:#102536;border:1px solid #24516b;border-radius:7px;margin-top:16px;padding:12px;font-size:11px;line-height:1.9;color:#abc5d8}.comparison.visible{display:block}.compare-row{display:flex;justify-content:space-between}.compare-row b{font-family:monospace;font-weight:400}.compare-row.red{color:#ff8c88}.compare-row.gold{color:#facc15}.comparison p{margin:8px 0 0;color:#84a9bf}.extra{margin:14px 0 0;font-size:11px;color:#829caf;border-top:1px solid var(--line);padding-top:12px}.extra summary{cursor:pointer}.extra .control{margin-top:12px}.extra select{width:100%;font-size:11px}.capture{display:flex;gap:6px;margin-top:10px}.capture button{font-size:10px;padding:6px 9px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);z-index:20;max-width:90vw;padding:12px 20px;border:1px solid #35617a;border-radius:8px;background:#153349;color:#dcf4ff;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s}.toast.visible{opacity:1}.story-scroll{display:none}.story-mode .story-scroll{display:block}.story-mode .experiment{position:sticky;top:10px;z-index:2}.story-beat{height:70vh;display:flex;align-items:end;padding:30px 5%;border-bottom:1px solid #243345}.story-beat p{max-width:500px;font-size:20px;line-height:1.7;color:#93afc4}.story-beat span{color:#38bdf8;font:12px monospace;display:block;margin-bottom:12px}.fallback{padding:140px 30px;color:#c0d4e4;text-align:center;line-height:1.8}.embed .lab{padding:16px 20px}.embed .masthead{display:none}.embed .intro{padding-top:0}.embed .intro h1{font-size:30px}.embed .stage{min-height:570px}.embed .footnote{font-size:10px}.embed .experiment{border-radius:8px}@media(min-width:1500px){.stage{min-height:700px}}@media(max-width:1050px){.lab{padding:22px}.experiment{grid-template-columns:minmax(0,1fr) 260px}.panel{padding:22px 17px}.intro{align-items:start}.intro h1{font-size:36px}.stage{min-height:620px}.camera-hint{display:none}.timeline{margin:0 5px}.footnote{font-size:10px}}@media(max-width:730px){.lab,.embed .lab{padding:16px 12px}.masthead{padding-bottom:14px}.brand{font-size:12px}.lab-id{font-size:9px}.intro{display:block;padding:24px 4px 20px}.intro h1,.embed .intro h1{font-size:33px;letter-spacing:-1.5px}.intro p{font-size:12px}.mode-switch{margin-top:15px;width:fit-content}.experiment{display:flex;flex-direction:column}.stage,.embed .stage{min-height:470px;height:65vh;max-height:650px}.panel{border-left:0;border-top:1px solid var(--line);padding:18px}.panel-label{margin-bottom:13px}.steps{display:grid;grid-template-columns:1fr 1fr;gap:7px}.step{padding:13px 10px}.explanation{min-height:0;margin:19px 0}.readouts{padding:12px 0}.readout{display:flex;align-items:center;justify-content:space-between;gap:10px}.readout label{margin:0}.readout strong{font-size:22px}.controls{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.checks{grid-column:1/-1}.extra{margin-top:13px}.toolbar{flex-wrap:wrap;padding:12px 0}.playback{flex:1}.playback button{padding:7px 9px}.speed{margin-left:3px}.speed button{padding:5px 6px}.timeline{order:3;max-width:none;flex-basis:100%;margin:7px 2px}.new-maze{font-size:10px}.footnote{display:block;padding:14px 3px}.footnote>span{display:block;margin-bottom:7px}.stage-header{left:15px;right:15px;top:15px}.stage-footer{left:15px;right:15px;font-size:10px}.stage-number{font-size:9px}.floating-tools{right:12px}.story-mode .experiment{position:relative;top:0}.story-beat{height:40vh}.story-beat p{font-size:16px}.embed .intro{padding:3px 4px 16px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}