:root{--gold:#d8b74a;--felt:#0b3d32;--dark:#080b10;--red:#d94b55}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle,#202737,#05070b 75%);color:#fff;font-family:system-ui,sans-serif;min-height:100vh}.screen{display:none;min-height:100vh;padding:16px}.screen.active{display:block}.logo{text-align:center;font-size:clamp(2rem,8vw,5rem);letter-spacing:.1em;color:var(--gold);padding:7vh 0 3vh}.logo b{color:#fff}.panel{max-width:560px;margin:auto;background:#101722dd;border:1px solid #ffffff22;border-radius:18px;padding:18px;display:grid;gap:12px}input,button,select{font:inherit;padding:12px;border-radius:10px;border:1px solid #ffffff2b}input,select{background:#090d14;color:#fff}button{background:linear-gradient(#e5c760,#9a7517);color:#111;font-weight:900;cursor:pointer}button:disabled{opacity:.55;cursor:default}.blue{background:linear-gradient(#74c5ff,#2975b8)}.red{background:linear-gradient(#ff7882,#a5212c);color:#fff}.or{text-align:center;opacity:.6}.settingRow,.checkRow{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#090d14;padding:10px 12px;border-radius:10px}.checkRow{justify-content:flex-start}.checkRow input{width:auto}.avatars{display:grid;grid-template-columns:repeat(9,1fr);gap:6px}.avatars img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;border:3px solid transparent}.avatars img.sel{border-color:var(--gold);transform:scale(1.06)}header{display:flex;justify-content:space-between;max-width:900px;margin:auto;padding:12px}.lobbyPlayers{max-width:900px;margin:20px auto;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.lobbyCard{display:flex;align-items:center;gap:12px;padding:12px;background:#111a;border:1px solid #fff2;border-radius:14px}.lobbyCard img{width:64px;height:64px;border-radius:50%}.row{grid-template-columns:repeat(3,1fr)}.lobbyActions{grid-template-columns:repeat(3,1fr)}.lobbyActions .leaveBtn{grid-column:1/-1;background:linear-gradient(#ff7d86,#8e1821);color:#fff;border-color:#ff9ca3}.lobbyTimer{text-align:center;font-weight:800;opacity:.85}.lobbyTimer.warning{color:#ff7d86;opacity:1}.subInfo{text-align:center;opacity:.75}.table{position:relative;width:min(96vw,1100px);height:min(78vh,760px);margin:auto;border:12px solid #17120d;border-radius:38%;background:radial-gradient(circle,#176d57,#0b3d32 68%,#06271f);box-shadow:inset 0 0 60px #000b,0 20px 60px #000}.seat{position:absolute;width:32%;min-height:120px;text-align:center}.top{top:2%;left:34%}.bottom{bottom:1%;left:34%}.left{left:1%;top:35%}.right{right:1%;top:35%}.playerHead{display:flex;justify-content:center;align-items:center;gap:8px}.playerHead img{width:46px;height:46px;border-radius:50%;border:2px solid var(--gold)}.miniCards{display:flex;justify-content:center;gap:3px;margin-top:6px;transition:.3s}.miniCards.moving{transform:translateY(-5px);opacity:.55}.miniCard,.card{position:relative;background:#f8f4e9;color:#111;border:2px solid #ccc;border-radius:7px;box-shadow:0 3px 7px #0007;font-weight:900;overflow:hidden}.miniCard{width:38px;height:54px}.card{width:78px;height:112px;transition:.25s;cursor:pointer}.card.sel{transform:translateY(-16px);border-color:#ffdd54}.rank{position:absolute;left:7px;top:4px;font-size:1.55rem;line-height:1}.suit{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);font-size:2.35rem;line-height:1}.miniCard .rank{left:3px;top:3px;font-size:.9rem}.miniCard .suit{font-size:1.35rem}.redSuit{color:#d32636}.joker{background:linear-gradient(145deg,#fff7d9,#ead6ff);color:#6f238a;border-color:#9d68af}.jokerWord{position:absolute;left:50%;top:19%;transform:translateX(-50%);font-size:1.05rem;letter-spacing:.04em}.jokerIcon{position:absolute;left:50%;top:57%;transform:translate(-50%,-50%);font-size:2.8rem}.miniCard .jokerWord{font-size:.48rem;top:14%}.miniCard .jokerIcon{font-size:1.35rem;top:58%}.center{position:absolute;left:36%;top:35%;width:28%;min-height:170px;background:#07110ed9;border:2px solid var(--gold);border-radius:18px;padding:10px;text-align:center}.scoreLine{display:flex;justify-content:space-between;font-size:.84rem;padding:2px}.status{font-weight:900;color:#ffe16b}.status-safe{color:#76ff9c}.status-gutter{color:#ff7780}.myHand{display:flex;justify-content:center;gap:7px;margin-top:8px}.buttons{display:flex;justify-content:center;gap:10px;margin:8px}.resultBox{max-width:760px;margin:5vh auto;background:#0b111add;border:2px solid var(--gold);border-radius:24px;padding:28px;text-align:center}.ranking{display:grid;gap:10px}.rankRow{display:flex;align-items:center;gap:12px;background:#fff1;padding:10px;border-radius:12px}.rankRow img{width:62px;height:62px;border-radius:50%}.rankRow .miniCards{margin-left:auto}.finalRank{min-height:84px}.resultTimer{margin:12px auto 18px;padding:10px;background:#0005;border-radius:12px;max-width:430px}.seatFlash{position:absolute;left:50%;top:-24px;transform:translateX(-50%);padding:4px 10px;border-radius:999px;background:#111e;border:1px solid #fff4;font-size:.78rem;font-weight:900;white-space:nowrap;z-index:5}.seatFlash.safe{color:#76ff9c}.seatFlash.exchange{color:#8ed4ff}.activity{position:fixed;left:50%;top:12px;transform:translate(-50%,-10px);opacity:0;pointer-events:none;background:#111e;border:1px solid #fff3;border-radius:999px;padding:7px 15px;z-index:9;font-weight:800;transition:.2s}.activity.show{opacity:1;transform:translate(-50%,0)}.ownNotice{height:0;overflow:visible;text-align:center;font-weight:1000;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}.ownNotice.show{opacity:1;transform:translateY(0)}.ownNotice.safe{color:#76ff9c}.ownNotice.gutter{color:#ff7780}#toast{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:20;background:#000e;padding:8px 14px;border-radius:20px;display:none}@media(max-width:720px){.screen{padding:4px}.table{width:100vw;height:72vh;border-width:7px;border-radius:24%}.seat{width:38%;font-size:.72rem}.top{left:31%}.bottom{left:31%}.left{left:0;top:34%}.right{right:0;top:34%}.center{left:34%;width:32%;top:34%;font-size:.72rem}.miniCard{width:27px;height:39px}.miniCard .rank{font-size:.72rem}.miniCard .suit{font-size:1rem}.playerHead img{width:32px;height:32px}.card{width:62px;height:92px}.card .rank{font-size:1.25rem}.card .suit{font-size:2rem}.card .jokerWord{font-size:.85rem}.card .jokerIcon{font-size:2.2rem}.lobbyPlayers{grid-template-columns:1fr}.row{grid-template-columns:1fr}.avatars{grid-template-columns:repeat(5,1fr)}.rankRow .miniCards{display:none}}

.globalExit{position:fixed;right:12px;top:12px;z-index:30;background:linear-gradient(#ff737d,#8e1821);color:#fff;border:1px solid #ff9ca3;padding:8px 12px;border-radius:10px;font-weight:900;box-shadow:0 3px 12px #0008}.globalExit:hover{filter:brightness(1.08)}@media(max-width:720px){.globalExit{right:6px;top:6px;padding:7px 9px;font-size:.78rem}}

/* ==========================================================
   FINAL TABLE UI — reference layout
   1360pxを基準にし、それ以上は卓を横へ伸ばさない。
   小さい画面では全体を縮小して配置関係を維持する。
   ========================================================== */
:root{--game-stage-max:1360px}

#game.screen.active{
  overflow-x:hidden;
  padding:12px 12px 132px;
}
#game .table{
  width:min(calc(100vw - 24px),var(--game-stage-max)) !important;
  height:min(72vw,760px) !important;
  max-height:760px !important;
  min-height:620px;
  margin:12px auto 0 !important;
  border-radius:34% !important;
}

/* 中央：局・時間・全員の得点だけ */
#game .center{
  left:38% !important;
  top:39% !important;
  width:24% !important;
  min-height:220px !important;
  z-index:4;
  padding:18px 22px !important;
}
#game .center h2{font-size:2rem;margin:0 0 22px}
#game .center #timer{font-size:1.25rem;margin-bottom:14px}
#game .center .scoreLine{font-size:.96rem;padding:4px 2px}

