.sim-shell,.machine-sim{--sim-bg:#111b23;--sim-panel:#1b2933;--sim-line:#415561;--sim-ink:#f0f4f4;--sim-muted:#b6c6cf;--sim-accent:#ffbf48;--sim-teal:#6bd7dd;color:var(--sim-ink)}.sim-shell{max-width:1560px;margin:auto;padding:28px 40px 48px}.sim-shell *,.machine-sim *{box-sizing:border-box}.sim-shell button,.machine-sim button{cursor:pointer}.sim-shell button:disabled,.machine-sim button:disabled{cursor:not-allowed;opacity:.48}.sim-shell button,.sim-shell select,.machine-sim button,.machine-sim select{font:inherit}.sim-shell button:focus-visible,.sim-shell select:focus-visible,.sim-shell input:focus-visible,.machine-sim button:focus-visible,.machine-sim select:focus-visible,.machine-sim input:focus-visible{outline:3px solid var(--sim-accent);outline-offset:3px}.sim-shell button,.machine-sim button{transition:background-color .16s,color .16s}.sim-shell a{color:inherit}.sim-topbar{border-bottom:1px solid var(--sim-line);align-items:center;gap:12px;padding-bottom:22px;display:flex}.sim-brand-mark{background:var(--sim-accent);color:#14212a;border-radius:8px;place-items:center;width:36px;height:36px;display:grid}.sim-brand{letter-spacing:.1em;font-size:16px;font-weight:800;text-decoration:none}.sim-topbar p{color:var(--sim-muted);margin:0 0 0 auto;font-size:13px}.sim-page-title{justify-content:space-between;align-items:flex-end;gap:24px;padding:30px 0 24px;display:flex}.sim-eyebrow{letter-spacing:.08em;color:var(--sim-teal);font-size:11px;font-weight:750}.sim-page-title h1{letter-spacing:-.04em;margin:6px 0 7px;font-size:clamp(26px,3vw,38px);line-height:1.3}.sim-page-title p{color:var(--sim-muted);margin:0;font-size:14px}.sim-picker{border:1px solid var(--sim-line);background:var(--sim-panel);border-radius:12px;grid-template-columns:minmax(240px,1fr) auto;align-items:end;gap:24px;margin-bottom:20px;padding:18px 20px;display:grid}.sim-picker label{color:var(--sim-muted);margin-bottom:8px;font-size:12px;font-weight:700;display:block}.sim-select-wrap{position:relative}.sim-select-wrap select{appearance:none;width:100%;min-height:46px;color:var(--sim-ink);background:var(--sim-bg);text-overflow:ellipsis;border:1px solid #647986;border-radius:7px;padding:10px 38px 10px 13px;font-size:15px}.sim-select-wrap svg{pointer-events:none;color:var(--sim-muted);position:absolute;top:15px;right:12px}.sim-modes{border:1px solid var(--sim-line);background:var(--sim-bg);border-radius:9px;gap:4px;padding:4px;display:flex}.sim-modes button{min-width:120px;min-height:44px;color:var(--sim-muted);background:0 0;border:0;border-radius:5px;font-weight:700}.sim-modes button[aria-pressed=true]{background:var(--sim-accent);color:#13202a}.machine-sim{grid-template-columns:minmax(0,1fr) 370px;align-items:start;gap:24px;font-size:14px;line-height:1.6;display:grid}.sim-stage-column{min-width:0}.sim-stage{border:1px solid var(--sim-line);background:#14212a;border-radius:12px;height:530px;position:relative;overflow:hidden}.sim-stage-label{z-index:1;pointer-events:none;align-items:center;gap:8px;font-size:12px;display:flex;position:absolute;top:20px;left:22px;right:20px}.sim-dot{background:var(--sim-teal);border-radius:50%;width:7px;height:7px}.sim-stage-tag{color:var(--sim-muted);margin-left:auto}.sim-stage-cue{color:var(--sim-teal);pointer-events:none;background:#14212ae8;border:1px solid #506978;border-radius:5px;padding:5px 10px;font-size:12px;position:absolute;bottom:45px;left:20px}.sim-stage-bottom{pointer-events:none;justify-content:space-between;align-items:center;font-size:11px;display:flex;position:absolute;bottom:18px;left:20px;right:20px}.sim-stage-bottom>span:first-child{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.sim-key-dot{border-radius:2px;width:7px;height:7px;margin-left:10px;display:inline-block}.sim-key-dot:first-child{margin-left:0}.sim-key-dot.primary{background:var(--sim-accent)}.sim-key-dot.secondary{background:var(--sim-teal)}.sim-key-dot.ghost{background:#ff798c}.sim-fps{font-variant-numeric:tabular-nums;color:#b6c6cf;background:#14212acc;border-radius:4px;padding:3px 7px}.sim-camera{flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;display:flex}.sim-segments{border:1px solid var(--sim-line);border-radius:7px;gap:2px;padding:3px;display:flex}.sim-segments button{min-width:44px;min-height:44px;color:var(--sim-muted);background:0 0;border:0;border-radius:4px;padding:7px 12px;font-size:12px}.sim-segments button[aria-pressed=true]{color:#fff;background:#354a57}.sim-icon-button{min-height:44px;color:var(--sim-muted);background:0 0;border:0;align-items:center;gap:6px;padding:8px 10px;display:flex;font-size:12px!important}.sim-icon-button[aria-pressed=true]{color:var(--sim-accent)}.sim-caption{border-left:3px solid var(--sim-accent);background:#1b2933;border-radius:0 8px 8px 0;align-items:flex-start;gap:14px;min-height:100px;margin-top:18px;padding:16px 18px;display:flex}.sim-caption>span{white-space:nowrap;border:1px solid #70818a;border-radius:4px;flex-shrink:0;padding:3px 7px;font-size:11px}.sim-caption p{overflow-wrap:anywhere;margin:0;font-size:14px;line-height:1.8}.sim-muscles{grid-template-columns:1fr 1fr;gap:24px;margin:22px 0;display:grid}.sim-muscles p{color:var(--sim-muted);margin:6px 0 0;font-size:13px}.sim-controls{background:var(--sim-panel);border:1px solid var(--sim-line);border-radius:12px;min-width:0;padding:22px}.sim-control-heading h2{letter-spacing:-.04em;margin:8px 0;font-size:20px;line-height:1.5}.sim-control-heading p{color:var(--sim-muted);margin:0;font-size:13px}.sim-tempo{align-items:center;gap:20px;padding:24px 0 20px;display:flex}.sim-ring{flex-shrink:0;width:106px;height:106px;position:relative}.sim-ring svg{fill:none;stroke-width:4px;width:100%;height:100%;transform:rotate(-90deg)}.sim-ring-track{stroke:#3e5360}.sim-ring-value{stroke:var(--sim-accent);stroke-linecap:round}.sim-ring>div{text-align:center;place-items:center;display:grid;position:absolute;inset:0}.sim-ring strong{font-variant-numeric:tabular-nums;font-size:33px;font-weight:600;line-height:1.1}.sim-ring small{color:var(--sim-muted);margin-top:7px;font-size:11px;font-weight:400;display:block}.sim-tempo-text strong{font-size:16px}.sim-tempo-text p{color:var(--sim-muted);margin:7px 0;font-size:12px;line-height:1.8}.sim-breath{color:var(--sim-teal);align-items:center;gap:6px;font-size:12px;display:flex}.sim-playback{align-items:center;gap:9px;display:flex}.sim-primary,.sim-next{background:var(--sim-accent);color:#17242e;border:0;border-radius:7px;justify-content:center;align-items:center;gap:8px;min-height:46px;padding:10px 16px;display:flex;font-size:13px!important;font-weight:750!important}.sim-primary:hover{background:#ffd275}.sim-playback .sim-primary{flex:1}.sim-reset{min-width:44px;min-height:44px;color:var(--sim-muted);background:0 0;border:1px solid #647986;border-radius:7px;place-items:center;display:grid}.sim-load{border:0;margin:24px 0 0;padding:0}.sim-load legend{justify-content:space-between;width:100%;margin-bottom:10px;padding:0;font-size:13px;font-weight:600;display:flex}.sim-load legend>span{color:var(--sim-accent)}.sim-load-options{flex-wrap:wrap;gap:7px;display:flex}.sim-load-options button{min-width:61px;min-height:44px;color:var(--sim-muted);background:0 0;border:1px solid #647986;border-radius:6px;justify-content:center;align-items:center;gap:5px;padding:7px;font-size:13px;display:flex}.sim-load-options button[aria-pressed=true]{color:var(--sim-accent);border-color:var(--sim-accent);background:#ffbf4810}.sim-load-options small{font-size:10px}.sim-plate-icon{border:2px solid;border-radius:3px;width:7px;height:18px}.sim-pin-icon{background:currentColor;border-radius:3px;width:12px;height:4px}.sim-load>p,.sim-score-note{color:var(--sim-muted);margin:10px 0 0;font-size:11px;line-height:1.8}.sim-mistake{border-top:1px solid var(--sim-line);margin-top:22px;padding-top:22px}.sim-mistake label{align-items:center;gap:7px;margin-bottom:9px;font-size:13px;display:flex}.sim-mistake select{font-size:12px}.sim-ghost-note{color:#ffabb8;margin:10px 0 0;font-size:12px}.sim-lesson{border:1px solid #536875;border-radius:8px;margin-top:20px;padding:14px}.sim-lesson-heading{justify-content:space-between;font-size:13px;display:flex}.sim-lesson-heading>span{color:var(--sim-muted)}.sim-steps{gap:3px;margin:16px 0;padding:0;list-style:none;display:flex}.sim-steps li{text-align:center;color:var(--sim-muted);flex:1}.sim-steps li>span{border:1px solid #738895;border-radius:50%;place-items:center;width:24px;height:24px;margin:auto;font-size:10px;display:grid}.sim-steps li[aria-current=step]>span{color:#13202a;background:var(--sim-accent);border-color:var(--sim-accent)}.sim-steps li.done>span{color:var(--sim-teal);border-color:var(--sim-teal)}.sim-steps small{margin-top:5px;font-size:10px;line-height:1.5;display:block}.sim-lesson p{color:var(--sim-muted);font-size:12px}.sim-next{color:#f0f4f4;background:#334c5a;justify-content:space-between;width:100%;min-height:44px;margin-top:12px}.sim-checks label{cursor:pointer;align-items:flex-start;gap:8px;padding:8px 0;font-size:12px;display:flex}.sim-checks input{accent-color:var(--sim-accent);min-width:18px;min-height:18px}.sim-check-detail{color:var(--sim-muted);margin-top:5px;font-size:11px;display:block}.sim-experience{margin-top:20px}.sim-inputs{gap:14px;display:flex}.sim-hold{border:1px solid var(--sim-teal);color:#ecfbfb;touch-action:none;-webkit-user-select:none;user-select:none;background:#193d49;border-radius:9px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:7px;min-height:144px;display:flex}.sim-hold.held{background:#386672}.sim-hold span{font-size:14px;font-weight:700}.sim-hold small{color:#bedce4;font-size:10px}.sim-drag{width:48px;color:var(--sim-muted);flex-direction:column;align-items:center;gap:5px;font-size:11px;display:flex}.sim-drag input{writing-mode:vertical-lr;width:44px;height:106px;accent-color:var(--sim-accent);cursor:ns-resize;touch-action:none;direction:rtl}.sim-feedback{min-height:38px;color:var(--sim-teal);margin:12px 0;font-size:12px}.sim-scores{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0 0;display:grid}.sim-scores dt{color:var(--sim-muted);font-size:10px}.sim-scores dd{font-variant-numeric:tabular-nums;margin:5px 0 0;font-size:24px}.sim-scores small{color:var(--sim-muted);font-size:11px}.sim-summary{border-top:1px solid var(--sim-line);margin-top:20px;padding-top:20px}.sim-summary h3{font-size:20px}.sim-summary ul{color:var(--sim-muted);padding-left:18px;font-size:13px}.sim-summary>.sim-primary{width:100%;margin-top:16px}.sim-fallback{color:#c1d4df;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:20px;height:100%;min-height:300px;padding:40px;display:flex}.sim-footer{border-top:1px solid var(--sim-line);color:var(--sim-muted);justify-content:space-between;gap:18px;margin-top:24px;padding-top:18px;font-size:12px;line-height:1.8;display:flex}.sim-footer p{margin:0}.sim-completion-note{color:var(--sim-teal);margin-top:18px;font-size:13px}@media (min-width:1400px){.sim-stage{height:600px}.machine-sim{grid-template-columns:minmax(0,1fr) 390px;gap:30px}}@media (max-width:1050px){.sim-shell{padding:24px}.machine-sim{grid-template-columns:minmax(0,1fr) 330px;gap:18px}.sim-stage{height:470px}.sim-controls{padding:18px}.sim-camera{gap:2px}.sim-icon-button{padding:6px}}@media (max-width:790px){.sim-shell{padding:18px 16px 32px}.sim-topbar{padding-bottom:16px}.sim-page-title{padding:24px 0 20px;display:block}.sim-page-title p{font-size:13px;line-height:1.8}.sim-picker{grid-template-columns:1fr;gap:14px;padding:14px}.sim-modes button{flex:1}.machine-sim{display:block}.sim-stage{height:420px}.sim-controls{margin-top:22px;padding:20px}.sim-muscles{margin:18px 0}.sim-tempo{padding:18px 0}.sim-footer{flex-direction:column}.sim-caption{min-height:0;padding:14px}.sim-caption p{font-size:13px}.machine-sim[data-mode=experience] .sim-stage-column{display:contents}.machine-sim[data-mode=experience] .sim-stage{z-index:4;height:270px;position:sticky;top:8px;box-shadow:0 8px 24px #0008}.machine-sim[data-mode=experience] button,.machine-sim[data-mode=experience] input,.machine-sim[data-mode=experience] select{scroll-margin-top:300px}}@media (max-width:430px){.sim-topbar p{font-size:11px}.sim-stage{height:350px}.sim-stage-label{font-size:11px;top:15px;left:14px}.sim-stage-tag{font-size:10px}.sim-camera{justify-content:space-between}.sim-segments button{padding:7px 9px}.sim-stage-bottom{bottom:12px;left:14px;right:14px}.sim-muscles{gap:16px}.sim-caption{gap:9px}.sim-controls{padding:18px}}@media (prefers-reduced-motion:reduce){.sim-shell *,.machine-sim *{scroll-behavior:auto!important;transition:none!important}}.sim-embedded .machine-sim{display:block}.sim-embedded .sim-stage{height:min(340px,50dvh)}.sim-embedded .sim-controls{margin-top:12px}