.game-page{
  --game-navy:#102b4c;
  --game-navy-deep:#0a203a;
  --game-orange:#f25a3c;
  --game-orange-dark:#d9472c;
  --game-green:#16865d;
  --game-red:#be3c4d;
  --game-ink:#142a43;
  --game-muted:#647083;
  --game-line:#d7dde4;
  --game-panel:#fff;
  padding:24px clamp(16px,4vw,48px) 58px;
  color:var(--game-ink);
  background-color:#f7fafc;
  background-image:linear-gradient(#dfe7ed 1px,transparent 1px),linear-gradient(90deg,#dfe7ed 1px,transparent 1px);
  background-size:44px 44px;
  font-family:"DM Sans",sans-serif;
}
.game-page *{box-sizing:border-box}
.game-page button,.game-page input,.game-page select{font:inherit}
.game-page button{cursor:pointer}
.game-shell{max-width:1220px;margin:auto;display:grid;gap:18px}
.game-panel,.game-app-header,.category-board{border:1px solid var(--game-line);border-radius:8px;background:rgba(255,255,255,.97);box-shadow:0 14px 36px rgba(17,43,76,.08)}

.game-app-header{min-height:160px;display:flex;align-items:center;gap:42px;padding:22px 42px}
.game-app-header img{width:220px;height:112px;object-fit:contain}
.game-app-header h1{margin:0;font:800 clamp(42px,6vw,78px)/.94 Manrope,sans-serif;letter-spacing:.035em;text-transform:uppercase;color:var(--game-navy)}
.game-app-header p{margin:12px 0 0;color:var(--game-orange);font-size:clamp(14px,1.6vw,20px);font-weight:800;text-transform:uppercase;letter-spacing:.02em}

.category-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:12px}
.category-card{min-width:0;min-height:88px;display:flex;align-items:center;gap:14px;border:1px solid var(--game-line);border-radius:7px;padding:13px;background:#fff;color:var(--game-ink);text-align:left;transition:.2s transform,.2s border-color,.2s box-shadow}
.category-card:hover,.category-card.is-active{transform:translateY(-2px);border-color:var(--game-orange);box-shadow:0 8px 20px rgba(242,90,60,.14)}
.category-card:focus-visible,.game-page button:focus-visible,.game-page input:focus-visible,.game-page select:focus-visible{outline:3px solid #168d89;outline-offset:3px}
.category-card>span:last-child{min-width:0;display:grid;gap:3px}.category-card strong{font:800 clamp(15px,1.5vw,20px)/1 Manrope,sans-serif;text-transform:uppercase;white-space:nowrap}.category-card small{color:var(--game-muted);font-weight:700}
.category-icon{width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;color:var(--game-orange);font-size:28px}.sports-icon{border:2px solid #4b9d8d;border-radius:50%;color:#4b9d8d;font-size:0}.sports-icon:after{content:"";width:30px;height:30px;border:2px solid currentColor;border-left-color:transparent;border-radius:50%}.heart-icon{color:#cb5265;font-size:48px;line-height:1}.blocks-icon{border:2px solid #6868a4;border-radius:5px;color:#6868a4;font:800 18px Manrope}

.video-room{padding:22px}.video-room-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}.video-room-header h2,.signup-panel h2,.instructions h2,.timer-panel h2{margin:0;color:var(--game-navy);font:800 28px/1 Manrope,sans-serif;text-transform:uppercase}.video-room-header p,.signup-panel p,.video-note{margin:7px 0 0;color:var(--game-muted);font-weight:600}.room-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.primary-game-button,.secondary-game-button{min-height:43px;border-radius:6px;padding:0 18px;border:1px solid var(--game-line);background:#fff;color:var(--game-navy);font-weight:800;text-transform:uppercase;letter-spacing:.015em;transition:.18s transform,.18s background,.18s opacity}
.primary-game-button{border-color:var(--game-orange);background:var(--game-orange);color:#fff;box-shadow:0 8px 20px rgba(242,90,60,.2)}
.primary-game-button:hover{background:var(--game-orange-dark);transform:translateY(-1px)}.secondary-game-button:hover{border-color:var(--game-navy)}.primary-game-button:disabled,.secondary-game-button:disabled{cursor:not-allowed;opacity:.45;transform:none;box-shadow:none}.primary-game-button.green{background:var(--game-green);border-color:var(--game-green)}.secondary-game-button.red{background:var(--game-red);border-color:var(--game-red);color:#fff}.wide{width:100%}

.room-setup{display:grid;grid-template-columns:1fr 1fr 1.25fr .9fr;gap:12px;margin-bottom:16px}.room-card,.room-form,.room-status-card{min-width:0;border:1px solid var(--game-line);border-radius:7px;padding:16px;background:#fff}.room-card h3{margin:0 0 9px;color:var(--game-orange);font:800 13px Manrope,sans-serif;text-transform:uppercase}.room-card ol{margin:0;padding-left:19px;color:var(--game-ink);font-size:13px;font-weight:650;line-height:1.35}.room-card li{margin:0 0 6px}.room-card li::marker{color:var(--game-orange);font-weight:800}
.room-form{display:grid;grid-template-columns:1fr 110px;gap:10px}.room-form label{display:grid;gap:5px}.room-form label span,.signup-form label span{color:var(--game-orange);font-size:11px;font-weight:800;text-transform:uppercase}.room-form input,.signup-form input,.signup-form select{width:100%;height:43px;border:1px solid var(--game-line);border-radius:6px;padding:0 11px;background:#fff;color:var(--game-ink);font-weight:650}.room-button-row{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}.room-form>.wide{grid-column:1/-1}.room-status-card{display:flex;flex-direction:column;justify-content:center;background:var(--game-navy);color:#fff}.room-status-card>span{color:#ff9b86;font-size:11px;font-weight:800;text-transform:uppercase}.room-status-card strong{margin:7px 0;font:800 clamp(25px,3vw,40px)/1 Manrope,sans-serif;text-transform:uppercase;overflow-wrap:anywhere}.room-status-card small{color:#d8e1eb;font-weight:650;line-height:1.35}

.game-ad{width:min(720px,100%);aspect-ratio:8/1;margin:14px auto;border:1px dashed #e3a798;border-radius:7px;overflow:hidden;background:#fff8f5}.game-ad[hidden]{display:none}.game-ad a{width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:15px;padding:8px 20px;color:var(--game-navy);text-align:center}.game-ad a>span{color:var(--game-orange);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.game-ad a>strong{font:800 clamp(15px,2.2vw,22px) Manrope,sans-serif;text-transform:uppercase}.game-ad a>small{color:var(--game-muted);font-weight:700}.game-ad img{width:100%;height:100%;display:block;object-fit:cover}

.video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.video-seat{position:relative;min-width:0;aspect-ratio:1.42/1;overflow:hidden;border-radius:8px;background:radial-gradient(circle at 50% 28%,#435b77,#0c223d 68%);color:#fff;box-shadow:0 10px 22px rgba(8,31,58,.15)}.seat-media{position:absolute;inset:0}.seat-media video{width:100%;height:100%;display:block;object-fit:cover}.video-seat.is-local .seat-media video{transform:scaleX(-1)}.seat-placeholder{position:absolute;inset:0 0 34px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.seat-placeholder:before{content:"";width:58px;height:58px;margin-bottom:10px;border:2px solid rgba(255,255,255,.8);border-radius:50%;background:rgba(255,255,255,.08)}.seat-placeholder span{font-size:11px;font-weight:900;text-transform:uppercase}.seat-placeholder strong{margin-top:5px;font:800 20px Manrope,sans-serif}.video-seat.has-video .seat-placeholder{display:none}.seat-name{position:absolute;left:8px;right:8px;bottom:7px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 8px;border-radius:5px;background:rgba(3,15,29,.78);font-size:11px}.seat-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-name span{color:#a6efc7;white-space:nowrap}.seat-name span:before{content:"●";margin-right:4px}.video-note{margin-top:13px;font-size:13px}

.signup-panel{display:grid;grid-template-columns:340px 1fr;gap:28px;align-items:center;padding:22px}.signup-panel h2{font-size:27px}.signup-form{display:grid;grid-template-columns:1fr 1fr 140px 132px;gap:10px;align-items:end}.signup-form label{display:grid;gap:5px}.signup-status{grid-column:2;margin:0!important;font-size:13px}

.play-grid{display:grid;grid-template-columns:238px minmax(0,1fr) 262px;gap:18px;align-items:start}.instructions,.timer-panel,.dice-station,.draw-panel{padding:20px}.instructions h2,.timer-panel h2,.dice-station h2,.draw-panel h2{font-size:14px;color:var(--game-orange);letter-spacing:.03em}.instructions ol{margin:20px 0;padding-left:21px;font-size:14px;line-height:1.5}.instructions li{margin-bottom:15px}.instructions li::marker{color:var(--game-orange);font-weight:900}.dice-key{border-top:1px solid var(--game-line);padding-top:14px}.dice-key h3{margin:0 0 10px;color:var(--game-orange);font:800 12px Manrope;text-transform:uppercase}.dice-key p{margin:7px 0;color:var(--game-muted);font-size:13px;font-weight:650}.dice-key b{display:inline-grid;place-items:center;width:24px;height:24px;margin-right:8px;border:1px solid var(--game-orange);border-radius:50%;color:var(--game-orange)}
.main-stage{display:grid;gap:16px}.status-line{display:flex;justify-content:space-between;gap:20px;color:var(--game-muted);font-weight:800}.status-line>span:first-child{color:var(--game-orange)}.topic-card{min-height:340px;display:flex;flex-direction:column;padding:38px 48px;border-radius:8px;background:radial-gradient(circle at 86% 40%,rgba(242,90,60,.2),transparent 23%),var(--game-navy);color:#fff;box-shadow:0 16px 35px rgba(16,43,76,.18)}.topic-card-top,.card-foot{display:flex;justify-content:space-between;gap:20px;color:#ffb4a5;font-size:12px;font-weight:900;text-transform:uppercase}.topic-card>p{margin:auto 0;font:800 clamp(27px,3.2vw,43px)/1.13 Manrope,sans-serif;text-align:center}.card-foot{align-items:center;color:#d6e0e9;text-transform:none}.broadcast-mark{color:var(--game-orange);font-size:28px}.action-row{display:grid;grid-template-columns:210px 1fr;gap:16px}.dice-station,.draw-panel{display:grid;gap:14px}.die{width:132px;height:132px;margin:auto;border:0;border-radius:7px;background:var(--game-navy);color:var(--game-orange);font:800 54px Manrope}.draw-panel p{margin:auto 0;font:800 clamp(28px,4vw,47px)/1 Manrope;color:var(--game-navy);text-transform:capitalize}.draw-panel .primary-game-button{min-height:52px}
.timer-panel{background:var(--game-navy);color:#fff}.timer-panel h2{color:#ffb4a5}.timer-display{display:grid;place-items:center;margin:18px 0 14px;min-height:104px;border:1px solid #48617d;border-radius:8px;background:#173657;font:800 clamp(48px,5vw,74px)/1 Manrope}.timer-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.round-stat{display:flex;justify-content:space-between;align-items:center;margin-top:28px;color:#c8d4df;font-weight:800}.round-stat strong{color:var(--game-orange);font:800 38px Manrope}

@media(max-width:1080px){.room-setup{grid-template-columns:1fr 1fr}.room-status-card{min-height:150px}.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.play-grid{grid-template-columns:200px minmax(0,1fr)}.timer-panel{grid-column:1/-1}.signup-panel{grid-template-columns:1fr}.signup-status{grid-column:auto}}
@media(max-width:760px){.game-page{padding:14px 12px 38px;background-size:30px 30px}.game-app-header{min-height:0;padding:18px;gap:14px}.game-app-header img{width:90px;height:65px}.game-app-header h1{font-size:clamp(28px,9vw,42px);letter-spacing:0}.game-app-header p{font-size:11px}.category-board{grid-template-columns:1fr 1fr}.category-card{min-height:74px}.category-card strong{white-space:normal}.category-icon{width:38px;height:38px;font-size:23px}.heart-icon{font-size:38px}.video-room{padding:16px}.video-room-header{align-items:flex-start;flex-direction:column}.room-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.room-actions .primary-game-button{grid-column:1/-1}.room-setup{grid-template-columns:1fr}.room-card{display:none}.room-form{grid-template-columns:1fr}.room-form>*{grid-column:1}.room-button-row .primary-game-button,.room-button-row .secondary-game-button{padding-inline:8px;font-size:13px;white-space:nowrap}.room-status-card{min-height:130px}.video-grid{grid-template-columns:1fr 1fr;gap:8px}.video-seat{aspect-ratio:1/1.05}.seat-placeholder:before{width:44px;height:44px}.seat-placeholder strong{font-size:15px}.seat-name{align-items:flex-start;flex-direction:column;gap:1px}.game-ad a{padding:4px 8px}.game-ad a>span,.game-ad a>small{display:none}.signup-form{grid-template-columns:1fr}.play-grid{grid-template-columns:1fr}.instructions{order:2}.main-stage{order:1}.timer-panel{order:3;grid-column:auto}.topic-card{min-height:300px;padding:28px 22px}.topic-card>p{font-size:28px}.action-row{grid-template-columns:1fr}.die{width:100px;height:100px}.footer-brand{width:100%}}
@media(max-width:420px){.category-board{grid-template-columns:1fr}.game-app-header img{width:72px}.video-grid{grid-template-columns:1fr 1fr}.seat-name b{max-width:100px}.status-line{align-items:flex-start;flex-direction:column;gap:5px}}
@media(prefers-reduced-motion:reduce){.category-card,.primary-game-button{transition:none}}