/* 相手席 */
#game .seat{z-index:5}
#game .seat.top{top:3% !important;left:34% !important;width:32% !important}
#game .seat.left{left:2.5% !important;top:38% !important;width:30% !important}
#game .seat.right{right:2.5% !important;top:38% !important;width:30% !important}
#game .seat:not(.bottom) .playerHead b{font-size:1.05rem}
#game .seat:not(.bottom) .playerHead img{width:50px;height:50px}

/* 自分席：中央枠の下、手札の左に独立表示 */
#game .seat.bottom{
  left:11% !important;
  bottom:1.5% !important;
  width:27% !important;
  min-height:110px !important;
  transform:none !important;
  text-align:left !important;
  background:#07110ed9;
  border:2px solid #45c978;
  border-radius:18px;
  padding:12px 14px;
  z-index:7;
}
#game .seat.bottom .playerHead{
  display:flex !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:12px !important;
}
#game .seat.bottom .playerHead img{
  width:78px !important;height:78px !important;
  flex:0 0 78px;
}
#game .seat.bottom .playerHead > div{text-align:left !important}
#game .seat.bottom .playerHead b{font-size:1.28rem !important}
#game .seat.bottom .playerHead .status{font-size:1rem !important}
#game .seat.bottom > small{
  display:block !important;
  margin-left:90px !important;
  margin-top:-22px !important;
  font-size:.9rem !important;
  font-weight:800;
}
#game .seat.bottom .miniCards{display:none !important}

