.word-puzzle-live { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.turn-intro { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1.5rem; background: rgba(6,22,45,.65); animation: turn-intro-fade 3s both; }
.turn-intro-bubble { width: min(80vw, 58rem); padding: clamp(1.5rem, 5vw, 4rem); display: grid; gap: 1rem; text-align: center; border: 3px solid #f4c66b; border-radius: clamp(2rem, 6vw, 5rem); color: #08254d; background: #fffaf0; box-shadow: 0 2rem 6rem rgba(0,0,0,.35); }
.turn-intro-bubble span { color: #805000; font-size: clamp(.9rem, 2vw, 1.6rem); font-weight: 700; text-transform: uppercase; letter-spacing: .16em; }
.turn-intro-bubble strong { overflow-wrap: anywhere; font-family: Fraunces, Georgia, serif; font-size: clamp(2.2rem, 7vw, 6.5rem); line-height: 1.1; }
.turn-intro-bubble small { font-size: clamp(.8rem, 1.6vw, 1.25rem); }
@keyframes turn-intro-fade { 0%, 100% { opacity: 0; } 14%, 78% { opacity: 1; } }
.word-puzzle-flow { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem .75rem; }
.word-puzzle-flow .puzzle-token { display: inline-flex; align-items: end; gap: .14rem; white-space: nowrap; }
.word-puzzle-flow .puzzle-cell { width: clamp(1rem, 3vw, 1.55rem); min-height: 1.8rem; display: inline-grid; place-items: center; }
.host-answer-toggle { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .25rem .5rem; }
.host-answer-toggle .button { min-height: 2rem; padding: .4rem .65rem; font-size: .78rem; }
.host-answer-toggle .host-answer-key { color: #805000; font-size: .68rem; }
.mystery-board .host-unsolved-cell, .scripture-board .host-unsolved-cell { color: #805000; border: 1px dotted #a66a00; border-bottom-width: 2px; background: #fff3cd; text-decoration: underline dotted; text-underline-offset: .16rem; }

/* The private host controller keeps the turn actions above the board and uses
   compact keys so the entire working area fits on a laptop screen. */
.host-control-active .site-header { padding-block: .5rem; }
.host-control-active .play-main { min-height: 0; padding-top: .35rem; padding-bottom: 1rem; }
.host-control-active .game-topbar { margin-bottom: .5rem; }
.host-control-active .game-shell { padding-top: 0; }
.host-control-active .phase-panel { min-height: 0; padding: .75rem; }
.host-control-active .host-turn-toolbar { position: sticky; top: .4rem; z-index: 6; display: flex; align-items: stretch; flex-wrap: wrap; gap: .5rem; margin-bottom: .5rem; border-radius: .75rem; background: var(--white); box-shadow: 0 2px 6px rgba(8,37,77,.1); }
.host-control-active .turn-status { flex: 1 1 15rem; min-width: 0; margin: 0; padding: .45rem .65rem; gap: .5rem; border-radius: .75rem; }
.host-control-active .turn-status small { font-size: .7rem; }
.host-control-active .turn-clock { width: 3rem; height: 3rem; font-size: 1.35rem; }
.host-control-active .turn-clock.paused { width: 3.7rem; font-size: .6rem; }
.host-control-active .host-console { flex: 0 1 auto; margin: 0; padding: .45rem .6rem; border-radius: .75rem; }
.host-control-active .host-console .eyebrow { margin: 0 0 .3rem; font-size: .6rem; }
.host-control-active .phase-actions { margin: 0; gap: .35rem; }
.host-control-active .host-console .phase-actions .button { flex: 0 0 auto; }
.host-control-active .button { min-height: 2.1rem; padding: .45rem .65rem; gap: .4rem; font-size: .78rem; border-radius: .5rem; }
.host-control-active .button kbd { font: inherit; font-size: .65rem; opacity: .8; }
.host-control-active .board-heading { padding: .45rem .65rem; gap: .5rem; align-items: center; }
.host-control-active .board-heading .eyebrow { margin: 0 0 .15rem; font-size: .6rem; }
.host-control-active .board-heading strong { font-size: 1rem; }
.host-control-active .host-answer-toggle { max-width: 17rem; }
.host-control-active .puzzle-rows { padding: .4rem; gap: .25rem; }
.host-control-active .puzzle-row { min-height: 1.9rem; padding: .15rem .4rem; }
.host-control-active .row-number { width: 1.35rem; height: 1.35rem; }
.host-control-active .puzzle-cell { width: 1.25rem; min-height: 1.5rem; font-size: .82rem; }
.host-control-active .puzzle-word { column-gap: .7rem; row-gap: .2rem; }
.host-control-active .board-legend { padding: .3rem .65rem; font-size: .63rem; }
.host-control-active .controller-controls { margin-top: .5rem; padding: .6rem .75rem; border-radius: .75rem; }
.host-control-active .controller-controls h3, .host-control-active .host-judge-card h3 { font-size: 1rem; }
.host-control-active .controller-controls > p { margin: .2rem 0 .35rem; font-size: .75rem; line-height: 1.35; }
.host-control-active .keyboard-shortcuts { margin: .35rem 0; gap: .25rem .65rem; font-size: .7rem; }
.host-control-active .keyboard-shortcuts kbd { min-width: 1.4rem; padding: .1rem .25rem; font-size: .65rem; }
.host-control-active .alphabet { grid-template-columns: repeat(13, minmax(0, 2.4rem)); gap: .25rem; }
.host-control-active .letter-key { aspect-ratio: auto; min-height: 2rem; padding: .2rem; font-size: .85rem; border-radius: .35rem; }
.host-control-active .host-judge-card { margin-top: .35rem; padding: .5rem .65rem; border-radius: .65rem; }
.host-control-active .controller-controls .host-judge-card { margin-top: .35rem; padding: 0; border: 0; background: transparent; }
.host-control-active .host-judge-card p { margin: .25rem 0; font-size: .75rem; line-height: 1.35; }
.host-control-active .answer-selection-prompt { padding: .5rem .65rem; font-size: .8rem; }
.host-control-active .answer-selection-prompt span { font-size: .75rem; }
.host-control-active .waiting-card { margin-top: .5rem; padding: .65rem; }
@media (min-width: 900px) {
  .host-control-active .thunders-layout, .host-control-active .scripture-layout { grid-template-columns: minmax(0, 1fr) 14rem; gap: .75rem; }
  .host-control-active .score-card { padding: 1rem; max-height: calc(100dvh - 9rem); overflow-y: auto; }
}
@media (max-width: 599px) {
  .host-control-active .alphabet { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .host-control-active .board-heading { flex-wrap: wrap; flex-direction: row; }
  .host-control-active .host-answer-toggle { justify-content: flex-start; }
  .host-control-active .puzzle-cell { width: .9rem; min-height: 1.35rem; font-size: .7rem; }
}
@media (prefers-reduced-motion: reduce) {
  .turn-intro { animation: none; }
  .puzzle-entry-number, .puzzle-entry-blank { opacity: 1 !important; transition: none !important; }
  .letter-reveal-prep, .letter-reveal-square, .letter-reveal-flip { animation: none !important; transform: none !important; opacity: 1 !important; }
}
