.sim-demo{margin:32px 0 56px;padding:28px;border:1px solid #e1e4e6;border-radius:22px;background:linear-gradient(145deg,#fafbfc,#fff);color:#171b1d}.sim-demo h2,.sim-demo h3{font-size:clamp(22px,2.3vw,32px);margin:0 0 8px;letter-spacing:-.035em}.sim-demo-intro{max-width:760px;color:#5b646a;margin:0 0 22px;line-height:1.6}.sim-demo-steps{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;list-style:none;padding:0;margin:0 0 16px;counter-reset:sim}.sim-demo-steps li{font-size:12px;line-height:1.5;padding:10px;border-top:2px solid #dee2e5;color:#647078;counter-increment:sim}.sim-demo-steps li:before{content:'0' counter(sim);display:block;font-weight:700;font-size:14px}.sim-demo-steps li[aria-current]{border-color:#f36e18;color:#bd440b;background:#fff4eb;border-radius:0 0 8px 8px}.sim-stage{height:440px;position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:20px}.sim-stage canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}.sim-stage canvas:focus-visible{outline:2px solid #f36e18;outline-offset:3px}.sim-viewport{position:relative;min-width:0}.sim-viewport h4{position:absolute;top:0;left:0;margin:0;font-size:13px;color:#647078;font-weight:500}.sim-device-view{border-left:1px solid #e3e6e8}.sim-device-view h4{left:16px}.sim-preview{position:absolute;inset:32px 0 0;width:100%;height:calc(100% - 48px);object-fit:contain}.sim-demo[data-state=ready] .sim-preview{display:none}.sim-demo [hidden]{display:none!important}.sim-demo button{border:1px solid #d9dee1;border-radius:999px;padding:11px 20px;background:white;color:#171b1d;font:inherit;font-size:14px;cursor:pointer;min-height:44px}.sim-demo button:focus-visible{outline:2px solid #f36e18;outline-offset:3px}.sim-demo button[data-sim-play],.sim-demo button[data-sim-load]{background:#171b1d;color:white;border-color:#171b1d}.sim-controls{border-top:1px solid #e1e4e6;padding-top:18px}.sim-controls-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.sim-controls-top label{font-weight:600}.sim-controls input{width:100%;accent-color:#e86618;min-height:32px;cursor:pointer}.sim-controls output{display:block;color:#b9450b;font-weight:600;min-height:1.7em;margin-top:8px}.sim-note{font-size:12px;color:#647078;line-height:1.7;margin:10px 0 0}.sim-load-status:empty{display:none}@media(max-width:700px){.sim-demo{padding:18px 14px;margin:24px 0 36px}.sim-demo-steps{grid-template-columns:repeat(3,1fr);gap:4px}.sim-demo-steps li{padding:6px;font-size:11px}.sim-stage{height:580px;grid-template-columns:1fr;grid-template-rows:310px 250px;gap:20px}.sim-device-view{border-left:0;border-top:1px solid #e3e6e8}.sim-device-view h4{top:10px;left:0}.sim-controls-top{align-items:flex-start;flex-direction:column}.sim-controls-top>div{display:flex;gap:8px}.sim-demo-intro{font-size:14px}.sim-preview{inset:20px 0;height:calc(100% - 40px)}}

/* One continuous display: the tray and eject tool are mounted on its body. */
.sim-stage{height:530px;display:block}.sim-device-view{height:100%;width:100%;border:0}.sim-device-view h4{left:0;top:0}.sim-demo-steps li{font-size:14px}@media(max-width:700px){.sim-stage{height:440px}.sim-device-view{border:0}.sim-demo-steps li{font-size:12px}.sim-device-view h4{font-size:12px}}