/* 自分手札：自分UIの右側。同じ下段に並べる */
#game #controls{
  position:absolute !important;
  left:50% !important;
  transform:translateX(-5%) !important;
  bottom:116px !important;
  width:min(720px,52vw) !important;
  z-index:9 !important;
  margin:0 !important;
  pointer-events:none;
}
#game #controls .myHand,
#game #controls .buttons{pointer-events:auto}
#game .myHand{
  justify-content:flex-start !important;
  gap:9px !important;
  margin:0 !important;
}
#game .myHand .card{
  width:88px !important;
  height:128px !important;
}
#game .buttons{
  position:fixed;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  margin:0 !important;
  z-index:35;
}
#game .buttons button{min-width:145px}

/* 左上 行動履歴 */
#game .actionHistory{
  position:fixed;
  left:max(18px,calc((100vw - var(--game-stage-max))/2 + 18px));
  top:18px;
  width:305px;
  z-index:25;
  background:#07110ef2;
  border:1px solid #ffffff3b;
  border-radius:16px;
  padding:14px 16px;
  pointer-events:none;
}
#game .actionHistory>b{
  display:block;color:var(--gold);font-size:1.2rem;margin-bottom:7px
}
#game #actionHistoryLines{display:grid;gap:4px}
#game #actionHistoryLines span{font-size:.86rem;opacity:.7}
#game #actionHistoryLines span.latest{opacity:1;color:#7dffa0}

/* 試合終了は右下固定 */
.globalExit{
  top:auto !important;
  right:14px !important;
  bottom:14px !important;
  z-index:40 !important;
}

