body.games-page{
  background:
    radial-gradient(ellipse at 0% 12%,rgba(29,132,157,.17),transparent 40%),
    radial-gradient(ellipse at 100% 22%,rgba(153,38,112,.14),transparent 42%),
    linear-gradient(90deg,#071116,#080b0f 40%,#0c0910 75%,#130b12 100%)!important;
}
.games-page-shell{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding:34px 0 70px;
}
.games-page-hero{
  padding:32px 34px;
  border:1px solid rgba(96,231,255,.28);
  border-radius:22px;
  background:
    radial-gradient(circle at 85% 20%,rgba(255,70,183,.10),transparent 28%),
    linear-gradient(145deg,#101822,#080b11);
  box-shadow:0 20px 44px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);
}
.games-page-hero p{margin:0;color:#69eaff!important;font-size:15px!important;font-weight:950;letter-spacing:.12em}
.games-page-hero h1{
  margin:8px 0 5px;
  color:#f4d27f;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(2.8rem,6vw,5.2rem);
  line-height:.95;
}
.games-page-hero strong{display:block;color:#ff73c8;font-size:16px;letter-spacing:.07em}
.games-page-hero span{display:block;margin-top:10px;color:#d7dce3;font-size:17px;line-height:1.5}

.games-polls-panel{
  width:100%;
  min-height:620px!important;
  margin:22px 0 0;
  display:grid!important;
  grid-template-rows:auto auto minmax(0,1fr) auto;
}
.games-polls-panel .polling-public-head h2{font-size:clamp(2rem,4vw,3rem)!important}
.games-polls-panel .poll-kicker{font-size:13px!important}
.games-polls-panel .polling-public-head>b{font-size:12px!important}
.games-polls-panel .public-polls-list{
  overflow:visible!important;
  padding:18px!important;
}
.games-polls-panel .public-poll-card h3{font-size:22px!important}
.games-polls-panel .public-poll-card>p,
.games-polls-panel .poll-option span,
.games-polls-panel .poll-result span,
.games-polls-panel .poll-result strong{font-size:15px!important}
.games-polls-panel .poll-result small,
.games-polls-panel .poll-locked,
.games-polls-panel .poll-message,
.games-polls-panel .poll-other-responses>strong{font-size:13px!important}

.games-future-zone{
  margin-top:22px;
  padding:24px;
  border:1px solid rgba(232,197,110,.20);
  border-radius:22px;
  background:linear-gradient(145deg,#101319,#090b10);
}
.games-future-head span{color:#caff59;font-size:13px;font-weight:950;letter-spacing:.11em}
.games-future-head h2{margin:5px 0 5px;font-size:2rem}
.games-future-head p{margin:0;color:#c7cdd5;font-size:16px}
.games-future-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.games-future-grid article{
  min-height:150px;padding:18px;border:1px dashed rgba(102,231,255,.28);border-radius:16px;
  display:flex;flex-direction:column;justify-content:flex-end;
  background:radial-gradient(circle at 50% 12%,rgba(80,226,248,.08),transparent 30%),#0a0e14;
}
.games-future-grid b{color:#69eaff;font-size:12px;letter-spacing:.09em}
.games-future-grid strong{margin-top:8px;color:#f4d78b;font-size:16px}
.games-future-grid span{margin-top:5px;color:#aeb6c0;font-size:14px}
@media(max-width:760px){
  .games-page-shell{width:calc(100% - 28px);padding-top:18px}
  .games-page-hero{padding:24px 20px}
  .games-future-grid{grid-template-columns:1fr}
}


/* 2026-09-22 wired public game room. */
.game-room-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:22px;
}
.public-game-card{
  min-height:560px;
  overflow:hidden;
  border:1px solid rgba(91,228,255,.30);
  border-radius:22px;
  background:
    radial-gradient(circle at 85% 5%,rgba(64,220,246,.08),transparent 28%),
    linear-gradient(145deg,#101722,#080b11 56%,#0b0910);
  box-shadow:0 20px 44px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05);
}
.public-game-vote{
  border-color:rgba(255,83,188,.28);
  background:
    radial-gradient(circle at 88% 5%,rgba(255,77,187,.09),transparent 28%),
    linear-gradient(145deg,#15111b,#090b11 56%,#0c0910);
}
.public-game-card-head{
  min-height:88px;
  padding:17px 19px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(26,34,45,.96),rgba(10,13,18,.96));
}
.public-game-card-head span{
  display:block;
  color:#68eaff;
  font-size:13px;
  font-weight:950;
  letter-spacing:.10em;
}
.public-game-vote .public-game-card-head span{color:#ff7acb}
.public-game-card-head h2{
  margin:4px 0 0;
  color:#f4d47f;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(2rem,3.4vw,3rem);
  line-height:.96;
}
.public-game-card-head>b{
  padding:7px 10px;
  border:1px solid rgba(239,205,126,.38);
  border-radius:999px;
  color:#f4d47f;
  background:#12100b;
  font-size:11px;
  letter-spacing:.08em;
}
.public-game-stage{
  min-height:470px;
  padding:18px;
  display:flex;
  flex-direction:column;
}
.public-game-loading,
.public-game-empty{
  min-height:350px;
  display:grid;
  place-items:center;
  padding:24px;
  text-align:center;
  color:#aeb7c1;
  font-size:16px;
}
.public-game-progress{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:13px;
  color:#aab3be;
  font-size:13px;
  font-weight:850;
}
.public-game-progress strong{color:#70eaff}
.public-game-vote .public-game-progress strong{color:#ff83cf}
.public-game-question{
  display:flex;
  flex-direction:column;
  flex:1;
}
.public-game-question h3{
  margin:0;
  color:#f2f4f7;
  font-size:24px;
  line-height:1.22;
}
.public-game-scenario{
  margin:10px 0 0;
  color:#cbd1d8;
  font-size:16px;
  line-height:1.5;
}
.public-game-image{
  width:100%;
  max-height:230px;
  margin-top:14px;
  object-fit:contain;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:#05070a;
}
.public-game-options{
  display:grid;
  gap:10px;
  margin-top:18px;
}
.public-game-option{
  min-height:54px;
  display:grid;
  grid-template-columns:38px 1fr;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border:1px solid #34404d;
  border-radius:12px;
  background:linear-gradient(145deg,#141c26,#0b1017);
  color:#e8edf2;
  text-align:left;
  cursor:pointer;
}
.public-game-option:hover:not(:disabled){
  border-color:#66e9ff;
  transform:translateY(-1px);
}
.public-game-option b{
  width:34px;height:34px;
  display:grid;place-items:center;
  border:1px solid rgba(103,232,255,.42);
  border-radius:9px;
  color:#78ebff;
  background:#0d171d;
  font-size:15px;
}
.public-game-option span{
  font-size:15px;
  font-weight:800;
  line-height:1.3;
}
.public-game-option:disabled{cursor:default;opacity:.88}
.public-game-option.selected{
  border-color:#f3cf6f;
  box-shadow:0 0 0 1px rgba(243,207,111,.14);
}
.public-game-option.correct{
  border-color:#9ee65a;
  background:linear-gradient(145deg,#172217,#0d140d);
}
.public-game-option.wrong{
  border-color:#e76378;
  background:linear-gradient(145deg,#251519,#120c0e);
}
.whos-wrong-options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:auto;
  padding-top:20px;
}
.whos-wrong-options .public-game-option{
  min-height:82px;
  display:flex;
  justify-content:center;
  text-align:center;
  font-size:16px;
  font-weight:950;
}
.public-game-result{
  margin-top:14px;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:#0b1016;
}
.public-game-result strong{
  display:block;
  color:#f4d47f;
  font-size:15px;
}
.public-game-result span{
  display:block;
  margin-top:4px;
  color:#bfc7d0;
  font-size:14px;
  line-height:1.4;
}
.public-game-vote-bars{
  display:grid;
  gap:10px;
  margin-top:14px;
}
.public-game-vote-row{
  display:grid;
  gap:5px;
}
.public-game-vote-row>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:#d7dde4;
  font-size:14px;
}
.public-game-vote-row>div strong{color:#f4d47f}
.public-game-vote-track{
  height:9px;
  overflow:hidden;
  border-radius:999px;
  background:#1a2028;
}
.public-game-vote-track i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#53dcf2,#ff58bb);
}
.public-game-next{
  min-height:44px;
  margin-top:16px;
  padding:0 16px;
  border:1px solid rgba(239,204,111,.48);
  border-radius:10px;
  background:linear-gradient(180deg,#2b2615,#151109);
  color:#ffe392;
  font-size:13px;
  font-weight:950;
  cursor:pointer;
}
.public-game-message{
  min-height:20px;
  margin-top:8px;
  color:#ff9da9;
  font-size:13px;
}
.games-room-divider{
  margin:26px 0 0;
  padding:0 4px 10px;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.games-room-divider span{
  color:#65e8ff;
  font-size:12px;
  font-weight:950;
  letter-spacing:.10em;
}
.games-room-divider b{
  color:#f4d47f;
  font-family:Georgia,'Times New Roman',serif;
  font-size:20px;
}
.games-polls-panel{margin-top:14px}
@media(max-width:860px){
  .game-room-grid{grid-template-columns:1fr}
  .public-game-card{min-height:0}
  .public-game-stage{min-height:430px}
}
@media(max-width:560px){
  .whos-wrong-options{grid-template-columns:1fr}
  .games-room-divider{align-items:flex-start;flex-direction:column;gap:4px}
}

/* Stereogram Room entrance inside the Game Room. */
.stereogram-room-promo{
  display:grid;
  grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);
  min-height:250px;
  margin-top:20px;
  overflow:hidden;
  border:1px solid rgba(202,255,89,.28);
  border-radius:22px;
  background:
    radial-gradient(circle at 18% 24%,rgba(202,255,89,.08),transparent 30%),
    linear-gradient(145deg,#0b120d,#090b10 58%,#110a12);
  box-shadow:0 20px 44px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.05);
}
.stereogram-promo-visual{
  position:relative;
  min-height:250px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:
    repeating-radial-gradient(circle at 23% 41%,rgba(102,231,255,.15) 0 2px,transparent 3px 11px),
    repeating-radial-gradient(circle at 77% 61%,rgba(255,76,187,.12) 0 2px,transparent 3px 10px),
    linear-gradient(135deg,#071419,#0c0b13);
}
.stereogram-promo-visual::before{
  content:"";
  position:absolute;
  width:150px;height:82px;
  border:3px solid rgba(202,255,89,.65);
  border-radius:50%;
  box-shadow:0 0 28px rgba(202,255,89,.12),inset 0 0 28px rgba(202,255,89,.06);
}
.stereogram-promo-visual::after{
  content:"";
  position:absolute;
  width:44px;height:44px;
  border:2px solid rgba(202,255,89,.75);
  border-radius:50%;
  background:#08100b;
  box-shadow:0 0 20px rgba(202,255,89,.18);
}
.stereogram-promo-visual i{
  position:absolute;width:10px;height:10px;border-radius:50%;
  background:#69eaff;box-shadow:0 0 12px rgba(105,234,255,.42);
}
.stereogram-promo-visual i:nth-child(1){left:14%;top:22%}
.stereogram-promo-visual i:nth-child(2){left:28%;top:72%}
.stereogram-promo-visual i:nth-child(3){left:48%;top:18%}
.stereogram-promo-visual i:nth-child(4){left:69%;top:74%}
.stereogram-promo-visual i:nth-child(5){left:84%;top:28%}
.stereogram-promo-visual i:nth-child(6){left:78%;top:48%;background:#ff67c4}
.stereogram-promo-visual strong{
  position:absolute;z-index:3;bottom:20px;
  color:#d5ff78;font-size:15px;letter-spacing:.10em;
}
.stereogram-promo-copy{
  padding:28px 30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.stereogram-promo-copy>span{
  color:#caff59;font-size:13px;font-weight:950;letter-spacing:.10em;
}
.stereogram-promo-copy h2{
  margin:6px 0 8px;
  color:#f4d47f;
  font-family:Georgia,'Times New Roman',serif;
  font-size:clamp(2.1rem,4vw,3.4rem);
}
.stereogram-promo-copy p{
  margin:0;color:#d0d6de;font-size:16px;line-height:1.5;
}
.stereogram-promo-copy a{
  min-height:46px;margin-top:18px;padding:0 10px 0 14px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  border:1px solid rgba(202,255,89,.40);border-radius:10px;
  background:linear-gradient(90deg,rgba(112,153,37,.15),rgba(255,73,184,.10));
  color:#fff;font-size:14px;font-weight:950;letter-spacing:.055em;
}
.stereogram-promo-copy a b{
  width:30px;height:30px;display:grid;place-items:center;
  border:1px solid rgba(239,204,111,.50);border-radius:50%;color:#ffe89b;
}
@media(max-width:760px){
  .stereogram-room-promo{grid-template-columns:1fr}
  .stereogram-promo-visual{min-height:210px}
  .stereogram-promo-copy{padding:22px 20px}
  .stereogram-promo-copy p{font-size:15px}
}
