html body #word-games{container-type:inline-size;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:max(14px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border:0;border-radius:0;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,var(--theme-glow,#29467040),transparent 70%),var(--bg);color:var(--text)}
#word-games[open]{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px}
.word-game-header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
#word-games .word-game-header h2{padding:0;font:clamp(22px,2.5vw,64px)/1.2 Georgia,serif;min-width:0;overflow-wrap:anywhere}
#word-games #word-game-close{position:static;width:clamp(48px,4vw,96px);height:clamp(48px,4vw,96px);flex-shrink:0;margin:0;padding:4px}
.word-game-workspace{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:14px;min-height:0;min-width:0}
.word-game-scene{position:relative;min-width:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto}
#word-game-sky{width:100%;height:100%;min-height:0;min-width:0;display:block}
#word-game-word{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px;max-width:100%;overflow-wrap:anywhere;text-align:center;font:clamp(20px,2.5vw,56px)/1.3 Georgia,serif;color:var(--accent);margin:0}
.word-game-letter{display:inline-block;min-width:.8em;padding:1px;opacity:.42;white-space:pre;flex:none;border-bottom:2px solid transparent}
.word-game-letter[data-filled=true]{opacity:1;text-shadow:0 0 16px var(--accent)}
.word-game-letter[data-current=true]{border-bottom-color:var(--accent);opacity:.85}
.word-game-panel{display:grid;grid-template-rows:auto auto auto;align-content:end;gap:12px;width:min(900px,100%);justify-self:center;min-width:0;min-height:0}
.word-game-modes{display:flex;gap:8px;justify-content:center}
#word-games .word-game-modes>.btn{width:clamp(48px,4vw,96px);height:clamp(48px,4vw,96px);min-width:48px;min-height:48px;padding:4px}
#word-games .word-game-modes>.btn[aria-pressed=true]{border-color:var(--accent);background:#7aadd52b;box-shadow:0 0 20px var(--theme-glow,#91bfff30)}
.word-game-answers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#word-games .word-game-answer{display:flex;min-width:0;min-height:clamp(56px,5vw,112px);margin:0;width:100%;padding:8px 12px;font-size:clamp(18px,1.6vw,36px);line-height:1.2;white-space:normal;overflow-wrap:anywhere;background:#132039a6;border-color:#8eadd036;border-radius:16px;transition:background .18s,border-color .18s,box-shadow .18s}
#word-games .word-game-answer:hover{background:#1e3552;border-color:#a4c9f2}
#word-games .word-game-answer[data-wrong=true]{border-color:#df8898;opacity:.4}
#word-games .word-game-answer[data-correct=true]{border-color:#b8e8db;box-shadow:0 0 22px #88d4be50;opacity:1}
.word-game-footer{display:flex;min-height:48px;justify-content:center;align-items:center;gap:12px}
#word-game-status{font-size:clamp(16px,1.4vw,30px);color:var(--accent)}
#word-games .word-game-footer>.btn{width:clamp(48px,4vw,96px);height:clamp(48px,4vw,96px);margin:0;padding:4px}
#word-games [hidden]{display:none!important}
#word-games .btn[data-icon]::before{width:clamp(28px,2.5vw,56px);height:clamp(28px,2.5vw,56px);flex-basis:clamp(28px,2.5vw,56px)}
#word-games[data-state=complete] #word-game-word{text-shadow:0 0 18px #c3e8ff66}
#word-games-open{flex:none;min-width:48px;min-height:48px}
@media(min-width:1000px),(orientation:landscape) and (max-height:600px){.word-game-workspace{grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);grid-template-rows:minmax(0,1fr);gap:24px}.word-game-panel{align-self:center}.word-game-scene{grid-template-rows:minmax(0,1fr) auto}}
@media(max-height:480px){html body #word-games{padding:8px 12px;gap:6px}.word-game-workspace{gap:12px}.word-game-panel{gap:6px}.word-game-answers{gap:6px}#word-games .word-game-answer{min-height:48px;padding:4px 8px;font-size:16px}#word-games .word-game-header h2{font-size:20px}#word-game-word{font-size:20px;min-height:28px}.word-game-modes{gap:6px}.word-game-footer{gap:6px}}
@media(horizontal-viewport-segments:2){.word-game-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr);column-gap:calc(env(viewport-segment-left 1 0) - env(viewport-segment-right 0 0) + 32px)}.word-game-header{max-width:calc(env(viewport-segment-width 1 0) - 32px);margin-inline-start:auto}}
@media(vertical-viewport-segments:2){.word-game-workspace{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,1fr);row-gap:calc(env(viewport-segment-top 0 1) - env(viewport-segment-bottom 0 0) + 16px)}}