/* 1360pxより狭い時だけ段階的に縮小。広い画面では1360pxで固定。 */
@media(max-width:1180px){
  #game .table{min-height:560px;height:68vw !important}
  #game .miniCard{width:32px;height:46px}
  #game .seat.bottom .playerHead img{width:60px !important;height:60px !important;flex-basis:60px}
  #game .seat.bottom .playerHead b{font-size:1rem !important}
  #game .seat.bottom > small{margin-left:72px !important;font-size:.72rem !important}
  #game #controls{bottom:108px !important}
  #game .myHand .card{width:72px !important;height:105px !important}
  #game .center{min-height:190px !important}
  #game .actionHistory{width:250px}
}
@media(max-width:820px){
  #game.screen.active{padding:4px 4px 112px}
  #game .table{
    width:100% !important;
    height:72vh !important;
    min-height:500px !important;
    border-radius:24% !important;
  }
  #game .center{left:35% !important;width:30% !important;top:36% !important;padding:8px !important}
  #game .center h2{font-size:1.25rem;margin-bottom:10px}
  #game .center #timer{font-size:.9rem}
  #game .center .scoreLine{font-size:.64rem;padding:2px}
  #game .seat.top{left:31% !important;width:38% !important}
  #game .seat.left,#game .seat.right{width:34% !important}
  #game .seat.bottom{
    left:5% !important;
    width:34% !important;
    min-height:80px !important;
    bottom:2% !important;
    padding:6px !important;
  }
  #game .seat.bottom .playerHead img{width:44px !important;height:44px !important;flex-basis:44px}
  #game .seat.bottom .playerHead b{font-size:.78rem !important}
  #game .seat.bottom .playerHead span,#game .seat.bottom .playerHead .status{font-size:.65rem !important}
  #game .seat.bottom > small{margin-left:52px !important;margin-top:-12px !important;font-size:.58rem !important}
  #game #controls{left:40% !important;transform:none !important;width:58% !important;bottom:100px !important}
  #game .myHand{gap:3px !important}
  #game .myHand .card{width:52px !important;height:78px !important}
  #game .actionHistory{left:5px;top:5px;width:180px;padding:7px 8px}
  #game .actionHistory>b{font-size:.82rem}
  #game #actionHistoryLines span{font-size:.62rem}
  #game .buttons button{min-width:0;padding:8px;font-size:.72rem}
}

/* ============================================================
   FIXED-STAGE GAME UI
   1200x800を基準に全体を比例拡大・縮小。
   要素ごとのレスポンシブ移動をやめ、相互干渉を防止。
   ============================================================ */
#game.screen.active{
  display:flex !important;
  align-items:center;
  justify-content:center;
  min-height:100vh;
  padding:0 !important;
  overflow:hidden;
}
.gameViewport{
  position:relative;
  flex:0 0 auto;
  overflow:visible;
}
.gameStage{
  position:absolute;
  left:0;top:0;
  width:1200px;
  height:800px;
  transform-origin:top left;
  overflow:hidden;
  background:radial-gradient(circle,#202737,#05070b 75%);
}

/* 卓本体 */
#game .table{
  position:absolute !important;
  left:18px !important;
  top:20px !important;
  width:1164px !important;
  height:704px !important;
  margin:0 !important;
  border:12px solid #17120d !important;
  border-radius:34% !important;
  background:radial-gradient(circle,#176d57,#0b3d32 68%,#06271f) !important;
  box-shadow:inset 0 0 60px #000b,0 20px 60px #000 !important;
}

/* 座席の共通固定サイズ */
#game .seat{
  position:absolute !important;
  width:330px !important;
  min-height:120px !important;
  text-align:center !important;
  z-index:5 !important;
}

/* CPU2 上 */
#game .seat.top{
  left:417px !important;
  top:28px !important;
}
/* CPU1 左 */
#game .seat.left{
  left:45px !important;
  top:270px !important;
}
/* CPU3 右 */
#game .seat.right{
  right:45px !important;
  top:270px !important;
}

/* 中央パネル */
#game .center{
  position:absolute !important;
  left:422px !important;
  top:286px !important;
  width:320px !important;
  min-height:278px !important;
  padding:16px 18px !important;
  background:#07110ed9 !important;
  border:2px solid var(--gold) !important;
  border-radius:18px !important;
  text-align:center !important;
  z-index:4 !important;
  overflow:hidden !important;
}
#game .center h2{
  margin:0 0 20px !important;
  font-size:2rem !important;
}
#game .center #timer{
  margin-bottom:14px !important;
  font-size:1.22rem !important;
}
#game .center .scoreLine{
  font-size:.92rem !important;
  line-height:1.25 !important;
  padding:4px 0 !important;
}

/* 相手プレイヤー */
#game .seat:not(.bottom) .playerHead{
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:9px !important;
}
#game .seat:not(.bottom) .playerHead img{
  width:56px !important;
  height:56px !important;
}
#game .seat:not(.bottom) .playerHead b{
  font-size:1.08rem !important;
}
#game .seat:not(.bottom) > small{
  display:block !important;
  margin-top:7px !important;
  font-size:.85rem !important;
}

