.rocket-workshop{height:100dvh;box-sizing:border-box;display:flex;flex-direction:column;padding:8px;gap:8px;background:#132e36;overflow:hidden}
.rocket-workshop .topbar{flex:none;margin:0}
.workshop-viewport{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:18px;background:#122731}
.workshop-scene{position:absolute;left:50%;top:50%;width:1672px;height:941px;transform-origin:center;isolation:isolate;overflow:hidden;color:#fff1ca;font-family:system-ui,sans-serif}
.workshop-background{position:absolute;inset:0;z-index:-2;background:url('assets/rocket-workshop/workshop.webp') center/100% 100%}
.workshop-craft{position:absolute;left:278px;top:10px;width:338px;height:507px;transform-origin:center;pointer-events:none;z-index:-1}
.workshop-rocket-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rocket-part{opacity:0;transition:opacity .8s}
.rocket-part.built{opacity:1}
.rocket-blueprint{filter:grayscale(1) brightness(2)}
.workshop-build-meter{position:absolute;left:323px;top:573px;display:flex;gap:10px;padding:11px 17px;border-radius:25px;border:3px ridge #b88a43;background:#263d3bcc;box-shadow:0 3px 7px #0009}
.workshop-build-meter i{width:16px;height:16px;border-radius:50%;border:2px solid #c2a261;background:radial-gradient(at 30% 20%,#638171,#183d2c)}
.workshop-build-meter i.lit{background:radial-gradient(at 35% 25%,#f1ffc4,#7dee51 45%,#3b832e);box-shadow:0 0 12px #b4ff66}
.workshop-instruction{position:absolute;left:642px;top:348px;width:870px;min-height:48px;box-sizing:border-box;display:grid;place-items:center;margin:0;padding:5px 18px;border:4px ridge #bb883f;border-radius:24px;background:linear-gradient(110deg,#d7af6a,#fae0a3,#be8f4c);color:#47311f;font-size:27px;text-align:center;box-shadow:0 4px 9px #0007}
.workshop-screens{position:absolute;left:625px;top:416px;width:818px;height:214px;display:grid;grid-template-columns:repeat(var(--screens,3),minmax(0,1fr));gap:16px}
.workshop-screen{min-width:0;position:relative;box-sizing:border-box;border:7px ridge #bc934d;border-radius:19px;background:#fffbee;box-shadow:0 5px 9px #0008,inset 0 3px 8px #78481133;padding:21px 5px 5px;display:flex;flex-direction:column;gap:5px;color:#273e43;opacity:1!important;touch-action:manipulation;overflow:visible}
.workshop-screen:disabled{cursor:default}
.workshop-screen.active{border-color:#f4d584;box-shadow:0 0 17px #fff0afc0,inset 0 3px 8px #78481133}
.workshop-screen.wrong{border-color:#d97d52}
.workshop-position{position:absolute;top:-24px;left:calc(50% - 20px);width:40px;height:40px;border:4px ridge #cfab61;border-radius:50%;background:linear-gradient(#f8e2a8,#c79a50);color:#5c3a17;font-size:25px;font-weight:800;display:grid;place-items:center}
.workshop-lamp{position:absolute;top:5px;right:5px;width:19px;height:19px;border:2px solid #947337;border-radius:50%;background:#23473c;color:white;font:900 14px system-ui;display:grid;place-items:center}
.correct .workshop-lamp{background:radial-gradient(#d8ff87,#429b3c);box-shadow:0 0 12px #baff80}
.workshop-photo{display:grid;place-items:center;flex:1;min-height:0;overflow:hidden;border-radius:5px;background:#fffdf5}
.workshop-photo img{width:100%;height:100%;object-fit:contain;min-height:0;min-width:0}
.screen-question{font-size:72px;color:#bfb49c}
.workshop-word{flex:none;display:block;white-space:nowrap;max-width:100%;font-size:21px;font-weight:750;text-align:center;line-height:1.1;color:#253e42}
.workshop-word .article-het{color:#d21e1e}
.workshop-brass{position:absolute;left:1473px;top:456px;width:97px;height:97px;border:7px ridge #d3ae60;border-radius:50%;background:radial-gradient(at 35% 25%,#fff8db,#d2ae66);box-shadow:0 4px 9px #0009;color:#234a54;display:grid;place-items:center;cursor:pointer}
.workshop-brass svg{width:55px;height:55px;fill:currentColor}
.workshop-brass:disabled{opacity:.65;cursor:default}
.workshop-choices{position:absolute;left:510px;top:708px;width:1035px;height:206px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:23px}
.workshop-card{position:relative;min-width:0;min-height:0;padding:6px 6px 16px;border:4px ridge #d5b778;border-radius:15px 15px 5px 5px;background:#fffcf1;box-shadow:0 6px 12px #0008;cursor:pointer;transition:transform .15s;touch-action:manipulation}
.workshop-card img{width:100%;height:100%;object-fit:contain;display:block}
.workshop-card:disabled{opacity:1;visibility:hidden;pointer-events:none}
.workshop-card-foot{position:absolute;bottom:-8px;left:-10px;right:-10px;height:22px;background:linear-gradient(#c48843,#875124 35%,#693b1c 75%,#a2682e);border:2px solid #8f5a27;border-radius:4px;box-shadow:0 4px 6px #0006}
.workshop-card:not(:disabled):hover{transform:translateY(-6px)}
.workshop-intro{grid-column:1/-1;display:grid;place-items:center;text-align:center;font-size:33px;line-height:1.4;color:#fff1cc;text-shadow:0 2px 4px #0008}
.workshop-intro p{margin:0}
.workshop-action-area{position:absolute;left:540px;top:770px;width:990px;text-align:center}
.workshop-button{border:6px ridge #d2a255;border-radius:24px;background:linear-gradient(#f9de9c,#d2a15b);box-shadow:0 5px 12px #0008,inset 0 2px 3px #fff9;color:#51321b;min-height:78px;padding:15px 32px;font:800 30px system-ui;cursor:pointer;touch-action:manipulation}
.workshop-button:hover{filter:brightness(1.07)}
.workshop-button:focus-visible,.workshop-card:focus-visible,.workshop-screen:focus-visible,.workshop-brass:focus-visible{outline:5px solid #fff5ad;outline-offset:4px}
.workshop-final-area{position:absolute;left:370px;right:110px;bottom:27px}
.workshop-final-actions{display:flex;gap:35px;justify-content:center}
.workshop-final-actions .workshop-button{min-width:380px}
.workshop-final-actions [data-home]{background:linear-gradient(#49736e,#224e50);color:#fff3cd}
.workshop-countdown{position:absolute;left:1060px;top:280px;font-size:170px;font-weight:900;color:#fff9ce;text-shadow:0 0 25px #ffb321,0 5px 8px #0008}
.workshop-live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-background{background-image:url('assets/rocket-workshop/launchpad.webp')}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-craft{left:855px;top:90px;width:425px;height:638px;z-index:0}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-screens{left:50px;top:540px;width:680px;height:232px}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-instruction{left:580px;top:50px;width:980px}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-repeat{left:755px;top:590px}
.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-build-meter{display:none}
.workshop-scene[data-phase=ready] .workshop-action-area{left:375px;top:828px;width:1080px}
.workshop-fire{display:none;position:absolute;top:92%;left:35%;width:30%;height:45%;background:radial-gradient(ellipse at 50% 0,#fffef2 5%,#fff7a8 18%,#ffc94980 46%,transparent 70%);filter:drop-shadow(0 0 15px #ffcf7c);transform-origin:top;z-index:-1;clip-path:polygon(0 0,100% 0,65% 100%,50% 83%,35% 100%)}
.workshop-scene:is([data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-fire{display:block;animation:rocket-flame .2s ease-in-out infinite alternate}
.workshop-stars i{position:absolute;font-size:30px;color:#fff8ae;text-shadow:0 0 14px #ffca49;animation:workshop-twinkle 2.2s calc(var(--i)*.12s) infinite alternate;pointer-events:none}
@keyframes rocket-flame{to{transform:scaleY(.86);opacity:.7}}
@keyframes workshop-twinkle{from{opacity:.2;transform:scale(.7)}to{opacity:1;transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.rocket-part,.workshop-card{transition:none}.workshop-fire,.workshop-stars i{animation:none!important}}
.workshop-scene{overflow:clip}.workshop-launch{display:inline-block;width:auto;height:auto;min-height:78px;position:static;transform:none}

/* Keep replaced images out of grid intrinsic sizing, including tall source photos. */
.rocket-workshop .workshop-screens{grid-template-columns:repeat(var(--screens,1),minmax(0,190px));grid-template-rows:minmax(0,1fr);justify-content:center;align-items:stretch}
.rocket-workshop .workshop-screen{height:100%;min-height:0;max-height:100%;width:100%;margin:0}
.rocket-workshop .workshop-photo{position:relative;flex:1 1 0;min-height:0;min-width:0;width:100%;overflow:hidden}
.rocket-workshop .workshop-photo img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.rocket-workshop .workshop-choices{grid-template-rows:minmax(0,1fr)}
.rocket-workshop .workshop-card{height:100%;max-height:100%;box-sizing:border-box;overflow:visible}
.rocket-workshop .workshop-card img{position:absolute;left:6px;top:6px;width:calc(100% - 12px);height:calc(100% - 24px);object-fit:contain}
.rocket-workshop .workshop-intro{grid-column:1/-1;width:818px;justify-self:center}
.rocket-workshop .workshop-craft{top:40px}
.rocket-workshop .rocket-blueprint{display:none}
.rocket-workshop .workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .workshop-craft{top:90px}

.workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) .empty-cabin{display:none}
.workshop-card[aria-disabled=true]{pointer-events:none}

.rocket-workshop .workshop-score-stars .earned{color:#ffc21a;text-shadow:0 1px 1px #b78016}
.rocket-workshop .workshop-score-stars .pending{color:#d2dbd8;text-shadow:0 1px 0 #fff}

.rocket-workshop .workshop-screens{left:630px;top:425px;width:800px;height:195px;grid-template-columns:repeat(var(--screens),minmax(0,210px));gap:12px;z-index:1}
.rocket-workshop .workshop-screens:before{content:'';position:absolute;inset:-15px;z-index:-1;border-radius:15px;border:5px ridge #967343;background:linear-gradient(135deg,#112b31,#29494c);box-shadow:inset 0 7px 15px #000b,0 2px 2px #f1d09288}
.rocket-workshop .workshop-screen{border:4px ridge #b18b51;border-radius:10px;padding:18px 7px 7px;box-shadow:0 2px 5px #000a,inset 0 2px 5px #0002}
.rocket-workshop .workshop-choices{left:510px;top:718px;width:1020px;height:167px;grid-template-columns:repeat(var(--choices,4),minmax(0,1fr));gap:18px;padding:0 18px;box-sizing:border-box}
.rocket-workshop .workshop-choices:not(:empty):before{content:'';position:absolute;left:0;right:0;bottom:-17px;height:27px;border:3px ridge #b78443;border-radius:5px;background:linear-gradient(#ad7138,#5c351e);box-shadow:0 9px 12px #0009}
.rocket-workshop .workshop-card{border:4px ridge #b68b4c;border-radius:9px;background:#fffdf5;box-shadow:0 3px 5px #0007}
.rocket-workshop .workshop-card-foot{display:none}
.rocket-workshop .workshop-card img{height:calc(100% - 12px)}
.rocket-workshop .workshop-intro{width:780px;font-size:29px}
.rocket-workshop .score .workshop-score-stars .earned{color:#ffc21a!important;text-shadow:0 1px 1px #ad7914}
.rocket-workshop .score .workshop-score-stars .pending{color:#d1dad6!important;text-shadow:0 1px 0 white}

.rocket-workshop .workshop-scene:is([data-phase=ready],[data-phase=countdown],[data-phase=launch],[data-phase=celebrating],[data-phase=finished]) :is(.workshop-screens,.workshop-repeat){display:none}
.rocket-workshop .workshop-scene:is([data-phase=celebrating],[data-phase=finished]) .workshop-craft{visibility:hidden}
.workshop-constellation{position:absolute;left:755px;top:135px;width:590px;height:520px;overflow:visible}
.constellation-line{fill:none;stroke:#ffe7a0;stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 8px #ffc652);transition:stroke-dashoffset 1s ease}
.constellation-line.lit{stroke-dashoffset:0}
.constellation-star{opacity:0;transition:opacity .5s}
.constellation-star.lit{opacity:1}
.constellation-star circle{fill:#ffc746;opacity:.13}
.constellation-star path{fill:#fff4b9;filter:drop-shadow(0 0 9px #ffd250)}
.workshop-constellation text{fill:#fff1c6;font:700 31px system-ui;text-shadow:0 2px 5px #132a38}
@media(prefers-reduced-motion:reduce){.constellation-line,.constellation-star{transition:none}}

/* Reserve a clear status strip above the photo, including after a correct check. */
.rocket-workshop .workshop-screen{padding-top:32px}
.rocket-workshop .workshop-lamp{z-index:2;top:4px;right:5px}
