:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#303b32;background:#f7f5ee;font-synthesis:none;--ink:#303b32;--muted:#85877a;--line:#dcded2;--accent:#dec070}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.45}button:focus-visible,summary:focus-visible{outline:3px solid #c89d3c;outline-offset:3px}button{touch-action:manipulation}main{max-width:1200px;margin:auto;padding:38px 48px 20px}.page-header{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:12px;align-items:center}.brand-mark{display:grid;align-content:center;justify-content:center;width:40px;height:40px;background:#303b32;color:#e3c377;font:700 15px/12px monospace;letter-spacing:5px;padding-left:5px}.brand-mark span{padding-left:9px}.brand h1{font-size:15px;letter-spacing:3px;margin:0 0 5px;font-weight:750}.brand p{font-size:11px;margin:0;color:#85877a;letter-spacing:1px}.brand p span{margin-left:10px}.prototype{font-size:11px;color:#7a7d70;display:flex;gap:7px;align-items:center}.prototype>span{width:6px;height:6px;background:#ad995f}.intro{display:flex;align-items:end;justify-content:space-between;margin:33px 0 24px}.intro p{font-size:23px;font-weight:500;letter-spacing:-.5px;margin:0}.intro>span{font-size:11px;color:#96988a}.mobile-break{display:none}.chapters{display:flex;gap:0;border-top:1px solid var(--line);margin-bottom:15px}.chapters>button{background:none;border:0;border-top:2px solid transparent;position:relative;top:-1px;padding:16px 30px 5px 0;margin-right:28px;color:#8a8e80;font-size:12px}.chapters b{font:11px monospace;margin-right:8px}.chapters span{font-size:10px;margin-left:9px}.chapters [aria-current=step]{border-color:var(--ink);color:var(--ink);font-weight:650}.stage-shell{border:1px solid #d7dacd;border-radius:3px;overflow:hidden;background:#fff}.stage{position:relative;aspect-ratio:1080/600;overflow:hidden;background:#edece3;isolation:isolate}#canvas-host{position:absolute;inset:0}canvas{display:block;width:100%!important;height:100%!important;image-rendering:pixelated}.ui-scale{overflow:hidden;position:absolute;inset:0;width:1080px;height:600px;transform:scale(var(--world-scale,1));transform-origin:0 0;pointer-events:none}.ui-world{width:3240px;height:600px;position:relative;will-change:transform}.scene-ui{width:1080px;height:600px;position:absolute;top:0;pointer-events:none}.scene-caption{position:absolute;left:32px;top:25px;display:flex;gap:15px;align-items:center;font-size:11px}.scene-caption b{font-size:12px}.scene-caption span{color:#818577}.device{position:absolute;pointer-events:auto;filter:drop-shadow(9px 14px 0px #51583d12)}.screen{background:#fcfcf7;color:#354038;overflow:hidden}.phone{left:410px;top:111px;width:260px;height:424px;padding:18px 8px 20px;background:#434b44;border-radius:25px;border:3px solid #333c35}.phone-speaker{position:absolute;top:7px;left:106px;width:42px;height:3px;border-radius:5px;background:#91978a}.phone-home{position:absolute;bottom:8px;left:92px;width:70px;height:3px;border-radius:3px;background:#afb4a5}.crew-screen{height:100%;border-radius:13px;padding:14px 12px;position:relative}.app-brand{font-weight:750;letter-spacing:-.7px;font-size:20px;display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.app-brand>span{font:9px monospace;letter-spacing:1px;color:#9b9e90;border:1px solid #dedfd4;padding:2px 4px}.app-subtitle{font-size:9px;color:#8c9080;margin-bottom:15px}.screen-tabs{display:flex;gap:15px;margin-bottom:9px;border-bottom:1px solid #e4e6dc}.screen-tabs button{border:0;background:none;font-size:11px;padding:5px 0 8px;color:#949787}.screen-tabs [aria-pressed=true]{color:#3e5140;border-bottom:2px solid #485b43;font-weight:650}.people-list{display:flex;flex-direction:column;gap:5px}.person{display:flex;align-items:center;gap:9px;padding:5px 6px;border:1px solid transparent;background:#f3f4ec;text-align:left;width:100%;border-radius:3px}.person[aria-pressed=true]{border-color:#a4b296;background:#ecf0e2}.person-avatar{position:relative;width:25px;height:25px;background:var(--person-color);clip-path:polygon(24% 0,76% 0,76% 35%,100% 35%,100% 100%,0 100%,0 35%,24% 35%)}.person-text{flex:1;font-size:11px}.person-text small{display:block;font-size:8px;color:#939586;margin-top:3px}.person-check{font-size:11px;color:#69805a}.person-detail{margin-top:8px;display:flex;flex-direction:column;gap:7px}.person-detail>span{font-size:9px;color:#7b8170}.person-detail>button{border:0;background:#41543d;border-radius:3px;color:#f8faed;padding:9px 10px;font-size:11px;text-align:left;display:flex;justify-content:space-between}.app-footer{font-size:8px;color:#929885;position:absolute;bottom:10px;left:12px;right:12px;border-top:1px solid #e7e9dd;padding-top:7px}.project-art{height:160px;background:repeating-linear-gradient(90deg,#e4d5ac 0px,#e4d5ac 39px,#eaddbd 39px,#eaddbd 40px);display:flex;flex-direction:column;justify-content:end;padding:13px;gap:8px;color:#6f654a}.project-art>span{font:9px monospace}.project-art b{font-size:19px;font-weight:600}.project-art small{font-size:9px}.project-copy{font-size:11px;line-height:1.8;color:#858a79}.world-note{position:absolute;font-size:11px;color:#78816e;background:#f7f8ecb8;padding:7px 11px;border:1px solid #d3d8c5;border-radius:3px;left:50%;transform:translateX(-50%);white-space:nowrap}.crew-note{top:556px}.tablet{left:325px;top:164px;width:430px;height:308px;background:#414a43;border:3px solid #323b35;padding:11px 14px;border-radius:17px}.tablet-camera{position:absolute;left:4px;top:143px;width:3px;height:3px;border-radius:50%;background:#858e7e}.note-screen{height:100%;border-radius:5px;padding:12px}.note-screen .app-brand{font-size:17px;padding-bottom:9px;border-bottom:1px solid #e4e7da}.note-layout{display:flex;height:211px;gap:14px}.shot-sidebar{width:139px;flex-shrink:0;padding-top:8px;border-right:1px solid #e7e9de;padding-right:8px}.tiny-label{font:8px/1.5 monospace;color:#909784;letter-spacing:1px}.shot-option{border:0;background:none;display:block;width:100%;text-align:left;margin-top:5px;padding:9px 7px;border-radius:3px;font-size:10px}.shot-option small{display:block;font:8px monospace;color:#929c86;margin-bottom:4px}.shot-option[aria-pressed=true]{background:#e8eddf}.shot-option .good-dot{float:right;color:#718c58}.shot-detail{flex:1;min-width:0;padding-top:8px}.shot-detail h2{font-size:16px;margin:5px 0 10px;font-weight:600}.shot-placeholder{height:63px;background:#eceee1;display:flex;align-items:center;justify-content:center;gap:8px;border:1px dashed #cdd2c0}.shot-placeholder>span{font-size:21px;color:#b0b9a2}.shot-placeholder>small{font-size:9px;color:#979f8c}.shot-status{font-size:9px;color:#8b947e;margin:9px 0}.good-button{border:1px solid #8e9f7b;background:#f6f9ef;border-radius:3px;padding:8px 12px;font-size:11px;width:100%}.good-button.is-good{color:#fff;background:#5a704c}.set-note{top:522px}.monitor{top:135px;left:310px;width:460px;height:309px;background:#3b4540;border:3px solid #303932;border-radius:10px 10px 6px 6px;padding:9px 10px 27px}.bit-screen{height:100%;padding:12px 16px;border-radius:3px}.bit-screen .app-brand{font-size:19px;margin-bottom:4px}.album-list{display:flex;gap:11px;margin:10px 0 11px}.album-option{display:flex;flex:1;gap:6px;flex-direction:column;align-items:start;background:none;border:1px solid transparent;border-radius:3px;padding:4px;text-align:left;min-width:0}.album-option[aria-pressed=true]{border-color:#9ca78f;background:#edf0e5}.album-art{height:53px;width:100%;background:var(--album-color);display:flex;align-items:center;justify-content:center;font:20px monospace;color:#fff9;position:relative}.album-art:before{content:"";position:absolute;left:7px;top:8px;width:25px;height:2px;background:#fff8}.album-option b{font:7px monospace;letter-spacing:.4px;white-space:nowrap}.now-playing{display:flex;align-items:center;justify-content:space-between}.now-playing>div{display:flex;flex-direction:column;gap:3px}.now-playing span{font-size:9px}.now-playing small{font-size:8px;color:#8c9680}.audio-led{width:6px;height:6px;background:#bfc6b5;border-radius:50%;margin:0 4px}.audio-led.active{background:#75945f;box-shadow:0 0 0 3px #829b6320}.progress-track{height:2px;background:#e4e8db;margin:8px 0}.progress-track>div{height:100%;width:0;background:#6f875c}.player-controls{display:flex;gap:8px}.player-controls button{border:1px solid #ccd3be;border-radius:3px;background:#f5f7ee;font-size:9px;padding:7px 10px;flex:1}.player-controls button:first-child{background:#465b40;color:#f9fced;border-color:#465b40}.monitor-chin{position:absolute;bottom:0;left:0;right:0;height:21px;background:#899083;display:grid;place-items:center}.monitor-chin>i{width:5px;height:5px;background:#c2c7b7;border-radius:50%}.monitor-stand{position:absolute;left:501px;top:444px;width:78px;height:64px;background:#a3a898;clip-path:polygon(28% 0,72% 0,75% 74%,100% 91%,100% 100%,0 100%,0 91%,25% 74%)}.studio-note{top:542px}.audio-error{font-size:9px;color:#a44d3b;position:absolute;top:316px;left:0;right:0;padding:8px;background:#fff0e9;border:1px solid #dcb5a8;border-radius:3px}.loading{position:absolute;inset:0;background:#edece3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:5;color:#66705e}.loading small{font-size:12px;color:#929780}.loading-dot{width:12px;height:12px;background:#b5a470;animation:pulse 1s infinite alternate}.loading[hidden]{display:none}.navigation{display:flex;align-items:center;justify-content:space-between;background:#fdfcf7;padding:15px 23px;border-top:1px solid #d7dacd}.navigation>button{background:none;border:1px solid #d5dacb;padding:10px 15px;border-radius:4px;font-size:12px;min-width:104px}.navigation>button:last-child{background:#344735;color:#f8f8ed;border-color:#344735}.navigation>button>span{font-size:17px;margin:0 5px}.nav-center{text-align:center;display:flex;flex-direction:column;gap:4px}.nav-center>span{font:11px monospace;letter-spacing:2px}.nav-center>small{font-size:9px;color:#8c947e}.support-line{display:flex;justify-content:space-between;font-size:10px;color:#929887;margin:11px 2px 25px}.support-line i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#9ba888;margin-right:5px}.diagnostics{border-top:1px solid #d9ddcf;border-bottom:1px solid #d9ddcf}.diagnostics summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:17px 0;list-style:none}.diagnostics summary::-webkit-details-marker{display:none}.diagnostics summary>span:first-child{display:flex;align-items:center;gap:15px}.diagnostics summary b{font-size:12px;font-weight:600}.diagnostics summary b:before{content:"＋";font-weight:400;font-size:14px;margin-right:10px;color:#8f9980}.diagnostics[open] summary b:before{content:"−"}.diagnostics summary small{font-size:10px;color:#9ba28d}.summary-status{font:10px monospace;color:#778c62}.diagnostic-body{padding:5px 0 20px}.test-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:17px}.test-actions button{font-size:10px;border:1px solid #d2d9c8;background:#f0f2e8;padding:8px 10px;border-radius:3px}.test-actions>span{font-size:10px;color:#8b967d}.metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.metric{border-left:2px solid #dbe0d1;padding:5px 10px;background:#f1f3e9}.metric small{display:block;font-size:9px;color:#909b82;margin-bottom:6px}.metric b{font:11px monospace;font-weight:500}.checks{display:flex;flex-wrap:wrap;gap:7px 18px;margin:15px 0;font-size:10px;color:#6f835b}.check.fail{color:#b95946}.log-heading{display:flex;align-items:center;justify-content:space-between;color:#929d82;font-size:10px;border-bottom:1px solid #dfe4d4;padding-bottom:8px}.log-heading button{font-size:9px;background:none;border:0;color:#929d82}.logs{font:10px/1.9 monospace;color:#7b866b;list-style:none;padding:0;margin:8px 0 0;max-height:160px;overflow:auto}.logs time{color:#a4ad96;margin-right:12px}.logs em{color:#a4ad96;font-style:normal;margin-right:9px}footer{display:flex;justify-content:space-between;margin:23px 0 0;color:#a4ac98;font:9px monospace;letter-spacing:.8px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}@keyframes pulse{to{opacity:.35}}@media(max-width:800px){main{padding:24px 20px}.intro>span{display:none}.intro p{font-size:20px}.chapters>button{padding-right:0;margin-right:24px;font-size:11px}.chapters span{display:none}.prototype{font-size:9px}.metrics{grid-template-columns:repeat(3,1fr)}.support-line>span:last-child{display:none}.diagnostics summary small{display:none}footer>span:last-child{display:none}}@media(max-width:560px){main{padding:20px 12px}.brand h1{font-size:12px}.brand p{font-size:9px}.brand-mark{width:32px;height:32px}.intro{margin-top:26px}.intro p{font-size:19px;line-height:1.5}.mobile-break{display:block}.stage{aspect-ratio:auto;height:520px;overflow-x:auto;overscroll-behavior-x:contain}.stage:after{content:"左右拖动画面查看周围角色";position:sticky;left:12px;top:493px;font-size:9px;color:#869078;pointer-events:none;display:inline-block;background:#eeeee4d9;padding:4px}#canvas-host{width:936px;height:520px;right:auto;bottom:auto}.ui-scale{--world-scale:.866666!important}.navigation{padding:12px}.navigation>button{min-width:92px;padding:9px;font-size:11px}.scene-caption{font-size:12px}.test-actions{gap:6px}.test-actions>span{flex-basis:100%;line-height:1.7}.metrics{gap:5px}.metric{padding:5px 7px}.metric b{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}

