/* Touch layout is scoped to the playground. Other learning screens retain their layout. */
@media (max-width: 900px), (max-width: 1400px) and (pointer: coarse) {
  body.word-defense-page { overflow: hidden; padding-bottom: 0; }
  body.word-defense-page .sidebar, body.word-defense-page .topbar, body.word-defense-page .mobile-nav, body.word-defense-page .bottom-nav { display: none !important; }
  body.word-defense-page .app-shell { display: block; min-height: 0; height: 100dvh; }
  body.word-defense-page .workspace { height: 100%; min-height: 0; }
  #mainContent.word-defense-view { width: 100%; max-width: none; height: 100dvh; margin: 0; padding: max(12px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); }
  .wd-game { height: 100%; }
  .wd-heading { gap: 8px; margin-bottom: 12px; }
  .wd-eyebrow { font-size: 11px; gap: 9px; }
  .wd-back-home { display: inline-flex; align-items: center; min-height: 36px; color: #526c50; text-decoration: none; }
  .wd-heading h1 { margin: 0; font-size: 25px; }
  .wd-heading h1 > span, .wd-preview-tag, .wd-level-chip, .wd-bottom-caption { display: none; }
  .wd-heading-actions { gap: 4px; flex-wrap: nowrap; }
  .wd-heading-actions .wd-help-button { min-height: 44px; padding: 8px; font-size: 13px; white-space: nowrap; }
  .wd-help-button > span { display: none; }
  .wd-layout { grid-template-columns: minmax(0, 1fr) 316px; gap: 14px; }
  .wd-arena { height: 100%; grid-template-rows: 64px minmax(0, 1fr) 56px 36px; border-radius: 13px; }
  .wd-hud { padding: 0 14px; gap: 8px; }
  .wd-chapter strong { font-size: 15px; }
  .wd-chapter > .wd-icon, .wd-hud-label { display: none; }
  .wd-resources { gap: 14px; }
  .wd-resource strong { font-size: 23px; }
  .wd-wave-count { padding-left: 12px; }
  .wd-field-controls button { width: 44px; height: 44px; font-size: 14px; }
  .wd-field-controls { position: static; flex: 0 0 auto; gap: 5px; }
  .wd-wave-footer { gap: 16px; padding: 0 10px; }
  .wd-field-note { display: none; }
  .wd-plot { width: 44px; height: 44px; touch-action: manipulation; }
  .wd-plot.has-tower { height: 48px; }
  .wd-plot > span { width: 16px; height: 16px; font-size: 10px; }
  .wd-enemy-count { display: none; }
  .wd-wave-timeline { width: 100%; max-width: none; min-width: 0; flex: 1; }
  .wd-wave-timeline b { width: 26px; height: 26px; }
  .wd-wave-timeline small { font-size: 10px; }
  .wd-arena-bottom { padding: 0 12px; font-size: 10px; }
  .wd-side { display: flex; flex-direction: column; gap: 0; min-height: 0; overflow: hidden; border: 1px solid #d9e1cf; border-radius: 13px; background: #fffef7; }
  .wd-touch-tabs { display: flex; flex: 0 0 48px; width: 100%; padding: 4px; gap: 4px; border-bottom: 1px solid #e4e9da; background: #eff3e8; }
  .wd-touch-tabs button { flex: 1; min-height: 40px; border-radius: 7px; background: transparent; color: #7e8c73; font-size: 14px; }
  .wd-touch-tabs button[aria-pressed="true"] { color: #35563d; background: #fffef8; box-shadow: 0 2px 5px #3853390d; font-weight: 700; }
  .wd-question-panel, .wd-build-panel { flex: 1 1 auto; min-height: 0; width: 100%; overflow: auto; padding: 18px; border: 0; border-radius: 0; box-shadow: none; scrollbar-width: thin; overscroll-behavior: contain; }
  .wd-game[data-touch-panel="question"] .wd-build-panel, .wd-game[data-touch-panel="question"] .wd-touch-build-actions,
  .wd-game[data-touch-panel="build"] .wd-question-panel { display: none; }
  .wd-game[data-touch-panel="build"] .wd-touch-build-actions { display: block; flex: 0 0 auto; width: 100%; padding: 8px 18px 14px; border-top: 1px solid #e8ecdf; }
  .wd-game .wd-primary, .wd-game .wd-secondary { min-height: 44px; font-size: 14px; padding: 10px 12px; }
  .wd-question-panel h2 { margin-top: 10px; font-size: 25px; }
  .wd-word-line { margin: 12px 0 18px; }
  .wd-word-line h2 { font-size: 34px; margin: 0; }
  .wd-word-line button { width: 44px; height: 44px; }
  .wd-panel-kicker, .wd-question-caption, .wd-question-number { font-size: 12px; }
  .wd-options { gap: 8px; }
  .wd-option { min-height: 47px; padding: 8px 10px; font-size: 14px; }
  .wd-option-letter { width: 24px; height: 24px; font-size: 12px; }
  .wd-answer-feedback { margin-top: 12px; min-height: 44px; font-size: 12px; }
  .wd-answer-feedback p, .wd-setup-copy, .wd-build-hint { font-size: 12px; line-height: 1.7; }
  .wd-question-shortcut { display: none; }
  .wd-deck-picker { margin: 12px 0; font-size: 12px; }
  .wd-deck-picker select { min-height: 44px; font-size: 13px; }
  .wd-setup-steps { margin: 14px 0; gap: 10px; }
  .wd-setup-steps span, .wd-micro { font-size: 11px; }
  .wd-tower-option { min-height: 62px; font-size: 14px; padding: 10px; }
  .wd-tower-option strong { font-size: 14px; }
  .wd-tower-option small, .wd-panel-line > span, .wd-selected-tower p { font-size: 12px; }
  .wd-tower-list { gap: 12px; margin-top: 18px; }
  .wd-map-welcome { width: 240px; max-width: 80%; padding: 18px; margin: 0; }
  .wd-map-welcome > strong { font-size: 25px; }
  .wd-map-welcome p, .wd-map-welcome > span { font-size: 11px; }
  .wd-campaign-dialog, .wd-help-dialog { max-height: calc(100dvh - 24px); }
  .wd-campaign-heading > button { width: 44px; height: 44px; }
  .wd-chapter-tabs button { min-height: 54px; }
  .wd-chapter-tabs span { font-size: 11px; }
  .wd-campaign-tabs > button { min-height: 44px; font-size: 14px; }
  .wd-level-detail p, .wd-level-detail span { font-size: 12px; }
  .wd-notice { max-width: calc(100vw - 28px); }
}
@media (max-width: 900px) and (orientation: portrait), (max-width: 1400px) and (pointer: coarse) and (orientation: portrait) {
  .wd-layout { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(220px, 44fr) minmax(350px, 56fr); gap: 12px; }
  .wd-arena { grid-template-rows: 54px minmax(0, 1fr) 54px 28px; }
  .wd-side { position: relative; }
  .wd-touch-tabs { flex-basis: 48px; }
  .wd-question-panel { padding: 15px 22px; }
  .wd-word-line { margin: 5px 0 9px; }
  .wd-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .wd-option { min-height: 50px; }
  .wd-answer-feedback { margin: 10px 0 6px; }
  .wd-setup-steps { display: flex; justify-content: space-between; }
  .wd-setup-steps span { display: flex; align-items: center; gap: 7px; }
  .wd-setup-copy { margin: 7px 0; }
  .wd-build-panel .wd-tower-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wd-tower-option { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; min-height: 130px; }
  .wd-build-panel .wd-panel-line h2 { font-size: 19px; }
  .wd-build-hint { margin-top: 12px; }
}
@media (max-width: 540px) {
  #mainContent.word-defense-view { padding: max(8px, env(safe-area-inset-top)) 8px max(8px, env(safe-area-inset-bottom)); }
  .wd-heading { margin-bottom: 6px; }
  .wd-heading h1 { font-size: 21px; }
  .wd-eyebrow { font-size: 9px; gap: 6px; }
  .wd-back-home { font-size: 11px; min-height: 28px; }
  .wd-heading-actions { gap: 0; }
  .wd-heading-actions .wd-help-button { padding: 7px 4px; font-size: 11px; }
  .wd-layout { grid-template-rows: minmax(170px, 40fr) minmax(310px, 60fr); gap: 8px; }
  .wd-arena { grid-template-rows: 44px minmax(0, 1fr) 48px 24px; }
  .wd-hud { padding: 0 10px; }
  .wd-chapter strong { font-size: 12px; }
  .wd-resource strong { font-size: 19px; }
  .wd-resources { gap: 8px; }
  .wd-field-controls button { width: 44px; height: 44px; }
  .wd-wave-timeline small { display: none; }
  .wd-wave-timeline b { width: 20px; height: 20px; font-size: 9px; }
  .wd-question-panel, .wd-build-panel { padding: 12px; }
  .wd-question-panel h2 { font-size: 22px; }
  .wd-question-caption { margin-top: 5px; font-size: 11px; }
  .wd-word-line { margin: 2px 0 6px; }
  .wd-word-line h2 { font-size: 28px; }
  .wd-options { gap: 6px; }
  .wd-option { min-height: 47px; padding: 6px; font-size: 12px; }
  .wd-option-letter { width: 20px; height: 20px; font-size: 10px; }
  .wd-answer-feedback { margin-top: 7px; min-height: 30px; }
  .wd-setup-steps { display: none; }
  .wd-setup-copy { font-size: 11px; }
  .wd-micro { font-size: 10px; margin-top: 6px; }
  .wd-tower-option { min-height: 118px; padding: 7px; }
  .wd-tower-option strong { font-size: 12px; }
  .wd-tower-option small { font-size: 10px; }
  .wd-map-welcome { padding: 10px; width: 195px; }
  .wd-map-welcome > strong { font-size: 20px; }
  .wd-map-welcome p { margin-top: 5px; font-size: 9px; }
  .wd-campaign-content { padding: 14px 12px; }
  .wd-level-card { min-height: 80px; }
}
@media (max-height: 620px) and (max-width: 1400px) {
  .wd-layout { min-height: 0; }
  .wd-heading .wd-eyebrow { display: none; }
  .wd-heading h1 { font-size: 20px; }
  .wd-arena { grid-template-rows: 44px minmax(0, 1fr) 28px 24px; }
}