/* 自分UI：左下固定。完全な縦積みで文字干渉なし */
#game .seat.bottom{
  left:62px !important;
  bottom:30px !important;
  width:350px !important;
  min-height:118px !important;
  padding:11px 14px !important;
  transform:none !important;
  text-align:left !important;
  background:#07110ed9 !important;
  border:2px solid #45d986 !important;
  border-radius:22px !important;
  z-index:7 !important;
}
#game .seat.bottom .playerHead{
  display:flex !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
  gap:12px !important;
}
#game .seat.bottom .playerHead img{
  width:72px !important;
  height:72px !important;
  flex:0 0 72px !important;
}
#game .seat.bottom .playerHead > div{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  gap:2px !important;
  min-width:0 !important;
}
#game .seat.bottom .playerHead br{
  display:none !important;
}
#game .seat.bottom .playerHead b{
  display:block !important;
  font-size:1.15rem !important;
  line-height:1.2 !important;
  margin:0 !important;
}
#game .seat.bottom .playerHead span{
  display:block !important;
  font-size:.88rem !important;
  line-height:1.25 !important;
  margin:0 !important;
}
#game .seat.bottom .playerHead .status{
  display:block !important;
  font-size:.9rem !important;
  line-height:1.25 !important;
  margin:1px 0 0 !important;
}
#game .seat.bottom > small{
  position:static !important;
  display:block !important;
  margin:4px 0 0 84px !important;
  font-size:.82rem !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}
#game .seat.bottom .miniCards{
  display:none !important;
}

/* 自分の手札：中央パネルの完全な下・自分UIの右側 */
#game #controls{
  position:absolute !important;
  left:470px !important;
  top:580px !important;
  width:510px !important;
  margin:0 !important;
  z-index:8 !important;
}
#game .myHand{
  display:flex !important;
  justify-content:flex-start !important;
  gap:8px !important;
  margin:0 !important;
}
#game .myHand .card{
  width:88px !important;
  height:126px !important;
}
#game .buttons{
  position:absolute !important;
  left:-60px !important;
  top:152px !important;
  display:flex !important;
  justify-content:center !important;
  gap:14px !important;
  width:600px !important;
  margin:0 !important;
}
#game .buttons button{
  min-width:120px !important;
  padding:12px 16px !important;
}

/* 行動履歴：左上固定 */
#game .actionHistory{
  position:absolute !important;
  left:14px !important;
  top:10px !important;
  width:280px !important;
  min-height:80px !important;
  z-index:20 !important;
  background:#07110ef2 !important;
  border:1px solid #ffffff3b !important;
  border-radius:18px !important;
  padding:12px 14px !important;
  pointer-events:none !important;
}
#game .actionHistory > b{
  display:block !important;
  color:var(--gold) !important;
  font-size:1.15rem !important;
  margin-bottom:6px !important;
}
#game #actionHistoryLines{
  display:grid !important;
  gap:3px !important;
}
#game #actionHistoryLines span{
  display:block !important;
  font-size:.8rem !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  opacity:.68 !important;
}
#game #actionHistoryLines span.latest{
  color:#76ff9c !important;
  opacity:1 !important;
}

/* 自分への小通知はカードに重ならない */
#game .ownNotice{
  position:absolute !important;
  left:0 !important;
  top:-28px !important;
  width:100% !important;
  height:auto !important;
  text-align:center !important;
}

/* 終了ボタンもゲーム座標内の右下 */
#game .stageExit{
  display:block !important;
  position:absolute !important;
  right:22px !important;
  bottom:18px !important;
  top:auto !important;
  z-index:30 !important;
  padding:12px 18px !important;
}
#globalExit{display:none !important}

/* 旧レスポンシブ指定をゲーム画面では無効化。
   縮小は gameStage 全体の transform のみで行う。 */
@media(max-width:720px){
  #game .table,
  #game .seat,
  #game .center,
  #game #controls,
  #game .actionHistory,
  #game .stageExit{
    font-size:inherit;
  }
}

/* ============================================================
   POLISHED FINAL UI — matches reference image
   ============================================================ */

/* Stage */
.gameStage{
  background:#070a0f !important;
}