/* Round 02: Three.js world; DOM screens use the same orthographic camera. */
.world3d .view-toolbar{display:flex;align-items:center;gap:18px;justify-content:space-between;margin:6px 0 12px;font-size:11px;color:#7c8870}.view-switch{display:flex;gap:3px;padding:3px;background:#e9eddf;border:1px solid #d9dfcd;border-radius:4px}.view-switch button{background:none;border:0;border-radius:2px;padding:8px 13px;font-size:11px;color:#879078}.view-switch [aria-pressed=true]{background:#fafbf4;color:#40553b;box-shadow:0 1px 3px #55614712}.view-hint{flex:1;font-size:10px;color:#99a087}.zoom-controls{display:flex;gap:9px;align-items:center;font:10px monospace}.zoom-controls button{background:#f2f5e9;border:1px solid #d6ddc8;border-radius:3px;width:29px;height:29px;font-size:15px}.zoom-controls span{min-width:34px;text-align:center}.world3d canvas{image-rendering:auto}.world3d .ui-world{width:1080px;will-change:auto}.world3d .scene-ui{left:0!important}.world3d .device{top:0;left:0;border:0;background:none;padding:0;filter:none;transform-origin:0 0;border-radius:0;will-change:transform;backface-visibility:hidden}.world3d .device .screen{height:100%;width:100%;box-sizing:border-box}.world3d .phone-speaker,.world3d .phone-home,.world3d .tablet-camera,.world3d .monitor-chin,.world3d .monitor-stand{display:none}.world3d .scene-ui[aria-hidden=true] .scene-caption,.world3d .scene-ui[aria-hidden=true] .world-note{visibility:hidden}.world3d .world-note{top:551px;background:#f7fae9d9}.world3d .bit-screen{border-radius:3px}.world3d .phone .screen{border-radius:11px}.world3d .tablet .screen{border-radius:5px}.world3d .screen-anchor{position:absolute;display:block;width:0;height:0;z-index:5;pointer-events:none}.corner-0{left:0;top:0}.corner-1{left:100%;top:0}.corner-2{left:100%;top:100%}.corner-3{left:0;top:100%}.show-anchors .screen-anchor:after{content:'';position:absolute;left:-4px;top:-4px;width:8px;height:8px;border:1px solid #2cce7b;box-shadow:0 0 0 1px #fff8;background:transparent}.marker-toggle{display:flex;align-items:center;gap:6px;font-size:10px;color:#89977c;margin-bottom:17px}.marker-toggle input{accent-color:#59764b}.world3d .metrics{grid-template-columns:repeat(3,1fr)}
@media(max-width:800px){.world3d .view-toolbar{gap:6px}.view-hint{display:none}.view-switch button{padding:8px 10px}.world3d .metrics{grid-template-columns:repeat(3,1fr)}}

.world3d .audio-error{position:static;margin-top:5px;font-size:8px;padding:3px 5px}
/* clip keeps focus navigation from creating an independent DOM scroll offset. */
.world3d .ui-scale,.world3d .screen{overflow:clip}
@media(min-width:561px){.world3d .stage{overflow:clip}}