.game-shell:has(.nq-game){grid-template-columns:minmax(0,1fr);gap:12px}
.game-shell:has(.nq-game) .game-status{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px}
.game-shell:has(.nq-game) .game-status strong{max-width:68%}
.game-shell:has(.nq-game) .game-tools{flex-direction:row;padding:0}
.game-shell:has(.nq-game) .game-tools button{flex:1;padding:12px 8px;text-align:center}
.nq-game{width:min(100%,1140px);display:grid;gap:7px;color:#f2e8ca}
.nq-title{margin:0;color:#f0e3bd;font:900 clamp(2.2rem,4.7vw,3.9rem)/.86 Georgia,serif;letter-spacing:.035em;text-align:center;text-shadow:2px 3px 0 #51341f,0 0 24px #d19d5561;text-transform:uppercase}
.nq-title span{display:block;margin-bottom:5px;color:#c9b968;font:800 clamp(.75rem,1.5vw,1.08rem)/1 "Barlow Condensed",sans-serif;letter-spacing:.3em}
.nq-title span::before,.nq-title span::after{content:"";display:inline-block;width:64px;height:1px;margin:0 13px 4px;background:#ae7e36}
.nq-journal{--time-ratio:1;position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-areas:"summary" "trail" "question" "choices" "actions" "prompt";gap:10px;padding:14px 26px 12px;border:2px solid #9b793f;border-radius:3px;background-color:#10291d;background-image:linear-gradient(90deg,#0b2018ed,#10291dc4 27%,#10291dbd 73%,#0a1d16ed),url("/assets/covers/nature-quiz.webp");background-position:center 57%;background-size:cover;box-shadow:inset 0 0 0 5px #06130e,inset 0 0 0 6px #73592d,0 6px 0 #030b08,0 13px 30px #000c}
.nq-journal::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 47%,transparent 0 32%,#05120d52 72%),repeating-linear-gradient(0deg,transparent 0 83px,#e8dca00a 84px)}
.nq-summary{grid-area:summary;position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);margin-inline:76px;border:1px solid #a98c4f;background:#10271ef0;box-shadow:0 3px 0 #040c09}
.nq-summary span{position:relative;display:grid;gap:2px;padding:8px 5px;text-align:center}.nq-summary span+span{border-left:1px solid #625938}
.nq-summary small{display:flex;align-items:center;justify-content:center;gap:4px;color:#c8bd69;font:900 .49rem "Barlow Condensed",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.nq-summary small svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.nq-summary strong{color:#f0e5c8;font:900 1rem "Barlow Condensed",sans-serif;letter-spacing:.04em}.nq-summary span:nth-child(3) strong{color:#e3a35b}.nq-summary span:nth-child(4) strong{color:#9dcf72}
.nq-summary span:last-child::before{content:"";position:absolute;left:8px;right:8px;bottom:4px;height:3px;background:#3d4736}.nq-summary span:last-child::after{content:"";position:absolute;left:8px;bottom:4px;width:calc((100% - 16px)*var(--time-ratio));height:3px;background:#a4c86c;box-shadow:0 0 7px #a4c86c;transition:width .2s linear}
.nq-trail{grid-area:trail;position:relative;z-index:2;display:flex;justify-content:center;gap:66px;padding-block:2px 1px}.nq-trail::before{content:"SPECIMEN TRAIL";position:absolute;bottom:100%;left:50%;color:#c8b86c;font:900 .44rem "Barlow Condensed",sans-serif;letter-spacing:.19em;transform:translateX(-50%)}
.nq-trail span{position:relative;width:29px;aspect-ratio:1;display:grid;place-items:center;border:2px solid #9d8e50;border-radius:50%;background:#13291f;color:#e2d5a4;font:900 .7rem "Barlow Condensed",sans-serif;box-shadow:0 0 0 3px #07140f,0 3px 0 #020806}.nq-trail span+span::before{content:"";position:absolute;right:100%;top:50%;width:70px;height:2px;background:#685e37;transform:translateY(-50%)}
.nq-trail span.active{border-color:#d99352;background:#6f3d24;color:#fff1d2;box-shadow:0 0 0 3px #07140f,0 0 15px #da925878}.nq-trail span.done{border-color:#8dbd68;background:#779d50;color:#0b2116}.nq-trail span.done::after{content:"\2713"}.nq-trail span.done+span::before{background:#779d50;box-shadow:0 0 6px #8dbd68}
.nq-question-panel{grid-area:question;position:relative;z-index:2;width:min(100%,850px);min-height:152px;margin:auto;display:grid;place-content:center;gap:10px;padding:24px 60px 22px;border:2px solid #9b7743;background:#f1e7ccf6;color:#18231b;box-shadow:inset 0 0 0 4px #fff5dc,inset 0 0 0 5px #aa8953,0 7px 18px #000a;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%)}
.nq-question-panel::before{content:"FIELD NOTE";position:absolute;top:0;left:50%;padding:5px 18px;border:1px solid #a4824e;border-top:0;background:#d9c393;color:#4f4526;font:900 .47rem "Barlow Condensed",sans-serif;letter-spacing:.19em;transform:translateX(-50%)}
.nq-field{color:#496b32;font:900 .7rem "Barlow Condensed",sans-serif;letter-spacing:.2em;text-transform:uppercase}.nq-field::before,.nq-field::after{content:"";display:inline-block;width:56px;height:1px;margin:0 14px 3px;background:#a4834c}
.nq-question{max-width:770px;margin:0;font:900 clamp(1.4rem,3vw,2.34rem)/1.1 Georgia,serif;letter-spacing:-.024em;text-wrap:balance}
.nq-lives{position:absolute;right:18px;top:14px;display:flex;gap:6px}.nq-lives span{width:13px;height:15px;border-radius:90% 0 90% 0;background:#756b4b;opacity:.33;transform:rotate(-38deg)}.nq-lives span.active{background:#6f9e4b;opacity:1;filter:drop-shadow(0 2px 0 #3c5e2a)}
.nq-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}
.nq-choice{min-height:70px;display:grid;grid-template-columns:48px 1fr 66px;align-items:center;gap:10px;padding:8px 13px;border:2px solid #9f7e4c;background:#f1e7ccf3;color:#17231b;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 3px #fff5dd,0 4px 0 #65482b,0 8px 15px #0009;cursor:pointer;transition:transform .14s,border-color .14s,background .14s,box-shadow .14s,opacity .14s}
.nq-choice:hover:not(:disabled),.nq-choice:focus-visible{z-index:3;transform:translateY(-2px);border-color:#5b8a42;outline:3px solid #a9d477;outline-offset:2px;background:#fff4d5;box-shadow:inset 0 0 0 3px #fff9e9,0 4px 0 #43642f,0 9px 18px #000b}.nq-choice>span{width:43px;height:46px;display:grid;place-items:center;border-right:1px solid #ab8957;color:#82522f;font:900 1.56rem Georgia,serif}.nq-choice strong{min-width:0;font:800 clamp(.88rem,1.8vw,1.1rem)/1.16 "Barlow Condensed",sans-serif;letter-spacing:.025em;text-align:center;text-transform:uppercase;text-wrap:balance}.nq-choice i{color:#7b6d49;font:900 .39rem "Barlow Condensed",sans-serif;letter-spacing:.09em;text-align:right;text-transform:uppercase}
.nq-choice.hinted{border-color:#c68b44;box-shadow:inset 0 0 0 3px #fff4d4,0 0 0 4px #c68b44,0 8px 18px #c68b4455;animation:nq-pulse .68s ease-in-out infinite alternate}.nq-choice.correct{border-color:#4f7d3c;background:#93bd69;color:#102113;box-shadow:inset 0 0 0 3px #cfe5ae,0 4px 0 #355729}.nq-choice.wrong{border-color:#873e2c;background:#b95e3d;color:#fff2db;animation:nq-shake .24s linear}.nq-choice.rejected{border-color:#766f59;background:#aaa28c;color:#27221a;box-shadow:none;opacity:.62}.nq-choice:disabled{cursor:default}
.nq-actions{grid-area:actions;position:relative;z-index:2;display:grid;grid-template-columns:repeat(2,minmax(0,240px));justify-content:center;gap:14px}.nq-actions button{min-height:46px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid #a88b4c;border-radius:2px;background:#173a28;color:#eadba9;font:900 .75rem "Barlow Condensed",sans-serif;letter-spacing:.13em;text-transform:uppercase;box-shadow:0 3px 0 #06140e;cursor:pointer}.nq-actions button:last-child{border-color:#ba7441;background:#764128;color:#fff0cd}.nq-actions button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.nq-actions button:hover:not(:disabled),.nq-actions button:focus-visible{outline:3px solid #a9d477;outline-offset:2px;transform:translateY(-1px)}.nq-actions button:disabled{opacity:.38;cursor:default;transform:none}
.nq-prompt{grid-area:prompt;position:relative;z-index:2;margin:0;padding-top:5px;border-top:1px solid #75613a;color:#d9cc9f;font-size:.59rem;line-height:1.35;text-align:center}.nq-game.paused .nq-question-panel,.nq-game.paused .nq-choices,.nq-game.paused .nq-trail{opacity:.42}.nq-game.complete .nq-title{color:#b8d88d;text-shadow:2px 3px 0 #456035,0 0 24px #9bc56b66}
@keyframes nq-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes nq-pulse{to{box-shadow:inset 0 0 0 3px #fff4d4,0 0 0 5px #c68b44,0 9px 19px #c68b4477}}@media(prefers-reduced-motion:reduce){.nq-choice,.nq-summary span:last-child::after{transition:none}.nq-choice.wrong,.nq-choice.hinted{animation:none}}
@media(max-width:720px){.game-shell:has(.nq-game) .game-status{align-items:flex-start;flex-direction:column;gap:7px}.game-shell:has(.nq-game) .game-status strong{max-width:none}.nq-title{font-size:2.02rem}.nq-title span{font-size:.68rem}.nq-title span::before,.nq-title span::after{width:34px}.nq-journal{gap:8px;padding:10px 9px;background-position:center}.nq-summary{margin-inline:3px}.nq-summary span{padding:7px 2px}.nq-summary small{font-size:.37rem}.nq-summary strong{font-size:.73rem}.nq-question-panel{min-height:128px;padding:19px 34px}.nq-question-panel::before{font-size:.38rem;padding:4px 12px}.nq-field{font-size:.55rem}.nq-field::before,.nq-field::after{width:28px;margin-inline:8px}.nq-question{font-size:clamp(1.14rem,5.1vw,1.68rem)}.nq-lives{right:10px;top:9px}.nq-choices{gap:8px}.nq-choice{min-height:60px;grid-template-columns:35px 1fr;padding:7px 9px}.nq-choice>span{width:31px;height:38px;font-size:1.18rem}.nq-choice strong{font-size:.8rem}.nq-choice i{display:none}.nq-trail{gap:39px}.nq-trail span{width:26px}.nq-trail span+span::before{width:43px}.nq-actions button{min-height:46px}.nq-prompt{font-size:.52rem}}
@media(max-width:430px){.nq-title{font-size:1.72rem}.nq-title span{font-size:.56rem}.nq-title span::before,.nq-title span::after{width:24px;margin-inline:8px}.nq-summary small{font-size:.3rem;letter-spacing:.08em}.nq-summary strong{font-size:.62rem}.nq-question-panel{min-height:116px;padding:18px 15px 15px}.nq-field{font-size:.47rem}.nq-field::before,.nq-field::after{width:16px;margin-inline:5px}.nq-question{font-size:1.08rem}.nq-lives{position:static;justify-content:center}.nq-choices{grid-template-columns:1fr}.nq-choice{min-height:52px}.nq-choice strong{font-size:.78rem}.nq-trail{gap:25px}.nq-trail span{width:24px}.nq-trail span+span::before{width:28px}.nq-prompt{display:none}}