/* Table slightly larger and centered */
#game .table{
  left:14px !important;
  top:18px !important;
  width:1172px !important;
  height:708px !important;
  border-radius:33% !important;
}

/* Action history */
#game .actionHistory{
  left:16px !important;
  top:16px !important;
  width:260px !important;
  min-height:90px !important;
  padding:14px 16px !important;
}
#game .actionHistory > b{
  font-size:1.2rem !important;
}

/* Opponents: ~120% larger than previous */
#game .seat:not(.bottom){
  width:360px !important;
}
#game .seat:not(.bottom) .playerHead{
  gap:11px !important;
}
#game .seat:not(.bottom) .playerHead img{
  width:68px !important;
  height:68px !important;
}
#game .seat:not(.bottom) .playerHead b{
  font-size:1.28rem !important;
}
#game .seat:not(.bottom) .playerHead span{
  font-size:1rem !important;
}
#game .seat:not(.bottom) .playerHead .status{
  font-size:1rem !important;
}
#game .seat:not(.bottom) > small{
  font-size:.94rem !important;
  margin-top:9px !important;
}
#game .seat:not(.bottom) .miniCard{
  width:46px !important;
  height:66px !important;
}
#game .seat:not(.bottom) .miniCard .rank{
  font-size:1.02rem !important;
}
#game .seat:not(.bottom) .miniCard .suit{
  font-size:1.5rem !important;
}

/* Opponent fixed locations */
#game .seat.top{
  left:420px !important;
  top:22px !important;
}
#game .seat.left{
  left:36px !important;
  top:290px !important;
}
#game .seat.right{
  right:36px !important;
  top:290px !important;
}

/* Center raised a bit */
#game .center{
  left:434px !important;
  top:260px !important;
  width:300px !important;
  min-height:280px !important;
  padding:18px 20px !important;
}
#game .center h2{
  font-size:2.15rem !important;
  margin-bottom:22px !important;
}
#game .center #timer{
  font-size:1.28rem !important;
  margin-bottom:18px !important;
}
#game .center .scoreLine{
  font-size:.97rem !important;
  padding:5px 2px !important;
}

/* Player UI lower-left */
#game .seat.bottom{
  left:52px !important;
  bottom:24px !important;
  width:360px !important;
  min-height:132px !important;
  padding:13px 16px !important;
}
#game .seat.bottom .playerHead img{
  width:82px !important;
  height:82px !important;
  flex-basis:82px !important;
}
#game .seat.bottom .playerHead b{
  font-size:1.28rem !important;
}
#game .seat.bottom .playerHead span{
  font-size:.96rem !important;
}
#game .seat.bottom .playerHead .status{
  font-size:1rem !important;
}
#game .seat.bottom > small{
  margin:7px 0 0 94px !important;
  font-size:.9rem !important;
}

/* Player hand moved a touch right/down */
#game #controls{
  left:405px !important;
  top:565px !important;
  width:650px !important;
}
#game .myHand{
  gap:10px !important;
}
#game .myHand .card{
  width:108px !important;
  height:154px !important;
}
#game .myHand .card .rank{
  font-size:1.85rem !important;
}
#game .myHand .card .suit{
  font-size:3rem !important;
}
#game .myHand .card .jokerWord{
  font-size:1.15rem !important;
}
#game .myHand .card .jokerIcon{
  font-size:3.2rem !important;
}

/* Buttons: larger vertically and horizontally */
#game .buttons{
  left:10px !important;
  top:176px !important;
  width:560px !important;
  gap:18px !important;
}
#game .buttons button{
  min-width:210px !important;
  min-height:78px !important;
  padding:18px 22px !important;
  border-radius:14px !important;
  font-size:1.35rem !important;
  line-height:1.15 !important;
}
#game #drawBtn::after{
  content:"\A(最大5枚)";
  white-space:pre;
  font-size:.75rem;
  font-weight:700;
}
#game #safeBtn::after{
  content:"\A(局を終了)";
  white-space:pre;
  font-size:.75rem;
  font-weight:700;
}

/* Exit button */
#game .stageExit{
  right:20px !important;
  bottom:18px !important;
  min-width:150px !important;
  min-height:58px !important;
  font-size:1.05rem !important;
}

