.game-shell:has(.tq-game){grid-template-columns:minmax(0,1fr);gap:12px}
.game-shell:has(.tq-game) .game-status{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px}
.game-shell:has(.tq-game) .game-status strong{max-width:68%}
.game-shell:has(.tq-game) .game-tools{flex-direction:row;padding:0}
.game-shell:has(.tq-game) .game-tools button{flex:1;padding:12px 8px;text-align:center}
.tq-game{width:min(100%,1140px);display:grid;gap:7px;color:#dffaff}
.tq-title{position:relative;margin:0;color:#8defff;font:900 clamp(2rem,4.6vw,3.75rem)/.86 "Barlow Condensed",system-ui,sans-serif;letter-spacing:.075em;text-align:center;text-shadow:0 0 8px #35d8ff,2px 3px 0 #01090f;text-transform:uppercase}
.tq-title span{display:block;margin-bottom:6px;color:#f2b64a;font:800 .34em Inter,system-ui,sans-serif;letter-spacing:.38em}
.tq-title::before,.tq-title::after{content:"";position:absolute;top:19%;width:min(13vw,145px);height:1px;background:linear-gradient(90deg,transparent,#37ccea)}
.tq-title::before{right:calc(50% + min(25vw,280px))}.tq-title::after{left:calc(50% + min(25vw,280px));background:linear-gradient(90deg,#37ccea,transparent)}
.tq-console{--time-ratio:1;position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-areas:"summary" "question" "choices" "trace" "actions" "prompt";gap:10px;padding:15px 27px 12px;border:2px solid #244e61;border-radius:8px;background-color:#07131d;background-image:linear-gradient(90deg,#02080df2,#06131dc7 24%,#06131dbd 76%,#02080df2),linear-gradient(0deg,#031018e8,#071b26a8),url("/assets/covers/technology-quiz.webp");background-position:center 46%;background-size:cover;box-shadow:inset 0 0 0 5px #010609,inset 0 0 0 6px #173947,0 6px 0 #010609,0 15px 34px #000d}
.tq-console::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 28%,#19d9ff1e 0 22%,transparent 60%),repeating-linear-gradient(90deg,transparent 0 63px,#2ad6f409 64px 65px)}
.tq-console::after{content:"";position:absolute;inset:8px;z-index:1;pointer-events:none;border:1px solid #39cae74a;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%)}
.tq-summary{grid-area:summary;position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);margin-inline:55px;border:1px solid #3096b0;border-radius:4px;background:#03121bd9;box-shadow:inset 0 0 0 2px #0d2c39,0 4px 0 #00080d,0 0 17px #22c9ed22;color:#cff8ff}
.tq-summary span{position:relative;display:grid;gap:3px;padding:8px 5px;text-align:center}.tq-summary span+span{border-left:1px solid #1d5365}
.tq-summary small{display:flex;align-items:center;justify-content:center;gap:5px;color:#5ecde3;font:800 .48rem Inter,system-ui,sans-serif;letter-spacing:.17em;text-transform:uppercase}
.tq-summary small svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.tq-summary strong{font:800 1rem "Barlow Condensed",system-ui,sans-serif;letter-spacing:.08em}.tq-summary span:nth-child(3) strong{color:#f2b64a}.tq-summary span:nth-child(4) strong{color:#75e5f4}
.tq-summary span:last-child::before{content:"";position:absolute;left:8px;right:8px;bottom:4px;height:3px;background:#163743}.tq-summary span:last-child::after{content:"";position:absolute;left:8px;bottom:4px;width:calc((100% - 16px)*var(--time-ratio));height:3px;background:#f2b64a;box-shadow:0 0 7px #f2b64a;transition:width .2s linear}
.tq-question-panel{grid-area:question;position:relative;z-index:2;width:min(100%,930px);min-height:166px;margin:auto;display:grid;place-content:center;gap:10px;padding:31px 88px 24px;border:2px solid #278aa3;border-radius:17px;background-color:#092435;color:#defaff;background-image:linear-gradient(#29cef00e 1px,transparent 1px),linear-gradient(90deg,#29cef00e 1px,transparent 1px),radial-gradient(ellipse at center,#0f4561,#061925 72%);background-size:28px 28px,28px 28px,100% 100%;box-shadow:inset 0 0 0 4px #020a0f,inset 0 0 26px #29d8ff2e,0 7px 18px #000c;text-align:center}
.tq-question-panel::before{content:"DIAGNOSTIC CHANNEL";position:absolute;top:0;left:50%;padding:5px 23px;border:1px solid #2ca9c5;border-top:0;background:#092c3c;color:#79e8fa;font:800 .48rem Inter,system-ui,sans-serif;letter-spacing:.22em;transform:translateX(-50%)}
.tq-system{color:#f2b64a;font:800 .68rem Inter,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase}.tq-system::before,.tq-system::after{content:"";display:inline-block;width:52px;height:1px;margin:0 14px 3px;background:#35c6e6}
.tq-question{max-width:800px;margin:0;font:700 clamp(1.2rem,2.35vw,1.9rem)/1.18 ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:-.025em;text-wrap:balance}
.tq-fuses{position:absolute;right:15px;top:13px;display:flex;align-items:center;gap:7px}.tq-fuses small{color:#7db7c4;font:800 .39rem Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.tq-fuses span{position:relative;width:21px;height:10px;border:1px solid #916934;border-radius:7px;background:#433821;opacity:.28}.tq-fuses span::before,.tq-fuses span::after{content:"";position:absolute;top:2px;width:3px;height:4px;background:#74808a}.tq-fuses span::before{left:-3px}.tq-fuses span::after{right:-3px}.tq-fuses span.active{border-color:#f2b64a;background:#e88e2d;box-shadow:inset 0 0 0 2px #ffc95f,0 0 9px #ffae32;opacity:1}
.tq-choices{grid-area:choices;position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;width:min(100%,950px);margin:auto}
.tq-choice{position:relative;overflow:hidden;min-height:68px;display:grid;grid-template-columns:48px 1fr 64px;align-items:center;gap:10px;padding:9px 14px;border:1px solid #2aa8c5;border-radius:4px;background:#09273a;color:#dffaff;box-shadow:inset 0 0 0 3px #031018,0 4px 0 #00080d,0 8px 15px #0009;cursor:pointer;transition:transform .14s,border-color .14s,background .14s,box-shadow .14s,opacity .14s}
.tq-choice::before{content:"";position:absolute;inset:5px;z-index:0;pointer-events:none;border:1px solid #2da6bf3d;background:repeating-linear-gradient(90deg,transparent 0 26px,#36d5f20a 27px 28px)}
.tq-choice:hover:not(:disabled),.tq-choice:focus-visible{z-index:3;transform:translateY(-2px);border-color:#7beaff;outline:3px solid #2ed4f4;outline-offset:2px;background:#0c3850;box-shadow:inset 0 0 0 3px #031018,0 4px 0 #00131c,0 0 19px #2ed4f466}
.tq-choice>span{position:relative;z-index:1;width:39px;height:39px;display:grid;place-items:center;border:1px solid #38b9d3;border-radius:3px;background:#071821;color:#7cecff;font:900 1.25rem "Barlow Condensed",system-ui,sans-serif;box-shadow:inset 0 0 0 2px #123745}
.tq-choice strong{position:relative;z-index:1;min-width:0;font:800 clamp(.82rem,1.55vw,1.05rem)/1.16 ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:.02em;text-align:center;text-transform:uppercase;text-wrap:balance}.tq-choice i{position:relative;z-index:1;color:#5c9bab;font:800 .37rem Inter,system-ui,sans-serif;letter-spacing:.1em;text-align:right;text-transform:uppercase}
.tq-choice.hinted{border-color:#f2b64a;box-shadow:inset 0 0 0 3px #2b1e08,0 0 0 4px #f2b64a,0 0 18px #f2b64a77;animation:tq-pulse .68s ease-in-out infinite alternate}.tq-choice.correct{border-color:#50e0bb;background:#0b4a45;color:#ddfff6;box-shadow:inset 0 0 0 3px #06211f,0 4px 0 #02231e}.tq-choice.wrong{border-color:#ff766b;background:#612625;color:#fff0eb;animation:tq-shake .24s linear}.tq-choice.rejected{border-color:#425563;background:#1d2931;color:#81939d;box-shadow:none;opacity:.68}.tq-choice:disabled{cursor:default}
.tq-trace{grid-area:trace;position:relative;z-index:2;display:flex;justify-content:center;gap:62px;padding:17px 35px 24px;margin:3px auto 0;border:1px solid #28677a;border-radius:4px;background:#03131ddd;box-shadow:inset 0 0 0 2px #0c2a37,0 4px 0 #00080d;color:#72dceb}.tq-trace::before{content:"DIAGNOSTIC TRACE";position:absolute;bottom:calc(100% + 4px);left:50%;color:#f2b64a;font:800 .44rem Inter,system-ui,sans-serif;letter-spacing:.22em;transform:translateX(-50%)}
.tq-trace span{position:relative;width:31px;aspect-ratio:1;display:grid;place-items:center;border:2px solid #315e70;border-radius:50%;background:#061923;color:#5f9eb0;font:800 .72rem ui-monospace,monospace;box-shadow:0 0 0 3px #031018}.tq-trace span::after{content:attr(data-label);position:absolute;top:calc(100% + 4px);left:50%;font:800 .35rem Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;transform:translateX(-50%);white-space:nowrap}.tq-trace span+span::before{content:"";position:absolute;right:100%;top:50%;width:65px;height:5px;background:linear-gradient(#264b59,#264b59) center/100% 2px no-repeat;transform:translateY(-50%)}.tq-trace span.active{border-color:#5ce9ff;background:#0b3b4d;color:#c9faff;box-shadow:0 0 0 3px #073342,0 0 13px #30d9fb}.tq-trace span.done{border-color:#3ed8b0;background:#0c6658;color:#e4fff8}.tq-trace span.done+span::before{background:linear-gradient(#39cca9,#39cca9) center/100% 3px no-repeat}
.tq-actions{grid-area:actions;position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,250px));justify-content:center;gap:14px}.tq-actions button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #2daac5;border-radius:4px;background:#0a4055;color:#a9f3ff;font:800 .72rem Inter,system-ui,sans-serif;letter-spacing:.13em;text-transform:uppercase;box-shadow:inset 0 0 0 2px #0d2630,0 3px 0 #001017;cursor:pointer}.tq-actions button:last-child{border-color:#ce6258;background:#6b2e2d;color:#ffd8d2;box-shadow:inset 0 0 0 2px #381817,0 3px 0 #210706}.tq-actions button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.tq-actions button:hover:not(:disabled),.tq-actions button:focus-visible{outline:3px solid #f2b64a;outline-offset:2px;transform:translateY(-1px)}.tq-actions button:disabled{opacity:.38;cursor:default;transform:none}
.tq-prompt{grid-area:prompt;position:relative;z-index:2;margin:0;padding-top:5px;border-top:1px solid #245365;color:#78aab7;font:.58rem/1.35 ui-monospace,"Cascadia Mono",Consolas,monospace;text-align:center}.tq-game.paused .tq-question-panel,.tq-game.paused .tq-choices,.tq-game.paused .tq-trace{opacity:.42}.tq-game.complete .tq-title{color:#a8ffe5;text-shadow:0 0 8px #50e0bb,2px 3px 0 #01090f}
@keyframes tq-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes tq-pulse{to{box-shadow:inset 0 0 0 3px #2b1e08,0 0 0 5px #f2b64a,0 0 20px #f2b64a99}}
@media(prefers-reduced-motion:reduce){.tq-choice,.tq-summary span:last-child::after{transition:none}.tq-choice.wrong,.tq-choice.hinted{animation:none}}
@media(max-width:720px){.game-shell:has(.tq-game) .game-status{align-items:flex-start;flex-direction:column;gap:7px}.game-shell:has(.tq-game) .game-status strong{max-width:none}.tq-title{font-size:1.9rem;letter-spacing:.055em}.tq-title::before,.tq-title::after{display:none}.tq-console{gap:8px;padding:10px 9px;background-position:center}.tq-summary{margin-inline:3px}.tq-summary span{padding:7px 2px}.tq-summary small{font-size:.36rem}.tq-summary strong{font-size:.72rem}.tq-question-panel{min-height:134px;padding:24px 40px 18px}.tq-question-panel::before{font-size:.37rem;padding:4px 12px}.tq-system{font-size:.54rem}.tq-system::before,.tq-system::after{width:26px;margin-inline:8px}.tq-question{font-size:clamp(1rem,4.25vw,1.38rem)}.tq-fuses{right:10px;top:9px}.tq-choices{gap:8px}.tq-choice{min-height:59px;grid-template-columns:36px 1fr;padding:7px 9px}.tq-choice>span{width:32px;height:37px;font-size:1.1rem}.tq-choice strong{font-size:.75rem}.tq-choice i{display:none}.tq-trace{gap:35px;padding-inline:20px}.tq-trace span+span::before{width:38px}.tq-actions button{min-height:46px}.tq-prompt{font-size:.51rem}}
@media(max-width:430px){.tq-title{font-size:1.5rem}.tq-title span{font-size:.4em}.tq-summary small{font-size:.28rem;letter-spacing:.05em}.tq-summary strong{font-size:.58rem}.tq-question-panel{min-height:119px;padding:22px 15px 15px}.tq-system{font-size:.45rem}.tq-system::before,.tq-system::after{width:13px;margin-inline:5px}.tq-question{font-size:.94rem}.tq-fuses{position:static;justify-content:center}.tq-choices{grid-template-columns:1fr}.tq-choice{min-height:54px}.tq-choice strong{font-size:.74rem}.tq-trace{gap:21px;padding:15px 11px 22px}.tq-trace span{width:27px}.tq-trace span+span::before{width:24px}.tq-trace span::after{font-size:.28rem}.tq-prompt{display:none}}
