/* A physical instrument, built from CSS planes. The screen remains ordinary accessible HTML. */
.rain{display:none}
.hero-image{transform:none}
.checkpoint-cases{margin:0 0 55px}
.checkpoint-cases .case-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0}
.checkpoint-cases .case-gallery button.case-card{display:grid;grid-template-columns:40% 60%;margin:0;border-radius:8px}
.checkpoint-cases .case-gallery .case-art{height:100%;min-height:205px}
.checkpoint-cases .case-gallery .case-card-copy{padding:22px}
.checkpoint-cases .case-gallery .case-card-copy>b,.checkpoint-cases .case-gallery .case-card-copy>b:lang(en){font-size:40px;margin:10px 0}
.checkpoint-cases .case-gallery .case-card-copy>span{font-size:11px;line-height:1.6}
.checkpoint-cases .case-gallery .case-card-copy>.case-link{margin-top:14px;padding-top:10px}
.checkpoint-cases .case-gallery .case-open{display:none}
.demo-workbench{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:6vw;align-items:start}
.checkpoint-chapter{padding:28px 0 45px;border-top:1px solid var(--line);scroll-margin-top:120px}
.chapter-index{display:block;font:10px var(--mono);color:#b9c3b0;margin-bottom:20px;letter-spacing:.04em}
.checkpoint-chapter h3{font:550 45px/.98 var(--display);margin:0 0 18px;max-width:430px;text-wrap:balance}
.checkpoint-chapter p{font-size:15px;line-height:1.8;max-width:440px}
.checkpoint-chapter .case-resource{font:10px/1.8 var(--mono);overflow-wrap:anywhere;margin:0 0 20px;color:#bbc7b2}
.checkpoint-chapter .chapter-aside{font-size:13px;color:#b9c3b0;margin-top:18px}
.checkpoint-chapter .text-link{margin-top:25px}
.checkpoint-chapter.chapter-current{border-color:var(--amber)}
.checkpoint-chapter.chapter-current .chapter-index{color:var(--amber)}
.checkpoint-chapter .source-card{border:0;background:#1d291f;padding:18px;border-radius:6px}
.checkpoint-chapter .source-card>div{margin:0 0 12px;font-size:11px;color:var(--amber)}
.checkpoint-chapter .source-card p{font-size:11px}
.demo-output{min-width:0}
.console-scene{perspective:1400px;padding:30px 20px 18px 0}
.console-orbit{transform-style:preserve-3d;transform:rotateX(7deg) rotateY(-13deg);transform-origin:center 48%}
.console-shell{position:relative;transform-style:preserve-3d;background:#555946;padding:0 18px 0;border-radius:12px;box-shadow:16px 30px 45px #050d0980}
.console-top{position:absolute;inset:0 0 auto;height:44px;transform-origin:center top;transform:rotateX(-90deg);background:#767863;border-radius:10px 10px 0 0}
.console-side{position:absolute;top:0;bottom:0;right:0;width:44px;transform-origin:right center;transform:rotateY(-90deg);background:#303829;border-radius:0 10px 10px 0}
.console-brow{display:flex;align-items:center;gap:16px;height:61px;color:#f1e8cb}
.console-brow b{font:700 32px/1 var(--display);letter-spacing:.02em}
.console-brow span{font:8px var(--mono);letter-spacing:.06em;flex:1}
.console-brow i{display:block;width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 2px 4px #141a1280}
.console-shell .episode-stage{height:404px;border:5px solid #21291e;border-radius:12px;box-shadow:0 3px 8px #17201390;isolation:isolate}
.console-shell .episode-instruments{font-size:8px;padding:15px 18px}
.console-shell .episode-progress{top:47px;left:18px;right:18px;gap:18px;font-size:9px}
.console-shell .episode-context{top:90px;left:18px;right:18px;max-width:330px}
.console-shell .episode-context h3{font-size:36px;max-width:310px}
.console-shell .episode-context p{display:none}
.console-shell .episode-route{height:155px;left:14px;right:14px;bottom:18px}
.console-shell .route-node{gap:3px}
.console-shell .route-node strong{font-size:11px;min-height:0}
.console-shell .route-node small{font-size:9px;line-height:1.5;min-height:27px}
.console-shell .request-packet{width:160px;min-height:57px}
.console-shell .request-packet code{font-size:11px}
.console-shell .request-packet span{font-size:8px}
.console-shell .route-line{top:89px}
.console-shell .episode-shade{background:linear-gradient(90deg,#101713e6,#10171385 55%,#10171340),linear-gradient(0deg,#111814 0%,#1118149c 42%,transparent 80%)}
.console-deck{display:flex;align-items:center;gap:14px;min-height:98px;color:#eee9d8}
.console-deck-label{font-size:10px;max-width:55px;line-height:1.5}
.console-steps{display:flex;gap:8px;flex:1}
.console-steps button{border:0;border-radius:4px;padding:9px 10px;background:#303b2d;color:#dce3d1;box-shadow:0 3px 5px #18201777;min-height:48px;flex:1;text-align:left;transition:transform 140ms var(--ease),background 180ms ease}
.console-steps button i{font:9px var(--mono);display:block;font-style:normal;margin-bottom:3px;opacity:.8}
.console-steps button span{font-size:11px}
.console-steps button[aria-pressed=true]{background:var(--amber);color:#182017}
.console-steps button:focus-visible{outline:2px solid #fff4cc;outline-offset:4px}
.console-serial{font:8px var(--mono);writing-mode:vertical-rl;letter-spacing:.08em;color:#d9dac1}
.console-caption{font:10px/1.7 var(--mono);color:#b9c3b0;padding:8px 20px 0 0;text-align:center}
.demo-output .episode-controls{padding:18px 20px 0 0;gap:15px;align-items:stretch;flex-direction:column}
.demo-output .episode-controls .button{min-height:44px;justify-content:center;align-self:flex-start;padding:10px 18px;min-width:0}
.demo-output .episode-verdict{min-height:92px;order:-1}
.demo-output .episode-verdict strong{font-size:30px}
.demo-output .episode-verdict>span{font-size:13px;max-width:540px}
@media(min-width:1100px) and (min-height:680px) and (hover:hover){
 .scroll-scene .demo-output{position:sticky;top:82px}
 .scroll-scene .checkpoint-chapter{min-height:365px}
 .scroll-scene .checkpoint-chapter:first-child{min-height:510px}
 .scroll-scene .checkpoint-chapter:last-child{min-height:380px;padding-bottom:160px}
}
@media(min-width:1100px) and (max-height:900px){
 .console-scene{padding-top:10px;padding-bottom:10px}
 .console-brow{height:43px}
 .console-shell .episode-stage{height:310px}
 .console-shell .episode-progress{top:38px}
 .console-shell .episode-context{top:72px}
 .console-shell .episode-context h3{font-size:29px;max-width:350px}
 .console-shell .episode-route{height:135px;bottom:12px}
 .console-shell .request-packet{min-height:50px;padding:7px 10px}
 .console-shell .route-line{top:76px}
 .console-deck{min-height:74px}
 .console-caption{padding-top:3px;font-size:9px}
 .demo-output .episode-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding-top:12px;align-items:center}
 .demo-output .episode-verdict{min-height:100px;order:0}
 .demo-output .episode-verdict strong{font-size:28px}
 .demo-output .episode-verdict>span{font-size:11px}
 .demo-output .episode-controls .button{order:1;font-size:10px;padding:10px;align-self:center}
}
@media(hover:hover) and (pointer:fine){
 .console-steps button:hover{background:#43523b}
 .console-steps button[aria-pressed=true]:hover{background:#f2c58d}
 .console-steps button:active{transform:translateY(2px)}
}
@media(max-width:1099px){
 .demo-workbench{gap:28px;grid-template-columns:1fr 1.2fr}
 .console-scene{padding:0}
 .console-orbit{transform:none}
 .console-top,.console-side{display:none}
 .console-shell{padding-inline:12px}
 .console-shell .episode-stage{height:420px}
 .console-shell .episode-context h3{font-size:32px}
 .console-serial,.console-deck-label{display:none}
 .console-steps button{padding:9px 7px}
 .console-steps button span{font-size:10px}
 .checkpoint-cases .case-gallery button.case-card{display:block}
 .checkpoint-cases .case-gallery .case-art{height:145px;min-height:0}
 .checkpoint-cases .case-gallery .case-card-copy{padding:18px}
 .checkpoint-cases .case-gallery .case-card-copy>b{font-size:37px}
}
@media(max-width:760px){
 .checkpoint-cases{margin-bottom:32px}
 .checkpoint-cases .case-gallery{display:flex;gap:12px;margin-inline:-22px;padding:5px 22px 15px}
 .checkpoint-cases .case-gallery button.case-card{flex:0 0 76%;display:grid;grid-template-columns:38% 62%;scroll-snap-align:start}
 .checkpoint-cases .case-gallery .case-art{height:100%;min-height:190px;grid-column:1;grid-row:1}
 .checkpoint-cases .case-gallery .case-card-copy{padding:15px;grid-column:2;grid-row:1}
 .checkpoint-cases .case-gallery .case-card-copy>b,html[lang=en] .checkpoint-cases .case-gallery .case-card-copy>b{font-size:33px}
 .checkpoint-cases .case-gallery .case-card-copy>.case-link{font-size:10px}
 .demo-workbench{display:flex;flex-direction:column;gap:22px}
 .demo-input,.demo-output{width:100%}
 .checkpoint-chapter{padding:22px 0}
 .checkpoint-chapter h3{font-size:36px}
 .checkpoint-chapter p{font-size:14px}
 .chapter-index{margin-bottom:13px;font-size:9px}
 .checkpoint-chapter:not(:first-child){display:none}
 .demo-output{display:block;margin:0}
 .console-scene{padding:0}
 .console-shell{padding-inline:10px;border-radius:9px;box-shadow:0 15px 25px #050d0966}
 .console-brow{height:50px;gap:12px;padding:0 4px}
 .console-brow b{font-size:30px}
 .console-brow span{font-size:7px}
 .console-shell .episode-stage{height:350px;border-width:3px;border-radius:8px}
 .console-shell .episode-context{top:80px;left:13px;right:13px;max-width:250px}
 .console-shell .episode-context h3{font-size:29px;max-width:245px}
 .console-shell .episode-instruments{font-size:7px;padding:13px 12px}
 .console-shell .episode-progress{top:40px;left:13px;right:13px;font-size:8px;gap:9px}
 .console-shell .episode-art{inset:0;height:100%;width:100%;object-position:67% center}
 .console-shell .episode-route{left:7px;right:7px;bottom:15px;height:155px}
 .console-shell .request-packet{width:126px;padding:8px;min-height:58px}
 .console-shell .request-packet code{font-size:9px}
 .console-shell .route-node strong{font-size:9px}
 .console-shell .route-node small{font-size:8px;min-height:27px}
 .console-deck{min-height:80px;gap:0}
 .console-steps{gap:7px}
 .console-steps button{padding:7px 10px}
 .console-steps button span{font-size:10px}
 .console-caption{font-size:9px;padding-right:0;margin-top:5px}
 .demo-output .episode-controls{padding:15px 0 0}
 .demo-output .episode-verdict{min-height:118px}
 .demo-output .episode-controls .button{width:100%;align-self:stretch}
 .demo-output .episode-verdict strong{font-size:31px}
 .episode-note{font-size:11px;margin-top:22px}
}
html.motion-paused .console-orbit{transform:none!important}
html.motion-paused .demo-output{position:static}
html.motion-paused .checkpoint-chapter{min-height:0;padding-bottom:35px}
@media(prefers-reduced-motion:reduce){
 .console-orbit{transform:none!important}
 .demo-output{position:static}
 .checkpoint-chapter{min-height:0;padding-bottom:35px}
}