<!--
================================================================
 LOBSTAR GAMES — game.html
 Version : v1.5.5
 Date    : 2026-02-28
----------------------------------------------------------------
 CHANGELOG
 v1.5.0 — 2026-02-28
   DESIGN: Premium casino redesign
   DESIGN: Cinzel serif font for all headers/labels
   DESIGN: Richer bjtable felt — arc top, texture, casino watermark
   DESIGN: Card fan effect with subtle rotation
   DESIGN: Lobster card back
   DESIGN: Glossy card sheen overlay
   DESIGN: Better bet arc with "PLACE YOUR BETS"
   DESIGN: Gold dividers with glow
   DESIGN: Cinzel throughout — panels, badges, buttons
   DESIGN: Richer body background grid
 v1.4.3 — 2026-02-28
   FIX: Cleanup now deletes stale PLAYING races too (not just waiting)
   FIX: Also removes player from other stale playing races they joined
   FIX: Timer guard — stops ticking if player left waiting room
   FIX: Timer resets display to 45 immediately on room open
   FIX: finished_at now set when race resolves (stops zombie races)
 v1.4.2 — 2026-02-28
   FIX: Duplicate races — cleanMyStaleRaces now deletes ALL waiting races by player on lobby open
   FIX: Race list deduplicates by host, shows newest only
   FIX: loadOpenRaces orders by created_at desc
 v1.4.1 — 2026-02-28
   FIX: Game didn't start — joiner now takes over if host inactive after timer
   FIX: Duplicate race — createRace reuses existing open race by same player
   FIX: Seat 1&2 overlap — arc spread widened from 140deg to 120deg (210-330)
   FIX: Brighter fonts — seat names 50%→85% opacity, scores gold tint
 v1.4.0 — 2026-02-28
   + Cards 58×84 → 74×108px (+28% bigger), font 15→19px
   + Score badge font 17→22px
   + Table shape: rectangle → casino oval/circle with wood rail
   + Felt watermarks: "BLACKJACK PAYS 3 TO 2" + "DEALER MUST STAND ON 17"
   + Split fixed: hand 0 stand → hand 1, hand 1 stand → dealer
   + endHand split routing corrected
   + Deck: 1 deck → 2-deck shoe with cut card
   + Dealer now hits soft 17 (more busts, better for player)
 v1.3.0 — 2026-02-28
   + Lobby timer reduced 60s → 45s
   + Inactivity system: 15s idle = warning banner flashes
   + 25s idle = auto-stand, turn passes to next player
   + resetInactivityTimer() called on every hit/double action
   + Warning cleared on stand/race end
 v1.2.0 — 2026-02-28
   + Full casino D-shape table redesign (wood rail + green felt)
   + "LOBSTAR CASINO" watermark on felt
   + buildTableSeats() — shared fn for both waiting room and live race
   + Chip-style seat markers (red for others, gold for you)
   + Cards laid flat on felt surface per player
   + Live race bar also shows proper casino table
   + Seats arc-positioned using trig across 200-340deg
 v1.1.0 — 2026-02-28
   + Round table layout — players positioned around oval arc
   + Cards visible for ALL players in race bar (fixed poll query)
   + 6-seat table always shown, host can only start when full OR timer expires
   + Auto-start on timer expiry with whoever is present (no confirm)
   + Leave race mid-game = lose your bet (penalty deducted + saved to DB)
   + Seat numbers 1-6 positioned around the felt oval
   + Race bar also uses oval positioning
 v1.0.0 — 2026-02-28
   + Race mode with 6-seat black felt table
   + Auto-start with available players (60s timer)
   + Casino table layout (dealer top, players bottom arc)
   + Mini cards visible on table during race
   + Seat numbers 1-6 (casino style)
   + Custom bet input (100-10K) with quick-set buttons
   + Solo vs Dealer mode when 1 player
   + Staggered Jito bundles (phase 1 create, phase 2 fresh blockhash)
   + Leave Game button below action row
   + Home button (gold, visible top-left)
   + Leave & Go Home from waiting room + results
   + Auto-cleanup stale races on lobby open
   + Duplicate race prevention (DB constraint)
   + Exit warnings on HOME/back/refresh
   + ESC key closes race overlays
   + Lobstar brown/orange table theme -> now black felt
   + X community link updated throughout
================================================================
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LOBSTAR GAMES - Crypto Blackjack</title>
<link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Cinzel:wght@400;600;700;900&family=Rajdhani:wght@400;600;700&family=Share+Tech+Mono&display=swap" rel="stylesheet">
<style>
:root{
  --gold:#FFB800; --gold2:#E8960A; --gold-dim:#7a5c00; --gold-glow:rgba(255,184,0,0.35);
  --red:#cc2200; --red-glow:#ff3300; --red-dim:rgba(255,51,0,0.15);
  --bg:#060608; --bg2:#08090c; --panel:#0e0f12; --panel2:#131418; --border:rgba(255,184,0,0.12);
  --green:#00ff88; --green-dim:rgba(0,255,136,0.15); --cyan:#00e5ff;
  --felt:#0d1f0d; --felt2:#0a1a0a; --wood:#3d1f00; --wood2:#2a1400;
  --text:#f0d99a; --text-dim:#7a6040; --text-muted:rgba(240,217,154,0.45); --white:#faf3e0;
  --chip-h:58px; --radius:8px;
  --shadow-gold:0 0 24px rgba(255,184,0,0.25); --shadow-card:0 6px 20px rgba(0,0,0,0.8);
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);font-family:'Rajdhani',sans-serif;color:var(--text);min-height:100vh;overflow-x:hidden;
  background-image:
    radial-gradient(ellipse 100% 60% at 50% 0%, rgba(255,120,0,0.07) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 50% 100%, rgba(180,80,0,0.05) 0%, transparent 60%),
    repeating-linear-gradient(0deg,   transparent,transparent 60px,rgba(255,184,0,0.018) 60px,rgba(255,184,0,0.018) 61px),
    repeating-linear-gradient(90deg,  transparent,transparent 60px,rgba(255,184,0,0.018) 60px,rgba(255,184,0,0.018) 61px);
  repeating-linear-gradient(0deg,transparent,transparent 40px,rgba(255,180,0,0.015) 40px,rgba(255,180,0,0.015) 41px),
  repeating-linear-gradient(90deg,transparent,transparent 40px,rgba(255,180,0,0.015) 40px,rgba(255,180,0,0.015) 41px);}

