:root{--paper:#f4f3ef;--ink:#252a29;--muted:#777c76;--line:#dddfd7;--accent:#d75b36;--green:#528369;--unit:6px;--oled-scale:2;color:var(--ink);background:var(--paper);font-synthesis:none;font-family:Inter,Segoe UI,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button:disabled{cursor:default;opacity:.4}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline-offset:4px;outline:3px solid #cf6743}button{cursor:pointer;color:inherit}button svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;width:18px;height:18px}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.shell{max-width:1440px;margin:auto;padding:0 42px}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:20px;height:88px;display:flex}.brand{letter-spacing:-.8px;align-items:center;gap:12px;font-size:21px;font-weight:650;display:flex}.brand-mark{align-items:center;gap:4px;height:25px;display:flex}.brand-mark i{background:var(--ink);border-radius:3px;width:4px;height:16px;display:block}.brand-mark i:nth-child(2){height:25px}.brand-mark i:nth-child(3){height:11px}.brand span{color:#858982;letter-spacing:0;margin-left:4px;font-size:13px;font-weight:400}.top-info{color:var(--muted);align-items:center;gap:24px;font-size:12px;display:flex}.sim-badge{color:#626d5e;border:1px solid #d8dcd1;border-radius:20px;align-items:center;gap:7px;padding:7px 12px;display:flex}.dot{background:#70896a;border-radius:50%;width:6px;height:6px;display:inline-block}.intro{justify-content:space-between;align-items:flex-end;gap:24px;padding:36px 0 28px;display:flex}.eyebrow{letter-spacing:2px;color:#90968d;text-transform:uppercase;font-size:10px;font-weight:600}.intro h1{letter-spacing:-1px;margin:11px 0 10px;font-size:29px;font-weight:550}.intro p{color:var(--muted);margin:0;font-size:13px;line-height:1.8}.revision{color:#8a8f86;padding-bottom:5px;font:11px Consolas,monospace}.workspace{border:1px solid var(--line);background:#fafaf7;border-radius:16px;grid-template-columns:minmax(0,1fr) 316px;min-height:616px;display:grid;overflow:hidden}.stage{background:radial-gradient(at 50% 40%,#fffefa 0%,#f0f1ea 78%);flex-direction:column;min-width:0;display:flex;position:relative}.stage-toolbar{z-index:1;justify-content:space-between;align-items:center;gap:16px;padding:22px 26px;display:flex;position:relative}.segmented{background:#e6e8e0;border-radius:7px;gap:3px;padding:3px;display:flex}.segmented button{color:#7c8277;background:0 0;border:0;border-radius:5px;padding:7px 16px;font-size:12px}.segmented button[aria-pressed=true]{color:#32372e;background:#fffefa;box-shadow:0 1px 3px #00000010}.stage-caption{color:#8b9185;letter-spacing:.5px;font-size:10px}.stage-bottom{color:#8b9183;justify-content:space-between;align-items:center;gap:10px;padding:0 26px 22px;font-size:11px;display:flex}.stage-bottom .view-control{color:#747e6c;background:0 0;border:0;align-items:center;gap:7px;font-size:11px;display:flex}.stage-bottom kbd{border:1px solid #cdd2c5;border-radius:4px;margin:0 3px;padding:2px 5px;font:10px inherit}.panel-heading{justify-content:space-between;align-items:center;font-size:13px;font-weight:550;display:flex}.panel-heading .small{letter-spacing:1px;color:#9a9f95;font-size:10px;font-weight:400}.status-row{color:#6e7968;align-items:center;gap:8px;font-size:12px;display:flex}.status-row .status-dot{background:#7e9871;border-radius:50%;width:7px;height:7px}.status-row[data-state=recording] .status-dot{background:var(--accent)}.status-row[data-state=error] .status-dot{background:#c48836}.timer-block{border-bottom:1px solid var(--line);padding:18px 0 20px}.timer{letter-spacing:-1.5px;margin:8px 0 7px;font:400 39px Consolas,Courier New,monospace}.timer-sub{color:#959b90;justify-content:space-between;font-size:10px;display:flex}.controls{grid-template-columns:1fr 42px;gap:8px;margin-top:19px;display:grid}.btn{background:#fdfefa;border:1px solid #d9ddd2;border-radius:7px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:10px 13px;font-size:12px;display:inline-flex}.btn.primary{background:var(--accent);color:#fff8ed;border-color:var(--accent)}.btn.primary:hover{background:#c64e2a}.btn:hover:not(:disabled){filter:brightness(.97)}.btn.icon{padding:8px}.record-symbol{background:currentColor;border-radius:50%;width:9px;height:9px}.pause-symbol{border-left:3px solid;border-right:3px solid;width:9px;height:11px}.stop-symbol{background:currentColor;border-radius:1px;width:9px;height:9px}.upload{background:0 0;width:100%;margin-top:8px}.settings{flex-direction:column;gap:18px;display:flex}.setting{justify-content:space-between;align-items:center;gap:12px;font-size:12px;display:flex}.setting span small{color:#969c90;margin-top:5px;font-size:10px;display:block}.switch{background:#d9ddd3;border:0;border-radius:12px;flex-shrink:0;width:33px;height:20px;padding:3px;transition:background .2s;display:block}.switch:before{content:"";background:#fff;border-radius:50%;width:14px;height:14px;transition:transform .2s;display:block;box-shadow:0 1px 2px #0002}.switch[aria-checked=true]{background:#737f68}.switch[aria-checked=true]:before{transform:translate(13px)}.range-heading{justify-content:space-between;align-items:center;font-size:12px;display:flex}.range-heading output{color:#78866e;font:12px Consolas,monospace}input[type=range]{accent-color:#78866e;cursor:pointer;width:100%;height:4px;margin:12px 0 0}.battery-points{color:#9ba293;justify-content:space-between;margin-top:7px;font:9px Consolas,monospace;display:flex}.panel-note{color:#939a8c;margin-top:auto;padding-top:6px;font-size:10px;line-height:1.8}.scenario-select{color:#6c7564;background:#f5f6f0;border:1px solid #d9ddd2;border-radius:6px;width:100%;padding:9px;font-size:11px}.lower{grid-template-columns:1fr 1fr;gap:36px;padding:28px 0 0;display:grid}.section-top{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.section-top h2{margin:0;font-size:13px;font-weight:550}.section-top span{color:#939b8b;font:10px Consolas,monospace}.screen-inspector{border-top:1px solid var(--line);align-items:center;gap:22px;min-height:150px;padding-top:18px;display:flex}.pixel-wrapper{background:#081511;border-radius:5px;flex-shrink:0;padding:8px;position:relative;box-shadow:inset 0 0 0 1px #263b31}.pixel-wrapper canvas{width:256px;height:128px;image-rendering:pixelated;display:block}.pixel-wrapper.grid:after{content:"";pointer-events:none;background-image:linear-gradient(90deg,#0006 1px,#0000 1px),linear-gradient(#0006 1px,#0000 1px);background-size:4px 4px;position:absolute;inset:8px}.inspector-info{color:#8a9380;flex-direction:column;gap:11px;font-size:11px;display:flex}.text-btn{text-align:left;color:#697a5f;text-underline-offset:3px;background:0 0;border:0;padding:2px 0;font-size:11px;text-decoration:underline}.files{border-top:1px solid var(--line);min-height:155px;padding-top:2px}.empty{color:#8a9381;padding:34px 0;font-size:12px;line-height:1.8}.file-row{border-bottom:1px solid #e3e6dc;grid-template-columns:28px 1fr auto;align-items:center;gap:9px;padding:13px 0;font-size:11px;display:grid}.file-number{color:#9ba391;font:11px Consolas,monospace}.file-name{color:#535f4a;font:11px Consolas,monospace}.file-name small{color:#979f8e;margin-top:4px;font:10px Segoe UI,Microsoft YaHei,sans-serif;display:block}.file-state{color:#8b966f;font-size:10px}.footer{border-top:1px solid var(--line);color:#91998a;justify-content:space-between;gap:20px;margin-top:30px;padding:18px 0 25px;font-size:10px;line-height:1.8;display:flex}.toast{color:#f5f7ee;z-index:10;background:#31382e;border-radius:8px;max-width:calc(100% - 30px);padding:12px 20px;font-size:12px;line-height:1.6;position:fixed;bottom:26px;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #0002}.advanced{color:#7d8971;margin-top:20px;font-size:11px}.advanced summary{cursor:pointer}.advanced-content{flex-wrap:wrap;align-items:center;gap:14px;padding-top:15px;display:flex}.advanced-content code{color:#939b8c;font-size:10px}.state-error{color:#a9722c!important}.dimension-scene{perspective:1600px;flex:1;justify-content:center;align-items:center;min-height:590px;padding:44px 42px 54px;display:flex;position:relative}.mechanics{border-top:1px solid var(--line);color:#77816c;padding-top:16px;font-size:11px}.mechanics h3{color:#4d5843;margin:0 0 14px;font-size:12px;font-weight:550}.mechanic-readout{justify-content:space-between;align-items:center;gap:12px;margin-top:10px;line-height:1.7;display:flex}.mechanic-readout output{color:#59684b;font-size:11px}.mechanics small{color:#98a08c;margin-top:12px;font-size:10px;line-height:1.8;display:block}.side-panel{border-left:1px solid var(--line);background:#fafaf7;flex-direction:column;gap:20px;padding:26px;display:flex}.stage-bottom .keys{display:none}.scenario-label{color:#8a9380;margin-bottom:9px;font-size:11px;display:block}.ruler-top{color:#8b9286;align-items:center;gap:15px;width:100%;font:10px Consolas,monospace;display:flex;position:absolute;top:-31px;left:0}.ruler-top:before,.ruler-top:after{content:"";border-top:1px solid #bdc3b6;flex:1;height:7px;transform:translateY(4px)}.ruler-top:before{border-left:1px solid #bdc3b6}.ruler-top:after{border-right:1px solid #bdc3b6}.ruler-side{writing-mode:vertical-rl;color:#8b9286;align-items:center;gap:12px;height:100%;font:10px Consolas,monospace;display:flex;position:absolute;top:0;right:-38px}.ruler-side:before,.ruler-side:after{content:"";border-right:1px solid #bdc3b6;flex:1;width:6px}.ruler-side:before{border-top:1px solid #bdc3b6}.ruler-side:after{border-bottom:1px solid #bdc3b6}.back-face .back-bottom{bottom:calc(5 * var(--unit));font-size:calc(1.4 * var(--unit));color:#727b6b;position:absolute;left:0;right:0}.card-rig{--unit:5.5px;--oled-scale:1;width:calc(57 * var(--unit));height:calc(88 * var(--unit));flex-shrink:0;position:relative}.device{--pitch:-12deg;--yaw:-24deg;--half-depth:calc(1.1 * var(--unit));width:100%;height:100%;transform:rotateY(var(--yaw)) rotateX(var(--pitch));transform-style:preserve-3d;border-radius:calc(2.2 * var(--unit));transition:transform .55s cubic-bezier(.2,.7,.3,1);position:relative}.face:before{content:"";border-radius:inherit;pointer-events:none;opacity:.7;mix-blend-mode:multiply;z-index:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23858b80' filter='url(%23n)' opacity='.28' d='M0 0h120v120H0z'/%3E%3C/svg%3E");position:absolute;inset:0}.face:after{content:"";pointer-events:none;border-radius:calc(1.8 * var(--unit));border:1px solid #ffffff60;position:absolute;inset:3px}.face{--control-y:calc(8.6 * var(--unit));border-radius:inherit;backface-visibility:hidden;background:linear-gradient(108deg,#dedfd8 0%,#eff0e9 18%,#dcded6 49%,#d2d5cc 83%,#e2e4dc 100%);border:1px solid #c8c9c3;flex-direction:column;justify-content:space-between;padding:0;display:flex;position:absolute;inset:0;box-shadow:inset 1px 1px 2px #ffffffe6,inset -2px 0 3px #9ba18f70}.front-face{transform:translateZ(var(--half-depth))}.back-face{transform:rotateY(180deg) translateZ(var(--half-depth))}.face[inert]{pointer-events:none}.control-recess{left:calc(4 * var(--unit));top:calc(var(--control-y) - 4.4 * var(--unit));width:calc(38.5 * var(--unit));height:calc(8.8 * var(--unit));border-radius:calc(5 * var(--unit));background:linear-gradient(110deg,#bcc1b419,#fbfcf526);border:1px solid #a5aa9e;position:absolute;box-shadow:0 1px #ffffffc0,inset 0 1px 2px #a5ab9c40}.screen-bezel{left:14%;right:auto;top:var(--control-y);background:#0d1411;border:1px solid #9a9f93;border-radius:3px;position:absolute;transform:translateY(-50%);box-shadow:inset 0 1px 2px #000b,0 1px 1px #ffffffe0;padding:5px!important}.screen-bezel:after{content:"";border-radius:inherit;pointer-events:none;background:0 0;position:absolute;inset:0}.screen-bezel canvas{image-rendering:pixelated;background:#06110f;width:64px;height:32px;display:block}.rgb-led{--led:#6eaa6c;left:40%;top:var(--control-y);width:calc(1.7 * var(--unit));height:calc(1.7 * var(--unit));background:radial-gradient(circle at 32% 25%, #fff9, var(--led) 45%, #374330);box-shadow:0 1px 1px #fff9, 0 0 7px color-mix(in srgb, var(--led) 45%, transparent);z-index:1;border:1px solid #949e8b;border-radius:50%;position:absolute;transform:translateY(-50%)}.rgb-led[data-color=red]{--led:#ea634b}.rgb-led[data-color=amber]{--led:#e3b94e}.rgb-led[data-color=blue]{--led:#598fdf}.rgb-led[data-color=cyan]{--led:#61bdb1}.rgb-led[data-color=off]{--led:#899184;box-shadow:inset 0 1px 2px #59634d60}.slide-switch{left:56%;top:var(--control-y);width:calc(6.2 * var(--unit));height:calc(5.6 * var(--unit));border-radius:calc(1.2 * var(--unit));touch-action:none;z-index:3;background:linear-gradient(#747d6b,#a7af9b);border:1px solid #8e9687;padding:0;position:absolute;transform:translateY(-50%);box-shadow:inset 0 2px 4px #3c493f70,0 1px 1px #fff9}.slide-switch .thumb{height:calc(2.7 * var(--unit));border-radius:calc(.6 * var(--unit));pointer-events:none;background:linear-gradient(#e2e6d8,#b7bfaa);border:1px solid #b2b9a6;transition:bottom .15s;position:absolute;bottom:2px;left:2px;right:2px;box-shadow:0 1px 3px #303b2d70,inset 0 1px #fff9}.slide-switch .thumb:after{content:"";background:repeating-linear-gradient(0deg,#0000 0 2px,#87947766 2px 3px);position:absolute;inset:3px 25%}.slide-switch[aria-checked=true] .thumb{bottom:calc(100% - 2.7 * var(--unit) - 2px)}.slide-switch:active:not(:disabled){transform:translateY(-50%)}.record-switch{left:78%;right:auto;top:var(--control-y);width:calc(8.4 * var(--unit));height:calc(8.4 * var(--unit));z-index:3;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(140deg,#e8ebdf,#c9cfbf 63%,#b7c0aa);border:1px solid #a7ad9c;border-radius:50%;place-items:center;min-width:0;min-height:0;transition:box-shadow .1s,filter .1s;display:grid;position:absolute;bottom:auto;transform:translateY(-50%);box-shadow:0 2px 2px #626e5880,inset 0 2px 1px #ffffffe0,inset 0 -2px 2px #a3ad96}.record-switch:before{width:calc(2.2 * var(--unit));height:calc(2.2 * var(--unit));content:none;background:#cf6b49;border-radius:50%;box-shadow:0 0 5px #e87c3730}.record-switch:active:not(:disabled),.record-switch.is-held{filter:brightness(.96);background:linear-gradient(140deg,#bcc4b0,#d6ddc9);transform:translateY(calc(2px - 50%));box-shadow:inset 0 2px 4px #6e7b6280,0 1px #ffffffe0}.back-face{text-align:center;padding:calc(4 * var(--unit));color:#7c8773;justify-content:center;gap:20px}.back-face .back-logo{font-size:calc(4.7 * var(--unit));letter-spacing:-1.5px;color:#939d89;opacity:.6;font-weight:400}.back-face .back-copy{font:calc(1.45 * var(--unit)) Consolas, monospace;letter-spacing:1px;color:#8b957f;line-height:1.9;font-size:calc(1.45 * var(--unit))}.orbit-scene{perspective:1300px;touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;outline:none}.orbit-scene:focus-visible{outline-offset:-8px;border-radius:18px;outline:2px solid #98a995}.orbit-scene[data-dragging=true]{cursor:grabbing}.orbit-scene[data-dragging=true] .device{will-change:transform;transition:none}.orbit-scene .card-rig{perspective:1300px;transform-style:preserve-3d;touch-action:none;pointer-events:none}.orbit-scene .device{pointer-events:auto}.scene-halo,.scene-floor,.card-shadow{pointer-events:none;position:absolute}.scene-halo{aspect-ratio:1;background:radial-gradient(#ffffffbf,#e0e6da26 58%,#0000 72%);border-radius:50%;width:min(96%,620px)}.scene-floor{background:radial-gradient(#c8d1c119,#0000 68%);border:1px solid #d9dfd040;border-radius:50%;width:min(78%,510px);height:16%;bottom:15%}.card-shadow{filter:blur(18px);width:90%;height:30px;transform:translateX(var(--shadow-shift,10px));background:#4c5c4642;border-radius:50%;bottom:-38px;left:5%}.enclosure-edge{left:calc(var(--edge-x) * var(--unit));top:calc(var(--edge-y) * var(--unit));width:calc(var(--edge-length) * var(--unit));height:calc(2 * var(--half-depth));transform:translate(-50%, -50%) rotateZ(var(--edge-angle)) rotateX(90deg);backface-visibility:hidden;pointer-events:none;background:linear-gradient(#f2f3ec,#d1d7c8 16%,#aab2a0 45%,#9ba394 51%,#d0d4c7 56%,#b2b7a9 82%,#e1e3db);border-top:.5px solid #f6f8ed;border-bottom:.5px solid #afb5a4;position:absolute}.face:after{background:radial-gradient(ellipse at var(--light-x,35%) 0%, #ffffff42, transparent 65%)}.face-signature{bottom:calc(5 * var(--unit));left:calc(5 * var(--unit));right:calc(5 * var(--unit));color:#87917e;opacity:.55;pointer-events:none;justify-content:space-between;align-items:center;display:flex;position:absolute}.face-signature span:first-child{font-size:calc(2.5 * var(--unit));letter-spacing:-.7px;font-weight:600}.face-signature span:last-child{font:calc(1.25 * var(--unit)) Consolas, monospace;letter-spacing:2px}.orbit-badge{white-space:nowrap;letter-spacing:1px;color:#8b9584;pointer-events:none;background:#fbfcf680;border:1px solid #d9dfd18c;border-radius:30px;align-items:center;gap:9px;padding:8px 12px;font-size:10px;display:flex;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.orbit-badge span{background:#899f7e;border-radius:50%;width:5px;height:5px}.orbit-badge i{background:#d9dfd1;width:1px;height:9px}.orbit-reset{color:#7f8b76;background:#ffffff70;border:1px solid #d9dfd1;border-radius:50%;place-items:center;width:34px;height:34px;transition:background .2s,color .2s;display:grid}.orbit-reset:hover{color:#46563e;background:#fffefa}.orbit-help{text-align:right;color:#7c8773;line-height:1.8}.orbit-help span{color:#9aa291;font-size:10px;display:block}@media (width>=1380px){:root{--unit:6.7px;--oled-scale:3}.card-rig{--unit:6px}.dimension-scene{min-height:630px}}@media (width<=1120px){.shell{padding:0 25px}:root{--unit:5px}.side-panel{padding:23px}.workspace{grid-template-columns:minmax(0,1fr) 285px}.screen-inspector{flex-direction:column;align-items:flex-start;gap:14px}.lower{gap:28px}.stage-toolbar{padding:20px}.stage-caption{display:none}}@media (width<=930px){:root{--unit:4px;--oled-scale:1}.workspace{grid-template-columns:minmax(0,1fr) 270px;min-height:580px}.card-rig .screen-bezel{padding:7px}.card-rig{--unit:4.8px}.dimension-scene{min-height:535px}.stage-bottom{flex-direction:column;align-items:center;gap:14px}}@media (width<=740px){.shell{padding:0 20px}.topbar{height:70px}.brand{font-size:19px}.brand span,.top-version,.revision{display:none}.top-info{gap:0}.intro{padding:27px 0 23px}.intro h1{font-size:26px}.intro p{font-size:12px}.workspace{grid-template-columns:1fr}.ruler-side{right:-25px}.side-panel{border-left:0;border-top:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.panel-heading,.panel-note{grid-column:1/-1}.timer-block{padding:0 0 15px}.timer{font-size:32px}.settings{gap:19px}.scenario-container{grid-column:1/-1}.lower{grid-template-columns:1fr;gap:26px}.screen-inspector{flex-direction:row;align-items:center;gap:20px}.footer{flex-direction:column;gap:4px}.card-rig{--unit:5.5px}.dimension-scene{min-height:590px;padding-bottom:50px}.mechanics{grid-column:1/-1}.stage-bottom{flex-flow:wrap;justify-content:space-between;align-items:center;font-size:10px}}@media (width<=490px){.stage-toolbar{padding:16px}.side-panel{grid-template-columns:1fr;padding:20px}.panel-heading,.panel-note,.scenario-container{grid-column:auto}.screen-inspector{flex-direction:column;align-items:flex-start}.intro h1{font-size:24px}.timer{font-size:35px}.settings{border-top:1px solid var(--line);padding-top:20px}.sim-badge{padding:6px 9px;font-size:10px}.ruler-side{right:-22px}.card-rig{--unit:4.2px}.dimension-scene{min-height:470px;padding:40px 24px 45px}.screen-bezel{left:6%;padding:3px!important}.rgb-led{left:43%}.slide-switch{left:57%}.record-switch{left:79%}.mechanics{grid-column:auto}.stage-bottom{padding:0 16px 18px;font-size:10px}}@media (width<=380px){.stage-toolbar{padding:14px}.card-rig{--unit:3.7px}.dimension-scene{min-height:425px}.screen-bezel{padding:2px!important}.record-switch{left:79%}.rgb-led{left:44%}.slide-switch{left:58%}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
