/* Stable input, one-row letter slots and safe areas for mobile matches. */
html{scroll-padding-bottom:20px}
button,a,input{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.question-stage{min-height:190px;display:grid;align-items:center}
.question-stage>.intermission{min-height:190px}
.question-stage .intermission>strong{font-size:64px;margin:4px 0}
.question-stage .intermission p{margin:4px 0 12px}
.slots{display:grid;grid-template-columns:repeat(var(--letters,8),minmax(0,35px));gap:clamp(2px,1vw,7px)}
.slot{width:100%;min-width:0}
.answer[aria-disabled="true"]{border-color:var(--line);color:var(--muted)}
.chain-link{overflow-wrap:anywhere;text-align:right}
.toast{overflow-wrap:anywhere;bottom:max(16px,env(safe-area-inset-bottom))}
@media(max-width:650px){
  main{padding:calc(14px + env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) calc(22px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}
  header{gap:8px;margin-bottom:22px}.brand{font-size:18px}.connection{white-space:nowrap}
  .intro h1{font-size:32px}.intro p:not(.eyebrow){margin-bottom:18px}.eyebrow{font-size:11px}
  .panel{border-radius:18px;padding:18px}.setup fieldset{margin:18px 0}.join{margin-top:18px;padding-top:16px}
  .section-heading h1{font-size:24px}.invite-code{font-size:40px}.invite-actions{flex-wrap:wrap}
  body[data-view="arena"] header{margin-bottom:4px}
  .arena-header{gap:6px}.arena-header .eyebrow{font-size:10px;letter-spacing:0;max-width:calc(100% - 90px)}
  .arena-header .leave{font-size:13px;min-height:44px;padding:8px}
  .scoreboard{margin:3px 0 10px;grid-template-columns:1fr 1.2fr 1fr}
  .player strong{font-size:36px}.player>span{font-size:12px}.player small{font-size:10px}
  .clock>strong{font-size:34px;margin:2px 0}.clock>span,.clock small{font-size:12px}
  .opponent-status{font-size:12px;margin:8px 0;min-height:18px}
  .question-panel{padding:14px}.question-top{font-size:12px}
  .question-stage,.question-stage>.intermission{min-height:155px}
  .question-caption{font-size:12px;margin:12px 0 7px}
  #meaning{font-size:24px;min-height:0;margin:0 0 12px;line-height:1.4}
  .slots{margin:12px 0 16px;grid-template-columns:repeat(var(--letters,8),minmax(0,29px));gap:3px}
  .slot{height:34px;font-size:clamp(15px,5vw,21px)}
  .answer{font-size:18px;padding:12px;min-height:48px}.answer::placeholder{font-size:14px}
  .answer-actions{margin-top:10px;gap:8px;grid-template-columns:1fr 1fr}.answer-actions button{min-height:48px;font-size:15px;padding:10px}
  .feedback{font-size:12px;margin:8px 0 0;min-height:18px}.arena-note{font-size:11px;margin:12px 0 0}
  body.typing[data-view="arena"] header,body.typing .arena-note,body.typing .question-caption{display:none}
  body.typing .question-stage,body.typing .question-stage>.intermission{min-height:112px}
  body.typing #meaning{font-size:22px;margin:8px 0}
  body.typing .slots{margin:8px 0 10px}
  body.typing .opponent-status{margin:5px 0}
}
@media(max-width:360px){.brand small{font-size:11px}.intro h1{font-size:29px}.question-panel{padding:12px}.answer-actions button{font-size:14px}}
@media(max-height:500px) and (orientation:landscape){
  body[data-view="arena"] header,.arena-note{display:none}
  #arena{display:grid;grid-template-columns:180px minmax(0,1fr);gap:0 18px}
  .arena-header,.scoreboard,.race-track,.opponent-status{grid-column:1}
  .question-panel{grid-column:2;grid-row:1 / 6;width:100%}
  .scoreboard{grid-template-columns:1fr 1fr}.clock{grid-column:1 / -1;grid-row:1}.question-caption{display:none}
  .question-stage,.question-stage>.intermission{min-height:105px}#meaning{font-size:22px;margin:8px 0}.slots{margin:8px 0}
}