.game-shell:has(.sq-game){grid-template-columns:minmax(0,1fr);gap:12px}
.game-shell:has(.sq-game) .game-status{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px}
.game-shell:has(.sq-game) .game-status strong{max-width:68%}
.game-shell:has(.sq-game) .game-tools{flex-direction:row;padding:0}
.game-shell:has(.sq-game) .game-tools button{flex:1;padding:12px 8px;text-align:center}
.sq-game{width:min(100%,1140px);display:grid;gap:7px;color:#d8edf0}
.sq-title{margin:0;color:#d6a65c;font:900 clamp(2.15rem,4.6vw,3.85rem)/.86 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.055em;text-align:center;text-shadow:2px 3px 0 #53361f,0 0 20px #d59a3d45;text-transform:uppercase}
.sq-title span{display:block;margin-bottom:5px;color:#57cbd3;font:800 clamp(.72rem,1.4vw,1rem)/1 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.42em}
.sq-title span::before,.sq-title span::after{content:"";display:inline-block;width:70px;height:2px;margin:0 14px 4px;background:linear-gradient(90deg,transparent,#3db5c2)}
.sq-title span::after{background:linear-gradient(90deg,#3db5c2,transparent)}
.sq-console{--time-ratio:1;position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-areas:"summary" "orbit" "question" "choices" "actions" "prompt";gap:10px;padding:15px 27px 12px;border:2px solid #8d6c3c;border-radius:4px;background-color:#071116;background-image:linear-gradient(90deg,#03080bee,#071116cc 25%,#071116c7 75%,#03080bee),url("/assets/covers/space-quiz.webp");background-position:center 55%;background-size:cover;box-shadow:inset 0 0 0 5px #020507,inset 0 0 0 6px #5c492e,0 6px 0 #010203,0 14px 32px #000d}
.sq-console::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 45%,transparent 0 34%,#00070a66 76%),repeating-linear-gradient(90deg,transparent 0 124px,#46bec408 125px)}
.sq-console::after{content:"";position:absolute;inset:8px;z-index:1;pointer-events:none;border:1px solid #9c78455e;clip-path:polygon(0 0,38% 0,40% 2px,60% 2px,62% 0,100% 0,100% 100%,62% 100%,60% calc(100% - 2px),40% calc(100% - 2px),38% 100%,0 100%)}
.sq-summary{grid-area:summary;position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);margin-inline:74px;border:1px solid #277780;background:#041217f2;box-shadow:inset 0 0 0 2px #0c2d32,0 3px 0 #010506}
.sq-summary span{position:relative;display:grid;gap:2px;padding:8px 5px;text-align:center}.sq-summary span+span{border-left:1px solid #1b5158}
.sq-summary small{display:flex;align-items:center;justify-content:center;gap:4px;color:#54cbd4;font:900 .49rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.sq-summary small svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sq-summary strong{color:#d9edf0;font:900 1rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.04em}.sq-summary span:nth-child(3) strong{color:#e8b65e}.sq-summary span:nth-child(4) strong{color:#69d3d1}
.sq-summary span:last-child::before{content:"";position:absolute;left:8px;right:8px;bottom:4px;height:3px;background:#18383c}.sq-summary span:last-child::after{content:"";position:absolute;left:8px;bottom:4px;width:calc((100% - 16px)*var(--time-ratio));height:3px;background:#4bcad3;box-shadow:0 0 7px #4bcad3;transition:width .2s linear}
.sq-orbit{grid-area:orbit;position:relative;z-index:2;display:flex;justify-content:center;gap:66px;padding-block:3px 1px}.sq-orbit::before{content:"MISSION PROGRESS";position:absolute;bottom:100%;left:50%;color:#b69b70;font:900 .44rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.21em;transform:translateX(-50%)}
.sq-orbit span{position:relative;width:29px;aspect-ratio:1;display:grid;place-items:center;border:2px solid #5a7375;border-radius:50%;background:#071419;color:#a6bec0;font:900 .7rem "Barlow Condensed",system-ui,sans-serif;box-shadow:0 0 0 3px #020608,0 3px 0 #000}.sq-orbit span+span::before{content:"";position:absolute;right:100%;top:50%;width:70px;height:2px;background:#3a4c4d;transform:translateY(-50%)}
.sq-orbit span.active{border-color:#e3a93d;background:#6b3e12;color:#fff3d2;box-shadow:0 0 0 3px #020608,0 0 15px #e3a93d78}.sq-orbit span.done{border-color:#45c0c9;background:#2a8e95;color:#031113}.sq-orbit span.done::after{content:"\2713"}.sq-orbit span.done+span::before{background:#2da7b0;box-shadow:0 0 6px #43c7d0}
.sq-question-panel{grid-area:question;position:relative;z-index:2;width:min(100%,850px);min-height:154px;margin:auto;display:grid;place-content:center;gap:10px;padding:25px 62px 23px;border:2px solid #aa8150;background-color:#ead9b8;color:#07151a;background-image:radial-gradient(circle at 13% 24%,#7d674b 0 1px,transparent 1.5px),radial-gradient(circle at 82% 72%,#7d674b 0 1px,transparent 1.5px),linear-gradient(17deg,transparent 49.7%,#745f4430 50%,transparent 50.3%);background-size:91px 79px,117px 103px,100% 100%;box-shadow:inset 0 0 0 4px #f8e8c7,inset 0 0 0 5px #8e6c42,0 7px 18px #000b;text-align:center;clip-path:polygon(1.5% 0,98.5% 0,98.5% 6%,100% 6%,100% 94%,98.5% 94%,98.5% 100%,1.5% 100%,1.5% 94%,0 94%,0 6%,1.5% 6%)}
.sq-question-panel::before{content:"STAR CHART";position:absolute;top:0;left:50%;padding:5px 18px;border:1px solid #8f6c43;border-top:0;background:#c9ae7b;color:#40321f;font:900 .47rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.2em;transform:translateX(-50%)}
.sq-sector{color:#385f64;font:900 .7rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase}.sq-sector::before,.sq-sector::after{content:"";display:inline-block;width:55px;height:1px;margin:0 14px 3px;background:#8c714b}
.sq-question{max-width:770px;margin:0;font:900 clamp(1.38rem,2.9vw,2.32rem)/1.1 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.005em;text-wrap:balance}
.sq-hull{position:absolute;right:17px;top:13px;display:flex;align-items:center;gap:5px}.sq-hull small{color:#8d3d2f;font:900 .4rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase}.sq-hull span{width:15px;height:11px;border:1px solid #79594a;background:#8b7a68;opacity:.33;clip-path:polygon(20% 0,80% 0,100% 50%,80% 100%,20% 100%,0 50%)}.sq-hull span.active{border-color:#c9573b;background:#d7623d;opacity:1;filter:drop-shadow(0 0 4px #c64f34)}
.sq-choices{grid-area:choices;position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;width:min(100%,890px);margin:auto}
.sq-choice{min-height:70px;display:grid;grid-template-columns:48px 1fr 67px;align-items:center;gap:10px;padding:8px 13px;border:2px solid #8f714e;background:#07161beF;color:#e8e0cf;clip-path:polygon(2% 0,98% 0,98% 9%,100% 9%,100% 91%,98% 91%,98% 100%,2% 100%,2% 91%,0 91%,0 9%,2% 9%);box-shadow:inset 0 0 0 2px #173137,0 4px 0 #352515,0 8px 15px #000a;cursor:pointer;transition:transform .14s,border-color .14s,background .14s,box-shadow .14s,opacity .14s}
.sq-choice:hover:not(:disabled),.sq-choice:focus-visible{z-index:3;transform:translateY(-2px);border-color:#47c9d3;outline:3px solid #51d6de;outline-offset:2px;background:#0b2930;box-shadow:inset 0 0 0 2px #1f5960,0 4px 0 #16474e,0 9px 18px #000c}.sq-choice>span{width:43px;height:45px;display:grid;place-items:center;border:1px solid #2a8c95;color:#5ad4dd;font:900 1.45rem "Barlow Condensed",system-ui,sans-serif}.sq-choice strong{min-width:0;font:800 clamp(.86rem,1.75vw,1.08rem)/1.16 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.035em;text-align:center;text-transform:uppercase;text-wrap:balance}.sq-choice i{color:#7e999b;font:900 .38rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.1em;text-align:right;text-transform:uppercase}
.sq-choice.hinted{border-color:#e1a53a;box-shadow:inset 0 0 0 2px #40321c,0 0 0 4px #e1a53a,0 8px 18px #e1a53a55;animation:sq-pulse .68s ease-in-out infinite alternate}.sq-choice.correct{border-color:#43c7c2;background:#267d80;color:#f2ffff;box-shadow:inset 0 0 0 2px #72ded8,0 4px 0 #185355}.sq-choice.wrong{border-color:#a34333;background:#9d3d2d;color:#fff2e2;animation:sq-shake .24s linear}.sq-choice.rejected{border-color:#5c5e59;background:#343c3d;color:#aaa79e;box-shadow:none;opacity:.68}.sq-choice:disabled{cursor:default}
.sq-actions{grid-area:actions;position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,240px));justify-content:center;gap:14px}.sq-actions button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #328c94;border-radius:2px;background:#061b20;color:#64d3da;font:900 .75rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 3px 0 #010607;cursor:pointer}.sq-actions button:last-child{border-color:#bd7b28;background:#4b2c10;color:#f4b649}.sq-actions button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sq-actions button:hover:not(:disabled),.sq-actions button:focus-visible{outline:3px solid #50d0d8;outline-offset:2px;transform:translateY(-1px)}.sq-actions button:disabled{opacity:.38;cursor:default;transform:none}
.sq-prompt{grid-area:prompt;position:relative;z-index:2;margin:0;padding-top:5px;border-top:1px solid #5f4d32;color:#b4cacc;font-size:.59rem;line-height:1.35;text-align:center}.sq-game.paused .sq-question-panel,.sq-game.paused .sq-choices,.sq-game.paused .sq-orbit{opacity:.42}.sq-game.complete .sq-title{color:#63d4d2;text-shadow:2px 3px 0 #20595b,0 0 24px #4ccac966}
@keyframes sq-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes sq-pulse{to{box-shadow:inset 0 0 0 2px #40321c,0 0 0 5px #e1a53a,0 9px 19px #e1a53a77}}@media(prefers-reduced-motion:reduce){.sq-choice,.sq-summary span:last-child::after{transition:none}.sq-choice.wrong,.sq-choice.hinted{animation:none}}
@media(max-width:720px){.game-shell:has(.sq-game) .game-status{align-items:flex-start;flex-direction:column;gap:7px}.game-shell:has(.sq-game) .game-status strong{max-width:none}.sq-title{font-size:2rem}.sq-title span{font-size:.66rem}.sq-title span::before,.sq-title span::after{width:34px}.sq-console{gap:8px;padding:10px 9px;background-position:center}.sq-summary{margin-inline:3px}.sq-summary span{padding:7px 2px}.sq-summary small{font-size:.37rem}.sq-summary strong{font-size:.73rem}.sq-question-panel{min-height:128px;padding:19px 34px}.sq-question-panel::before{font-size:.38rem;padding:4px 12px}.sq-sector{font-size:.55rem}.sq-sector::before,.sq-sector::after{width:28px;margin-inline:8px}.sq-question{font-size:clamp(1.14rem,5vw,1.66rem)}.sq-hull{right:10px;top:9px}.sq-hull small{display:none}.sq-choices{gap:8px}.sq-choice{min-height:60px;grid-template-columns:35px 1fr;padding:7px 9px}.sq-choice>span{width:31px;height:38px;font-size:1.18rem}.sq-choice strong{font-size:.8rem}.sq-choice i{display:none}.sq-orbit{gap:39px}.sq-orbit span{width:26px}.sq-orbit span+span::before{width:43px}.sq-actions button{min-height:46px}.sq-prompt{font-size:.52rem}}
@media(max-width:430px){.sq-title{font-size:1.68rem}.sq-title span{font-size:.55rem}.sq-title span::before,.sq-title span::after{width:24px;margin-inline:8px}.sq-summary small{font-size:.3rem;letter-spacing:.08em}.sq-summary strong{font-size:.62rem}.sq-question-panel{min-height:116px;padding:18px 15px 15px}.sq-sector{font-size:.47rem}.sq-sector::before,.sq-sector::after{width:16px;margin-inline:5px}.sq-question{font-size:1.07rem}.sq-hull{position:static;justify-content:center}.sq-choices{grid-template-columns:1fr}.sq-choice{min-height:52px}.sq-choice strong{font-size:.78rem}.sq-orbit{gap:25px}.sq-orbit span{width:24px}.sq-orbit span+span::before{width:28px}.sq-prompt{display:none}}