:root{
  --bg:#0a0e1a; --bg2:#0f1526; --card:#141b2e; --card2:#1a2338;
  --border:#24304d; --text:#eef2ff; --muted:#9aa5c4;
  --green:#00e676; --gold:#ffc107; --red:#ff5252; --blue:#448aff;
}
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{
  margin:0; padding:0; background:linear-gradient(180deg,var(--bg),var(--bg2));
  color:var(--text); font-family:'Hind Siliguri',system-ui,-apple-system,'Segoe UI',sans-serif;
  min-height:100vh; font-size:16px; line-height:1.55;
}
.app-header{
  position:sticky; top:0; z-index:50; background:rgba(10,14,26,.92);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--border);
}
.header-inner{max-width:720px; margin:0 auto; padding:12px 16px; display:flex; align-items:center; justify-content:space-between;}
.logo{font-size:22px; font-weight:700;}
.logo span{color:var(--green);}
.icon-btn{background:var(--card); border:1px solid var(--border); color:var(--text); font-size:18px; border-radius:12px; padding:8px 12px; cursor:pointer;}
.icon-btn:active{transform:scale(.95);}

.prize-banner{
  max-width:720px; margin:12px auto 0; padding:0 16px;
}
.prize-banner{display:flex; gap:14px; align-items:center; background:linear-gradient(135deg,#3a2b00,#5c4300);
  border:1px solid #8a6d00; border-radius:16px; padding:14px 16px; margin-left:16px; margin-right:16px;}
.prize-icon{font-size:34px;}
.prize-text strong{display:block; font-size:16px; color:#ffe082;}
.prize-text small{color:#d7c48a; font-size:12px; display:block; margin-top:2px;}

/* ---------- Spin wheel ---------- */
.wheel-wrap{position:relative; width:104px; height:104px; flex-shrink:0;}
.wheel-wrap canvas{width:104px; height:104px; display:block; filter:drop-shadow(0 2px 8px rgba(0,0,0,.45));}
.wheel-pointer{position:absolute; top:-7px; left:50%; transform:translateX(-50%);
  font-size:20px; color:#ff5252; text-shadow:0 1px 3px rgba(0,0,0,.6); z-index:2;}
.wheel-admin-wrap{position:relative; width:260px; height:260px; margin:6px auto;}
.wheel-admin-wrap canvas{width:260px; height:260px; display:block; filter:drop-shadow(0 3px 12px rgba(0,0,0,.5));}
.wheel-admin-wrap .wheel-pointer{font-size:26px; top:-9px;}

/* ---------- Mystery gift box (CSS sweets-box style) ---------- */
.gift-box{position:relative; width:64px; height:64px; flex-shrink:0;
  animation:giftFloat 2.6s ease-in-out infinite; filter:drop-shadow(0 4px 8px rgba(0,0,0,.45));}
@keyframes giftFloat{0%,100%{transform:translateY(0) rotate(-2deg);} 50%{transform:translateY(-6px) rotate(2deg);}}
.gift-body{position:absolute; left:6px; right:6px; bottom:4px; height:34px;
  background:linear-gradient(180deg,#b71c1c,#7f0000); border-radius:4px 4px 6px 6px;
  border:1px solid #d4a017;}
.gift-lid{position:absolute; left:2px; right:2px; bottom:34px; height:14px;
  background:linear-gradient(180deg,#d32f2f,#8e0000); border-radius:5px;
  border:1px solid #d4a017; animation:lidWiggle 2.6s ease-in-out infinite;}
@keyframes lidWiggle{0%,100%{transform:rotate(0deg);} 50%{transform:rotate(-4deg) translateY(-1px);}}
.gift-ribbon-v{position:absolute; left:50%; top:2px; bottom:4px; width:10px; transform:translateX(-50%);
  background:linear-gradient(90deg,#ffca28,#ff8f00,#ffca28); border-radius:2px;}
.gift-ribbon-h{position:absolute; left:2px; right:2px; bottom:36px; height:8px;
  background:linear-gradient(180deg,#ffca28,#ff8f00); border-radius:2px;}
.gift-bow{position:absolute; left:50%; bottom:46px; width:22px; height:14px; transform:translateX(-50%);}
.gift-bow::before,.gift-bow::after{content:''; position:absolute; top:0; width:12px; height:12px;
  background:radial-gradient(circle at 30% 30%, #ffe082, #ff8f00); border-radius:50% 50% 50% 0;}
.gift-bow::before{left:0; transform:rotate(-30deg);}
.gift-bow::after{right:0; transform:scaleX(-1) rotate(-30deg);}
.gift-sparkle{position:absolute; font-size:13px; animation:sparkle 1.8s ease-in-out infinite;}
.gift-sparkle.s1{top:-4px; right:0;}
.gift-sparkle.s2{bottom:8px; left:-4px; animation-delay:.9s; font-size:10px;}
@keyframes sparkle{0%,100%{opacity:.25; transform:scale(.8);} 50%{opacity:1; transform:scale(1.25);}}

.tabs{
  position:sticky; top:61px; z-index:40; display:flex; gap:8px; max-width:720px; margin:12px auto 0;
  padding:0 16px 4px; background:transparent;
}
.tab{
  flex:1; padding:12px 6px; border-radius:14px; border:1px solid var(--border);
  background:var(--card); color:var(--muted); font-family:inherit; font-size:15px; font-weight:600; cursor:pointer;
}
.tab.active{background:linear-gradient(135deg,#00c853,#00e676); color:#04140a; border-color:transparent;}
.tab-points{background:rgba(0,0,0,.25); border-radius:10px; padding:1px 8px; font-size:13px; margin-left:4px;}
.tab.active .tab-points{background:rgba(255,255,255,.35);}

main{max-width:720px; margin:0 auto; padding:8px 16px 24px;}
.tab-panel{display:none;}
.tab-panel.active{display:block; animation:fadeIn .25s ease;}
@keyframes fadeIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;}}

.section-head{display:flex; align-items:center; justify-content:space-between; margin:20px 0 10px;}
.section-head h2{margin:0; font-size:18px;}
.section-head .hint{font-size:12px; color:var(--muted); font-weight:400;}
.live-dot{display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--red); margin-right:6px; animation:pulse 1.4s infinite;}
@keyframes pulse{0%,100%{opacity:1;} 50%{opacity:.3;}}
.small-btn{background:var(--card); border:1px solid var(--border); color:var(--text); border-radius:10px; padding:8px 14px; font-family:inherit; font-size:14px; cursor:pointer;}
.small-btn:active{transform:scale(.95);}

.status-box{margin:12px 0; border-radius:14px; padding:14px 16px; font-size:15px; display:none;}
.status-box.show{display:block;}
.status-box.warn{background:#2a1f00; border:1px solid #8a6d00; color:#ffe082;}
.status-box.err{background:#2b0d0d; border:1px solid #7a2020; color:#ffb3b3;}
.status-box.info{background:#0d2136; border:1px solid #1e4a7a; color:#bfe0ff;}
.status-box a{color:var(--green); font-weight:600;}

.match-list{display:flex; flex-direction:column; gap:12px;}
.match-card{background:var(--card); border:1px solid var(--border); border-radius:16px; padding:14px 16px;}
.match-card.live{border-color:var(--red); box-shadow:0 0 0 1px var(--red) inset;}
.match-meta{font-size:12px; color:var(--muted); margin-bottom:8px; display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
.live-badge{background:var(--red); color:#fff; font-size:11px; font-weight:700; border-radius:8px; padding:2px 8px; animation:pulse 1.4s infinite;}
.sample-badge{background:#5c4300; color:#ffe082; font-size:11px; font-weight:700; border-radius:8px; padding:2px 8px;}
.match-title{font-size:15px; font-weight:600; margin-bottom:10px;}
.score-line{display:flex; justify-content:space-between; align-items:center; background:var(--card2); border-radius:10px; padding:8px 12px; margin-bottom:6px; font-size:14px;}
.score-line .tname{font-weight:600;}
.score-line .tscore{color:var(--green); font-weight:700; font-variant-numeric:tabular-nums;}
.match-status{font-size:13px; color:var(--muted); margin-top:8px;}
.teams-row{display:flex; align-items:center; justify-content:space-between; gap:8px; margin:6px 0 12px;}
.team{flex:1; text-align:center; font-weight:600; font-size:15px; display:flex; flex-direction:column; align-items:center; gap:6px;}
.team img{width:44px; height:44px; border-radius:50%; object-fit:cover; background:var(--card2);}
.vs{color:var(--muted); font-size:13px; font-weight:600;}
.predict-row{display:flex; gap:10px;}
.predict-btn{flex:1; padding:13px 8px; border-radius:12px; border:1px solid var(--green); background:rgba(0,230,118,.08); color:var(--green); font-family:inherit; font-size:14px; font-weight:700; cursor:pointer;}
.predict-btn:active{transform:scale(.96); background:rgba(0,230,118,.18);}
.predicted-note{background:rgba(0,230,118,.1); border:1px dashed var(--green); color:var(--green); border-radius:12px; padding:10px 12px; font-size:14px; text-align:center;}
.predicted-note button{background:none; border:none; color:var(--muted); text-decoration:underline; font-family:inherit; font-size:12px; cursor:pointer; margin-top:4px;}
.pred-closed{background:rgba(255,107,107,.08); border:1px dashed #ff6b6b; color:#ff9d9d; border-radius:12px; padding:10px 12px; font-size:14px; text-align:center; margin-top:10px;}
.pred-closed-reason{font-size:12px; color:var(--muted); margin-top:4px;}

.score-hero{background:linear-gradient(135deg,#10231a,#0d1f2d); border:1px solid var(--border); border-radius:20px; padding:24px 16px; text-align:center; margin-top:12px;}
.score-label{color:var(--muted); font-size:14px;}
.score-big{font-size:56px; font-weight:700; color:var(--gold); line-height:1.2; font-variant-numeric:tabular-nums;}
.score-stats{display:flex; justify-content:center; gap:28px; margin-top:12px;}
.stat{display:flex; flex-direction:column;}
.stat-num{font-size:24px; font-weight:700; font-variant-numeric:tabular-nums;}
.stat-num.good{color:var(--green);} .stat-num.bad{color:var(--red);}
.stat-lbl{font-size:12px; color:var(--muted);}

.history-card{background:var(--card); border:1px solid var(--border); border-radius:14px; padding:12px 14px;}
.history-top{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:6px;}
.history-title{font-size:14px; font-weight:600;}
.result-tag{font-size:12px; font-weight:700; border-radius:8px; padding:3px 10px; white-space:nowrap;}
.result-tag.win{background:rgba(0,230,118,.15); color:var(--green);}
.result-tag.lose{background:rgba(255,82,82,.15); color:var(--red);}
.result-tag.pending{background:rgba(255,193,7,.15); color:var(--gold);}
.history-detail{font-size:13px; color:var(--muted);}
.settle-btn{margin-top:8px; width:100%; padding:10px; border-radius:10px; border:1px solid var(--blue); background:rgba(68,138,255,.1); color:var(--blue); font-family:inherit; font-weight:700; cursor:pointer;}
.empty-note{text-align:center; color:var(--muted); padding:28px 12px; font-size:15px; background:var(--card); border:1px dashed var(--border); border-radius:14px;}

.sample-notice{background:#1a2338; border:1px dashed var(--blue); color:#bfe0ff; border-radius:12px; padding:12px 14px; font-size:14px; margin:12px 0;}
.data-attr{text-align:center; color:var(--muted); font-size:12px; margin:14px 0 4px;}
.data-attr a{color:var(--green); font-weight:600;}

.how-it-works{margin-top:28px;}
.how-it-works h2{font-size:18px; margin-bottom:12px;}
.steps{display:flex; flex-direction:column; gap:10px;}
.step{display:flex; gap:14px; align-items:flex-start; background:var(--card); border:1px solid var(--border); border-radius:14px; padding:14px 16px;}
.step-num{background:linear-gradient(135deg,#00c853,#00e676); color:#04140a; font-weight:700; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:16px;}
.step small{color:var(--muted);}

.app-footer{text-align:center; color:var(--muted); font-size:14px; padding:20px 16px 40px;}
.app-footer small{font-size:12px;}

.last-updated{text-align:center; color:var(--muted); font-size:12px; margin-top:12px;}

.modal{position:fixed; inset:0; z-index:100; background:rgba(0,0,0,.7); display:flex; align-items:flex-end; justify-content:center; padding:0;}
.modal.hidden{display:none;}
.modal-card{background:var(--card2); border:1px solid var(--border); border-radius:20px 20px 0 0; width:100%; max-width:520px; padding:20px 18px 28px; max-height:88vh; overflow-y:auto; animation:slideUp .25s ease;}
@keyframes slideUp{from{transform:translateY(40px); opacity:0;} to{transform:none; opacity:1;}}
.modal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:14px;}
.modal-head h3{margin:0; font-size:18px;}
.field-label{display:block; font-size:14px; font-weight:600; margin:14px 0 6px;}
.field-label small{color:var(--muted); font-weight:400;}
.text-input{width:100%; padding:13px 14px; border-radius:12px; border:1px solid var(--border); background:var(--bg); color:var(--text); font-family:inherit; font-size:15px;}
.text-input:focus{outline:none; border-color:var(--green);}
.field-help{font-size:13px; color:var(--muted); margin:8px 0 0;}
.field-help a{color:var(--green);}
.modal-actions{display:flex; gap:10px; margin-top:18px;}
.btn-primary{flex:2; padding:14px; border:none; border-radius:12px; background:linear-gradient(135deg,#00c853,#00e676); color:#04140a; font-family:inherit; font-size:16px; font-weight:700; cursor:pointer;}
.btn-primary:active{transform:scale(.97);}
.btn-ghost{flex:1; padding:14px; border-radius:12px; border:1px solid var(--border); background:transparent; color:var(--muted); font-family:inherit; font-size:14px; cursor:pointer;}
.settings-msg{margin-top:12px; font-size:14px; text-align:center; min-height:20px;}
.settings-msg.ok{color:var(--green);} .settings-msg.err{color:var(--red);}
.settle-title{font-size:15px; font-weight:600;}
.settle-btns{display:flex; flex-direction:column; gap:10px; margin-top:12px;}
.settle-btns button{padding:14px; border-radius:12px; border:1px solid var(--border); background:var(--card); color:var(--text); font-family:inherit; font-size:15px; font-weight:600; cursor:pointer;}
.settle-btns button:active{transform:scale(.97); border-color:var(--green);}

@media(min-width:600px){
  .modal{align-items:center; padding:20px;}
  .modal-card{border-radius:20px;}
  .steps{flex-direction:row;}
  .step{flex:1;}
}

/* ---------- Auth / gates / referral / ads / leaderboard ---------- */
.header-actions{display:flex; gap:8px; align-items:center;}
.user-chip{background:rgba(0,230,118,.12); border:1px solid var(--green); color:var(--green);
  border-radius:12px; padding:6px 12px; font-size:13px; font-weight:600;}
.user-chip.hidden{display:none;}

.gate-strip{max-width:720px; margin:10px auto 0; padding:10px 16px; display:none;
  gap:8px; align-items:center; flex-wrap:wrap; font-size:14px;
  background:#141b2e; border:1px solid var(--border); border-radius:14px;
  margin-left:16px; margin-right:16px;}
.gate-strip.show{display:flex;}
.gate-strip.hidden{display:none;}
.gate-btn{background:linear-gradient(135deg,#00c853,#00e676); color:#04140a; border:none;
  border-radius:10px; padding:9px 14px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer;}
.gate-btn:active{transform:scale(.96);}
.gate-ok{color:var(--green); font-weight:600; font-size:13px;}
.gate-note{background:rgba(255,193,7,.08); border:1px dashed var(--gold); color:var(--gold);
  border-radius:12px; padding:10px 12px; font-size:14px; text-align:center;}
.link-btn{background:none; border:none; color:var(--green); font-family:inherit; font-size:14px;
  font-weight:700; text-decoration:underline; cursor:pointer; padding:0;}
.not-counted{display:inline-block; background:rgba(255,193,7,.15); color:var(--gold);
  font-size:11px; font-weight:700; border-radius:8px; padding:2px 8px; margin-left:6px;}

.ref-card{margin-top:14px;}
.ref-card-inner{background:linear-gradient(135deg,#1a2338,#141b2e); border:1px solid var(--blue);
  border-radius:16px; padding:14px 16px; display:flex; flex-direction:column; gap:8px; font-size:15px;}
.ref-card-inner .small-btn{align-self:flex-start;}

.ad-slot{background:#000; border:1px solid var(--border); border-radius:14px; min-height:220px;
  display:flex; align-items:center; justify-content:center; margin:12px 0; overflow:hidden;}
.ad-placeholder{color:var(--muted); text-align:center; padding:24px; font-size:14px;}
.ad-video-wrap{width:100%; display:flex; flex-direction:column; gap:8px; align-items:center;}
.ad-video{width:auto; max-width:100%; max-height:300px; background:#000; border-radius:10px;}
.ad-video-frame{width:100%; max-width:520px; height:320px; border:0; border-radius:10px; background:#000;}
.ad-video-hint{color:var(--gold); font-weight:700; font-size:14px;}
.ad-video-link{color:var(--gold); font-weight:700; font-size:14px; text-decoration:none;}
.ad-timer{text-align:center; color:var(--gold); font-weight:700; margin:8px 0; font-size:15px;}
.ad-timer.hidden{display:none;}

.ref-progress{margin:14px 0;}
.ref-bar{background:var(--bg); border:1px solid var(--border); border-radius:12px; height:18px; overflow:hidden;}
.ref-bar-fill{height:100%; width:0%; background:linear-gradient(90deg,#00c853,#00e676); transition:width .4s ease;}
.ref-count{text-align:center; font-weight:700; font-size:16px; margin-top:6px; color:var(--green);}
.ref-link-row{display:flex; gap:8px;}
.ref-link-row .text-input{flex:1;}
.ref-code{background:var(--bg); border:2px dashed var(--green); color:var(--green); text-align:center;
  font-size:22px; font-weight:700; letter-spacing:2px; border-radius:12px; padding:12px;}

.config-head{margin:20px 0 4px; font-size:15px; color:var(--gold);}
.config-head small{color:var(--muted); font-weight:400; font-size:12px;}
textarea.text-input{resize:vertical; font-family:monospace; font-size:13px;}

.board-row{display:flex; align-items:center; gap:12px; background:var(--card);
  border:1px solid var(--border); border-radius:14px; padding:12px 14px;}
.board-row.me{border-color:var(--green); background:rgba(0,230,118,.06);}
.board-rank{font-size:20px; min-width:36px; text-align:center;}
.board-name{flex:1; font-weight:600; font-size:15px;}
.board-score{font-size:13px; color:var(--muted); font-weight:600;}

/* Adsterra banner slots */
.ad-banner-wrap{display:flex;justify-content:center;margin:10px auto;min-height:50px;max-width:100%;overflow:hidden}

/* ---------- Auth tabs ---------- */
.auth-tabs{display:flex; gap:8px; margin:4px 0 6px;}
.auth-tab{flex:1; padding:11px 6px; border-radius:12px; border:1px solid var(--border);
  background:var(--bg); color:var(--muted); font-family:inherit; font-size:14px; font-weight:700; cursor:pointer;}
.auth-tab.active{background:linear-gradient(135deg,#00c853,#00e676); color:#04140a; border-color:transparent;}
.auth-tab:active{transform:scale(.97);}
.hidden{display:none !important;}

/* ---------- CAPTCHA ---------- */
.captcha-row{display:flex; gap:10px; align-items:center; margin-top:6px;}
#captchaCanvas{border:1px solid var(--border); border-radius:12px; background:#0a0e1a; max-width:100%;}
.otp-input{text-align:center; font-size:26px; letter-spacing:10px; font-weight:700; font-variant-numeric:tabular-nums;}

/* ---------- Admin dashboard ---------- */
.admin-card{max-width:640px;}
.stat-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px;}
.stat-card{background:var(--bg); border:1px solid var(--border); border-radius:14px; padding:16px 12px; text-align:center;}
.stat-card-num{font-size:30px; font-weight:700; color:var(--green); font-variant-numeric:tabular-nums;}
.stat-card-lbl{font-size:12px; color:var(--muted); margin-top:4px;}
.table-scroll{overflow-x:auto; margin-top:12px; border:1px solid var(--border); border-radius:14px;}
.admin-table{width:100%; border-collapse:collapse; font-size:13px; min-width:560px;}
.admin-table th{background:var(--bg); color:var(--muted); text-align:left; padding:10px 12px; font-size:12px; white-space:nowrap; position:sticky; top:0;}
.admin-table td{padding:10px 12px; border-top:1px solid var(--border); vertical-align:top;}
.admin-table tr:nth-child(even) td{background:rgba(255,255,255,.02);}
.admin-table code{background:var(--bg); padding:2px 8px; border-radius:6px; font-size:12px;}
select.text-input{appearance:auto;}

/* ===== Referral section v2 ===== */
.ref-warning{background:rgba(255,61,0,.12); border:2px solid #ff3d00; border-radius:12px;
  padding:10px 12px; margin:10px 0; font-size:14px; color:#ffab91; text-align:center;}
.ref-progress-big{margin:14px 0; text-align:center;}
.ref-count-big{font-size:34px; font-weight:800; color:var(--green); letter-spacing:1px; margin-bottom:8px;}
.ref-bar.big{height:26px; border-radius:14px;}
.ref-bar.big .ref-bar-fill{background:linear-gradient(90deg,#ff9100,#00c853,#00e676); transition:width .6s ease;}
.ref-milestone{margin-top:8px; font-size:14px; font-weight:600; color:#ffd54f;}
.ref-milestone.done{color:var(--green);}
.ref-share-row{display:flex; gap:8px; margin:10px 0 4px;}
.share-btn{flex:1; text-align:center; padding:10px 4px; border-radius:10px; font-weight:700;
  font-size:13px; text-decoration:none; color:#fff;}
.share-btn.wa{background:#25d366;} .share-btn.fb{background:#1877f2;} .share-btn.tg{background:#229ed9;}
.ref-list-head{display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-weight:700; margin:14px 0 8px; font-size:14px;}
.ref-list{max-height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:6px;}
.ref-member{display:flex; align-items:center; gap:10px; background:var(--bg);
  border:1px solid var(--border); border-radius:10px; padding:8px 10px;}
.ref-avatar{width:34px; height:34px; border-radius:50%; background:var(--green); color:#06281c;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:16px; flex:0 0 auto;}
.ref-member-name{font-weight:700; font-size:14px;}
.ref-member-date{font-size:12px; color:var(--muted);}

/* ===== Ad gate anti-skip ===== */
#adStatusText{font-size:14px; font-weight:600; color:#ffd54f; margin-top:8px; text-align:center;}
#adTapPrompt{margin-top:10px; text-align:center;}
#adTapBtn{animation:pulse 1s infinite;}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}

/* ===== Sister sites footer ===== */
.sister-sites{margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--border);}
.sister-title{font-weight:800; font-size:15px; margin-bottom:10px; color:#ffd54f;}
.sister-grid{display:grid; grid-template-columns:1fr 1fr; gap:8px;}
.sister-link{display:flex; align-items:center; gap:8px; background:var(--bg);
  border:1px solid var(--border); border-radius:10px; padding:10px;
  color:var(--text); text-decoration:none; font-size:13px; font-weight:600;}
.sister-link:active{transform:scale(.97);}
@media (max-width:380px){ .sister-grid{grid-template-columns:1fr;} }

/* Tick-mark prediction UI */
.predict-tick-box{background:rgba(0,230,118,.05); border:1px solid rgba(0,230,118,.25); border-radius:14px; padding:12px; margin-top:10px;}
.predict-q{font-weight:800; font-size:15px; margin-bottom:10px; text-align:center;}
.tick-row{display:flex; align-items:center; gap:12px; width:100%; padding:14px 12px; margin:8px 0 0; border-radius:12px; border:2px solid rgba(255,255,255,.14); background:rgba(255,255,255,.04); color:inherit; font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; text-align:left;}
.tick-row:active{transform:scale(.97); border-color:var(--green); background:rgba(0,230,118,.12);}
.tick-box{font-size:26px; line-height:1; flex:0 0 auto; color:var(--muted);}
.tick-row:active .tick-box{color:var(--green);}
.tick-team{flex:1;}

/* Winner banner */
.winner-banner{display:flex; align-items:center; gap:12px; background:linear-gradient(135deg,#3d2b00,#6b4e00); border:2px solid #ffcf40; border-radius:14px; padding:14px; margin:12px 0; font-size:15px; font-weight:700;}
.winner-banner .trophy{font-size:34px;}

/* Admin report table */
.sort-th{cursor:pointer; user-select:none;}
.sort-th:hover{color:var(--green);}

/* Match detail modal */
.match-card[data-mid]{cursor:pointer;}
.detail-teams{display:flex; align-items:center; justify-content:space-between; gap:8px; margin:14px 0 6px;}
.detail-team{flex:1; text-align:center;}
.detail-team img{width:56px; height:56px; object-fit:contain; border-radius:10px; background:rgba(255,255,255,.06); padding:4px;}
.detail-team .dt-name{font-weight:800; font-size:15px; margin-top:6px;}
.detail-team .dt-score{font-weight:800; font-size:17px; color:var(--green); margin-top:4px;}
.detail-vs{font-weight:800; color:var(--muted); font-size:14px; flex:0 0 auto;}
.detail-rows{margin-top:12px; display:flex; flex-direction:column; gap:8px;}
.detail-row{display:flex; gap:10px; align-items:flex-start; background:rgba(255,255,255,.04); border-radius:10px; padding:10px 12px; font-size:14px;}
.detail-row .dr-ico{flex:0 0 auto; font-size:16px;}
.detail-row .dr-label{color:var(--muted); font-size:12px; margin-bottom:2px;}
.detail-row .dr-val{font-weight:700;}
.detail-comp{text-align:center; color:var(--muted); font-size:13px; font-weight:600; margin-bottom:4px;}
.tap-hint{text-align:center; color:var(--muted); font-size:12px; margin-top:8px; opacity:.8;}

/* ---------- Member dashboard: rank + prize + withdraw ---------- */
.rank-card{margin-top:12px; background:linear-gradient(135deg,#141d33,#101828); border:1px solid var(--border); border-radius:14px; padding:12px 16px; font-size:15px; color:var(--text);}
.rank-card strong{color:#ffd166; font-size:18px;}
.rank-of{color:var(--muted); font-size:13px;}
.prize-card{margin-top:12px; background:linear-gradient(135deg,#2b2110,#1d1607); border:1px solid #ffd166; border-radius:14px; padding:14px 16px; font-size:15px; color:var(--text);}
.prize-amt{color:#ffd166; font-size:20px;}
.wd-methods{display:flex; gap:8px; margin:4px 0 12px;}
.wd-method{flex:1; padding:12px 8px; border-radius:12px; border:1px solid var(--border); background:#101828; color:var(--text); font-size:15px; cursor:pointer;}
.wd-method.active{border-color:#ffd166; background:#2b2110; font-weight:bold;}

/* ---------- Welcome notice ---------- */
.welcome-card{max-width:520px; border:2px solid #ffd166; box-shadow:0 0 40px rgba(255,209,102,.25);}
.welcome-prize{background:linear-gradient(135deg,#2b2110,#1d1607); border:1px solid #ffd166; border-radius:12px; padding:12px 16px; font-size:17px; margin:8px 0 12px; text-align:center;}
.welcome-prize strong{color:#ffd166; font-size:22px;}
.welcome-rules{list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:8px; font-size:14px; line-height:1.5;}
.welcome-rules li{background:#101828; border:1px solid var(--border); border-radius:10px; padding:9px 12px;}
.welcome-timer{height:8px; background:#101828; border-radius:6px; overflow:hidden; margin:6px 0;}
.welcome-bar{height:100%; width:100%; background:linear-gradient(90deg,#ffd166,#ff9f1c); border-radius:6px; transition:width 1s linear;}