/* ==========================================================================
   Polygon Casino — purple / white / lilac / soft pink theme
   ========================================================================== */
:root{
  --p:#7c3aed; --p2:#c084fc; --pink:#f9a8d4;
  --p-dark:#5b21b6; --p-ink:#2e1065; --ink:#2a1650; --muted:#7a6a96; --line:#ece4fb;
  --bg:#faf7ff; --bg2:#f4eefe; --card:#ffffff; --lilac:#f3ecff; --lilac2:#e9ddff; --blush:#fdf0f7;
  --ok:#16a34a; --bad:#e11d48; --warn:#d97706;
  --r:18px; --r-sm:12px; --shadow:0 10px 30px rgba(91,33,182,.08); --shadow-lg:0 24px 60px rgba(91,33,182,.18);
  --grad:linear-gradient(135deg,var(--p) 0%,#a855f7 55%,var(--pink) 130%);
  --top:64px; --side:258px;
  --font:'Plus Jakarta Sans',system-ui,-apple-system,Segoe UI,Roboto,sans-serif; --display:'Outfit',var(--font);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);background-image:radial-gradient(1200px 500px at 85% -10%,#fbe7f4 0%,transparent 60%),radial-gradient(900px 500px at -10% 10%,#efe5ff 0%,transparent 60%);background-attachment:fixed;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--p);text-decoration:none}
img,svg{max-width:100%}
h1,h2,h3,h4{font-family:var(--display);color:var(--p-ink);margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(24px,3vw,34px)} h2{font-size:clamp(20px,2.4vw,26px)} h3{font-size:19px}
p{margin:0 0 1em}
button{font-family:inherit}
.muted{color:var(--muted)} .center{text-align:center} .hidden,[hidden]{display:none!important}
.ok{color:var(--ok)} .bad{color:var(--bad)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all}

/* ---------- Buttons & inputs ---------- */
.btn{--h:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--h);padding:0 18px;border-radius:12px;border:0;cursor:pointer;font-weight:700;font-size:14.5px;transition:transform .12s,box-shadow .2s,background .2s,opacity .2s;white-space:nowrap;text-decoration:none;user-select:none}
.btn:active{transform:translateY(1px) scale(.99)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 20px rgba(124,58,237,.28)}
.btn-primary:hover{box-shadow:0 10px 26px rgba(124,58,237,.38)}
.btn-ghost{background:var(--lilac);color:var(--p-dark)}
.btn-ghost:hover{background:var(--lilac2)}
.btn-white{background:#fff;color:var(--p-dark);box-shadow:var(--shadow)}
.btn-ok{background:linear-gradient(135deg,#16a34a,#4ade80);color:#fff}
.btn-danger{background:linear-gradient(135deg,#e11d48,#fb7185);color:#fff}
.btn-sm{--h:36px;padding:0 13px;font-size:13.5px;border-radius:10px}
.btn-lg{--h:52px;font-size:16px;border-radius:14px}
.btn-block{width:100%}
.icon-btn{width:38px;height:38px;border-radius:11px;border:0;background:transparent;color:var(--p-dark);display:inline-grid;place-items:center;cursor:pointer;font-size:17px}
.icon-btn:hover{background:var(--lilac)}
.link-btn{background:none;border:0;color:var(--p);font-weight:600;cursor:pointer;padding:8px 0;font-size:14px;display:block;margin:6px auto 0}
.input,label input,label select,label textarea,select.input,textarea.input{width:100%;height:46px;padding:0 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;font:inherit;color:var(--ink);transition:border .2s,box-shadow .2s;outline:none}
label textarea,textarea.input{height:auto;min-height:96px;padding:12px 14px;resize:vertical}
.input:focus,label input:focus,label select:focus,label textarea:focus{border-color:var(--p2);box-shadow:0 0 0 4px rgba(192,132,252,.18)}
label{display:block;font-weight:600;font-size:13.5px;color:var(--p-ink);margin-bottom:12px}
label input,label select,label textarea{margin-top:6px}
label small{color:var(--muted);font-weight:500}
label.check{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:13.5px}
label.check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--p);flex:none}

/* ---------- Announcement ---------- */
.announce{position:relative;background:var(--grad);color:#fff;font-size:13px;font-weight:600;height:32px;overflow:hidden;display:flex;align-items:center}
.announce-track{white-space:nowrap;animation:marq 26s linear infinite;padding-left:100%}
.announce-x{position:absolute;right:6px;top:4px;width:24px;height:24px;border:0;border-radius:8px;background:rgba(255,255,255,.2);color:#fff;cursor:pointer}
@keyframes marq{to{transform:translateX(-100%)}}

/* ---------- Top bar ---------- */
.topbar{position:sticky;top:0;z-index:60;height:var(--top);display:flex;align-items:center;gap:14px;padding:0 18px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:9px;font-family:var(--display);font-size:20px;color:var(--p-ink);font-weight:600;letter-spacing:-.02em;flex:none}
.logo b{font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.search{position:relative;flex:1;max-width:440px;margin-left:12px;display:flex;align-items:center;gap:8px;background:var(--lilac);border-radius:12px;padding:0 12px;height:42px;color:var(--muted)}
.search input{border:0;background:transparent;outline:none;width:100%;font:inherit;color:var(--ink)}
.search-drop{position:absolute;left:0;right:0;top:48px;background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);padding:6px;display:none;max-height:420px;overflow:auto}
.search-drop.open{display:block}
.search-drop a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;color:var(--ink);font-weight:600;font-size:14px}
.search-drop a:hover{background:var(--lilac)}
.search-drop img{width:44px;height:44px;border-radius:10px;object-fit:cover}
.search-drop small{display:block;color:var(--muted);font-weight:500}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.balance-pill{display:flex;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--line);border-radius:12px;height:42px;padding:0 12px;cursor:pointer;font-weight:800;font-family:var(--display);font-size:16px;color:var(--p-ink);transition:border .2s}
.balance-pill:hover{border-color:var(--p2)}
.balance-pill.flash{animation:flash .7s}
@keyframes flash{30%{background:#f0fdf4;border-color:#86efac}}
.pol-ico{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--grad);color:#fff;font-size:14px}
.bal-cur{font-size:12px;color:var(--muted);font-weight:700}
.bal-fiat{font-size:12px;color:var(--muted);font-weight:600;font-family:var(--font)}
.bal-fiat:not(:empty){border-left:1px solid var(--line);padding-left:8px}
.avatar-btn{border:0;background:none;padding:0;cursor:pointer}
.av{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#f3e8ff,#fce7f3);font-size:21px;flex:none}
.av.lg{width:46px;height:46px;font-size:25px;border-radius:14px}
.user-menu{position:relative}
.dropdown{position:absolute;right:0;top:50px;width:230px;background:#fff;border-radius:16px;box-shadow:var(--shadow-lg);padding:8px;display:none;z-index:80}
.dropdown.open{display:block;animation:pop .16s ease-out}
.dropdown a,.dropdown button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:10px;border:0;background:none;color:var(--ink);font-weight:600;font-size:14px;cursor:pointer}
.dropdown a:hover,.dropdown button:hover{background:var(--lilac)}
.dd-head{display:flex;gap:10px;align-items:center;padding:8px 8px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.dd-head small{display:block;color:var(--muted);font-weight:600}
@keyframes pop{from{opacity:0;transform:translateY(-6px) scale(.98)}}

/* ---------- Shell / sidebar ---------- */
.shell{display:flex;min-height:calc(100vh - var(--top))}
.sidebar{position:sticky;top:var(--top);height:calc(100vh - var(--top));width:var(--side);flex:none;border-right:1px solid var(--line);background:rgba(255,255,255,.7);backdrop-filter:blur(10px);overflow:hidden;z-index:50}
.side-inner{height:100%;overflow-y:auto;padding:16px 12px 24px;scrollbar-width:thin}
.side-profile{display:flex;gap:11px;align-items:center;padding:12px;border-radius:16px;background:linear-gradient(135deg,#f5edff,#fdf0f7);color:var(--ink);margin-bottom:10px}
.sp-info{flex:1;min-width:0}.sp-info b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sp-info small{color:var(--muted);font-weight:600;font-size:12px}
.lvl-bar{height:6px;border-radius:9px;background:#fff;overflow:hidden;margin-top:5px}.lvl-bar i{display:block;height:100%;background:var(--grad);border-radius:9px}
.side-verify{width:100%;border:1.5px dashed #f0abfc;background:#fdf4ff;color:#a21caf;font-weight:700;border-radius:12px;padding:9px;cursor:pointer;margin-bottom:10px}
.side-guest{padding:14px;border-radius:16px;background:var(--grad);color:#fff;margin-bottom:12px}
.side-guest p{font-size:13px;opacity:.95;margin:4px 0 12px}
.side-guest .btn-primary{background:#fff;color:var(--p-dark);box-shadow:none}
.side-title{font-size:11.5px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:800;margin:16px 10px 6px}
.side-nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:12px;color:var(--ink);font-weight:600;font-size:14.2px;transition:background .15s}
.side-nav a i{font-style:normal;width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:var(--lilac);font-size:15px;flex:none}
.side-nav a:hover{background:var(--lilac)}
.side-nav a.on{background:linear-gradient(90deg,#efe4ff,#fdf0f7);color:var(--p-dark)}
.side-nav a.on i{background:var(--grad);color:#fff}
.side-nav .cnt{margin-left:auto;font-size:11.5px;color:var(--muted);background:var(--bg2);padding:1px 8px;border-radius:20px}
.dot-new{margin-left:auto;font-style:normal;font-size:10px;font-weight:800;color:#fff;background:linear-gradient(135deg,#ec4899,#f472b6);padding:2px 7px;border-radius:20px}
.pol-ticker{margin:18px 4px 10px;padding:12px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.pt-head{display:flex;align-items:center;gap:9px}
.pt-coin{width:34px;height:34px;border-radius:11px;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:18px}
.pt-head small{display:block;color:var(--muted);font-size:11.5px}
.pt-price{margin-left:auto;text-align:right}.pt-price b{font-family:var(--display)}
.pt-spark{width:100%;height:44px;margin-top:6px;display:block}
.side-social{display:flex;gap:8px;margin:12px 6px}
.side-social a{width:38px;height:38px;border-radius:12px;background:var(--lilac);display:grid;place-items:center;color:var(--p-dark);font-weight:800}
.side-backdrop{display:none}

/* ---------- Main ---------- */
.main{flex:1;min-width:0;padding:22px clamp(14px,2.4vw,30px) 40px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.page-head p{margin:0}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);border:1px solid rgba(236,228,251,.7);padding:20px}
.card + .card{margin-top:16px}
.card-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.card-title h3{margin:0}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.section{margin-top:28px}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px}
.section-head h2{margin:0;display:flex;align-items:center;gap:10px}
.section-head .ico{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--grad);color:#fff;font-size:17px}
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700;background:var(--lilac);color:var(--p-dark)}
.pill.ok{background:#dcfce7;color:#166534}.pill.bad{background:#ffe4e6;color:#9f1239}.pill.warn{background:#fef3c7;color:#92400e}.pill.pink{background:#fce7f3;color:#9d174d}

/* ---------- Hero slider ---------- */
.hero{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow-lg);aspect-ratio:3/1;min-height:220px;background:var(--grad)}
.slides{display:flex;height:100%;transition:transform .7s cubic-bezier(.7,0,.2,1)}
.slide{position:relative;flex:0 0 100%;height:100%;overflow:hidden}
.slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.slide-body{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 clamp(20px,5vw,60px);max-width:60%;color:#fff}
.slide-body h2{color:#fff;font-size:clamp(22px,3.6vw,44px);font-weight:900;line-height:1.05;margin-bottom:10px;text-shadow:0 4px 24px rgba(46,16,101,.35)}
.slide-body p{font-size:clamp(13px,1.4vw,17px);opacity:.95;margin-bottom:18px;max-width:460px}
.slide-body .btn{align-self:flex-start;background:#fff;color:var(--p-dark)}
.hero-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:7px;z-index:5}
.hero-dots button{width:9px;height:9px;border-radius:9px;border:0;background:rgba(255,255,255,.5);cursor:pointer;transition:width .3s,background .3s;padding:0}
.hero-dots button.on{width:26px;background:#fff}
.hero-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.25);color:#fff;font-size:20px;cursor:pointer;backdrop-filter:blur(6px)}
.hero-nav.prev{left:12px}.hero-nav.next{right:12px}

/* ---------- Quick tiles ---------- */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px}
.tile{position:relative;display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;background:#fff;box-shadow:var(--shadow);color:var(--ink);overflow:hidden;border:1px solid var(--line);transition:transform .15s}
.tile:hover{transform:translateY(-2px)}
.tile .t-ico{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;font-size:24px;flex:none}
.tile b{display:block;font-family:var(--display);font-size:16px}
.tile small{color:var(--muted);font-weight:600}
.tile>*{position:relative;z-index:1}.tile::after{content:"";z-index:0;position:absolute;right:-30px;bottom:-30px;width:100px;height:100px;border-radius:50%;background:var(--lilac);opacity:.6}

/* ---------- Category chips ---------- */
.chips{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 15px;border-radius:12px;background:#fff;border:1.5px solid var(--line);color:var(--ink);font-weight:700;font-size:14px;cursor:pointer;transition:all .15s}
.chip:hover{border-color:var(--p2)}
.chip.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 8px 18px rgba(124,58,237,.25)}

/* ---------- Game cards ---------- */
.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px}
.gcard{position:relative;display:block;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 8px 22px rgba(91,33,182,.1);transition:transform .2s,box-shadow .2s;color:var(--ink)}
.gcard:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(91,33,182,.2)}
.gcard .cover{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;background:var(--lilac)}
.gcard .g-info{padding:9px 11px 11px}
.gcard .g-name{font-weight:800;font-size:13.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--display)}
.gcard .g-meta{display:flex;justify-content:space-between;font-size:11.5px;color:var(--muted);font-weight:600;margin-top:2px}
.gcard .badges{position:absolute;top:8px;left:8px;display:flex;gap:5px;z-index:2}
.gcard .badges span{font-size:10px;font-weight:800;color:#fff;padding:3px 7px;border-radius:7px;letter-spacing:.04em}
.b-new{background:#22c55e}.b-hot{background:#f43f5e}.b-top{background:#7c3aed}
.gcard .play-ov{position:absolute;inset:0 0 auto 0;aspect-ratio:3/4;display:grid;place-items:center;background:rgba(46,16,101,.45);opacity:0;transition:opacity .2s}
.gcard:hover .play-ov{opacity:1}
.play-ov span{width:56px;height:56px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--p);font-size:22px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.load-more{display:flex;justify-content:center;margin-top:18px}
.row-scroll{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,170px);gap:14px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;scrollbar-width:thin}
.row-scroll>*{scroll-snap-align:start}

/* ---------- Tables ---------- */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:11px 12px;border-bottom:1px solid #f5f0fd;white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#fcfaff}
.tbl .g-link{display:flex;align-items:center;gap:8px;color:var(--ink);font-weight:700}
.win-amt{color:var(--ok);font-weight:800}.loss-amt{color:var(--muted)}

/* ---------- Tabs ---------- */
.tabs{display:flex;gap:4px;background:var(--lilac);padding:4px;border-radius:13px;margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.tabs button{flex:1;border:0;background:none;padding:9px 14px;border-radius:10px;font-weight:700;color:var(--p-dark);cursor:pointer;white-space:nowrap;font-size:14px}
.tabs button.on{background:#fff;box-shadow:0 4px 12px rgba(91,33,182,.12)}

/* ---------- Modal ---------- */
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(46,16,101,.42);backdrop-filter:blur(6px)}
.modal.open{display:flex;animation:fade .2s}
@keyframes fade{from{opacity:0}}
.modal-card{position:relative;background:#fff;border-radius:24px;box-shadow:var(--shadow-lg);width:100%;max-width:520px;max-height:92vh;overflow:auto;padding:26px;animation:pop .22s ease-out}
.modal-card.narrow{max-width:420px}
.modal-x{position:absolute;right:14px;top:14px;width:34px;height:34px;border:0;border-radius:10px;background:var(--lilac);color:var(--p-dark);cursor:pointer;z-index:3}
.auth-card{display:grid;grid-template-columns:1fr 1.2fr;max-width:820px;padding:0;overflow:hidden}
.auth-side{background:var(--grad);color:#fff;padding:34px 28px;display:flex;flex-direction:column;justify-content:center}
.auth-side h3{color:#fff;font-size:24px}
.auth-side ul{list-style:none;padding:0;margin:8px 0 0}.auth-side li{padding:7px 0;font-weight:600}
.auth-art{display:flex;gap:10px;margin-bottom:22px}.auth-art span{width:54px;height:54px;border-radius:16px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:27px;animation:bob 3s ease-in-out infinite}
.auth-art span:nth-child(2){animation-delay:.3s}.auth-art span:nth-child(3){animation-delay:.6s}.auth-art span:nth-child(4){animation-delay:.9s}
@keyframes bob{50%{transform:translateY(-6px)}}
.auth-main{padding:30px 28px}
.big-ico{font-size:44px;margin-bottom:6px}
.code-inputs{display:flex;gap:8px;justify-content:center;margin:20px 0}
.code-inputs input{width:46px;height:56px;text-align:center;font-size:24px;font-weight:800;border:2px solid var(--line);border-radius:13px;font-family:var(--display);outline:none;color:var(--p-dark)}
.code-inputs input:focus{border-color:var(--p2);box-shadow:0 0 0 4px rgba(192,132,252,.18)}
.cur-list{max-height:380px;overflow:auto;margin-top:12px}
.cur-list button{display:flex;width:100%;align-items:center;gap:10px;border:0;background:none;padding:10px;border-radius:10px;cursor:pointer;font:inherit;text-align:left;color:var(--ink)}
.cur-list button:hover,.cur-list button.on{background:var(--lilac)}
.cur-list b{width:46px}.cur-list span{flex:1;color:var(--muted);font-size:13px}

/* ---------- Toasts ---------- */
.toasts{position:fixed;top:78px;right:16px;z-index:300;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{pointer-events:auto;min-width:240px;max-width:360px;background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);padding:12px 14px;font-weight:600;font-size:14px;border-left:5px solid var(--p);animation:slideIn .25s ease-out}
.toast.ok{border-color:var(--ok)}.toast.err{border-color:var(--bad)}
@keyframes slideIn{from{transform:translateX(30px);opacity:0}}

/* ---------- Chat ---------- */
.chat-fab{position:fixed;right:20px;bottom:20px;z-index:90;width:60px;height:60px;border-radius:20px;border:0;background:var(--grad);color:#fff;box-shadow:0 14px 34px rgba(124,58,237,.42);cursor:pointer;display:grid;place-items:center;transition:transform .2s}
.chat-fab:hover{transform:scale(1.05)}
.chat-badge{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;border-radius:11px;background:#ec4899;color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center;padding:0 6px;border:2px solid #fff}
.chat-panel{position:fixed;right:20px;bottom:92px;z-index:95;width:370px;height:min(600px,calc(100vh - 130px));background:#fff;border-radius:22px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden;transform:translateY(20px) scale(.96);opacity:0;pointer-events:none;transition:all .22s}
.chat-panel.open{transform:none;opacity:1;pointer-events:auto}
.chat-head{display:flex;justify-content:space-between;align-items:center;padding:14px 14px 12px 18px;background:var(--grad);color:#fff}
.chat-head small{display:flex;align-items:center;gap:6px;opacity:.95;font-weight:600}
.chat-head .icon-btn{color:#fff}.chat-head .icon-btn:hover{background:rgba(255,255,255,.18)}
.live-dot{width:8px;height:8px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.3);display:inline-block}
.chat-rules{padding:10px 16px;background:#fdf4ff;color:#86198f;font-size:13px}
.chat-pinned{flex-shrink:0;border-bottom:1px solid rgba(0,0,0,.08);font-size:13px;line-height:1.4}
.chat-pin-main{padding:9px 16px;background:#eef2ff;color:#3730a3;font-weight:600}
.chat-pin-ok{padding:9px 16px;background:#16a34a;color:#fff;font-weight:600}
.chat-msgs{flex:1;overflow-y:auto;padding:12px 12px 4px;background:linear-gradient(#fcfaff,#fff)}
.msg{display:flex;gap:9px;margin-bottom:11px;animation:fade .2s}
.msg .av{width:32px;height:32px;font-size:17px;border-radius:10px}
.msg-body{min-width:0;flex:1}
.msg-name{font-size:12.5px;font-weight:800;color:var(--p-dark);display:flex;align-items:center;gap:6px}
.msg-name time{color:var(--muted);font-weight:500;font-size:11px}
.msg-name .staff{font-size:9.5px;background:var(--grad);color:#fff;padding:1px 6px;border-radius:6px}
.msg-text{background:var(--lilac);padding:7px 11px;border-radius:4px 13px 13px 13px;font-size:13.8px;display:inline-block;max-width:100%;word-wrap:break-word;margin-top:2px}
.msg.me .msg-text{background:linear-gradient(135deg,#ede4ff,#fce7f3)}
.chat-form{position:relative;display:flex;gap:6px;padding:10px;border-top:1px solid var(--line);align-items:center}
.chat-form input{flex:1;height:40px;border:1.5px solid var(--line);border-radius:12px;padding:0 12px;font:inherit;outline:none}
.chat-form input:focus{border-color:var(--p2)}
.emoji-pop{position:absolute;bottom:58px;left:10px;background:#fff;border-radius:14px;box-shadow:var(--shadow-lg);padding:8px;display:grid;grid-template-columns:repeat(8,1fr);gap:2px;width:290px}
.emoji-pop button{border:0;background:none;font-size:20px;padding:4px;border-radius:8px;cursor:pointer}
.emoji-pop button:hover{background:var(--lilac)}

/* ---------- Footer ---------- */
.footer{margin-top:50px;padding-top:26px;border-top:1px solid var(--line)}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:24px}
.foot-grid h4{font-size:14px;margin-bottom:10px}
.foot-grid a:not(.logo){display:block;color:var(--muted);font-weight:600;font-size:14px;padding:4px 0}
.foot-grid a:not(.logo):hover{color:var(--p)}
.foot-brand p{color:var(--muted);font-size:13.5px;margin:12px 0}
.foot-badges{display:flex;gap:6px;flex-wrap:wrap}.foot-badges span{font-size:12px;font-weight:700;background:#fff;border:1px solid var(--line);padding:4px 10px;border-radius:20px;color:var(--p-dark)}
.foot-bottom{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12.5px;margin-top:22px;padding:16px 0 10px;border-top:1px solid var(--line)}

/* ---------- Mobile nav ---------- */
.mobile-nav{display:none}

/* ---------- Generic blocks ---------- */
.stat{padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.stat small{display:block;color:var(--muted);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em}
.stat b{font-family:var(--display);font-size:22px}
.empty{text-align:center;padding:30px 10px;color:var(--muted)}
.empty .e-ico{font-size:40px;margin-bottom:6px}
.notice{padding:12px 14px;border-radius:12px;background:#fdf4ff;color:#86198f;font-size:13.5px;font-weight:600;margin-bottom:14px}
.notice.warn{background:#fffbeb;color:#92400e}.notice.ok{background:#f0fdf4;color:#166534}
.login-gate{text-align:center;padding:50px 20px}
.login-gate .big-ico{font-size:56px}
.copy-row{display:flex;gap:8px}
.copy-row .input{font-family:ui-monospace,Menlo,monospace;font-size:13.5px}
.prose h3{margin-top:1.2em}.prose p,.prose li{color:#4a3a68}
.spinner{width:22px;height:22px;border:3px solid var(--lilac2);border-top-color:var(--p);border-radius:50%;animation:spin .8s linear infinite;display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}

/* Promotions */
.promo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.promo-card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;border:1px solid var(--line)}
.promo-card img{width:100%;aspect-ratio:2.4/1;object-fit:cover}
.promo-card .pc-body{padding:16px;flex:1;display:flex;flex-direction:column}
.promo-card h3{font-size:17px}
.promo-card .pc-body p{color:var(--muted);font-size:14px;flex:1}
.promo-card details{font-size:13.5px;color:var(--muted);margin-bottom:12px}
.promo-card summary{cursor:pointer;font-weight:700;color:var(--p)}
.bonus-card{display:flex;gap:14px;align-items:center;padding:16px;border-radius:18px;background:linear-gradient(135deg,#fff,#faf5ff);border:1.5px solid var(--line)}
.bonus-card .b-ico{width:56px;height:56px;border-radius:17px;background:var(--grad);display:grid;place-items:center;color:#fff;font-size:26px;flex:none}
.bonus-card .b-txt{flex:1;min-width:0}.bonus-card .b-txt p{margin:2px 0 0;color:var(--muted);font-size:13.5px}
.bonus-card.active{border-color:var(--p2);box-shadow:0 0 0 4px rgba(192,132,252,.15)}

/* Tasks */
.task{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;border:1.5px solid var(--line);background:#fff}
.task + .task{margin-top:10px}
.task .t-ico{width:48px;height:48px;border-radius:14px;background:var(--lilac);display:grid;place-items:center;font-size:24px;flex:none}
.task .t-body{flex:1;min-width:0}
.task .t-body p{margin:0;color:var(--muted);font-size:13px}
.task .prog{height:8px;border-radius:8px;background:var(--lilac);overflow:hidden;margin-top:7px}
.task .prog i{display:block;height:100%;background:var(--grad);border-radius:8px;transition:width .4s}
.task .t-side{text-align:right;flex:none}
.task .t-side b{display:block;font-family:var(--display);color:var(--p-dark)}
.task.done{border-color:#bbf7d0;background:#f7fef9}

/* Wheel page */
.wheel-wrap{position:relative;width:min(440px,90vw);aspect-ratio:1;margin:0 auto}
.wheel-wrap canvas{width:100%;height:100%;display:block;filter:drop-shadow(0 18px 30px rgba(91,33,182,.25))}
.wheel-pointer{position:absolute;top:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:18px solid transparent;border-right:18px solid transparent;border-top:34px solid #4c1d95;z-index:3;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25))}
.wheel-hub{position:absolute;inset:0;margin:auto;width:22%;height:22%;border-radius:50%;background:var(--grad);border:6px solid #fff;display:grid;place-items:center;color:#fff;font-weight:900;font-family:var(--display);box-shadow:0 6px 20px rgba(0,0,0,.2)}

/* Faucet */
.faucet-hero{text-align:center;padding:30px 20px}
.faucet-drop{color:#fff;width:150px;height:150px;margin:0 auto 16px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 12%,transparent 13%),var(--grad);display:grid;place-items:center;font-size:62px;box-shadow:0 22px 50px rgba(124,58,237,.35);animation:bob 3.5s ease-in-out infinite}
.countdown{font-family:var(--display);font-size:42px;font-weight:900;color:var(--p-dark);letter-spacing:.04em}

/* Wallet */
.wallet-top{display:grid;grid-template-columns:1.3fr 1fr;gap:16px}
.bal-card{background:var(--grad);color:#fff;border-radius:22px;padding:22px;position:relative;overflow:hidden;box-shadow:var(--shadow-lg)}
.bal-card::after{content:"⬢";position:absolute;right:-20px;top:-40px;font-size:220px;opacity:.12;line-height:1}
.bal-card small{opacity:.9;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:12px}
.bal-card .big{font-family:var(--display);font-size:clamp(30px,5vw,44px);font-weight:900;line-height:1.1;margin:4px 0}
.bal-card .sub{opacity:.95;font-weight:600}
.bal-card .wr{margin-top:12px;background:rgba(255,255,255,.18);border-radius:12px;padding:8px 12px;font-size:13px;font-weight:600;display:inline-block}
.qr-box{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.qr-box img{width:170px;height:170px;border-radius:16px;border:1px solid var(--line);padding:8px;background:#fff}
.chart-box{position:relative;height:220px}
.chart-box svg{width:100%;height:100%}
.range-btns{display:flex;gap:4px}
.range-btns button{border:0;background:var(--lilac);color:var(--p-dark);font-weight:700;padding:5px 10px;border-radius:8px;cursor:pointer;font-size:12.5px}
.range-btns button.on{background:var(--p);color:#fff}
.fx-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;max-height:520px;overflow:auto;padding:2px}
.fx{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fcfaff;border:1px solid var(--line);cursor:pointer}
.fx:hover{border-color:var(--p2)}
.fx .code{font-weight:800;width:42px;color:var(--p-dark)}
.fx .nm{flex:1;min-width:0;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx .v{font-weight:700;font-size:13.5px;text-align:right}
.fx.on{background:var(--lilac);border-color:var(--p2)}

/* ---------- Responsive ---------- */
.only-mobile{display:none}
@media (max-width:1180px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1024px){
  :root{--side:272px}
  .only-mobile{display:inline-grid}
  .sidebar{position:fixed;left:0;top:0;height:100vh;transform:translateX(-102%);transition:transform .25s ease;z-index:150;background:#fff;box-shadow:var(--shadow-lg)}
  .sidebar.open{transform:none}
  .side-backdrop.open{display:block;position:fixed;inset:0;background:rgba(46,16,101,.35);z-index:140}
  .foot-grid{grid-template-columns:1fr 1fr}
  .wallet-top{grid-template-columns:1fr}
}
@media (max-width:760px){
  :root{--top:58px}
  body{padding-bottom:70px}
  .topbar{padding:0 10px;gap:8px}
  .logo span{display:none}
  .search{display:none}
  .search.open{display:flex;position:absolute;left:10px;right:10px;top:8px;max-width:none;margin:0;z-index:5;background:#fff;box-shadow:var(--shadow-lg)}
  .hide-xs{display:none}
  .balance-pill{font-size:14px;padding:0 9px;height:38px}
  .bal-fiat{display:none}
  .main{padding:14px 12px 30px}
  .hero{aspect-ratio:auto;height:230px;border-radius:18px}
  .slide-body{max-width:100%;padding:0 22px;background:linear-gradient(90deg,rgba(46,16,101,.55),transparent)}
  .hero-nav{display:none}
  .tiles{gap:10px}.tile{padding:12px}.tile .t-ico{width:40px;height:40px;font-size:20px}.tile b{font-size:14px}.tile small{font-size:11.5px}
  .games-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
  .gcard{border-radius:14px}.gcard .g-info{padding:6px 8px 8px}.gcard .g-name{font-size:12px}.gcard .g-meta{font-size:10.5px}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .auth-card{grid-template-columns:1fr}.auth-side{display:none}.auth-main{padding:24px 20px}
  .chat-fab{display:none}
  .chat-panel{right:0;left:0;bottom:0;top:0;width:auto;height:auto;border-radius:0;z-index:170}
  .toasts{top:auto;bottom:84px;right:12px;left:12px}.toast{max-width:none}
  .mobile-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:100;height:64px;padding-bottom:env(safe-area-inset-bottom);background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-top:1px solid var(--line);justify-content:space-around;align-items:center}
  .mobile-nav a{display:flex;flex-direction:column;align-items:center;gap:1px;font-size:10.5px;font-weight:700;color:var(--muted);flex:1}
  .mobile-nav i{font-style:normal;font-size:20px}
  .mobile-nav .mn-main i{width:46px;height:46px;border-radius:15px;background:var(--grad);color:#fff;display:grid;place-items:center;margin-top:-22px;box-shadow:0 10px 22px rgba(124,58,237,.4)}
  .foot-grid{grid-template-columns:1fr}
  .code-inputs input{width:40px;height:50px}
  .card{padding:16px}
}
@media (max-width:380px){.games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* v2 sidebar groups */
.side-group{margin:0}
.side-group>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none}
.side-group>summary::-webkit-details-marker{display:none}
.side-group>summary a{color:inherit}
.side-group>summary::after{content:'▾';font-size:11px;margin-left:6px;transition:transform .2s}
.side-group:not([open])>summary::after{transform:rotate(-90deg)}
.side-group>summary .cnt{margin-left:auto;font-size:11px;background:var(--bg2);padding:1px 8px;border-radius:20px;text-transform:none;letter-spacing:0}

/* tournaments */
.tour-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.tour-card{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:20px;color:var(--ink);background:linear-gradient(135deg,#fffbeb,#fdf2f8 60%,#f5f3ff);border:1.5px solid #fde68a;box-shadow:var(--shadow);transition:transform .15s;position:relative;overflow:hidden}
.tour-card:hover{transform:translateY(-3px)}
.tour-card::after{content:'🏆';position:absolute;right:-10px;bottom:-24px;font-size:110px;opacity:.12;transform:rotate(-12deg)}
.tour-card h3{margin:4px 0 0}.tour-card p{margin:0;font-size:13.5px}
.tc-top{display:flex;justify-content:space-between;align-items:center}
.tc-pool{font-family:var(--display);font-weight:900;font-size:22px;color:#b45309}.tc-pool small{font-size:12px}
.tc-foot{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);font-weight:700;margin-top:8px}
.lb-row{display:grid;grid-template-columns:44px 1fr auto auto;gap:10px;align-items:center;padding:10px 12px;border-radius:12px}
.lb-row:nth-child(odd){background:#fcfaff}.lb-row.me{background:linear-gradient(90deg,#ede4ff,#fce7f3);box-shadow:0 0 0 2px var(--p2)}
.lb-rank{font-family:var(--display);font-weight:900;font-size:18px;text-align:center}
.lb-row:nth-child(1) .lb-rank{color:#ca8a04}.lb-row:nth-child(2) .lb-rank{color:#64748b}.lb-row:nth-child(3) .lb-rank{color:#b45309}
.podium{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:12px;align-items:end;margin-bottom:16px}
.pod{text-align:center;border-radius:18px 18px 8px 8px;padding:16px 10px;color:#fff;font-weight:700}
.pod .av{margin:0 auto 6px;background:rgba(255,255,255,.25)}
.pod b{display:block;font-family:var(--display);font-size:15px}.pod small{opacity:.9}
.pod.p1{background:linear-gradient(180deg,#facc15,#ca8a04);min-height:170px}.pod.p2{background:linear-gradient(180deg,#cbd5e1,#64748b);min-height:140px}.pod.p3{background:linear-gradient(180deg,#fdba74,#b45309);min-height:120px}
.prize-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.prize-list div{background:var(--lilac);border-radius:12px;padding:8px 10px;text-align:center}.prize-list b{display:block;font-family:var(--display);color:var(--p-dark)}
.countdown-big{display:flex;gap:8px}.countdown-big div{background:#fff;border-radius:12px;padding:8px 12px;text-align:center;min-width:62px;box-shadow:var(--shadow)}
.countdown-big b{display:block;font-family:var(--display);font-size:24px;color:var(--p-dark)}.countdown-big small{font-size:10px;font-weight:800;color:var(--muted);text-transform:uppercase}
.tour-grid.wide{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.tour-card.big{gap:8px}
.tour-card h3 a{color:var(--p-ink)}
.tc-meta{display:flex;flex-wrap:wrap;gap:6px}.tc-meta span{font-size:12px;font-weight:700;background:rgba(255,255,255,.75);border:1px solid var(--line);padding:3px 9px;border-radius:20px;color:var(--p-dark)}
.prize-mini{display:flex;flex-wrap:wrap;gap:6px}.prize-mini span{font-size:12px;background:#fff;border-radius:10px;padding:4px 8px;color:var(--muted);font-weight:700}.prize-mini b{color:#b45309}
.tc-actions{display:flex;gap:8px;align-items:center;margin-top:6px;position:relative;z-index:1}
.tour-hero{display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:26px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#7c3aed,#db2777 70%,#f59e0b 130%);box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.tour-hero::after{content:'🏆';position:absolute;right:20%;top:-30px;font-size:200px;opacity:.12}
.tour-hero h1{color:#fff;margin:10px 0 6px}.tour-hero p{opacity:.95;max-width:560px}
.tour-hero .tc-meta span{background:rgba(255,255,255,.18);border-color:transparent;color:#fff}
.th-side{text-align:right;position:relative;z-index:1}.th-side .countdown-big{margin-top:6px}
@media (max-width:760px){.th-side{text-align:left}.podium{gap:6px}.pod{padding:12px 4px}.lb-row{grid-template-columns:34px 1fr auto;}.lb-row>span:last-child{display:none}}
.aff-hero{padding:28px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#6d28d9,#a855f7 55%,#f472b6);box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.aff-hero::after{content:'🤝';position:absolute;right:30px;top:-10px;font-size:180px;opacity:.14}
.aff-hero h1{color:#fff}.aff-hero p{max-width:640px;opacity:.95}
.aff-rates{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;position:relative;z-index:1}
.aff-rates div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:12px 16px;min-width:180px;backdrop-filter:blur(6px)}
.aff-rates b{display:block;font-family:var(--display);font-size:30px}.aff-rates small{opacity:.92;font-weight:600}
.aff-claim{text-align:center;background:linear-gradient(135deg,#fff,#faf5ff)}
.aff-claim small{color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:12px}
.aff-claim .big{font-family:var(--display);font-weight:900;font-size:34px;color:var(--p-dark);margin:6px 0 12px}.aff-claim .big span{font-size:15px;color:var(--muted)}
.share-row{display:flex;gap:8px;flex-wrap:wrap}
.captcha{display:flex;gap:8px;align-items:center;justify-content:center;margin:12px 0 4px}
.captcha b{font-family:var(--display);font-size:22px;background:var(--lilac);padding:8px 14px;border-radius:12px;color:var(--p-dark);letter-spacing:.04em}
.captcha input{width:90px;height:46px;text-align:center;font-size:20px;font-weight:800;border:2px solid var(--line);border-radius:12px;outline:none}
.captcha input:focus{border-color:var(--p2)}
.sl-card{text-align:center;padding:30px 20px}
.sl-card .sl-ico{font-size:58px}
/* partners */
.partner-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;align-items:center;padding:30px;border-radius:26px;color:#fff;background:linear-gradient(135deg,#312e81,#6d28d9 55%,#0ea5e9 140%);box-shadow:var(--shadow-lg)}
.partner-hero h1{color:#fff;font-size:clamp(26px,3.4vw,42px);margin:12px 0 10px}.partner-hero p{opacity:.95;font-size:16px;max-width:620px}
.ph-code pre{margin:0;background:rgba(2,6,23,.55);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:18px;color:#c4b5fd;font-size:13px;overflow:auto;line-height:1.6}
.feat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}.feat span{font-size:30px}.feat b{display:block;font-family:var(--display);font-size:18px;margin:6px 0 4px}.feat small{color:var(--muted);font-weight:600}
.step{position:relative;margin:0!important}.step em{position:absolute;top:-12px;left:18px;width:34px;height:34px;border-radius:12px;background:var(--grad);color:#fff;display:grid;place-items:center;font-style:normal;font-weight:900;font-family:var(--display)}.step h3{margin-top:10px}
.ptabs{display:flex;flex-wrap:nowrap;overflow-x:auto}.ptabs a{flex:none;padding:9px 14px;border-radius:10px;font-weight:700;color:var(--p-dark);white-space:nowrap;font-size:14px}.ptabs a.on{background:#fff;box-shadow:0 4px 12px rgba(91,33,182,.12)}
pre.code,.docs pre{background:#1e1b4b;color:#e9d5ff;border-radius:14px;padding:14px 16px;overflow:auto;font-size:12.5px;line-height:1.55}
.docs h2{margin-top:1.4em;padding-top:.4em;border-top:1px solid var(--line)}.docs h2:first-child{border:0;margin-top:0}.docs code{background:var(--lilac);padding:1px 6px;border-radius:6px;font-size:.92em;color:var(--p-dark)}.docs pre code{background:none;color:inherit;padding:0}
.docs .tbl td{white-space:normal}
@media (max-width:900px){.partner-hero{grid-template-columns:1fr}}
/* v2 mobile fixes */
.partner-hero>*{min-width:0}.ph-code pre{max-width:100%;white-space:pre}.docs code{word-break:break-all}
@media (max-width:520px){.countdown-big{gap:5px}.countdown-big div{min-width:0;flex:1;padding:6px 6px}.countdown-big b{font-size:19px}.partner-hero{padding:20px}}
.tour-cols{grid-template-columns:1.5fr 1fr}.tour-cols>*{min-width:0}.th-side,.tour-hero>div{min-width:0;max-width:100%}
@media (max-width:900px){.tour-cols{grid-template-columns:1fr}}
/* My Bonuses */
.mb-hero{display:grid;grid-template-columns:auto 1fr;gap:18px 26px;align-items:center;padding:24px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#6d28d9,#a855f7 60%,#f472b6 130%);box-shadow:var(--shadow-lg)}
.mb-ring{--pc:0;width:132px;height:132px;border-radius:50%;background:conic-gradient(#fff calc(var(--pc)*1%),rgba(255,255,255,.22) 0);display:grid;place-items:center}
.mb-ring>div{width:104px;height:104px;border-radius:50%;background:#7c3aed;display:grid;place-content:center;text-align:center;box-shadow:inset 0 2px 10px rgba(0,0,0,.15)}
.mb-ring b{font-family:var(--display);font-size:26px;line-height:1}.mb-ring small{font-size:11px;font-weight:700;opacity:.85;text-transform:uppercase;letter-spacing:.04em}
.mb-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.mb-stats>div{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:12px 14px;min-width:0}
.mb-stats small{display:block;font-size:11.5px;font-weight:700;opacity:.85;text-transform:uppercase;letter-spacing:.03em}.mb-stats b{font-family:var(--display);font-size:22px;word-break:break-word}.mb-stats em{font-style:normal;font-size:12px;opacity:.8}
.mb-note{grid-column:1/-1;font-size:13.5px;font-weight:600;background:rgba(255,255,255,.13);border-radius:12px;padding:9px 13px}
.mb-list{display:grid;gap:14px}
.mb-card{display:flex;gap:16px;padding:18px;border-radius:20px;background:var(--card);border:1.5px solid var(--line);box-shadow:var(--shadow)}
.mb-card.pending{background:linear-gradient(135deg,#fff,#fdf4ff);border-color:var(--p2)}
.mb-ico{width:54px;height:54px;flex:none;border-radius:16px;background:var(--lilac);display:grid;place-items:center;font-size:26px}
.mb-body{flex:1;min-width:0}.mb-body p{margin:4px 0 0}
.mb-title{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.mb-title b{font-size:16.5px;color:var(--p-ink)}
.mb-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:13px;margin-top:4px}.mb-meta b{color:var(--ink)}
.mb-prog{height:12px;border-radius:12px;background:var(--lilac);overflow:hidden;margin-top:12px}.mb-prog i{display:block;height:100%;background:var(--grad);border-radius:12px;min-width:4px;transition:width .5s}
.mb-nums{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:6px}.mb-nums b{color:var(--ink)}
.mb-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mb-confirm{margin-top:12px;padding:12px 14px;border-radius:14px;background:#fff1f2;border:1px solid #fecdd3;color:#881337}.mb-confirm p{font-size:13.5px}
@media (max-width:900px){.mb-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.mb-hero{grid-template-columns:1fr;justify-items:center;padding:18px}.mb-stats{width:100%}.mb-card{padding:14px;gap:12px}.mb-ico{width:44px;height:44px;font-size:21px}}
/* language switcher */
.lang-menu{position:relative}
.lang-btn{width:auto!important;padding:0 10px!important;gap:6px;display:inline-flex;align-items:center}.lang-btn span{font-size:18px;line-height:1}.lang-btn b{font-size:12px;font-weight:800;color:var(--p-dark)}
.lang-drop{width:220px;max-height:min(70vh,520px);overflow:auto;display:none;grid-template-columns:1fr}
.lang-drop.open{display:grid}
.lang-drop a{display:flex!important;align-items:center;gap:10px;padding:8px 10px!important;font-size:13.5px!important}.lang-drop a span{font-size:18px}.lang-drop a.on{background:var(--lilac);color:var(--p-dark)}
@media (max-width:560px){.lang-drop{position:fixed;right:10px;left:10px;top:60px;width:auto;grid-template-columns:1fr 1fr}}
/* RTL */
[dir=rtl] body{text-align:right}
[dir=rtl] .dropdown{right:auto;left:0}[dir=rtl] .dropdown a,[dir=rtl] .dropdown button{text-align:right}
[dir=rtl] .bet-input input,[dir=rtl] .input[type=number],[dir=rtl] .mono,[dir=rtl] input[readonly]{direction:ltr;text-align:left}
[dir=rtl] .sidebar{border-right:0;border-left:1px solid var(--line)}
[dir=rtl] .g-stage,[dir=rtl] .stage-inner,[dir=rtl] .announce-track,[dir=rtl] .recent-results,[dir=rtl] .bars,[dir=rtl] .mb-prog,[dir=rtl] .lvl-bar{direction:ltr}
@media (max-width:1024px){[dir=rtl] .sidebar{left:auto;right:0;transform:translateX(102%)}[dir=rtl] .sidebar.open{transform:none}}
[dir=rtl] .chat-fab,[dir=rtl] .chat-panel{right:auto;left:20px}[dir=rtl] .toasts{right:auto;left:16px}
@media (max-width:760px){[dir=rtl] .chat-panel{left:0;right:0}}
.btn svg{flex:none}
@media (max-width:560px){.top-right{gap:6px}.top-right .btn-sm{padding:0 10px;min-width:38px;justify-content:center}.lang-btn{padding:0 6px!important}}

/* ---------- Demo mode (free play with a session balance) ---------- */
.mode-switch{display:inline-flex;background:var(--lilac);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px;margin-inline-end:6px}
.mode-switch a{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 12px;border-radius:9px;font-weight:700;font-size:13px;color:var(--p-dark);white-space:nowrap}
.mode-switch a.on{background:#fff;box-shadow:0 2px 8px rgba(91,33,182,.14);color:var(--p-ink)}
.mode-switch a:not(.on):hover{background:rgba(255,255,255,.55)}
.demo-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:10px 14px;border-radius:16px;border:1.5px dashed #f59e0b;background:repeating-linear-gradient(135deg,#fffbeb 0 14px,#fef3c7 14px 28px)}
.demo-bar .db-txt{flex:1;min-width:200px;display:flex;flex-direction:column;line-height:1.3}
.demo-bar .db-txt b{color:#92400e;font-family:var(--display);font-size:16px}.demo-bar .db-txt small{color:#a16207}
.demo-tag{display:inline-grid;place-items:center;height:26px;padding:0 10px;border-radius:8px;background:#f59e0b;color:#fff;font-weight:900;font-size:12px;letter-spacing:.12em;font-family:var(--display)}
.demo-bal{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:12px;background:#fff;border:1.5px solid #fcd34d;font-family:var(--display);font-weight:800;font-size:16px;color:#92400e;white-space:nowrap}
.demo-bal small{font-size:10.5px;letter-spacing:.08em;color:#b45309;font-weight:800}
.demo-bal .pol-ico{color:#f59e0b}
.demo-bal.flash{animation:flash .7s}
.demo-ribbon{position:absolute;top:14px;inset-inline-end:-38px;transform:rotate(45deg);background:#f59e0b;color:#fff;font:900 12px/1 var(--display);letter-spacing:.2em;padding:6px 44px;z-index:6;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.18)}
[dir=rtl] .demo-ribbon{transform:rotate(-45deg)}
.game-wrap.is-demo{border-color:#fcd34d;box-shadow:0 0 0 2px #fde68a,var(--shadow-lg)}
.demo-cta{margin-top:8px;border:1.5px dashed #f59e0b!important;color:#92400e!important;background:#fffbeb!important}
.demo-note{background:#fffbeb;border-color:#fde68a;color:#92400e}
.demo-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;background:#fffbeb;border:1.5px dashed #f59e0b;color:#92400e;font-weight:800;font-size:13px}
.demo-badge:hover{background:#fef3c7}
.side-nav .demo-link em{background:linear-gradient(135deg,#f59e0b,#fbbf24)!important}
@media (max-width:760px){.demo-bar{gap:8px;padding:10px}.demo-bar .db-txt{min-width:100%;order:-1}.demo-bar .btn{flex:1}.mode-switch a{padding:0 9px}.gt-actions{flex-wrap:wrap}}
.sb-demo-cta{margin:0 0 12px;display:flex;justify-content:flex-end}
.section-head .demo-badge{margin-inline-start:auto}
@media (max-width:760px){.gt-actions:has(.mode-switch){flex-basis:100%;order:3;align-items:center}.gt-actions .mode-switch{margin-inline-end:auto}}
/* Proof of payouts */
.po-hero{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding:28px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#065f46,#10b981 55%,#7c3aed 140%);box-shadow:var(--shadow-lg)}
.po-hero h1{color:#fff;margin:10px 0 6px;font-size:clamp(26px,3.4vw,40px)}.po-hero p{opacity:.95;max-width:620px;margin:0}
.po-live{background:rgba(255,255,255,.2)!important;color:#fff!important;display:inline-flex;align-items:center;gap:6px}.po-live i{width:8px;height:8px;border-radius:50%;background:#bbf7d0;animation:poPulse 1.4s infinite}
@keyframes poPulse{0%{box-shadow:0 0 0 0 rgba(187,247,208,.8)}100%{box-shadow:0 0 0 10px rgba(187,247,208,0)}}
.po-hero-big{text-align:right}.po-hero-big small{display:block;font-weight:800;opacity:.9;text-transform:uppercase;font-size:12px;letter-spacing:.05em}
.po-hero-big b{display:block;font-family:var(--display);font-size:clamp(28px,4vw,44px)}.po-hero-big em{font-style:normal;opacity:.9;font-weight:700}
.po-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:18px 0}
.po-kpi{background:var(--card);border:1.5px solid var(--line);border-radius:18px;padding:14px 16px;box-shadow:var(--shadow);min-width:0}
.po-kpi small{display:block;font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}.po-kpi b{font-family:var(--display);font-size:20px;color:var(--p-ink);word-break:break-word}
.po-tools{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}.po-search{max-width:340px}
.po-tbl td small{display:block}.po-amt{color:#047857}.po-tx{font-size:12.5px;font-weight:700}
.po-tbl tr.po-new{animation:poNew 2.4s ease}@keyframes poNew{0%{background:#dcfce7}100%{background:transparent}}
.po-how ol{line-height:1.9;padding-left:20px}
[dir=rtl] .po-hero-big{text-align:left}[dir=rtl] .po-how ol{padding-left:0;padding-right:20px}
@media (max-width:1100px){.po-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.po-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.po-hero{padding:20px}.po-hero-big{text-align:left}.po-search{max-width:none;width:100%}}
.po-strip{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin}
.po-chip{flex:none;display:flex;flex-direction:column;gap:2px;padding:10px 14px;border-radius:14px;background:var(--card);border:1.5px solid #bbf7d0;box-shadow:var(--shadow);min-width:170px;color:var(--ink)}
.po-chip b{color:#047857;font-family:var(--display)}.po-chip small{color:var(--muted);font-size:12px}

/* ---- bonus balance: header chip + "Real | Bonus" wallet selector (game shell, sports slip) ---- */
.bonus-chip{display:inline-flex;align-items:center;gap:5px;height:42px;padding:0 11px;border-radius:12px;background:var(--blush);border:1.5px solid #fbcfe8;color:#9d174d;font-family:var(--display);font-weight:800;font-size:14px;white-space:nowrap;transition:border .2s}
.bonus-chip:hover{border-color:#f472b6}
.bonus-chip[hidden]{display:none}
.bonus-chip.flash{animation:flash .7s}
.wsel{display:flex;background:var(--lilac);border:1px solid var(--line);border-radius:12px;padding:3px;gap:3px;margin-bottom:10px}
.wsel[hidden]{display:none}
.wsel button{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:1px;border:0;background:none;padding:6px 6px;border-radius:9px;cursor:pointer;font:inherit;color:var(--p-dark);line-height:1.15}
.wsel button b{font-size:13px;font-weight:800;white-space:nowrap}
.wsel button small{font-size:11.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.wsel button.on{background:#fff;box-shadow:0 3px 10px rgba(91,33,182,.13);color:var(--p-ink)}
.wsel button.on[data-wallet=bonus]{background:linear-gradient(135deg,#fff,#fdf0f7);box-shadow:0 3px 10px rgba(219,39,119,.16);color:#9d174d}
.wsel button:disabled{opacity:.55;cursor:not-allowed}
.wsel-note{font-size:11.5px;color:#9d174d;margin:-4px 0 10px;line-height:1.35}
.wsel-note[hidden]{display:none}
@media (max-width:560px){.bonus-chip{height:38px;padding:0 6px;font-size:14px;margin-inline-start:-2px}.bonus-chip b{display:none}}