.game-shell:has(.phrase-finder-game){grid-template-columns:minmax(0,1fr);gap:12px}
.game-shell:has(.phrase-finder-game) .game-status{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px}
.game-shell:has(.phrase-finder-game) .game-status strong{max-width:68%}
.game-shell:has(.phrase-finder-game) .game-tools{flex-direction:row;padding:0}
.game-shell:has(.phrase-finder-game) .game-tools button{flex:1;padding:12px 8px;text-align:center}
.phrase-finder-game{width:min(100%,1120px);display:grid;gap:7px;color:#f2e6c8}
.phrase-finder-title{margin:0;color:#f2e6c8;font:900 clamp(2.25rem,5vw,4rem)/.86 "Barlow Condensed",sans-serif;letter-spacing:.09em;text-align:center;text-transform:uppercase;text-shadow:2px 2px 0 #8c6332,0 0 23px #18b9ad35}
.phrase-finder-title::first-letter{color:#50d5c5}
.phrase-finder-subtitle{display:flex;align-items:center;justify-content:center;gap:12px;margin:0;color:#d2a04e;font:800 .62rem "Barlow Condensed",sans-serif;letter-spacing:.3em;text-align:center;text-transform:uppercase}
.phrase-finder-subtitle::before,.phrase-finder-subtitle::after{content:"";width:74px;height:1px;background:#9b713c}
.phrase-finder-observatory{--time-ratio:1;position:relative;overflow:hidden;display:grid;grid-template-areas:"summary" "console" "choice-label" "choices" "progress-label" "progress" "actions" "prompt";gap:9px;padding:14px 18px 12px;border:1px solid #8c6d3e;border-radius:12px;background-color:#04131f;background-image:radial-gradient(circle at 50% 37%,#0d3542 0,#071c2b 38%,#04131f 75%),radial-gradient(circle at 18% 22%,#d3a34c 0 1px,transparent 1.5px),radial-gradient(circle at 81% 70%,#50d5c5 0 1px,transparent 1.5px);background-size:auto,43px 43px,57px 57px;box-shadow:inset 0 0 44px #000b,0 5px 0 #020912}
.phrase-finder-observatory::before{content:"";position:absolute;left:50%;top:135px;width:min(76vw,620px);aspect-ratio:1;border:1px solid #b78c4740;border-radius:50%;transform:translateX(-50%);box-shadow:0 0 0 38px #b78c4708,0 0 0 76px #4ecbbf08;pointer-events:none}
.phrase-finder-summary{grid-area:summary;position:relative;z-index:2;display:grid;grid-template-columns:repeat(5,1fr);margin-inline:16px;border:1px solid #8d7048;border-radius:4px;background:#071a29dd;box-shadow:0 3px 0 #020912}
.phrase-finder-summary span{display:grid;gap:2px;padding:8px 6px;text-align:center}
.phrase-finder-summary span+span{border-left:1px solid #66583f}
.phrase-finder-summary small{color:#d2a04e;font:800 .48rem "Barlow Condensed",sans-serif;letter-spacing:.15em;text-transform:uppercase}
.phrase-finder-summary strong{color:#f2e6c8;font:900 .98rem "Barlow Condensed",sans-serif;letter-spacing:.045em}
.phrase-finder-summary span:nth-child(3) strong{color:#50d5c5}
.phrase-finder-summary span:nth-child(4) strong{color:#ed6655;letter-spacing:.08em}
.phrase-finder-summary span:last-child{position:relative}
.phrase-finder-summary span:last-child::before{content:"";position:absolute;left:7px;right:7px;bottom:4px;height:3px;background:#233a43}
.phrase-finder-summary span:last-child::after{content:"";position:absolute;left:7px;bottom:4px;width:calc((100% - 14px)*var(--time-ratio));height:3px;background:#50d5c5;box-shadow:0 0 7px #50d5c5;transition:width .2s linear}
.phrase-finder-console{grid-area:console;position:relative;z-index:1;width:min(100%,850px);margin:auto;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"eyebrow eyebrow category" "clue clue clue" "lens lens lens" "result result result";align-items:center;gap:7px;padding:12px 24px 10px;border:2px solid #9f7b43;border-radius:22px;background:linear-gradient(145deg,#0b2939,#061724);box-shadow:inset 0 0 0 5px #030c14,inset 0 0 0 6px #4f493a,0 9px 25px #0008}
.phrase-finder-console::before,.phrase-finder-console::after{content:"";position:absolute;top:50%;width:12px;height:44px;border:1px solid #9f7b43;background:#071724;transform:translateY(-50%)}
.phrase-finder-console::before{left:-13px;border-radius:7px 0 0 7px}.phrase-finder-console::after{right:-13px;border-radius:0 7px 7px 0}
.phrase-finder-eyebrow{grid-area:eyebrow;color:#d2a04e;font:900 .52rem "Barlow Condensed",sans-serif;letter-spacing:.2em;text-transform:uppercase}
.phrase-finder-category{grid-area:category;justify-self:end;padding:4px 9px;border:1px solid #4db8ae;border-radius:999px;color:#67dfd2;font:900 .48rem "Barlow Condensed",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.phrase-finder-clue{grid-area:clue;min-height:37px;display:grid;place-items:center;color:#f2e6c8;font:700 clamp(1.05rem,2.7vw,1.58rem)/1.16 Georgia,serif;letter-spacing:.02em;text-align:center}
.phrase-finder-lens{grid-area:lens;position:relative;min-height:76px;display:grid;place-items:center;padding:12px 25px;border:2px solid #c4964d;border-radius:50%;background:radial-gradient(ellipse,#154856,#0a2938 48%,#04121d 72%);box-shadow:inset 0 0 0 4px #07141d,inset 0 0 0 5px #a27940,0 0 17px #50d5c530}
.phrase-finder-lens::before,.phrase-finder-lens::after{content:"";position:absolute;background:#55d6c9;box-shadow:0 0 8px #50d5c5;opacity:.48;pointer-events:none}
.phrase-finder-lens::before{left:9%;right:9%;top:50%;height:1px}.phrase-finder-lens::after{top:12%;bottom:12%;left:50%;width:1px}
.phrase-finder-lens>i{position:absolute;width:52px;aspect-ratio:1;border:1px solid #c89b50;border-radius:50%;box-shadow:0 0 0 8px #c89b500d}
.phrase-finder-pattern{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;max-width:94%}
.phrase-finder-pattern span{width:calc(var(--letters)*7px + 13px);min-width:27px;max-width:88px;min-height:25px;display:grid;place-items:center;border-bottom:3px solid #f2e6c8;color:#f2e6c8;font:900 .73rem "Barlow Condensed",sans-serif;letter-spacing:.04em;text-transform:uppercase;text-shadow:0 0 7px #50d5c5}
.phrase-finder-result{grid-area:result;min-height:16px;color:#9fb3b7;font:900 .53rem "Barlow Condensed",sans-serif;letter-spacing:.17em;text-align:center;text-transform:uppercase}
.phrase-finder-result.revealed{color:#65e0d3;animation:phrase-lock .3s ease-out}
.phrase-finder-choice-label{grid-area:choice-label;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:12px;color:#d2a04e;font:800 .49rem "Barlow Condensed",sans-serif;letter-spacing:.2em;text-align:center;text-transform:uppercase}
.phrase-finder-choice-label::before,.phrase-finder-choice-label::after{content:"";width:72px;height:1px;background:#8b6938}
.phrase-finder-choices{grid-area:choices;position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.phrase-finder-choice{min-height:64px;display:grid;grid-template-columns:33px 1fr 64px;align-items:center;gap:8px;padding:9px 11px;border:1px solid #a58b61;border-radius:6px;background:linear-gradient(145deg,#efe2c5,#c9b58e);color:#071724;box-shadow:inset 0 0 0 3px #f7edd8,0 4px 0 #725d3f,0 8px 14px #0007;cursor:pointer;transition:transform .14s,border-color .14s,background .14s,box-shadow .14s,opacity .14s}
.phrase-finder-choice:hover:not(:disabled),.phrase-finder-choice:focus-visible{z-index:1;transform:translateY(-2px);border-color:#60e1d4;outline:3px solid #60e1d4;outline-offset:2px;background:#e7d6ae;box-shadow:inset 0 0 0 3px #f7edd8,0 4px 0 #725d3f,0 9px 17px #50d5c52f}
.phrase-finder-choice>span{width:29px;aspect-ratio:1;display:grid;place-items:center;border:1px solid #167e7a;border-radius:50%;background:#082232;color:#63dfd2;font:900 .83rem "Barlow Condensed",sans-serif}
.phrase-finder-choice strong{min-width:0;overflow-wrap:anywhere;font:900 clamp(.95rem,2vw,1.26rem)/1.02 "Barlow Condensed",sans-serif;letter-spacing:.035em;text-align:center;text-transform:uppercase}
.phrase-finder-choice i{color:#68583f;font:900 .42rem "Barlow Condensed",sans-serif;letter-spacing:.06em;text-align:right;text-transform:uppercase}
.phrase-finder-choice.hinted{border-color:#51dace;box-shadow:inset 0 0 0 3px #f7edd8,0 0 0 4px #51dace,0 8px 17px #50d5c555;animation:phrase-pulse .68s ease-in-out infinite alternate}
.phrase-finder-choice.correct{border-color:#2b857a;background:#54b8aa;box-shadow:inset 0 0 0 3px #8ad7cd,0 4px 0 #24685f}
.phrase-finder-choice.wrong{border-color:#8d3029;background:#d85e50;animation:phrase-shake .24s linear}
.phrase-finder-choice.rejected{border-color:#66675f;background:#9c9b8f;box-shadow:none;opacity:.34}
.phrase-finder-choice:disabled{cursor:default}
.phrase-finder-progress-label{grid-area:progress-label;position:relative;z-index:1;color:#d2a04e;font:800 .47rem "Barlow Condensed",sans-serif;letter-spacing:.19em;text-align:center;text-transform:uppercase}
.phrase-finder-progress{grid-area:progress;position:relative;z-index:1;display:flex;justify-content:center;gap:68px;padding-block:3px}
.phrase-finder-progress span{position:relative;width:29px;aspect-ratio:1;display:grid;place-items:center;border:1px solid #aa8951;transform:rotate(45deg);background:#071b29;color:#d2a04e;font:900 .7rem "Barlow Condensed",sans-serif;box-shadow:0 0 0 3px #07131d,0 3px 0 #020912}
.phrase-finder-progress span::after{transform:rotate(-45deg)}
.phrase-finder-progress span+span::before{content:"";position:absolute;right:100%;top:50%;width:80px;height:1px;background:repeating-linear-gradient(90deg,#806b47 0 7px,transparent 7px 11px);transform:rotate(-45deg) translate(4px,-28px);transform-origin:right center}
.phrase-finder-progress span.active{border-color:#59ded1;color:#59ded1;box-shadow:0 0 0 3px #07131d,0 0 16px #50d5c577}
.phrase-finder-progress span.done{border-color:#d2a04e;background:#d2a04e;color:#071724}
.phrase-finder-progress span.done::after{content:"\2713"}
.phrase-finder-progress span.done+span::before{background:#d2a04e;box-shadow:0 0 7px #d2a04e}
.phrase-finder-actions{grid-area:actions;position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,190px));justify-content:center;gap:12px}
.phrase-finder-actions button{min-height:46px;border:1px solid #4bc8bc;border-radius:5px;background:#0a3340;color:#7ce6dc;font:900 .72rem "Barlow Condensed",sans-serif;letter-spacing:.11em;text-transform:uppercase;box-shadow:0 3px 0 #020912;cursor:pointer}
.phrase-finder-actions button:last-child{border-color:#b65347;background:#672c2a;color:#f1b5a8}
.phrase-finder-actions button:hover:not(:disabled),.phrase-finder-actions button:focus-visible{outline:3px solid #d2a04e;outline-offset:2px;transform:translateY(-1px)}
.phrase-finder-actions button:disabled{opacity:.38;cursor:default;transform:none}
.phrase-finder-prompt{grid-area:prompt;position:relative;z-index:1;margin:0;padding-top:5px;border-top:1px solid #5d5138;color:#a9b5af;font-size:.59rem;line-height:1.4;text-align:center}
.phrase-finder-game.paused .phrase-finder-console,.phrase-finder-game.paused .phrase-finder-choices,.phrase-finder-game.paused .phrase-finder-progress{opacity:.42}
.phrase-finder-game.complete .phrase-finder-title{color:#63dfd2;text-shadow:2px 2px 0 #2e6c67,0 0 24px #50d5c566}
@keyframes phrase-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@keyframes phrase-pulse{to{box-shadow:inset 0 0 0 3px #f7edd8,0 0 0 5px #51dace,0 9px 18px #50d5c577}}
@keyframes phrase-lock{from{letter-spacing:.34em;opacity:0}to{letter-spacing:.17em;opacity:1}}
@media(prefers-reduced-motion:reduce){.phrase-finder-choice,.phrase-finder-summary span:last-child::after{transition:none}.phrase-finder-choice.wrong,.phrase-finder-choice.hinted,.phrase-finder-result.revealed{animation:none}}
@media(max-width:720px){
  .game-shell:has(.phrase-finder-game) .game-status{align-items:flex-start;flex-direction:column;gap:7px}.game-shell:has(.phrase-finder-game) .game-status strong{max-width:none}
  .phrase-finder-title{font-size:2rem}.phrase-finder-subtitle{font-size:.49rem}.phrase-finder-subtitle::before,.phrase-finder-subtitle::after{width:34px}.phrase-finder-observatory{gap:7px;padding:10px 8px}.phrase-finder-summary{margin-inline:9px}.phrase-finder-summary span{padding:7px 2px}.phrase-finder-summary small{font-size:.39rem}.phrase-finder-summary strong{font-size:.72rem}
  .phrase-finder-console{padding:10px 16px 9px;border-radius:16px}.phrase-finder-clue{min-height:34px;font-size:1rem}.phrase-finder-lens{min-height:62px;padding:9px 17px}.phrase-finder-pattern{gap:5px}.phrase-finder-pattern span{min-height:20px;font-size:.61rem}.phrase-finder-result{font-size:.47rem}
  .phrase-finder-choices{gap:7px}.phrase-finder-choice{min-height:58px;grid-template-columns:28px 1fr;padding:7px}.phrase-finder-choice strong{font-size:.9rem}.phrase-finder-choice i{display:none}.phrase-finder-choice>span{width:25px;font-size:.74rem}
  .phrase-finder-progress{gap:39px}.phrase-finder-progress span{width:26px}.phrase-finder-progress span+span::before{width:51px;transform:rotate(-45deg) translate(3px,-17px)}.phrase-finder-actions button{min-height:46px}.phrase-finder-prompt{font-size:.52rem}
}
@media(max-width:430px){
  .phrase-finder-summary{margin-inline:3px}.phrase-finder-summary small{font-size:.34rem}.phrase-finder-summary strong{font-size:.62rem}.phrase-finder-console{padding-inline:11px}.phrase-finder-eyebrow{font-size:.43rem}.phrase-finder-category{font-size:.4rem}.phrase-finder-clue{font-size:.92rem}.phrase-finder-lens{padding-inline:9px}.phrase-finder-pattern span{width:calc(var(--letters)*5px + 10px);min-width:22px;max-width:63px;font-size:.51rem}
  .phrase-finder-choice-label::before,.phrase-finder-choice-label::after{width:28px}.phrase-finder-choice{min-height:54px}.phrase-finder-choice strong{font-size:.79rem}.phrase-finder-progress{gap:24px}.phrase-finder-progress span{width:23px}.phrase-finder-progress span+span::before{width:34px;transform:rotate(-45deg) translate(3px,-11px)}.phrase-finder-prompt{display:none}
}
