.game-shell:has(.compound-words-game){grid-template-columns:minmax(0,1fr);gap:12px}
.game-shell:has(.compound-words-game) .game-status{flex-direction:row;align-items:center;justify-content:space-between;gap:18px;padding:10px 14px}
.game-shell:has(.compound-words-game) .game-status strong{max-width:68%}
.game-shell:has(.compound-words-game) .game-tools{flex-direction:row;padding:0}
.game-shell:has(.compound-words-game) .game-tools button{flex:1;padding:12px 8px;text-align:center}
.compound-words-game{width:min(100%,1120px);display:grid;gap:6px;color:#f1e4c7}
.compound-words-title{margin:0;color:#f1e4c7;font:900 clamp(2.2rem,5vw,4rem)/.88 "Barlow Condensed",sans-serif;letter-spacing:.075em;text-align:center;text-transform:uppercase;text-shadow:2px 2px 0 #785229}
.compound-words-subtitle{display:flex;align-items:center;justify-content:center;gap:11px;margin:0;color:#c58a39;font:800 .66rem "Barlow Condensed",sans-serif;letter-spacing:.29em;text-align:center;text-transform:uppercase}
.compound-words-subtitle::before,.compound-words-subtitle::after{content:"";width:72px;height:1px;background:#8d612d}
.compound-words-depot{--time-ratio:1;position:relative;overflow:hidden;display:grid;grid-template-areas:"summary" "ticket" "assembly" "result" "choice-label" "choices" "progress-label" "progress" "actions" "prompt";gap:9px;padding:13px 17px 12px;border:1px solid #8e632f;border-radius:3px;background:#061829;background-image:linear-gradient(90deg,transparent 49.8%,#bd813208 50%,transparent 50.2%),radial-gradient(circle at 12% 18%,#b97f2b 0 1px,transparent 1.4px),radial-gradient(circle at 87% 78%,#b97f2b 0 1px,transparent 1.4px);background-size:100% 100%,37px 37px,47px 47px;box-shadow:inset 0 0 40px #010b14,0 5px 0 #020a11}
.compound-words-depot::before{content:"";position:absolute;inset:9px;border:1px solid #95672e55;pointer-events:none}
.compound-words-summary{grid-area:summary;position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);margin-inline:17px;border:1px solid #9a6e37;background:#071b2d;box-shadow:0 3px 0 #020a11}
.compound-words-summary span{display:grid;gap:2px;padding:8px 6px;text-align:center}
.compound-words-summary span+span{border-left:1px solid #6e5437}
.compound-words-summary small{color:#c58a39;font:800 .48rem "Barlow Condensed",sans-serif;letter-spacing:.15em;text-transform:uppercase}
.compound-words-summary strong{color:#f1e4c7;font:900 .98rem "Barlow Condensed",sans-serif;letter-spacing:.045em}
.compound-words-summary span:nth-child(3) strong{color:#d8a648}
.compound-words-summary span:nth-child(4) strong{color:#c7483c;letter-spacing:.08em}
.compound-words-summary span:last-child{position:relative}
.compound-words-summary span:last-child::before{content:"";position:absolute;left:7px;right:7px;bottom:4px;height:3px;background:#243e43}
.compound-words-summary span:last-child::after{content:"";position:absolute;left:7px;bottom:4px;width:calc((100% - 14px)*var(--time-ratio));height:3px;background:#c58a39;transition:width .2s linear}
.compound-words-ticket{grid-area:ticket;position:relative;z-index:1;display:grid;gap:7px;margin-inline:70px;padding:13px 44px 14px;border:2px solid #bfa777;background:#f1e4c7;color:#061829;box-shadow:4px 5px 0 #775e3f,0 9px 18px #0008}
.compound-words-ticket::before,.compound-words-ticket::after{content:"";position:absolute;top:-2px;bottom:-2px;width:18px;background:repeating-linear-gradient(180deg,#c69d62 0 1px,transparent 1px 15px)}
.compound-words-ticket::before{left:12px;border-right:1px dashed #8d493c}.compound-words-ticket::after{right:12px;border-left:1px dashed #8d493c}
.compound-words-clue-label{display:flex;align-items:center;justify-content:center;gap:14px;color:#9d3f36;font:900 .56rem "Barlow Condensed",sans-serif;letter-spacing:.18em;text-align:center;text-transform:uppercase}
.compound-words-clue-label::before,.compound-words-clue-label::after{content:"";width:82px;height:1px;background:#9d3f36}
.compound-words-clue{min-height:33px;display:grid;place-items:center;color:#071b2d;font:700 clamp(1.05rem,2.8vw,1.62rem)/1.15 Georgia,serif;letter-spacing:.03em;text-align:center;text-transform:uppercase}
.compound-words-assembly{grid-area:assembly;position:relative;z-index:1;width:min(100%,780px);min-height:76px;margin:auto;display:grid;grid-template-columns:minmax(170px,1fr) 42px minmax(170px,1fr);align-items:center}
.compound-words-cargo{position:relative;min-width:0;padding:13px 18px;border:2px solid #9d793a;color:#f4ead6;font:900 clamp(1.7rem,4vw,3rem)/.9 "Barlow Condensed",sans-serif;letter-spacing:.065em;text-align:center;text-transform:uppercase;overflow-wrap:anywhere;box-shadow:inset 0 0 0 4px #ffffff18,0 5px 0 #020b13,0 9px 16px #0007}
.compound-words-cargo::before,.compound-words-cargo::after{content:"";position:absolute;top:8px;width:6px;height:6px;border-radius:50%;background:#c69548;box-shadow:0 0 0 1px #42341f}
.compound-words-cargo::before{left:9px}.compound-words-cargo::after{right:9px}
.compound-words-cargo--left{border-color:#356f70;background:#286566}
.compound-words-cargo--right{border-color:#9b3e34;background:#a63f36}
.compound-words-cargo.missing{color:#f1e4c7}
.compound-words-assembly i{color:#e0a748;font:900 1.75rem "Barlow Condensed",sans-serif;text-align:center}
.compound-words-result{grid-area:result;position:relative;z-index:1;min-height:17px;color:#c58a39;font:900 .58rem "Barlow Condensed",sans-serif;letter-spacing:.18em;text-align:center;text-transform:uppercase;opacity:.78}
.compound-words-result.revealed{color:#5fb2a7;opacity:1;animation:compound-stamp .3s ease-out}
.compound-words-choice-label{grid-area:choice-label;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:12px;color:#c58a39;font:800 .49rem "Barlow Condensed",sans-serif;letter-spacing:.2em;text-align:center;text-transform:uppercase}
.compound-words-choice-label::before,.compound-words-choice-label::after{content:"";width:70px;height:1px;background:#88602d}
.compound-words-choices{grid-area:choices;position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.compound-words-choice{min-height:70px;display:grid;grid-template-columns:31px 1fr 47px;align-items:center;gap:7px;padding:8px 10px;border:2px solid #a68f68;border-radius:2px;background:#d7c7a8;color:#061829;box-shadow:inset 0 0 0 3px #eee2ca,0 5px 0 #796747,0 9px 14px #0007;cursor:pointer;transition:transform .14s,border-color .14s,background .14s,box-shadow .14s,opacity .14s}
.compound-words-choice:hover:not(:disabled),.compound-words-choice:focus{z-index:1;transform:translateY(-3px);border-color:#efbd55;background:#c48b32;outline:3px solid #efbd55;outline-offset:2px;box-shadow:inset 0 0 0 3px #e3ad53,0 5px 0 #684721,0 10px 17px #d9953040}
.compound-words-choice>span{width:27px;aspect-ratio:1;display:grid;place-items:center;border:1px solid #17364a;background:#071b2d;color:#f1e4c7;font:900 .85rem "Barlow Condensed",sans-serif}
.compound-words-choice strong{min-width:0;overflow-wrap:anywhere;font:900 clamp(1rem,2.2vw,1.43rem) "Barlow Condensed",sans-serif;letter-spacing:.055em;text-align:center;text-transform:uppercase}
.compound-words-choice i{font:900 .41rem "Barlow Condensed",sans-serif;letter-spacing:.05em;text-align:right;text-transform:uppercase}
.compound-words-choice.hinted{border-color:#efbd55;box-shadow:inset 0 0 0 3px #f2e4c7,0 0 0 4px #efbd55,0 9px 17px #d9953055;animation:compound-pulse .65s ease-in-out infinite alternate}
.compound-words-choice.correct{border-color:#2f786f;background:#3f9588;box-shadow:inset 0 0 0 3px #78bcb1,0 5px 0 #1d504a}
.compound-words-choice.wrong{border-color:#7e1e1b;background:#b64439;animation:compound-shake .24s linear}
.compound-words-choice.rejected{border-color:#5c5e5d;background:#8e8f85;box-shadow:none;opacity:.34}
.compound-words-choice:disabled{cursor:default}
.compound-words-progress-label{grid-area:progress-label;position:relative;z-index:1;color:#c58a39;font:800 .47rem "Barlow Condensed",sans-serif;letter-spacing:.19em;text-align:center;text-transform:uppercase}
.compound-words-progress{grid-area:progress;position:relative;z-index:1;display:flex;justify-content:center;gap:72px;padding-block:2px}
.compound-words-progress span{position:relative;width:31px;aspect-ratio:1;display:grid;place-items:center;border:2px solid #a58550;border-radius:50%;background:#f1e4c7;color:#061829;font:900 .72rem "Barlow Condensed",sans-serif;box-shadow:0 3px 0 #2d2114}
.compound-words-progress span+span::before{content:"";position:absolute;right:100%;top:50%;width:76px;height:3px;background:repeating-linear-gradient(90deg,#776345 0 10px,transparent 10px 15px);transform:translateY(-50%)}
.compound-words-progress span.active{border-color:#efbd55;background:#194b4e;color:#f1e4c7;box-shadow:0 0 0 4px #efbd5530,0 3px 0 #2d2114}
.compound-words-progress span.done{border-color:#2d776f;background:#3f9588;color:#061829}
.compound-words-progress span.done::after{content:"\2713"}
.compound-words-progress span.done+span::before{background:#3f9588}
.compound-words-actions{grid-area:actions;position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,190px));justify-content:center;gap:12px}
.compound-words-actions button{min-height:46px;border:1px solid #5b827d;border-radius:2px;background:#245f60;color:#f1e4c7;font:900 .75rem "Barlow Condensed",sans-serif;letter-spacing:.11em;text-transform:uppercase;box-shadow:0 3px 0 #020b12;cursor:pointer}
.compound-words-actions button:last-child{border-color:#9f4c41;background:#8f352e}
.compound-words-actions button:hover:not(:disabled),.compound-words-actions button:focus-visible{outline:3px solid #efbd55;outline-offset:2px;transform:translateY(-1px)}
.compound-words-actions button:disabled{opacity:.38;cursor:default;transform:none}
.compound-words-prompt{grid-area:prompt;position:relative;z-index:1;margin:0;padding-top:5px;border-top:1px solid #695132;color:#bda984;font-size:.59rem;line-height:1.4;text-align:center}
.compound-words-game.paused .compound-words-ticket,.compound-words-game.paused .compound-words-assembly,.compound-words-game.paused .compound-words-choices,.compound-words-game.paused .compound-words-progress{opacity:.42}
.compound-words-game.complete .compound-words-title{color:#63b3a8;text-shadow:2px 2px 0 #214d4c}
@keyframes compound-shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@keyframes compound-pulse{to{box-shadow:inset 0 0 0 3px #f4e7c9,0 0 0 5px #efbd55,0 10px 19px #d9953070}}
@keyframes compound-stamp{from{transform:translateY(-4px);letter-spacing:.34em;opacity:0}to{transform:none;letter-spacing:.18em;opacity:1}}
@media(prefers-reduced-motion:reduce){.compound-words-choice,.compound-words-summary span:last-child::after{transition:none}.compound-words-choice.wrong,.compound-words-choice.hinted,.compound-words-result.revealed{animation:none}}
@media(max-width:720px){
  .game-shell:has(.compound-words-game) .game-status{align-items:flex-start;flex-direction:column;gap:7px}.game-shell:has(.compound-words-game) .game-status strong{max-width:none}
  .compound-words-title{font-size:2rem}.compound-words-subtitle{font-size:.49rem}.compound-words-subtitle::before,.compound-words-subtitle::after{width:34px}.compound-words-depot{gap:7px;padding:10px 8px}.compound-words-summary{margin-inline:12px}.compound-words-summary span{padding:7px 2px}.compound-words-summary small{font-size:.39rem}.compound-words-summary strong{font-size:.73rem}
  .compound-words-ticket{margin-inline:10px;padding:12px 27px}.compound-words-ticket::before{left:7px}.compound-words-ticket::after{right:7px}.compound-words-clue-label{font-size:.48rem}.compound-words-clue-label::before,.compound-words-clue-label::after{width:34px}.compound-words-clue{min-height:30px;font-size:1rem}
  .compound-words-assembly{min-height:61px;grid-template-columns:minmax(108px,1fr) 29px minmax(108px,1fr)}.compound-words-cargo{padding:10px 8px;font-size:1.75rem}.compound-words-assembly i{font-size:1.25rem}
  .compound-words-choices{gap:7px}.compound-words-choice{min-height:58px;grid-template-columns:27px 1fr;padding:7px}.compound-words-choice strong{font-size:1rem}.compound-words-choice i{display:none}.compound-words-choice>span{width:24px;font-size:.76rem}
  .compound-words-progress{gap:42px}.compound-words-progress span{width:27px}.compound-words-progress span+span::before{width:46px}.compound-words-actions button{min-height:46px}.compound-words-prompt{font-size:.52rem}
}
@media(max-width:430px){
  .compound-words-summary{margin-inline:5px}.compound-words-summary small{font-size:.34rem}.compound-words-summary strong{font-size:.63rem}.compound-words-ticket{margin-inline:2px;padding-inline:21px}.compound-words-clue{font-size:.92rem}.compound-words-assembly{grid-template-columns:minmax(91px,1fr) 23px minmax(91px,1fr)}.compound-words-cargo{font-size:1.38rem}
  .compound-words-choice-label::before,.compound-words-choice-label::after{width:29px}.compound-words-choices{grid-template-columns:1fr 1fr}.compound-words-choice{min-height:52px}.compound-words-progress{gap:25px}.compound-words-progress span{width:25px}.compound-words-progress span+span::before{width:29px}.compound-words-prompt{display:none}
}