/* Small helper text */
#game::after{
  content:"ⓘ 交換したいカードをクリックして選択してください";
  position:absolute;
  left:20px;
  bottom:14px;
  color:#d9d9d9;
  font-size:.82rem;
  z-index:18;
  pointer-events:none;
}

/* Keep whole-stage scaling only */
@media(max-width:720px){
  #game .seat:not(.bottom) .miniCard,
  #game .myHand .card,
  #game .seat:not(.bottom) .playerHead img,
  #game .seat.bottom .playerHead img{
    transform:none !important;
  }
}


/* ============================================================
   FINAL ADJUSTMENT
   ・交換カード案内を非表示
   ・交換/SAFEボタン下の補足文字を非表示
   ・中央パネルを15px上へ
   ============================================================ */
#game::after{
  display:none !important;
}

#game #drawBtn::after,
#game #safeBtn::after{
  display:none !important;
}

#game .center{
  top:245px !important;
}


/* ============================================================
   Google AdSense footer
   表示対象: HOME / LOBBY / RESULT
   対戦画面には広告枠を置かない
   ============================================================ */
.adsense-footer{
  width:min(970px, calc(100% - 24px));
  min-height:72px;
  margin:32px auto 20px;
  padding:0 12px 8px;
  box-sizing:border-box;
  text-align:center;
  clear:both;
}

.sponsor-label{
  margin:0 0 7px;
  color:#8c929b;
  font-size:11px;
  line-height:1.2;
  font-weight:400;
  text-align:center;
  letter-spacing:.02em;
}

.adsense-footer .adsbygoogle{
  display:block;
  width:100%;
  min-height:60px;
}

/* 未配信枠で大きな空白を残しにくくする */
.adsense-footer .adsbygoogle[data-ad-status="unfilled"]{
  display:none !important;
}

@media(max-width:600px){
  .adsense-footer{
    width:min(360px, calc(100% - 16px));
    margin-top:28px;
    padding:0 8px 6px;
    min-height:62px;
  }
  .sponsor-label{
    font-size:10px;
    margin-bottom:6px;
  }
  .adsense-footer .adsbygoogle{
    min-height:50px;
  }
}

/* ゲーム中には広告を出さない。
   #game 内には広告要素そのものを配置していない。 */
#game .adsense-footer{
  display:none !important;
}


/* ============================================================
   ROUND END LINGER
   最終手札強調 → SAFE/GUTTER＋加点 → 3秒余韻 → 結果
   ============================================================ */
#game .activity.closingActivity{
  top:118px !important;
  min-width:360px;
  max-width:520px;
  padding:9px 16px !important;
  border-radius:14px !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  opacity:1 !important;
  transform:translate(-50%,0) !important;
  background:#08110fea !important;
  border:1px solid #d8b74a88 !important;
  pointer-events:none;
}
#game .activity.closingActivity b{
  font-size:1rem;
  color:#fff;
}
#game .activity.closingActivity span{
  font-size:.78rem;
  color:#d8b74a;
}

#game .finalHandEmphasis.miniCards,
#game #myHand.finalHandEmphasis{
  position:relative;
  z-index:22;
}
#game .finalHandEmphasis.miniCards .miniCard,
#game #myHand.finalHandEmphasis .card{
  transform:translateY(-8px);
  box-shadow:0 0 0 3px #fff8,0 0 20px #fff8,0 6px 10px #0008 !important;
}
#game .finalHandEmphasis.finalSafe.miniCards .miniCard,
#game #myHand.finalHandEmphasis.finalSafe .card{
  border-color:#56f28a !important;
  box-shadow:0 0 0 3px #56f28a88,0 0 22px #56f28aaa,0 6px 10px #0008 !important;
}
#game .finalHandEmphasis.finalGutter.miniCards .miniCard,
#game #myHand.finalHandEmphasis.finalGutter .card{
  border-color:#ff5966 !important;
  box-shadow:0 0 0 3px #ff596688,0 0 22px #ff5966aa,0 6px 10px #0008 !important;
}
#game .seat.finalHandEmphasis.finalSafe{
  outline:2px solid #56f28a88;
  outline-offset:5px;
  border-radius:14px;
}
#game .seat.finalHandEmphasis.finalGutter{
  outline:2px solid #ff596688;
  outline-offset:5px;
  border-radius:14px;
}


