/* =====================================================================
   تم جدید «شب طلایی» — روی style.css و بقیه بار میشه و فقط ظاهر رو عوض می‌کنه
   ===================================================================== */
:root{
  --bg:#0b0912; --bg2:#141020; --card:#181326; --card2:#221a34; --line:#34284d;
  --text:#f4ecdf; --muted:#a99cbd; --gold:#e3b04b; --gold2:#ffd57e; --red:#e2574c; --green:#3fcf8e;
  --accent:#8b5cf6; --accent2:#ec4899;
  --glass:rgba(28,22,44,.72); --glass-b:rgba(255,213,126,.14);
  --r:18px;
  --nav-h:68px;
}
html,body{background:var(--bg)}
body{
  background:
    radial-gradient(900px 520px at 85% -120px,#4a2a7a55 0%,transparent 60%),
    radial-gradient(700px 480px at -10% 30%,#7a3a1a44 0%,transparent 60%),
    radial-gradient(800px 600px at 50% 120%,#2a1450 0%,transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:radial-gradient(#ffffff14 1px,transparent 1px);background-size:22px 22px;
  mask-image:linear-gradient(180deg,#000 0%,transparent 70%);-webkit-mask-image:linear-gradient(180deg,#000 0%,transparent 70%)}
#app{position:relative;z-index:1}

/* ---------- typography & surfaces ---------- */
.card{background:linear-gradient(180deg,var(--glass),rgba(18,14,30,.82));border:1px solid var(--glass-b);
  box-shadow:0 12px 34px #0009,inset 0 1px 0 #ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.card h3{font-weight:900;letter-spacing:-.2px}
.topbar{position:sticky;top:0;z-index:40;margin:-10px -10px 12px;padding:calc(8px + env(safe-area-inset-top,0px)) 12px 8px;
  background:linear-gradient(180deg,rgba(11,9,18,.94),rgba(11,9,18,.72));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid #ffffff0f}
.brand b{background:linear-gradient(90deg,var(--gold2),#fff3d6 50%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:900}
.brand .logo{background:conic-gradient(from 200deg,var(--gold2),var(--accent),var(--accent2),var(--gold2));box-shadow:0 6px 20px #8b5cf655}
.chip{background:rgba(255,255,255,.05);border-color:#ffffff1a;backdrop-filter:blur(6px)}
.chip.gold{background:linear-gradient(145deg,#4a3410,#2a1d0a);border-color:#8a6420;color:var(--gold2);box-shadow:0 0 14px #e3b04b22}

/* ---------- buttons ---------- */
.btn{border-radius:14px;background:linear-gradient(180deg,#2a2140,#1e1830);border:1px solid #3e3160;box-shadow:0 4px 12px #0006,inset 0 1px 0 #ffffff12}
.btn.gold{background:linear-gradient(180deg,#ffe29a 0%,#f0bd55 45%,#c98a22 100%);color:#2a1606;box-shadow:0 6px 20px #e3b04b44,inset 0 1px 0 #fff8}
.btn.green{background:linear-gradient(180deg,#6ff0b0,#2fae73);color:#04210f;box-shadow:0 6px 18px #3fcf8e40}
.btn.red{background:linear-gradient(180deg,#5a1e28,#3a121a);border-color:#7a2a36;color:#ffb8b0}
.btn:not(:disabled):hover{filter:brightness(1.08)}
.tag{background:rgba(255,255,255,.06);border-color:#ffffff1a}
.inp{background:#120e1e;border-color:#3a2e56}

/* ---------- me card / daily ---------- */
#meCard.me{background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(236,72,153,.10) 50%,rgba(227,176,75,.14))!important;border-color:#ffffff1f!important}
.avatar{border-color:var(--gold2);background:linear-gradient(145deg,#4b2f7a,#26183f);box-shadow:0 0 0 3px #e3b04b33}
.me .rating{background:linear-gradient(180deg,#fff1c9,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- bottom navigation (لابی) ---------- */
#scr-lobby{padding-bottom:calc(var(--nav-h) + 18px + var(--safe-b))}
#lobbyTabs.seg{position:fixed;z-index:60;left:50%;transform:translateX(-50%);bottom:calc(10px + var(--safe-b));
  width:min(700px,calc(100% - 20px));margin:0;padding:6px;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;overflow:visible;
  background:rgba(20,15,34,.86);border:1px solid #ffffff1c;border-radius:24px;box-shadow:0 18px 40px #000c,0 0 0 1px #00000060;
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3)}
#lobbyTabs.seg button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:transparent;border:none;
  border-radius:18px;padding:7px 2px;font-size:11px;font-weight:800;color:var(--muted);transition:.2s;min-height:52px}
#lobbyTabs.seg button i{font-style:normal;font-size:22px;line-height:1;filter:grayscale(.6);transition:.2s}
#lobbyTabs.seg button.active{color:#2a1606;background:linear-gradient(180deg,#ffe29a,#e3b04b);box-shadow:0 6px 18px #e3b04b55}
#lobbyTabs.seg button.active i{filter:none;transform:translateY(-1px) scale(1.08)}

/* ---------- games grid ---------- */
.game-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.game-card{position:relative;overflow:hidden;flex-direction:column;align-items:flex-start;gap:10px;padding:14px 12px 12px;min-height:150px;border-radius:22px;
  background:linear-gradient(155deg,var(--g1,#3b2a6b) 0%,var(--g2,#1b1430) 100%);border:1px solid #ffffff22;box-shadow:0 14px 30px #0008,inset 0 1px 0 #ffffff25;transition:transform .15s}
.game-card:before{content:"";position:absolute;width:160px;height:160px;border-radius:50%;left:-50px;top:-60px;background:radial-gradient(#ffffff33,transparent 65%)}
.game-card:after{content:attr(data-big);position:absolute;left:-6px;bottom:-22px;font-size:92px;opacity:.13;transform:rotate(-14deg);pointer-events:none}
.game-card:active{transform:scale(.97)}
.game-card .gc-ico{width:54px;height:54px;font-size:32px;border-radius:16px;background:rgba(255,255,255,.16);border:1px solid #ffffff30;box-shadow:inset 0 1px 0 #ffffff40,0 6px 14px #0005}
.game-card .gc-txt b{font-size:18px;font-weight:900;color:#fff;text-shadow:0 2px 8px #0008}
.game-card .gc-txt small{color:#ffffffb8;font-size:11.5px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.game-card .gc-live{color:#9dffc9;font-weight:800}
.game-card .gc-go{display:none}
.game-card[data-game="nard"]{--g1:#b8732a;--g2:#4a2410;grid-column:1/-1;min-height:128px}
.game-card[data-game="shelem"]{--g1:#7c3aed;--g2:#2a1260}
.game-card[data-game="hokm"]{--g1:#0f766e;--g2:#06302c}
.game-card[data-game="mafia"]{--g1:#be123c;--g2:#3b0717}
.game-card[data-game="daberna"]{--g1:#2563eb;--g2:#0c1f4d}
.game-card[data-game="blackjack"]{--g1:#15803d;--g2:#062b14}
.game-card[data-game="poker"]{--g1:#475569;--g2:#0f172a}
.game-card[data-game="billiards"]{--g1:#047857;--g2:#052e22}
.game-card[data-game="minesweeper"]{--g1:#c2410c;--g2:#431407}
.game-card[data-game="mench"]{--g1:#0e7490;--g2:#083344}
.game-card[data-game="snakes"]{--g1:#15803d;--g2:#14532d}
@media (min-width:560px){.game-list{grid-template-columns:repeat(3,1fr)}.game-card[data-game="nard"]{grid-column:span 3}}

/* ---------- rooms ---------- */
.room{background:rgba(255,255,255,.035);border-color:#ffffff14;border-radius:16px}

/* ---------- game controls: always at thumb reach ---------- */
@media (orientation:portrait),(max-width:700px){
  #scr-game .controls,#scr-shelem #shCtl{position:sticky;bottom:calc(8px + var(--safe-b));z-index:30;padding:8px;margin:8px 0;border-radius:18px;
    background:rgba(20,15,34,.9);border:1px solid #ffffff1c;box-shadow:0 14px 34px #000c;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
}
.controls .btn{min-height:48px;font-size:16px}
.controls .note{border-color:#ffffff22;background:rgba(255,255,255,.03)}
.pcard{background:linear-gradient(180deg,var(--glass),rgba(18,14,30,.85))!important;border-color:var(--glass-b)!important}
.pcard.active{box-shadow:0 0 0 2px var(--gold),0 0 24px #e3b04b55!important}
.board-wrap{border-radius:20px;box-shadow:0 22px 50px #000d,0 0 0 1px #ffffff14}

/* ---------- shop ---------- */
.shop-tabs{display:flex;gap:6px;background:rgba(255,255,255,.04);padding:5px;border-radius:16px;margin-bottom:12px;border:1px solid #ffffff12}
.shop-tabs button{flex:1;border:none;background:transparent;color:var(--muted);font-weight:900;font-size:14px;padding:10px;border-radius:12px}
.shop-tabs button.on{background:linear-gradient(180deg,#ffe29a,#e3b04b);color:#2a1606;box-shadow:0 4px 14px #e3b04b44}
.skin{border-radius:20px!important;background:rgba(255,255,255,.04)!important;border:1px solid #ffffff18!important}
.skin.eq{border-color:var(--gold)!important;box-shadow:0 0 0 1px var(--gold),0 0 26px #e3b04b33}
.deck-prev{position:relative;height:118px;display:flex;align-items:center;justify-content:center;margin:2px 0 6px;direction:ltr}
.deck-prev .pc{position:relative;width:58px;margin:0 -12px;cursor:default;font-size:0;transform-origin:50% 110%}
.deck-prev .pc:nth-child(1){transform:rotate(-14deg) translateY(6px)}
.deck-prev .pc:nth-child(2){transform:rotate(-4deg)}
.deck-prev .pc:nth-child(3){transform:rotate(6deg)}
.deck-prev .pc .ct b{font-size:17px}.deck-prev .pc .ct i{font-size:14px}.deck-prev .pc .cm{font-size:30px}.deck-prev .pc .cs{font-size:12px}
.deck-prev .pc .ct u{font-size:8px}
.deck-prev .cback{position:relative;width:58px;aspect-ratio:5/7;border-radius:7px;margin:0 -12px;transform:rotate(14deg) translateY(6px)}
.deck-desc{font-size:11.5px;color:var(--muted);margin:2px 0 6px;text-align:center}

/* =====================================================================
   مدل‌های ورق (پاسور) — body[data-deck]
   پشت کارت: .cback / .sh-backs span / .bj-card.back     روی کارت: .pc / .bj-card
   ===================================================================== */
.cback,.sh-backs span,.bj-card.back{background:var(--deck-back,repeating-linear-gradient(45deg,#7a1f2b 0 5px,#5b1520 5px 10px))!important;
  border:2px solid var(--deck-edge,#f1e7d0)!important}
.pc,.bj-card:not(.back){background:var(--deck-face,linear-gradient(160deg,#fffef9 0%,#f6efdf 70%,#ece2cb 100%));border-color:var(--deck-face-b,#c9b28a)}
.pc.red,.bj-card.red{color:var(--deck-red,#c22f35)}
.pc.blk,.bj-card:not(.red):not(.back){color:var(--deck-blk,#1e1a17)}

[data-deck="persian"]{
  --deck-back:radial-gradient(circle at 50% 50%,#e3b04b 0 9%,transparent 10%),radial-gradient(circle at 0 0,#e3b04b55 0 18%,transparent 19%),
    radial-gradient(circle at 100% 100%,#e3b04b55 0 18%,transparent 19%),repeating-conic-gradient(from 0deg at 50% 50%,#0f6e74 0 15deg,#0b5257 15deg 30deg);
  --deck-edge:#e3b04b; --deck-face:linear-gradient(160deg,#fffaf0 0%,#f5ead2 70%,#e9d7b0 100%); --deck-face-b:#b8892e;
  --deck-red:#b0262f; --deck-blk:#0d3f44}
[data-deck="royal"]{
  --deck-back:linear-gradient(135deg,transparent 46%,#e3b04b66 47% 53%,transparent 54%),linear-gradient(45deg,transparent 46%,#e3b04b66 47% 53%,transparent 54%),
    radial-gradient(circle,#2b3a8a 0,#121a4a 70%);
  --deck-edge:#ffd57e; --deck-face:linear-gradient(160deg,#ffffff 0%,#eef1ff 70%,#d9def7 100%); --deck-face-b:#7a86c9;
  --deck-red:#c0182f; --deck-blk:#1a2160}
[data-deck="noir"]{
  --deck-back:repeating-linear-gradient(90deg,#1a1a1a 0 3px,#0d0d0d 3px 6px); --deck-edge:#e3b04b;
  --deck-face:linear-gradient(160deg,#2a2a2e 0%,#18181b 100%); --deck-face-b:#e3b04b88;
  --deck-red:#ff6b6b; --deck-blk:#ffd57e}
[data-deck="neon"]{
  --deck-back:radial-gradient(circle at 30% 30%,#ec489988 0 20%,transparent 21%),radial-gradient(circle at 70% 70%,#22d3ee88 0 20%,transparent 21%),#0c0a1a;
  --deck-edge:#a78bfa; --deck-face:linear-gradient(160deg,#141026 0%,#0b0918 100%); --deck-face-b:#8b5cf6;
  --deck-red:#ff4fa3; --deck-blk:#4ff0ff}
[data-deck="neon"] .pc .ct,[data-deck="neon"] .bj-card b{text-shadow:0 0 8px currentColor}
[data-deck="big"]{--deck-red:#d1121c; --deck-blk:#000}
[data-deck="big"] .sh-table:not(.land) .pc.hc .ct b{font-size:max(20px,6.2cqw)}
[data-deck="big"] .sh-table:not(.land) .pc.hc .ct i{font-size:max(16px,4.8cqw)}
[data-deck="big"] .pc .ct u{display:none}
[data-deck="big"] .bj-card b{font-size:21px}
[data-deck="noir"] .pc .cp,[data-deck="neon"] .pc .cp{background:#e3b04b;color:#1a1206}
[data-deck="noir"] .pc.trumpc,[data-deck="neon"] .pc.trumpc{background:var(--deck-face);box-shadow:inset 0 0 0 2px #e3b04b,0 .5cqw 1.2cqw #0008}
[data-deck="noir"] .pc.trumpc:before,[data-deck="neon"] .pc.trumpc:before{color:#ffd57e}
[data-deck="noir"] .pc,[data-deck="neon"] .pc{box-shadow:0 .5cqw 1.2cqw #0008,inset 0 0 0 .3cqw #ffffff10}
#toast{opacity:0;pointer-events:none;transition:transform .25s,opacity .25s;z-index:200;background:rgba(28,22,44,.95);border-color:var(--gold);border-radius:16px;box-shadow:0 12px 30px #000c}
#toast.show{opacity:1}
#scr-lobby:not(.hidden)~#toast,body:has(#scr-lobby:not(.hidden)) #toast{bottom:calc(var(--nav-h) + 30px + var(--safe-b))}
.deck-prev .pc,.deck-prev .cback{width:50px;margin:0 -15px}
.deck-prev[data-deck="big"] .pc .ct b{font-size:23px}
.deck-prev[data-deck="big"] .pc .ct i{font-size:18px}
.shop-grid{gap:10px}
.skin{overflow:hidden}
.pk-seat.me{display:block}
.pk-seat.me .pk-nm{color:var(--gold2)}
#modalBox{background:linear-gradient(180deg,#221a36,#15101f)!important;border:1px solid #e3b04b55!important;box-shadow:0 30px 70px #000e,0 0 0 1px #00000080!important}
.rule-row{gap:10px}.rule-row .nm{flex:1;line-height:1.6}
.sw{flex:none;width:52px;height:30px;border-radius:30px;border:1px solid #ffffff26;background:#2a2140;position:relative;padding:0;transition:.2s}
.sw i{position:absolute;top:3px;right:3px;width:22px;height:22px;border-radius:50%;background:#bdb3d1;transition:.2s;box-shadow:0 2px 6px #0008}
.sw.on{background:linear-gradient(180deg,#6ff0b0,#2fae73);border-color:transparent}
.sw.on i{right:27px;background:#fff}
#scr-billiards .btn.gold,#scr-poker .btn.gold,#scr-daberna .btn.gold,#scr-blackjack .btn.gold,#scr-minesweeper .btn.gold,#scr-mench .btn.gold,#scr-snakes .btn.gold{color:#2a1606}