*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#222;color:#fff;font-family:Arial,Helvetica,sans-serif}
.exact-game{background:#222;min-height:100vh}
.game-head{height:153px;background:#303030;display:flex;align-items:center;border-bottom:1px solid #111;padding:0 20px}
.back{font-size:67px;line-height:1;color:#fff;text-decoration:none;font-weight:200;margin-right:28px;margin-top:-8px}
.game-title{font-size:28px;color:#83d5ee;font-weight:300;flex:1}
.head-icons{display:flex;gap:25px;align-items:center;font-size:38px;color:#fff}
.head-icons span:first-child{font-size:42px}.head-icons span:nth-child(2){font-size:43px}
.scorebar{height:88px;background:#242443;display:grid;grid-template-columns:1fr 1fr;gap:35px;padding:10px 8px 0}
.player-card{height:72px;display:flex;align-items:center;gap:9px;font-size:30px;position:relative}
.player-card:after{content:"";position:absolute;bottom:0;left:0;right:0;height:10px;background:#3d3d3d}
.color-dot{width:50px;height:50px;border-radius:50%;display:inline-block;border:2px solid #ddd;box-shadow:0 2px 4px #000}
.yellow{background:#fff000}.red{background:#f10c12}
.avatar{width:45px;height:45px;border-radius:50%;background:#34434d;display:inline-grid;place-items:center;font-size:25px;overflow:hidden}
.score-lines{display:grid;grid-template-columns:1fr 1fr;background:#242443;height:18px;color:#fff;text-align:center;font-size:0}
.exact-main{max-width:850px;margin:69px auto 0;padding:0 20px}
.game-buttons{margin:0 auto 75px;max-width:555px}
.big-btn{display:block;width:100%;height:82px;border:0;border-radius:2px;color:#fff;font-size:31px;font-weight:900;text-shadow:2px 3px 0 #000;margin-bottom:18px;cursor:pointer}
.big-btn.dark{background:#151515;border:1px solid #0b0b0b}.big-btn.gray{background:#5b5b5b}
.board-wrap{position:relative;background:linear-gradient(#1476dc,#0560c8);border:10px solid #0c61c9;border-radius:35px;padding:13px;box-shadow:inset 0 0 0 3px #2c91ff,0 5px 12px #0009}
.board{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
.cell{appearance:none;border:3px solid #064796;border-radius:50%;aspect-ratio:1;background:radial-gradient(circle at 50% 65%,#051936 0 57%,#0b2c61 60%,#001027 72%);box-shadow:inset 0 6px 7px #0008,0 1px 0 #65adff;cursor:pointer;padding:0}
.cell.p1{background:radial-gradient(circle at 35% 28%,#fffca2 0 8%,#fff21a 17%,#ffe000 70%,#d0b900 100%);border-color:#bca800;box-shadow:inset 0 5px 7px #fff9,0 2px 2px #0007}
.cell.p2{background:radial-gradient(circle at 35% 28%,#ff9a9a 0 7%,#ff161b 18%,#e40005 70%,#ad0004 100%);border-color:#a00004;box-shadow:inset 0 5px 7px #fff6,0 2px 2px #0007}
.cell.win{outline:5px solid #39ff20;box-shadow:0 0 16px #39ff20,inset 0 5px 7px #fff8;animation:winningCellPulse .75s ease-in-out infinite alternate;position:relative;z-index:3;transform:scale(1.06);overflow:visible}
.cell.win::after{content:"";position:absolute;inset:7%;border-radius:50%;z-index:4;pointer-events:none;opacity:.96;animation:winBurst .9s linear infinite;mix-blend-mode:screen}
.cell.p1.win::after{background:conic-gradient(from 0deg,#fff9 0deg 7deg,transparent 7deg 20deg,#fff8 20deg 27deg,transparent 27deg 40deg,#fff8 40deg 47deg,transparent 47deg 60deg,#fff8 60deg 67deg,transparent 67deg 80deg,#fff8 80deg 87deg,transparent 87deg 100deg,#fff8 100deg 107deg,transparent 107deg 120deg,#fff8 120deg 127deg,transparent 127deg 140deg,#fff8 140deg 147deg,transparent 147deg 160deg,#fff8 160deg 167deg,transparent 167deg 180deg,#fff8 180deg 187deg,transparent 187deg 200deg,#fff8 200deg 207deg,transparent 207deg 220deg,#fff8 220deg 227deg,transparent 227deg 240deg,#fff8 240deg 247deg,transparent 247deg 260deg,#fff8 260deg 267deg,transparent 267deg 280deg,#fff8 280deg 287deg,transparent 287deg 300deg,#fff8 300deg 307deg,transparent 307deg 320deg,#fff8 320deg 327deg,transparent 327deg 340deg,#fff8 340deg 347deg,transparent 347deg 360deg),radial-gradient(circle,#ffe600 0 42%,#e0b800 70%,transparent 72%)}
.cell.p2.win::after{background:conic-gradient(from 0deg,#fff9 0deg 7deg,transparent 7deg 20deg,#fff8 20deg 27deg,transparent 27deg 40deg,#fff8 40deg 47deg,transparent 47deg 60deg,#fff8 60deg 67deg,transparent 67deg 80deg,#fff8 80deg 87deg,transparent 87deg 100deg,#fff8 100deg 107deg,transparent 107deg 120deg,#fff8 120deg 127deg,transparent 127deg 140deg,#fff8 140deg 147deg,transparent 147deg 160deg,#fff8 160deg 167deg,transparent 167deg 180deg,#fff8 180deg 187deg,transparent 187deg 200deg,#fff8 200deg 207deg,transparent 207deg 220deg,#fff8 220deg 227deg,transparent 227deg 240deg,#fff8 240deg 247deg,transparent 247deg 260deg,#fff8 260deg 267deg,transparent 267deg 280deg,#fff8 280deg 287deg,transparent 287deg 300deg,#fff8 300deg 307deg,transparent 307deg 320deg,#fff8 320deg 327deg,transparent 327deg 340deg,#fff8 340deg 347deg,transparent 347deg 360deg),radial-gradient(circle,#ef161b 0 42%,#b90004 70%,transparent 72%)}
@keyframes winningCellPulse{from{filter:brightness(1);transform:scale(1.04);box-shadow:0 0 8px #39ff20,inset 0 5px 7px #fff8}to{filter:brightness(1.45);transform:scale(1.12);box-shadow:0 0 30px #39ff20,0 0 8px #fff,inset 0 5px 7px #fff8}}
@keyframes winBurst{from{transform:rotate(0deg) scale(.92);opacity:.82}to{transform:rotate(360deg) scale(1.02);opacity:1}}
.winner-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:none !important;background-color:transparent !important;background-image:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;box-shadow:none !important;text-align:center;pointer-events:none;text-shadow:3px 4px 0 #111;z-index:8}
.winner-overlay.hidden{display:none}
.winner-title{font-size:48px;color:#45ff18;font-weight:900;line-height:1.05;margin-bottom:18px;letter-spacing:-1px}
#winner-p1,#winner-p2{font-size:27px;color:#45ff1c;font-weight:900;line-height:1.45}
.chat-exact{margin:260px 0 35px;width:300px;background:#151515;border:1px solid #111}
.chat-title{padding:18px 25px;font-size:25px;text-align:center;border-bottom:1px solid #333}
#messages{max-height:180px;overflow:auto;padding:8px 12px}
.msg{padding:6px 0;border-bottom:1px solid #333;font-size:14px}.msg b{color:#8bd9f4}
.chat-exact form{display:flex;border-top:1px solid #333}.chat-exact input{margin:0;min-width:0;border:0;background:#222;color:#fff;padding:14px}.chat-exact button{width:48px;border:0;background:#0878db;color:#fff}
@media(max-width:700px){
 .game-head{height:153px;padding:0 14px}.game-title{font-size:24px}.back{font-size:60px;margin-right:18px}.head-icons{gap:15px;font-size:31px}
 .scorebar{gap:8px}.player-card{font-size:23px}.color-dot{width:42px;height:42px}.avatar{width:40px;height:40px}
 .exact-main{margin-top:68px;padding:0 12px}.game-buttons{margin-bottom:75px}.big-btn{height:82px;font-size:29px}
 .board-wrap{border-width:8px;padding:9px;border-radius:28px}.board{gap:7px}.cell{border-width:2px}
 .winner-title{font-size:36px}.winner-overlay #winner-p1,.winner-overlay #winner-p2{font-size:21px}.cell.win{outline-width:4px}
 .chat-exact{margin-top:245px}
}
@media(min-width:701px){.board-wrap{max-width:760px;margin:auto}.score-lines{padding:0 8px}}

.sound-btn{background:transparent;border:0;color:#fff;font-size:32px;cursor:pointer;padding:4px}
.game-info{max-width:760px;margin:-55px auto 28px;padding:10px 14px;display:flex;justify-content:space-between;gap:10px;background:#171717;border:1px solid #333;border-radius:10px;color:#ddd;font-size:14px}.game-info span{white-space:nowrap}.online-dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#777;border:1px solid #111;vertical-align:middle;margin-right:4px}.online-dot.online{background:#35e06f;box-shadow:0 0 8px #35e06f}.quick-chat{display:flex;gap:6px;padding:7px;border-top:1px solid #333}.quick-chat button{flex:1;border:1px solid #444;border-radius:7px;background:#252525;color:#fff;padding:7px;cursor:pointer}.light-game{background:#eef2f7!important;color:#111}.light-game .game-head,.light-game .scorebar,.light-game .score-lines{background:#fff;color:#111}.light-game .game-title,.light-game .player-card,.light-game .head-icons{color:#222}.light-game .game-info,.light-game .chat-exact{background:#fff;color:#222;border-color:#ccd3dd}.light-game .chat-title{border-color:#ccd3dd}.light-game #messages{background:#fafafa}.light-game .chat-exact input{background:#fff;color:#111}.light-game .quick-chat{border-color:#ccd3dd}.light-game .quick-chat button{background:#eef2f7;color:#111;border-color:#ccd3dd}.light-game .big-btn.gray{background:#777}@media(max-width:700px){.game-info{margin:-55px 0 22px;font-size:12px;overflow:auto}.game-info span{white-space:nowrap}.quick-chat button{font-size:12px;padding:8px 4px}}
.winner-overlay.draw-mode .winner-title{color:#8bd9f4;animation:drawPulse 1s ease-in-out infinite alternate;text-shadow:0 0 16px #8bd9f4,3px 4px 0 #111}@keyframes drawPulse{from{transform:scale(.96);opacity:.72}to{transform:scale(1.08);opacity:1}}
.neon-game .board-wrap{background:linear-gradient(135deg,#2a0052,#001b52);border-color:#7c1cff;box-shadow:0 0 25px #7c1cff,inset 0 0 0 3px #00eaff}.neon-game .cell{border-color:#6d22a8;box-shadow:0 0 10px #00eaff,inset 0 6px 7px #0008}.ocean-game .board-wrap{background:linear-gradient(#0b8aa6,#07527b);border-color:#0aa8c2}.ocean-game .game-head,.ocean-game .scorebar,.ocean-game .score-lines{background:#123b4d}

/* ========================================================================
   PREMIUM REALISTIC CONNECT-4 UI v3
   ======================================================================== */

html,body{overflow-x:hidden}
body.exact-game{
  background:
    radial-gradient(circle at 50% -10%,rgba(42,126,255,.28),transparent 34%),
    linear-gradient(180deg,#07101d 0%,#0a1422 42%,#050a12 100%);
}
.exact-game{min-height:100vh}
.game-head{
  height:82px;
  padding:0 22px;
  background:rgba(7,14,24,.86);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 40px rgba(0,0,0,.22);
  position:relative;
  z-index:20;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.back{font-size:54px;margin-right:18px;color:#eaf7ff}
.game-title{font-size:25px;font-weight:800;letter-spacing:.2px;color:#eaf7ff}
.head-icons{gap:10px;font-size:28px}
.sound-btn{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:22px;display:grid;place-items:center;transition:transform .18s ease,background .18s ease}
.sound-btn:active{transform:scale(.93)}

.premium-topbar{
  max-width:980px;
  margin:18px auto 0;
  padding:0 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.match-chip,.match-status,.timer-chip{
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.055);
  box-shadow:0 8px 25px rgba(0,0,0,.16);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.match-chip{
  display:flex;align-items:center;gap:9px;
  min-height:38px;padding:7px 11px;border-radius:12px;
  color:#b9cbe0;font-size:11px;font-weight:900;letter-spacing:1px;
}
.match-chip .room-pill{margin-left:2px}
.match-chip-dot{width:8px;height:8px;border-radius:50%;background:#35e37c;box-shadow:0 0 12px #35e37c}
.match-status{padding:8px 12px;border-radius:11px;color:#8ce7ff;font-size:11px;font-weight:900;letter-spacing:1px}
.room-pill{background:rgba(255,210,58,.11);border:1px solid rgba(255,210,58,.2);color:#ffd94c;border-radius:8px}
.premium-info{max-width:980px;margin:12px auto 0;background:transparent;border:0;box-shadow:none;padding:0 20px;color:#aab9ca}
.premium-info .timer-chip{padding:7px 11px;border-radius:10px;color:#e9f5ff}
.waiting-note{background:rgba(255,207,65,.07)!important;border-color:rgba(255,207,65,.2)!important;color:#ffd65a!important}

.exact-main{max-width:1180px;margin:22px auto 0;padding:0 18px}
.game-buttons{max-width:980px;margin:0 auto 20px;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.big-btn{width:auto;min-width:150px;height:46px;padding:0 18px;border-radius:12px;font-size:13px;letter-spacing:.5px;text-shadow:none;box-shadow:0 8px 20px rgba(0,0,0,.18);margin:0;border:1px solid rgba(255,255,255,.08)}
.big-btn.dark{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09)}
.big-btn.gray{background:linear-gradient(180deg,#2b78c7,#16579b);border-color:#318ddd}

.game-stage{
  display:grid;
  grid-template-columns:minmax(170px,210px) minmax(420px,680px) minmax(170px,210px);
  align-items:center;
  justify-content:center;
  gap:24px;
  max-width:1180px;
  margin:0 auto;
  padding:24px 0 48px;
}
.player-tray{
  position:relative;
  min-height:300px;
  padding:18px 14px 16px;
  border-radius:24px;
  overflow:hidden;
  background:
    linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.035) 45%,rgba(0,0,0,.2)),
    #101a28;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 22px 55px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.08);
  transform:translateZ(0);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.player-tray:hover{transform:translateY(-3px)}
.player-tray.active{
  border-color:rgba(88,206,255,.55);
  box-shadow:0 22px 65px rgba(0,0,0,.36),0 0 28px rgba(36,172,255,.16),inset 0 1px 0 rgba(255,255,255,.1);
}
.player-tray-1{--accent:#ffe21c;--accent2:#ffb800}
.player-tray-2{--accent:#ff343b;--accent2:#c70008}
.tray-glow{position:absolute;width:170px;height:170px;border-radius:50%;right:-75px;top:-85px;background:var(--accent);filter:blur(60px);opacity:.12;pointer-events:none}
.tray-player{display:flex;align-items:center;gap:9px;position:relative;z-index:1}
.tray-name-wrap{min-width:0;display:flex;flex-direction:column;gap:4px}
.tray-name-wrap>b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:115px;color:#f3f8ff}
.tray-meta{display:flex;align-items:center;gap:5px;font-size:10px;color:#91a4b9;white-space:nowrap}
.player-tray .color-dot{width:39px;height:39px;border:2px solid rgba(255,255,255,.35);box-shadow:inset 0 4px 5px rgba(255,255,255,.45),0 5px 12px rgba(0,0,0,.4)}
.player-tray .avatar{width:38px;height:38px;font-size:21px;border:1px solid rgba(255,255,255,.13)}
.tray-turn{position:relative;z-index:1;margin:15px 0 18px;padding:7px 9px;border-radius:9px;text-align:center;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);color:#788ca1;font-size:10px;font-weight:900;letter-spacing:1.1px;transition:all .2s ease}
.tray-turn.active{color:#dff8ff;background:rgba(50,188,255,.11);border-color:rgba(50,188,255,.3);box-shadow:0 0 20px rgba(50,188,255,.12)}
.reserve-label{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#72879d;font-size:9px;font-weight:900;letter-spacing:.9px}
.reserve-label b{color:#e9f4ff;font-size:16px}
.reserve-pieces{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px;min-height:72px;align-content:flex-start}
.reserve-piece{width:25px;height:25px;border-radius:50%;display:block;background:radial-gradient(circle at 32% 24%,#fffbc2 0 7%,#fff21b 18%,#ffd900 68%,#bd9d00 100%);border:1px solid #a98b00;box-shadow:inset 0 3px 4px rgba(255,255,255,.7),0 4px 7px rgba(0,0,0,.4);animation:reservePop .4s ease both;animation-delay:var(--piece-delay)}
.reserve-piece.red{background:radial-gradient(circle at 32% 24%,#ffd0d0 0 7%,#ff3a3f 18%,#e60008 68%,#9d0005 100%);border-color:#8d0004}
.reserve-pieces.empty:after{content:'NO PIECES LEFT';font-size:9px;color:#65778b;font-weight:800;letter-spacing:1px;margin-top:8px}
@keyframes reservePop{from{opacity:0;transform:scale(.65) translateY(5px)}to{opacity:1;transform:scale(1) translateY(0)}}

.board-wrap{
  position:relative;
  width:100%;
  max-width:680px;
  justify-self:center;
  padding:22px 22px 31px;
  border:0;
  border-radius:34px;
  background:
    linear-gradient(90deg,rgba(0,0,0,.18),transparent 9%,transparent 91%,rgba(0,0,0,.2)),
    linear-gradient(180deg,#1682ec 0%,#0872dc 42%,#045bbd 100%);
  box-shadow:
    0 30px 60px rgba(0,0,0,.38),
    0 8px 0 #034da4,
    inset 0 2px 0 rgba(255,255,255,.32),
    inset 8px 0 20px rgba(255,255,255,.08),
    inset -8px 0 20px rgba(0,0,0,.13);
  transform:perspective(1000px) rotateX(1deg) translateZ(0);
}
.board-wrap:before{content:'';position:absolute;inset:8px;border-radius:28px;border:2px solid rgba(255,255,255,.12);pointer-events:none;z-index:0}
.board-shadow{position:absolute;left:9%;right:9%;bottom:-26px;height:46px;border-radius:0 0 28px 28px;background:linear-gradient(180deg,#0a63c5,#034995);box-shadow:0 12px 20px rgba(0,0,0,.25),inset 0 5px 7px rgba(255,255,255,.15);z-index:-1}
.board-top-highlight{position:absolute;left:8%;right:8%;top:7px;height:18px;border-radius:20px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);filter:blur(1px);pointer-events:none}
.tray-base{position:absolute;left:10%;right:10%;bottom:-41px;height:42px;border-radius:0 0 26px 26px;background:linear-gradient(180deg,#0b70d5,#0452ad);border:2px solid #034b9f;border-top:0;box-shadow:0 13px 22px rgba(0,0,0,.3),inset 0 5px 5px rgba(255,255,255,.13);z-index:-2}
.board{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:11px;
  padding:4px;
  border-radius:20px;
  background:linear-gradient(180deg,rgba(0,52,125,.3),rgba(0,35,89,.46));
  box-shadow:inset 0 8px 18px rgba(0,0,0,.22),inset 0 -4px 8px rgba(255,255,255,.06);
}
.cell{
  position:relative;
  appearance:none;
  -webkit-appearance:none;
  border:3px solid #064792;
  border-radius:50%;
  aspect-ratio:1;
  min-width:0;
  background:radial-gradient(circle at 50% 50%,#061b42 0 55%,#0a2d62 59%,#00132e 72%,#000b1b 100%);
  box-shadow:inset 0 8px 10px rgba(0,0,0,.7),inset 0 -2px 4px rgba(255,255,255,.08),0 2px 0 rgba(255,255,255,.15);
  cursor:pointer;
  padding:0;
  touch-action:manipulation;
  transform:translateZ(0);
  transition:box-shadow .16s ease,filter .16s ease;
}
.cell:focus-visible{outline:3px solid rgba(255,255,255,.8);outline-offset:3px}
.cell.column-focus{filter:brightness(1.13);box-shadow:inset 0 8px 10px rgba(0,0,0,.62),0 0 0 2px rgba(255,255,255,.08)}
.cell.p1{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%);border-color:#b29100;box-shadow:inset 0 6px 7px rgba(255,255,255,.82),inset 0 -5px 8px rgba(139,98,0,.25),0 5px 9px rgba(0,0,0,.38)}
.cell.p2{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%);border-color:#990005;box-shadow:inset 0 6px 7px rgba(255,255,255,.72),inset 0 -5px 8px rgba(116,0,0,.25),0 5px 9px rgba(0,0,0,.38)}
.cell.p1:after,.cell.p2:after{content:'';position:absolute;left:22%;top:13%;width:23%;height:11%;border-radius:50%;background:rgba(255,255,255,.52);filter:blur(2px);pointer-events:none}
.cell.p1:before,.cell.p2:before{content:'★';position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);z-index:2;font-family:Arial,sans-serif;font-size:42%;line-height:1;color:rgba(255,255,255,.92);text-shadow:0 1px 1px rgba(0,0,0,.45),0 0 2px rgba(255,255,255,.45);pointer-events:none}
.cell.p2:before{color:rgba(255,238,238,.95);}
.reserve-piece{position:relative;overflow:hidden}
.reserve-piece:after{content:'★';position:absolute;left:50%;top:50%;transform:translate(-50%,-53%);font-family:Arial,sans-serif;font-size:52%;line-height:1;color:rgba(255,255,255,.9);text-shadow:0 1px 1px rgba(0,0,0,.45);pointer-events:none}
.drop-preview{position:absolute}
.drop-preview:after{content:'★';position:absolute;left:50%;top:50%;transform:translate(-50%,-53%);font-family:Arial,sans-serif;font-size:55%;line-height:1;color:rgba(255,255,255,.92);text-shadow:0 1px 1px rgba(0,0,0,.45);pointer-events:none}
.cell.piece-entering{will-change:transform,opacity,filter;z-index:10}
.drop-preview{position:absolute;z-index:8;top:-51px;width:34px;height:34px;border-radius:50%;opacity:0;pointer-events:none;transform:translateY(-7px) scale(.72);transition:opacity .16s ease,transform .16s ease;box-shadow:0 6px 14px rgba(0,0,0,.35),inset 0 4px 5px rgba(255,255,255,.6)}
.drop-preview.show{opacity:.95;transform:translateY(0) scale(1)}
.drop-preview.yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 7%,#fff42b 18%,#ffdf00 68%,#b99100 100%);border:2px solid #a98900}
.drop-preview.red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 7%,#ff4b50 18%,#ed1016 68%,#9c0005 100%);border:2px solid #900005}

.cell.win{outline:4px solid #baff75;outline-offset:2px;animation:winningCellPulse .72s ease-in-out infinite alternate;z-index:12}
@keyframes winningCellPulse{from{filter:brightness(1);transform:scale(1.035);box-shadow:0 0 8px rgba(157,255,80,.7),inset 0 5px 7px rgba(255,255,255,.7)}to{filter:brightness(1.35);transform:scale(1.10);box-shadow:0 0 28px rgba(157,255,80,.95),0 0 7px #fff,inset 0 5px 7px rgba(255,255,255,.75)}}

.winner-overlay{z-index:20;inset:0;border-radius:0;background:transparent!important;background-color:transparent!important;background-image:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;text-shadow:0 3px 10px #000;pointer-events:none}
.winner-title{font-size:clamp(30px,5vw,52px);color:#baff75;letter-spacing:.5px;text-shadow:0 4px 0 rgba(0,0,0,.5),0 0 22px rgba(186,255,117,.35);background:transparent}
#winner-p1,#winner-p2{font-size:clamp(16px,2.3vw,25px);color:#fff}

.chat-exact{width:100%;max-width:680px;margin:18px auto 35px;background:rgba(12,21,33,.8);border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;box-shadow:0 18px 45px rgba(0,0,0,.22);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.chat-title{padding:13px 18px;font-size:14px;font-weight:900;letter-spacing:.7px;text-align:left;border-bottom:1px solid rgba(255,255,255,.08);color:#dceafa}
#messages{max-height:150px;overflow:auto;padding:9px 13px;scroll-behavior:smooth}
.msg{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px}.msg b{color:#76d9ff}
.chat-exact form{display:flex;border-top:1px solid rgba(255,255,255,.08)}.chat-exact input{margin:0;min-width:0;flex:1;border:0;background:rgba(0,0,0,.2);color:#fff;padding:13px 14px;outline:none}.chat-exact input::placeholder{color:#6f8399}.chat-exact button{width:50px;border:0;background:linear-gradient(180deg,#1689ed,#0963ba);color:#fff;cursor:pointer}

@media(max-width:900px){
  .game-stage{grid-template-columns:minmax(0,1fr);gap:14px;padding:10px 0 40px;max-width:700px}
  .board-wrap{order:2;max-width:680px}
  .player-tray{min-height:0;display:block;padding:13px 15px;border-radius:18px}
  .player-tray-1{order:1}.player-tray-2{order:3}
  .tray-player{max-width:100%}.tray-name-wrap>b{max-width:210px}
  .tray-turn{position:absolute;right:14px;top:12px;margin:0;min-width:88px}
  .reserve-label{margin-top:12px}.reserve-pieces{min-height:0;margin-top:8px;gap:6px}
  .reserve-piece{width:21px;height:21px}
}

@media(max-width:600px){
  .game-head{height:64px;padding:0 9px}.back{font-size:46px;margin-right:7px}.game-title{font-size:17px}.head-icons{gap:5px}.sound-btn{width:36px;height:36px;font-size:19px;border-radius:10px}.head-icons span{display:none}
  .premium-topbar{margin-top:9px;padding:0 10px}.match-chip{font-size:9px;min-height:31px;padding:5px 7px;gap:6px}.match-chip .room-pill{display:none}.match-status{font-size:9px;padding:7px 9px}
  .premium-info{margin-top:7px;padding:0 10px;font-size:11px;gap:7px}.premium-info .timer-chip{padding:6px 8px}
  .exact-main{margin-top:9px;padding:0 9px}.game-buttons{margin-bottom:7px;gap:6px}.big-btn{min-width:0;height:38px;padding:0 12px;font-size:11px;border-radius:10px}
  .game-stage{padding:5px 0 34px;gap:9px}
  .player-tray{padding:10px 11px;border-radius:15px}.player-tray .color-dot{width:32px;height:32px}.player-tray .avatar{width:32px;height:32px;font-size:18px}.tray-name-wrap>b{font-size:13px;max-width:140px}.tray-meta{font-size:9px}.tray-turn{right:10px;top:10px;font-size:8px;min-width:72px;padding:6px 7px}
  .reserve-label{font-size:8px;margin-top:8px}.reserve-label b{font-size:13px}.reserve-pieces{gap:5px;margin-top:6px}.reserve-piece{width:18px;height:18px}
  .board-wrap{padding:13px 12px 21px;border-radius:23px;box-shadow:0 20px 38px rgba(0,0,0,.4),0 5px 0 #034da4,inset 0 2px 0 rgba(255,255,255,.3),inset 5px 0 14px rgba(255,255,255,.07),inset -5px 0 14px rgba(0,0,0,.12)}
  .board{gap:6px;padding:3px;border-radius:15px}.cell{border-width:2px}.drop-preview{width:26px;height:26px;top:-37px}
  .board-shadow{bottom:-21px;height:30px;border-radius:0 0 19px 19px}.tray-base{bottom:-32px;height:33px;border-radius:0 0 19px 19px}
  .winner-overlay{inset:7%;border-radius:18px}.winner-title{font-size:31px}.winner-overlay #winner-p1,.winner-overlay #winner-p2{font-size:16px}.cell.win{outline-width:3px}
  .chat-exact{margin-top:6px;border-radius:14px}.chat-title{padding:11px 14px;font-size:12px}#messages{max-height:130px}.msg{font-size:12px}.chat-exact input{padding:11px 12px}.chat-exact button{width:44px}
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
\n\n/* Small in-board win banner */\n.winner-overlay{\n  justify-content:center;\n  align-items:center;\n  padding:18px;\n}\n.winner-title{\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  min-width:0;\n  padding:9px 18px;\n  border-radius:999px;\n  font-size:clamp(18px,3.2vw,30px);\n  line-height:1;\n  letter-spacing:1.4px;\n  color:#fff;\n  background:rgba(5,18,31,.78);\n  border:1px solid rgba(255,255,255,.28);\n  box-shadow:0 8px 24px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.18);\n  text-shadow:0 2px 4px rgba(0,0,0,.55);\n  backdrop-filter:blur(8px);\n  -webkit-backdrop-filter:blur(8px);\n  animation:smallWinBannerIn .32s cubic-bezier(.2,.8,.2,1) both;\n}\n.winner-title.you-win{\n  color:#fff;\n  background:linear-gradient(180deg,rgba(47,177,86,.92),rgba(17,111,55,.92));\n  border-color:rgba(188,255,205,.72);\n  box-shadow:0 8px 28px rgba(25,176,76,.28), inset 0 1px 0 rgba(255,255,255,.28);\n}\n.winner-title.you-lose{\n  color:#fff;\n  background:rgba(20,30,43,.86);\n  border-color:rgba(255,255,255,.2);\n}\n#winner-p1,#winner-p2{\n  font-size:12px;\n  line-height:1.25;\n  color:rgba(255,255,255,.88);\n  margin-top:5px;\n  text-shadow:0 2px 4px rgba(0,0,0,.65);\n}\n@keyframes smallWinBannerIn{\n  from{opacity:0;transform:translateY(-8px) scale(.88)}\n  to{opacity:1;transform:translateY(0) scale(1)}\n}\n@media(max-width:700px){\n  .winner-title{font-size:19px;padding:8px 15px;letter-spacing:1.1px}\n  #winner-p1,#winner-p2{font-size:10px;margin-top:3px}\n}\n

/* ================================================================
   PREMIUM FINAL WIN BANNER + STAR PIECES
   No full-screen / blue transparent winner overlay.
   ================================================================ */
.board-wrap{overflow:visible;}
.win-banner{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%) scale(.86);
  z-index:50;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:126px;
  padding:8px 13px 7px;
  border-radius:13px;
  background:rgba(4,13,24,.78);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 10px 30px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  pointer-events:none;
  opacity:0;
}
.win-banner.hidden{display:none;}
.win-banner.show{display:flex;animation:boardWinBannerIn .34s cubic-bezier(.18,.82,.24,1) forwards;}
.win-banner.draw{background:rgba(5,25,42,.82);}
.win-banner-title{
  color:#fff;
  font-size:clamp(17px,3.3vw,28px);
  font-weight:1000;
  line-height:1;
  letter-spacing:1px;
  text-shadow:0 2px 5px rgba(0,0,0,.6);
  white-space:nowrap;
}
.win-banner-title.you-win{
  color:#f4fff6;
  text-shadow:0 0 12px rgba(92,255,135,.45),0 2px 5px rgba(0,0,0,.55);
}
.win-banner-title.you-lose{color:#ffe5e5;}
.win-banner.draw .win-banner-title{color:#d8f4ff;}
.win-banner-sub{
  margin-top:4px;
  color:rgba(255,255,255,.88);
  font-size:9px;
  font-weight:900;
  letter-spacing:1.3px;
}
@keyframes boardWinBannerIn{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.72) translateY(-8px);}
  70%{opacity:1;transform:translate(-50%,-50%) scale(1.04);}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1);}
}

/* Explicit star element: guaranteed visible even when pseudo-elements are overridden. */
.cell .piece-star{
  position:absolute;
  left:50%;
  top:50%;
  z-index:6;
  transform:translate(-50%,-54%);
  font-family:Arial,sans-serif;
  font-size:42%;
  line-height:1;
  color:rgba(255,255,255,.96);
  text-shadow:0 1px 2px rgba(0,0,0,.62),0 0 3px rgba(255,255,255,.35);
  pointer-events:none;
}
.reserve-piece .reserve-star{
  position:absolute;
  left:50%;
  top:50%;
  z-index:4;
  transform:translate(-50%,-54%);
  font-family:Arial,sans-serif;
  font-size:52%;
  line-height:1;
  color:rgba(255,255,255,.96);
  text-shadow:0 1px 2px rgba(0,0,0,.62);
  pointer-events:none;
}

@media(max-width:600px){
  .win-banner{min-width:106px;padding:7px 10px 6px;border-radius:11px;}
  .win-banner-title{font-size:17px;letter-spacing:.8px;}
  .win-banner-sub{font-size:8px;margin-top:3px;}
  .cell .piece-star{font-size:43%;}
}

/* ================================================================
   COMPACT IN-BOARD WIN RESULT — V5
   ================================================================ */
.win-banner{
  min-width:0 !important;
  width:min(205px, 72%);
  box-sizing:border-box;
  padding:9px 10px 10px !important;
  border-radius:14px !important;
  background:linear-gradient(180deg,rgba(8,22,38,.94),rgba(3,12,24,.92)) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  box-shadow:0 12px 28px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.16) !important;
  pointer-events:auto !important;
}
.win-trophy{
  font-size:34px;
  line-height:1;
  margin:-1px 0 2px;
  filter:drop-shadow(0 3px 3px rgba(0,0,0,.5));
}
.win-banner-title{
  font-size:clamp(20px,4vw,29px) !important;
  letter-spacing:1.1px !important;
  line-height:1 !important;
}
.win-banner-title.you-win{
  color:#fff !important;
  background:linear-gradient(180deg,#4ea9ff,#1769d8);
  padding:5px 12px;
  border-radius:8px;
  border:1px solid rgba(180,220,255,.45);
  text-shadow:0 2px 3px rgba(0,0,0,.5) !important;
  box-shadow:0 4px 12px rgba(25,116,255,.28),inset 0 1px 0 rgba(255,255,255,.35);
}
.win-banner-title.you-lose{
  color:#fff !important;
  background:rgba(75,35,42,.92);
  padding:5px 12px;
  border-radius:8px;
}
.win-banner-sub{
  font-size:10px !important;
  margin-top:5px !important;
  letter-spacing:.5px !important;
  color:#ffe7a1 !important;
}
.win-points{
  margin-top:2px;
  color:#fff;
  font-size:12px;
  font-weight:900;
  line-height:1.2;
  text-shadow:0 1px 3px rgba(0,0,0,.6);
}
.win-actions{
  display:flex;
  gap:7px;
  width:100%;
  margin-top:8px;
}
.win-action{
  flex:1 1 0;
  min-width:0;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  padding:6px 7px;
  border-radius:7px;
  border:1px solid rgba(255,255,255,.18);
  font:800 10px/1 Arial,sans-serif;
  text-decoration:none;
  cursor:pointer;
  transition:transform .15s ease,filter .15s ease,opacity .15s ease;
}
.win-action:hover{transform:translateY(-1px);filter:brightness(1.08);}
.win-action:active{transform:translateY(0) scale(.98);}
.win-rematch{background:linear-gradient(180deg,#27c66a,#10954a);color:#fff;}
.win-menu{background:linear-gradient(180deg,#344354,#202b38);color:#fff;}
.win-action:disabled{opacity:.55;cursor:not-allowed;transform:none;}

@media(max-width:600px){
  .win-banner{
    width:min(190px,68%);
    padding:7px 8px 8px !important;
    border-radius:12px !important;
  }
  .win-trophy{font-size:28px;}
  .win-banner-title{font-size:18px !important;}
  .win-banner-sub{font-size:8px !important;margin-top:4px !important;}
  .win-points{font-size:10px;}
  .win-actions{gap:5px;margin-top:6px;}
  .win-action{min-height:28px;padding:5px 5px;font-size:9px;border-radius:6px;}
}


/* ================================================================
   V6 STAR + BOT DELAY + CLICKABLE COMPACT WIN POPUP
   ================================================================ */
.board-wrap{isolation:isolate;}
.win-banner{z-index:9999 !important;pointer-events:auto !important;cursor:default;}
.win-banner *{pointer-events:auto;}
.win-action{position:relative;z-index:10000;pointer-events:auto !important;touch-action:manipulation;}

/* Star fills roughly 70–80% of each piece. */
.cell .piece-star{
  font-size:80% !important;
  font-weight:1000;
  color:#fff9b0 !important;
  -webkit-text-stroke:1px rgba(125,83,0,.55);
  text-shadow:
    0 2px 0 rgba(116,72,0,.65),
    0 0 3px rgba(255,255,255,.95),
    0 0 8px rgba(255,214,45,.8);
  transform:translate(-50%,-53%) scale(1.02);
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.42));
}
.cell.p2 .piece-star{color:#fff3d0 !important;-webkit-text-stroke:1px rgba(130,0,0,.55);}
.reserve-piece .reserve-star{
  font-size:76% !important;
  font-weight:1000;
  color:#fff8b0 !important;
  -webkit-text-stroke:1px rgba(120,75,0,.5);
  text-shadow:0 1px 0 rgba(90,50,0,.6),0 0 5px rgba(255,210,40,.8);
}

@media(max-width:600px){
  .cell .piece-star{font-size:72% !important;-webkit-text-stroke:.7px rgba(125,83,0,.55);}
  .reserve-piece .reserve-star{font-size:74% !important;}
  .cell .star-sparkle,.reserve-piece .star-sparkle{width:4px;height:4px;}
  .cell .star-sparkle:before,.cell .star-sparkle:after,.reserve-piece .star-sparkle:before,.reserve-piece .star-sparkle:after{height:11px;}
}
@media(prefers-reduced-motion:reduce){
  .cell .star-sparkle,.reserve-piece .star-sparkle{animation:none;opacity:.45;}
}


/* FINAL V9: one large star only; remove legacy smaller pseudo-star. */
.cell.p1:before,.cell.p2:before,.reserve-piece:after,.drop-preview:after{content:none !important;}
.cell .piece-star{
  font-size:76% !important;
  transform:translate(-50%,-54%) scale(1.04);
}
.cell.p2 .piece-star{font-size:80% !important;}
.board.match-finished{pointer-events:none !important;}
.board.match-finished .cell{pointer-events:none !important;cursor:default !important;}
.board.match-finished .cell:focus{outline:none !important;}
.board.match-finished .cell:disabled{opacity:1;}


/* ================================================================
   V9: BOARD PIECE STAR = 100%
   ================================================================ */
.cell .piece-star{
  font-size:100% !important;
  line-height:1 !important;
  width:100% !important;
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  transform:translate(-50%,-50%) scale(1) !important;
  transform-origin:center !important;
  box-sizing:border-box !important;
  padding:0 !important;
}
.cell.p2 .piece-star{font-size:100% !important;}

@media(max-width:600px){
  .cell .piece-star,
  .cell.p2 .piece-star{
    font-size:100% !important;
    width:100% !important;
    height:100% !important;
  }
}

/* V9 final override: board piece stars fill the full piece */
.cell .piece-star,
.cell.p2 .piece-star{
  font-size:100% !important;
  width:100% !important;
  height:100% !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  transform:translate(-50%,-50%) !important;
  transform-origin:center center !important;
}

/* ================================================================
   V14 CARROM-STYLE FULLSCREEN GAME LAYOUT
   Inspired by the supplied mobile reference: player header,
   centered board, fixed bottom controls, zero page scrolling.
   ================================================================ */
html,body.v14-game{width:100%;height:100%;height:100dvh;min-height:0;overflow:hidden!important;overscroll-behavior:none;touch-action:manipulation}
body.v14-game{margin:0;background:radial-gradient(circle at 50% 42%,#a93b47 0%,#6d142b 48%,#430c1d 100%)!important;font-family:Arial,Helvetica,sans-serif}
.v14-screen{position:relative;width:100%;height:100%;height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);isolation:isolate}
.v14-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 34%,rgba(255,197,145,.13),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 22%,rgba(0,0,0,.13));pointer-events:none;z-index:-1}
.v14-top{flex:0 0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:10px 12px 7px;color:#fff;text-shadow:0 2px 3px #0009;z-index:5}
.v14-player{display:flex;align-items:center;gap:7px;min-width:0}
.v14-right{justify-content:flex-end;text-align:right}
.v14-avatar{width:54px;height:54px;flex:0 0 54px;border-radius:12px;border:3px solid #e7b24c;background:linear-gradient(145deg,#3e89d7,#082f68);display:grid;place-items:center;font-size:28px;box-shadow:0 4px 10px #0008,inset 0 1px 0 #fff8;overflow:hidden}
.v14-right .v14-avatar{background:linear-gradient(145deg,#4c9a98,#143d4b)}
.v14-player-info{display:flex;flex-direction:column;min-width:0;line-height:1.12}
.v14-player-info b{font-size:13px;max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v14-player-info span{font-size:10px;color:#ffe9cf;white-space:nowrap;margin-top:4px}
.v14-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;box-shadow:0 1px 2px #0008;vertical-align:-1px}
.v14-dot.yellow{background:#ffd400;border:1px solid #fff0a0}.v14-dot.red{background:#f52a31;border:1px solid #ffaaa8}
.v14-match{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:90px;text-align:center}
.v14-coin{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:25px;color:#fff1a6;background:radial-gradient(circle at 32% 28%,#fff7b0,#ffd32e 35%,#d88a0d 74%,#7b3c00);border:2px solid #ffe08a;box-shadow:0 0 18px #ffc62f88,0 3px 7px #0008}
.v14-match strong{font-size:14px;margin-top:3px;letter-spacing:.7px}.v14-match span{font-size:8px;color:#ffd77a;margin-top:3px;font-weight:900;letter-spacing:1px}
.v14-status-row{flex:0 0 auto;display:flex;justify-content:center;align-items:center;gap:10px;margin:0 12px 5px;padding:5px 10px;border:1px solid #ffffff22;border-radius:999px;background:#230b1688;color:#ffe9d2;font-size:10px;box-shadow:0 4px 10px #0004;z-index:4}
.v14-status-row .v14-timer{color:#fff;font-weight:800}.v14-status-row #connectionStatus{opacity:.85}
.v14-main{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;padding:4px 8px 5px;position:relative;z-index:2}
.v14-board-wrap{width:min(94vw,470px,calc(100dvh - 205px));max-width:470px;margin:0!important;border:8px solid #d7a832!important;border-radius:22px!important;padding:9px!important;background:linear-gradient(145deg,#7b4216,#d89b43 18%,#a96220 52%,#6d3610)!important;box-shadow:0 8px 24px #000a,inset 0 0 0 3px #ffd95c,inset 0 0 22px #3e1908!important}
.v14-board-wrap:before{content:"";position:absolute;inset:7px;border-radius:14px;pointer-events:none;border:1px solid #fff4;box-shadow:inset 0 0 25px #3c170866;z-index:0}
.v14-board-wrap .board{position:relative;z-index:2;gap:7px;width:100%}
.v14-board-wrap .cell{border-color:#5b2b08!important;box-shadow:inset 0 6px 7px #0008,0 2px 2px #0007!important}
.v14-board-wrap .cell.p1{border-color:#b89a00!important}.v14-board-wrap .cell.p2{border-color:#970005!important}
.v14-bottom{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:7px 18px calc(7px + env(safe-area-inset-bottom));z-index:10;background:linear-gradient(180deg,transparent,#390b1a88 28%,#2b0814cc);box-shadow:0 -8px 20px #25061055}
.v14-control{appearance:none;border:1px solid #ffd451;color:#fff;text-decoration:none;background:radial-gradient(circle at 35% 25%,#ffd84e,#ef9b0e 62%,#8a4100);border-radius:50%;width:58px;height:58px;justify-self:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;box-shadow:0 0 14px #ffbf3d66,0 4px 8px #0008,inset 0 2px 0 #fff9;cursor:pointer;touch-action:manipulation}
.v14-control:active{transform:scale(.94)}
.v14-control-icon{font-size:23px;line-height:22px;text-shadow:0 2px 2px #6b2d00}.v14-control small{font-size:7px;font-weight:900;text-transform:uppercase;letter-spacing:.3px;text-shadow:0 1px 2px #5c2300}
.v14-control:disabled{opacity:.48;filter:saturate(.45);cursor:not-allowed}
.v14-rematch-control[hidden]{display:flex!important}
.v14-rematch-control[disabled]{opacity:.45;filter:saturate(.3)}
.v14-chat{position:absolute;left:12px;right:12px;bottom:82px;width:auto!important;max-width:430px;margin:0!important;background:#2a0d15ee!important;border:1px solid #f0b94e!important;border-radius:16px!important;overflow:hidden;z-index:30;transform:translateY(120%);opacity:0;pointer-events:none;transition:transform .22s ease,opacity .22s ease;box-shadow:0 14px 35px #000b!important}
.v14-game.chat-open .v14-chat{transform:translateY(0);opacity:1;pointer-events:auto}
.v14-chat .chat-title{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;font-size:14px;font-weight:900;border-bottom:1px solid #ffffff18}
.v14-chat .chat-title button{border:0;background:none;color:#fff;font-size:24px;line-height:1;cursor:pointer}
.v14-chat #messages{max-height:145px;overflow:auto;padding:7px 11px}.v14-chat .msg{font-size:12px;padding:5px 0;border-color:#ffffff14}.v14-chat .quick-chat{padding:6px;border-top:1px solid #ffffff14}.v14-chat .quick-chat button{background:#4a1821;border-color:#e0a43c;color:#fff;border-radius:7px}
.v14-chat form{display:flex;border-top:1px solid #ffffff18}.v14-chat input{flex:1;padding:11px;background:#17070c;color:#fff;border:0;outline:0}.v14-chat form button{width:48px;background:#d88e18;color:#fff;border:0}
.v14-hidden-tools{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.v14-game .waiting-note{position:absolute;top:96px;left:50%;transform:translateX(-50%);z-index:20;margin:0;padding:7px 10px;max-width:85vw;background:#270b15ee;border:1px solid #e7ad42;border-radius:9px;color:#ffd87a;font-size:10px}
.v14-game .win-banner{z-index:9999}
.v14-game .win-action{touch-action:manipulation}
@media(max-width:380px){
  .v14-top{padding-left:8px;padding-right:8px;gap:4px}.v14-avatar{width:47px;height:47px;flex-basis:47px}.v14-player-info b{max-width:78px;font-size:11px}.v14-player-info span{font-size:8px}.v14-coin{width:35px;height:35px;font-size:20px}.v14-match strong{font-size:11px}.v14-status-row{font-size:9px;gap:7px}.v14-main{padding-left:5px;padding-right:5px}.v14-board-wrap{width:min(96vw,calc(100dvh - 190px));border-width:6px!important;padding:7px!important;border-radius:18px!important}.v14-board-wrap .board{gap:5px}.v14-bottom{gap:5px;padding-left:8px;padding-right:8px}.v14-control{width:51px;height:51px}.v14-control-icon{font-size:20px}.v14-control small{font-size:6px}
}
@media(max-height:650px){
  .v14-top{padding-top:5px;padding-bottom:3px}.v14-avatar{width:43px;height:43px;flex-basis:43px}.v14-coin{width:34px;height:34px;font-size:19px}.v14-status-row{margin-bottom:2px;padding:3px 8px}.v14-bottom{padding-top:4px;padding-bottom:4px}.v14-control{width:48px;height:48px}.v14-main{padding-top:2px;padding-bottom:2px}
}

/* V15 profile images, coins and in-game message bubbles */
.v14-avatar img{width:100%;height:100%;object-fit:cover;display:block}.v14-bubble{display:none;max-width:120px;margin-top:4px;padding:3px 7px;border-radius:8px;background:linear-gradient(180deg,#fff8d8,#f0c45a);color:#4b2108;font-size:8px;font-weight:900;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 2px 5px #0008;position:relative}.v14-bubble.show{display:block;animation:msgPop .2s ease-out}.v14-bubble:after{content:"";position:absolute;top:-4px;left:12px;border-width:0 4px 4px;border-style:solid;border-color:transparent transparent #fff8d8 transparent}.v14-right .v14-bubble{margin-left:auto}.v14-right .v14-bubble:after{left:auto;right:12px}@keyframes msgPop{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}

/* ================================================================
   V16 IN-GAME PLAYER PROFILE + SELECTABLE ONLINE STAKE
   ================================================================ */
.v14-profile-trigger{appearance:none;padding:0;cursor:pointer;color:inherit}.v14-profile-trigger:active{transform:scale(.96)}
.profile-modal{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;padding:14px;box-sizing:border-box}.profile-modal.show{display:flex}.profile-modal-backdrop{position:absolute;inset:0;background:rgba(20,3,8,.72);backdrop-filter:blur(4px)}
.profile-card-game{position:relative;width:min(92vw,430px);max-height:min(88dvh,720px);overflow:auto;box-sizing:border-box;padding:14px;background:linear-gradient(180deg,#9a481f,#54210f 82%);border:3px solid #e5a23d;border-radius:18px;box-shadow:0 12px 35px #000b,inset 0 1px 0 #fff5;color:#fff;scrollbar-width:thin}
.profile-modal-close{position:absolute;right:-2px;top:-2px;width:42px;height:42px;border-radius:50%;border:2px solid #ffcc62;background:linear-gradient(180deg,#ff6956,#c71916);color:#fff;font-size:28px;font-weight:900;line-height:1;box-shadow:0 4px 10px #0008;z-index:3;cursor:pointer}
.profile-hero{display:flex;gap:12px;align-items:center;background:linear-gradient(180deg,#5f2b17,#3a170d);border:1px solid #c57b2f;border-radius:12px;padding:12px;margin-bottom:9px}.profile-hero-avatar{width:112px;height:112px;flex:0 0 112px;border-radius:14px;border:4px solid #dca34b;background:linear-gradient(145deg,#3f8ad7,#092d64);display:grid;place-items:center;font-size:62px;overflow:hidden;box-shadow:0 4px 10px #0008,inset 0 2px 0 #fff7}.profile-hero-avatar img{width:100%;height:100%;object-fit:cover}.profile-hero-main{min-width:0;flex:1}.profile-name{font-size:25px;font-weight:900;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-id{font-size:11px;color:#ffe6a7;margin-top:5px}.profile-rank-row{display:flex;align-items:center;justify-content:space-between;margin-top:7px;font-size:14px}.profile-rank-row span{color:#ffd44e;font-weight:900}.profile-rank-row b{color:#fff;font-size:18px}.profile-progress{height:13px;background:#271009;border-radius:10px;overflow:hidden;margin-top:8px;box-shadow:inset 0 2px 4px #000}.profile-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffcc2e,#ffe977,#ffb316);box-shadow:0 0 9px #ffd23f;transition:width .3s}.profile-progress-text{font-size:10px;color:#ffdca0;text-align:right;margin-top:3px}
.profile-game-panels{display:grid;grid-template-columns:1.15fr .85fr;gap:9px}.profile-game-panel{min-height:130px;background:#3b1b10;border:1px solid #7d4829;border-radius:11px;padding:9px;box-sizing:border-box;text-align:center}.profile-panel-title{font-size:16px;font-weight:900}.profile-panel-sub{font-size:10px;margin-top:2px;color:#ffe1b1}.profile-force{display:grid;grid-template-columns:28px 1fr 78px;align-items:center;gap:4px;margin-top:8px;text-align:left;font-size:11px}.profile-force i{height:9px;border-radius:6px;background:repeating-linear-gradient(90deg,#25e55d 0 7px,#080706 7px 13px);box-shadow:inset 0 1px 2px #000}.profile-pieces .mini-pieces{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:12px}.mini-pieces span{height:38px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:radial-gradient(circle at 35% 25%,#fff7a8,#ffc832 45%,#a95b05);border:2px solid #ffdd69;box-shadow:0 0 8px #ffc52e88,inset 0 2px 0 #fff8}
.profile-medals{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:9px}.profile-medals>div{min-height:100px;background:#3b1b10;border:1px solid #7d4829;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:8px;box-sizing:border-box}.profile-medals b{font-size:15px}.profile-medals span{font-size:43px;opacity:.75}.profile-winnings{margin-top:9px;padding:10px;background:#3b1b10;border:1px solid #7d4829;border-radius:10px;text-align:center;font-size:17px;font-weight:900}.profile-winnings strong{color:#ffd44e}.profile-stats-list{margin-top:9px;background:#3b1b10;border:1px solid #7d4829;border-radius:10px;padding:11px;font-size:13px;line-height:1.75}.profile-stats-list strong{color:#ffd44e}.profile-card-game::-webkit-scrollbar{width:5px}.profile-card-game::-webkit-scrollbar-thumb{background:#d08b34;border-radius:8px}
@media(max-width:380px){.profile-card-game{padding:10px;max-height:90dvh}.profile-hero-avatar{width:88px;height:88px;flex-basis:88px;font-size:48px}.profile-name{font-size:20px}.profile-game-panel{min-height:115px}.profile-medals>div{min-height:85px}.profile-medals span{font-size:34px}.profile-stats-list{font-size:12px}}

/* V21: Theme controls now visibly affect the premium V14/V20 game UI. */
.v14-game.light-game{background:#eef3f8!important;color:#172033!important}
.v14-game.light-game .v14-screen:before{background:linear-gradient(180deg,#ffffffaa,#e9f0f8 55%,#d9e4ef)!important}
.v14-game.light-game .v14-top,.v14-game.light-game .v14-status-row{color:#162238;text-shadow:none}
.v14-game.light-game .v14-match,.v14-game.light-game .v14-status-row{background:rgba(255,255,255,.82)!important;border-color:#b9c9da!important;color:#25364d!important}
.v14-game.light-game .v14-player-info span{color:#40556d!important}
.v14-game.light-game .v14-bottom{background:linear-gradient(180deg,transparent,#d5e0ec)!important}
.v14-game.light-game .v14-control{color:#3b2600}
.v14-game.light-game .v14-board-wrap{background:linear-gradient(145deg,#dbe8f4,#ffffff 25%,#b9d0e5 58%,#8daac4)!important;border-color:#6d8eaa!important;box-shadow:0 8px 24px #7b8da033,inset 0 0 0 3px #ffffff,inset 0 0 22px #526b7a44!important}
.v14-game.light-game .v14-board-wrap:before{border-color:#ffffffaa;box-shadow:inset 0 0 25px #70869b33}
.v14-game.neon-game{background:#090014!important}
.v14-game.neon-game .v14-screen:before{background:radial-gradient(circle at 50% 35%,#7c1cff55,transparent 35%),linear-gradient(180deg,#15002c,#03000b)!important}
.v14-game.neon-game .v14-top{background:linear-gradient(180deg,#17002fdd,#080016cc);border-bottom:1px solid #b22cff66}
.v14-game.neon-game .v14-match,.v14-game.neon-game .v14-status-row{background:#18002ddd!important;border-color:#a52cff88!important;color:#e9c8ff!important;box-shadow:0 0 18px #7c1cff55}
.v14-game.neon-game .v14-board-wrap{background:linear-gradient(145deg,#2a0052,#001b52)!important;border-color:#7c1cff!important;box-shadow:0 0 25px #7c1cff,inset 0 0 0 3px #00eaff!important}
.v14-game.neon-game .v14-board-wrap .cell{border-color:#6d22a8!important;box-shadow:0 0 10px #00eaff,inset 0 6px 7px #0008!important}
.v14-game.neon-game .v14-bottom{background:linear-gradient(180deg,transparent,#21003acc)!important}
.v14-game.ocean-game{background:#062332!important}
.v14-game.ocean-game .v14-screen:before{background:linear-gradient(180deg,#0a536a,#03202f)!important}
.v14-game.ocean-game .v14-top{background:linear-gradient(180deg,#0b4054,#072634);border-bottom-color:#24d6e866}
.v14-game.ocean-game .v14-match,.v14-game.ocean-game .v14-status-row{background:#0c3c4fdd!important;border-color:#18b9d888!important;color:#d5faff!important}
.v14-game.ocean-game .v14-board-wrap{background:linear-gradient(145deg,#0b8aa6,#07527b)!important;border-color:#0aa8c2!important;box-shadow:0 8px 24px #001b25aa,inset 0 0 0 3px #5eeeff!important}
.v14-game.ocean-game .v14-bottom{background:linear-gradient(180deg,transparent,#042c3dcc)!important}
.v14-game.neon-game .v14-control,.v14-game.ocean-game .v14-control{filter:saturate(1.2)}

/* V22: Daylight blue-board theme */
.v14-game.day-game{background:#bfe7ff!important;color:#12314a!important}
.v14-game.day-game .v14-screen:before{background:radial-gradient(circle at 78% 8%,#fff8c9 0 5%,transparent 16%),linear-gradient(180deg,#8fd8ff 0%,#d9f4ff 48%,#b7e3f7 100%)!important}
.v14-game.day-game .v14-top{background:linear-gradient(180deg,#eafaffee,#a8dfffcc);border-bottom:1px solid #5aa8d4;color:#12314a}
.v14-game.day-game .v14-player-info span,.v14-game.day-game .v14-player-info b{color:#173a55!important;text-shadow:none}
.v14-game.day-game .v14-match,.v14-game.day-game .v14-status-row{background:#ffffffc9!important;border-color:#73b9dc!important;color:#173b55!important;box-shadow:0 5px 18px #4b9bc933}
.v14-game.day-game .v14-board-wrap{background:linear-gradient(145deg,#197fe2,#0565c8 48%,#034b9d)!important;border-color:#0b62c7!important;box-shadow:0 10px 26px #28739a66,inset 0 0 0 3px #79caff,inset 0 0 25px #b8eaff55!important}
.v14-game.day-game .v14-board-wrap:before{border-color:#a9e4ff99;box-shadow:inset 0 0 28px #dff7ff44}
.v14-game.day-game .v14-bottom{background:linear-gradient(180deg,transparent,#8fcbe8dd)!important}
.v14-game.day-game .v14-control{color:#123c5b!important;text-shadow:0 1px 0 #fff8}
.v14-game.day-game .v14-control-icon{filter:saturate(1.15) drop-shadow(0 1px 1px #fff8)}
.v14-game.day-game .v14-bubble{background:#ffffffee!important;color:#153e58!important;border-color:#68b5df!important;box-shadow:0 5px 14px #28769a33}
.v14-game.day-game .v14-board-wrap .cell{box-shadow:inset 0 6px 7px #0008,0 2px 0 #72c8ff!important}

/* V23 REFERENCE-STYLE BLUE PLASTIC BOARD */
.v14-game.day-game .v14-screen,
.v14-game.day-game { background:#242424 !important; }
.v14-game.day-game .v14-screen:before{background:linear-gradient(180deg,#333 0%,#252525 55%,#222 100%)!important;}
.v14-game.day-game .v14-top{background:#343434!important;border-bottom:3px solid #252525!important;color:#fff!important;}
.v14-game.day-game .v14-player-info span,.v14-game.day-game .v14-player-info b{color:#fff!important;text-shadow:0 2px 2px #000!important;}
.v14-game.day-game .v14-match,.v14-game.day-game .v14-status-row{background:#20234b!important;border-color:#20234b!important;color:#fff!important;}
.v14-game.day-game .v14-board-wrap{
 width:min(96vw,680px,calc(100dvh - 235px))!important;
 aspect-ratio:7/6!important;
 padding:12px!important;
 border:9px solid #1266cf!important;
 border-radius:28px!important;
 background:linear-gradient(145deg,#318ff4 0%,#126fe0 28%,#0756bd 70%,#06459c 100%)!important;
 box-shadow:inset 0 2px 0 #8ed0ff,inset 0 -6px 0 #043c88,inset 0 0 0 2px #55aaff,0 10px 24px #000b!important;
}
.v14-game.day-game .v14-board-wrap:before{inset:7px!important;border-radius:20px!important;border:2px solid #6fc0ff88!important;box-shadow:inset 0 0 18px #003b8c55!important;}
.v14-game.day-game .v14-board-wrap .board{gap:7px!important;}
.v14-game.day-game .v14-board-wrap .cell{
 border:2px solid #08458f!important;
 background:radial-gradient(circle at 50% 42%,#0c3f91 0 55%,#062e72 61%,#031c49 79%,#020f2d 100%)!important;
 box-shadow:inset 0 5px 7px #000b,inset 0 -2px 3px #4b9dff66,0 2px 2px #0008!important;
}
.v14-game.day-game .v14-board-wrap .cell.p1{background:radial-gradient(circle at 31% 23%,#fffbd5 0 6%,#fff200 17%,#ffd000 58%,#c18b00 88%,#795600 100%)!important;border-color:#a87500!important;}
.v14-game.day-game .v14-board-wrap .cell.p2{background:radial-gradient(circle at 31% 23%,#ffdada 0 6%,#ff3c43 17%,#e80008 58%,#a90006 88%,#650005 100%)!important;border-color:#8e0006!important;}
.v14-game.day-game .v14-bottom{background:linear-gradient(180deg,transparent,#222 45%)!important;}

/* Same reference board for local 1 VS 1 */
.local-shell{background:#242424!important;}
.local-head{background:#343434!important;border-bottom:3px solid #252525!important;}
.local-players{background:#20234b!important;}
.local-board-area{background:linear-gradient(180deg,#242424,#222)!important;}
.local-board-wrap{
 width:min(96vw,680px,calc((100dvh - 142px)*.96))!important;
 max-width:680px!important;
 aspect-ratio:7/6!important;
 padding:12px!important;
 border:9px solid #1266cf!important;
 border-radius:28px!important;
 background:linear-gradient(145deg,#318ff4 0%,#126fe0 28%,#0756bd 70%,#06459c 100%)!important;
 box-shadow:inset 0 2px 0 #8ed0ff,inset 0 -6px 0 #043c88,inset 0 0 0 2px #55aaff,0 10px 24px #000b!important;
}
.local-board-wrap:before{content:"";position:absolute;inset:7px;border-radius:20px;border:2px solid #6fc0ff88;box-shadow:inset 0 0 18px #003b8c55;pointer-events:none;z-index:0;}
.local-board{position:relative;z-index:1;gap:7px!important;}
.local-board .lcell{
 border:2px solid #08458f!important;
 background:radial-gradient(circle at 50% 42%,#0c3f91 0 55%,#062e72 61%,#031c49 79%,#020f2d 100%)!important;
 box-shadow:inset 0 5px 7px #000b,inset 0 -2px 3px #4b9dff66,0 2px 2px #0008!important;
}
.local-board .lcell.p1{background:radial-gradient(circle at 31% 23%,#fffbd5 0 6%,#fff200 17%,#ffd000 58%,#c18b00 88%,#795600 100%)!important;border-color:#a87500!important;}
.local-board .lcell.p2{background:radial-gradient(circle at 31% 23%,#ffdada 0 6%,#ff3c43 17%,#e80008 58%,#a90006 88%,#650005 100%)!important;border-color:#8e0006!important;}
@media(max-height:700px){
 .local-board-wrap{width:min(96vw,calc(100dvh - 160px))!important;padding:8px!important;border-width:7px!important;border-radius:22px!important}
 .local-board{gap:5px!important}
}

/* ================================================================
   V27 REALISTIC PHYSICAL RESERVE TRAY
   A single wide toy-style blue plastic tray under the board.
   Only the current player's tray is shown online; both are retained
   in the DOM so local/spectator logic remains compatible.
================================================================ */
.realistic-reserve-dock{
  position:absolute!important;
  left:3%!important;
  right:3%!important;
  bottom:-91px!important;
  height:84px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  z-index:40!important;
  pointer-events:none!important;
}
.realistic-reserve-dock .reserve-tray{
  position:relative!important;
  width:100%!important;
  height:84px!important;
  min-width:0!important;
  padding:0!important;
  overflow:visible!important;
  border:0!important;
  border-radius:7px 7px 18px 18px!important;
  background:
    linear-gradient(180deg,#328df0 0%,#1375df 17%,#0863ca 57%,#0757b6 100%)!important;
  box-shadow:
    inset 0 4px 0 rgba(255,255,255,.36),
    inset 0 8px 16px rgba(255,255,255,.10),
    inset 0 -12px 15px rgba(0,32,100,.38),
    0 5px 8px rgba(0,0,0,.38),
    0 12px 20px rgba(0,0,0,.30)!important;
  transform:perspective(260px) rotateX(3deg)!important;
}
.realistic-reserve-dock .reserve-tray::before{
  content:"";
  position:absolute;
  left:6px; right:6px; top:5px; bottom:10px;
  border-radius:7px 7px 12px 12px;
  background:
    linear-gradient(180deg,rgba(0,31,100,.34),rgba(13,92,190,.14) 45%,rgba(0,26,84,.42));
  border:2px solid rgba(1,47,121,.55);
  box-shadow:
    inset 0 5px 7px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.20);
  z-index:0;
}
.realistic-reserve-dock .reserve-tray::after{
  content:"";
  position:absolute;
  left:-2px; right:-2px; bottom:-1px;
  height:17px;
  border-radius:0 0 18px 18px;
  background:linear-gradient(180deg,#1372d5,#0752ad);
  border-top:2px solid rgba(255,255,255,.22);
  box-shadow:inset 0 -5px 7px rgba(0,20,75,.35),0 4px 5px rgba(0,0,0,.25);
  z-index:5;
}
.realistic-reserve-dock .reserve-tray-label{
  display:none!important;
}
.realistic-reserve-dock .reserve-tray-inner{
  position:absolute;
  left:12px; right:12px; top:8px; bottom:14px;
  overflow:hidden;
  border-radius:8px 8px 12px 12px;
  z-index:2;
}
.realistic-reserve-dock .reserve-tray-pieces{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  overflow:hidden!important;
  white-space:normal!important;
}
.realistic-reserve-dock .reserve-piece{
  position:absolute!important;
  width:29px!important;
  height:29px!important;
  min-width:29px!important;
  flex:0 0 29px!important;
  margin:0!important;
  border-radius:50%!important;
  border:2px solid rgba(120,75,0,.42)!important;
  box-shadow:
    inset 0 4px 5px rgba(255,255,255,.70),
    inset 0 -4px 5px rgba(50,30,0,.35),
    0 3px 5px rgba(0,0,0,.48)!important;
  z-index:3;
}
.realistic-reserve-dock .reserve-piece.yellow{
  background:
    radial-gradient(circle at 31% 24%,#fffbd7 0 7%,#fff01a 19%,#ffd900 58%,#d4a900 86%,#9b7000 100%)!important;
  border-color:#b98c00!important;
}
.realistic-reserve-dock .reserve-piece.red{
  background:
    radial-gradient(circle at 31% 24%,#ffd6d6 0 7%,#ff3c42 19%,#ef1118 58%,#b90006 86%,#7c0004 100%)!important;
  border-color:#970006!important;
}
.realistic-reserve-dock .reserve-star{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  font-size:100%!important;
  line-height:1!important;
  color:rgba(255,255,255,.58)!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.55),
    0 1px 2px rgba(120,60,0,.45)!important;
  transform:none!important;
}
.realistic-reserve-dock .reserve-tray-1{display:grid;}
.realistic-reserve-dock .reserve-tray-2{display:none;}

@media(max-width:600px){
  .v14-main{overflow:visible!important;}
  .v14-board-wrap{
    overflow:visible!important;
    margin-bottom:88px!important;
  }
  .realistic-reserve-dock{
    left:2.5%!important;
    right:2.5%!important;
    bottom:-78px!important;
    height:72px!important;
  }
  .realistic-reserve-dock .reserve-tray{
    height:72px!important;
    border-radius:6px 6px 15px 15px!important;
  }
  .realistic-reserve-dock .reserve-tray-inner{
    left:9px; right:9px; top:6px; bottom:11px;
    border-radius:7px 7px 10px 10px;
  }
  .realistic-reserve-dock .reserve-piece{
    width:25px!important;
    height:25px!important;
    min-width:25px!important;
    flex-basis:25px!important;
  }
  .realistic-reserve-dock .reserve-tray::after{
    height:14px;
    border-radius:0 0 15px 15px;
  }
}


/* V27 COLOR FIX: Player 1 = RED, Player 2 = YELLOW */
.v14-dot.red{background:#f52a31;border-color:#ffaaa8}.v14-dot.yellow{background:#ffd400;border-color:#fff0a0}
.cell.p1{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%);border-color:#990005;box-shadow:inset 0 6px 7px rgba(255,255,255,.72),inset 0 -5px 8px rgba(116,0,0,.25),0 5px 9px rgba(0,0,0,.38)}
.cell.p2{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%);border-color:#b29100;box-shadow:inset 0 6px 7px rgba(255,255,255,.82),inset 0 -5px 8px rgba(139,98,0,.25),0 5px 9px rgba(0,0,0,.38)}
.cell.p1 .piece-star{color:#fff3d0 !important;-webkit-text-stroke:1px rgba(130,0,0,.55)}
.cell.p2 .piece-star{color:#fff8a8 !important;-webkit-text-stroke:1px rgba(125,83,0,.55)}
.reserve-piece.red,.realistic-reserve-dock .reserve-piece.red{background:radial-gradient(circle at 32% 24%,#ffd0d0 0 7%,#ff3a3f 18%,#e60008 68%,#9d0005 100%);border-color:#8d0004}
.reserve-piece.yellow,.realistic-reserve-dock .reserve-piece.yellow{background:radial-gradient(circle at 32% 24%,#fffbc2 0 7%,#fff21b 18%,#ffd900 68%,#bd9d00 100%);border-color:#a98b00}
.drop-preview.red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 7%,#ff4b50 18%,#ed1016 68%,#9c0005 100%);border-color:#900005}
.drop-preview.yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 7%,#fff42b 18%,#ffdf00 68%,#b99100 100%);border-color:#a98900}

/* V34: result banner sits above the board, never over the holes */
.v14-board-wrap{overflow:visible!important}
.v14-board-wrap .win-banner{
  top:-6px!important;
  left:50%!important;
  transform:translate(-50%,-100%) scale(.92)!important;
  z-index:100!important;
}
.v14-board-wrap .win-banner.show{animation:v34BannerIn .28s ease-out forwards!important}
@keyframes v34BannerIn{
  from{opacity:0;transform:translate(-50%,-108%) scale(.82)}
  to{opacity:1;transform:translate(-50%,-100%) scale(1)}
}
@media(max-width:600px){
 .v14-board-wrap .win-banner{width:min(190px,68vw)!important;padding:7px 8px!important}
 .v14-board-wrap .win-trophy{font-size:27px!important}
 .v14-board-wrap .win-banner-title{font-size:19px!important}
 .v14-board-wrap .win-actions{gap:5px!important}
 .v14-board-wrap .win-action{min-height:28px!important;font-size:9px!important;padding:5px 8px!important}
}

/* V39: Match result is shown above the board instead of covering the board. */
.v14-game .v14-board-wrap .win-banner{
  top:52px !important;
  left:50% !important;
  transform:translate(-50%,-100%) scale(.86) !important;
  z-index:9999 !important;
}
.v14-game .v14-board-wrap .win-banner.show{
  animation:boardResultTopIn .34s cubic-bezier(.18,.82,.24,1) forwards !important;
}
@keyframes boardResultTopIn{
  0%{opacity:0;transform:translate(-50%,-88%) scale(.72);}
  70%{opacity:1;transform:translate(-50%,-100%) scale(1.04);}
  100%{opacity:1;transform:translate(-50%,-100%) scale(1);}
}


/* V41: hard-lock each player's reserve tray to their actual piece color.
   Player 1 = RED, Player 2 = YELLOW. */
.v14-game .realistic-reserve-dock .reserve-tray-1 .reserve-piece,
.v14-game .realistic-reserve-dock .reserve-tray-1 .reserve-piece.red{
  background:radial-gradient(circle at 32% 24%,#ffd0d0 0 7%,#ff3a3f 18%,#e60008 68%,#9d0005 100%) !important;
  border-color:#8d0004 !important;
}
.v14-game .realistic-reserve-dock .reserve-tray-2 .reserve-piece,
.v14-game .realistic-reserve-dock .reserve-tray-2 .reserve-piece.yellow{
  background:radial-gradient(circle at 32% 24%,#fffbc2 0 7%,#fff21b 18%,#ffd900 68%,#bd9d00 100%) !important;
  border-color:#a98b00 !important;
}

/* v42: move result 10px lower */
.result-banner, .game-result, .match-result { transform: translateY(10px); }

.bot-tag{display:inline-block;margin-left:5px;font-size:9px;line-height:1;padding:3px 5px;border-radius:5px;background:#4b4b4b;color:#fff;vertical-align:middle;letter-spacing:.5px}

/* v44: bot identity is intentionally not displayed in the game UI */
.bot-label,.computer-label,.bot-badge,.opponent-bot-label{display:none!important;}

/* V70: Custom room closed message stays centered on the game board. */
.v14-game .board-wrap{position:relative}
.v14-game .room-closed-center-message{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:10001;min-width:150px;max-width:80%;box-sizing:border-box;padding:13px 20px;text-align:center;background:rgba(20,8,10,.94);border:2px solid #e6a53d;border-radius:12px;color:#fff1b8;font-size:16px;font-weight:900;line-height:1.2;letter-spacing:.3px;box-shadow:0 8px 28px #000b,inset 0 1px 0 #fff5;pointer-events:none}

/* V71: centered, premium Custom Room closed message */
.board-wrap{position:relative !important;}
.room-closed-center-message{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  right:auto !important;
  bottom:auto !important;
  transform:translate(-50%,-50%) !important;
  z-index:10001 !important;
  width:max-content !important;
  max-width:calc(100% - 32px) !important;
  box-sizing:border-box !important;
  padding:14px 24px !important;
  text-align:center !important;
  white-space:nowrap !important;
  background:linear-gradient(180deg,rgba(12,25,42,.96),rgba(5,13,25,.96)) !important;
  border:1px solid rgba(255,215,112,.75) !important;
  border-radius:16px !important;
  color:#ffe9a6 !important;
  font-size:clamp(17px,3.5vw,25px) !important;
  font-weight:900 !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  text-shadow:0 2px 8px rgba(0,0,0,.7) !important;
  box-shadow:0 12px 34px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.18),0 0 22px rgba(255,196,72,.16) !important;
  pointer-events:none !important;
  animation:roomClosedPremiumIn .28s cubic-bezier(.2,.8,.2,1) both !important;
}
.room-closed-center-message:before{
  content:'🔒' !important;
  margin-right:9px !important;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.45));
}
@keyframes roomClosedPremiumIn{
  from{opacity:0;transform:translate(-50%,-50%) scale(.86) !important;}
  to{opacity:1;transform:translate(-50%,-50%) scale(1) !important;}
}
@media(max-width:700px){
  .room-closed-center-message{
    padding:11px 17px !important;
    font-size:16px !important;
    letter-spacing:1px !important;
    max-width:calc(100% - 24px) !important;
  }
}

/* Player-selected equipment piece colors */
.cell.pc-red,.drop-preview.red,.reserve-piece.red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%);border-color:#990005}
.cell.pc-blue,.drop-preview.blue,.reserve-piece.blue{background:radial-gradient(circle at 32% 24%,#d7efff 0 6%,#48a8ff 17%,#0875e1 58%,#0454a9 84%,#02326d 100%);border-color:#0753a4}
.cell.pc-green,.drop-preview.green,.reserve-piece.green{background:radial-gradient(circle at 32% 24%,#d9ffd8 0 6%,#63ed69 17%,#16b52e 58%,#07811b 84%,#03540f 100%);border-color:#08751a}
.cell.pc-yellow,.drop-preview.yellow,.reserve-piece.yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%);border-color:#b29100}
.cell.pc-purple,.drop-preview.purple,.reserve-piece.purple{background:radial-gradient(circle at 32% 24%,#f0d9ff 0 6%,#c56cff 17%,#8529d6 58%,#5d159d 84%,#3b0a69 100%);border-color:#6c1ca8}
.cell.pc-orange,.drop-preview.orange,.reserve-piece.orange{background:radial-gradient(circle at 32% 24%,#ffe0c2 0 6%,#ffad42 17%,#f46a00 58%,#b84600 84%,#7a2800 100%);border-color:#b64a00}
.cell.pc-pink,.drop-preview.pink,.reserve-piece.pink{background:radial-gradient(circle at 32% 24%,#ffe1f1 0 6%,#ff8fc5 17%,#f03891 58%,#b81766 84%,#760d43 100%);border-color:#b81766}
.cell.pc-cyan,.drop-preview.cyan,.reserve-piece.cyan{background:radial-gradient(circle at 32% 24%,#d9ffff 0 6%,#66f2ff 17%,#00b9d4 58%,#087f98 84%,#045466 100%);border-color:#078ca4}
.cell.pc-black,.drop-preview.black,.reserve-piece.black{background:radial-gradient(circle at 32% 24%,#eeeeee 0 6%,#888 17%,#333 58%,#171717 84%,#050505 100%);border-color:#111}
.cell.pc-white,.drop-preview.white,.reserve-piece.white{background:radial-gradient(circle at 32% 24%,#ffffff 0 7%,#f4f4f4 22%,#d8d8d8 62%,#a9a9a9 86%,#777 100%);border-color:#999}

/* EQUIPMENT PIECE COLORS: all selectable player colors render consistently on the board. */
.cell.pc-blue,.drop-preview.blue,.reserve-piece.blue{background:radial-gradient(circle at 32% 24%,#d5e9ff 0 6%,#3494ff 17%,#0875e1 58%,#0452a7 84%,#02366f 100%);border-color:#064d9c}
.cell.pc-green,.drop-preview.green,.reserve-piece.green{background:radial-gradient(circle at 32% 24%,#d8ffd9 0 6%,#48df58 17%,#16b52e 58%,#0b7d1d 84%,#075314 100%);border-color:#08771b}
.cell.pc-purple,.drop-preview.purple,.reserve-piece.purple{background:radial-gradient(circle at 32% 24%,#f0d9ff 0 6%,#b55df0 17%,#8529d6 58%,#5a1798 84%,#3b0d65 100%);border-color:#5b1995}
.cell.pc-orange,.drop-preview.orange,.reserve-piece.orange{background:radial-gradient(circle at 32% 24%,#ffe0c5 0 6%,#ff9846 17%,#f46a00 58%,#b74600 84%,#7d2e00 100%);border-color:#b64b00}
.cell.pc-pink,.drop-preview.pink,.reserve-piece.pink{background:radial-gradient(circle at 32% 24%,#ffd9ec 0 6%,#ff70b2 17%,#f03891 58%,#b91e68 84%,#7b1246 100%);border-color:#b31d66}
.cell.pc-cyan,.drop-preview.cyan,.reserve-piece.cyan{background:radial-gradient(circle at 32% 24%,#d8fbff 0 6%,#42e4f4 17%,#00b9d4 58%,#087d92 84%,#045360 100%);border-color:#087f92}
.cell.pc-black,.drop-preview.black,.reserve-piece.black{background:radial-gradient(circle at 32% 24%,#888 0 6%,#3d3d3d 17%,#111 58%,#080808 84%,#000 100%);border-color:#000}
.cell.pc-white,.drop-preview.white,.reserve-piece.white{background:radial-gradient(circle at 32% 24%,#fff 0 6%,#fafafa 17%,#eee 58%,#cfcfcf 84%,#aaa 100%);border-color:#999}
/* Selected color also controls the active player's drop preview. */

/* FINAL FIX: equipment colors must override the legacy .cell.p1/.cell.p2 rules. */
.cell.pc-red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%) !important;border-color:#990005 !important}
.cell.pc-blue{background:radial-gradient(circle at 32% 24%,#d5e9ff 0 6%,#3494ff 17%,#0875e1 58%,#0452a7 84%,#02366f 100%) !important;border-color:#064d9c !important}
.cell.pc-green{background:radial-gradient(circle at 32% 24%,#d8ffd9 0 6%,#48df58 17%,#16b52e 58%,#0b7d1d 84%,#075314 100%) !important;border-color:#08771b !important}
.cell.pc-yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%) !important;border-color:#b29100 !important}
.cell.pc-purple{background:radial-gradient(circle at 32% 24%,#f0d9ff 0 6%,#b55df0 17%,#8529d6 58%,#5a1798 84%,#3b0d65 100%) !important;border-color:#5b1995 !important}
.cell.pc-orange{background:radial-gradient(circle at 32% 24%,#ffe0c5 0 6%,#ff9846 17%,#f46a00 58%,#b74600 84%,#7d2e00 100%) !important;border-color:#b64b00 !important}
.cell.pc-pink{background:radial-gradient(circle at 32% 24%,#ffd9ec 0 6%,#ff70b2 17%,#f03891 58%,#b91e68 84%,#7b1246 100%) !important;border-color:#b31d66 !important}
.cell.pc-cyan{background:radial-gradient(circle at 32% 24%,#d8fbff 0 6%,#42e4f4 17%,#00b9d4 58%,#087d92 84%,#045360 100%) !important;border-color:#087f92 !important}
.cell.pc-black{background:radial-gradient(circle at 32% 24%,#888 0 6%,#3d3d3d 17%,#111 58%,#080808 84%,#000 100%) !important;border-color:#000 !important}
.cell.pc-white{background:radial-gradient(circle at 32% 24%,#fff 0 6%,#fafafa 17%,#eee 58%,#cfcfcf 84%,#aaa 100%) !important;border-color:#999 !important}

/* V42: Equipment piece colors also control the visible reserve tray pieces and
   the small color indicators beside each player name. */
.v14-game .realistic-reserve-dock .reserve-piece.red{background:radial-gradient(circle at 32% 24%,#ffd0d0 0 7%,#ff3a3f 18%,#e60008 68%,#9d0005 100%) !important;border-color:#8d0004 !important}
.v14-game .realistic-reserve-dock .reserve-piece.blue{background:radial-gradient(circle at 32% 24%,#d5ecff 0 7%,#39a7ff 18%,#0877df 68%,#03438f 100%) !important;border-color:#033b7d !important}
.v14-game .realistic-reserve-dock .reserve-piece.green{background:radial-gradient(circle at 32% 24%,#d9ffd9 0 7%,#49d36b 18%,#16a348 68%,#075d29 100%) !important;border-color:#075326 !important}
.v14-game .realistic-reserve-dock .reserve-piece.yellow{background:radial-gradient(circle at 32% 24%,#fffbc2 0 7%,#fff21b 18%,#ffd900 68%,#bd9d00 100%) !important;border-color:#a98b00 !important}
.v14-game .realistic-reserve-dock .reserve-piece.purple{background:radial-gradient(circle at 32% 24%,#efd8ff 0 7%,#b45cff 18%,#7625c9 68%,#43117a 100%) !important;border-color:#421176 !important}
.v14-game .realistic-reserve-dock .reserve-piece.orange{background:radial-gradient(circle at 32% 24%,#ffe0bd 0 7%,#ff9b32 18%,#f06a00 68%,#9a3d00 100%) !important;border-color:#8f3900 !important}
.v14-game .realistic-reserve-dock .reserve-piece.pink{background:radial-gradient(circle at 32% 24%,#ffdff0 0 7%,#ff72b6 18%,#ed287c 68%,#a20e4d 100%) !important;border-color:#980d48 !important}
.v14-game .realistic-reserve-dock .reserve-piece.cyan{background:radial-gradient(circle at 32% 24%,#d9ffff 0 7%,#49e7f5 18%,#0bb7d1 68%,#05687a 100%) !important;border-color:#056477 !important}
.v14-game .realistic-reserve-dock .reserve-piece.black{background:radial-gradient(circle at 32% 24%,#777 0 7%,#333 18%,#151515 68%,#050505 100%) !important;border-color:#000 !important}
.v14-game .realistic-reserve-dock .reserve-piece.white{background:radial-gradient(circle at 32% 24%,#fff 0 7%,#f7f7f7 30%,#d7d7d7 68%,#aaa 100%) !important;border-color:#999 !important}
.v14-game .v14-dot.blue{background:#2196ff !important}.v14-game .v14-dot.green{background:#24c95a !important}.v14-game .v14-dot.purple{background:#9b43e8 !important}.v14-game .v14-dot.orange{background:#ff8a22 !important}.v14-game .v14-dot.pink{background:#f24f9a !important}.v14-game .v14-dot.cyan{background:#18c9dc !important}.v14-game .v14-dot.black{background:#222 !important}.v14-game .v14-dot.white{background:#eee !important}

/* V43 FINAL: Theme-independent equipment piece colors.
   Theme styles may target .cell.p1/.cell.p2 with !important; these more-specific
   rules ensure the player's selected Equipment color always wins. */
.v14-game .v14-board-wrap .cell.pc-red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%) !important;border-color:#990005 !important}
.v14-game .v14-board-wrap .cell.pc-blue{background:radial-gradient(circle at 32% 24%,#d5e9ff 0 6%,#3494ff 17%,#0875e1 58%,#0452a7 84%,#02366f 100%) !important;border-color:#064d9c !important}
.v14-game .v14-board-wrap .cell.pc-green{background:radial-gradient(circle at 32% 24%,#d8ffd9 0 6%,#48df58 17%,#16b52e 58%,#0b7d1d 84%,#075314 100%) !important;border-color:#08771b !important}
.v14-game .v14-board-wrap .cell.pc-yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%) !important;border-color:#b29100 !important}
.v14-game .v14-board-wrap .cell.pc-purple{background:radial-gradient(circle at 32% 24%,#f0d9ff 0 6%,#b55df0 17%,#8529d6 58%,#5a1798 84%,#3b0d65 100%) !important;border-color:#5b1995 !important}
.v14-game .v14-board-wrap .cell.pc-orange{background:radial-gradient(circle at 32% 24%,#ffe0c5 0 6%,#ff9846 17%,#f46a00 58%,#b74600 84%,#7d2e00 100%) !important;border-color:#b64b00 !important}
.v14-game .v14-board-wrap .cell.pc-pink{background:radial-gradient(circle at 32% 24%,#ffd9ec 0 6%,#ff70b2 17%,#f03891 58%,#b91e68 84%,#7b1246 100%) !important;border-color:#b31d66 !important}
.v14-game .v14-board-wrap .cell.pc-cyan{background:radial-gradient(circle at 32% 24%,#d8fbff 0 6%,#42e4f4 17%,#00b9d4 58%,#087d92 84%,#045360 100%) !important;border-color:#087f92 !important}
.v14-game .v14-board-wrap .cell.pc-black{background:radial-gradient(circle at 32% 24%,#888 0 6%,#3d3d3d 17%,#111 58%,#080808 84%,#000 100%) !important;border-color:#000 !important}
.v14-game .v14-board-wrap .cell.pc-white{background:radial-gradient(circle at 32% 24%,#fff 0 6%,#fafafa 17%,#eee 58%,#cfcfcf 84%,#aaa 100%) !important;border-color:#999 !important}

/* V44 FINAL OVERRIDE: Equipment piece color ALWAYS wins over every theme.
   The day/blue theme has later .cell.p1/.cell.p2 rules with equal specificity.
   Duplicate the root class only to raise specificity without changing the DOM. */
.v14-game.v14-game .v14-board-wrap .cell.pc-red{background:radial-gradient(circle at 32% 24%,#ffd1d1 0 6%,#ff4b50 17%,#f10c13 58%,#c00006 84%,#8d0004 100%) !important;border-color:#990005 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-blue{background:radial-gradient(circle at 32% 24%,#d5e9ff 0 6%,#3494ff 17%,#0875e1 58%,#0452a7 84%,#02366f 100%) !important;border-color:#064d9c !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-green{background:radial-gradient(circle at 32% 24%,#d8ffd9 0 6%,#48df58 17%,#16b52e 58%,#0b7d1d 84%,#075314 100%) !important;border-color:#08771b !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-yellow{background:radial-gradient(circle at 32% 24%,#fffbd0 0 6%,#fff42b 17%,#ffdf00 58%,#d2af00 84%,#a88b00 100%) !important;border-color:#b29100 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-purple{background:radial-gradient(circle at 32% 24%,#f0d9ff 0 6%,#b55df0 17%,#8529d6 58%,#5a1798 84%,#3b0d65 100%) !important;border-color:#5b1995 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-orange{background:radial-gradient(circle at 32% 24%,#ffe0c5 0 6%,#ff9846 17%,#f46a00 58%,#b74600 84%,#7d2e00 100%) !important;border-color:#b64b00 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-pink{background:radial-gradient(circle at 32% 24%,#ffd9ec 0 6%,#ff70b2 17%,#f03891 58%,#b91e68 84%,#7b1246 100%) !important;border-color:#b31d66 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-cyan{background:radial-gradient(circle at 32% 24%,#d8fbff 0 6%,#42e4f4 17%,#00b9d4 58%,#087d92 84%,#045360 100%) !important;border-color:#087f92 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-black{background:radial-gradient(circle at 32% 24%,#888 0 6%,#3d3d3d 17%,#111 58%,#080808 84%,#000 100%) !important;border-color:#000 !important}
.v14-game.v14-game .v14-board-wrap .cell.pc-white{background:radial-gradient(circle at 32% 24%,#fff 0 6%,#fafafa 17%,#eee 58%,#cfcfcf 84%,#aaa 100%) !important;border-color:#999 !important}