.game-hub .home-copy,
.act-home .home-copy { max-width: 980px; }

.game-pick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 46px auto 0;
}

.game-pick-card {
  display: grid;
  gap: 10px;
  min-height: 230px;
  padding: clamp(24px, 4vw, 38px);
  color: var(--bee-navy);
  text-align: left;
  text-decoration: none;
  background: var(--bee-paper);
  border: 1px solid var(--bee-line);
  border-radius: var(--bee-radius);
  box-shadow: var(--bee-shadow);
}

.game-pick-card.featured {
  border-color: #8bc4ef;
  background: linear-gradient(135deg, #fefbf2, #eef8ff);
}

.game-pick-card span {
  color: var(--bee-blue);
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.game-pick-card strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
}

.game-pick-card p {
  margin: 0;
  color: var(--bee-muted);
  font-size: 1rem;
}

.act-setup {
  display: grid;
  gap: 16px;
  max-width: 900px;
  margin: 34px auto 0;
  padding: clamp(18px, 3vw, 30px);
  text-align: left;
  background: var(--bee-paper);
  border: 1px solid var(--bee-line);
  border-radius: var(--bee-radius);
  box-shadow: var(--bee-shadow);
}

.family-setup-home { width: min(1060px, calc(100% - 24px)); }
.family-setup-home .home-copy { max-width: 820px; }
.family-setup-form { display: grid; gap: 18px; margin: 34px auto 70px; text-align: left; }
.quick-start-presets{display:grid;grid-template-columns:1fr 1.4fr;gap:18px;align-items:center;padding:clamp(18px,3vw,28px);background:linear-gradient(135deg,#fff8de,#eef8ff);border:1px solid #d8c26b;border-radius:var(--bee-radius);box-shadow:var(--bee-shadow)}
.quick-start-presets h2,.quick-start-presets p{margin:4px 0}.preset-button-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.preset-button-grid button{min-height:52px;padding:10px 12px;color:var(--bee-navy);background:#fff;border:2px solid var(--bee-line);border-radius:12px;font:inherit;font-weight:900;cursor:pointer}.preset-button-grid button.selected{color:var(--bee-blue);border-color:var(--bee-blue);background:var(--bee-blue-soft)}
.family-setup-form fieldset { margin: 0; padding: clamp(18px, 3vw, 28px); background: var(--bee-paper); border: 1px solid var(--bee-line); border-radius: var(--bee-radius); box-shadow: var(--bee-shadow); }
.family-setup-form legend { display: flex; gap: 10px; align-items: center; padding: 0 8px; color: var(--bee-navy); font-size: 1.05rem; font-weight: 900; }
.family-setup-form legend b { display: grid; width: 28px; height: 28px; place-items: center; color: white; background: var(--bee-blue); border-radius: 50%; font-size: .85rem; }
.setup-choice-grid { display: grid; gap: 10px; }.setup-choice-grid.two{grid-template-columns:repeat(2,1fr)}.setup-choice-grid.three{grid-template-columns:repeat(3,1fr)}.setup-choice-grid.five{grid-template-columns:repeat(5,1fr)}
.setup-choice-grid label,.category-check-grid label { position: relative; cursor: pointer; }
.setup-choice-grid input { position: absolute; opacity: 0; pointer-events: none; }
.setup-choice-grid label>span { display: grid; gap: 5px; min-height: 86px; align-content: center; padding: 13px; text-align: center; background: white; border: 2px solid var(--bee-line); border-radius: 13px; }
.setup-choice-grid small { color: var(--bee-muted); line-height: 1.25; }
.setup-choice-grid input:checked+span { color: var(--bee-blue); background: var(--bee-blue-soft); border-color: var(--bee-blue); box-shadow: inset 0 0 0 1px var(--bee-blue); }
.setup-choice-grid input:focus-visible+span,.category-check-grid input:focus-visible+span { outline: 3px solid #e6bd48; outline-offset: 2px; }
.locked-choice { opacity: .62; cursor: not-allowed!important; }.locked-choice>span{background:#f5f7f8!important}
.fieldset-help { margin: -2px 0 14px; color: var(--bee-muted); }
.category-check-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.theme-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.theme-shortcuts button{min-height:44px;padding:8px 12px;color:var(--bee-navy);background:#fff;border:1px solid var(--bee-line);border-radius:999px;font-weight:900;cursor:pointer}.theme-shortcuts button.selected{color:var(--bee-blue);background:var(--bee-blue-soft);border-color:var(--bee-blue)}
.favorite-replay-choice{display:flex;gap:12px;align-items:center;padding:16px 18px;background:#fff8de;border:1px solid #e6bd48;border-radius:14px;cursor:pointer}.favorite-replay-choice input{width:22px;height:22px;accent-color:var(--bee-blue)}.favorite-replay-choice span{display:grid}.favorite-replay-choice small{color:var(--bee-muted)}
.category-check-grid label { display: flex; gap: 8px; align-items: center; padding: 11px; background: white; border: 1px solid var(--bee-line); border-radius: 11px; font-weight: 800; }
.category-check-grid input { width: 20px; height: 20px; accent-color: var(--bee-blue); }
.free-game-note { display: flex; gap: 20px; align-items: center; justify-content: space-between; padding: 18px 20px; color: var(--bee-navy); background: #fff8de; border: 1px solid #e6bd48; border-radius: 14px; }
.free-game-note div { display: grid; gap: 4px; }.free-game-note span{color:var(--bee-muted)}.free-game-note a{font-weight:900;white-space:nowrap}
.setup-submit { width: min(420px,100%); min-height: 58px; margin: 4px auto 0; font-size: 1.05rem; }
.setup-error { max-width: 900px; margin: 24px auto 0; padding: 14px 18px; color: #8a251f; background: #fff0ef; border: 1px solid #d89994; border-radius: 12px; font-weight: 800; }
.setup-sign-in { max-width: 700px; margin: 36px auto; padding: 30px; text-align: center; background: white; border: 1px solid var(--bee-line); border-radius: var(--bee-radius); box-shadow: var(--bee-shadow); }
.host-walkthrough { width: min(760px,100%); margin: 28px auto 0; padding: clamp(18px,3vw,28px); text-align: left; background: #fff8de; border: 1px solid #e6bd48; border-radius: 18px; }
.host-walkthrough>div span { color: #765707; font-size: .75rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.host-walkthrough h2 { margin: 5px 0 16px; font-family: Georgia,"Times New Roman",serif; font-size: clamp(1.5rem,3vw,2.1rem); }
.host-walkthrough ol { display: grid; gap: 12px; margin: 0 0 18px; padding-left: 22px; }
.host-walkthrough li { padding-left: 4px; }.host-walkthrough li strong,.host-walkthrough li small{display:block}.host-walkthrough li small{margin-top:3px;color:var(--bee-muted);line-height:1.4}
.room-ready-checklist{display:grid;gap:7px;max-width:560px;margin:22px auto 0;padding:16px;text-align:left;background:#fff;border:1px solid var(--bee-line);border-radius:14px}.room-ready-checklist span{font-weight:800}.room-ready-checklist .ready{color:#26713d}.room-ready-checklist .waiting{color:#865c0a}
.family-goal-meter{height:18px;max-width:560px;margin:18px auto;overflow:hidden;background:#e9e4d8;border-radius:999px}.family-goal-meter span{display:block;height:100%;background:linear-gradient(90deg,#e6bd48,#2c9a63);border-radius:inherit}
.learning-summary{max-width:680px;margin:28px auto 0;padding:22px;text-align:left;background:#fff8de;border:1px solid #e6bd48;border-radius:18px}.learning-summary h2{margin:5px 0 14px}.learning-summary ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}.learning-summary li{display:flex;justify-content:space-between;gap:18px;padding-bottom:7px;border-bottom:1px solid #eadcae}.learning-summary li span{color:var(--bee-muted);font-weight:800}.celebration-stage{position:relative;overflow:hidden}.celebration-stage:before,.celebration-stage:after{content:"✦  •  ✦  •  ✦";position:absolute;top:16px;color:#e6bd48;font-size:1.4rem;letter-spacing:.5rem;animation:celebration-float 1.2s ease-out both}.celebration-stage:before{left:20px}.celebration-stage:after{right:20px}@keyframes celebration-float{from{opacity:0;transform:translateY(20px) scale(.7)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.celebration-stage:before,.celebration-stage:after{animation:none}}
.prompt-preferences{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin:16px auto}.prompt-preferences strong{width:100%}.prompt-preferences button{min-height:44px;padding:9px 13px;color:var(--bee-navy);background:#fff;border:1px solid var(--bee-line);border-radius:999px;font-weight:900;cursor:pointer}
.game-feedback{max-width:680px;margin:24px auto 0;padding:20px;text-align:left;background:#fff;border:1px solid #dfd9c9;border-radius:18px}.game-feedback h2{margin:0 0 4px}.game-feedback>p{margin:0 0 16px;color:var(--bee-muted)}.game-feedback form,.game-feedback label{display:grid;gap:7px}.game-feedback form{gap:16px}.game-feedback fieldset{margin:0;padding:0;border:0}.game-feedback legend,.game-feedback label{font-weight:800}.game-feedback select,.game-feedback textarea{width:100%;padding:11px;border:1px solid #bcb5a5;border-radius:10px;font:inherit}.feedback-rating,.feedback-again{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.feedback-rating label,.feedback-again label{display:block}.feedback-rating input,.feedback-again input{position:absolute;opacity:0}.feedback-rating span,.feedback-again span{display:block;min-width:44px;padding:9px 12px;text-align:center;border:1px solid #bcb5a5;border-radius:999px;background:#fff}.feedback-rating input:checked+span,.feedback-again input:checked+span{color:#fff;background:var(--bee-navy);border-color:var(--bee-navy)}.feedback-quote{grid-template-columns:auto 1fr!important;align-items:start;font-weight:600!important}.feedback-privacy{font-size:.86rem}.game-feedback.thanks{text-align:center;background:#f1faef}
.host-help { margin-top: 4px; text-align: left; background: white; border: 1px solid var(--bee-line); border-radius: 11px; }
.host-help summary { padding: 11px 13px; color: var(--bee-blue); font-weight: 900; cursor: pointer; }.host-help div{padding:0 13px 13px}.host-help p{margin:9px 0;color:var(--bee-muted);font-size:.83rem;line-height:1.4}.host-help a{font-size:.85rem;font-weight:900}
@media(max-width:760px){.quick-start-presets{grid-template-columns:1fr}.setup-choice-grid.five{grid-template-columns:repeat(2,1fr)}.setup-choice-grid.three,.category-check-grid{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.setup-choice-grid.two,.setup-choice-grid.three,.setup-choice-grid.five,.category-check-grid{grid-template-columns:1fr}.setup-choice-grid label>span{min-height:70px}.free-game-note{align-items:flex-start;flex-direction:column}}

.act-theme-picker {
  margin: 0;
  padding: 0;
  border: 0;
}

.act-theme-picker legend {
  margin-bottom: 10px;
  font-size: 1rem;
  font-weight: 900;
}

.act-theme-picker > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.act-theme-picker label {
  cursor: pointer;
}

.act-theme-picker input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.act-theme-picker span {
  display: grid;
  min-height: 54px;
  place-items: center;
  padding: 10px;
  color: var(--bee-navy);
  background: white;
  border: 1px solid var(--bee-line);
  border-radius: 12px;
  font-size: .9rem;
  font-weight: 900;
  text-align: center;
}

.act-theme-picker input:checked + span {
  color: var(--bee-blue);
  background: var(--bee-blue-soft);
  border-color: var(--bee-blue);
  box-shadow: inset 0 0 0 1px var(--bee-blue);
}

.act-team-line {
  margin: -12px auto 16px;
  color: var(--bee-blue);
  font-size: clamp(1.2rem, 2.4vw, 1.8rem);
  font-weight: 900;
}

.act-timer {
  display: inline-grid;
  min-width: 180px;
  margin: 10px auto 20px;
  padding: 18px 24px;
  color: var(--bee-blue);
  background: var(--bee-blue-soft);
  border: 2px solid #a8d0ec;
  border-radius: 20px;
}

.act-timer strong {
  font-size: clamp(3rem, 9vw, 6rem);
  line-height: .9;
}

.act-timer span {
  color: var(--bee-muted);
  font-size: .8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.act-display-instruction {
  max-width: 620px;
  margin: 8px auto 24px;
  color: var(--bee-muted);
  font-size: 1.1rem;
  font-weight: 800;
}

.host-score-hint {
  margin: 0 0 8px;
  color: var(--bee-muted);
  font-size: .84rem;
  font-weight: 800;
  line-height: 1.3;
}

.secret-prompt-card {
  display: grid;
  gap: 12px;
  width: min(760px, 100%);
  margin: 18px auto 0;
  padding: clamp(20px, 4vw, 34px);
  text-align: center;
  background: #fff8de;
  border: 2px solid #e6bd48;
  border-radius: 22px;
}

.host-secret-details {
  width: min(760px, 100%);
  margin: 18px auto 0;
}

.host-secret-details summary {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 9px 16px;
  color: var(--bee-blue);
  background: white;
  border: 2px solid var(--bee-blue);
  border-radius: 12px;
  font-weight: 900;
  cursor: pointer;
}

.secret-prompt-card > span {
  color: #765707;
  font-size: .8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.secret-prompt-card h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.1rem, 7vw, 4.8rem);
  line-height: 1;
}

.secret-prompt-card p {
  max-width: 560px;
  margin: 0 auto;
  color: var(--bee-muted);
  font-size: 1.05rem;
  font-weight: 800;
}

.forbidden-words {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.forbidden-words strong {
  flex-basis: 100%;
  color: #9b3d38;
  font-size: .75rem;
  text-transform: uppercase;
}

.forbidden-words b {
  padding: 6px 10px;
  color: #9b3d38;
  background: #fff0ef;
  border-radius: 999px;
  font-size: .82rem;
}

.secret-clue-bank {
  display: grid;
  gap: 8px;
  max-width: 620px;
  margin: 6px auto 0;
  text-align: left;
}

.secret-clue-bank strong {
  color: #765707;
  font-size: .75rem;
  text-align: center;
  text-transform: uppercase;
}

.secret-clue-bank span {
  padding: 8px 10px;
  color: var(--bee-navy);
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(118,87,7,.22);
  border-radius: 10px;
  font-weight: 800;
}

.guess-clues {
  display: grid;
  gap: 12px;
  width: min(820px, 100%);
  margin: 18px auto;
  padding: clamp(16px, 2.8vw, 28px);
  text-align: left;
  background: #f7fbff;
  border: 2px solid #a8d0ec;
  border-radius: 18px;
}

.guess-clues.compact {
  max-width: 680px;
  margin-top: 14px;
  padding: 14px 18px;
}

.guess-clues > strong {
  color: var(--bee-blue);
  font-size: .8rem;
  text-transform: uppercase;
}

.guess-clues ol {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 24px;
}

.guess-clues li,
.guess-clues p {
  color: var(--bee-navy);
  font-size: clamp(1.05rem, 2.1vw, 1.55rem);
  font-weight: 900;
  line-height: 1.2;
}

.guess-clues small {
  color: var(--bee-muted);
  font-weight: 900;
}

.draw-panel,
.draw-display-panel {
  width: min(820px, 100%);
  margin: 18px auto 0;
  padding: clamp(12px, 2vw, 18px);
  background: #f7fbff;
  border: 2px solid #a8d0ec;
  border-radius: 18px;
}

.draw-panel canvas {
  display: block;
  width: 100%;
  aspect-ratio: 64 / 42;
  height: auto;
  touch-action: none;
  background: white;
  border: 1px solid var(--bee-line);
  border-radius: 12px;
}

.draw-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.draw-status {
  margin: 10px 0 0;
  color: var(--bee-muted);
  font-size: .9rem;
  font-weight: 800;
}

.draw-display-panel {
  display: grid;
  min-height: 240px;
  place-items: center;
}

.draw-display-panel img {
  display: block;
  width: 100%;
  max-height: 48vh;
  object-fit: contain;
  background: white;
  border: 1px solid var(--bee-line);
  border-radius: 12px;
}

.draw-display-panel p {
  margin: 0;
  color: var(--bee-muted);
  font-size: clamp(1.2rem, 2.4vw, 2rem);
  font-weight: 900;
}

.player-turn-stage h1,
.act-round-stage h1,
.act-reveal-stage h1 {
  margin: 12px 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.5rem, 7vw, 5rem);
  line-height: 1;
}

.act-display-team-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 24px);
  width: min(880px, 100%);
  margin: 0 auto;
}

.act-display-team {
  padding: clamp(16px, 2.5vw, 30px);
  background: white;
  border: 3px solid var(--bee-line);
  border-radius: 18px;
}

.act-display-team.team-gold { border-color: #e1b438; background: #fff8de; }
.act-display-team.team-blue { border-color: #77b8e9; background: #eef8ff; }

.act-display-team strong,
.act-display-team output,
.act-display-team small {
  display: block;
}

.act-display-team strong {
  color: var(--bee-muted);
  font-size: clamp(.85rem, 1.2vw, 1.05rem);
  text-transform: uppercase;
}

.act-display-team output {
  color: var(--bee-blue);
  font-size: clamp(2.5rem, 6vw, 5rem);
  font-weight: 900;
  line-height: 1;
}

.act-display-team small {
  color: var(--bee-muted);
  font-weight: 900;
}

.act-display-round .display-prompt {
  font-size: clamp(3rem, 8vw, 7rem);
}

.act-display-round .act-timer.display {
  min-width: clamp(220px, 25vw, 340px);
}

.act-display-round.guess-display-round {
  align-content: start;
  gap: clamp(10px, 1.4vw, 18px);
  padding: clamp(18px, 3vw, 42px);
}

.guess-display-round .act-display-team-board {
  max-width: 760px;
  gap: 12px;
}

.guess-display-round .act-display-team {
  padding: clamp(10px, 1.5vw, 18px);
}

.guess-display-round .act-display-team output {
  font-size: clamp(2rem, 4vw, 3.6rem);
}

.guess-display-round h1 {
  font-size: clamp(2.5rem, 5.5vw, 5.8rem);
}

.act-display-round.guess-display-round .display-prompt {
  font-size: clamp(2rem, 4vw, 4.2rem);
}

.guess-display-round .guess-clues {
  width: min(860px, 100%);
  margin: 0 auto;
  padding: clamp(14px, 2vw, 22px);
}

.guess-display-round .guess-clues li,
.guess-display-round .guess-clues p {
  font-size: clamp(1.1rem, 2.5vw, 2rem);
}

.guess-display-round .act-timer.display {
  min-width: 150px;
  margin: 0 auto;
  padding: 10px 18px;
}

.guess-display-round .act-timer.display strong {
  font-size: clamp(2.4rem, 5vw, 4rem);
}

.guess-display-round .act-display-instruction {
  margin-bottom: 0;
}

.act-display-round.draw-display-round {
  align-content: start;
  gap: clamp(10px, 1.4vw, 18px);
  padding: clamp(18px, 3vw, 42px);
}

.draw-display-round h1 {
  font-size: clamp(2.5rem, 5.2vw, 5.4rem);
}

.act-display-round.draw-display-round .display-prompt {
  font-size: clamp(1.8rem, 3.5vw, 3.7rem);
}

.draw-display-round .draw-display-panel {
  min-height: 260px;
  margin-top: 0;
}

.draw-display-round .draw-display-panel img {
  max-height: 42vh;
}

.draw-display-round .act-timer.display {
  min-width: 150px;
  margin: 0 auto;
  padding: 10px 18px;
}

.draw-display-round .act-timer.display strong {
  font-size: clamp(2.4rem, 5vw, 4rem);
}

.act-room-body[data-role="display"] .room-header {
  display: none;
}

.act-room-body[data-role="display"] .game-shell {
  width: min(1680px, calc(100% - 48px));
  min-height: 100vh;
  margin: 0 auto;
  padding: clamp(18px, 3vw, 44px) 0;
}

.act-room-body[data-role="display"] .display-stage {
  min-height: calc(100vh - 88px);
}

@media (max-width: 850px) {
  .prepare-layout .score-rail {
    order: initial;
  }

  .act-room-body[data-role="player"] .game-layout .score-rail {
    order: initial;
  }

  .drawing-controller-layout {
    grid-template-columns: 1fr;
  }

  .drawing-controller-layout .score-rail {
    display: none;
  }

  .game-pick-grid,
  .act-theme-picker > div {
    grid-template-columns: 1fr;
  }
  .act-setup {
    padding: 18px;
  }
}

.act-room-body .bee-brand,
.act-room-body .read-mode-control select,
.act-room-body .text-button,
.act-room-body .away-player,
.act-room-body .switch-team-player {
  min-height: 44px;
}

@media (max-width: 600px) {
  .act-display-team-board {
    grid-template-columns: 1fr;
  }
  .secret-prompt-card h2 {
    font-size: clamp(2rem, 12vw, 3.5rem);
  }
  .act-room-body[data-role="display"] .game-shell {
    width: min(100% - 20px, 720px);
  }
}