/* HEADER */
header{
  text-align:center;padding:14px 24px 0;
  background:linear-gradient(180deg,rgba(20,14,0,0.9) 0%,rgba(10,8,0,0.6) 100%);
  border-bottom:1px solid rgba(255,184,0,0.18);
  position:relative;
}
header::after{
  content:'';position:absolute;bottom:0;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,184,0,0.4),transparent);
}
.logo{
  font-family:'Cinzel',serif;font-size:clamp(32px,5vw,60px);letter-spacing:6px;line-height:1;font-weight:900;
  background:linear-gradient(180deg,#fff8e0 0%,#FFB800 35%,#E8960A 65%,#cc6600 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 30px rgba(255,150,0,0.5));
  text-shadow:none;
}
.logo-star{
  display:inline-block;
  background:linear-gradient(180deg,#fff 0%,#FFB800 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 12px rgba(255,220,0,1));
}
.logo-sub{font-family:'Cinzel',serif;font-size:clamp(9px,1.2vw,13px);letter-spacing:14px;color:rgba(255,184,0,0.4);margin-top:2px;font-weight:400;}
.header-nav{display:flex;justify-content:space-between;align-items:center;max-width:1380px;margin:0 auto;}
.header-brand{display:flex;flex-direction:column;align-items:center;}
.header-btns{display:flex;gap:10px;align-items:center;}
.hbtn{
  font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;
  padding:7px 18px;border-radius:3px;cursor:pointer;transition:all .2s;
  background:transparent;border:1px solid rgba(255,184,0,0.25);color:rgba(255,184,0,0.6);
}
.hbtn:hover{border-color:var(--gold);color:var(--gold);box-shadow:0 0 14px rgba(255,184,0,0.2);}
.hbtn.active{background:rgba(255,184,0,0.1);border-color:var(--gold);color:var(--gold);}
.ticker-bar{
  display:flex;justify-content:center;gap:0;flex-wrap:wrap;
  padding:6px 0 8px;font-family:'Share Tech Mono',monospace;font-size:10.5px;
  border-top:1px solid rgba(255,184,0,0.07);max-width:1380px;margin:0 auto;
}
.ticker-item{
  display:flex;gap:6px;align-items:center;
  padding:0 16px;border-right:1px solid rgba(255,184,0,0.08);
}
.ticker-item:last-child{border-right:none;}
.tv{color:var(--gold);font-weight:600;}.tup{color:var(--green);}.tdn{color:var(--red-glow);}
.ticker-lbl{color:var(--text-muted);letter-spacing:1px;}

/* GRID */
.main-grid{display:grid;grid-template-columns:240px 1fr 240px;gap:12px;padding:12px 16px;max-width:1440px;margin:0 auto;}
@media(max-width:1060px){.main-grid{grid-template-columns:1fr 1fr;}.col-right{grid-column:1/-1;}}
@media(max-width:680px){.main-grid{grid-template-columns:1fr;}}

/* PANEL */
.panel{
  background:linear-gradient(160deg,#141418 0%,#0e0f12 60%,#0d0e10 100%);
  border:1px solid rgba(255,184,0,0.1);border-radius:6px;overflow:hidden;
  box-shadow:0 4px 20px rgba(0,0,0,0.5);
}
.ph{
  background:linear-gradient(90deg,rgba(255,184,0,0.12) 0%,rgba(255,184,0,0.04) 60%,transparent 100%);
  border-bottom:1px solid rgba(255,184,0,0.1);
  padding:9px 14px;font-family:'Cinzel',serif;font-size:11px;letter-spacing:5px;font-weight:700;
  color:rgba(255,184,0,0.8);display:flex;align-items:center;gap:10px;
}
.ph::before{
  content:'';width:2px;height:14px;flex-shrink:0;border-radius:2px;
  background:linear-gradient(180deg,var(--gold),var(--gold2));
  box-shadow:0 0 8px rgba(255,184,0,0.5);
}
.pb{padding:12px;}

/* SUPPLY */
.srw{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;}
.sring{position:relative;width:120px;height:120px;}
.sring svg{width:120px;height:120px;transform:rotate(-90deg);}
.rb{fill:none;stroke:rgba(255,184,0,0.1);stroke-width:8;}
.rf{fill:none;stroke:url(#rg);stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset 1.2s ease;}
.rc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.rv{font-family:'Cinzel',serif;font-size:22px;font-weight:700;line-height:1;color:var(--gold);filter:drop-shadow(0 0 8px rgba(255,184,0,0.5));}
.rl{font-size:10px;color:var(--text-dim);letter-spacing:2px;}
.sstats{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.sbox{
  background:linear-gradient(180deg,rgba(255,184,0,0.06) 0%,rgba(255,184,0,0.02) 100%);
  border:1px solid rgba(255,184,0,0.14);border-radius:5px;padding:8px;text-align:center;
  transition:border-color .2s;
}
.sbox:hover{border-color:rgba(255,184,0,0.3);}
.sv{font-family:'Bebas Neue',sans-serif;font-size:19px;color:var(--gold);line-height:1;}
.sl{font-size:8px;color:var(--text-muted);letter-spacing:3px;margin-top:3px;font-family:'Cinzel',serif;}
.bflash{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--red-glow);text-align:center;min-height:15px;transition:opacity 0.5s;}

/* WALLET */
.wbox{
  background:linear-gradient(135deg,rgba(255,184,0,0.07) 0%,rgba(255,184,0,0.02) 100%);
  border:1px solid rgba(255,184,0,0.18);border-radius:6px;
  padding:14px 12px;margin-bottom:10px;text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,184,0,0.1);
}
.waddr{font-family:'Share Tech Mono',monospace;font-size:9.5px;color:var(--text-muted);margin-bottom:5px;letter-spacing:1px;}
.wbal{
  font-family:'Bebas Neue',sans-serif;font-size:36px;color:var(--gold);line-height:1;
  filter:drop-shadow(0 0 16px rgba(255,184,0,0.45));letter-spacing:2px;
}
.wsub{font-size:9px;color:var(--text-muted);letter-spacing:5px;margin-top:4px;font-family:'Cinzel',serif;}
.srow{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:5px;}
.ms{background:rgba(255,184,0,0.04);border:1px solid rgba(255,184,0,0.1);border-radius:3px;padding:5px;text-align:center;}
.msv{font-family:'Bebas Neue',sans-serif;font-size:17px;color:var(--gold);}
.msl{font-size:9px;color:var(--text-dim);letter-spacing:1px;}
.pts-box{background:rgba(0,255,136,0.05);border:1px solid rgba(0,255,136,0.2);border-radius:3px;padding:8px;text-align:center;margin-top:5px;}
.pts-val{font-family:'Bebas Neue',sans-serif;font-size:26px;color:var(--green);filter:drop-shadow(0 0 8px rgba(0,255,136,0.4));}
.pts-lbl{font-size:9px;color:var(--text-dim);letter-spacing:2px;}
.btn-rst{background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.2);font-size:10px;padding:6px 12px;letter-spacing:1px;width:100%;margin-top:7px;border-radius:3px;cursor:pointer;font-family:'Bebas Neue',sans-serif;}
.btn-rst:hover{border-color:rgba(255,184,0,0.5);color:var(--gold);background:rgba(255,184,0,0.05);}

/* LEADERBOARD */
.lbwrap{max-height:260px;overflow-y:auto;}
.lbwrap::-webkit-scrollbar{width:3px;}
.lbwrap::-webkit-scrollbar-thumb{background:var(--gold-dim);}
.lbrow{
  display:grid;grid-template-columns:26px 1fr auto auto;gap:6px;align-items:center;
  padding:6px 10px;
  background:linear-gradient(90deg,rgba(255,184,0,0.03) 0%,transparent 100%);
  border:1px solid rgba(255,184,0,0.07);border-radius:5px;font-size:12px;margin-bottom:4px;
  transition:all .2s;
}
.lbrow:hover{background:rgba(255,184,0,0.05);border-color:rgba(255,184,0,0.15);}
.lbrow.me{border-color:rgba(255,184,0,0.35);background:rgba(255,184,0,0.08);box-shadow:0 0 12px rgba(255,184,0,0.08);}
.lbrnk{font-family:'Bebas Neue',sans-serif;font-size:14px;color:var(--text-muted);}
.lbrnk.g{color:#FFD700;text-shadow:0 0 10px rgba(255,215,0,0.6);}
.lbrnk.s{color:#C0C0C0;}.lbrnk.b{color:#CD7F32;}
.lbnm{font-weight:600;color:var(--white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;}
.lbpt{font-family:'Bebas Neue',sans-serif;font-size:14px;color:var(--gold);}
.lbbr{font-family:'Share Tech Mono',monospace;font-size:9px;color:var(--red-glow);}

/* TABLE */
.bjtable{
  position:relative;
  background:
    radial-gradient(ellipse 90% 80% at 50% 35%, #1c5520 0%,#0e3010 50%,#061208 100%);
  border-radius:160px 160px 40px 40px / 80px 80px 30px 30px;
  border:14px solid #3d1f00;
  outline:3px solid #1a0a00;
  box-shadow:
    0 0 0 1px #5a2e00,
    0 16px 60px rgba(0,0,0,0.95),
    inset 0 0 120px rgba(0,0,0,0.35),
    inset 0 -20px 60px rgba(0,0,0,0.3);
  padding:30px 44px 24px;
  display:flex;flex-direction:column;gap:12px;
  min-height:420px;
  overflow:hidden;
}
/* Table felt texture */
.bjtable::before{
  content:'';position:absolute;inset:0;
  background:
    repeating-linear-gradient(90deg, transparent, transparent 3px, rgba(0,0,0,0.04) 3px, rgba(0,0,0,0.04) 4px),
    repeating-linear-gradient(0deg,  transparent, transparent 3px, rgba(0,0,0,0.04) 3px, rgba(0,0,0,0.04) 4px);
  pointer-events:none;border-radius:inherit;
}
/* Casino text watermark */
.bjtable::after{
  content:'BLACKJACK  ·  PAYS 3 TO 2  ·  DEALER MUST STAND ON 17';
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-family:'Cinzel',serif;font-size:10px;letter-spacing:6px;
  color:rgba(255,255,255,0.055);white-space:nowrap;pointer-events:none;
}
/* Betting arc arc */
.bet-arc{
  position:absolute;bottom:180px;left:50%;transform:translateX(-50%);
  width:280px;height:60px;
  border:1.5px solid rgba(255,184,0,0.18);
  border-radius:0 0 200px 200px;
  border-top:none;pointer-events:none;
}
.bet-arc::before{
  content:'PLACE YOUR BETS';position:absolute;top:14px;left:50%;transform:translateX(-50%);
  font-family:'Cinzel',serif;font-size:8px;letter-spacing:4px;color:rgba(255,184,0,0.22);white-space:nowrap;
}

/* SPLIT LAYOUT */
.hands-area{display:flex;gap:10px;align-items:flex-start;}
.hand-col{flex:1;text-align:center;}
.hand-col.active-hand{background:rgba(255,184,0,0.05);border:1px solid rgba(255,184,0,0.25);border-radius:4px;padding:6px;}
.hand-col.inactive-hand{opacity:0.55;filter:grayscale(30%);}
.hand-label{font-family:'Cinzel',serif;font-size:12px;letter-spacing:4px;color:var(--text-muted);margin-bottom:10px;font-weight:600;text-transform:uppercase;}
.hand-label.active{color:var(--gold);text-shadow:0 0 12px rgba(255,184,0,0.4);}
.cards-row{display:flex;justify-content:center;gap:-4px;min-height:124px;align-items:center;padding:0 4px;}
.split-vs{font-family:'Bebas Neue',sans-serif;font-size:22px;color:var(--text-dim);padding-top:40px;flex-shrink:0;}

/* CARD */
.card{
  width:82px;height:120px;border-radius:10px;
  background:linear-gradient(155deg, #ffffff 0%, #f8f3ea 100%);
  border:1.5px solid rgba(0,0,0,0.1);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:5px 6px;font-family:'Cinzel',serif;font-weight:700;font-size:17px;
  box-shadow:
    0 8px 24px rgba(0,0,0,0.85),
    0 2px 4px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 0 0 1px rgba(0,0,0,0.04);
  animation:cdeal .38s cubic-bezier(.22,1.2,.36,1);
  position:relative;overflow:hidden;flex-shrink:0;
}
/* Glossy sheen */
.card::after{
  content:'';position:absolute;top:0;left:0;right:0;height:50%;
  background:linear-gradient(180deg,rgba(255,255,255,0.35) 0%,rgba(255,255,255,0) 100%);
  border-radius:10px 10px 0 0;pointer-events:none;
}
@keyframes cdeal{
  0%  {transform:translateY(-50px) rotate(-8deg) scale(0.65);opacity:0;filter:blur(2px);}
  60% {filter:blur(0);}
  100%{transform:translateY(0) rotate(0) scale(1);opacity:1;}
}
.card.red{color:#c8000a;}.card.black{color:#111;}
.card.facedown{
  background:
    radial-gradient(ellipse at 50% 50%, #1a5522 0%, #0a2010 100%);
  border-color:rgba(255,184,0,0.55);
  box-shadow:0 8px 24px rgba(0,0,0,0.9),0 0 0 1px rgba(255,184,0,0.25);
}
.card.facedown::after{
  content:'🦞';position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:32px;background:none;filter:saturate(0.6) brightness(0.7);
  text-shadow:0 0 16px rgba(255,184,0,0.4);
}
.ct{line-height:1;font-size:16px;font-weight:700;}
.cc{font-size:30px;text-align:center;line-height:1;margin:auto 0;display:flex;align-items:center;justify-content:center;}
.cb{line-height:1;transform:rotate(180deg);font-size:16px;font-weight:700;}

.cards-row .card:not(.facedown){transform-origin:bottom center;}
.cards-row .card:nth-child(2){transform:rotate(4deg) translateX(-2px);}
.cards-row .card:nth-child(3){transform:rotate(-2deg) translateX(2px);}
.cards-row .card:nth-child(4){transform:rotate(5deg) translateX(-4px);}
.cards-row .card:nth-child(5){transform:rotate(-5deg) translateX(4px);}
.sbadge{
  display:inline-block;
  background:rgba(0,0,0,0.85);
  border:1.5px solid rgba(255,184,0,0.4);
  border-radius:24px;padding:4px 18px;
  font-family:'Bebas Neue',sans-serif;font-size:24px;
  color:var(--gold);margin-top:8px;min-width:56px;text-align:center;
  box-shadow:0 0 16px rgba(0,0,0,0.6),inset 0 1px 0 rgba(255,184,0,0.1);
  letter-spacing:2px;
}
.sbadge.bust{color:var(--red-glow);border-color:rgba(255,51,0,0.6);box-shadow:0 0 16px rgba(255,51,0,0.2);}
.sbadge.bj{color:var(--green);border-color:rgba(0,255,136,0.5);box-shadow:0 0 16px rgba(0,255,136,0.2);}
.sbadge.won{color:var(--green);border-color:rgba(0,255,136,0.5);box-shadow:0 0 16px rgba(0,255,136,0.2);}
.sbadge.lost{color:var(--red-glow);border-color:rgba(255,51,0,0.5);}
.sbadge.push{color:var(--gold);}

.divider{height:1px;background:linear-gradient(90deg,transparent 0%,rgba(255,184,0,0.35) 40%,rgba(255,184,0,0.5) 50%,rgba(255,184,0,0.35) 60%,transparent 100%);margin:2px 0;}

/* WIN / LOSE FLASH */
@keyframes winflash{
  0%{box-shadow:inset 0 0 0 rgba(0,255,136,0);}
  30%{box-shadow:inset 0 0 80px rgba(0,255,136,0.18);}
  100%{box-shadow:inset 0 0 0 rgba(0,255,136,0);}
}
@keyframes loseflash{
  0%{box-shadow:inset 0 0 0 rgba(255,30,0,0);}
  30%{box-shadow:inset 0 0 80px rgba(255,30,0,0.15);}
  100%{box-shadow:inset 0 0 0 rgba(255,30,0,0);}
}
.bjtable.flash-win{animation:winflash 1s ease;}
.bjtable.flash-lose{animation:loseflash 1s ease;}

/* DEALER ZONE */
.dealer-zone{text-align:center;min-height:130px;padding-top:4px;}

/* BET */
.bet-area{display:flex;flex-direction:column;gap:8px;}
.bet-label{font-family:'Cinzel',serif;font-size:10px;letter-spacing:5px;color:rgba(255,184,0,0.35);text-align:center;text-transform:uppercase;}
.chips-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:4px 0;}
.chip{
  width:52px;height:52px;border-radius:50%;border:3px solid;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-family:'Bebas Neue',sans-serif;font-size:13px;cursor:pointer;
  transition:transform .15s,box-shadow .15s,filter .15s;user-select:none;
  position:relative;font-weight:400;line-height:1;
  box-shadow:0 4px 0 rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.12);
}
.chip::after{
  content:'';position:absolute;inset:4px;border-radius:50%;
  border:1px dashed rgba(255,255,255,0.12);pointer-events:none;
}
.chip:hover{transform:translateY(-3px) scale(1.08);}
.chip:active{transform:translateY(1px) scale(0.96);box-shadow:0 1px 0 rgba(0,0,0,0.5);}
.c100{background:radial-gradient(circle at 35% 35%,#2a5530,#0d2010);border-color:#00cc44;color:#00ff66;box-shadow:0 4px 0 #004416,0 0 16px rgba(0,204,68,0.25),inset 0 1px 0 rgba(255,255,255,0.1);}
.c500{background:radial-gradient(circle at 35% 35%,#4a2200,#1a0800);border-color:#ff8833;color:#ffaa55;box-shadow:0 4px 0 #551a00,0 0 16px rgba(255,102,0,0.25),inset 0 1px 0 rgba(255,255,255,0.1);}
.c1k{background:radial-gradient(circle at 35% 35%,#3a2800,#1a1100);border-color:var(--gold);color:#ffe066;box-shadow:0 4px 0 #6a4400,0 0 16px rgba(255,184,0,0.3),inset 0 1px 0 rgba(255,255,255,0.1);}
.c5k{background:radial-gradient(circle at 35% 35%,#2d0040,#150020);border-color:#cc44ff;color:#dd88ff;box-shadow:0 4px 0 #440066,0 0 16px rgba(200,0,255,0.25),inset 0 1px 0 rgba(255,255,255,0.1);}
.c10k{background:radial-gradient(circle at 35% 35%,#002233,#000f1a);border-color:#00ddff;color:#44eeff;box-shadow:0 4px 0 #004455,0 0 16px rgba(0,220,255,0.25),inset 0 1px 0 rgba(255,255,255,0.1);font-size:11px;}
.cclr{background:radial-gradient(circle at 35% 35%,#330011,#1a0008);border-color:#ff2255;color:#ff5577;box-shadow:0 4px 0 #660022,0 0 16px rgba(255,34,68,0.25),inset 0 1px 0 rgba(255,255,255,0.1);font-size:10px;}
.cur-bet{
  text-align:center;font-family:'Cinzel',serif;font-size:26px;color:var(--gold);
  font-weight:700;letter-spacing:3px;padding:4px 0;
  text-shadow:0 0 24px rgba(255,184,0,0.45);
}
.cur-bet span{font-size:10px;color:var(--text-muted);letter-spacing:5px;font-weight:400;font-family:'Share Tech Mono',monospace;}

/* ACTION BUTTONS */
.act-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:2px 0;}
.btn{
  font-family:'Cinzel',serif;font-size:14px;letter-spacing:3px;font-weight:700;
  padding:11px 24px;border-radius:5px;cursor:pointer;transition:all .15s;
  position:relative;overflow:hidden;
}
.btn::before{
  content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,0.06),transparent);
  transition:left .4s;
}
.btn:hover::before{left:100%;}
.btn:disabled{opacity:0.22;cursor:not-allowed;filter:grayscale(60%);}
.btn:disabled::before{display:none;}
.bdeal{
  background:linear-gradient(180deg,#dd6600 0%,#aa3300 50%,#882200 100%);
  color:#fff5cc;border:1px solid #ff8800;
  box-shadow:0 4px 0 #551100,0 0 24px rgba(220,100,0,0.35);
  font-size:17px;padding:14px 40px;letter-spacing:4px;
}
.bdeal:hover:not(:disabled){
  background:linear-gradient(180deg,#ff7700,#cc4400,#aa2200);
  box-shadow:0 4px 0 #661100,0 0 36px rgba(255,120,0,0.55);
  transform:translateY(-1px);
}
.bdeal:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #551100;}
.bhit{
  background:linear-gradient(180deg,#1e5028 0%,#0e2814 100%);
  color:#00ff88;border:1px solid rgba(0,200,80,0.5);
  box-shadow:0 3px 0 #052010,0 0 16px rgba(0,200,80,0.2);
}
.bhit:hover:not(:disabled){
  background:linear-gradient(180deg,#286635,#143018);
  box-shadow:0 3px 0 #052010,0 0 24px rgba(0,255,136,0.35);transform:translateY(-1px);
}
.bstand{
  background:linear-gradient(180deg,#40200a 0%,#200d00 100%);
  color:var(--gold);border:1px solid rgba(255,184,0,0.35);
  box-shadow:0 3px 0 #100600,0 0 14px rgba(255,184,0,0.15);
}
.bstand:hover:not(:disabled){
  box-shadow:0 3px 0 #100600,0 0 22px rgba(255,184,0,0.35);transform:translateY(-1px);
}
.bdbl{
  background:linear-gradient(180deg,#26005a 0%,#130030 100%);
  color:#dd88ff;border:1px solid rgba(180,0,255,0.4);
  box-shadow:0 3px 0 #0a0020,0 0 14px rgba(180,0,255,0.2);
}
.bdbl:hover:not(:disabled){
  box-shadow:0 3px 0 #0a0020,0 0 22px rgba(200,80,255,0.4);transform:translateY(-1px);
}
.bsplit{
  background:linear-gradient(180deg,#002855 0%,#001433 100%);
  color:#44ccff;border:1px solid rgba(0,160,255,0.4);
  box-shadow:0 3px 0 #000a20,0 0 14px rgba(0,160,255,0.2);
}
.bsplit:hover:not(:disabled){
  box-shadow:0 3px 0 #000a20,0 0 22px rgba(0,200,255,0.4);transform:translateY(-1px);
}

.result-msg{text-align:center;font-family:'Cinzel',serif;font-size:18px;letter-spacing:5px;min-height:28px;font-weight:600;color:var(--text-muted);}

/* POST-GAME OVERLAY */
.pgo{display:none;position:absolute;inset:0;z-index:20;background:radial-gradient(ellipse at 50% 40%,rgba(10,5,0,0.95),rgba(0,0,0,0.98));border-radius:inherit;flex-direction:column;align-items:center;justify-content:center;gap:20px;backdrop-filter:blur(8px);}
.pgo.show{display:flex;animation:pgin .3s ease;}
@keyframes pgin{from{opacity:0;transform:scale(0.94)}to{opacity:1;transform:scale(1)}}
.pgr{font-family:'Cinzel',serif;font-size:clamp(36px,5vw,60px);letter-spacing:4px;text-align:center;line-height:1;font-weight:900;}
.pgwin{color:var(--green);filter:drop-shadow(0 0 22px rgba(0,255,136,0.8));animation:pgpop .45s ease;}
.pglose{color:var(--red-glow);filter:drop-shadow(0 0 22px rgba(255,51,0,0.8));animation:pgpop .45s ease;}
.pgpush{color:var(--gold);filter:drop-shadow(0 0 14px rgba(255,184,0,0.5));}
.pgbj{color:#FFD700;filter:drop-shadow(0 0 28px rgba(255,215,0,1));animation:pgpop .45s ease;}
@keyframes pgpop{0%{transform:scale(0.55);opacity:0}65%{transform:scale(1.12)}100%{transform:scale(1);opacity:1}}
.pgd{font-family:'Share Tech Mono',monospace;font-size:13px;color:var(--text-dim);text-align:center;line-height:2.2;}
.pgd .amt{color:var(--gold);font-size:19px;}
.pgd .ptsclr{color:var(--green);font-size:15px;}
.pgd .brn{color:var(--red-glow);}
.pgd .split-results{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:4px;}
.pgd .split-hand{background:rgba(255,184,0,0.06);border:1px solid rgba(255,184,0,0.2);border-radius:4px;padding:6px 14px;text-align:center;}

.btn-next{background:linear-gradient(180deg,#cc5500 0%,#882200 100%);color:#fff8e0;border:2px solid rgba(255,160,0,0.7);font-family:'Cinzel',serif;font-size:20px;font-weight:700;letter-spacing:4px;padding:16px 60px;border-radius:6px;cursor:pointer;animation:npulse 1.2s ease-in-out infinite;transition:transform .15s;box-shadow:0 4px 0 #441100;}
.btn-next:hover{transform:scale(1.06);box-shadow:0 0 55px rgba(255,140,0,0.7);}
@keyframes npulse{0%,100%{box-shadow:0 0 26px rgba(255,100,0,0.38);}50%{box-shadow:0 0 50px rgba(255,160,0,0.65),0 0 14px rgba(255,210,0,0.3);}}

.cdwrap{display:flex;flex-direction:column;align-items:center;gap:5px;}
.cdring{position:relative;width:46px;height:46px;}
.cdring svg{transform:rotate(-90deg);}
.cdbg{fill:none;stroke:rgba(255,184,0,0.14);stroke-width:4;}
.cdfill{fill:none;stroke:var(--gold);stroke-width:4;stroke-linecap:round;stroke-dasharray:113.1;stroke-dashoffset:0;}
.cdnum{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:19px;color:var(--gold);}
.cdlbl{font-size:9px;color:var(--text-dim);letter-spacing:2px;}

/* TERMINAL */
.term{font-family:'Share Tech Mono',monospace;font-size:11px;line-height:1.7;height:195px;overflow-y:auto;padding:7px;background:rgba(0,0,0,0.4);}
.term::-webkit-scrollbar{width:4px;}
.term::-webkit-scrollbar-thumb{background:var(--gold-dim);border-radius:2px;}
.tl{display:flex;gap:6px;margin-bottom:1px;}
.tts{color:var(--text-dim);flex-shrink:0;}
.tsys{color:var(--cyan);}.twin{color:var(--green);}.tlose{color:var(--red-glow);}.tburn{color:#ff6600;}.tinfo{color:var(--text);}.twarn{color:var(--gold);}.tbj{color:#FFD700;}
.tinput-row{display:flex;align-items:center;gap:6px;padding:5px 7px;border-top:1px solid rgba(255,184,0,0.1);font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--green);}
.tprompt{color:var(--gold);}
.tcursor{display:inline-block;width:7px;height:12px;background:var(--green);animation:blink 1s step-end infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

@keyframes tpulse{0%{box-shadow:0 0 0 rgba(0,255,136,0);}50%{box-shadow:0 0 35px rgba(0,255,136,0.2);}100%{box-shadow:0 0 0 rgba(0,255,136,0);}}
.twin-flash{animation:tpulse .8s ease;}

/* NAME */
.noverlay{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,0.97);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);}
.nbox{background:linear-gradient(160deg,#141418,#0e0f12);border:2px solid rgba(255,184,0,0.3);border-radius:14px;padding:36px 40px;text-align:center;max-width:480px;width:calc(100% - 40px);box-shadow:0 30px 80px rgba(0,0,0,0.9),0 0 0 1px rgba(255,184,0,0.08);}
.ntitle{font-family:'Cinzel',serif;font-size:clamp(28px,5vw,42px);font-weight:900;letter-spacing:5px;background:linear-gradient(180deg,#fff8e0,#FFB800 45%,#cc6600);-webkit-background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 20px rgba(255,150,0,0.4));margin-bottom:4px;}
.nsub{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-muted);margin-bottom:24px;letter-spacing:2px;}
.ninput{width:100%;background:rgba(255,184,0,0.06);border:1.5px solid rgba(255,184,0,0.25);border-radius:7px;padding:13px 16px;font-family:'Cinzel',serif;font-size:18px;font-weight:700;color:var(--white);outline:none;text-align:center;margin-bottom:14px;letter-spacing:3px;transition:all .2s;}
.ninput::placeholder{color:rgba(255,184,0,0.2);font-size:13px;letter-spacing:2px;}
.ninput:focus{border-color:var(--gold);box-shadow:0 0 20px rgba(255,184,0,0.15);}
.nenter{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:1px solid rgba(255,120,0,0.6);width:100%;font-size:16px;font-family:'Cinzel',serif;font-weight:700;letter-spacing:4px;padding:14px;border-radius:7px;cursor:pointer;box-shadow:0 4px 0 #441100,0 0 20px rgba(200,80,0,0.25);transition:all .2s;}
.nenter:hover{background:linear-gradient(180deg,#ee6600,#aa3300);transform:translateY(-1px);}
.nenter:active{transform:translateY(2px);box-shadow:0 1px 0 #441100;}
/* MODE PICK (step 2) */
.nmode-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px;}
.nmode-card{cursor:pointer;border-radius:10px;padding:24px 16px;text-align:center;transition:all .25s;border:2px solid;}
.nmode-dealer{background:linear-gradient(160deg,rgba(255,184,0,0.07),rgba(255,184,0,0.02));border-color:rgba(255,184,0,0.25);}
.nmode-dealer:hover{border-color:var(--gold);background:linear-gradient(160deg,rgba(255,184,0,0.15),rgba(255,184,0,0.06));transform:translateY(-3px);box-shadow:0 8px 24px rgba(255,184,0,0.15);}
.nmode-multi{background:linear-gradient(160deg,rgba(0,200,100,0.07),rgba(0,200,100,0.02));border-color:rgba(0,200,100,0.2);}
.nmode-multi:hover{border-color:var(--green);background:linear-gradient(160deg,rgba(0,255,136,0.14),rgba(0,200,100,0.05));transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,200,100,0.15);}
.nmode-icon{font-size:38px;margin-bottom:10px;}
.nmode-name{font-family:'Cinzel',serif;font-size:17px;font-weight:700;letter-spacing:3px;margin-bottom:8px;}
.nmode-desc{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-muted);line-height:1.7;}
/* 30s countdown */
.ncountdown{font-family:'Cinzel',serif;font-size:13px;letter-spacing:3px;color:var(--text-muted);margin-top:4px;}
.ncountdown span{color:var(--gold);font-size:20px;font-weight:700;}
.nback-btn{background:transparent;color:var(--text-muted);border:none;font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:2px;cursor:pointer;padding:8px 20px;transition:color .2s;}
.nback-btn:hover{color:var(--gold);}

/* MYSTERY BOX */
.mbox-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.88);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .3s;}
.mbox-overlay.show{opacity:1;pointer-events:all;}
.mbox{background:var(--panel);border:2px solid rgba(138,43,226,0.5);border-radius:10px;padding:32px 36px;text-align:center;max-width:420px;width:92%;box-shadow:0 0 60px rgba(138,43,226,0.3);}
.mbox-icon{font-size:56px;margin-bottom:12px;animation:bounce .6s ease infinite alternate;}
@keyframes bounce{from{transform:translateY(0)}to{transform:translateY(-8px)}}
.mbox-title{font-family:'Bebas Neue',sans-serif;font-size:32px;letter-spacing:4px;color:#cc88ff;margin-bottom:4px;}
.mbox-reward{font-family:'Bebas Neue',sans-serif;font-size:22px;color:var(--gold);margin:10px 0;}
.mbox-desc{font-family:'Share Tech Mono',monospace;font-size:12px;color:var(--text-dim);line-height:1.7;margin-bottom:20px;}
.mbox-trigger{font-family:'Share Tech Mono',monospace;font-size:10px;color:#9955cc;letter-spacing:2px;margin-bottom:16px;}
.mbox-btn{background:linear-gradient(180deg,#6600cc,#440088);color:#fff;border:1px solid #aa44ff;font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:2px;padding:12px 40px;border-radius:4px;cursor:pointer;width:100%;}
.mbox-btn:hover{background:linear-gradient(180deg,#8800ff,#5500aa);}

/* REFERRAL MODAL */
.ref-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.88);z-index:9000;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);}
.ref-overlay.show{display:flex;animation:pgin .25s ease;}
.ref-modal{background:var(--panel);border:2px solid rgba(0,255,136,0.35);border-radius:8px;padding:28px 32px;max-width:440px;width:94%;box-shadow:0 0 50px rgba(0,255,136,0.15);text-align:center;}
.ref-modal-title{font-family:'Bebas Neue',sans-serif;font-size:30px;letter-spacing:4px;color:var(--green);margin-bottom:6px;}
.ref-modal-sub{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-dim);margin-bottom:18px;line-height:1.8;}
.ref-modal-sub span{color:var(--green);}
.ref-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px;}
.ref-stat{background:rgba(0,255,136,0.05);border:1px solid rgba(0,255,136,0.15);border-radius:4px;padding:10px;}
.ref-stat-val{font-family:'Bebas Neue',sans-serif;font-size:26px;color:var(--green);}
.ref-stat-lbl{font-size:9px;color:var(--text-dim);letter-spacing:1px;}
.ref-link-box{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--gold);background:rgba(0,0,0,0.5);border:1px solid rgba(0,255,136,0.25);border-radius:4px;padding:10px 14px;word-break:break-all;margin-bottom:10px;text-align:left;cursor:pointer;}
.ref-link-box:hover{border-color:rgba(0,255,136,0.5);}
.ref-modal-btns{display:flex;gap:8px;margin-bottom:14px;}
.ref-btn-copy{flex:1;background:linear-gradient(180deg,#006633,#003d1f);color:var(--green);border:1px solid rgba(0,255,136,0.4);font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:2px;padding:10px;border-radius:3px;cursor:pointer;}
.ref-btn-copy:hover{background:linear-gradient(180deg,#008844,#005522);}
.ref-btn-x{flex:1;background:rgba(255,255,255,0.04);color:#fff;border:1px solid rgba(255,255,255,0.15);font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:2px;padding:10px;border-radius:3px;cursor:pointer;}
.ref-btn-x:hover{background:rgba(255,255,255,0.1);}
.ref-rules{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-dim);line-height:1.9;text-align:left;background:rgba(0,0,0,0.3);border-radius:4px;padding:10px 12px;margin-bottom:12px;}
.ref-rules span{color:var(--green);}
.ref-close{background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.2);font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;padding:8px 24px;border-radius:3px;cursor:pointer;width:100%;}
.ref-close:hover{border-color:rgba(255,184,0,0.5);color:var(--gold);}
.ref-toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:rgba(0,255,136,0.95);color:#000;font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:2px;padding:10px 24px;border-radius:4px;z-index:9999;display:none;}
.ref-toast.show{display:block;animation:fadeup .3s ease;}
@keyframes fadeup{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.lbrow.bot .lbnm{color:var(--text-dim);}

/* BANKRUPTCY OVERLAY */
.broke-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.96);z-index:9998;display:none;align-items:center;justify-content:center;backdrop-filter:blur(8px);}
.broke-overlay.show{display:flex;animation:pgin .4s ease;}
.broke-box{background:var(--panel);border:2px solid rgba(255,34,0,0.5);border-radius:10px;padding:36px 38px;text-align:center;max-width:440px;width:94%;box-shadow:0 0 80px rgba(255,34,0,0.25);}
.broke-icon{font-size:64px;margin-bottom:10px;animation:shake .5s ease infinite alternate;}
@keyframes shake{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
.broke-title{font-family:'Bebas Neue',sans-serif;font-size:48px;letter-spacing:5px;color:var(--red-glow);filter:drop-shadow(0 0 20px rgba(255,51,0,0.8));margin-bottom:4px;}
.broke-sub{font-family:'Share Tech Mono',monospace;font-size:12px;color:var(--text-dim);margin-bottom:20px;line-height:1.8;}
.broke-sub span{color:var(--red-glow);}
.broke-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:22px;}
.broke-stat{background:rgba(255,34,0,0.05);border:1px solid rgba(255,34,0,0.2);border-radius:4px;padding:10px 6px;}
.broke-stat-val{font-family:'Bebas Neue',sans-serif;font-size:22px;color:var(--red-glow);}
.broke-stat-lbl{font-size:9px;color:var(--text-dim);letter-spacing:1px;}
.broke-btns{display:flex;flex-direction:column;gap:8px;}
.broke-claim-btn{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:2px solid #ff7700;font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:3px;padding:14px;border-radius:4px;cursor:pointer;animation:npulse 1s ease infinite;}
.broke-claim-btn:hover{background:linear-gradient(180deg,#ee6600,#aa3300);}
.broke-share-btn{background:rgba(255,255,255,0.04);color:#fff;border:1px solid rgba(255,255,255,0.2);font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:2px;padding:11px;border-radius:4px;cursor:pointer;}
.broke-share-btn:hover{background:rgba(255,255,255,0.1);}
.broke-ref-btn{background:rgba(0,255,136,0.06);color:var(--green);border:1px solid rgba(0,255,136,0.3);font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:2px;padding:10px;border-radius:4px;cursor:pointer;}
.broke-ref-btn:hover{background:rgba(0,255,136,0.12);}

/* ── RACE MODE ── */
.race-btn{position:fixed;bottom:20px;right:20px;background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:2px solid #ff9900;font-family:'Bebas Neue',sans-serif;font-size:16px;letter-spacing:3px;padding:12px 22px;border-radius:4px;cursor:pointer;z-index:500;animation:npulse 2s ease infinite;box-shadow:0 4px 20px rgba(255,100,0,0.4);}
.race-btn:hover{transform:scale(1.05);}

/* RACE LOBBY */
.race-overlay{position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;background:rgba(0,0,0,0.94);z-index:99999;display:none;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
.race-overlay.show{display:flex;animation:pgin .3s ease;}
.race-lobby{
  background:linear-gradient(160deg,#141418 0%,#0e0f12 100%);
  border:2px solid rgba(255,184,0,0.3);border-radius:12px;
  padding:32px 36px;max-width:640px;width:calc(100% - 40px);
  max-height:88vh;overflow-y:auto;position:relative;
  box-shadow:0 24px 80px rgba(0,0,0,0.9),0 0 0 1px rgba(255,184,0,0.08);
}
.race-lobby-title{font-family:'Cinzel',serif;font-size:28px;font-weight:900;letter-spacing:6px;color:var(--gold);text-align:center;margin-bottom:6px;text-shadow:0 0 30px rgba(255,184,0,0.3);}
.race-lobby-sub{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-muted);text-align:center;margin-bottom:0;letter-spacing:1px;}
/* race-tabs removed */

/* MODE SELECT CARDS */
#mode1v1Card:hover{border-color:rgba(255,184,0,0.6)!important;background:linear-gradient(160deg,rgba(255,184,0,0.13),rgba(255,184,0,0.05))!important;transform:translateY(-3px);box-shadow:0 8px 24px rgba(255,184,0,0.12);}
#modeMultiCard:hover{border-color:rgba(0,255,136,0.5)!important;background:linear-gradient(160deg,rgba(0,255,136,0.12),rgba(0,200,100,0.04))!important;transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,255,136,0.12);}
#mode1v1Card.selected{border-color:var(--gold)!important;background:linear-gradient(160deg,rgba(255,184,0,0.18),rgba(255,184,0,0.08))!important;box-shadow:0 0 20px rgba(255,184,0,0.2);}
#modeMultiCard.selected{border-color:var(--green)!important;background:linear-gradient(160deg,rgba(0,255,136,0.18),rgba(0,200,100,0.07))!important;box-shadow:0 0 20px rgba(0,200,100,0.2);}

/* OPEN RACES LIST */
.race-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;max-height:280px;overflow-y:auto;}
.race-list::-webkit-scrollbar{width:3px;}
.race-list::-webkit-scrollbar-thumb{background:var(--gold-dim);}
.race-card{background:linear-gradient(90deg,rgba(255,184,0,0.05) 0%,rgba(255,184,0,0.02) 100%);border:1px solid rgba(255,184,0,0.15);border-radius:7px;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;transition:border-color .2s;}
.race-card:hover{border-color:rgba(255,184,0,0.35);}
.race-card-info{flex:1;}
.race-card-host{font-family:'Bebas Neue',sans-serif;font-size:15px;color:var(--white);}
.race-card-meta{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-dim);margin-top:2px;}
.race-card-bet{font-family:'Bebas Neue',sans-serif;font-size:18px;color:var(--gold);}
.race-card-players{font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--green);margin-top:2px;text-align:right;}
.race-join-btn{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:1px solid #ff7700;font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;padding:8px 18px;border-radius:3px;cursor:pointer;white-space:nowrap;}
.race-join-btn:hover{background:linear-gradient(180deg,#ee6600,#aa3300);}
.race-join-btn:disabled{opacity:0.4;cursor:not-allowed;}
.race-empty{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-dim);text-align:center;padding:24px;}

/* lobby forms */
.race-create-form{display:flex;flex-direction:column;gap:10px;}
.race-form-label{font-family:'Bebas Neue',sans-serif;font-size:12px;letter-spacing:2px;color:var(--text-dim);margin-bottom:3px;}
.race-bet-chips{display:flex;gap:8px;flex-wrap:wrap;}
.race-bet-chip{background:rgba(255,184,0,0.06);border:1px solid rgba(255,184,0,0.2);color:var(--gold);font-family:'Cinzel',serif;font-size:13px;font-weight:600;letter-spacing:1px;padding:9px 18px;border-radius:5px;cursor:pointer;transition:all .15s;}
.race-bet-chip.sel{background:rgba(255,184,0,0.18);border-color:var(--gold);box-shadow:0 0 10px rgba(255,184,0,0.2);}
.race-create-btn{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:2px solid rgba(255,120,0,0.6);font-family:'Cinzel',serif;font-size:14px;font-weight:700;letter-spacing:3px;padding:14px;border-radius:6px;cursor:pointer;box-shadow:0 3px 0 #441100,0 0 16px rgba(200,80,0,0.2);transition:all .2s;width:100%;}
.race-create-btn:hover{background:linear-gradient(180deg,#ee6600,#aa3300);}
.race-quickmatch-btn{background:linear-gradient(180deg,#0d5028,#062814);color:var(--green);border:2px solid rgba(0,200,80,0.4);font-family:'Cinzel',serif;font-size:14px;font-weight:700;letter-spacing:3px;padding:14px;border-radius:6px;cursor:pointer;width:100%;margin-bottom:8px;box-shadow:0 3px 0 #031408,0 0 16px rgba(0,200,80,0.15);transition:all .2s;}
.race-quickmatch-btn:hover{background:linear-gradient(180deg,#008844,#005522);}

/* RACE WAITING ROOM */
.race-waiting{text-align:center;}
.race-waiting-title{font-family:'Bebas Neue',sans-serif;font-size:28px;letter-spacing:4px;color:var(--gold);margin-bottom:6px;}
.race-waiting-sub{font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-dim);margin-bottom:20px;}
.race-players-grid{position:relative;width:260px;height:260px;margin:0 auto 20px auto;}
.race-players-circle-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;background:rgba(255,184,0,0.06);border:2px solid rgba(255,184,0,0.3);display:flex;align-items:center;justify-content:center;font-size:22px;}
.race-player-slot{position:absolute;width:80px;height:80px;border-radius:50%;background:rgba(255,184,0,0.04);border:2px solid rgba(255,184,0,0.15);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:all 0.3s;}
.race-player-slot.filled{border-color:rgba(0,255,136,0.5);background:rgba(0,255,136,0.08);box-shadow:0 0 12px rgba(0,255,136,0.2);}
.race-player-slot.me{border-color:var(--gold);background:rgba(255,184,0,0.1);box-shadow:0 0 16px rgba(255,184,0,0.3);}
.race-player-name{font-family:'Bebas Neue',sans-serif;font-size:16px;color:var(--white);}
.race-player-status{font-family:'Share Tech Mono',monospace;font-size:9px;color:var(--text-dim);margin-top:3px;}
.race-player-empty{font-family:'Share Tech Mono',monospace;font-size:10px;color:rgba(255,184,0,0.2);letter-spacing:2px;}
.race-start-btn{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:2px solid #ff7700;font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:3px;padding:14px 40px;border-radius:4px;cursor:pointer;animation:npulse 1s ease infinite;margin-bottom:10px;}
.race-start-btn:disabled{opacity:0.3;animation:none;cursor:not-allowed;}
.race-leave-btn{background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.2);font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;padding:8px 20px;border-radius:3px;cursor:pointer;}

/* RACE GAME - live race bar at top */
.race-bar{background:rgba(0,0,0,0.8);border:1px solid rgba(255,184,0,0.2);border-radius:4px;padding:10px 14px;margin-bottom:10px;display:none;}
.race-bar.show{display:block;}
.race-inactivity-warn{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:rgba(255,60,0,0.95);color:#fff;font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:3px;padding:10px 28px;border-radius:6px;z-index:99999;display:none;box-shadow:0 0 20px rgba(255,60,0,0.5);animation:npulse 0.6s ease infinite;}
.race-inactivity-warn.show{display:block;}
.race-bar-title{font-family:'Bebas Neue',sans-serif;font-size:12px;letter-spacing:3px;color:var(--gold);margin-bottom:8px;text-align:center;}
.race-players-live{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.race-player-live{background:rgba(255,184,0,0.04);border:1px solid rgba(255,184,0,0.12);border-radius:3px;padding:6px 10px;text-align:center;min-width:100px;}
.race-player-live.me-live{border-color:var(--gold);}
.race-player-live.done{border-color:rgba(0,255,136,0.3);}
.race-player-live.bust{border-color:rgba(255,51,0,0.3);}
.rpl-name{font-family:'Bebas Neue',sans-serif;font-size:13px;color:var(--white);}
.rpl-status{font-family:'Share Tech Mono',monospace;font-size:9px;color:var(--text-dim);margin-top:2px;}
.rpl-score{font-family:'Bebas Neue',sans-serif;font-size:16px;color:var(--gold);}

/* RACE RESULTS */
.race-results-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.95);z-index:99999;display:none;align-items:center;justify-content:center;backdrop-filter:blur(6px);}
.race-results-overlay.show{display:flex;animation:pgin .4s ease;}
.race-results-box{background:var(--panel);border:2px solid rgba(255,184,0,0.4);border-radius:8px;padding:30px 34px;max-width:500px;width:95%;text-align:center;}
.race-results-title{font-family:'Bebas Neue',sans-serif;font-size:40px;letter-spacing:5px;color:var(--gold);margin-bottom:16px;}
.race-results-list{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}
.race-result-row{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-radius:4px;border:1px solid rgba(255,184,0,0.12);}
.race-result-row.winner{background:rgba(0,255,136,0.08);border-color:rgba(0,255,136,0.35);}
.race-result-row.loser{background:rgba(255,51,0,0.05);border-color:rgba(255,51,0,0.2);}
.race-result-row.push{background:rgba(255,184,0,0.05);}
.rrname{font-family:'Bebas Neue',sans-serif;font-size:17px;}
.rrscore{font-family:'Bebas Neue',sans-serif;font-size:15px;color:var(--text-dim);}
.rrpayout{font-family:'Bebas Neue',sans-serif;font-size:18px;}
.race-play-again-btn{background:linear-gradient(180deg,#cc5500,#882200);color:#fff5cc;border:2px solid #ff7700;font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:3px;padding:13px 40px;border-radius:4px;cursor:pointer;margin-right:8px;}
.race-close-btn{background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.2);font-family:'Bebas Neue',sans-serif;font-size:15px;letter-spacing:2px;padding:12px 24px;border-radius:3px;cursor:pointer;}

/* ── RACE TABLE LAYOUT — Casino D-shape ── */
.race-table-wrap{position:relative;width:100%;height:300px;margin-bottom:8px;}
/* Outer wood rail */
.race-table-felt{position:absolute;left:0;right:0;top:0;height:230px;background:linear-gradient(180deg,#0e2010 0%,#0b1a0d 40%,#071209 100%);border-radius:54% 54% 0 0 / 70% 70% 0 0;border:10px solid #3d1f00;box-shadow:0 0 0 2px #2a1400,0 8px 32px rgba(0,0,0,0.9),inset 0 0 60px rgba(0,0,0,0.5);}
/* Green felt texture */
.race-felt-inner{position:absolute;left:6%;right:6%;top:8px;height:205px;border-radius:50% 50% 0 0/60% 60% 0 0;background:radial-gradient(ellipse 80% 90% at 50% 30%,#1a4a1a 0%,#0f3010 50%,#081808 100%);border:2px solid rgba(255,255,255,0.05);}
/* Felt logo text */
.race-felt-logo{position:absolute;top:28%;left:50%;transform:translateX(-50%);font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:8px;color:rgba(255,255,255,0.06);white-space:nowrap;user-select:none;}
/* Bottom straight edge - table rail */
.race-table-rail{position:absolute;left:0;right:0;top:220px;height:18px;background:linear-gradient(180deg,#3d1f00,#2a1400);box-shadow:0 4px 10px rgba(0,0,0,0.8);}
/* Dealer zone at top center of felt */
.race-dealer-spot{position:absolute;top:10px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;z-index:5;}
.race-dealer-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#1a1a1a,#0a0a0a);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:15px;box-shadow:0 0 10px rgba(255,184,0,0.4);}
.race-dealer-label{font-family:'Bebas Neue',sans-serif;font-size:9px;color:var(--gold);letter-spacing:3px;}
.race-dealer-cards{display:flex;gap:2px;margin-top:3px;}
/* Player spots row along bottom arc */
.race-seats-row{position:absolute;left:0;right:0;top:130px;height:155px;}
/* Individual seat - positioned absolutely by JS */
.race-seat{position:absolute;display:flex;flex-direction:column;align-items:center;gap:1px;z-index:5;}
/* Cards laid flat on felt at each spot */
.race-seat-cards{display:flex;gap:2px;margin-bottom:3px;}
.race-seat-spot{width:52px;height:34px;border-radius:4px;border:1px dashed rgba(255,255,255,0.1);background:rgba(0,0,0,0.2);display:flex;align-items:center;justify-content:center;margin-bottom:3px;}
/* Chip / avatar circle */
.race-seat-chip{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:14px;font-weight:bold;border:2px solid rgba(255,255,255,0.25);background:rgba(20,20,20,0.9);color:rgba(255,255,255,0.5);box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);}
.race-seat-chip.filled{background:linear-gradient(135deg,#8b0000,#4a0000);border-color:rgba(255,100,100,0.5);color:#fff;box-shadow:0 0 8px rgba(200,0,0,0.3);}
.race-seat-chip.me{background:linear-gradient(135deg,#b8860b,#8b6914);border-color:var(--gold);color:#fff;box-shadow:0 0 12px rgba(255,184,0,0.5);}
.race-seat-chip.playing{animation:npulse 1.2s ease infinite;}
.race-seat-chip.done{background:linear-gradient(135deg,#006633,#004422)!important;border-color:#00ff88!important;box-shadow:0 0 10px rgba(0,255,136,0.4)!important;}
.race-seat-chip.bust{background:linear-gradient(135deg,#660000,#440000)!important;border-color:rgba(255,50,50,0.6)!important;}
.race-seat-name{font-family:'Bebas Neue',sans-serif;font-size:9px;letter-spacing:1px;color:rgba(255,255,255,0.85);text-align:center;max-width:60px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.race-seat-name.me-name{color:var(--gold);font-size:10px;font-weight:bold;}
.race-seat-score{font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,220,100,0.9);background:rgba(0,0,0,0.7);padding:2px 5px;border-radius:3px;margin-top:2px;}
/* Cards on felt */
.race-mini-card{width:20px;height:30px;background:#fff;border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:bold;border:1px solid #ccc;box-shadow:1px 2px 4px rgba(0,0,0,0.7);}
.race-mini-card.red{color:#cc0000;}
.race-mini-card.black{color:#111;}
.race-mini-card.facedown{background:linear-gradient(135deg,#1a3a1a,#0f2a0f);border-color:rgba(0,180,0,0.4);}
.race-mini-card{width:18px;height:28px;background:#fff;border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:7px;font-weight:bold;border:1px solid #ccc;box-shadow:1px 1px 3px rgba(0,0,0,0.5);}
.race-mini-card.red{color:#cc0000;}
.race-mini-card.black{color:#111;}
.race-mini-card.facedown{background:linear-gradient(135deg,#0a1a0a,#0f2a0f);border-color:rgba(0,200,0,0.3);}
.race-seat-avatar{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.03);border:2px solid rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;font-size:18px;transition:all 0.3s;}
.race-seat-avatar.filled{background:rgba(255,184,0,0.08);border-color:rgba(255,184,0,0.4);box-shadow:0 0 8px rgba(255,184,0,0.15);}
.race-seat-avatar.me{background:rgba(255,184,0,0.15);border-color:var(--gold);box-shadow:0 0 14px rgba(255,184,0,0.5);}
.race-seat-avatar.empty{opacity:0.2;filter:grayscale(1);}
.race-seat-avatar.playing{border-color:var(--gold)!important;box-shadow:0 0 12px rgba(255,184,0,0.5)!important;animation:npulse 1.2s ease infinite;}
.race-seat-avatar.done{border-color:#00ff88!important;background:rgba(0,255,136,0.08)!important;box-shadow:0 0 10px rgba(0,255,136,0.3)!important;}
.race-seat-avatar.bust{border-color:rgba(255,50,50,0.7)!important;background:rgba(255,0,0,0.05)!important;}
.race-seat-name{font-family:'Bebas Neue',sans-serif;font-size:10px;letter-spacing:1px;color:rgba(255,255,255,0.5);text-align:center;max-width:65px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.race-seat-name.me-name{color:var(--gold);font-size:10px;}
.race-seat-score{font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,255,255,0.6);background:rgba(0,0,0,0.7);padding:1px 4px;border-radius:4px;border:1px solid rgba(255,255,255,0.1);}
</style>
</head>
<body>

<!-- NAME OVERLAY -->
<div class="noverlay" id="nameOverlay">

  <!-- STEP 1: HANDLE INPUT -->
  <div class="nbox" id="nStep1">
    <div style="font-size:52px;margin-bottom:10px;filter:drop-shadow(0 0 20px rgba(255,150,0,0.5));">🦞</div>
    <div class="ntitle">LOBSTAR</div>
    <div class="nsub">ENTER YOUR X HANDLE TO PLAY</div>
    <input class="ninput" id="nameInput" placeholder="@YourHandle" maxlength="20" autocomplete="off" spellcheck="false">
    <div id="nInputErr" style="font-family:'Share Tech Mono',monospace;font-size:11px;color:#ff5544;min-height:16px;margin-bottom:8px;text-align:center;"></div>
    <button class="nenter" onclick="enterGame()">▶  ENTER THE CASINO</button>
    <div style="font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,184,0,0.2);margin-top:14px;letter-spacing:2px;">NO SIGNUP · NO KYC · PLAY INSTANTLY</div>
  </div>

  <!-- STEP 2: MODE PICK -->
  <div class="nbox" id="nStep2" style="display:none;max-width:560px;">
    <!-- Header -->
    <div style="margin-bottom:6px;">
      <div style="font-family:'Share Tech Mono',monospace;font-size:10px;color:rgba(255,184,0,0.4);letter-spacing:3px;margin-bottom:6px;">LOGGED IN AS</div>
      <div id="nWelcome" style="font-family:'Cinzel',serif;font-size:clamp(20px,3vw,28px);font-weight:900;letter-spacing:4px;background:linear-gradient(180deg,#fff8e0,#FFB800);-webkit-background-clip:text;-webkit-text-fill-color:transparent;"></div>
    </div>
    <div style="font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-muted);letter-spacing:3px;margin-bottom:28px;">SELECT GAME MODE</div>

    <!-- Two mode cards -->
    <div class="nmode-grid">

      <!-- SOLO vs DEALER -->
      <div class="nmode-card nmode-dealer" id="nmCardDealer" onclick="startVsDealer()">
        <div class="nmode-icon">🃏</div>
        <div class="nmode-name" style="color:var(--gold);">SOLO</div>
        <div style="font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,184,0,0.5);letter-spacing:3px;margin-bottom:10px;">VS DEALER</div>
        <div class="nmode-desc">Play solo against<br>the house.<br>Classic blackjack.</div>
        <!-- Countdown ring -->
        <div id="dealerCountdownLabel" style="display:none;margin-top:14px;">
          <div style="position:relative;width:54px;height:54px;margin:0 auto;">
            <svg width="54" height="54" style="transform:rotate(-90deg);">
              <circle cx="27" cy="27" r="22" fill="none" stroke="rgba(255,184,0,0.1)" stroke-width="4"/>
              <circle id="cdringSvg" cx="27" cy="27" r="22" fill="none" stroke="var(--gold)" stroke-width="4"
                stroke-dasharray="138" stroke-dashoffset="0" stroke-linecap="round"
                style="transition:stroke-dashoffset 1s linear;"/>
            </svg>
            <div style="position:absolute;inset:0;display:flex;align-items:center;justify-content:center;">
              <span id="dealerCountdownNum" style="font-family:'Cinzel',serif;font-size:16px;font-weight:700;color:var(--gold);">30</span>
            </div>
          </div>
          <div style="font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(255,184,0,0.4);letter-spacing:2px;margin-top:6px;">AUTO-START</div>
        </div>
      </div>

      <!-- MULTIPLAYER -->
      <div class="nmode-card nmode-multi" id="nmCardMulti" onclick="startMultiplayer()">
        <div class="nmode-icon">⚔️</div>
        <div class="nmode-name" style="color:var(--green);">MULTI</div>
        <div style="font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(0,255,136,0.5);letter-spacing:3px;margin-bottom:10px;">1V1 OR 6 PLAYERS</div>
        <div class="nmode-desc">Challenge others.<br>Same dealer for all.<br>First to beat house<br>wins everyone's bet.</div>
        <div style="margin-top:14px;font-family:'Share Tech Mono',monospace;font-size:9px;color:rgba(0,255,136,0.35);letter-spacing:2px;">TAP TO JOIN →</div>
      </div>

    </div>
    <button class="nback-btn" onclick="backToHandle()">← CHANGE HANDLE</button>
  </div>

</div>

<header>
  <div style="display:flex;align-items:center;justify-content:space-between;padding:8px 20px 6px;border-bottom:1px solid rgba(255,184,0,0.12);">
    <button onclick="safeGoHome()" style="color:var(--gold);background:rgba(255,184,0,0.1);font-family:'Bebas Neue',sans-serif;font-size:14px;letter-spacing:3px;border:1px solid rgba(255,184,0,0.5);padding:7px 16px;border-radius:3px;cursor:pointer;box-shadow:0 0 10px rgba(255,184,0,0.15);">🏠 HOME</button>
    <div style="text-align:center;">
      <div class="logo" style="font-size:clamp(26px,4vw,44px);line-height:1;">L★BSTAR</div>
      <div class="logo-sub" style="font-size:11px;letter-spacing:8px;margin-top:-2px;">GAMES</div>
    </div>
    <div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;">
      <a href="https://x.com/i/communities/2026705678774178004" target="_blank" style="color:var(--text-dim);text-decoration:none;font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;border:1px solid rgba(255,184,0,0.3);padding:7px 14px;border-radius:3px;background:rgba(255,184,0,0.04);">𝕏 @LOBSTARGAMES</a>
      <button onclick="openRefModal()" style="color:var(--green);font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;border:1px solid rgba(0,255,136,0.4);padding:7px 14px;border-radius:3px;background:rgba(0,255,136,0.06);cursor:pointer;">🔗 INVITE</button>
      <button onclick="shareScore()" style="color:var(--gold);font-family:'Bebas Neue',sans-serif;font-size:13px;letter-spacing:2px;border:1px solid rgba(255,184,0,0.4);padding:7px 14px;border-radius:3px;background:rgba(255,184,0,0.08);cursor:pointer;">📣 SHARE</button>
    </div>
  </div>
  <div class="ticker-bar">
    <div class="ticker-item">$LOBSTARGAMES <span class="tv" id="tkPrice">$0.0042</span> <span class="tup" id="tkChange">+18.4%</span></div>
    <div class="ticker-item">SUPPLY <span class="tv" id="tkSupply">1,000,000,000</span></div>
    <div class="ticker-item">BURNED <span class="tv tdn" id="tkBurned">0</span></div>
    <div class="ticker-item">PLAYERS <span class="tv">🔴 LIVE</span></div>
    <div class="ticker-item">BLOCK <span class="tv" id="tkBlock">294180422</span></div>
  </div>
</header>

<div class="main-grid">
  <!-- LEFT -->
  <div class="col-left">
    <div class="panel" style="margin-bottom:10px">
      <div class="ph">TOKEN SUPPLY</div>
      <div class="srw">
        <div class="sring">
          <svg viewBox="0 0 120 120">
            <defs><linearGradient id="rg" x1="0%" y1="0%" x2="100%" y2="0%"><stop offset="0%" style="stop-color:#cc3300"/><stop offset="100%" style="stop-color:#FFB800"/></linearGradient></defs>
            <circle class="rb" cx="60" cy="60" r="52"/>
            <circle class="rf" id="ringCircle" cx="60" cy="60" r="52" stroke-dasharray="326.73" stroke-dashoffset="0"/>
          </svg>
          <div class="rc"><div class="rv" id="ringPct">100%</div><div class="rl">REMAINING</div></div>
        </div>
        <div class="sstats">
          <div class="sbox"><div class="sv">1.00B</div><div class="sl">TOTAL</div></div>
          <div class="sbox"><div class="sv" id="statBurned" style="color:var(--red-glow)">0</div><div class="sl">BURNED </div></div>
          <div class="sbox"><div class="sv" id="statCirc">1.00B</div><div class="sl">CIRCULATING</div></div>
          <div class="sbox"><div class="sv" id="statHolders">147</div><div class="sl">HOLDERS</div></div>
        </div>
        <div class="bflash" id="burnFlash"></div>
      </div>
    </div>
    <div class="panel">
      <div class="ph">MY WALLET</div>
      <div class="pb">
        <div class="wbox">
          <div class="waddr" id="walletAddr">Loading...</div>
          <div class="wbal" id="walletBal">10,000</div>
          <div class="wsub">$LOBSTAR TOKENS</div>
        </div>
        <div class="srow">
          <div class="ms"><div class="msv" id="statWins">0</div><div class="msl">WINS</div></div>
          <div class="ms"><div class="msv" id="statLosses">0</div><div class="msl">LOSSES</div></div>
          <div class="ms"><div class="msv" id="statStreak">0</div><div class="msl">STREAK</div></div>
        </div>
        <div class="pts-box">
          <div class="pts-val" id="statPts">0</div>
          <div class="pts-lbl">★ TOTAL POINTS EARNED ★</div>
        </div>
        <button class="btn-rst" onclick="resetWallet()">↺ RESET WALLET (10,000 $LOBSTAR)</button>
      </div>
    </div>
  </div>

  <!-- CENTER -->
  <div class="col-center">
    <div class="bjtable" id="bjTable"><div class="bet-arc"></div>

      <!-- POST-GAME OVERLAY -->
      <div class="pgo" id="pgOverlay">
        <div class="pgr" id="pgResult"></div>
        <div class="pgd" id="pgDetail"></div>
        <button class="btn-next" onclick="newHand()">▶ NEXT HAND</button>
        <div class="cdwrap">
          <div class="cdring">
            <svg viewBox="0 0 46 46" width="46" height="46">
              <circle class="cdbg" cx="23" cy="23" r="18"/>
              <circle class="cdfill" id="crFill" cx="23" cy="23" r="18"/>
            </svg>
            <div class="cdnum" id="crNum">5</div>
          </div>
          <div class="cdlbl">AUTO NEXT</div>
        </div>
      </div>

      <!-- DEALER -->
      <div class="dealer-zone">
        <div class="hand-label" style="text-align:center">◆ DEALER'S HAND ◆</div>
        <div class="cards-row" id="dealerCards"></div>
        <div class="sbadge" id="dealerScore">—</div>
      </div>

      <div class="divider"></div>
      <div class="result-msg" id="resultMsg"></div>
      <div class="divider"></div>

      <!-- PLAYER HANDS (single or split) -->
      <div class="hands-area" id="handsArea">
        <div class="hand-col" id="hand0col">
          <div class="hand-label" id="hand0label">◆ YOUR HAND ◆</div>
          <div class="cards-row" id="hand0cards"></div>
          <div class="sbadge" id="hand0score">—</div>
        </div>
      </div>

      <!-- BET -->
      <div class="bet-area">
        <div class="bet-label">SELECT BET AMOUNT</div>
        <div class="chips-row">
          <div class="chip c100" onclick="addBet(100)">100</div>
          <div class="chip c500" onclick="addBet(500)">500</div>
          <div class="chip c1k"  onclick="addBet(1000)">1K</div>
          <div class="chip c5k"  onclick="addBet(5000)">5K</div>
          <div class="chip c10k" onclick="addBet(10000)">10K</div>
          <div class="chip cclr" onclick="clearBet()">CLR</div>
        </div>
        <div class="cur-bet"><span>BET: </span><span id="betDisplay">0</span><span> $LOBSTAR</span></div>
      </div>

      <!-- ACTIONS -->
      <div class="act-row" id="actRow">
        <button class="btn bdeal" id="btnDeal"   onclick="dealHand()">DEAL ★</button>
        <button class="btn bhit"  id="btnHit"    onclick="playerHit()"    disabled>HIT</button>
        <button class="btn bstand" id="btnStand" onclick="playerStand()"  disabled>STAND</button>
        <button class="btn bdbl"  id="btnDouble" onclick="playerDouble()" disabled>DOUBLE</button>
        <button class="btn bsplit" id="btnSplit" onclick="playerSplit()"  disabled>SPLIT</button>
      </div>
      <div style="text-align:center;margin-top:8px;">
        <button onclick="safeGoHome()" style="font-family:'Bebas Neue',sans-serif;font-size:12px;letter-spacing:2px;color:rgba(255,100,100,0.6);background:rgba(255,50,50,0.05);border:1px solid rgba(255,50,50,0.2);padding:5px 18px;border-radius:3px;cursor:pointer;">← LEAVE GAME</button>
      </div>
    </div>
  </div>

  <!-- RIGHT -->
  <div class="col-right">
    <div class="panel" style="margin-bottom:10px">
      <div class="ph">LEADERBOARD</div>
      <div class="pb" style="padding:7px">
        <div class="lbwrap"><div id="lbList"></div></div>
      </div>
    </div>
    <div class="panel">
      <div class="ph">TERMINAL</div>
      <div class="term" id="terminal"></div>
      <div class="tinput-row"><span class="tprompt">lobstar@casino:~$</span> <span class="tcursor"></span></div>
    </div>
  </div>
</div>

<script>
// ── CONSTANTS ──
const TOTAL_SUPPLY = 1_000_000_000;
const START_BAL = 10_000;
const SUITS = ['♠','♥','♦','♣'];
const RANKS = ['A','2','3','4','5','6','7','8','9','10','J','Q','K'];

// ── STATE ──
let playerName = '', balance = START_BAL, bet = 0, deck = [];
let dealerHand = [];
// Split support: hands[0] always main, hands[1] split hand
let hands = [[]]; // array of hands
let activeHand = 0; // which hand player is currently playing
let isSplit = false;
let handResults = []; // outcome per hand
let gameState = 'betting'; // betting | playing | done
let totalBurned = 0, totalPoints = 0, wins = 0, losses = 0, streak = 0, tokenPrice = 0.0042;
let cdTimer = null;

// Leaderboard via Supabase + bots

// ── ENTER ──
// enterGame injected below

document.getElementById('nameInput').addEventListener('keydown', e => { if(e.key==='Enter') enterGame(); });

// ── DECK ──
function buildDeck() {
  deck = [];
  for (let s of SUITS) for (let r of RANKS) deck.push({r,s});
  for (let i=deck.length-1;i>0;i--) { const j=Math.floor(Math.random()*(i+1)); [deck[i],deck[j]]=[deck[j],deck[i]]; }
}
const draw = () => deck.pop();
function cv(c) { if(['J','Q','K'].includes(c.r)) return 10; if(c.r==='A') return 11; return parseInt(c.r); }
function total(h) { let t=0,a=0; for(let c of h){t+=cv(c);if(c.r==='A')a++;} while(t>21&&a>0){t-=10;a--;} return t; }
const isBJ = h => h.length===2 && total(h)===21;
const hStr = h => h.map(c=>c.r+c.s).join(' ');

// ── CARD RENDER ──
const cc = c => (c.s==='♥'||c.s==='♦') ? 'red' : 'black';
function mkCard(c, hidden=false) {
  const el = document.createElement('div');
  if (hidden) { el.className='card facedown'; return el; }
  el.className = `card ${cc(c)}`;
  el.innerHTML = `<div class="ct">${c.r}<br>${c.s}</div><div class="cc">${c.s}</div><div class="cb">${c.r}<br>${c.s}</div>`;
  return el;
}
function renderHand(elId, hand, hideSecond=false) {
  const el = document.getElementById(elId);
  el.innerHTML = '';
  hand.forEach((c,i) => el.appendChild(mkCard(c, hideSecond && i===1)));
}
function setSB(id, val, extra='') {
  const el = document.getElementById(id);
  el.textContent = val; el.className = 'sbadge' + (extra?' '+extra:'');
  if (val > 21) el.className = 'sbadge bust';
  else if (val === 21 && !extra) el.className = 'sbadge bj';
}

// ── BET ──
function addBet(a) {
  if (gameState !== 'betting') return;
  if (bet + a > balance) { tlog('warn','Insufficient balance.'); return; }
  bet += a; updBet();
}
function clearBet() { if (gameState !== 'betting') return; bet = 0; updBet(); }
function updBet() { document.getElementById('betDisplay').textContent = bet.toLocaleString(); }

// ── DEAL ──
function dealHand() {
  if (bet < 100) { tlog('warn','Minimum bet is 100 $LOBSTAR'); return; }
  if (bet > balance) { tlog('warn','Insufficient balance'); return; }
  buildDeck();
  hands = [[draw(), draw()]];
  dealerHand = [draw(), draw()];
  isSplit = false; activeHand = 0; handResults = [];
  gameState = 'playing';
  balance -= bet;
  renderDealerHand(true);
  renderAllHands();
  setSB('dealerScore', cv(dealerHand[0]));
  setSB('hand0score', total(hands[0]));
  setBtns(false, true, true, true, canSplit(hands[0]));
  document.getElementById('resultMsg').textContent = '';
  const ps = total(hands[0]);
  tlog('info', `DEAL — Your: ${hStr(hands[0])} (${ps}) | Dealer shows: ${dealerHand[0].r}${dealerHand[0].s}`);
  if (isBJ(hands[0])) setTimeout(() => { revealDealer(); endHand('blackjack',0); }, 400);
  updateUI();
}

// ── CAN SPLIT ──
function canSplit(h) {
  return h.length === 2 && cv(h[0]) === cv(h[1]) && !isSplit && balance >= bet;
}

// ── HIT ──
function playerHit() {
  const h = hands[activeHand];
  h.push(draw());
  renderAllHands();
  const t = total(h);
  setSB(`hand${activeHand}score`, t);
  tlog('info', `HIT [Hand ${activeHand+1}] — ${hStr(h)} = ${t}`);
  if (t > 21) setTimeout(() => endHand('bust', activeHand), 300);
  else if (t === 21) setTimeout(() => advanceHand(), 400);
  // Disable split after hit
  document.getElementById('btnSplit').disabled = true;
  document.getElementById('btnDouble').disabled = true;
}

// ── STAND ──
async function playerStand() {
  tlog('info', `STAND [Hand ${activeHand+1}] — ${total(hands[activeHand])}`);
  if (typeof raceState !== 'undefined' && raceState==='playing') await endRacePlaying();
  advanceHand();
}

// ── DOUBLE ──
function playerDouble() {
  if (bet > balance) { tlog('warn','Not enough to double'); return; }
  balance -= bet; bet *= 2; updBet(); updateUI();
  hands[activeHand].push(draw());
  renderAllHands();
  const t = total(hands[activeHand]);
  setSB(`hand${activeHand}score`, t);
  tlog('warn', `DOUBLE DOWN [Hand ${activeHand+1}] — ${hStr(hands[activeHand])} = ${t} | Bet: ${bet.toLocaleString()}`);
  setTimeout(() => { if (t > 21) endHand('bust', activeHand); else advanceHand(); }, 400);
}

// ── SPLIT ──
function playerSplit() {
  if (!canSplit(hands[0])) return;
  isSplit = true;
  balance -= bet; // pay for second hand
  // Create two hands from the pair
  const c1 = hands[0][0], c2 = hands[0][1];
  hands = [[c1, draw()], [c2, draw()]];
  activeHand = 0;
  renderAllHands();
  setSB('hand0score', total(hands[0]));
  setSB('hand1score', total(hands[1]));
  tlog('warn', `SPLIT! Hand 1: ${hStr(hands[0])} | Hand 2: ${hStr(hands[1])}`);
  // Check immediate BJ on split aces
  const h0BJ = isBJ(hands[0]);
  setBtns(false, !h0BJ, !h0BJ, !h0BJ && balance>=bet*2, false);
  highlightActiveHand();
  if (h0BJ) { tlog('bj','Hand 1: BLACKJACK!'); setTimeout(() => advanceHand(), 600); }
}

// ── ADVANCE HAND (after stand / bust / done) ──
function advanceHand() {
  if (isSplit && activeHand === 0) {
    activeHand = 1;
    highlightActiveHand();
    const h1BJ = isBJ(hands[1]);
    setBtns(false, !h1BJ, !h1BJ, false, false);
    tlog('info', `Hand 2: ${hStr(hands[1])} (${total(hands[1])})`);
    if (h1BJ) { tlog('bj','Hand 2: BLACKJACK!'); handResults[1]='blackjack'; setTimeout(() => { revealDealer(); runDealer(); }, 500); }
  } else {
    // Both hands done
    setBtns(false, false, false, false, false);
    revealDealer();
    runDealer();
  }
}

function highlightActiveHand() {
  if (!isSplit) return;
  document.getElementById('hand0col').className = activeHand===0 ? 'hand-col active-hand' : 'hand-col inactive-hand';
  document.getElementById('hand1col').className = activeHand===1 ? 'hand-col active-hand' : 'hand-col inactive-hand';
  document.getElementById('hand0label').className = activeHand===0 ? 'hand-label active' : 'hand-label';
  document.getElementById('hand1label').className = activeHand===1 ? 'hand-label active' : 'hand-label';
}

// ── RENDER PLAYER HANDS ──
function renderAllHands() {
  const area = document.getElementById('handsArea');
  if (!isSplit) {
    area.innerHTML = `
      <div class="hand-col" id="hand0col">
        <div class="hand-label" id="hand0label">◆ YOUR HAND ◆</div>
        <div class="cards-row" id="hand0cards"></div>
        <div class="sbadge" id="hand0score">—</div>
      </div>`;
    renderHand('hand0cards', hands[0]);
    setSB('hand0score', total(hands[0]));
  } else {
    area.innerHTML = `
      <div class="hand-col" id="hand0col">
        <div class="hand-label" id="hand0label">◆ HAND 1 ◆</div>
        <div class="cards-row" id="hand0cards"></div>
        <div class="sbadge" id="hand0score">—</div>
      </div>
      <div class="split-vs">VS</div>
      <div class="hand-col" id="hand1col">
        <div class="hand-label" id="hand1label">◆ HAND 2 ◆</div>
        <div class="cards-row" id="hand1cards"></div>
        <div class="sbadge" id="hand1score">—</div>
      </div>`;
    renderHand('hand0cards', hands[0]);
    renderHand('hand1cards', hands[1]);
    setSB('hand0score', total(hands[0]));
    setSB('hand1score', total(hands[1]));
    highlightActiveHand();
  }
}

// ── DEALER ──
function renderDealerHand(hide=false) {
  renderHand('dealerCards', dealerHand, hide);
}
function revealDealer() {
  renderDealerHand(false);
  setSB('dealerScore', total(dealerHand));
}
function isSoft17(hand) {
  // Soft 17: has Ace counted as 11 and total is exactly 17
  const hasAce = hand.some(c=>c.r==='A');
  if (!hasAce) return false;
  const hardTotal = hand.reduce((s,c)=>s+Math.min(cv(c),10),0);
  return hardTotal <= 7 && total(hand) === 17; // Ace counted as 11
}

function runDealer() {
  let ds = total(dealerHand);
  const step = () => {
    // Dealer hits on soft 17 (more busts, better for player)
    const mustHit = ds < 17 || isSoft17(dealerHand);
    if (mustHit) {
      dealerHand.push(draw());
      renderDealerHand(false);
      ds = total(dealerHand);
      setSB('dealerScore', ds);
      tlog('info', `DEALER hits — ${hStr(dealerHand)} = ${ds}`);
      setTimeout(step, 600);
    } else {
      resolveAllHands(ds);
    }
  };
  step();
}

// ── RESOLVE ──
function resolveAllHands(ds) {
  if (!isSplit) {
    const ps = total(hands[0]);
    // Was already handled for bust/bj
    if (handResults[0]) { finishGame(); return; }
    if (ds > 21 || ps > ds) endHand('win', 0, ds);
    else if (ds === ps) endHand('push', 0, ds);
    else endHand('lose', 0, ds);
  } else {
    // Resolve both hands
    let pending = hands.length;
    hands.forEach((h, i) => {
      if (!handResults[i]) { // not already resolved
        const ps = total(h);
        if (ps > 21) handResults[i] = 'bust';
        else if (isBJ(h)) handResults[i] = 'blackjack';
        else if (ds > 21 || ps > ds) handResults[i] = 'win';
        else if (ds === ps) handResults[i] = 'push';
        else handResults[i] = 'lose';
      }
    });
    finishGame();
  }
}

// ── END SINGLE HAND (bust/bj early) ──
function endHand(outcome, handIdx, ds) {
  handResults[handIdx] = outcome;
  if (isSplit) {
    if (handIdx === 0) {
      // Hand 0 done (bust/bj/stand) — move to hand 1
      if (outcome === 'bust') tlog('warn', `Hand 1: BUST!`);
      advanceHand();
    } else {
      // Hand 1 done — run dealer
      if (outcome === 'bust') tlog('warn', `Hand 2: BUST!`);
      revealDealer();
      runDealer();
    }
    return;
  }
  if (!isSplit) finishGame();
}

// ── FINISH GAME ──
function finishGame() {
  gameState = 'done';
  setBtns(false,false,false,false,false);

  const ds = total(dealerHand);
  let totalWinAmt = 0, totalBurnAmt = 0, totalPtEarned = 0;
  let overallOutcome = 'lose';
  let splitDetails = [];

  const handBets = isSplit ? [bet, bet] : [bet];

  hands.forEach((h, i) => {
    const outcome = handResults[i] || 'lose';
    const hBet = handBets[i];
    let payout = 0, burnAmt = 0, ptEarned = 0, label = '';

    if (outcome === 'blackjack') {
      payout = Math.floor(hBet * 2.5);
      ptEarned = Math.floor(hBet * 1.5);
      burnAmt = Math.floor(hBet * 0.05);
      label = '★ BJ ★';
      wins++;
    } else if (outcome === 'win') {
      payout = hBet * 2;
      ptEarned = hBet;
      burnAmt = Math.floor(hBet * 0.02);
      label = 'WIN';
      wins++;
    } else if (outcome === 'push') {
      payout = hBet;
      ptEarned = Math.floor(hBet * 0.1);
      label = 'PUSH';
    } else {
      burnAmt = hBet;
      ptEarned = Math.floor(hBet * 0.05);
      label = outcome === 'bust' ? 'BUST' : 'LOSS';
      losses++;
    }

    balance += payout;
    totalWinAmt += payout;
    totalBurnAmt += burnAmt;
    totalPtEarned += ptEarned;

    // Update hand score badge with outcome
    const badgeClass = (outcome==='win'||outcome==='blackjack') ? 'won' : (outcome==='lose'||outcome==='bust') ? 'lost' : 'push';
    setSB(`hand${i}score`, total(h) + (outcome==='bust'?' BUST':''), badgeClass);

    if (isSplit) splitDetails.push({label, payout, hBet});
  });

  // Streak
  const hadAnyWin = handResults.some(r => r==='win'||r==='blackjack');
  const hadAnyLoss = handResults.some(r => r==='lose'||r==='bust');
  if (hadAnyWin && !hadAnyLoss) { streak++; overallOutcome = handResults.includes('blackjack') ? 'blackjack' : 'win'; }
  else if (hadAnyLoss && !hadAnyWin) { streak = 0; overallOutcome = 'lose'; }
  else { overallOutcome = 'push'; }

  totalPoints += totalPtEarned;
  if (totalBurnAmt > 0) burnTokens(totalBurnAmt);
  updateLBPlayer(totalPtEarned);
  bet = 0; updBet(); updateUI();

  // Log
  if (isSplit) {
    splitDetails.forEach((d,i) => {
      tlog(d.label.includes('WIN')||d.label.includes('BJ') ? 'win' : d.label==='PUSH'?'info':'lose',
        `Hand ${i+1}: ${d.label} — Payout: ${d.payout.toLocaleString()} $LOBSTAR`);
    });
  } else {
    const oc = handResults[0];
    if (oc==='blackjack') tlog('bj',`BLACKJACK! +${totalWinAmt.toLocaleString()} $LOBSTAR`);
    else if (oc==='win') tlog('twin',`WIN! +${totalWinAmt.toLocaleString()} $LOBSTAR | Streak: ${streak}`);
    else if (oc==='push') tlog('tinfo','PUSH — bet returned.');
    else tlog('tlose',`${oc.toUpperCase()} — ${totalBurnAmt.toLocaleString()} $LOBSTAR burned `);
  }

  // Bankruptcy
  if (balance < 100) {
    setTimeout(() => showBankruptcy(), 900);
  }

  // Win flash
  if (overallOutcome==='win'||overallOutcome==='blackjack') {
    document.getElementById('bjTable').classList.add('twin-flash');
    setTimeout(()=>document.getElementById('bjTable').classList.remove('twin-flash'),900);
  }

  // Show post-game overlay
  showPostGame(overallOutcome, totalWinAmt, totalPtEarned, totalBurnAmt, splitDetails);
}

// ── POST-GAME OVERLAY ──
function showPostGame(outcome, winAmt, pts, burnAmt, splitDetails) {
  const labels = {blackjack:'★ BLACKJACK! ★', win:'✓ YOU WIN!', lose:'✗ DEALER WINS', bust:'✗ BUST!', push:'⟳ PUSH'};
  const classes = {blackjack:'pgr pgbj', win:'pgr pgwin', lose:'pgr pglose', bust:'pgr pglose', push:'pgr pgpush'};

  document.getElementById('pgResult').className = classes[outcome] || 'pgr pglose';
  document.getElementById('pgResult').textContent = labels[outcome] || outcome.toUpperCase();

  let detail = '';
  if (isSplit && splitDetails.length > 0) {
    detail += `<div class="split-results">`;
    splitDetails.forEach((d,i) => {
      const c = (d.label.includes('WIN')||d.label.includes('BJ')) ? 'style="color:var(--green)"' : d.label==='PUSH'?'style="color:var(--gold)"':'style="color:var(--red-glow)"';
      detail += `<div class="split-hand"><div ${c}>${d.label}</div><div class="amt">${d.payout.toLocaleString()} $LOBSTAR</div></div>`;
    });
    detail += `</div>`;
  } else {
    if (winAmt > 0) detail += `<span class="amt">+${winAmt.toLocaleString()} $LOBSTAR</span><br>`;
    if (burnAmt > 0 && (outcome==='lose'||outcome==='bust')) detail += `<span class="brn"> ${burnAmt.toLocaleString()} burned</span><br>`;
  }
  detail += `<span class="ptsclr">+${pts.toLocaleString()} POINTS EARNED</span>`;
  document.getElementById('pgDetail').innerHTML = detail;
  document.getElementById('pgOverlay').classList.add('show');
  startCountdown(5);
}

// ── COUNTDOWN ──
function startCountdown(secs) {
  clearCountdown();
  let rem = secs;
  const fill = document.getElementById('crFill');
  const num = document.getElementById('crNum');
  const circ = 113.1;
  const tick = () => {
    num.textContent = rem;
    fill.style.strokeDashoffset = circ * (1 - rem/secs);
    if (rem <= 0) { clearCountdown(); newHand(); return; }
    rem--;
    cdTimer = setTimeout(tick, 1000);
  };
  tick();
}
function clearCountdown() { if(cdTimer){clearTimeout(cdTimer);cdTimer=null;} }

// ── NEW HAND ──
function newHand() {
  clearCountdown();
  hands=[[]]; isSplit=false; activeHand=0; handResults=[];
  gameState='betting'; bet=0; updBet();
  document.getElementById('pgOverlay').classList.remove('show');
  document.getElementById('dealerCards').innerHTML='';
  document.getElementById('resultMsg').textContent='';
  renderAllHands();
  setSB('dealerScore','—'); setSB('hand0score','—');
  setBtns(true,false,false,false,false);
  tlog('sys','─── New hand ready. Place your bet. ───');
}

// ── RESET WALLET ──
function resetWallet() {
  if(!confirm('Reset wallet to 10,000 $LOBSTAR? Stats will be cleared.')) return;
  clearCountdown();
  document.getElementById('pgOverlay').classList.remove('show');
  balance=START_BAL; wins=0; losses=0; streak=0; totalPoints=0; bet=0;
  hands=[[]]; isSplit=false; activeHand=0; handResults=[];
  updBet(); updateUI();
  document.getElementById('dealerCards').innerHTML='';
  document.getElementById('resultMsg').textContent='';
  gameState='betting'; setBtns(true,false,false,false,false);
  tlog('warn','↺ Wallet reset — 10,000 $LOBSTAR reloaded. Stats cleared.');
}

// ── BUTTONS ──
function setBtns(deal,hit,stand,dbl,split) {
  document.getElementById('btnDeal').disabled = !deal;
  document.getElementById('btnHit').disabled = !hit;
  document.getElementById('btnStand').disabled = !stand;
  document.getElementById('btnDouble').disabled = !dbl;
  document.getElementById('btnSplit').disabled = !split;
}

// ── UI ──
function updateUI() {
  document.getElementById('walletBal').textContent = balance.toLocaleString();
  document.getElementById('statWins').textContent = wins;
  document.getElementById('statLosses').textContent = losses;
  document.getElementById('statStreak').textContent = streak;
  document.getElementById('statPts').textContent = totalPoints.toLocaleString();
}

function fmtN(n) { if(n>=1e9)return(n/1e9).toFixed(2)+'B';if(n>=1e6)return(n/1e6).toFixed(2)+'M';if(n>=1e3)return(n/1e3).toFixed(1)+'K';return n.toLocaleString(); }

// ── BURN ──
function burnTokens(amt) {
  totalBurned += amt;
  const pct = ((TOTAL_SUPPLY - totalBurned) / TOTAL_SUPPLY) * 100;
  document.getElementById('ringCircle').style.strokeDashoffset = 326.73 * (1 - pct/100);
  document.getElementById('ringPct').textContent = pct.toFixed(2) + '%';
  document.getElementById('statBurned').textContent = fmtN(totalBurned);
  document.getElementById('statCirc').textContent = fmtN(TOTAL_SUPPLY - totalBurned);
  document.getElementById('tkBurned').textContent = fmtN(totalBurned);
  document.getElementById('tkSupply').textContent = fmtN(TOTAL_SUPPLY - totalBurned);
  const f = document.getElementById('burnFlash');
  f.textContent = ` BURNED ${amt.toLocaleString()} $LOBSTAR`; f.style.opacity=1;
  setTimeout(()=>f.style.opacity=0, 2200);
  tokenPrice *= (1 + amt/TOTAL_SUPPLY*15);
  document.getElementById('tkPrice').textContent = '$'+tokenPrice.toFixed(6);
}

// ── LEADERBOARD ──
// LB functions injected below


// ── TERMINAL ──
function tlog(type, msg) {
  const t = document.getElementById('terminal');
  const l = document.createElement('div'); l.className='tl';
  const ts = new Date().toTimeString().slice(0,8);
  const cm = {sys:'tsys',win:'twin',lose:'tlose',burn:'tburn',info:'tinfo',warn:'twarn',bj:'tbj',twin:'twin',tinfo:'tinfo',tlose:'tlose'};
  l.innerHTML=`<span class="tts">[${ts}]</span><span class="${cm[type]||'tinfo'}">${msg}</span>`;
  t.appendChild(l); t.scrollTop=t.scrollHeight;
}

// ── BOTS ──
const botNames = ['SnipeKing','MoonCrab','DegenLord','ClawMaster','RedShell','SolanaShark'];
function startBots() {
  const acts = [
    ()=>{const n=botNames[~~(Math.random()*botNames.length)];const w=Math.random()>.45;const a=(Math.floor(Math.random()*50)+5)*100;tlog(w?'win':'lose',`${n} ${w?'WIN':'LOSS'} — ${a.toLocaleString()} $LOBSTAR`);if(!w){const b=Math.floor(a*.7);totalBurned+=b;document.getElementById('tkBurned').textContent=fmtN(totalBurned);tokenPrice*=(1+b/TOTAL_SUPPLY*8);document.getElementById('tkPrice').textContent='$'+tokenPrice.toFixed(6);}},
    ()=>{const n=botNames[~~(Math.random()*botNames.length)];const a=(Math.floor(Math.random()*200)+10)*1000;tlog('burn',`${n} burned ${a.toLocaleString()} $LOBSTAR `);totalBurned+=a;document.getElementById('tkBurned').textContent=fmtN(totalBurned);},
    ()=>{const b=parseInt(document.getElementById('tkBlock').textContent.replace(/,/g,''))+1;document.getElementById('tkBlock').textContent=b.toLocaleString();tlog('sys',`Block ${b.toLocaleString()} confirmed`);},
    ()=>{const h=Math.max(100,parseInt(document.getElementById('statHolders').textContent)+Math.floor(Math.random()*3)-1);document.getElementById('statHolders').textContent=h;},
    ()=>{tlog('warn',`Large buy: ${(Math.floor(Math.random()*500)+100)*1000} $LOBSTAR`);},
    ()=>{const n=botNames[~~(Math.random()*botNames.length)];tlog('bj',`${n} hit BLACKJACK! `);},
  ];
  const run = ()=>{
    acts[~~(Math.random()*acts.length)]();
    const bot=leaderboard[~~(Math.random()*(leaderboard.length-1))];
    if(bot&&!bot.isMe){bot.pts+=Math.floor(Math.random()*900+100);renderLB();}
    setTimeout(run,1600+Math.random()*2400);
  };
  setTimeout(run,2000);
}

function startTicker() {
  setInterval(()=>{
    tokenPrice=Math.max(0.00001,tokenPrice*(1+(Math.random()-.48)*.8/100));
    document.getElementById('tkPrice').textContent='$'+tokenPrice.toFixed(6);
    const d=((tokenPrice-.0042)/.0042*100);
    const el=document.getElementById('tkChange');
    el.textContent=(d>=0?'+':'')+d.toFixed(1)+'%';
    el.className=d>=0?'tup':'tdn';
  },3000);
}


// ── SUPABASE ──
const SUPA_URL = "https://mvakqyddivstvsbioptg.supabase.co";
const SUPA_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo";

const TOP_BOTS = [
  {name:'SnipeKing',  pts:84200, burned:1820000, isBot:true},
  {name:'MoonCrab',   pts:71500, burned:1540000, isBot:true},
  {name:'DegenLord',  pts:65800, burned:1200000, isBot:true},
];
const MID_BOTS = [
  {name:'ClawMaster', pts:12300, burned:980000,  isBot:true},
  {name:'RedShell',   pts:9100,  burned:750000,  isBot:true},
  {name:'SolanaShark',pts:7700,  burned:640000,  isBot:true},
  {name:'RugnPull',   pts:5400,  burned:510000,  isBot:true},
  {name:'PumpWizard', pts:3900,  burned:340000,  isBot:true},
];
let realPlayers = [];

async function fetchRealPlayers() {
  try {
    const r = await fetch(`${SUPA_URL}/rest/v1/leaderboard?select=handle,pts,burned,wins,losses,games&order=pts.desc&limit=50`, {
      headers: {'apikey': SUPA_KEY, 'Authorization': 'Bearer ' + SUPA_KEY}
    });
    if (r.ok) {
      const data = await r.json();
      realPlayers = data.map(p => ({name:p.handle, pts:p.pts, burned:p.burned||0, isReal:true}));
    }
  } catch(e) {}
  renderLB();
}

async function saveScore() {
  if (!playerName) return;
  const update = {pts:totalPoints, burned:totalBurned, wins:wins, losses:losses, games:wins+losses, updated_at:new Date().toISOString()};
  try {
    // Always PATCH first — updates existing row
    await fetch(
      `${SUPA_URL}/rest/v1/leaderboard?handle=eq.${encodeURIComponent(playerName)}`,
      {method:'PATCH', headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'return=minimal'}, body:JSON.stringify(update)}
    );
    // Also POST with upsert — handles case where row doesn't exist yet
    await fetch(`${SUPA_URL}/rest/v1/leaderboard`, {
      method:'POST',
      headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'resolution=merge-duplicates,return=minimal'},
      body:JSON.stringify({handle:playerName, ...update})
    });
  } catch(e) { console.log('saveScore error:', e); }
}

function growBotScores() {
  const maxReal = Math.max(0, totalPoints, ...realPlayers.map(p=>p.pts));
  if (maxReal > 0) {
    TOP_BOTS[0].pts = Math.max(TOP_BOTS[0].pts, maxReal + 15000 + Math.floor(Math.random()*2000));
    TOP_BOTS[1].pts = Math.max(TOP_BOTS[1].pts, maxReal + 8000  + Math.floor(Math.random()*1500));
    TOP_BOTS[2].pts = Math.max(TOP_BOTS[2].pts, maxReal + 3000  + Math.floor(Math.random()*1000));
  }
  TOP_BOTS[0].pts += Math.floor(Math.random()*400+100);
  TOP_BOTS[1].pts += Math.floor(Math.random()*300+80);
  TOP_BOTS[2].pts += Math.floor(Math.random()*200+60);
}

setInterval(() => { fetchRealPlayers(); growBotScores(); }, 30000);

// ── ENTER ──
let dealerAutoTimer = null;

async function enterGame() {
  const raw = document.getElementById('nameInput').value.trim();
  const errEl = document.getElementById('nInputErr');
  if (!raw) { document.getElementById('nameInput').focus(); return; }
  const v = raw.replace(/^@/,'').toUpperCase();
  if (v.length < 2) { errEl.textContent = 'Handle too short'; return; }
  errEl.textContent = '';

  playerName = v;
  localStorage.setItem('lobstar_handle', playerName);
  document.getElementById('walletAddr').textContent = '0x' + Array.from({length:8},()=>Math.floor(Math.random()*16).toString(16)).join('') + '...';

  // Load stats silently
  try {
    const r = await fetch(`${SUPA_URL}/rest/v1/leaderboard?handle=eq.${encodeURIComponent(playerName)}&select=pts,burned,wins,losses,games`, {
      headers: {'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}
    });
    const data = await r.json();
    if (data && data.length > 0) {
      const s = data[0];
      totalPoints=s.pts||0; totalBurned=s.burned||0; wins=s.wins||0; losses=s.losses||0;
    } else {
      await registerReferral(true);
    }
  } catch(e) {}

  document.getElementById('raceBtn').style.display = 'block';
  setTimeout(() => cleanMyStaleRaces(), 1000);
  renderLB(); fetchRealPlayers(); updateUI(); startTicker(); startBots();

  // Show step 2 — mode pick
  document.getElementById('nStep1').style.display = 'none';
  document.getElementById('nStep2').style.display = 'block';
  document.getElementById('nWelcome').textContent = 'WELCOME, @' + playerName;

  // Start 30s auto-start countdown for vs Dealer
  let secs = 30;
  const totalSecs = 30;
  const circumference = 138; // 2*pi*22
  document.getElementById('dealerCountdownLabel').style.display = 'block';
  document.getElementById('dealerCountdownNum').textContent = secs;
  const ring = document.getElementById('cdringSvg');
  if (ring) ring.style.strokeDashoffset = '0';
  if (dealerAutoTimer) clearInterval(dealerAutoTimer);
  dealerAutoTimer = setInterval(() => {
    secs--;
    const numEl = document.getElementById('dealerCountdownNum');
    if (numEl) numEl.textContent = secs;
    const ringEl = document.getElementById('cdringSvg');
    if (ringEl) ringEl.style.strokeDashoffset = String(circumference * (1 - secs/totalSecs));
    if (secs <= 0) {
      clearInterval(dealerAutoTimer);
      dealerAutoTimer = null;
      startVsDealer();
    }
  }, 1000);
}

function backToHandle() {
  if (dealerAutoTimer) { clearInterval(dealerAutoTimer); dealerAutoTimer = null; }
  document.getElementById('nStep2').style.display = 'none';
  document.getElementById('nStep1').style.display = 'block';
}

function startVsDealer() {
  if (dealerAutoTimer) { clearInterval(dealerAutoTimer); dealerAutoTimer = null; }
  document.getElementById('nameOverlay').style.display = 'none';
  tlog('sys', `Welcome, ${playerName}. The house always burns.`);
  tlog('warn', `Min bet: 100 | SPLIT available | Every loss burns supply`);
}

function startMultiplayer() {
  if (dealerAutoTimer) { clearInterval(dealerAutoTimer); dealerAutoTimer = null; }
  document.getElementById('nameOverlay').style.display = 'none';
  tlog('sys', `Welcome, ${playerName}. Choose your battle.`);
  // Open multiplayer lobby
  openRaceLobby();
}

document.getElementById('nameInput').addEventListener('keydown', e => { if(e.key==='Enter') enterGame(); });
const savedHandle = localStorage.getItem('lobstar_handle');
if (savedHandle) {
  document.getElementById('nameInput').value = savedHandle;
  // Auto-login returning users: skip step 1, go to step 2 immediately
  setTimeout(() => enterGame(), 100);
}

// ── LEADERBOARD ──
function updateLBPlayer() { renderLB(); saveScore(); }
function renderLB() {
  growBotScores();
  const realNoMe = realPlayers.filter(p => p.name !== playerName);
  const fillCount = Math.max(0, 7 - realNoMe.length);
  const fillers = MID_BOTS.slice(0, fillCount);
  const mid = [...realNoMe, ...fillers].sort((a,b) => b.pts-a.pts);
  const meEntry = playerName ? [{name:playerName, pts:totalPoints, burned:totalBurned, isMe:true}] : [];
  const combined = [...mid, ...meEntry].sort((a,b) => b.pts-a.pts);
  const final = [...TOP_BOTS, ...combined];
  const el = document.getElementById('lbList'); el.innerHTML='';
  final.slice(0,12).forEach((p,i) => {
    const isTopBot = TOP_BOTS.some(b=>b.name===p.name);
    const row = document.createElement('div');
    row.className='lbrow'+(p.isMe?' me':'')+(isTopBot||p.isBot?' bot':'');
    const rc=i===0?'g':i===1?'s':i===2?'b':'';
    const medal=i===0?'🥇':i===1?'🥈':i===2?'🥉':(i+1);
    const tag=p.isMe?' ◀':p.isReal?' 🔴':'';
    row.innerHTML=`<div class="lbrnk ${rc}">${medal}</div><div class="lbnm">${p.name}${tag}</div><div class="lbpt">${p.pts.toLocaleString()}</div><div class="lbbr">${fmtN(p.burned)}🔥</div>`;
    el.appendChild(row);
  });
}

// ── MYSTERY BOX ──
const MBOX_REWARDS = [
  {weight:40,icon:'🦞',title:'LOBSTAR STASH',reward:'1,000 $LOBSTARGAMES',desc:'Stay claw-some! You earned a token stash.',amount:1000},
  {weight:30,icon:'⭐',title:'STAR REWARD',reward:'5,000 $LOBSTARGAMES',desc:'Shining bright! A bigger token drop incoming.',amount:5000},
  {weight:15,icon:'🔥',title:'BURN BONUS',reward:'10,000 $LOBSTARGAMES',desc:'You are on fire! Top tier token reward locked in.',amount:10000},
  {weight:10,icon:'👑',title:'DEGEN ROYALE',reward:'25,000 $LOBSTARGAMES',desc:'The claw has chosen wisely. Legendary reward.',amount:25000},
  {weight:4,icon:'💎',title:'DIAMOND CLAW',reward:'50,000 $LOBSTARGAMES',desc:'Ultra rare! You just won the biggest token stash.',amount:50000},
  {weight:1,icon:'🌙',title:'MOONSHOT',reward:'100,000 $LOBSTARGAMES',desc:'ONE IN A HUNDRED. The lobster gods have blessed you.',amount:100000},
];
function pickMboxReward() {
  const tot=MBOX_REWARDS.reduce((s,r)=>s+r.weight,0);
  let roll=Math.random()*tot;
  for(const r of MBOX_REWARDS){roll-=r.weight;if(roll<=0)return r;}
  return MBOX_REWARDS[0];
}
function triggerMbox(reason) {
  const reward=pickMboxReward();
  document.getElementById('mboxIcon').textContent=reward.icon;
  document.getElementById('mboxTrigger').textContent=reason.toUpperCase();
  document.getElementById('mboxReward').textContent=reward.reward;
  document.getElementById('mboxDesc').textContent=reward.desc;
  document.getElementById('mboxOverlay').classList.add('show');
}
function closeMbox() { document.getElementById('mboxOverlay').classList.remove('show'); }
function checkMboxTrigger() {
  if(streak===3) setTimeout(()=>triggerMbox('3 WIN STREAK!'),800);
  if(streak===5) setTimeout(()=>triggerMbox('5 WIN STREAK!'),800);
  if(totalPoints>=10000&&totalPoints-wins*100<10000) setTimeout(()=>triggerMbox('10,000 POINTS REACHED!'),800);
  if(totalPoints>=50000&&totalPoints-wins*100<50000) setTimeout(()=>triggerMbox('50,000 POINTS REACHED!'),800);
  if(totalPoints>=100000&&totalPoints-wins*100<100000) setTimeout(()=>triggerMbox('100,000 POINTS REACHED!'),800);
}
document.addEventListener('click',e=>{ if(e.target===document.getElementById('mboxOverlay'))closeMbox(); });

// ── REFERRAL ──
const REFERRAL_BONUS = 500;
let referredBy = null;
let myReferralCount = 0;
(function(){ const p=new URLSearchParams(window.location.search); const r=p.get('ref'); if(r)referredBy=r.toUpperCase(); })();

function getRefLink() {
  const base=window.location.origin+window.location.pathname;
  return `${base}?ref=${encodeURIComponent(playerName)}`;
}
function openRefModal() {
  document.getElementById('refOverlay').classList.add('show');
  if (playerName) {
    document.getElementById('refLinkBox').textContent = getRefLink();
    loadReferralCount();
  } else {
    document.getElementById('refLinkBox').textContent = 'Login first to get your invite link';
  }
}
function closeRefModal() { document.getElementById('refOverlay').classList.remove('show'); }
document.addEventListener('click',e=>{ if(e.target===document.getElementById('refOverlay'))closeRefModal(); });

function copyRefLink() {
  if(!playerName){showRefToast('LOGIN FIRST!');return;}
  navigator.clipboard.writeText(getRefLink()).then(()=>showRefToast('🔗 LINK COPIED!'));
}
function shareRefOnX() {
  if(!playerName){showRefToast('LOGIN FIRST!');return;}
  const txt=encodeURIComponent('🦞 Playing $LOBSTARGAMES — crypto blackjack where every loss burns supply forever!\n\nJoin with my link and get +500 FREE chips 👇\n'+getRefLink());
  window.open('https://twitter.com/intent/tweet?text='+txt,'_blank');
}
function showRefToast(msg) {
  const t=document.getElementById('refToast');
  t.textContent=msg; t.classList.add('show');
  setTimeout(()=>t.classList.remove('show'),2500);
}
async function loadReferralCount() {
  if(!playerName)return;
  try {
    const r=await fetch(`${SUPA_URL}/rest/v1/referrals?referrer=eq.${encodeURIComponent(playerName)}&select=id`,{headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}});
    const data=await r.json();
    myReferralCount=Array.isArray(data)?data.length:0;
    document.getElementById('refCountVal').textContent=myReferralCount;
    document.getElementById('refBonusVal').textContent=(myReferralCount*REFERRAL_BONUS).toLocaleString();
  }catch(e){}
}
async function registerReferral(isNewPlayer) {
  if(!referredBy||!isNewPlayer||referredBy===playerName)return;
  try {
    const r=await fetch(`${SUPA_URL}/rest/v1/referrals`,{
      method:'POST',
      headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'return=minimal'},
      body:JSON.stringify({referrer:referredBy,referred:playerName,bonus_paid:false})
    });
    if(r.ok||r.status===201) {
      balance+=REFERRAL_BONUS; updateUI();
      showRefToast(`🎁 +${REFERRAL_BONUS} CHIPS from ${referredBy}!`);
      tlog('win',`Referred by ${referredBy} — +${REFERRAL_BONUS} bonus chips!`);
    }
  }catch(e){}
}


// ══════════════════════════════════════════
// ── RACE MODE ──
// ══════════════════════════════════════════
let currentRaceId = null;
let currentRaceBet = 500;
let currentRaceMax = 6;
let racePollingInterval = null;
let racePollInterval = null;
let raceRole = null;
let raceState = 'idle';

async function openRaceLobby() {
  if (!playerName) { showRefToast('LOGIN FIRST!'); return; }
  // Reset mode select state
  document.getElementById('modeSelect').style.display = 'grid';
  document.getElementById('modeConfig').style.display = 'none';
  document.getElementById('mode1v1Card').classList.remove('selected');
  document.getElementById('modeMultiCard').classList.remove('selected');
  selectedMode = null;
  // Show in-game warning if mid-hand
  const warn = document.getElementById('inGameWarning');
  if (gameState === 'playing') {
    warn.style.display = 'block';
  } else {
    warn.style.display = 'none';
    // Clean stale races silently if not mid-hand
    try { await cleanMyStaleRaces(); } catch(e) {}
  }
  const el = document.getElementById('raceOverlay');
  el.classList.add('show'); el.style.display='flex'; el.style.visibility='visible'; el.style.pointerEvents='all';
}

let selectedMode = null;

function selectMode(mode) {
  selectedMode = mode;
  document.getElementById('mode1v1Card').classList.toggle('selected', mode==='1v1');
  document.getElementById('modeMultiCard').classList.toggle('selected', mode==='multi');
  // Set max players
  currentRaceMax = mode === '1v1' ? 2 : 6;
  // Show config panel
  document.getElementById('modeSelect').style.display = 'none';
  document.getElementById('modeConfig').style.display = 'block';
  document.getElementById('modeConfigTitle').textContent = mode === '1v1' ? '⚔️  1 v 1  —  HEAD TO HEAD' : '🎰  MULTIPLAYER  —  UP TO 6 PLAYERS';
  // Update bet display
  setBetQuick(currentRaceBet || 500);
  // Load open tables for this mode
  loadOpenRaces();
}

function setBetQuickDisplay(amt) {
  document.getElementById('modeConfigBet').textContent = amt >= 1000 ? (amt/1000)+'K' : amt;
  [500,1000,2500,5000].forEach(a => {
    const el = document.getElementById('rbq'+a);
    if (el) el.classList.toggle('sel', a===amt);
  });
}

async function forfeitAndContinue() {
  // Surrender current hand — lose bet to dealer
  if (gameState === 'playing') {
    tlog('warn', 'Player forfeited — bet surrendered to dealer');
    balance -= bet;
    await saveBalance();
    await newHand(true); // force new hand without payout
  }
  document.getElementById('inGameWarning').style.display = 'none';
  try { await cleanMyStaleRaces(); } catch(e) {}
}

async function quickMatchMode() {
  await quickMatch();
}

// Silently remove player from stale races AND delete duplicate waiting races
async function cleanMyStaleRaces() {
  if (!playerName) return;
  try {
    // 1. Remove player from stale race_hands
    const r = await fetch(
      `${SUPA_URL}/rest/v1/race_hands?handle=eq.${encodeURIComponent(playerName)}&select=race_id`,
      {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
    );
    const hands = await r.json();
    for (const h of hands) {
      const rr = await fetch(
        `${SUPA_URL}/rest/v1/races?id=eq.${h.race_id}&status=in.(waiting,playing)&select=id,status`,
        {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
      );
      const races = await rr.json();
      if (races.length) {
        await fetch(`${SUPA_URL}/rest/v1/race_hands?race_id=eq.${h.race_id}&handle=eq.${encodeURIComponent(playerName)}`, {
          method:'DELETE', headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}
        });
      }
    }
    // 2. Delete ALL waiting+playing races created by this player (cleanup all stale)
    const dr = await fetch(
      `${SUPA_URL}/rest/v1/races?created_by=eq.${encodeURIComponent(playerName)}&status=in.(waiting,playing)&select=id`,
      {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
    );
    const myRaces = await dr.json();
    for (const race of myRaces) {
      await fetch(`${SUPA_URL}/rest/v1/race_hands?race_id=eq.${race.id}`, {
        method:'DELETE', headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}
      });
      await fetch(`${SUPA_URL}/rest/v1/races?id=eq.${race.id}`, {
        method:'DELETE', headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}
      });
    }
    // 3. Also remove this player from other stale playing races (not created by them)
    const pr2 = await fetch(
      `${SUPA_URL}/rest/v1/race_hands?handle=eq.${encodeURIComponent(playerName)}&status=eq.playing&select=race_id`,
      {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
    );
    const staleHands = await pr2.json();
    for (const h of staleHands) {
      await fetch(`${SUPA_URL}/rest/v1/race_hands?race_id=eq.${h.race_id}&handle=eq.${encodeURIComponent(playerName)}`, {
        method:'DELETE', headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}
      });
    }
  } catch(e) {}
}

// Check if this player is already in a waiting/playing race
async function getMyActiveRace() {
  if (!playerName) return null;
  try {
    // Get all race_hands for this player
    const r = await fetch(
      `${SUPA_URL}/rest/v1/race_hands?handle=eq.${encodeURIComponent(playerName)}&select=race_id`,
      {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
    );
    const hands = await r.json();
    if (!hands || !hands.length) return null;
    const raceIds = hands.map(h=>h.race_id);
    // Find any active race among them
    for (const raceId of raceIds) {
      const rr = await fetch(
        `${SUPA_URL}/rest/v1/races?id=eq.${raceId}&status=in.(waiting,playing)&select=id,status,bet,max_players`,
        {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}}
      );
      const races = await rr.json();
      if (races && races.length) return races[0];
    }
  } catch(e) {}
  return null;
}
function closeRaceLobby() {
  try {
    const el = document.getElementById('raceOverlay');
    el.removeAttribute('class');
    el.style.cssText = 'display:none!important;visibility:hidden!important;pointer-events:none!important;z-index:-1!important;';
  } catch(e) {}
}

// switchRaceTab removed — replaced by selectMode()
function selectRaceBet(amt) {
  currentRaceBet = amt;
  [500,1000,2500,5000].forEach(a => { const el=document.getElementById('rbc'+a); if(el) el.classList.toggle('sel',a===amt); });
}
function selectRaceMax(n) {
  currentRaceMax = n;
  [2,4,6].forEach(a => { const el=document.getElementById('rmax'+a); if(el) el.classList.toggle('sel',a===n); });
}

async function loadOpenRaces() {
  const el = document.getElementById('raceList');
  el.innerHTML = '<div class="race-empty">Loading...</div>';
  try {
    const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?status=eq.waiting&select=id,bet,max_players,created_by,created_at&order=created_at.desc`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    let races = await r.json();
    // Deduplicate: keep only the newest race per host
    const seen = new Set();
    races = races.filter(race => {
      if (seen.has(race.created_by)) return false;
      seen.add(race.created_by);
      return true;
    });
    if (!races.length) { el.innerHTML = '<div class="race-empty">No open races — create one!</div>'; return; }
    el.innerHTML = '';
    for (const race of races) {
      const pr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${race.id}&select=handle`,
        {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
      const players = await pr.json();
      const count = players.length;
      const isFull = count >= race.max_players;
      const alreadyIn = players.some(p=>p.handle===playerName);
      const card = document.createElement('div');
      card.className = 'race-card';
      card.innerHTML = `<div class="race-card-info"><div class="race-card-host">🎲 ${race.created_by}'s RACE</div><div class="race-card-meta">${new Date(race.created_at).toLocaleTimeString()}</div></div><div style="text-align:right"><div class="race-card-bet">${race.bet.toLocaleString()} $LOBSTAR</div><div class="race-card-players">${count}/${race.max_players} PLAYERS</div></div><button class="race-join-btn" ${isFull||alreadyIn?'disabled':''} onclick="joinRace('${race.id}',${race.bet})">${alreadyIn?'JOINED':isFull?'FULL':'JOIN'}</button>`;
      el.appendChild(card);
    }
  } catch(e) { el.innerHTML = '<div class="race-empty">Error loading. Try refresh.</div>'; tlog('warn','loadOpenRaces error: '+e.message); }
}

async function quickMatch() {
  if (balance < 500) { showRefToast('NEED 500+ CHIPS!'); return; }
  try {
    const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?status=eq.waiting&select=id,bet,max_players`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    const races = await r.json();
    for (const race of races) {
      const pr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${race.id}&select=handle`,
        {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
      const players = await pr.json();
      if (players.length < race.max_players && !players.some(p=>p.handle===playerName)) {
        joinRace(race.id, race.bet); return;
      }
    }
  } catch(e) {}
  createRace();
}

async function createRace() {
  if (!playerName) { showRefToast('LOGIN FIRST!'); return; }
  if (balance < currentRaceBet) { showRefToast('NOT ENOUGH CHIPS!'); return; }
  // Check if player already has an open race
  try {
    const ck = await fetch(`${SUPA_URL}/rest/v1/races?created_by=eq.${encodeURIComponent(playerName)}&status=eq.waiting&select=id`,
      {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}});
    const existing = await ck.json();
    if (existing.length > 0) {
      // Reuse existing race instead of creating duplicate
      currentRaceId = existing[0].id;
      raceRole = 'host';
      closeRaceLobby();
      openWaitingRoom(currentRaceId, currentRaceBet, currentRaceMax);
      return;
    }
  } catch(e) {}

  try {
    const deck = buildRaceDeck();
    const dealerCards = [deck.pop(), deck.pop()];
    const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races`, {
      method:'POST',
      headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=representation'},
      body:JSON.stringify({status:'waiting',bet:currentRaceBet,dealer_cards:JSON.stringify(dealerCards),max_players:currentRaceMax,created_by:playerName})
    });
    const data = await r.json();
    const raceId = data[0].id;
    await joinRaceAsPlayer(raceId);
    raceRole = 'host';
    closeRaceLobby();
    openWaitingRoom(raceId, currentRaceBet, currentRaceMax);
  } catch(e) { tlog('warn','Create race error: '+e.message); }
}

async function joinRace(raceId, bet) {
  if (!playerName) { showRefToast('LOGIN FIRST!'); return; }
  if (balance < bet) { showRefToast('NOT ENOUGH CHIPS!'); return; }

  currentRaceId = raceId;
  currentRaceBet = bet;
  await joinRaceAsPlayer(raceId);
  raceRole = 'joiner';
  closeRaceLobby();
  try {
    const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?id=eq.${raceId}&select=bet,max_players`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    const data = await r.json();
    openWaitingRoom(raceId, data[0].bet, data[0].max_players);
  } catch(e) { openWaitingRoom(raceId, bet, 4); }
}

async function joinRaceAsPlayer(raceId) {
  currentRaceId = raceId;
  await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands`, {
    method:'POST',
    headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=minimal'},
    body:JSON.stringify({race_id:raceId,handle:playerName,status:'waiting',cards:'[]'})
  });
}

let autoStartTimer = null;
let inactivityTimer = null;   // warns at 15s, auto-stands at 25s
let inactivitySecs = 0;
let lastPlayerAction = 0;     // timestamp of last hit/stand/double
let autoStartSecs = 45;

function openWaitingRoom(raceId, bet, maxPlayers) {
  currentRaceId = raceId;
  raceState = 'waiting';
  document.getElementById('raceWaitBet').textContent = bet.toLocaleString();
  document.getElementById('raceWaitMax').textContent = maxPlayers;
  document.getElementById('raceWaitOverlay').classList.add('show');
  document.getElementById('raceWaitOverlay').style.display='flex';
  pollWaitingRoom();
  startAutoStartTimer(raceId);
}

function startAutoStartTimer(raceId) {
  clearInterval(autoStartTimer);
  autoStartSecs = 45;
  // Update display immediately
  const elInit = document.getElementById('raceAutoTimer');
  if (elInit) elInit.textContent = autoStartSecs;
  autoStartTimer = setInterval(async () => {
    if (raceState !== 'waiting') { clearInterval(autoStartTimer); return; } // stop if left
    autoStartSecs--;
    const el = document.getElementById('raceAutoTimer');
    if (el) el.textContent = Math.max(0, autoStartSecs);
    if (autoStartSecs <= 0) {
      clearInterval(autoStartTimer);
      tlog('warn', '⏱ Timer expired — auto-starting with available players...');
      try {
        const pr = await fetch(`${SUPA_URL}/rest/v1/race_hands?race_id=eq.${currentRaceId}&select=handle`,
          {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}});
        const players = await pr.json();
        const realPlayers2 = players.filter(p => !p.handle.includes('DEALER_BOT'));
        if (realPlayers2.length <= 1) {
          await startSoloRace(); // only 1 player — solo vs dealer
        } else {
          // Multiple players — only host fires startRace to avoid double-start
          // If both try, DB PATCH is idempotent so it's fine, but only one deals cards
          if (raceRole === 'host') {
            await startRace();
          } else {
            // Joiner: wait up to 5s for host to fire, then take over
            await new Promise(r => setTimeout(r, 3000));
            // Check if race started yet
            const rr2 = await fetch(`${SUPA_URL}/rest/v1/races?id=eq.${currentRaceId}&select=status`,
              {headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY}});
            const rd2 = await rr2.json();
            if (rd2[0] && rd2[0].status !== 'playing') {
              tlog('warn','Host inactive — joiner taking over start...');
              raceRole = 'host';
              await startRace();
            }
          }
        }
      } catch(e) { tlog('warn','Auto-start error: '+e); if (raceRole==='host') await startRace(); }
    }
  }, 1000);
}

function pollWaitingRoom() {
  clearInterval(racePollingInterval);
  racePollingInterval = setInterval(async () => {
    if (!currentRaceId || raceState !== 'waiting') { clearInterval(racePollingInterval); return; }
    try {
      const rr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?id=eq.${currentRaceId}&select=status,bet,max_players`,
        {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
      const rdata = await rr.json();
      if (!rdata.length) return;
      const race = rdata[0];
      const pr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&select=handle,status,cards,score`,
        {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
      const players = await pr.json();
      updateWaitingRoomUI(players, race);
      if (race.status === 'playing') {
        clearInterval(racePollingInterval);
        document.getElementById('raceWaitOverlay').classList.remove('show'); document.getElementById('raceWaitOverlay').style.display='none';
        beginRacePlaying();
      }
    } catch(e) {}
  }, 2000);
}

function cardMiniHtml(card) {
  if (!card) return '';
  const isRed = card.s === '♥' || card.s === '♦';
  return `<div class="race-mini-card ${isRed?'red':'black'}">${card.r}${card.s}</div>`;
}

function buildTableSeats(containerId, players, race, isLiveRace) {
  const grid = document.getElementById(containerId);
  const existingSeats = grid.querySelectorAll('.race-seat');
  existingSeats.forEach(s=>s.remove());
  const wrap = grid.closest('.race-table-wrap') || grid.parentElement;
  const W = wrap.offsetWidth || 380;
  // 6 seats spread across a bottom arc
  const seatCount = 6;
  const cx = W / 2;
  const ry = 52; // vertical radius of arc
  const rx = W * 0.43; // horizontal radius
  const baseY = 8; // top offset inside seats-row div
  for (let i=0; i<seatCount; i++) {
    const p = players[i];
    const isMe = p && p.handle === playerName;
    const isDone = p && ['done','blackjack'].includes(p.status);
    const isBust = p && p.status === 'bust';
    // Spread evenly: angle from 210deg to 330deg (wider arc = more spacing)
    const angleDeg = 210 + (120 / (seatCount-1)) * i;
    const angleRad = angleDeg * Math.PI / 180;
    const x = cx + rx * Math.cos(angleRad);
    const y = baseY + ry + ry * Math.sin(Math.abs(angleRad - Math.PI)) * 0.6;
    const seat = document.createElement('div');
    seat.className = 'race-seat';
    seat.style.cssText = `left:${Math.round(x-26)}px;top:${Math.round(y)}px;`;
    // Cards on felt
    let cardsHtml = '';
    if (p && p.cards) {
      try {
        const cards = JSON.parse(p.cards);
        if (cards.length) cardsHtml = `<div class="race-seat-cards">${cards.map(c=>cardMiniHtml(c)).join('')}</div>`;
      } catch(e){}
    }
    // Chip status class
    let chipClass = !p ? '' : isMe ? 'me' : isDone ? 'done' : isBust ? 'bust' : 'filled';
    if (isLiveRace && p && !isDone && !isBust) chipClass += ' playing';
    const chipLabel = p ? (isMe ? '★' : i+1) : (i+1);
    const nameLabel = p ? (isMe ? 'YOU' : p.handle.substring(0,7)) : 'OPEN';
    const nameClass = isMe ? 'me-name' : (!p ? 'style="color:rgba(255,255,255,0.15)"' : '');
    const scoreHtml = p && isLiveRace
      ? `<div class="race-seat-score" style="color:${isDone?'#00ff88':isBust?'#ff4444':'var(--gold)'}">${p.score||'?'}${isDone?' ✓':isBust?' ✗':''}</div>`
      : (p ? `<div class="race-seat-score">${race?.bet?.toLocaleString()||'?'}🪙</div>` : '');
    seat.innerHTML = `${cardsHtml}<div class="race-seat-chip ${chipClass}">${chipLabel}</div><div class="race-seat-name ${isMe?'me-name':''}" ${!p?'style="color:rgba(255,255,255,0.15)"':''}>${nameLabel}</div>${scoreHtml}`;
    grid.appendChild(seat);
  }
}

function updateWaitingRoomUI(players, race) {
  buildTableSeats('racePlayersGrid', players, race, false);
  const startBtn = document.getElementById('raceStartBtn');
  const realCount = players.filter(p=>!p.handle.includes('DEALER_BOT')).length;
  if (raceRole==='host') {
    if (realCount >= 6) {
      startBtn.disabled = false;
      startBtn.style.background = 'linear-gradient(180deg,#00aa55,#006633)';
      startBtn.textContent = '▶ TABLE FULL — START NOW (6/6)';
      startBtn.onclick = () => startRace();
    } else {
      startBtn.disabled = true;
      startBtn.style.background = '';
      startBtn.textContent = `WAITING FOR PLAYERS (${realCount}/6)`;
    }
  } else {
    startBtn.textContent = `WAITING (${realCount}/6 PLAYERS)`;
    startBtn.disabled = true;
  }
}

async function startRace() {
  if (raceRole !== 'host') return;
  clearInterval(racePollingInterval);
  const pr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&select=handle`,
    {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
  const players = await pr.json();
  const deck = buildRaceDeck();
  for (const p of players) {
    const cards = [deck.pop(), deck.pop()];
    await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&handle=eq.${encodeURIComponent(p.handle)}`, {
      method:'PATCH',
      headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=minimal'},
      body:JSON.stringify({cards:JSON.stringify(cards),status:'playing'})
    });
  }
  await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?id=eq.${currentRaceId}`, {
    method:'PATCH',
    headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=minimal'},
    body:JSON.stringify({status:'playing',started_at:new Date().toISOString(),finished_at:null})
  });
  document.getElementById('raceWaitOverlay').classList.remove('show'); document.getElementById('raceWaitOverlay').style.display='none';
  beginRacePlaying();
}

async function beginRacePlaying() {
  if (raceState === 'playing' || raceState === 'done') return;
  raceState = 'playing';
  try {
    const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&handle=eq.${encodeURIComponent(playerName)}&select=cards`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    const data = await r.json();
    if (!data.length) return;
    const myCards = JSON.parse(data[0].cards);
    if (balance < currentRaceBet) { tlog('warn','Not enough chips!'); leaveRace(); return; }
    balance -= currentRaceBet; bet = currentRaceBet; updateUI();
    buildDeck();
    hands=[myCards]; dealerHand=[]; isSplit=false; activeHand=0; handResults=[];
    gameState='playing';
    document.getElementById('raceBar').classList.add('show');
    renderAllHands();
    setSB('dealerScore','?'); setSB('hand0score',total(hands[0]));
    document.getElementById('dealerCards').innerHTML='';
    const fd=document.createElement('div'); fd.className='card facedown';
    document.getElementById('dealerCards').appendChild(fd);
    setBtns(false,true,true,balance>=currentRaceBet,false);
    resetInactivityTimer();
    tlog('sys','⚔️ RACE STARTED! Beat the dealer. Winner takes all bets!');
    tlog('info',`Your hand: ${hStr(hands[0])} (${total(hands[0])})`);
    pollRacePlayers();
    if (isBJ(hands[0])) { tlog('bj','BLACKJACK in the race!'); await submitRaceHand('blackjack',total(hands[0])); setBtns(false,false,false,false,false); }
  } catch(e) { tlog('warn','Race start error: '+e); }
}

function pollRacePlayers() {
  clearInterval(racePollInterval);
  racePollInterval = setInterval(async () => {
    if (!currentRaceId||raceState==='idle') return;
    try {
      const r = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&select=handle,status,score,cards`,
        {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
      const players = await r.json();
      updateRaceBar(players);
      const allDone = players.length>0 && players.every(p=>['done','bust','blackjack'].includes(p.status));
      if (allDone && raceState==='playing') { raceState='resolving'; clearInterval(racePollInterval); await resolveRace(); }
    } catch(e) {}
  }, 1500);
}

function updateRaceBar(players) {
  const realPlayers = players.filter(p => !p.handle.includes('DEALER_BOT'));
  buildTableSeats('racePlayersLive', realPlayers, null, true);
}

function resetInactivityTimer() {
  lastPlayerAction = Date.now();
  inactivitySecs = 0;
  clearInterval(inactivityTimer);
  const warn = document.getElementById('inactivityWarn');
  if (warn) warn.classList.remove('show');
  if (raceState !== 'playing' || gameState !== 'playing') return;
  inactivityTimer = setInterval(async () => {
    inactivitySecs++;
    if (inactivitySecs === 15) {
      // Warn at 15s
      const warn = document.getElementById('inactivityWarn');
      if (warn) { warn.classList.add('show'); }
      tlog('warn', '⚠️ You have been idle! Auto-stand in 10 seconds...');
    }
    if (inactivitySecs >= 25) {
      // Auto-stand at 25s
      clearInterval(inactivityTimer);
      const warn = document.getElementById('inactivityWarn');
      if (warn) warn.classList.remove('show');
      tlog('warn', '⏱ Timed out — auto-standing.');
      if (gameState === 'playing' && raceState === 'playing') {
        await playerStand();
      }
    }
    // Update countdown in warn (only visible after 15s)
    const cd = document.getElementById('inactivityCountdown');
    if (cd && inactivitySecs >= 15) cd.textContent = Math.max(0, 25 - inactivitySecs);
  }, 1000);
}

async function endRacePlaying() {
  if (raceState!=='playing') return;
  const myScore=total(hands[0]);
  const myStatus=isBJ(hands[0])?'blackjack':myScore>21?'bust':'done';
  await submitRaceHand(myStatus,myScore);
  setBtns(false,false,false,false,false);
  tlog('info',`⚔️ Locked in: ${myScore}. Waiting for others...`);
}

async function submitRaceHand(status, score) {
  await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&handle=eq.${encodeURIComponent(playerName)}`, {
    method:'PATCH',
    headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=minimal'},
    body:JSON.stringify({status:status,score:score,cards:JSON.stringify(hands[0])})
  });
}

async function resolveRace() {
  try {
    const rr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?id=eq.${currentRaceId}&select=dealer_cards,bet`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    const rdata = await rr.json();
    const dealerCards = JSON.parse(rdata[0].dealer_cards);
    const raceBet = rdata[0].bet;
    dealerHand=dealerCards;
    const tmpDeck=buildRaceDeck();
    while(total(dealerHand)<17) dealerHand.push(tmpDeck.pop());
    const ds=total(dealerHand);
    revealDealer();
    tlog('info',`DEALER: ${hStr(dealerHand)} = ${ds}`);
    const pr = await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&select=handle,score,status,cards`,
      {headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
    const allPlayers = await pr.json();
    // Filter out DEALER_BOT — it's a display entry, not a real player
    const players = allPlayers.filter(p => p.handle !== '🤖 DEALER_BOT' && p.handle !== 'DEALER_BOT');
    const results = players.map(p => {
      let result, payout = 0;
      // A player busted if status='bust' OR their score is over 21 OR score is 0/null (didn't submit = auto-bust)
      const playerBust = p.status === 'bust' || (p.score && p.score > 21) || (!p.score && p.status !== 'blackjack' && p.status !== 'done');
      const playerScore = p.score || 0;
      if (playerBust) {
        result = 'bust'; // Player busted — always loses, even if dealer also busts
      } else if (p.status === 'blackjack' && ds !== 21) {
        result = 'blackjack';
      } else if (ds > 21) {
        result = 'win'; // Dealer busted, player did not bust → player wins
      } else if (playerScore > ds) {
        result = 'win';
      } else if (playerScore === ds) {
        result = 'push'; payout = raceBet;
      } else {
        result = 'lose';
      }
      return { ...p, result, payout, score: playerBust ? null : playerScore };
    });
    const winners = results.filter(p => p.result === 'win' || p.result === 'blackjack');
    const totalPot = raceBet * players.length;
    if (winners.length > 0) {
      const share = Math.floor(totalPot / winners.length);
      results.forEach(p => {
        if (p.result === 'win' || p.result === 'blackjack') p.payout = share;
        else if (p.result === 'push') p.payout = raceBet;
        else p.payout = 0;
      });
    }
    const me=results.find(p=>p.handle===playerName);
    if(me){
      balance+=me.payout; updateUI();
      if(me.result==='win'||me.result==='blackjack'){wins++;streak++;tlog('twin',`⚔️ RACE WIN! +${me.payout.toLocaleString()} $LOBSTAR`);}
      else if(me.result==='push'){tlog('tinfo','⚔️ RACE PUSH — bet returned');}
      else{losses++;streak=0;const burned=Math.floor(raceBet*0.8);burnTokens(burned);tlog('tlose',`⚔️ RACE LOSS — ${burned.toLocaleString()} burned`);}
      saveScore();
    }
    await fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/races?id=eq.${currentRaceId}`, {
      method:'PATCH',
      headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Content-Type':'application/json','Prefer':'return=minimal'},
      body:JSON.stringify({status:'done',finished_at:new Date().toISOString()})
    });
    showRaceResults(results,ds,totalPot,winners.length,raceBet);
    raceState='done';
  } catch(e){ tlog('warn','Resolve error: '+e); }
}

function showRaceResults(results,dealerScore,totalPot,winnerCount,raceBet) {
  const me=results.find(p=>p.handle===playerName);
  const iWon=me&&(me.result==='win'||me.result==='blackjack');
  document.getElementById('raceResultsTitle').textContent=iWon?'🏆 YOU WIN THE RACE!':'💀 RACE OVER';
  document.getElementById('raceResultsTitle').style.color=iWon?'var(--green)':'var(--red-glow)';
  const list=document.getElementById('raceResultsList');
  list.innerHTML=`<div style="font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-dim);text-align:center;margin-bottom:8px">DEALER: ${dealerScore} | POT: ${totalPot.toLocaleString()} | ${winnerCount} WINNER(S)</div>`;
  const sorted=[...results].sort((a,b)=>({'blackjack':0,'win':1,'push':2,'lose':3,'bust':4}[a.result]||3)-({'blackjack':0,'win':1,'push':2,'lose':3,'bust':4}[b.result]||3));
  sorted.forEach((p,i)=>{
    const isMe=p.handle===playerName;
    const isWin=p.result==='win'||p.result==='blackjack';
    const isPush=p.result==='push';
    const row=document.createElement('div');
    row.className='race-result-row '+(isWin?'winner':isPush?'push':'loser');
    const medal=i===0?'🥇':i===1?'🥈':i===2?'🥉':'';
    row.innerHTML = `
      <div class="rrname" style="color:${isWin?'var(--green)':isPush?'var(--gold)':'var(--red-glow)'}">
        ${medal}${isMe?'★ ':''}${p.handle}
      </div>
      <div class="rrscore">Score: ${p.score !== null && p.score > 0 ? p.score : 'BUST'}</div>
      <div class="rrpayout" style="color:${isWin?'var(--green)':isPush?'var(--gold)':'var(--red-glow)'}">
        ${isWin ? '+'+p.payout.toLocaleString() : isPush ? '±0' : '-'+raceBet.toLocaleString()}
      </div>`;
    list.appendChild(row);
  });
  document.getElementById('raceResultsOverlay').classList.add('show'); document.getElementById('raceResultsOverlay').style.display='flex';
}

function closeRaceResults() {
  clearInterval(racePollingInterval);
  clearInterval(racePollInterval);
  clearInterval(autoStartTimer);
  ['raceResultsOverlay','raceWaitOverlay','raceOverlay'].forEach(id => {
    const el = document.getElementById(id);
    el.classList.remove('show');
    el.style.display = 'none';
    el.style.visibility = 'hidden';
    el.style.pointerEvents = 'none';
  });
  document.getElementById('raceBar').classList.remove('show');
  clearInterval(inactivityTimer); document.getElementById('inactivityWarn')?.classList.remove('show');
  raceState='idle'; currentRaceId=null; raceRole=null;
  newHand();
}
function playAgainRace() { closeRaceResults(); setTimeout(()=>openRaceLobby(),300); }
async function leaveAndGoHome() {
  await penalizeRaceLeave();
  clearInterval(racePollingInterval); clearInterval(racePollInterval); clearInterval(autoStartTimer);
  if (currentRaceId) fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&handle=eq.${encodeURIComponent(playerName)}`,{method:'DELETE',headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
  window.location.href = 'https://lobstargames.win';
}

async function penalizeRaceLeave() {
  // Deduct race bet as penalty for leaving mid-race
  if (currentRaceId && currentRaceBet > 0 && raceState === 'playing') {
    balance = Math.max(0, balance - currentRaceBet);
    updBal();
    tlog('warn', `⚔️ Left race — lost ${currentRaceBet.toLocaleString()} $LOBSTAR bet`);
    // Save updated balance to Supabase
    try {
      await fetch(`${SUPA_URL}/rest/v1/leaderboard?handle=eq.${encodeURIComponent(playerName)}`, {
        method:'PATCH',
        headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'return=minimal'},
        body:JSON.stringify({balance:balance})
      });
    } catch(e) {}
  }
}

function leaveRace() {
  clearInterval(racePollingInterval); clearInterval(racePollInterval); clearInterval(autoStartTimer);
  if(currentRaceId) fetch(`https://mvakqyddivstvsbioptg.supabase.co/rest/v1/race_hands?race_id=eq.${currentRaceId}&handle=eq.${encodeURIComponent(playerName)}`,{method:'DELETE',headers:{'apikey':'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo','Authorization':'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Im12YWtxeWRkaXZzdHZzYmlvcHRnIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzIwMzQ4NjIsImV4cCI6MjA4NzYxMDg2Mn0.aYl2lm3b2us5Y6GCpDkBv2ggNte8FSx3EyofyLB5qTo'}});
  currentRaceId=null; raceRole=null; raceState='idle';
  document.getElementById('raceWaitOverlay').classList.remove('show'); document.getElementById('raceWaitOverlay').style.display='none';
  tlog('warn','Left the race.');
}

function buildRaceDeck() {
  const suits=['♠','♥','♦','♣'],ranks=['A','2','3','4','5','6','7','8','9','10','J','Q','K'];
  const d=[];
  for(let s of suits)for(let r of ranks)d.push({r,s});
  for(let i=d.length-1;i>0;i--){const j=Math.floor(Math.random()*(i+1));[d[i],d[j]]=[d[j],d[i]];}
  return d;
}

// playerStand race hook handled inside playerStand() directly


// ── SESSION EXIT PROTECTION ──
function safeGoHome() {
  const inGame = gameState === 'playing';
  const inRace = typeof raceState !== 'undefined' && (raceState === 'playing' || raceState === 'waiting');
  if (inGame || inRace) {
    const msg = inRace
      ? 'You are in an active RACE! Leaving will forfeit your bet.\n\nAre you sure you want to leave?'
      : 'You have an active hand in progress!\n\nAre you sure you want to leave?';
    if (!confirm(msg)) return;
    // Clean up race if needed
    if (inRace && typeof leaveRace === 'function') leaveRace();
  }
  window.location.href = 'https://lobstargames.win';
}

// Warn on browser back / tab close / refresh
window.addEventListener('beforeunload', function(e) {
  const inGame = gameState === 'playing';
  const inRace = typeof raceState !== 'undefined' && (raceState === 'playing' || raceState === 'waiting');
  if (inGame || inRace) {
    const msg = 'You have an active session! Your progress may be lost.';
    e.preventDefault();
    e.returnValue = msg;
    return msg;
  }
});

// Warn on browser back button
window.addEventListener('popstate', function(e) {
  const inGame = gameState === 'playing';
  const inRace = typeof raceState !== 'undefined' && (raceState === 'playing' || raceState === 'waiting');
  if (inGame || inRace) {
    const stay = !confirm('Leave game? Active session will be lost.');
    if (stay) {
      history.pushState(null, '', window.location.href);
    }
  }
});

// Push state so popstate fires on back button
history.pushState(null, '', window.location.href);


// ESC key closes race overlays
document.addEventListener('keydown', function(e) {
  if (e.key === 'Escape') {
    closeRaceLobby();
    if (document.getElementById('raceWaitOverlay').style.display === 'flex') {
      if (confirm('Leave the race waiting room?')) leaveRace();
    }
    if (document.getElementById('raceResultsOverlay').style.display === 'flex') closeRaceResults();
  }
});


function setBetQuick(amt) {
  currentRaceBet = amt;
  const inp = document.getElementById('raceBetInput');
  if (inp) inp.value = amt;
  document.querySelectorAll('.race-bet-chip').forEach(el => el.classList.remove('sel'));
  setBetQuickDisplay(amt);
}

// Solo race vs system dealer (1 player only)
async function startSoloRace() {
  tlog('sys', '⚔️ No opponents — racing solo vs dealer!');
  // Add a ghost "DEALER" player so resolve logic works
  await fetch(`${SUPA_URL}/rest/v1/race_hands`, {
    method:'POST',
    headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'resolution=merge-duplicates,return=minimal'},
    body:JSON.stringify({race_id:currentRaceId, handle:'🤖 DEALER_BOT', status:'done', cards:'[]', score:0})
  });
  await fetch(`${SUPA_URL}/rest/v1/races?id=eq.${currentRaceId}`, {
    method:'PATCH',
    headers:{'apikey':SUPA_KEY,'Authorization':'Bearer '+SUPA_KEY,'Content-Type':'application/json','Prefer':'return=minimal'},
    body:JSON.stringify({status:'playing', started_at:new Date().toISOString()})
  });
  document.getElementById('raceWaitOverlay').classList.remove('show');
  document.getElementById('raceWaitOverlay').style.display='none';
  beginRacePlaying();
}

// ── SHARE SCORE ──
function shareScore() {
  const txt=encodeURIComponent('🦞 Just played @LobstarGames!\n\n🏆 Points: '+totalPoints.toLocaleString()+'\n✓ Wins: '+wins+' | ✗ Losses: '+losses+'\n🔥 Burned: '+fmtN(totalBurned)+' $LOBSTARGAMES\n\nEvery loss burns supply forever.\nPlay now 👇\nlobstargames.win/game');
  window.open('https://twitter.com/intent/tweet?text='+txt,'_blank');
}

// Init
growBotScores();
setBtns(true,false,false,false,false);
renderLB();
</script>

<!-- MYSTERY BOX -->
<div class="mbox-overlay" id="mboxOverlay">
  <div class="mbox">
    <div class="mbox-icon" id="mboxIcon">🎁</div>
    <div class="mbox-title">MYSTERY BOX</div>
    <div class="mbox-trigger" id="mboxTrigger">TRIGGERED BY STREAK</div>
    <div class="mbox-reward" id="mboxReward">??? $LOBSTARGAMES</div>
    <div class="mbox-desc" id="mboxDesc">Loading your reward...</div>
    <button class="mbox-btn" onclick="closeMbox()">CLAIM REWARD 🦞</button>
  </div>
</div>

<!-- REFERRAL MODAL -->
<div class="ref-overlay" id="refOverlay">
  <div class="ref-modal">
    <div class="ref-modal-title">🔗 INVITE FRENS</div>
    <div class="ref-modal-sub">
      Share your link. Frens get <span>+500 chips</span> on first signup.<br>
      You earn <span>+1,000 pts</span> for every new player you bring.
    </div>
    <div class="ref-stats-grid">
      <div class="ref-stat"><div class="ref-stat-val" id="refCountVal">0</div><div class="ref-stat-lbl">FRENS REFERRED</div></div>
      <div class="ref-stat"><div class="ref-stat-val" id="refBonusVal">0</div><div class="ref-stat-lbl">BONUS CHIPS GIVEN</div></div>
    </div>
    <div class="ref-link-box" id="refLinkBox" onclick="copyRefLink()">Login to generate your link</div>
    <div class="ref-modal-btns">
      <button class="ref-btn-copy" onclick="copyRefLink()">📋 COPY LINK</button>
      <button class="ref-btn-x" onclick="shareRefOnX()">𝕏 SHARE ON X</button>
    </div>
    <div class="ref-rules">
      <span>HOW IT WORKS:</span><br>
      • Share your link → fren opens lobstargames.win/game?ref=YOU<br>
      • New players only — existing accounts don't qualify<br>
      • No self-referrals • Each player can only be referred once
    </div>
    <button class="ref-close" onclick="closeRefModal()">CLOSE</button>
  </div>
</div>
<div class="ref-toast" id="refToast"></div>


<!-- BANKRUPTCY OVERLAY -->
<div class="broke-overlay" id="brokeOverlay">
  <div class="broke-box">
    <div class="broke-icon">🦞</div>
    <div class="broke-title">RUGGED.</div>
    <div class="broke-sub">
      The house won. Your wallet hit <span>zero</span>.<br>
      Every chip you lost was burned forever.<br>
      The supply is smaller. The lobster endures.
    </div>
    <div class="broke-stats">
      <div class="broke-stat">
        <div class="broke-stat-val" id="brokeTotalGames">0</div>
        <div class="broke-stat-lbl">GAMES</div>
      </div>
      <div class="broke-stat">
        <div class="broke-stat-val" id="brokeBurned">0</div>
        <div class="broke-stat-lbl">BURNED</div>
      </div>
      <div class="broke-stat">
        <div class="broke-stat-val" id="brokePts">0</div>
        <div class="broke-stat-lbl">POINTS</div>
      </div>
    </div>
    <div class="broke-btns">
      <button class="broke-claim-btn" onclick="claimAirdrop()">🪂 CLAIM AIRDROP — 5,000 CHIPS</button>
      <button class="broke-share-btn" onclick="shareRugged()">𝕏 SHARE "I GOT RUGGED BY @LOBSTARGAMES"</button>
      <button class="broke-ref-btn" onclick="closeBrokeAndOpenRef()">🔗 REFER A FREN — GET EXTRA 500 CHIPS</button>
    </div>
  </div>
</div>


<!-- RACE BUTTON (fixed bottom right) -->
<button class="race-btn" id="raceBtn" onclick="openRaceLobby()" style="display:none">⚔️ MULTIPLAYER</button>

<!-- RACE LOBBY OVERLAY -->
<div class="race-overlay" id="raceOverlay">
  <div class="race-lobby">

    <!-- CLOSE BTN -->
    <button onclick="closeRaceLobby()" style="position:absolute;top:16px;right:16px;background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.2);font-family:'Cinzel',serif;font-size:16px;width:36px;height:36px;border-radius:4px;cursor:pointer;line-height:1;transition:all .2s;" onmouseover="this.style.borderColor='var(--gold)';this.style.color='var(--gold)'" onmouseout="this.style.borderColor='rgba(255,184,0,0.2)';this.style.color='var(--text-dim)'">✕</button>

    <!-- HEADER -->
    <div style="text-align:center;margin-bottom:28px;">
      <div class="race-lobby-title">⚔ MULTIPLAYER</div>
      <div class="race-lobby-sub">Same dealer. First to beat the house wins everyone's bet.</div>
    </div>

    <!-- IN-GAME WARNING (hidden by default) -->
    <div id="inGameWarning" style="display:none;background:rgba(255,80,0,0.1);border:1px solid rgba(255,80,0,0.4);border-radius:8px;padding:18px;margin-bottom:22px;text-align:center;">
      <div style="font-family:'Cinzel',serif;font-size:16px;color:#ff8844;letter-spacing:3px;margin-bottom:8px;">⚠ YOU ARE IN AN ACTIVE GAME</div>
      <div style="font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-dim);margin-bottom:14px;">Leaving now will forfeit your current bet.<br>Your chips will go to the dealer.</div>
      <div style="display:flex;gap:10px;justify-content:center;">
        <button onclick="forfeitAndContinue()" style="background:linear-gradient(180deg,#aa2200,#660f00);color:#ffccaa;border:1px solid rgba(255,80,0,0.5);font-family:'Cinzel',serif;font-size:13px;letter-spacing:2px;padding:10px 22px;border-radius:5px;cursor:pointer;">FORFEIT &amp; CONTINUE</button>
        <button onclick="closeRaceLobby()" style="background:rgba(255,184,0,0.08);color:var(--gold);border:1px solid rgba(255,184,0,0.3);font-family:'Cinzel',serif;font-size:13px;letter-spacing:2px;padding:10px 22px;border-radius:5px;cursor:pointer;">STAY IN GAME</button>
      </div>
    </div>

    <!-- MODE SELECTION — 2 cards -->
    <div id="modeSelect" style="display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px;">

      <!-- 1v1 -->
      <div onclick="selectMode('1v1')" id="mode1v1Card" style="cursor:pointer;background:linear-gradient(160deg,rgba(255,184,0,0.07),rgba(255,184,0,0.02));border:2px solid rgba(255,184,0,0.25);border-radius:10px;padding:22px 16px;text-align:center;transition:all .25s;">
        <div style="font-size:36px;margin-bottom:10px;">⚔️</div>
        <div style="font-family:'Cinzel',serif;font-size:18px;color:var(--gold);letter-spacing:3px;margin-bottom:6px;">1 v 1</div>
        <div style="font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-dim);line-height:1.6;">You vs one opponent<br>vs the dealer.<br>Winner takes both bets.</div>
      </div>

      <!-- MULTIPLAYER -->
      <div onclick="selectMode('multi')" id="modeMultiCard" style="cursor:pointer;background:linear-gradient(160deg,rgba(0,200,100,0.07),rgba(0,200,100,0.02));border:2px solid rgba(0,200,100,0.2);border-radius:10px;padding:22px 16px;text-align:center;transition:all .25s;">
        <div style="font-size:36px;margin-bottom:10px;">🎰</div>
        <div style="font-family:'Cinzel',serif;font-size:18px;color:var(--green);letter-spacing:3px;margin-bottom:6px;">MULTI</div>
        <div style="font-family:'Share Tech Mono',monospace;font-size:10px;color:var(--text-dim);line-height:1.6;">Up to 6 players<br>vs same dealer.<br>First to beat house wins.</div>
      </div>
    </div>

    <!-- BET + OPEN TABLE (shown after mode selected) -->
    <div id="modeConfig" style="display:none;">
      <div style="text-align:center;margin-bottom:16px;">
        <div id="modeConfigTitle" style="font-family:'Cinzel',serif;font-size:14px;letter-spacing:4px;color:var(--gold);margin-bottom:14px;"></div>
        <!-- BET CHIPS -->
        <div style="font-family:'Cinzel',serif;font-size:10px;letter-spacing:4px;color:var(--text-muted);margin-bottom:10px;">SELECT BET</div>
        <div style="display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:14px;">
          <button onclick="setBetQuick(500)"  class="race-bet-chip" id="rbq500">500</button>
          <button onclick="setBetQuick(1000)" class="race-bet-chip" id="rbq1000">1K</button>
          <button onclick="setBetQuick(2500)" class="race-bet-chip" id="rbq2500">2.5K</button>
          <button onclick="setBetQuick(5000)" class="race-bet-chip" id="rbq5000">5K</button>
        </div>
        <div style="font-family:'Cinzel',serif;font-size:22px;color:var(--gold);letter-spacing:3px;margin-bottom:6px;">
          BET: <span id="modeConfigBet">500</span> <span style="font-size:12px;color:var(--text-muted);">$LOBSTAR</span>
        </div>
      </div>

      <!-- FIND existing OR create new -->
      <div style="display:flex;gap:10px;flex-direction:column;margin-bottom:14px;">
        <button onclick="quickMatchMode()" class="race-quickmatch-btn" style="font-family:'Cinzel',serif;letter-spacing:3px;font-size:15px;">⚡ JOIN OPEN TABLE</button>
        <button onclick="createRace()" class="race-create-btn" style="font-family:'Cinzel',serif;letter-spacing:3px;font-size:15px;">🎲 CREATE MY TABLE</button>
      </div>

      <!-- OPEN TABLES LIST -->
      <div class="race-list" id="raceList" style="max-height:200px;">
        <div class="race-empty">Loading open tables...</div>
      </div>
      <button onclick="loadOpenRaces()" style="width:100%;background:transparent;color:var(--text-dim);border:1px solid rgba(255,184,0,0.15);font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:2px;padding:7px;border-radius:3px;cursor:pointer;margin-top:6px;">↺ REFRESH</button>
    </div>

    <div style="margin-top:16px;text-align:center;">
      <button onclick="closeRaceLobby()" style="background:transparent;color:var(--text-muted);border:none;font-family:'Share Tech Mono',monospace;font-size:11px;letter-spacing:2px;cursor:pointer;padding:6px 20px;">← BACK TO GAME</button>
    </div>
  </div>
</div>

<!-- RACE WAITING ROOM -->
<div class="race-overlay" id="raceWaitOverlay">
  <div class="race-lobby">
    <div class="race-waiting">
      <div class="race-waiting-title">⏳ WAITING FOR PLAYERS</div>
      <div class="race-waiting-sub" id="raceWaitSub">6 players = instant start &bull; Timer: <span id="raceAutoTimer" style="color:var(--gold)">60</span>s</div>
      <div class="race-table-wrap" id="raceTableWrap">
        <div class="race-table-felt"></div>
        <div class="race-felt-inner"></div>
        <div class="race-felt-logo">LOBSTAR CASINO</div>
        <div class="race-table-rail"></div>
        <div class="race-dealer-spot">
          <div class="race-dealer-avatar">🃏</div>
          <div class="race-dealer-label">DEALER</div>
          <div class="race-dealer-cards" id="raceDealerCardsDisplay"></div>
        </div>
        <div class="race-seats-row" id="racePlayersGrid"></div>
      </div>
      <div style="font-family:'Share Tech Mono',monospace;font-size:11px;color:var(--text-dim);margin-bottom:14px;">
        BET: <span style="color:var(--gold)" id="raceWaitBet">—</span> &bull; MAX: <span id="raceWaitMax">4</span> PLAYERS
      </div>
      <button class="race-start-btn" id="raceStartBtn" onclick="startRace()" disabled>▶ START RACE</button><br>
      <div style="display:flex;gap:8px;justify-content:center;flex-wrap:wrap;">
      <button class="race-leave-btn" onclick="leaveRace()">← BACK TO GAME</button>
      <button class="race-leave-btn" onclick="leaveAndGoHome()" style="background:rgba(255,50,50,0.08);border-color:rgba(255,50,50,0.3);color:rgba(255,100,100,0.8);">🏠 LEAVE & GO HOME</button>
    </div>
    </div>
  </div>
</div>

<!-- RACE LIVE BAR (inside game) -->
<div class="race-bar" id="raceBar">
  <div class="race-bar-title">⚔️ RACE IN PROGRESS</div>
  <div class="race-table-wrap" style="height:180px;margin-bottom:0;">
    <div class="race-table-felt"></div>
    <div class="race-felt-inner"></div>
    <div class="race-table-rail"></div>
    <div class="race-dealer-spot" style="top:6px;">
      <div class="race-dealer-avatar" style="width:28px;height:28px;font-size:12px;">🃏</div>
      <div class="race-dealer-label" style="font-size:7px;">DEALER</div>
    </div>
    <div class="race-seats-row" id="racePlayersLive" style="top:80px;height:100px;"></div>
  </div>
</div>

<!-- RACE RESULTS -->
<div class="race-results-overlay" id="raceResultsOverlay">
  <div class="race-results-box">
    <div class="race-results-title" id="raceResultsTitle">RACE OVER!</div>
    <div class="race-results-list" id="raceResultsList"></div>
    <div>
      <button class="race-play-again-btn" onclick="playAgainRace()">▶ PLAY AGAIN</button>
      <button class="race-close-btn" onclick="closeRaceResults()">BACK TO GAME</button>
      <button class="race-close-btn" onclick="leaveAndGoHome()" style="background:rgba(255,50,50,0.08);border-color:rgba(255,50,50,0.3);color:rgba(255,100,100,0.8);">🏠 GO HOME</button>
    </div>
  </div>
</div>

<div class="race-inactivity-warn" id="inactivityWarn">⚠️ ACT NOW! AUTO-STAND IN <span id="inactivityCountdown">10</span>s</div>
</body>
</html>