/* CARD SELECT / ROUND END / RESULT SELF EMPHASIS */
#game #myHand .card.sel,#game .myHand .card.sel{transform:translateY(-16px)!important;border-color:#ffdd54!important;box-shadow:0 10px 18px #0009,0 0 0 2px #ffdd5488!important;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important}
#game #myHand .card:not(.sel),#game .myHand .card:not(.sel){transform:translateY(0)!important;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important}
#game #myHand.finalHandEmphasis .card{transform:translateY(-10px)!important}
#game .activity.closingActivity{min-width:390px!important;padding:11px 18px!important}
#game .activity.closingActivity b{font-size:1.08rem!important}
#game .activity.closingActivity span{font-size:.84rem!important}
.resultBox .rankRow.resultSelf{border:2px solid #d8b74a!important;background:#d8b74a18!important;box-shadow:0 0 0 2px #d8b74a22 inset,0 6px 18px #0005;transform:scale(1.015)}
.resultBox .rankRow.resultSelf::before{content:"YOU";display:inline-grid;place-items:center;min-width:38px;height:22px;padding:0 6px;border-radius:999px;background:#d8b74a;color:#111;font-size:.68rem;font-weight:1000;letter-spacing:.06em}


/* ===== HOME bottom navigation ===== */
.game-footer-links{
  display:flex;
  justify-content:center;
  gap:12px;
  width:min(700px,calc(100% - 24px));
  margin:28px auto 24px;
}
.game-footer-links a{
  flex:1;
  max-width:280px;
  padding:13px 18px;
  border:1px solid #ffffff33;
  border-radius:10px;
  background:#ffffff0d;
  color:#fff;
  text-align:center;
  text-decoration:none;
  font-weight:800;
  line-height:1.3;
  transition:.15s ease;
}
.game-footer-links a:hover{
  background:#ffffff18;
  border-color:#ffffff55;
  transform:translateY(-1px);
}
.game-footer-links a span{
  display:block;
  margin-top:3px;
  font-size:11px;
  font-weight:500;
  opacity:.6;
}
@media(max-width:520px){
  .game-footer-links{
    flex-direction:column;
    align-items:center;
  }
  .game-footer-links a{
    width:100%;
  }
}

/* ルール説明：LOBBY/HOMEのみ。GAMEの既存配置には触れない */
.modeHint{padding:9px 11px;border-left:3px solid var(--gold);background:#ffffff0a;border-radius:7px;font-size:.82rem;line-height:1.5}
.lobbyRules{max-width:900px;margin:12px auto;padding:14px 16px;background:#07110ecc;border:1px solid #ffffff24;border-radius:14px;line-height:1.65}
.lobbyRules h3{color:var(--gold);margin:7px 0}.lobbyRules p{margin:4px 0}.miniHelp{font-size:.8rem;opacity:.8}
.rulesModal{display:none;position:fixed;inset:0;z-index:100;background:#000b;padding:20px;overflow:auto}
.rulesModal.show{display:grid;place-items:center}
.rulesModalBox{position:relative;width:min(760px,100%);max-height:90vh;overflow:auto;background:#0a1311;border:1px solid #ffffff33;border-radius:18px;padding:22px;color:#fff}
.rulesClose{position:absolute;right:10px;top:10px;width:42px;height:42px;padding:0}
.ruleTabs{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.ruleTabs button{flex:1;min-width:110px;background:#17211e;color:#fff}.ruleTabs button.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.rulePane{display:none;padding:13px;background:#ffffff08;border-radius:12px}.rulePane.active{display:block}.rulePane h3{color:var(--gold)}
.audioToggle{display:none;position:fixed;right:10px;top:10px;z-index:80;padding:7px 10px;border-radius:999px;background:#07110ee8;color:#fff;border:1px solid #ffffff33;font-size:.74rem}

.resultChip{font-weight:900;color:#ffe48a}
.rankRow.selfResult{outline:2px solid var(--gold);box-shadow:0 0 18px #ffd75a22}

/* 手動広告は各画面の下部だけ。対戦GAMEには広告枠を置かない。 */
#game .adsbygoogle,
#game .adsense-footer,
#game .ad-slot,
#game [id^="ad-"]{display:none!important}
.resultChip{font-weight:900;color:#ffe48a}
