@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

:root{
  --purple:#7c3aed;
  --orange:#f59e0b;
  --bg:#08071a;

  --home-bg:#08071a;
  --home-aurora-a:rgba(88,28,220,.14);
  --home-aurora-b:rgba(167,40,200,.1);
  --home-login-grad-from:rgba(30,27,75,.8);
  --home-login-grad-via:rgba(46,16,101,.6);
  --home-login-grad-to:rgba(2,6,23,.9);
  --home-orb-1:#6d28d9;
  --home-orb-2:#4f46e5;
  --home-orb-3:#7c3aed;
  --home-grid-color:rgba(139,92,246,.05);
  --home-card-bg-a:rgba(15,10,40,.96);
  --home-card-bg-b:rgba(46,16,101,.92);
  --home-card-bg-c:rgba(20,18,40,.96);
  --home-card-header-a:rgba(30,10,70,.85);
  --home-card-header-b:rgba(55,20,110,.75);
  --home-card-header-c:rgba(10,8,30,.9);
  --home-card-border:rgba(139,92,246,.35);
  --home-card-glow:rgba(167,139,250,.2);
  --home-shimmer-a:#a78bfa;
  --home-shimmer-b:#818cf8;
  --home-icon-a:#7c3aed;
  --home-icon-b:#6d28d9;
  --home-icon-c:#4338ca;
  --home-btn-a:#7c3aed;
  --home-btn-b:#6d28d9;
  --home-btn-c:#4f46e5;
}

body[data-home-theme="background"]{
  --home-bg:#050811;
  --home-aurora-a:rgba(12,148,136,.14);
  --home-aurora-b:rgba(59,130,246,.12);
  --home-login-grad-from:rgba(3,36,45,.86);
  --home-login-grad-via:rgba(11,45,74,.62);
  --home-login-grad-to:rgba(2,12,28,.93);
  --home-orb-1:#0f766e;
  --home-orb-2:#0ea5e9;
  --home-orb-3:#14b8a6;
  --home-grid-color:rgba(34,211,238,.05);
  --home-card-border:rgba(34,211,238,.36);
  --home-card-glow:rgba(34,211,238,.24);
  --home-icon-a:#0f766e;
  --home-icon-b:#0ea5e9;
  --home-icon-c:#0369a1;
  --home-btn-a:#0f766e;
  --home-btn-b:#0284c7;
  --home-btn-c:#0e7490;
}

body[data-home-theme="background-alt"]{
  --home-bg:#09070f;
  --home-aurora-a:rgba(91,33,182,.15);
  --home-aurora-b:rgba(99,102,241,.11);
  --home-login-grad-from:rgba(32,16,64,.84);
  --home-login-grad-via:rgba(46,16,88,.66);
  --home-login-grad-to:rgba(13,8,28,.93);
  --home-orb-1:#7e22ce;
  --home-orb-2:#6366f1;
  --home-orb-3:#a855f7;
  --home-grid-color:rgba(192,132,252,.05);
  --home-card-border:rgba(167,139,250,.33);
  --home-icon-a:#7e22ce;
  --home-icon-b:#8b5cf6;
  --home-icon-c:#6366f1;
}

body[data-home-theme="background_upgraded"]{
  --home-bg:#08071a;
  --home-aurora-a:rgba(88,28,220,.14);
  --home-aurora-b:rgba(167,40,200,.1);
}

body[data-home-theme="background-1"]{
  --home-bg:#08071a;
  --home-aurora-a:rgba(109,40,217,.14);
  --home-aurora-b:rgba(79,70,229,.11);
  --home-login-grad-from:rgba(30,27,75,.82);
  --home-login-grad-via:rgba(46,16,101,.62);
  --home-login-grad-to:rgba(2,6,23,.92);
  --home-orb-1:#6d28d9;
  --home-orb-2:#4f46e5;
  --home-orb-3:#7c3aed;
}

body[data-home-theme="card_v3_purple"]{
  --home-bg:#0a061c;
  --home-aurora-a:rgba(109,40,217,.16);
  --home-aurora-b:rgba(99,102,241,.14);
  --home-login-grad-from:rgba(24,10,58,.9);
  --home-login-grad-via:rgba(40,16,88,.72);
  --home-login-grad-to:rgba(8,5,20,.95);
  --home-grid-color:rgba(167,139,250,.06);
  --home-card-border:rgba(139,92,246,.45);
  --home-card-glow:rgba(109,40,217,.3);
  --home-shimmer-a:#c084fc;
  --home-shimmer-b:#8b5cf6;
  --home-icon-a:#8b5cf6;
  --home-icon-b:#6d28d9;
  --home-icon-c:#4c1d95;
}

body[data-home-theme="card_v4_cyber"],
body[data-home-theme="card_v4_cyber-1"]{
  --home-bg:#030712;
  --home-aurora-a:rgba(34,211,238,.13);
  --home-aurora-b:rgba(232,121,249,.1);
  --home-login-grad-from:rgba(5,15,33,.9);
  --home-login-grad-via:rgba(8,28,54,.72);
  --home-login-grad-to:rgba(3,8,22,.95);
  --home-orb-1:#0891b2;
  --home-orb-2:#0ea5e9;
  --home-orb-3:#e879f9;
  --home-grid-color:rgba(34,211,238,.06);
  --home-card-bg-a:rgba(4,6,18,.97);
  --home-card-bg-b:rgba(8,24,40,.92);
  --home-card-bg-c:rgba(6,10,26,.97);
  --home-card-header-a:rgba(5,22,44,.9);
  --home-card-header-b:rgba(15,42,70,.8);
  --home-card-header-c:rgba(5,12,28,.92);
  --home-card-border:rgba(34,211,238,.38);
  --home-card-glow:rgba(34,211,238,.22);
  --home-shimmer-a:#22d3ee;
  --home-shimmer-b:#e879f9;
  --home-icon-a:#0e7490;
  --home-icon-b:#0284c7;
  --home-icon-c:#7e22ce;
  --home-btn-a:#0e7490;
  --home-btn-b:#0284c7;
  --home-btn-c:#9333ea;
}

body[data-home-theme="card_v5_baroque"]{
  --home-bg:#140c08;
  --home-aurora-a:rgba(154,52,18,.15);
  --home-aurora-b:rgba(180,83,9,.11);
  --home-login-grad-from:rgba(46,18,10,.92);
  --home-login-grad-via:rgba(74,31,10,.68);
  --home-login-grad-to:rgba(23,10,6,.95);
  --home-orb-1:#9a3412;
  --home-orb-2:#b45309;
  --home-orb-3:#d97706;
  --home-grid-color:rgba(217,119,6,.06);
  --home-card-bg-a:rgba(28,12,8,.96);
  --home-card-bg-b:rgba(74,31,10,.86);
  --home-card-bg-c:rgba(26,14,8,.95);
  --home-card-header-a:rgba(42,18,10,.92);
  --home-card-header-b:rgba(90,38,12,.76);
  --home-card-header-c:rgba(28,14,10,.9);
  --home-card-border:rgba(217,119,6,.36);
  --home-card-glow:rgba(180,83,9,.24);
  --home-shimmer-a:#f59e0b;
  --home-shimmer-b:#fbbf24;
  --home-icon-a:#b45309;
  --home-icon-b:#d97706;
  --home-icon-c:#92400e;
  --home-btn-a:#b45309;
  --home-btn-b:#d97706;
  --home-btn-c:#ea580c;
}

body[data-home-theme="b10-card"]{
  --home-bg:#07111a;
  --home-aurora-a:rgba(56,189,248,.15);
  --home-aurora-b:rgba(99,102,241,.12);
  --home-login-grad-from:rgba(9,30,58,.9);
  --home-login-grad-via:rgba(12,48,78,.72);
  --home-login-grad-to:rgba(4,10,24,.95);
  --home-orb-1:#0284c7;
  --home-orb-2:#3b82f6;
  --home-orb-3:#22d3ee;
  --home-grid-color:rgba(56,189,248,.07);
  --home-card-border:rgba(56,189,248,.38);
  --home-card-glow:rgba(14,165,233,.24);
  --home-btn-a:#0369a1;
  --home-btn-b:#0284c7;
  --home-btn-c:#2563eb;
}

body[data-home-theme="boxes-redesign"]{
  --home-bg:#0b1320;
  --home-aurora-a:rgba(20,184,166,.14);
  --home-aurora-b:rgba(132,204,22,.1);
  --home-login-grad-from:rgba(6,32,38,.9);
  --home-login-grad-via:rgba(12,52,48,.72);
  --home-login-grad-to:rgba(5,16,24,.95);
  --home-orb-1:#0d9488;
  --home-orb-2:#10b981;
  --home-orb-3:#84cc16;
  --home-grid-color:rgba(52,211,153,.06);
  --home-card-border:rgba(16,185,129,.36);
  --home-card-glow:rgba(52,211,153,.22);
  --home-btn-a:#0f766e;
  --home-btn-b:#059669;
  --home-btn-c:#65a30d;
}

body[data-home-theme="gift-boxes-1"]{
  --home-bg:#13091a;
  --home-aurora-a:rgba(236,72,153,.16);
  --home-aurora-b:rgba(168,85,247,.12);
  --home-login-grad-from:rgba(60,10,44,.9);
  --home-login-grad-via:rgba(80,20,60,.72);
  --home-login-grad-to:rgba(24,7,24,.95);
  --home-orb-1:#be185d;
  --home-orb-2:#db2777;
  --home-orb-3:#a855f7;
  --home-grid-color:rgba(244,114,182,.07);
  --home-card-border:rgba(236,72,153,.35);
  --home-card-glow:rgba(219,39,119,.23);
  --home-btn-a:#be185d;
  --home-btn-b:#db2777;
  --home-btn-c:#a855f7;
}

body[data-home-theme="mo-hop-qua-1"]{
  --home-bg:#111827;
  --home-aurora-a:rgba(245,158,11,.14);
  --home-aurora-b:rgba(234,179,8,.1);
  --home-login-grad-from:rgba(59,37,7,.9);
  --home-login-grad-via:rgba(88,56,17,.72);
  --home-login-grad-to:rgba(24,18,8,.95);
  --home-orb-1:#d97706;
  --home-orb-2:#f59e0b;
  --home-orb-3:#fbbf24;
  --home-grid-color:rgba(251,191,36,.07);
  --home-card-border:rgba(245,158,11,.35);
  --home-card-glow:rgba(245,158,11,.23);
  --home-btn-a:#b45309;
  --home-btn-b:#d97706;
  --home-btn-c:#f59e0b;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{
  width:100%;
  height:100%;
  overflow:hidden;
  font-family:'Inter',ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"cv11" 1,"ss01" 1;
  letter-spacing:.01em;
  background:var(--home-bg, var(--bg));
  color:#f0f0ff;
}

/* Canvas always behind, never blocks */
#bgCanvas{position:fixed;inset:0;z-index:0;pointer-events:none;}
.aurora{position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 80% 50% at 20% 80%,var(--home-aurora-a) 0%,transparent 60%),
             radial-gradient(ellipse 60% 40% at 80% 20%,var(--home-aurora-b) 0%,transparent 60%);
  animation:auroraShift 10s ease-in-out infinite alternate;}
@keyframes auroraShift{0%{filter:hue-rotate(0deg);}100%{filter:hue-rotate(20deg) brightness(1.1);}}

/* Homepage performance mode: static background and no decorative animations */
body.lmb-home-static #bgCanvas{display:none !important;}
body.lmb-home-static .aurora{animation:none !important;filter:none !important;opacity:.2;}
body.lmb-home-static .nhp-orb,
body.lmb-home-static .nhp-blob,
body.lmb-home-static .nhp-star,
body.lmb-home-static .nhp-shape,
body.lmb-home-static .nhp-card-wrapper,
body.lmb-home-static .nhp-card-shimmer,
body.lmb-home-static .nhp-gift-icon-glow,
body.lmb-home-static .nhp-sparkle-badge,
body.lmb-home-static .nhp-ping-dot::before,
body.lmb-home-static .nhp-tagline-dot,
body.lmb-home-static .floating-gifts-row,
body.lmb-home-static .fg-item{
  animation:none !important;
  transition:none !important;
  transform:none !important;
}
body.lmb-home-static .nhp-card:hover,
body.lmb-home-static .nhp-gift-icon-box:hover,
body.lmb-home-static .nhp-reward-card:hover,
body.lmb-home-static .nhp-card-btn:hover{
  transform:none !important;
  box-shadow:inherit !important;
  background-position:0 0 !important;
}

.home-static-gift-grid{
  position:absolute;
  inset:0;
  z-index:9;
  pointer-events:none;
}

.home-static-gift{
  position:absolute;
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  font-size:16px;
  color:#f5f3ff;
  border:1px solid rgba(167,139,250,.22);
  background:linear-gradient(145deg, rgba(76,29,149,.26), rgba(30,64,175,.18));
  box-shadow:0 4px 12px rgba(10,10,30,.2);
  opacity:.62;
}

@media (max-width: 680px){
  .home-static-gift{width:24px;height:24px;font-size:12px;opacity:.54;}
}

/* ── SCREENS: only active one exists in layout ── */
#screen-login{
  display:flex; /* shown by default */
  position:fixed;inset:0;align-items:center;justify-content:center;z-index:10;
}

/* Simplified homepage skin based on new_homepage.html (static background) */
#screen-login .overlay-gradient{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background-image:linear-gradient(to top right, rgba(30,27,75,.68), rgba(46,16,101,.42), rgba(2,6,23,.82));
}

#screen-login .orb-static{
  position:absolute;
  border-radius:50%;
  filter:blur(90px);
  opacity:.18;
  pointer-events:none;
  z-index:3;
}

#screen-login .orb-static-1{
  width:420px;
  height:420px;
  top:-120px;
  left:-80px;
  background:radial-gradient(circle,#6d28d9,transparent 70%);
}

#screen-login .orb-static-2{
  width:340px;
  height:340px;
  bottom:-80px;
  right:20px;
  background:radial-gradient(circle,#4f46e5,transparent 70%);
}

#screen-login .card-wrapper{
  position:relative;
  z-index:15;
  width:100%;
  max-width:32rem;
  padding:0 12px;
}

#screen-login .card{
  background:linear-gradient(135deg, rgba(15,10,40,.96) 0%, rgba(46,16,101,.9) 50%, rgba(20,18,40,.96) 100%);
  border:1px solid rgba(139,92,246,.3);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 18px 40px rgba(2,6,23,.45), 0 0 36px rgba(167,139,250,.15);
}

#screen-login .card-header{
  text-align:center;
  padding:28px 24px 20px;
  background:linear-gradient(135deg, rgba(30,10,70,.82) 0%, rgba(55,20,110,.7) 50%, rgba(10,8,30,.88) 100%);
}

#screen-login .gift-icon-wrap{display:flex;justify-content:center;margin-bottom:16px;}

#screen-login .gift-icon-box{
  width:68px;
  height:68px;
  border-radius:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:34px;
  background:linear-gradient(135deg,#7c3aed,#6d28d9,#4338ca);
  color:#fff;
  box-shadow:0 10px 24px rgba(109,40,217,.4);
}

#screen-login .card-title{
  font-size:clamp(1.5rem, 4vw, 2.1rem);
  font-weight:800;
  margin-bottom:8px;
  background:linear-gradient(135deg, #e2d9f3 0%, #a78bfa 40%, #c4b5fd 70%, #818cf8 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

#screen-login .card-subtitle{font-size:14px;color:rgba(196,181,253,.8);line-height:1.55;}

#screen-login .card-body{padding:22px 22px 20px;}
#screen-login .input-label{display:block;margin-bottom:8px;font-size:13px;font-weight:600;color:rgba(196,181,253,.92);}

#screen-login .input-group{position:relative;margin-bottom:14px;}

#screen-login .card-input{
  width:100%;
  height:52px;
  border-radius:10px;
  border:1px solid rgba(139,92,246,.45);
  outline:none;
  padding:0 14px;
  font-size:18px;
  font-weight:700;
  letter-spacing:.08em;
  text-align:center;
  color:#5b21b6;
  background:linear-gradient(135deg,#fff,#f7f2ff);
}

#screen-login .card-input::placeholder{color:rgba(139,92,246,.5);font-weight:500;font-size:14px;letter-spacing:.02em;}

#screen-login .card-btn{
  width:100%;
  height:48px;
  border-radius:10px;
  border:1px solid rgba(167,139,250,.3);
  color:#fff;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  background:linear-gradient(135deg,#7c3aed,#6d28d9,#4f46e5);
  box-shadow:0 10px 24px rgba(109,40,217,.35);
}

#screen-login .card-btn:disabled{opacity:.5;cursor:not-allowed;}

#screen-login .card-divider{border:none;border-top:1px solid rgba(139,92,246,.24);margin:16px 0;}

#screen-login .hint-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:999px;
  border:1px solid rgba(139,92,246,.24);
  padding:8px 14px;
  color:rgba(221,214,254,.88);
  background:linear-gradient(135deg, rgba(60,20,100,.6), rgba(80,30,130,.56));
}

#screen-login .reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;}

#screen-login .reward-card{padding:12px 6px;border-radius:11px;text-align:center;border:1px solid;}
#screen-login .reward-card .r-icon{display:block;font-size:22px;margin-bottom:4px;}
#screen-login .reward-card .r-label{font-size:11px;font-weight:700;letter-spacing:.04em;}

#screen-login .reward-vip{background:linear-gradient(135deg,rgba(234,179,8,.18),rgba(217,119,6,.18));border-color:rgba(250,204,21,.3);}
#screen-login .reward-vip .r-label{color:#fde68a;}
#screen-login .reward-lucky{background:linear-gradient(135deg,rgba(59,130,246,.18),rgba(6,182,212,.18));border-color:rgba(96,165,250,.3);}
#screen-login .reward-lucky .r-label{color:#bfdbfe;}
#screen-login .reward-try{background:linear-gradient(135deg,rgba(100,116,139,.18),rgba(71,85,105,.18));border-color:rgba(148,163,184,.25);}
#screen-login .reward-try .r-label{color:#e2e8f0;}

#screen-login .tagline-wrap{text-align:center;margin-top:14px;}
#screen-login .tagline-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;border:1px solid rgba(139,92,246,.25);background:linear-gradient(135deg,rgba(55,20,100,.7),rgba(75,30,130,.7));color:rgba(221,214,254,.88);}
#screen-login .tagline-dot{width:8px;height:8px;border-radius:50%;background:#a78bfa;box-shadow:0 0 8px rgba(167,139,250,.6);}

@media (max-width: 680px){
  #screen-login .card-wrapper{max-width:100%;padding:0 10px;}
  #screen-login .card-header{padding:22px 16px 16px;}
  #screen-login .card-body{padding:16px 14px 14px;}
  #screen-login .gift-icon-box{width:56px;height:56px;font-size:28px;border-radius:14px;}
  #screen-login .card-input{height:48px;font-size:16px;}
  #screen-login .card-btn{height:44px;font-size:15px;}
}
#screen-game{
  display:none; /* hidden by default */
  position:fixed;inset:0;z-index:10;overflow:hidden;
}

.game-theme-bg{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:#060714;
}

.game-theme-bg-frame{
  width:100%;
  height:100%;
  border:0;
  display:block;
  pointer-events:none;
}

/* NEW HOMEPAGE LOGIN */
#screen-login{
  align-items:stretch;
  justify-content:stretch;
  overflow:hidden;
}

.nhp-login-shell{
  position:absolute;
  inset:0;
  pointer-events:none;
  overflow:hidden;
}

.nhp-overlay-gradient{
  position:absolute;
  inset:0;
  background-image:linear-gradient(to top right, var(--home-login-grad-from), var(--home-login-grad-via), var(--home-login-grad-to));
}

.nhp-orb{
  position:absolute;
  border-radius:50%;
  filter:blur(90px);
  opacity:.28;
  animation:nhpOrbDrift var(--dur) ease-in-out infinite alternate;
  animation-delay:var(--delay, 0s);
}

.nhp-orb-1{
  width:520px;
  height:520px;
  background:radial-gradient(circle, var(--home-orb-1), transparent 70%);
  top:-140px;
  left:-100px;
  --dur:14s;
}

.nhp-orb-2{
  width:400px;
  height:400px;
  background:radial-gradient(circle, var(--home-orb-2), transparent 70%);
  bottom:-80px;
  right:40px;
  --dur:18s;
  --delay:-6s;
}

.nhp-orb-3{
  width:260px;
  height:260px;
  background:radial-gradient(circle, var(--home-orb-3), transparent 70%);
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  --dur:10s;
  --delay:-3s;
}

.nhp-blobs,
.nhp-stars,
.nhp-shapes,
.nhp-grid-lines,
.nhp-noise{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.nhp-grid-lines{
  background-image:
    linear-gradient(var(--home-grid-color) 1px, transparent 1px),
    linear-gradient(90deg, var(--home-grid-color) 1px, transparent 1px);
  background-size:56px 56px;
}

.nhp-noise{
  opacity:.14;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

.nhp-blob{
  position:absolute;
  border-radius:50%;
  animation:nhpBlobFloat var(--bd) ease-in-out infinite alternate;
  animation-delay:var(--bdelay, 0s);
}

.nhp-star{
  position:absolute;
  border-radius:50%;
  background:#fff;
  animation:nhpTwinkle var(--d) ease-in-out infinite alternate;
  animation-delay:var(--sd, 0s);
  opacity:var(--o);
}

.nhp-shape{
  position:absolute;
  animation:nhpShapeFloat var(--sf-dur) ease-in-out infinite alternate;
  animation-delay:var(--s-delay, 0s);
  opacity:var(--s-op, .6);
  filter:drop-shadow(0 0 6px var(--s-color, rgba(167,139,250,.6)));
}

.nhp-card-wrapper{
  position:relative;
  z-index:12;
  width:min(100%, 34rem);
  margin:auto;
  padding:20px 16px;
  font-family:Inter, sans-serif;
  animation:nhpScaleInSmooth 1s ease-out both;
}

.nhp-card{
  background:linear-gradient(135deg, var(--home-card-bg-a) 0%, var(--home-card-bg-b) 50%, var(--home-card-bg-c) 100%);
  border:2px solid var(--home-card-border);
  border-radius:24px;
  overflow:hidden;
  box-shadow:
    0 25px 50px -12px rgba(0,0,0,.48),
    0 0 60px var(--home-card-glow),
    inset 0 1px 0 rgba(255,255,255,.08);
  transition:transform .38s cubic-bezier(.34,1.56,.64,1), box-shadow .38s cubic-bezier(.4,0,.2,1);
  will-change:transform,box-shadow;
}

.nhp-card:hover{
  transform:scale(1.016) translateY(-3px);
  box-shadow:
    0 35px 65px -12px rgba(0,0,0,.6),
    0 0 80px var(--home-card-glow),
    inset 0 1px 0 rgba(255,255,255,.1);
}

.nhp-card-shimmer{
  height:2px;
  background:linear-gradient(90deg, transparent, var(--home-shimmer-a), var(--home-shimmer-b), var(--home-shimmer-a), transparent);
  background-size:200% 100%;
  animation:nhpShimmerSlide 3s linear infinite;
}

.nhp-card-header{
  position:relative;
  text-align:center;
  padding:32px 28px 28px;
  background:linear-gradient(135deg, var(--home-card-header-a) 0%, var(--home-card-header-b) 50%, var(--home-card-header-c) 100%);
}

.nhp-card-header::after{
  content:"";
  position:absolute;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:60%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(167,139,250,.4), transparent);
}

.nhp-deco-blob{
  position:absolute;
  border-radius:50%;
  pointer-events:none;
  animation:nhpPulseSlow 3s ease-in-out infinite alternate;
}

.nhp-deco-blob-1{
  width:36px;
  height:36px;
  top:12px;
  left:16px;
  background:radial-gradient(circle, rgba(167,139,250,.25), transparent 70%);
  filter:blur(6px);
}

.nhp-deco-blob-2{
  width:20px;
  height:20px;
  top:24px;
  right:24px;
  background:radial-gradient(circle, rgba(96,165,250,.3), transparent 70%);
  filter:blur(4px);
  animation-delay:.5s;
}

.nhp-gift-icon-wrap{
  display:inline-flex;
  justify-content:center;
  margin-bottom:24px;
  position:relative;
}

.nhp-gift-icon-glow{
  position:absolute;
  inset:-16px;
  border-radius:50%;
  filter:blur(12px);
  background:radial-gradient(circle, rgba(139,92,246,.5) 0%, rgba(99,102,241,.3) 40%, transparent 70%);
  animation:nhpGlowPulse 2.5s ease-in-out infinite alternate;
}

.nhp-gift-icon-box{
  position:relative;
  z-index:2;
  border-radius:18px;
  padding:18px;
  color:#fff;
  background:linear-gradient(135deg, var(--home-icon-a), var(--home-icon-b), var(--home-icon-c));
  box-shadow:0 12px 30px rgba(109,40,217,.5), inset 0 1px 0 rgba(255,255,255,.2);
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), box-shadow .4s;
}

.nhp-gift-icon-box:hover{
  transform:scale(1.1) rotateY(8deg);
  box-shadow:0 20px 45px rgba(109,40,217,.7), inset 0 1px 0 rgba(255,255,255,.25);
}

.nhp-gift-icon-box svg{
  width:60px;
  height:60px;
  display:block;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.5));
}

.nhp-sparkle-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  z-index:3;
  width:24px;
  height:24px;
  animation:nhpSpinSlow 6s linear infinite;
}

.nhp-ping-dot{
  position:absolute;
  bottom:-4px;
  left:-4px;
  z-index:3;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#a78bfa;
}

.nhp-ping-dot::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:#a78bfa;
  animation:nhpPing 1.5s cubic-bezier(0,0,.2,1) infinite;
}

.nhp-card-title{
  margin-bottom:10px;
  font-size:clamp(1.6rem, 4vw, 2.2rem);
  font-weight:800;
  letter-spacing:-.025em;
  background:linear-gradient(135deg, #e2d9f3 0%, #a78bfa 40%, #c4b5fd 70%, #818cf8 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  filter:drop-shadow(0 2px 12px rgba(139,92,246,.4));
}

.nhp-card-subtitle{
  padding:0 16px;
  color:rgba(196,181,253,.75);
  font-size:14px;
  line-height:1.6;
  font-weight:500;
}

.nhp-card-body{
  padding:28px 28px 24px;
  background:linear-gradient(135deg, rgba(20,15,45,.55) 0%, rgba(46,16,101,.3) 50%, rgba(15,10,35,.55) 100%);
}

.nhp-input-label{
  display:block;
  margin-bottom:10px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.02em;
  color:rgba(196,181,253,.9);
}

.nhp-input-group{
  position:relative;
  margin-bottom:18px;
}

.nhp-input-glow{
  position:absolute;
  inset:0;
  border-radius:10px;
  opacity:0;
  pointer-events:none;
  filter:blur(4px);
  background:linear-gradient(90deg, rgba(139,92,246,.2), rgba(99,102,241,.25), rgba(139,92,246,.2));
  transition:opacity .3s;
}

.nhp-input-group:focus-within .nhp-input-glow{
  opacity:1;
}

.nhp-card-input{
  position:relative;
  z-index:1;
  width:100%;
  height:58px;
  border-radius:10px;
  border:2px solid rgba(139,92,246,.45);
  outline:none;
  padding:0 16px;
  font-size:22px;
  font-weight:800;
  letter-spacing:.25em;
  text-align:center;
  color:#5b21b6;
  font-family:'Courier New', monospace;
  background:linear-gradient(135deg, #fff, #f8f5ff);
  transition:border-color .3s, box-shadow .3s, background .3s;
}

.nhp-card-input::placeholder{
  color:rgba(139,92,246,.45);
  font-size:14px;
  font-weight:400;
  letter-spacing:.05em;
}

.nhp-card-input:focus{
  border-color:#7c3aed;
  background:linear-gradient(135deg, #fff, #f3f0ff);
  box-shadow:0 0 0 3px rgba(124,58,237,.2), 0 8px 24px rgba(109,40,217,.15);
}

.nhp-card-btn{
  position:relative;
  overflow:hidden;
  width:100%;
  height:50px;
  border-radius:10px;
  border:1px solid rgba(167,139,250,.3);
  color:#fff;
  font-size:16px;
  font-weight:700;
  font-family:Inter, sans-serif;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  background:linear-gradient(135deg, var(--home-btn-a), var(--home-btn-b), var(--home-btn-c));
  background-size:200% 100%;
  box-shadow:0 10px 28px rgba(109,40,217,.45);
  transition:all .3s cubic-bezier(.4,0,.2,1);
}

.homepage-theme-picker{
  position:absolute;
  top:14px;
  right:14px;
  z-index:16;
  width:min(330px, 92vw);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  padding:10px;
  background:rgba(5,10,24,.68);
  backdrop-filter:blur(12px);
  box-shadow:0 14px 30px rgba(2,6,23,.35);
}

.homepage-theme-stage{
  position:absolute;
  inset:0;
  z-index:11;
  overflow:hidden;
}

.homepage-preset-frame{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:transparent;
}

.homepage-stage-loading{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  color:#cbd5e1;
  background:radial-gradient(circle at 50% 40%, rgba(30,41,59,.55), rgba(2,6,23,.92));
}

.homepage-theme-label{
  display:block;
  margin-bottom:6px;
  font-size:11px;
  letter-spacing:.08em;
  font-weight:700;
  text-transform:uppercase;
  color:#cbd5e1;
}

.homepage-theme-select{
  width:100%;
  border-radius:10px;
  border:1px solid rgba(148,163,184,.45);
  background:rgba(2,6,23,.65);
  color:#e2e8f0;
  height:38px;
  padding:0 10px;
  font-size:13px;
  outline:none;
}

.homepage-theme-select:focus{
  border-color:rgba(99,102,241,.8);
  box-shadow:0 0 0 2px rgba(99,102,241,.22);
}

.homepage-theme-current{
  margin-top:7px;
  font-size:12px;
  color:#cbd5e1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.nhp-card-btn::before{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
  transition:transform .5s;
}

.nhp-card-btn:hover::before{
  transform:translateX(100%);
}

.nhp-card-btn:hover{
  transform:translateY(-2px) scale(1.01);
  box-shadow:0 16px 40px rgba(109,40,217,.65);
  background-position:100% 0;
}

.nhp-card-btn:active{
  transform:translateY(0) scale(.99);
}

.nhp-card-btn:disabled{
  opacity:.5;
  cursor:not-allowed;
  transform:none;
}

.nhp-btn-top-shine{
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
}

.nhp-card-divider{
  border:none;
  border-top:1px solid rgba(139,92,246,.25);
  margin:20px 0;
}

.nhp-hint-wrap{
  text-align:center;
  margin-bottom:16px;
}

.nhp-hint-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 18px;
  border-radius:999px;
  border:1px solid rgba(139,92,246,.3);
  background:linear-gradient(135deg, rgba(60,20,100,.65), rgba(80,30,130,.65));
  backdrop-filter:blur(8px);
}

.nhp-hint-pill span{
  font-size:13px;
  font-weight:500;
  color:rgba(221,214,254,.85);
}

.nhp-hint-bounce{
  animation:nhpBounceSm 1.5s ease-in-out infinite;
}

.nhp-reward-grid{
  display:grid;
  gap:10px;
  grid-template-columns:repeat(3, 1fr);
}

.nhp-reward-card{
  border:1px solid;
  border-radius:12px;
  text-align:center;
  padding:14px 8px;
  backdrop-filter:blur(6px);
  transition:transform .2s, box-shadow .2s;
}

.nhp-reward-card:hover{
  transform:translateY(-3px) scale(1.04);
}

.nhp-r-icon{
  display:block;
  font-size:26px;
  margin-bottom:6px;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.4));
}

.nhp-r-label{
  font-size:11px;
  font-weight:700;
  letter-spacing:.05em;
}

.nhp-reward-vip{
  background:linear-gradient(135deg, rgba(234,179,8,.18), rgba(217,119,6,.18));
  border-color:rgba(250,204,21,.35);
}

.nhp-reward-vip .nhp-r-label{
  color:#fde68a;
}

.nhp-reward-lucky{
  background:linear-gradient(135deg, rgba(59,130,246,.18), rgba(6,182,212,.18));
  border-color:rgba(96,165,250,.35);
}

.nhp-reward-lucky .nhp-r-label{
  color:#bfdbfe;
}

.nhp-reward-try{
  background:linear-gradient(135deg, rgba(100,116,139,.18), rgba(71,85,105,.18));
  border-color:rgba(148,163,184,.3);
}

.nhp-reward-try .nhp-r-label{
  color:#e2e8f0;
}

.nhp-tagline-wrap{
  text-align:center;
  margin-top:20px;
  animation:nhpFadeIn .8s .5s ease-out both;
}

.nhp-tagline-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 20px;
  border-radius:999px;
  border:1px solid rgba(139,92,246,.3);
  background:linear-gradient(135deg, rgba(55,20,100,.75), rgba(75,30,130,.75));
  backdrop-filter:blur(12px);
  box-shadow:0 8px 24px rgba(109,40,217,.3);
}

.nhp-tagline-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#a78bfa;
  box-shadow:0 0 8px rgba(167,139,250,.7);
  animation:nhpPulseSlow 2s ease-in-out infinite alternate;
}

.nhp-tagline-pill span{
  font-size:13px;
  font-weight:500;
  color:rgba(221,214,254,.85);
}

@keyframes nhpScaleInSmooth{
  from{opacity:0;transform:scale(.88) translateY(28px);}
  to{opacity:1;transform:scale(1) translateY(0);}
}

@keyframes nhpFadeIn{
  from{opacity:0;}
  to{opacity:1;}
}

@keyframes nhpShimmerSlide{
  0%{background-position:-200% 0;}
  100%{background-position:200% 0;}
}

@keyframes nhpGlowPulse{
  from{opacity:.5;transform:scale(.9);}
  to{opacity:1;transform:scale(1.15);}
}

@keyframes nhpSpinSlow{
  to{transform:rotate(360deg);}
}

@keyframes nhpPing{
  75%,100%{transform:scale(2.2);opacity:0;}
}

@keyframes nhpPulseSlow{
  from{opacity:.5;transform:scale(1);}
  to{opacity:1;transform:scale(1.3);}
}

@keyframes nhpBounceSm{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-4px);}
}

@keyframes nhpOrbDrift{
  from{transform:translate(0,0) scale(1);}
  to{transform:translate(38px,26px) scale(1.1);}
}

@keyframes nhpBlobFloat{
  from{transform:translate(0,0);}
  to{transform:translate(var(--bx, 20px), var(--by, -30px));}
}

@keyframes nhpTwinkle{
  from{opacity:var(--o);transform:scale(1);}
  to{opacity:calc(var(--o) * .2);transform:scale(.5);}
}

@keyframes nhpShapeFloat{
  0%{transform:translateY(0) rotate(var(--r0, 0deg));}
  100%{transform:translateY(var(--float-y, -24px)) rotate(var(--r1, 15deg));}
}

/* ════ LOGIN ════ */
/* Floating gift emojis */
.floating-gifts-row{
  position:absolute;top:0;left:0;right:0;height:100%;
  pointer-events:none;z-index:1;overflow:hidden;
}
.fg-item{
  position:absolute;font-size:32px;opacity:.18;
  animation:fgFloat linear infinite;
  filter:drop-shadow(0 0 8px rgba(124,58,237,.3));
}
.fg-item:nth-child(1){left:5%;top:-40px;font-size:28px;animation-duration:12s;animation-delay:0s;}
.fg-item:nth-child(2){left:15%;top:-40px;font-size:36px;animation-duration:14s;animation-delay:1.5s;opacity:.14;}
.fg-item:nth-child(3){left:30%;top:-40px;font-size:24px;animation-duration:11s;animation-delay:3s;}
.fg-item:nth-child(4){left:48%;top:-40px;font-size:30px;animation-duration:13s;animation-delay:0.8s;opacity:.16;}
.fg-item:nth-child(5){left:62%;top:-40px;font-size:34px;animation-duration:15s;animation-delay:2.2s;}
.fg-item:nth-child(6){left:75%;top:-40px;font-size:26px;animation-duration:12s;animation-delay:4s;opacity:.14;}
.fg-item:nth-child(7){left:85%;top:-40px;font-size:32px;animation-duration:14s;animation-delay:1s;}
.fg-item:nth-child(8){left:92%;top:-40px;font-size:28px;animation-duration:11s;animation-delay:3.5s;opacity:.12;}
@keyframes fgFloat{
  0%{transform:translateY(-40px) rotate(0deg);opacity:0;}
  10%{opacity:.18;}
  90%{opacity:.18;}
  100%{transform:translateY(110vh) rotate(360deg);opacity:0;}
}

@media (max-width: 680px){
  .homepage-theme-picker{
    top:8px;
    right:8px;
    left:8px;
    width:auto;
    padding:8px;
  }

  .homepage-theme-label{
    font-size:10px;
  }

  .homepage-theme-select{
    height:34px;
    font-size:12px;
  }

  .homepage-theme-current{
    font-size:11px;
  }

  .nhp-card-wrapper{
    width:100%;
    padding:14px 12px;
  }

  .nhp-card-header{
    padding:24px 18px 20px;
  }

  .nhp-card-body{
    padding:18px 14px 16px;
  }

  .nhp-gift-icon-box{
    padding:14px;
    border-radius:14px;
  }

  .nhp-gift-icon-box svg{
    width:48px;
    height:48px;
  }

  .nhp-card-input{
    height:52px;
    font-size:20px;
  }

  .nhp-card-btn{
    height:46px;
    font-size:15px;
  }

  .nhp-reward-grid{
    gap:8px;
  }

  .nhp-reward-card{
    padding:10px 4px;
  }

  .nhp-r-icon{
    font-size:22px;
    margin-bottom:4px;
  }

  .nhp-tagline-wrap{
    margin-top:14px;
  }

  .home-floating-feed{
    bottom:8px;
    left:10px;
    width:min(340px, 92vw);
  }
}

.login-card{
  background:linear-gradient(160deg,rgba(18,12,42,.98),rgba(12,8,34,.97));
  border:1px solid rgba(124,58,237,.48);
  border-radius:24px;padding:40px 42px 34px;width:512px;min-height:705px;
  box-shadow:0 0 90px rgba(88,28,220,.32),0 24px 64px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 40px rgba(124,58,237,.06);
  position:relative;z-index:2;
  animation:cardIn .55s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes cardIn{from{transform:scale(.88) translateY(28px);opacity:0;}to{transform:none;opacity:1;}}

.li-icon{text-align:center;margin-bottom:20px;}
.li-icon-box{
  width:70px;height:70px;
  background:linear-gradient(135deg,#5b21b6,#7c3aed,#a855f7);
  border-radius:18px;display:inline-flex;align-items:center;justify-content:center;
  box-shadow:0 0 30px rgba(124,58,237,.55);position:relative;
  animation:iconPulse 3s ease-in-out infinite;
}
@keyframes iconPulse{0%,100%{box-shadow:0 0 30px rgba(124,58,237,.55);}50%{box-shadow:0 0 55px rgba(124,58,237,.85),0 0 100px rgba(124,58,237,.3);}}
.li-icon-box svg{width:36px;height:36px;}
.spark{position:absolute;top:-8px;right:-8px;font-size:20px;animation:sparkDance 1.8s ease-in-out infinite;pointer-events:none;}
@keyframes sparkDance{0%,100%{transform:scale(1) rotate(0);}25%{transform:scale(1.4) rotate(-15deg);}75%{transform:scale(.8) rotate(20deg);}}

.li-title{text-align:center;font-size:27px;font-weight:900;margin-bottom:5px;
  background:linear-gradient(135deg,#fff 20%,#c084fc 60%,#f0abfc);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;}
.li-sub{text-align:center;font-size:13px;color:#7070a0;margin-bottom:22px;}

.field-label{font-size:11px;font-weight:700;color:#7070a0;margin-bottom:6px;letter-spacing:.06em;text-transform:uppercase;}
.text-input{
  width:100%;background:rgba(240,238,255,.94);border:2px solid transparent;
  border-radius:10px;padding:13px 16px;font-size:15px;color:#1a1a2e;
  font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s;
}
.text-input::placeholder{color:#9090b0;font-style:italic;}
.text-input:focus{border-color:rgba(124,58,237,.5);box-shadow:0 0 0 3px rgba(124,58,237,.2);}

.btn-start{
  width:100%;margin-top:12px;
  background:linear-gradient(90deg,#4c1d95,#6d28d9,#7c3aed,#a855f7);
  background-size:200% 100%;animation:gradShift 3s linear infinite;
  border:none;border-radius:10px;padding:15px;
  color:#fff;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:0 4px 22px rgba(124,58,237,.45);
  transition:transform .22s cubic-bezier(.34,1.56,.64,1),filter .18s,box-shadow .22s ease;
  will-change:transform;
}
.btn-start:hover{filter:brightness(1.14);transform:translateY(-3px);box-shadow:0 8px 28px rgba(124,58,237,.6);}
.btn-start:active{transform:scale(0.95) translateY(0);filter:brightness(0.9);}
@keyframes gradShift{0%{background-position:0% 50%;}100%{background-position:200% 50%;}}

.info-bar{margin-top:9px;background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.22);border-radius:10px;padding:11px 16px;font-size:13px;color:#c4b5fd;text-align:center;}

.mode-row{display:flex;gap:9px;margin-top:9px;}
.mode-btn{flex:1;border:none;border-radius:10px;padding:12px 6px;cursor:pointer;font-family:inherit;font-weight:800;font-size:13px;display:flex;flex-direction:column;align-items:center;gap:4px;transition:transform .22s cubic-bezier(.34,1.56,.64,1),box-shadow .22s ease,filter .18s ease;will-change:transform;}
.mode-btn.vip{background:linear-gradient(135deg,#b45309,#f59e0b);color:#fff;box-shadow:0 3px 12px rgba(245,158,11,.35);}
.mode-btn.lucky{background:linear-gradient(135deg,#5b21b6,#a855f7);color:#fff;box-shadow:0 3px 12px rgba(124,58,237,.4);}
.mode-btn.tryagain{background:rgba(38,35,62,.9);color:#777;border:1px solid rgba(255,255,255,.07);}
.mode-btn:hover{transform:translateY(-3px) scale(1.04);}
.mode-btn:active{transform:scale(0.94);filter:brightness(0.88);}
.mode-btn svg{width:20px;height:20px;}
.mode-emoji{font-size:22px;line-height:1;}

.status-bar{margin-top:9px;background:rgba(124,58,237,.08);border:1px solid rgba(124,58,237,.18);border-radius:10px;padding:11px 16px;font-size:13px;color:#a78bfa;display:flex;align-items:center;gap:9px;}
.dot-green{width:8px;height:8px;border-radius:50%;background:#22c55e;flex-shrink:0;animation:pulseGreen 1.5s infinite;}
@keyframes pulseGreen{0%,100%{box-shadow:0 0 4px #22c55e;}50%{box-shadow:0 0 14px #22c55e,0 0 28px rgba(34,197,94,.25);}}

/* ════ GAME SCREEN LAYOUT ════ */
.g-nav{
  position:absolute;top:0;left:0;right:0;height:58px;
  background:rgba(7,5,22,.96);border-bottom:1px solid rgba(124,58,237,.22);
  display:flex;align-items:center;justify-content:space-between;padding:0 26px;
  backdrop-filter:blur(20px);z-index:5;
  box-shadow:0 2px 28px rgba(0,0,0,.55),0 0 0 1px rgba(124,58,237,.08) inset;
}
.nav-brand{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:15px;
  font-weight:800;
  background:#070516;
  border:1px solid rgba(124,58,237,.28);
  border-radius:12px;
  padding:6px 10px;
}
.nav-icon-box{width:32px;height:32px;background:var(--lmb-nav-icon-bg,linear-gradient(135deg,#5b21b6,#7c3aed));border-radius:8px;display:flex;align-items:center;justify-content:center;}
.nav-icon-box svg{width:17px;height:17px;}
.nav-icon-box img{width:100%;height:100%;object-fit:cover;border-radius:8px;display:block;}
.nav-brand-name{display:inline-block;white-space:nowrap;line-height:1;color:#f3f1ff;}
.nav-sess{background:rgba(18,14,46,.92);border:1px solid rgba(124,58,237,.38);border-radius:10px;padding:7px 16px;font-size:14px;font-weight:800;display:flex;align-items:center;gap:8px;box-shadow:0 2px 12px rgba(0,0,0,.35);}
.dot-active{width:7px;height:7px;border-radius:50%;background:#22c55e;animation:pulseGreen 1.5s infinite;}
.nav-curr-badge{font-size:11px;font-weight:800;padding:2px 8px;border-radius:6px;line-height:1.3;}
.nav-curr-badge.cur-usd{background:rgba(34,197,94,.18);color:#22c55e;border:1px solid rgba(34,197,94,.35);}
.nav-curr-badge.cur-ndt{background:rgba(239,68,68,.18);color:#ef4444;border:1px solid rgba(239,68,68,.35);}
.nav-home-btn{display:flex;align-items:center;gap:7px;background:rgba(20,16,44,.85);border:1px solid rgba(124,58,237,.35);color:#c4b5fd;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer;line-height:1;flex-shrink:0;}
.nav-home-btn svg{width:14px;height:14px;}
.nav-home-btn:hover{background:rgba(42,24,88,.95);}
#gNavRightGroup{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0;min-width:0;}

.win-ticker{position:absolute;top:58px;left:0;right:0;height:34px;overflow:hidden;z-index:4;border-bottom:1px solid rgba(124,58,237,.1);background:linear-gradient(90deg,rgba(13,10,34,.9),rgba(22,14,52,.85),rgba(13,10,34,.9));}
.win-ticker-track{position:absolute;left:0;top:0;white-space:nowrap;display:inline-flex;align-items:center;gap:26px;height:100%;padding-left:16px;animation:tickerMove 46s linear infinite;}
.win-ticker-item{display:inline-flex;align-items:center;gap:6px;color:#d6ccff;font-size:12px;font-weight:600;opacity:.95;}
.win-ticker-item b{color:#fbbf24;}

/* Home floating notifications (left corner) */
.home-floating-feed{
  position:fixed;
  left:14px;
  bottom:18px;
  width:min(360px,88vw);
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:14;
  pointer-events:none;
}

.home-feed-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
  background:rgba(255,255,255,.96);
  border:1px solid #dbe4ef;
  border-radius:14px;
  padding:10px 12px;
  box-shadow:0 10px 26px rgba(2,6,23,.18);
  color:#0f172a;
  opacity:0;
  transform:translateX(-118%);
  animation:homeFeedSlide 5.8s cubic-bezier(.2,.8,.2,1) forwards;
}

.home-feed-icon{
  width:34px;
  height:34px;
  border-radius:50%;
  background:#e2e8f0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  overflow:hidden;
  border:1px solid #cbd5e1;
  box-shadow:0 3px 8px rgba(15,23,42,.15);
}

.home-feed-thumb{width:100%;height:100%;object-fit:cover;display:block;}
.home-feed-glyph{font-size:18px;line-height:1;filter:drop-shadow(0 1px 2px rgba(15,23,42,.18));}

.home-feed-body{min-width:0;display:flex;flex-direction:column;gap:2px;}
.home-feed-title{font-size:13px;font-weight:800;color:#0f172a;line-height:1.25;}
.home-feed-sub{font-size:12px;color:#334155;line-height:1.35;word-break:break-word;}
.home-feed-time{font-size:11px;color:#64748b;font-weight:700;}

@keyframes homeFeedSlide{
  0%{opacity:0;transform:translateX(-118%);} 
  12%{opacity:1;transform:translateX(0);} 
  70%{opacity:1;transform:translateX(0);} 
  84%{opacity:1;transform:translateX(-10px);} 
  100%{opacity:0;transform:translateX(-118%);} 
}

.game-floating-feed{
  position:fixed;
  left:14px;
  bottom:max(10px, env(safe-area-inset-bottom));
  width:min(360px,40vw);
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:19;
  pointer-events:none;
}

.game-floating-feed .home-feed-item{
  animation-duration:6.1s;
}

@keyframes tickerMove{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

.boxes-wrap{
  position:absolute;top:66px;left:0;right:0;bottom:126px;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  padding-top:24px;
}

.game-hero{
  width:min(920px,94vw);
  text-align:center;
  margin:0 auto 16px;
  pointer-events:none;
}

.game-hero-logo{
  width:154px;
  height:154px;
  margin:0 auto 12px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.66);
  background:linear-gradient(165deg,rgba(255,255,255,.98),rgba(255,255,255,.82));
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 16px 36px rgba(12,10,30,.36),0 0 0 1px rgba(255,255,255,.62) inset,0 0 26px rgba(255,255,255,.2);
  backdrop-filter:blur(4px);
}

.game-hero-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 5px 12px rgba(0,0,0,.18)) contrast(1.04);
}

.game-hero-title{
  margin:0;
  display:block;
  font-size:clamp(34px,4vw,60px);
  line-height:1.28;
  padding-top:0.12em;
  font-weight:900;
  color:#f8fafc;
  letter-spacing:.02em;
  text-shadow:0 8px 24px rgba(10,10,26,.55),0 0 24px rgba(196,181,253,.3);
  background:linear-gradient(180deg,#ffffff 0%,#f2e8ff 48%,#d8b4fe 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.game-hero-subtitle{
  margin:12px auto 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  max-width:min(1100px,95vw);
  padding:0;
  font-size:clamp(16px,1.65vw,26px);
  line-height:1.22;
  font-weight:650;
  color:#e2ecff;
  letter-spacing:.01em;
  text-shadow:0 3px 14px rgba(15,23,42,.44),0 0 16px rgba(147,197,253,.18);
  position:relative;
}

.game-hero-subtitle.typing-active::after{
  content:'';
  width:2px;
  height:1.15em;
  margin-left:7px;
  background:#bfdbfe;
  box-shadow:0 0 10px rgba(191,219,254,.65);
  animation:heroTypingCursor .85s step-end infinite;
}

.game-hero-subtitle.typing-done::after{
  animation:none;
  opacity:.45;
}

@keyframes heroTypingCursor{
  0%,48%{opacity:1;}
  50%,100%{opacity:0;}
}

.boxes-row{
  display:flex;
  gap:34px;
  align-items:center;
  justify-content:center;
  width:min(1180px,92vw);
}

.box-wrap{
  position:relative;
  cursor:pointer;
  flex:1 1 0;
  display:flex;
  justify-content:center;
}

.gcard{
  width:clamp(220px,24vw,320px);
  height:clamp(250px,34vh,340px);
  background:linear-gradient(160deg,rgba(10,42,33,.94) 0%,rgba(8,30,26,.93) 100%);border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;
  position:relative;overflow:hidden;transition:transform .24s cubic-bezier(.25,.8,.25,1),box-shadow .24s;
  box-shadow:0 8px 32px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.09);
}
.gcard::before{content:'';position:absolute;inset:0;border-radius:18px;background:linear-gradient(135deg,rgba(34,197,94,.10) 0%,transparent 55%);pointer-events:none;}
.gcard.ga{border-color:rgba(34,197,94,.72);background:linear-gradient(162deg,rgba(8,56,34,.97),rgba(7,38,29,.96));animation:gaP 2.5s ease-in-out infinite;cursor:pointer;}
.gcard.ga::before{background:linear-gradient(135deg,rgba(34,197,94,.16),rgba(16,185,129,.06) 55%,transparent);}
.gcard.ga:hover{transform:translateY(-9px) scale(1.04);filter:brightness(1.07);}
@keyframes gaP{
  0%,100%{box-shadow:0 0 0 1px rgba(34,197,94,.34),0 8px 30px rgba(0,0,0,.6),0 0 34px rgba(34,197,94,.54),0 0 88px rgba(34,197,94,.22),inset 0 0 30px rgba(34,197,94,.09);}
  50%{box-shadow:0 0 0 1px rgba(16,185,129,.58),0 10px 38px rgba(0,0,0,.65),0 0 58px rgba(34,197,94,.78),0 0 130px rgba(16,185,129,.34),inset 0 0 44px rgba(16,185,129,.16);}
}
.gcard.gi{opacity:.4;filter:saturate(.2);cursor:default;}
.gcard.gbad{border-color:rgba(50,65,140,.22);background:rgba(10,12,28,.92);animation:none;cursor:default;}
.gcard.gwin{border-color:rgba(245,158,11,.55);background:rgba(38,26,8,.95);animation:gwP 2s ease-in-out infinite;cursor:default;}
.gcard.gbad.gbad-unlucky{border-color:rgba(59,130,246,.55);background:linear-gradient(162deg,rgba(14,22,46,.97),rgba(10,16,36,.95));box-shadow:0 0 42px rgba(59,130,246,.32),inset 0 0 0 1px rgba(147,197,253,.26),0 8px 24px rgba(0,0,0,.55);}
.gcard.gwin.gwin-normal{border-color:rgba(245,158,11,.74);background:linear-gradient(162deg,rgba(52,30,8,.98),rgba(38,22,6,.96));box-shadow:0 0 45px rgba(245,158,11,.42),0 0 90px rgba(245,158,11,.18),inset 0 0 0 1px rgba(253,224,71,.26),0 10px 32px rgba(0,0,0,.58);}
.gcard.gwin.gwin-vip{border-color:rgba(34,197,94,.9);background:linear-gradient(162deg,rgba(8,56,34,.99),rgba(9,46,31,.98),rgba(7,36,25,.97));box-shadow:0 0 65px rgba(34,197,94,.45),0 0 115px rgba(16,185,129,.24),inset 0 0 0 1px rgba(134,239,172,.34),inset 0 0 48px rgba(34,197,94,.12),0 14px 42px rgba(0,0,0,.68);}
.gcard.gwin.gwin-unlucky{border-color:rgba(59,130,246,.48);background:rgba(20,26,52,.95);box-shadow:0 0 36px rgba(59,130,246,.25);}
@keyframes gwP{0%,100%{box-shadow:0 0 35px rgba(245,158,11,.35),0 0 70px rgba(245,158,11,.12);}50%{box-shadow:0 0 55px rgba(245,158,11,.6),0 0 110px rgba(245,158,11,.25);}}


.gi-wrap{position:relative;display:flex;align-items:center;justify-content:center;}
.gi-wrap svg{width:84px;height:84px;}
.ga .gi-wrap svg{filter:drop-shadow(0 0 12px rgba(74,222,128,.65));}
.gwin .gi-wrap svg{filter:drop-shadow(0 0 12px rgba(245,158,11,.75));}
.gsp{position:absolute;font-size:15px;animation:sparkDance 1.6s ease-in-out infinite;pointer-events:none;}
.gsp.s1{top:-9px;right:-5px;}
.gsp.s2{bottom:-5px;left:3px;font-size:10px;animation-delay:.4s;}
.gsp.s3{top:1px;left:-9px;font-size:9px;animation-delay:.8s;}

.gname{font-size:18px;font-weight:700;text-align:center;}
.ga .gname{color:#c4b5fd;} .gi .gname{color:#2a2a48;} .gbad .gname{color:#484870;} .gwin .gname{color:#fbbf24;}
.ghint{font-size:11px;color:#6a5f90;text-align:center;animation:hP 1.8s ease-in-out infinite;}
@keyframes hP{0%,100%{opacity:.45;}50%{opacity:1;}}

.cp{position:absolute;border-radius:50%;pointer-events:none;animation:cpD var(--pd,4s) var(--delay,0s) ease-in-out infinite alternate;}
@keyframes cpD{from{transform:translate(0,0);opacity:var(--op,.25);}to{transform:translate(var(--dx,5px),var(--dy,-7px));opacity:var(--op2,.6);}}

.rplab{font-size:13px;text-align:center;font-weight:800;}

.open-shell{
  position:absolute;
  inset:10px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.14);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  z-index:2;
  background:linear-gradient(165deg,rgba(17,20,38,.66),rgba(11,14,28,.72));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),inset 0 -20px 40px rgba(0,0,0,.28);
}

.open-ambient{
  position:absolute;
  inset:-12% -8% auto -8%;
  height:60%;
  background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.18),transparent 58%),radial-gradient(circle at 30% 50%,rgba(168,85,247,.24),transparent 55%),radial-gradient(circle at 70% 70%,rgba(245,158,11,.2),transparent 52%);
  pointer-events:none;
}

.open-media-wrap{
  position:relative;
  height:56%;
  min-height:132px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px 14px 10px;
}

.open-prize-frame{
  width:118px;
  height:118px;
  border-radius:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,.05));
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 16px 34px rgba(0,0,0,.45),0 0 42px rgba(251,191,36,.22),inset 0 1px 0 rgba(255,255,255,.24);
  transform:translateZ(0);
}

.open-prize-frame-unlucky{
  background:linear-gradient(160deg,rgba(59,130,246,.24),rgba(37,99,235,.08));
  box-shadow:0 14px 30px rgba(0,0,0,.4),0 0 34px rgba(96,165,250,.24),inset 0 1px 0 rgba(191,219,254,.24);
  border-color:rgba(147,197,253,.42);
}

.open-prize-img{
  width:102px;
  height:102px;
  object-fit:cover;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 10px 24px rgba(0,0,0,.34);
}

.open-prize-frame > img + span,
.open-prize-frame > span{
  font-size:78px;
  line-height:1;
  filter:drop-shadow(0 0 18px rgba(251,191,36,.4));
}

.open-unlucky-icon{font-size:68px;filter:drop-shadow(0 0 18px rgba(147,197,253,.46));}

.open-info{
  position:relative;
  z-index:2;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:6px 12px 12px;
  background:linear-gradient(180deg,transparent 0%,rgba(2,6,23,.18) 35%,rgba(2,6,23,.45) 100%);
}

.open-prize-name{
  text-align:center;
  font-size:17px;
  font-weight:900;
  color:#f8fafc;
  line-height:1.24;
  text-shadow:0 3px 12px rgba(0,0,0,.42);
}

.open-prize-value{
  font-size:24px;
  font-weight:900;
  color:#fbbf24;
  text-shadow:0 0 16px rgba(245,158,11,.4);
}

.open-prize-tier{
  margin-top:2px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.55px;
  text-transform:uppercase;
  color:#fde68a;
  background:linear-gradient(90deg,rgba(217,119,6,.34),rgba(245,158,11,.34));
  border:1px solid rgba(253,186,116,.58);
  border-radius:999px;
  padding:5px 12px;
  box-shadow:0 2px 10px rgba(245,158,11,.2);
}

.open-unlucky-title{
  text-align:center;
  font-size:16px;
  font-weight:900;
  color:#dbeafe;
  text-shadow:0 0 12px rgba(59,130,246,.3);
}

.open-unlucky-sub{
  text-align:center;
  font-size:11px;
  line-height:1.45;
  color:#93c5fd;
  max-width:190px;
}

.open-shell-unlucky .open-ambient{
  background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.14),transparent 58%),radial-gradient(circle at 30% 50%,rgba(59,130,246,.28),transparent 55%),radial-gradient(circle at 70% 70%,rgba(37,99,235,.22),transparent 52%);
}

.gcard.gwin.gwin-vip .open-prize-tier{
  color:#dcfce7;
  background:linear-gradient(90deg,rgba(34,197,94,.32),rgba(16,185,129,.32));
  border-color:rgba(134,239,172,.52);
}

.gcard.gbad .open-prize-tier,
.gcard.gwin.gwin-unlucky .open-prize-tier{
  color:#bfdbfe;
  background:linear-gradient(90deg,rgba(59,130,246,.26),rgba(37,99,235,.26));
  border-color:rgba(147,197,253,.48);
}

.gcard.gwin .rplab{position:relative;z-index:3;font-size:12px;margin-top:2px;}

@media (max-width: 1280px){
  .boxes-row{gap:24px;width:min(1040px,94vw);}
  .gcard{width:clamp(180px,22vw,250px);height:clamp(225px,30vh,300px);}
  .gi-wrap svg{width:72px;height:72px;}
  .rprize{font-size:26px;}
}

/* Floating wallet widget (top-right) */
.g-wallet{
  position:fixed;
  top:66px;
  right:14px;
  left:auto;
  width:min(372px, calc(100vw - 28px));
  padding:0;
  z-index:18;
}
.wallet-panel{
  position:relative;
  width:100%;
  background:
    radial-gradient(circle at 88% 12%, rgba(34,211,238,.24), transparent 45%),
    radial-gradient(circle at 0% 100%, rgba(129,140,248,.26), transparent 55%),
    linear-gradient(155deg, rgba(30,23,66,.9) 0%, rgba(40,30,84,.88) 48%, rgba(17,24,52,.9) 100%);
  border:1px solid rgba(167,139,250,.42);
  border-radius:16px;
  padding:11px 11px;
  display:flex;
  align-items:center;
  gap:10px;
  box-shadow:0 14px 30px rgba(8,5,28,.5), 0 0 0 1px rgba(255,255,255,.08) inset;
  max-width:none;
  margin:0;
  overflow:hidden;
  backdrop-filter:blur(8px);
}
.wallet-panel::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,0) 38%);
}
.wallet-panel::after{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(196,181,253,.75), transparent);
  pointer-events:none;
}
.wi{display:none;}
.wi svg{width:22px;height:22px;color:#fff;}
.wallet-main{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0;}
.wallet-main-head{display:flex;align-items:flex-start;gap:8px;}
.winfo{flex:1;min-width:0;}
.wlabel{font-size:11px;color:#c4b5fd;margin-bottom:2px;letter-spacing:.08em;font-weight:800;text-transform:uppercase;}
.wsub{display:block;font-size:9px;color:#94a3b8;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.wallet-currency-grid{display:grid;grid-template-columns:minmax(0,1fr);justify-content:flex-start;gap:0;}
.wallet-currency-item{
  background:transparent;
  border:none;
  border-radius:0;
  padding:0;
  min-height:0;
  box-shadow:none;
}
.wallet-currency-item.is-hidden{display:none;}
.wallet-currency-top{display:none;}
.wallet-currency-code{font-size:10px;font-weight:700;letter-spacing:.4px;color:#cbd5e1;}
.wallet-currency-badge{font-size:10px;font-weight:800;padding:2px 7px;border-radius:999px;border:1px solid transparent;white-space:nowrap;}
.wallet-currency-badge.ready{color:#22c55e;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.35);}
.wallet-currency-badge.waiting{color:#f59e0b;background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.35);}
.wallet-currency-badge.locked{color:#93c5fd;background:rgba(59,130,246,.14);border-color:rgba(96,165,250,.36);}
.wallet-currency-amount{margin-top:1px;display:flex;align-items:baseline;gap:2px;color:#f5f3ff;}
.wallet-currency-symbol{font-size:19px;font-weight:900;color:#c4b5fd;line-height:1;}
.wallet-currency-amount span:last-child{font-size:30px;font-weight:900;line-height:1;letter-spacing:.2px;text-shadow:0 2px 12px rgba(76,29,149,.4);}
.wallet-currency-note{display:none;}
.wallet-available-text{display:none;}
.wallet-main-row{display:flex;align-items:flex-start;gap:11px;}
.wallet-btns-icon{display:none;}

/* ── Wallet trust score row ── */
.wallet-trust-row{
  width:100%;
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px 2px 3px;
  border-top:1px solid rgba(196,181,253,.18);
  margin-top:4px;
}
.wallet-trust-label{
  font-size:9px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
  color:#a5b4fc;
  flex-shrink:0;
  white-space:nowrap;
}
.wallet-trust-bar{
  flex:1;
  height:5px;
  background:rgba(255,255,255,.1);
  border-radius:999px;
  overflow:hidden;
}
.wallet-trust-fill{
  height:100%;
  border-radius:999px;
  transition:width .6s ease, background .4s ease;
  box-shadow:0 0 6px currentColor;
}
.wallet-trust-val{
  font-size:11px;
  font-weight:900;
  min-width:26px;
  text-align:right;
  flex-shrink:0;
}
.wallet-trust-row[data-tier="high"] .wallet-trust-val{color:#4ade80;}
.wallet-trust-row[data-tier="mid"] .wallet-trust-val{color:#fbbf24;}
.wallet-trust-row[data-tier="low"] .wallet-trust-val{color:#f87171;}

.wbtns{display:flex;flex-direction:column;gap:6px;flex-shrink:0;}
.wbtn{border:none;border-radius:999px;width:32px;height:32px;padding:0;cursor:pointer;font-family:inherit;font-weight:700;font-size:0;display:flex;align-items:center;justify-content:center;transition:all .16s;background:rgba(99,102,241,.22);color:#e9d5ff;border:1px solid rgba(196,181,253,.38);backdrop-filter:blur(3px);}
.wbtn.rut{background:rgba(59,130,246,.26);color:#dbeafe;box-shadow:none;}
.wbtn.doi{background:rgba(124,58,237,.28);color:#ede9fe;border:1px solid rgba(196,181,253,.42);}
.wbtn:hover{filter:brightness(1.06);transform:translateY(-1px) scale(1.03);}
.wbtn svg{width:15px;height:15px;}
.wallet-action-icon{display:block;flex-shrink:0;overflow:visible;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;}

@media (min-width: 1000px){
  .wallet-panel.wallet-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    column-gap:10px;
    row-gap:4px;
  }

  .wallet-main.wallet-main-row{
    grid-column:1;
    flex-direction:column;
    gap:5px;
    margin-bottom:0;
  }

  .wallet-main.wallet-main-row .wi,
  .wallet-main.wallet-main-row .wallet-btns-icon{
    display:none !important;
  }

  .wallet-trust-row{
    grid-column:1;
    margin-top:4px;
    margin-bottom:0;
  }

  .wallet-action-btns{
    grid-column:2;
    grid-row:1 / span 2;
    display:flex;
    flex-direction:column;
    gap:6px;
    flex-shrink:0;
  }
}

/* CHAT FAB */
.cfab{position:fixed;bottom:28px;right:16px;width:64px;height:64px;background:linear-gradient(135deg,#5b21b6,#7c3aed);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 24px rgba(124,58,237,.54);z-index:9999;border:none;animation:fabB 3s ease-in-out infinite;padding:3px;overflow:visible;}
@keyframes fabB{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
.cfab.has-unread{animation:fabUnreadPulse 1.1s ease-in-out infinite;box-shadow:0 8px 28px rgba(239,68,68,.5),0 0 0 3px rgba(239,68,68,.22);}
@keyframes fabUnreadPulse{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-2px) scale(1.04);}}
.cfab:hover{animation:none;transform:scale(1.08);box-shadow:0 12px 34px rgba(124,58,237,.6);}
.cfab-avatar{width:100%;height:100%;object-fit:cover;border-radius:50%;border:2px solid rgba(255,255,255,.78);display:block;box-shadow:0 4px 12px rgba(0,0,0,.34);}
.cfab-icon{display:none;width:100%;height:100%;align-items:center;justify-content:center;font-size:30px;line-height:1;border-radius:50%;border:2px solid rgba(255,255,255,.78);background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.34),rgba(255,255,255,.04));color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.45);}
.cfab.use-icon .cfab-avatar{display:none;}
.cfab.use-icon .cfab-icon{display:flex;}
.cfab-typing{position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);display:flex;gap:4px;padding:4px 8px;background:rgba(17,24,39,.92);border:1px solid rgba(167,139,250,.6);border-radius:999px;box-shadow:0 6px 16px rgba(0,0,0,.34);}
.cfab-typing span{width:5px;height:5px;border-radius:50%;background:#e2e8f0;animation:cfabTypingDot 1.2s ease-in-out infinite;}
.cfab-typing span:nth-child(2){animation-delay:.18s;}
.cfab-typing span:nth-child(3){animation-delay:.36s;}
@keyframes cfabTypingDot{0%,80%,100%{transform:translateY(0);opacity:.45;}40%{transform:translateY(-3px);opacity:1;}}
.cfab-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:999px;background:linear-gradient(135deg,#ef4444,#f97316);font-size:11px;font-weight:800;color:#fff;display:flex;align-items:center;justify-content:center;border:2px solid var(--bg);padding:0 5px;box-shadow:0 6px 14px rgba(239,68,68,.45);}
.cfab-badge.is-bump{animation:cfabBadgeBump .52s cubic-bezier(.34,1.56,.64,1);}
@keyframes cfabBadgeBump{0%{transform:scale(.8);}45%{transform:scale(1.2);}100%{transform:scale(1);}}
.cfab-hint{position:absolute;right:76px;top:50%;transform:translateY(-50%) translateZ(0);display:flex;flex-direction:column;gap:2px;pointer-events:none;background:rgba(15,23,42,.9);color:#fff;border:1px solid rgba(148,163,184,.45);border-radius:12px;padding:8px 10px;min-width:170px;box-shadow:0 10px 22px rgba(2,6,23,.35);opacity:.94;animation:cfabHintPulse 2.2s ease-in-out infinite;transition:opacity .34s cubic-bezier(.22,1,.36,1),transform .34s cubic-bezier(.22,1,.36,1),visibility .34s;will-change:opacity,transform;backface-visibility:hidden;}
.cfab-hint.is-hidden{opacity:0;visibility:hidden;transform:translateY(calc(-50% - 6px)) scale(.96);}
.cfab-hint.is-reveal{animation:cfabHintReveal .28s cubic-bezier(.22,1,.36,1) 1, cfabHintPulse 2.2s ease-in-out .35s infinite;}
.cfab-hint-line{font-size:11px;line-height:1.2;font-weight:700;white-space:nowrap;text-align:left;}
@keyframes cfabHintPulse{0%,100%{transform:translateY(-50%) scale(1);}50%{transform:translateY(calc(-50% - 1px)) scale(1.01);}}
@keyframes cfabHintReveal{0%{opacity:0;transform:translateY(calc(-50% - 10px)) scale(.94);}100%{opacity:.94;transform:translateY(-50%) scale(1);}}
.cfab-hint.is-chat-message{background:linear-gradient(135deg,rgba(37,99,235,.95),rgba(79,70,229,.95));border-color:rgba(191,219,254,.68);box-shadow:0 12px 24px rgba(37,99,235,.35);animation:cfabIncomingPulse .9s ease-out 1,cfabHintPulse 2.2s ease-in-out 1.1s infinite;}
@keyframes cfabIncomingPulse{0%{transform:translateY(-50%) scale(.92);opacity:.65;}55%{transform:translateY(calc(-50% - 1px)) scale(1.05);opacity:1;}100%{transform:translateY(-50%) scale(1);opacity:1;}}

@media (hover: hover) and (pointer: fine){
  .cfab-hint{
    min-width: 196px;
    padding: 10px 12px;
    border-color: rgba(147,197,253,.58);
    box-shadow: 0 18px 36px rgba(2,6,23,.42), 0 0 0 1px rgba(191,219,254,.12) inset;
    animation: cfabHintPulseStrong 1.8s cubic-bezier(.4,0,.2,1) infinite;
  }

  .cfab-hint.is-reveal{
    animation: cfabHintRevealStrong .36s cubic-bezier(.22,1,.36,1) 1, cfabHintPulseStrong 1.8s cubic-bezier(.4,0,.2,1) .4s infinite;
  }

  .cfab-hint.is-chat-message{
    box-shadow: 0 18px 38px rgba(37,99,235,.46), 0 0 24px rgba(59,130,246,.24);
    animation: cfabIncomingPulseStrong .42s cubic-bezier(.22,1,.36,1) 1, cfabHintPulseStrong 1.8s cubic-bezier(.4,0,.2,1) .5s infinite;
  }

  @keyframes cfabHintPulseStrong{
    0%,100%{transform:translateY(-50%) scale(1);} 
    50%{transform:translateY(calc(-50% - 3px)) scale(1.04);} 
  }

  @keyframes cfabHintRevealStrong{
    0%{opacity:0;transform:translateY(calc(-50% - 18px)) scale(.88);} 
    70%{opacity:1;transform:translateY(calc(-50% + 2px)) scale(1.05);} 
    100%{opacity:.96;transform:translateY(-50%) scale(1);} 
  }

  @keyframes cfabIncomingPulseStrong{
    0%{opacity:.5;transform:translateY(calc(-50% - 12px)) scale(.86);} 
    60%{opacity:1;transform:translateY(calc(-50% + 1px)) scale(1.08);} 
    100%{opacity:1;transform:translateY(-50%) scale(1);} 
  }
}

.chat-msg-toast-stack{position:fixed;right:16px;bottom:106px;z-index:9998;display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none;max-width:min(362px,calc(100vw - 20px));}

/* Chat message toast — premium notification card for admin replies */
.chat-msg-toast{--toast-life:5500ms;position:relative;display:flex;align-items:center;gap:10px;padding:12px 12px 13px 11px;background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(248,250,252,.98));border-radius:18px;box-shadow:0 18px 44px rgba(15,23,42,.22),0 8px 18px rgba(37,99,235,.18);border:1px solid rgba(191,219,254,.9);backdrop-filter:blur(10px);cursor:pointer;max-width:352px;min-width:250px;transform:translate3d(calc(100% + 34px),0,0) scale(.94);opacity:0;transition:transform .3s cubic-bezier(.22,1,.36,1),opacity .22s ease;pointer-events:none;overflow:hidden;contain:layout paint style;}
.chat-msg-toast-glow{position:absolute;inset:-40% -10% auto -10%;height:92px;background:radial-gradient(circle at 10% 50%,rgba(59,130,246,.35),rgba(99,102,241,.04) 62%,transparent 75%);pointer-events:none;}
.chat-msg-toast.visible{transform:translate3d(0,0,0) scale(1);opacity:1;pointer-events:auto;animation:chatToastIn .55s cubic-bezier(.22,1,.36,1) both;}
.chat-msg-toast.in-chat{border-color:rgba(125,211,252,.9);box-shadow:0 16px 34px rgba(8,145,178,.2),0 6px 14px rgba(8,145,178,.16);}
.chat-msg-toast.is-closing{transform:translate3d(calc(100% + 26px),0,0) scale(.95);opacity:0;pointer-events:none;}
.chat-msg-toast.is-template{display:none!important;}
.chat-msg-toast.is-swiping{transition:none!important;}
@keyframes chatToastIn{0%{transform:translate3d(calc(100% + 34px),0,0) scale(.92);opacity:0;}62%{transform:translate3d(-6px,0,0) scale(1.02);opacity:1;}100%{transform:translate3d(0,0,0) scale(1);opacity:1;}}
.chat-msg-toast-av{position:relative;z-index:1;width:42px;height:42px;border-radius:50%;overflow:hidden;flex-shrink:0;border:2px solid rgba(147,197,253,.82);box-shadow:0 6px 14px rgba(59,130,246,.24);}
.chat-msg-toast-av img{width:100%;height:100%;object-fit:cover;display:block;}
.chat-msg-toast-body{position:relative;z-index:1;flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.chat-msg-toast-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.chat-msg-toast-name{font-size:11px;font-weight:800;color:#1d4ed8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chat-msg-toast-time{font-size:10px;font-weight:700;color:#64748b;flex-shrink:0;}
.chat-msg-toast-text{font-size:12px;color:#0f172a;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px;}
.chat-msg-toast-tag{display:inline-flex;align-items:center;align-self:flex-start;font-size:10px;font-weight:800;color:#1e3a8a;background:rgba(191,219,254,.6);border:1px solid rgba(147,197,253,.82);border-radius:999px;padding:1px 7px;}
.chat-msg-toast.in-chat .chat-msg-toast-tag{background:rgba(165,243,252,.58);border-color:rgba(103,232,249,.86);color:#155e75;}
.chat-msg-toast-x{position:relative;z-index:1;background:none;border:none;cursor:pointer;color:#94a3b8;font-size:18px;line-height:1;padding:0 2px;flex-shrink:0;transition:color .15s,transform .15s;}
.chat-msg-toast-x:hover{color:#334155;transform:scale(1.06);}
.chat-msg-toast-progress{position:absolute;left:9px;right:9px;bottom:7px;height:3px;background:rgba(148,163,184,.22);border-radius:999px;overflow:hidden;}
.chat-msg-toast-progress::before{content:'';display:block;height:100%;width:100%;background:linear-gradient(90deg,#2563eb,#4f46e5);transform-origin:left center;transform:scaleX(0);}
.chat-msg-toast.visible .chat-msg-toast-progress::before{animation:chatToastProgress var(--toast-life) linear forwards;}
@keyframes chatToastProgress{from{transform:scaleX(1);}to{transform:scaleX(0);}}

/* Image-only message: no bubble background */
.mbub.media-only{background:transparent!important;border:none!important;padding:0!important;box-shadow:none!important;width:auto;}

@media (max-width: 760px){
  .cfab-hint{right:0;top:auto;bottom:72px;transform:none;min-width:145px;padding:7px 9px;animation:none;transition:opacity .26s ease-out,transform .26s ease-out,visibility .26s;will-change:auto;}
  .cfab-hint.is-hidden{transform:translateY(-6px) scale(.96);}
  .cfab-hint-line{font-size:10px;white-space:normal;}
  .chat-msg-toast-stack{left:10px;right:10px;bottom:88px;align-items:stretch;gap:8px;max-width:none;}
  .chat-msg-toast{max-width:none;min-width:0;padding:10px 10px 11px 10px;transform:translate3d(0,calc(100% + 24px),0) scale(.98);}
  .chat-msg-toast.visible{transform:translate3d(0,0,0) scale(1);animation:chatToastInMobile .42s cubic-bezier(.22,1,.36,1) both;}
  .chat-msg-toast.is-closing{transform:translate3d(0,calc(100% + 18px),0) scale(.98);}
  .chat-msg-toast-text{max-width:none;}
  @keyframes chatToastInMobile{0%{transform:translate3d(0,calc(100% + 24px),0) scale(.98);opacity:0;}100%{transform:translate3d(0,0,0) scale(1);opacity:1;}}
}

@media (hover: none) and (pointer: coarse){
  .cfab-hint{animation:none;transition:opacity .26s ease-out,transform .26s ease-out,visibility .26s;will-change:auto;}
}

body.reduce-motion .cfab,
body.reduce-motion .cfab.has-unread,
body.reduce-motion .cfab-badge.is-bump,
body.reduce-motion .cfab-hint,
body.reduce-motion .cfab-hint.is-chat-message,
body.reduce-motion .cfab-hint.is-reveal,
body.reduce-motion .chat-msg-toast.visible,
body.reduce-motion .cmsg-row.is-fresh .cmsg-avatar {
  animation: none !important;
}
body.medium-motion .cfab { animation-duration: 5.4s; }
body.medium-motion .cfab.has-unread { animation: fabUnreadPulse 2.2s ease-in-out infinite; }
body.medium-motion .cfab-badge.is-bump { animation-duration: .26s; }
body.medium-motion .chat-msg-toast.visible { animation-duration: .2s; }

/* CHAT PANEL */
.cpanel{position:fixed;top:0;right:0;bottom:0;width:min(430px,96vw);background:#f8fafc;border-left:1px solid #dbe4f0;z-index:10000;display:flex;flex-direction:column;transform:translateX(105%);opacity:.7;box-shadow:-18px 0 42px rgba(2,6,23,.22);transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .28s ease,box-shadow .28s ease;will-change:transform,opacity;}
.cpanel.open{transform:translateX(0);opacity:1;box-shadow:-24px 0 60px rgba(2,6,23,.26),-8px 0 24px rgba(2,6,23,.12);animation:chatPanelIn .42s cubic-bezier(.2,.85,.28,1),chatPanelBreath 4.2s ease-in-out .5s infinite;}
@keyframes chatPanelIn{0%{transform:translateX(105%) scale(.985);}70%{transform:translateX(-6px) scale(1);}100%{transform:translateX(0) scale(1);}}
@keyframes chatPanelBreath{0%,100%{box-shadow:-24px 0 56px rgba(2,6,23,.18),-8px 0 22px rgba(2,6,23,.1);}50%{box-shadow:-28px 0 62px rgba(2,6,23,.22),-10px 0 30px rgba(2,6,23,.14);}}
.ch{position:sticky;top:0;z-index:3;background:#ffffff;padding:14px 16px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #e2e8f0;}
.ch-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;border:2px solid #c7d2fe;box-shadow:0 6px 14px rgba(59,130,246,.2);background:#e2e8f0;}
.ch-av img{width:100%;height:100%;object-fit:cover;display:block;}
.ch-title{font-size:14px;font-weight:800;letter-spacing:.1px;color:#0f172a;}
.ch-online{font-size:11px;color:#16a34a;display:flex;align-items:center;gap:4px;margin-top:1px;font-weight:700;}
.ch-online::before{content:'';width:6px;height:6px;border-radius:50%;background:#22c55e;display:inline-block;box-shadow:0 0 0 3px rgba(34,197,94,.18);}
.ch-x{margin-left:auto;background:#f1f5f9;border:1px solid #cbd5e1;color:#475569;cursor:pointer;padding:6px;border-radius:8px;display:flex;transition:all .16s;}
.ch-x:hover{background:#e2e8f0;color:#0f172a;transform:scale(1.04);}
.ch-x svg{width:17px;height:17px;}
.cmsgs{flex:1;padding:14px 14px 10px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;background:linear-gradient(180deg,#f8fafc 0%,#f1f5f9 100%);}
.cmsg-row{display:flex;max-width:100%;}
.cmsg-row.mine{justify-content:flex-end;}
.cmsg-row-content{display:flex;align-items:flex-end;gap:8px;max-width:92%;}
.cmsg-row.mine .cmsg-row-content{flex-direction:row-reverse;}
.cmsg-row.is-fresh .cmsg-avatar{animation:cmsgAvatarFreshPulse 1.2s ease-out 1;}
.cmsg-col{display:flex;flex-direction:column;align-items:flex-start;max-width:100%;}
.cmsg-row.mine .cmsg-col{align-items:flex-end;}
.cmsg-avatar{width:30px;height:30px;min-width:30px;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;letter-spacing:.2px;color:#f8fafc;background:linear-gradient(135deg,#334155,#475569);border:1px solid rgba(148,163,184,.45);box-shadow:0 6px 14px rgba(15,23,42,.2);position:relative;}
.cmsg-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.cmsg-avatar.admin{background:linear-gradient(135deg,#2563eb,#3b82f6);border-color:rgba(147,197,253,.7);}
.cmsg-avatar.mine{background:linear-gradient(135deg,#0f766e,#14b8a6);border-color:rgba(94,234,212,.55);}
@keyframes cmsgAvatarFreshPulse{0%{transform:scale(.9);filter:saturate(.9);}40%{transform:scale(1.09);filter:saturate(1.2);}100%{transform:scale(1);filter:saturate(1);}}
.msnd{font-size:10px;color:#64748b;margin:0 0 4px 2px;font-weight:700;}
.mbub{background:#ffffff;border:1px solid #e2e8f0;border-radius:8px 16px 16px 16px;padding:10px 12px;font-size:13px;color:#0f172a;line-height:1.55;max-width:88%;display:inline-block;width:fit-content;box-shadow:0 3px 10px rgba(15,23,42,.06);white-space:pre-wrap;word-break:break-word;}
.mbub.mine{background:linear-gradient(135deg,#2563eb,#3b82f6);border-color:#3b82f6;color:#eff6ff;border-radius:16px 8px 16px 16px;display:inline-block;width:fit-content;box-shadow:0 6px 16px rgba(37,99,235,.24);}
.cmsg-time{margin-top:4px;font-size:10px;line-height:1.25;color:#64748b;font-weight:700;padding:0 2px;}
.chat-pre{padding:12px 14px;border-bottom:1px solid #e2e8f0;display:flex;flex-direction:column;gap:6px;background:#ffffff;}
.chat-pre-title{font-size:13px;font-weight:800;color:#0f172a;}
.chat-pre-sub{font-size:11px;color:#64748b;line-height:1.4;margin-bottom:4px;}
.chat-pre-input{background:#f8fafc;border:1px solid #cbd5e1;border-radius:11px;padding:10px 11px;color:#0f172a;font-family:inherit;font-size:12px;outline:none;}
.chat-pre-input::placeholder{color:#94a3b8;}
.chat-pre-input:focus{border-color:#3b82f6;box-shadow:0 0 0 2px rgba(59,130,246,.15);}
.chat-pre-err{min-height:14px;font-size:10px;color:#fca5a5;}
.chat-pre-btn{margin-top:3px;background:linear-gradient(135deg,#2563eb,#3b82f6);border:none;border-radius:11px;padding:10px 12px;color:#fff;font-size:12px;font-weight:800;cursor:pointer;box-shadow:0 10px 20px rgba(37,99,235,.28);}
.chat-pre-btn:hover{filter:brightness(1.08);transform:translateY(-1px);}
.cquick{padding:9px 14px;display:flex;flex-wrap:wrap;gap:5px;background:#f8fafc;border-top:1px solid #e2e8f0;}
.qbtn{background:#eef2ff;border:1px solid #c7d2fe;border-radius:999px;padding:6px 12px;font-family:inherit;font-size:11px;color:#1e40af;cursor:pointer;font-weight:700;}
.qbtn:hover{background:#e0e7ff;}
.cinp-row{position:sticky;bottom:0;z-index:2;padding:10px 12px;border-top:1px solid #e2e8f0;display:flex;gap:7px;align-items:flex-end;background:#ffffff;}
.c-emoji{background:none;border:none;cursor:pointer;font-size:19px;padding:3px;flex-shrink:0;}
.chat-emoji-panel{position:absolute;left:12px;bottom:66px;width:min(352px,calc(100% - 24px));max-height:340px;padding:8px;border:1px solid #cbd5e1;border-radius:14px;background:linear-gradient(180deg,#ffffff,#f8fafc);box-shadow:0 20px 38px rgba(15,23,42,.18);overflow:hidden;z-index:6;}
.chat-emoji-grid{display:block;max-height:322px;overflow:auto;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent;}
.chat-emoji-grid em-emoji-picker{width:100%;--font-family:'Be Vietnam Pro',sans-serif;}
.chat-emoji-fallback{font-size:12px;color:#64748b;padding:8px;}
.chat-emoji-item{border:none;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;cursor:pointer;padding:4px 0;font-size:18px;line-height:1.2;transition:transform .12s ease,background .12s ease,border-color .12s ease;}
.chat-emoji-item:hover{background:#eef2ff;border-color:#c7d2fe;transform:translateY(-1px);}
.c-tool{background:#f1f5f9;border:1px solid #cbd5e1;color:#334155;width:32px;height:32px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;transition:all .15s;}
.c-tool:hover{background:#e2e8f0;transform:translateY(-1px);box-shadow:0 6px 12px rgba(15,23,42,.12);}
.c-tool:disabled{opacity:.45;cursor:not-allowed;transform:none;}
.c-inp{flex:1 1 auto;width:100%;min-width:0;max-width:100%;background:#f8fafc;border:1px solid #cbd5e1;border-radius:5px;padding:9px 13px;color:#0f172a;font-family:inherit;font-size:13px;outline:none;min-height:38px;max-height:150px;height:38px;line-height:1.45;resize:none;overflow-y:hidden;-ms-overflow-style:none;scrollbar-width:none;}
.c-inp::-webkit-scrollbar{width:0;height:0;}
.c-inp::placeholder{color:#94a3b8;}
.c-inp:focus{border-color:#3b82f6;box-shadow:0 0 0 2px rgba(59,130,246,.18);}
.c-send{background:linear-gradient(135deg,#2563eb,#3b82f6);border:none;border-radius:50%;width:36px;height:36px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 10px 18px rgba(37,99,235,.3);transition:all .16s;}
.c-send:hover{transform:translateY(-1px) scale(1.05);filter:brightness(1.06);}
.c-send svg{width:14px;height:14px;color:#fff;}
.chat-upload-progress{margin:0 14px 10px;padding:8px 10px;border-radius:10px;background:#dbeafe;border:1px solid #93c5fd;font-size:11px;color:#1d4ed8;font-weight:700;}
.chat-drop-hint{margin:0 14px 12px;padding:9px 10px;border-radius:10px;border:1px dashed #93c5fd;background:#eff6ff;font-size:11px;color:#1e40af;text-align:center;}
.cpanel.drag-over .chat-drop-hint{display:block !important;}
.cpanel.drag-over .cmsgs{outline:2px dashed #60a5fa;outline-offset:-4px;background:#eff6ff;}

.chat-attachment{margin-top:7px;display:block;}
.chat-attachment-img{max-width:190px;max-height:210px;border-radius:12px;border:1px solid #cbd5e1;display:block;box-shadow:0 8px 16px rgba(15,23,42,.14);}
.chat-attachment-file{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:10px;background:#eff6ff;border:1px solid #bfdbfe;color:#1e40af;text-decoration:none;font-size:12px;font-weight:700;}
.chat-attachment-icon{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:18px;border-radius:999px;border:1px solid rgba(59,130,246,.35);font-size:9px;font-weight:800;letter-spacing:.2px;background:#dbeafe;color:#1d4ed8;}
.mbub.mine .chat-attachment-file{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.45);color:#eff6ff;}
.mbub.mine .chat-attachment-icon{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.55);color:#eff6ff;}

/* MODAL */
.modal-ov{position:absolute;inset:0;background:rgba(0,0,0,.72);z-index:80;display:none;align-items:center;justify-content:center;backdrop-filter:blur(5px);}
.modal-ov.open{display:flex;animation:modalOvIn .28s ease-out both;}
@keyframes modalOvIn{from{opacity:0;}to{opacity:1;}}
.mbox{background:#0a0820;border:1px solid rgba(124,58,237,.28);border-radius:20px;width:470px;max-width:92vw;max-height:86vh;overflow-y:auto;box-shadow:0 24px 75px rgba(0,0,0,.7),0 0 0 1px rgba(124,58,237,.1) inset;scrollbar-width:thin;scrollbar-color:rgba(124,58,237,.25) transparent;animation:mIn .42s cubic-bezier(.34,1.56,.64,1) both;}
@keyframes mIn{from{transform:scale(.88) translateY(22px);opacity:0;}to{transform:none;opacity:1;}}
.mhdr{position:sticky;top:0;background:#0c0a22;border-bottom:1px solid rgba(255,255,255,.04);padding:18px 22px 14px;display:flex;align-items:center;gap:11px;}
.mhdr-ic{width:38px;height:38px;background:linear-gradient(135deg,#5b21b6,#7c3aed);border-radius:10px;display:flex;align-items:center;justify-content:center;}
.mhdr-ic svg{width:20px;height:20px;color:#fff;}
.mttl{font-size:17px;font-weight:800;}
.mstl{font-size:11px;color:#555580;margin-top:1px;}
.mx{margin-left:auto;background:none;border:none;color:#555;cursor:pointer;padding:4px;border-radius:6px;display:flex;transition:color .15s;}
.mx:hover{color:#fff;}
.mx svg{width:19px;height:19px;}
.mbody{padding:18px 22px 24px;}
.amtbox{background:rgba(25,20,50,.7);border:1px solid rgba(124,58,237,.15);border-radius:12px;padding:14px 18px;margin-bottom:20px;}
.alab{font-size:11px;color:#555580;margin-bottom:5px;}
.aval{font-size:28px;font-weight:900;color:var(--orange);display:flex;align-items:baseline;gap:6px;}
.anote{font-size:11px;color:#3a3018;margin-top:3px;}
.fg{margin-bottom:15px;}
.fl{font-size:12px;font-weight:700;color:#7070a0;margin-bottom:6px;display:flex;align-items:center;gap:3px;}
.req{color:#ef4444;}
.fi{width:100%;background:rgba(25,20,50,.6);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:12px 15px;color:#fff;font-family:inherit;font-size:14px;outline:none;transition:border-color .18s,box-shadow .18s;}
.fi:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(124,58,237,.12);}
.fi::placeholder{color:#32325a;}
.fi.input-error{border-color:rgba(239,68,68,.75);box-shadow:0 0 0 3px rgba(239,68,68,.16);}
.field-error{min-height:16px;font-size:11px;color:#fca5a5;margin:-8px 0 8px;}
.fsel{width:100%;appearance:none;background:rgba(25,20,50,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center;border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:12px 38px 12px 15px;color:#aaa;font-family:inherit;font-size:14px;outline:none;cursor:pointer;}
.fsel option{background:#0c0a22;color:#fff;}
.fta{resize:vertical;min-height:75px;}
.ckrow{display:flex;align-items:center;gap:9px;margin-bottom:18px;font-size:13px;color:#555580;}
.ck{width:17px;height:17px;border:2px solid rgba(124,58,237,.38);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
.ck.on{background:var(--purple);border-color:var(--purple);}
.ck svg{width:11px;height:11px;color:#fff;}
.bsub{width:100%;background:linear-gradient(90deg,#4c1d95,#6d28d9,#7c3aed,#a855f7);background-size:200%;border:none;border-radius:12px;padding:15px;color:#fff;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;box-shadow:0 4px 22px rgba(124,58,237,.4);animation:gradShift 3s linear infinite;transition:filter .15s,transform .15s;}
.bsub:hover{filter:brightness(1.1);transform:translateY(-1px);}

/* Withdrawal modal (light style) */
#modalOv .mbox{background:#f6f6f7;border:1px solid #d6d6da;border-radius:12px;width:min(760px,96vw);max-height:90vh;box-shadow:0 24px 60px rgba(0,0,0,.35);}
#modalOv .mhdr{position:sticky;top:0;background:#f6f6f7;border-bottom:1px solid #e4e4e7;padding:16px 20px;display:flex;align-items:center;gap:10px;}
#modalOv .mhdr-ic{width:22px;height:22px;background:none;border-radius:0;color:#16a34a;}
#modalOv .mhdr-ic svg{width:22px;height:22px;color:#16a34a;}
#modalOv .mttl{font-size:17px;font-weight:800;color:#202228;line-height:1.2;}
#modalOv .mx{margin-left:auto;color:#666;background:none;border:none;cursor:pointer;}
#modalOv .mx:hover{color:#222;}
#modalOv .mbody{padding:14px 20px 22px;}

.with-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#e9e9eb;border:1px solid #dfdfe3;border-radius:8px;padding:4px;margin-bottom:10px;}
.with-tab-btn{border:none;background:transparent;border-radius:6px;padding:10px 12px;font-size:14px;font-weight:700;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;}
.with-tab-btn.active{background:#f4f4f5;color:#222;box-shadow:inset 0 0 0 1px #e5e7eb;}

.with-bal-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:8px 0 14px;color:#4b5563;font-size:15px;}
.with-bal-row strong{color:#16a34a;}
.with-trust-block-alert{
  display:flex;
  align-items:flex-start;
  gap:8px;
  border:1px solid #fecaca;
  border-left:4px solid #dc2626;
  background:linear-gradient(180deg,#fff1f2 0%,#fef2f2 100%);
  color:#991b1b;
  border-radius:10px;
  padding:10px 12px;
  font-size:13px;
  line-height:1.45;
  margin:0 0 12px;
  font-weight:600;
}
.with-trust-block-alert::before{content:'⚠️';font-size:14px;line-height:1.2;flex-shrink:0;margin-top:1px;}

.with-history-empty{border:1px solid #d1d5db;background:#f3f4f6;border-radius:10px;padding:30px 14px;text-align:center;color:#6b7280;font-size:15px;}
.with-history-list{display:flex;flex-direction:column;gap:8px;}
.with-history-item{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #d1d5db;background:#f9fafb;border-radius:10px;padding:11px 12px;}
.with-history-main{min-width:0;display:flex;flex-direction:column;gap:2px;}
.with-history-amount{font-size:14px;font-weight:800;color:#111827;}
.with-history-account{font-size:12px;font-weight:700;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.with-history-account-holder{font-size:12px;color:#4b5563;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.with-history-meta{font-size:12px;color:#6b7280;margin-top:2px;}
.with-history-reason{font-size:12px;color:#b91c1c;background:#fee2e2;border:1px solid #fecaca;border-radius:8px;padding:5px 8px;margin-top:4px;line-height:1.35;}
.with-history-side{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex-shrink:0;}
.with-history-status{font-size:12px;font-weight:700;border-radius:999px;padding:4px 10px;}
.with-history-status.pending{background:#fef3c7;color:#92400e;}
.with-history-status.approved{background:#dcfce7;color:#166534;}
.with-history-status.rejected{background:#fee2e2;color:#991b1b;}
.with-history-support-btn{border:1px solid #d1d5db;background:#ffffff;color:#111827;border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;}
.with-history-support-btn:hover{background:#f3f4f6;}
.with-history-support-btn:disabled{opacity:.55;cursor:not-allowed;}

@media (max-width: 640px){
  .with-history-item{align-items:flex-start;}
  .with-history-side{margin-left:auto;}
}

#modalOv .fg{margin-bottom:10px;}
#modalOv .fl{font-size:13px;font-weight:700;color:#202228;margin-bottom:6px;}
#modalOv .fi{background:#f1f1f3;border:1px solid #d1d5db;color:#111827;border-radius:8px;padding:10px 12px;}
#modalOv .fi::placeholder{color:#9ca3af;}
#modalOv .fi:focus{border-color:#9ca3af;box-shadow:none;}
#modalOv .field-error{min-height:14px;font-size:11px;color:#dc2626;margin-top:4px;margin-bottom:6px;}

.with-quick-amounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:6px 0 14px;}
.with-quick-btn{border:1px solid #d1d5db;background:#f3f4f6;border-radius:8px;padding:8px 6px;font-size:13px;font-weight:700;color:#374151;cursor:pointer;}
.with-quick-btn:hover{background:#e5e7eb;}

.with-action-row{display:flex;gap:10px;margin-top:12px;}
#modalOv .bsub{background:#14171f;animation:none;box-shadow:none;padding:11px 16px;border-radius:8px;font-size:15px;font-weight:800;}
#modalOv .bsub:hover{filter:brightness(1.04);transform:none;}
.with-close-btn{border:1px solid #d1d5db;background:#f3f4f6;color:#111827;border-radius:8px;padding:11px 18px;font-size:15px;font-weight:700;cursor:pointer;}

@media (max-width: 640px){
  #modalOv .mttl{font-size:16px;}
  .with-tab-btn{font-size:14px;}
  .with-bal-row{font-size:15px;}
}

/* ═══════════ WIN OVERLAY — Glassmorphism Reward Modal ═══════════ */
.win-ov{
  position:absolute;inset:0;z-index:85;display:none;align-items:center;justify-content:center;
  background:
    radial-gradient(ellipse 60% 50% at 20% 10%,rgba(124,58,237,.28),transparent 55%),
    radial-gradient(ellipse 55% 45% at 85% 90%,rgba(245,158,11,.22),transparent 50%),
    radial-gradient(ellipse 40% 30% at 50% 50%,rgba(56,189,248,.1),transparent 60%),
    rgba(5,3,16,.82);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  padding:16px;overflow-y:auto;
}
.win-ov.open{display:flex;}

/* ── Modal Container ── */
.wov-modal{
  position:relative;width:min(580px,90vw);
  background:linear-gradient(160deg,rgba(30,27,75,.92) 0%,rgba(17,24,50,.96) 60%,rgba(10,14,32,.98) 100%);
  border:1px solid rgba(167,139,250,.35);
  border-radius:22px;
  box-shadow:
    0 0 0 1px rgba(245,158,11,.12) inset,
    0 0 80px rgba(124,58,237,.18),
    0 0 120px rgba(245,158,11,.08),
    0 40px 100px rgba(0,0,0,.65);
  padding:16px 18px 18px;
  max-height:calc(100dvh - 36px);
  animation:wovOpen .48s cubic-bezier(.16,.9,.3,1) both;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.62) rgba(255,255,255,.12);
}

.wov-modal::-webkit-scrollbar{
  width:2px;
  height:0;
}

.wov-modal::-webkit-scrollbar-button{
  display:none;
  width:0;
  height:0;
}

.wov-modal::-webkit-scrollbar-track{
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.08));
  border-radius:999px;
}

.wov-modal::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,.5));
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 0 10px rgba(255,255,255,.22);
}

.wov-modal::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.64));
}

.wov-modal::-webkit-scrollbar-corner{
  background:transparent;
}

/* VIP & unlucky modals use same base .wov-modal style (unified) */

.wov-modal.preview-pending{
  animation:wovOpen .48s cubic-bezier(.16,.9,.3,1) both, previewPulse 2.8s ease-in-out infinite;
}

@keyframes previewPulse{
  0%,100%{filter:saturate(1) brightness(1);}
  50%{filter:saturate(1.08) brightness(1.03);}
}
/* Ambient glow ring */
.wov-modal::before{
  content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;
  background:conic-gradient(from 180deg,rgba(167,139,250,.5),rgba(245,158,11,.4),rgba(56,189,248,.35),rgba(167,139,250,.5));
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;opacity:.55;animation:wovGlowSpin 6s linear infinite;
}
@keyframes wovGlowSpin{to{filter:hue-rotate(360deg);}}
@keyframes wovOpen{
  from{transform:translateY(24px) scale(.92);opacity:0;filter:blur(6px);}
  to{transform:none;opacity:1;filter:blur(0);}
}

/* ── Header ── */
.wov-header{
  position:relative;width:100%;display:flex;align-items:center;justify-content:space-between;
  padding:6px 4px 14px;
}
.wov-header::after{
  content:'';position:absolute;bottom:0;left:8%;right:8%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(167,139,250,.5),rgba(245,158,11,.35),transparent);
}
.wov-badge{
  font-size:18px;font-weight:900;color:#e9e0ff;
  letter-spacing:.5px;
  text-shadow:0 0 28px rgba(167,139,250,.6),0 0 56px rgba(167,139,250,.25);
  animation:wovBadgePulse 3s ease-in-out infinite;
}
@keyframes wovBadgePulse{
  0%,100%{text-shadow:0 0 28px rgba(167,139,250,.6),0 0 56px rgba(167,139,250,.25);}
  50%{text-shadow:0 0 36px rgba(167,139,250,.8),0 0 72px rgba(167,139,250,.35);}
}
.wov-x{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);
  border-radius:50%;width:34px;height:34px;color:rgba(255,255,255,.7);font-size:16px;font-weight:700;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all .2s;flex-shrink:0;
}
.wov-x:hover{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.5);color:#fff;transform:rotate(90deg);}

/* ── Session chip ── */
.wov-sess-chip{
  background:rgba(255,255,255,.06);backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:5px 16px;
  font-size:11px;font-weight:700;color:#94a3b8;
  margin:12px auto 10px;display:table;letter-spacing:.3px;
}

/* ── Prize Card ── */
.wcard{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,rgba(20,26,52,.88),rgba(10,14,36,.94));
  border:1px solid rgba(148,163,184,.22);
  border-radius:22px;
  padding:22px 20px 20px;
  width:100%;text-align:center;
  box-shadow:
    0 20px 50px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(0,0,0,.3);
  backdrop-filter:blur(6px);
}
.wcard > *{position:relative;z-index:1;}
/* Prize image background layer */
.wcard.has-prize-bg::before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(180deg,rgba(8,12,24,.55) 0%,rgba(6,10,20,.72) 60%,rgba(4,8,18,.88) 100%),
    var(--wcard-prize-bg);
  background-size:cover;background-position:center;background-repeat:no-repeat;
  z-index:0;
  animation:wCardBgFade .6s ease-out;
}
@keyframes wCardBgFade{from{opacity:0;}to{opacity:1;}}

@keyframes wIn{from{transform:translateY(14px) scale(.96);opacity:0;}to{transform:none;opacity:1;}}

/* Prize emoji icon */
.wem{font-size:42px;margin-bottom:6px;display:block;filter:drop-shadow(0 4px 12px rgba(0,0,0,.5));}
.wprize-img{width:68px;height:68px;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.28);box-shadow:0 8px 20px rgba(0,0,0,.4),0 0 16px rgba(124,58,237,.15);display:block;margin:0 auto;}

/* Prize name */
.wname{
  font-size:24px;font-weight:900;color:#f1f5f9;line-height:1.2;margin-bottom:6px;
  text-shadow:0 2px 8px rgba(0,0,0,.6),0 0 20px rgba(0,0,0,.3);
  word-break:break-word;
  overflow-wrap:break-word;
  hyphens:auto;
}

/* Category chip */
.wcateg{
  background:rgba(148,163,184,.1);backdrop-filter:blur(4px);
  border:1px solid rgba(148,163,184,.2);
  border-radius:8px;padding:4px 12px;font-size:12px;color:#94a3b8;
  margin:0 auto 10px;display:inline-block;
}

.wpreview-tags{
  display:flex;
  justify-content:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.wpreview-tag{
  padding:4px 10px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#dbeafe;
  border:1px solid rgba(148,163,184,.34);
  background:rgba(30,41,59,.48);
}

.wpreview-tag.accent{
  color:#fef3c7;
  border-color:rgba(245,158,11,.42);
  background:rgba(120,53,15,.35);
}

.wpreview-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:0 0 10px;
}

.wpreview-timeline{
  margin:2px 0 12px;
  padding:10px;
  border:1px solid rgba(148,163,184,.22);
  border-radius:12px;
  background:linear-gradient(160deg,rgba(15,23,42,.5),rgba(15,23,42,.3));
  display:grid;
  gap:7px;
  max-height:none;
  overflow:visible;
}

.wpreview-event{
  display:grid;
  grid-template-columns:18px 1fr auto;
  gap:8px;
  align-items:flex-start;
  font-size:13px;
}

.wpreview-event .dot{
  width:9px;
  height:9px;
  border-radius:50%;
  margin-top:3px;
  background:linear-gradient(135deg,#a78bfa,#60a5fa);
  box-shadow:0 0 0 3px rgba(124,58,237,.18);
}

.wpreview-event .txt{color:#e2e8f0;line-height:1.35;}
.wpreview-event .time{color:#94a3b8;font-size:12px;white-space:nowrap;}

.wpreview-event.pending .dot{background:linear-gradient(135deg,#f59e0b,#fbbf24);box-shadow:0 0 0 3px rgba(245,158,11,.16);}
.wpreview-event.fail .dot{background:linear-gradient(135deg,#94a3b8,#64748b);box-shadow:0 0 0 3px rgba(100,116,139,.2);}
.wpreview-event.ok .dot{background:linear-gradient(135deg,#22c55e,#10b981);box-shadow:0 0 0 3px rgba(16,185,129,.18);}

.wmeta-item{
  text-align:left;
  border:1px solid rgba(148,163,184,.26);
  border-radius:10px;
  background:rgba(15,23,42,.42);
  padding:8px 10px;
}

.wmeta-item .lbl{
  display:block;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:#94a3b8;
  font-weight:700;
}

.wmeta-item .val{
  display:block;
  margin-top:3px;
  font-size:14px;
  line-height:1.35;
  color:#f1f5f9;
  font-weight:800;
  word-break:break-word;
}

.wstatus-badge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}
.wstatus-badge::before{
  content:'';
  display:inline-block;
  width:6px;
  height:6px;
  border-radius:50%;
  flex-shrink:0;
}
.wstatus-pending{
  background:rgba(245,158,11,.15);
  border:1px solid rgba(245,158,11,.38);
  color:#fbbf24;
}
.wstatus-pending::before{background:#f59e0b;box-shadow:0 0 5px #f59e0b;}
.wstatus-confirmed{
  background:rgba(16,185,129,.15);
  border:1px solid rgba(16,185,129,.38);
  color:#34d399;
}
.wstatus-confirmed::before{background:#10b981;box-shadow:0 0 5px #10b981;}
.wstatus-done{
  background:rgba(34,197,94,.15);
  border:1px solid rgba(34,197,94,.38);
  color:#4ade80;
}
.wstatus-done::before{background:#22c55e;box-shadow:0 0 5px #22c55e;}
.wstatus-declined{
  background:rgba(100,116,139,.15);
  border:1px solid rgba(100,116,139,.35);
  color:#94a3b8;
}
.wstatus-declined::before{background:#64748b;}

/* Level badge */
.wlevel{
  display:inline-flex;align-items:center;gap:5px;
  border-radius:999px;padding:6px 16px;
  font-size:12px;font-weight:800;margin-bottom:12px;
  cursor:default;letter-spacing:.3px;
}
.wlevel.vip{
  background:linear-gradient(135deg,#f59e0b,#fbbf24);
  color:#451a03;
  box-shadow:0 4px 20px rgba(245,158,11,.45),0 0 40px rgba(245,158,11,.15);
}
.wlevel.lucky{
  background:linear-gradient(135deg,#3b82f6,#60a5fa);
  color:#eff6ff;
  box-shadow:0 4px 18px rgba(59,130,246,.35),0 0 35px rgba(59,130,246,.12);
}
.wlevel.unlucky{
  background:linear-gradient(135deg,#64748b,#94a3b8);
  color:#f1f5f9;
  box-shadow:0 4px 16px rgba(100,116,139,.35),0 0 30px rgba(100,116,139,.12);
}
/* ── Action box variants ── */
.wab-cskh{
  background:linear-gradient(180deg,rgba(22,101,52,.18),rgba(15,76,42,.12));
  backdrop-filter:blur(8px);
  border:1px solid rgba(134,239,172,.35);
  color:#dcfce7;
  font-size:14px;
  line-height:1.65;
  border-radius:16px;
  padding:14px 16px;
  text-align:center;
  display:grid;
  gap:6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 26px rgba(22,101,52,.16);
}
.wab-cskh-title{
  font-size:15px;
  font-weight:800;
  letter-spacing:.1px;
  color:#bbf7d0;
}
.wab-cskh-body{
  font-size:13px;
  font-weight:600;
  color:#ecfdf5;
  opacity:.96;
}
.wab-cskh-pending{
  border-color:rgba(110,231,183,.48);
  background:linear-gradient(180deg,rgba(6,95,70,.24),rgba(6,78,59,.15));
  box-shadow:0 10px 30px rgba(16,185,129,.14),inset 0 1px 0 rgba(255,255,255,.1);
}
.wab-cskh-pending .wab-cskh-title{
  color:#a7f3d0;
}
.wab-cskh-btn{
  display:flex;align-items:center;justify-content:center;gap:7px;width:100%;
  margin-top:10px;padding:11px 16px;
  background:linear-gradient(135deg,#7c3aed 0%,#6d28d9 50%,#5b21b6 100%);
  border:none;border-radius:12px;color:#fff;
  font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;
  transition:all .25s cubic-bezier(.4,0,.2,1);
  box-shadow:0 6px 24px rgba(124,58,237,.35),0 0 40px rgba(124,58,237,.1);
  position:relative;overflow:hidden;
}
.wab-cskh-btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 60%);
  opacity:0;transition:opacity .25s;
}
.wab-cskh-btn:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(124,58,237,.5),0 0 50px rgba(124,58,237,.18);}
.wab-cskh-btn:hover::before{opacity:1;}
.wab-cskh-btn:active{transform:translateY(0) scale(.98);}
.wab-cskh-icon{font-style:normal;font-size:18px;}

@media (max-width: 640px){
  .wab-cskh{padding:12px 12px;gap:5px;}
  .wab-cskh-title{font-size:14px;}
  .wab-cskh-body{font-size:12.5px;line-height:1.6;}
}

.wab-declined{
  background:rgba(71,85,105,.12);backdrop-filter:blur(4px);
  border:1px solid rgba(148,163,184,.3);color:#cbd5e1;
  font-size:14px;font-weight:600;border-radius:16px;padding:14px 16px;text-align:center;
}
.wab-converted{
  background:rgba(21,128,61,.14);backdrop-filter:blur(4px);
  border:1px solid rgba(74,222,128,.35);color:#86efac;
  font-size:14px;font-weight:700;border-radius:16px;padding:14px 16px;text-align:center;
}

/* Cash conversion box — golden glow */
.wab-cash{
  background:linear-gradient(180deg,rgba(120,70,18,.22),rgba(60,28,6,.18));
  backdrop-filter:blur(6px);
  border:1.5px solid rgba(245,158,11,.45);
  border-radius:14px;padding:14px 16px;
  box-shadow:0 0 30px rgba(245,158,11,.08),inset 0 1px 0 rgba(245,158,11,.15);
}
.wab-cash-title{font-size:13px;font-weight:700;color:#fde68a;margin-bottom:4px;letter-spacing:.3px;}
.wab-cash-amt{
  font-size:26px;font-weight:900;margin-bottom:10px;letter-spacing:.4px;
  background:linear-gradient(135deg,#f59e0b,#fbbf24,#f59e0b);
  background-size:200% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  animation:wCashShimmer 3s ease-in-out infinite;
  filter:drop-shadow(0 2px 8px rgba(245,158,11,.35));
}
@keyframes wCashShimmer{0%,100%{background-position:0% 50%;}50%{background-position:100% 50%;}}

.wab-cash-btns{display:flex;gap:10px;}
.wab-btn-convert{
  flex:1;border:none;border-radius:10px;padding:10px 14px;
  font-size:13px;font-weight:800;cursor:pointer;font-family:inherit;
  background:linear-gradient(135deg,#d97706,#f59e0b);color:#fff;
  box-shadow:0 4px 18px rgba(245,158,11,.3);
  transition:all .22s cubic-bezier(.4,0,.2,1);
  position:relative;overflow:hidden;
}
.wab-btn-convert::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.2),transparent 60%);
  opacity:0;transition:opacity .22s;
}
.wab-btn-convert:hover{transform:translateY(-2px);box-shadow:0 6px 26px rgba(245,158,11,.45);}
.wab-btn-convert:hover::before{opacity:1;}
.wab-btn-convert:active{transform:translateY(0) scale(.97);}

.wab-btn-decline{
  background:rgba(255,255,255,.06);backdrop-filter:blur(4px);
  border:1px solid rgba(203,213,225,.35);
  border-radius:10px;padding:10px 14px;color:#e2e8f0;
  font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
  transition:all .22s;
}
.wab-btn-decline:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);}
.wab-btn-convert:disabled,.wab-btn-decline:disabled{opacity:.55;cursor:not-allowed;filter:none;transform:none;}

/* View image — glass button */
.wab-view-image-btn{
  display:flex;align-items:center;justify-content:center;gap:6px;width:100%;
  margin-top:10px;padding:10px 14px;
  background:rgba(15,23,42,.45);backdrop-filter:blur(8px);
  border:1px solid rgba(148,163,184,.35);
  border-radius:12px;color:#e2e8f0;
  font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
  transition:all .22s cubic-bezier(.4,0,.2,1);
}
.wab-view-image-btn:hover{
  background:rgba(30,41,59,.55);border-color:rgba(167,139,250,.5);
  box-shadow:0 4px 20px rgba(124,58,237,.15);
  transform:translateY(-1px);
}

/* ── Bottom buttons ── */
.wsnap{
  border:none;border-radius:12px;padding:11px 20px;
  color:#fff;font-size:14px;font-weight:800;
  cursor:pointer;font-family:inherit;margin-top:14px;width:100%;
  background:linear-gradient(135deg,#047857 0%,#10b981 50%,#34d399 100%);
  box-shadow:0 8px 28px rgba(16,185,129,.3),0 0 40px rgba(16,185,129,.08);
  transition:all .25s cubic-bezier(.4,0,.2,1);
  position:relative;overflow:hidden;flex-shrink:0;
}

.wov-pro-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin-top:12px;
}

.wov-pro-actions .wsnap{
  margin-top:0;
  width:100%;
  padding:10px 12px;
  font-size:12px;
  border-radius:10px;
}

.wsnap-share{background:linear-gradient(135deg,#0f766e,#14b8a6,#2dd4bf);}
.wsnap-download{background:linear-gradient(135deg,#1d4ed8,#2563eb,#60a5fa);}
.wsnap-capture{background:linear-gradient(135deg,#047857,#10b981,#34d399);}
.wsnap::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.15),transparent 60%);
  opacity:0;transition:opacity .25s;
}
.wsnap:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(16,185,129,.42);}
.wsnap:hover::before{opacity:1;}
.wsnap:active{transform:translateY(0) scale(.98);}

.wthanks{
  margin-top:8px;
  background:rgba(148,163,184,.08);backdrop-filter:blur(4px);
  border:1px solid rgba(148,163,184,.2);
  border-radius:999px;padding:8px 16px;
  color:#94a3b8;font-size:12px;font-weight:600;
  cursor:default;text-align:center;flex-shrink:0;
}

#wActionBox{margin-top:2px;}

@media (max-width: 640px){
  .win-ov{
    align-items:flex-start;
    padding:calc(env(safe-area-inset-top) + 8px) 8px calc(env(safe-area-inset-bottom) + 10px);
    backdrop-filter:blur(10px) saturate(1.2);
    -webkit-backdrop-filter:blur(10px) saturate(1.2);
  }

  .wov-modal{
    width:100%;
    padding:12px 10px 12px;
    border-radius:18px;
    max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 16px);
    overflow:auto;
  }

  .wov-header{padding:4px 2px 10px;}
  .wov-badge{font-size:14px;letter-spacing:.2px;}
  .wov-x{width:30px;height:30px;font-size:14px;}
  .wov-sess-chip{font-size:10px;padding:4px 10px;margin:8px auto 8px;}

  .wcard{padding:14px 12px 12px;border-radius:14px;}
  .wem{font-size:34px;margin-bottom:4px;}
  .wprize-img{width:60px;height:60px;border-radius:12px;}
  .wname{font-size:20px;line-height:1.25;margin-bottom:6px;padding:0 2px;}
  .wcateg{font-size:11px;padding:3px 9px;margin-bottom:8px;}

  .wpreview-tags{justify-content:flex-start;gap:5px;margin-bottom:8px;}
  .wpreview-tag{font-size:9px;padding:4px 8px;}

  .wpreview-meta{grid-template-columns:1fr;gap:6px;margin-bottom:8px;}
  .wmeta-item{padding:7px 8px;border-radius:9px;}
  .wmeta-item .lbl{font-size:9px;}
  .wmeta-item .val{font-size:12px;line-height:1.3;}

  .wlevel{
    width:100%;
    justify-content:center;
    padding:6px 10px;
    font-size:11px;
    margin-bottom:8px;
  }

  .wpreview-timeline{max-height:124px;padding:8px;gap:6px;margin-bottom:10px;}
  .wpreview-event{grid-template-columns:14px 1fr;gap:6px;font-size:11px;}
  .wpreview-event .dot{width:8px;height:8px;margin-top:2px;}
  .wpreview-event .time{grid-column:2;font-size:10px;}

  .wab-cskh,
  .wab-declined,
  .wab-converted,
  .wab-cash{font-size:12px;padding:10px 11px;border-radius:12px;}
  .wab-cash-amt{font-size:20px;margin-bottom:8px;}
  .wab-cash-btns{flex-direction:column;gap:6px;}
  .wab-btn-convert,
  .wab-btn-decline,
  .wab-cskh-btn,
  .wab-view-image-btn{width:100%;font-size:12px;padding:9px 11px;}

  .wov-pro-actions{grid-template-columns:1fr;gap:6px;margin-top:10px;}
  .wov-pro-actions .wsnap{padding:9px 10px;font-size:12px;border-radius:9px;}
  .wthanks{margin-top:7px;padding:7px 12px;font-size:11px;}
}

@media (max-width: 380px){
  .wov-badge{font-size:13px;}
  .wname{font-size:18px;line-height:1.25;}
  .wpreview-timeline{max-height:106px;}
  .wov-pro-actions .wsnap{font-size:11px;}
}

/* ── Prize Lightbox ── */
.wov-lightbox{
  position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;
  background:rgba(2,1,10,.88);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  padding:20px;
}
.wov-lightbox.open{display:flex;animation:wovLbIn .32s ease-out;}
@keyframes wovLbIn{from{opacity:0;}to{opacity:1;}}
.wov-lb-inner{
  position:relative;max-width:min(92vw,640px);max-height:88vh;
  animation:wovLbZoom .35s cubic-bezier(.16,.9,.3,1);
}
@keyframes wovLbZoom{from{transform:scale(.88);opacity:0;}to{transform:none;opacity:1;}}
.wov-lb-close{
  position:absolute;top:-14px;right:-14px;
  width:38px;height:38px;border-radius:50%;
  background:rgba(15,10,30,.85);border:1px solid rgba(167,139,250,.5);
  color:#fff;font-size:18px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 16px rgba(0,0,0,.4);
  transition:all .2s;z-index:2;
}
.wov-lb-close:hover{background:rgba(245,158,11,.25);border-color:rgba(245,158,11,.6);transform:rotate(90deg);}
.wov-lb-img{
  display:block;max-width:100%;max-height:88vh;border-radius:16px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 20px 60px rgba(0,0,0,.6),0 0 60px rgba(124,58,237,.12);
}

/* ── Celebrate Overlay (boxes-redesign inspired) ── */
.celebrate-ov{
  position:fixed;
  inset:0;
  z-index:9998;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  opacity:0;
  transition:opacity .28s ease;
}

.celebrate-ov.show{opacity:1;pointer-events:auto;}

.celebrate-backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,2,12,.76);
  backdrop-filter:blur(8px);
}

.celebrate-card{
  position:relative;
  z-index:1;
  width:min(92vw,430px);
  border-radius:24px;
  border:1px solid rgba(139,92,246,.58);
  background:linear-gradient(150deg,rgba(20,10,50,.98),rgba(50,18,110,.95),rgba(15,8,38,.98));
  box-shadow:0 0 100px rgba(139,92,246,.4),0 40px 80px rgba(0,0,0,.5),inset 0 1px 0 rgba(196,181,253,.18),inset 0 -1px 0 rgba(0,0,0,.4);
  padding:28px 20px 20px;
  text-align:center;
  transform:scale(.84) translateY(28px);
  transition:transform .45s cubic-bezier(.34,1.56,.64,1);
}

.celebrate-ov.show .celebrate-card{transform:scale(1) translateY(0);}

.celebrate-media{
  width:104px;
  height:104px;
  margin:0 auto 12px;
  border-radius:22px;
  border:1px solid rgba(196,181,253,.45);
  background:linear-gradient(145deg,rgba(167,139,250,.22),rgba(76,29,149,.32));
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 30px rgba(0,0,0,.42),0 0 26px rgba(167,139,250,.35);
}

.celebrate-media.has-image{padding:6px;}

.celebrate-icon{font-size:64px;line-height:1;filter:drop-shadow(0 0 22px rgba(251,191,36,.55));}
.celebrate-media-img{width:100%;height:100%;object-fit:cover;border-radius:16px;border:1px solid rgba(255,255,255,.3);}

.celebrate-rarity{
  display:inline-block;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(196,181,253,.45);
  color:#ddd6fe;
  font-size:10px;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  background:rgba(124,58,237,.18);
}

.celebrate-name{margin-top:10px;color:#ece5ff;font-size:22px;font-weight:900;letter-spacing:.03em;line-height:1.3;}
.celebrate-value{margin-top:4px;color:#fbbf24;font-size:20px;font-weight:900;text-shadow:0 0 24px rgba(251,191,36,.5);}
.celebrate-hint{margin-top:8px;color:rgba(196,181,253,.58);font-size:11px;letter-spacing:.08em;}

.celebrate-ring{
  position:absolute;
  right:10px;
  bottom:10px;
  width:40px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#c4b5fd;
  font-family:'Orbitron',sans-serif;
  font-size:12px;
  font-weight:700;
}

.celebrate-ring svg{position:absolute;inset:0;transform:rotate(-90deg);}
.celebrate-ring-bg{fill:none;stroke:rgba(196,181,253,.24);stroke-width:3;}
.celebrate-ring-fg{fill:none;stroke:#c4b5fd;stroke-width:3;stroke-dasharray:94.2;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear;}
.celebrate-ring-fg.active{stroke:#fbbf24;}

/* Eye icon button on opened box */
.box-eye{
  position:absolute;
  top:-14px;
  right:-12px;
  left:auto;
  width:38px;
  height:38px;
  border-radius:50%;
  background:linear-gradient(135deg,rgba(25,20,50,.95),rgba(46,27,82,.95));
  border:1.5px solid rgba(196,181,253,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  cursor:pointer;
  transition:transform .15s,box-shadow .15s,background .15s;
  z-index:6;
  box-shadow:0 8px 20px rgba(0,0,0,.35),0 0 0 1px rgba(124,58,237,.25) inset;
}
.box-eye:hover{
  transform:translateY(-1px) scale(1.07);
  background:linear-gradient(135deg,rgba(44,30,86,.98),rgba(68,39,122,.98));
  box-shadow:0 12px 26px rgba(0,0,0,.45),0 0 18px rgba(124,58,237,.45);
}

/* "Chúc mừng!" button on opened box card */
.rchuc{margin-top:8px;border:none;border-radius:20px;padding:6px 14px;background:linear-gradient(90deg,#f59e0b,#fbbf24);color:#1c1408;font-size:12px;font-weight:900;cursor:pointer;font-family:inherit;transition:all .2s;}
.rchuc:hover{transform:scale(1.07);}
/* "Đang chờ" label on locked boxes */
.gwait-label{font-size:11px;color:#a78bfa;margin-top:4px;opacity:.85;}

/* ---- Approval Waiting Screen ---- */
.aws-screen{position:absolute;inset:0;z-index:95;background:radial-gradient(ellipse 130% 75% at 50% 0%,rgba(88,28,220,.48) 0%,transparent 52%),radial-gradient(ellipse 85% 65% at 80% 100%,rgba(217,119,6,.24) 0%,transparent 52%),linear-gradient(178deg,#080418 0%,#1c0f52 35%,#0d133c 70%,#090718 100%);display:flex;align-items:center;justify-content:center;overflow:auto;}
.aws-inner{max-width:560px;width:90%;text-align:center;padding:32px 20px;}
.aws-title{font-size:20px;font-weight:900;color:#f59e0b;text-transform:uppercase;letter-spacing:.5px;text-shadow:0 0 30px rgba(245,158,11,.5);margin-bottom:24px;line-height:1.3;}
.aws-countdown-wrap{background:rgba(10,8,30,.65);border:2px solid rgba(255,255,255,.15);border-radius:16px;padding:18px 32px;margin-bottom:24px;display:inline-block;}
.aws-countdown{font-size:64px;font-weight:900;color:#fff;letter-spacing:8px;font-family:monospace;text-shadow:0 0 32px rgba(255,255,255,.5),0 0 70px rgba(255,255,255,.18);}
.aws-prize-card{background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:22px 32px;margin-bottom:22px;display:inline-block;min-width:220px;box-shadow:0 8px 32px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.15);}
.aws-prize-icon{font-size:42px;margin-bottom:8px;}
.aw-prize-img{width:72px;height:72px;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.3);box-shadow:0 8px 18px rgba(0,0,0,.3);display:block;margin:0 auto;}
.aws-prize-name{font-size:22px;font-weight:800;color:#fff;margin-bottom:12px;}
.aws-badge{background:linear-gradient(90deg,#d97706,#f59e0b);color:#1c1408;border:none;border-radius:999px;padding:7px 18px;font-size:13px;font-weight:800;cursor:default;}
.aws-assistant-wrap{display:flex;align-items:center;gap:12px;max-width:520px;margin:0 auto 14px;padding:10px 12px;border:1px solid rgba(125,211,252,.36);border-radius:16px;background:linear-gradient(140deg,rgba(15,23,42,.75),rgba(3,105,161,.2));}
.aws-robot-img{width:84px;height:84px;flex:0 0 84px;border-radius:14px;object-fit:cover;border:1px solid rgba(148,163,184,.5);box-shadow:0 8px 20px rgba(2,6,23,.45);background:#e2e8f0;}
.aws-assistant-bubble{text-align:left;flex:1;min-width:0;}
.aws-assistant-title{font-size:12px;font-weight:900;letter-spacing:.08em;color:#67e8f9;margin-bottom:4px;}
.aws-assistant-text{font-size:13px;line-height:1.45;color:#e0f2fe;font-weight:600;}
.aws-msg-list{margin:20px 0;display:flex;flex-direction:column;gap:8px;}
.aws-msg{font-size:14px;color:#c4b5fd;line-height:1.6;}
.aws-hl{color:#f59e0b;font-weight:800;}
.aws-conn-row{display:flex;align-items:center;gap:8px;justify-content:center;font-size:13px;color:#4ade80;font-weight:700;margin-bottom:10px;}
.aws-dot-green{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55e;animation:awDotPulse 1.4s ease-in-out infinite;}
@keyframes awDotPulse{0%,100%{opacity:1;}50%{opacity:.4;}}
.aws-progress-wrap{background:rgba(255,255,255,.12);border-radius:999px;height:6px;overflow:hidden;margin-bottom:10px;}
.aws-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,#f59e0b,#fbbf24);border-radius:999px;animation:awProgress 120s linear forwards;}
@keyframes awProgress{from{width:0%;}to{width:88%;}}
.aws-note{font-size:12px;color:#8b84ad;}
.aws-btn{display:inline-block;padding:14px 28px;border-radius:12px;font-size:16px;font-weight:800;border:none;cursor:pointer;transition:transform .15s,box-shadow .15s;min-width:160px;}
.aws-btn:active{transform:scale(.96);}
.aws-btn-accept{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;box-shadow:0 4px 20px rgba(34,197,94,.4);}
.aws-btn-accept:hover{box-shadow:0 6px 28px rgba(34,197,94,.6);}
.aws-btn-decline{background:rgba(255,255,255,.1);color:#e2e8f0;border:1px solid rgba(255,255,255,.2);}
.aws-btn-decline:hover{background:rgba(255,255,255,.15);}
.aws-btn-support{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#fff;box-shadow:0 4px 20px rgba(37,99,235,.35);}
.aws-btn-support:hover{box-shadow:0 6px 26px rgba(37,99,235,.5);transform:translateY(-1px);}

/* Timeout state visual polish */
.aws-screen.timeout-state .aws-title{
  color:#fda4af;
  text-shadow:0 0 26px rgba(244,63,94,.35);
}

.aws-screen.timeout-state .aws-assistant-wrap{
  border-color:rgba(244,114,182,.45);
  background:linear-gradient(140deg,rgba(42,18,48,.8),rgba(127,29,29,.22));
  box-shadow:0 10px 28px rgba(15,23,42,.45);
}

.aws-screen.timeout-state .aws-msg-list{
  max-width:560px;
  margin:16px auto 10px;
  padding:14px 16px;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(30,16,38,.78),rgba(30,16,38,.58));
  border:1px solid rgba(251,113,133,.35);
  box-shadow:0 10px 24px rgba(15,23,42,.35);
}

.aws-screen.timeout-state .aws-msg{
  color:#fbcfe8;
  font-size:15px;
  line-height:1.55;
}

.aws-screen.timeout-state .aws-hl{
  color:#fde68a;
  text-shadow:0 0 10px rgba(245,158,11,.25);
}

.aws-screen.timeout-state #awActionButtons{
  display:flex;
  justify-content:center;
  margin-top:14px !important;
}

.aws-screen.timeout-state .aws-btn-support{
  min-width:280px;
  background:linear-gradient(135deg,#38bdf8 0%,#2563eb 45%,#7c3aed 100%);
  border:1px solid rgba(147,197,253,.65);
  box-shadow:0 12px 30px rgba(37,99,235,.34),0 0 0 1px rgba(255,255,255,.18) inset;
  animation:awsSupportPulse 2s ease-in-out infinite;
}

.aws-screen.timeout-state .aws-btn-support:hover{
  transform:translateY(-2px) scale(1.02);
  box-shadow:0 16px 36px rgba(37,99,235,.44),0 0 0 1px rgba(255,255,255,.26) inset;
}

.aws-screen.timeout-state .aws-note{
  color:#d8b4fe;
  font-size:13px;
}

@keyframes awsSupportPulse{
  0%,100%{filter:brightness(1);}
  50%{filter:brightness(1.1);}
}

@media (max-width: 768px){
  body.lmb-mobile-lite #bgCanvas,
  body.lmb-mobile-lite .aurora,
  body.lmb-mobile-lite .stars,
  body.lmb-mobile-lite .game-floating-feed,
  body.lmb-mobile-lite .home-floating-feed,
  body.lmb-mobile-lite .game-theme-bg{
    display:none !important;
  }

  body.lmb-mobile-lite #screen-game,
  body.lmb-mobile-lite #screen-login{
    background:#070b16 !important;
  }

  body.lmb-mobile-lite .nhp-orb,
  body.lmb-mobile-lite .nhp-stars span,
  body.lmb-mobile-lite .nhp-blob,
  body.lmb-mobile-lite .nhp-shape,
  body.lmb-mobile-lite .nhp-grid,
  body.lmb-mobile-lite .nhp-glow,
  body.lmb-mobile-lite .nhp-shimmer{
    animation:none !important;
    transition:none !important;
    filter:none !important;
  }
}

/* ---- Redesign Overrides: Boxes + Approval ---- */

.boxes-wrap{
  max-width:920px;
  margin:0 auto;
}

.boxes-row{
  gap:28px;
  align-items:flex-start;
}

.box-wrap{
  flex:0 0 auto;
  width:278px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  animation:fadeUp .65s cubic-bezier(.22,1,.36,1) both;
}

.box-wrap:nth-child(2){animation-delay:.12s;}
.box-wrap:nth-child(3){animation-delay:.24s;}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(30px) scale(.95);}
  to{opacity:1;transform:translateY(0) scale(1);}
}


.gcard.gift-card{
  width:278px;
  height:362px;
  border-radius:24px;
  border:1px solid rgba(52,211,153,.44);
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:0;
  overflow:hidden;
  background:linear-gradient(168deg,rgba(4,22,18,.99) 0%,rgba(6,44,30,.98) 28%,rgba(9,66,44,.95) 58%,rgba(5,32,22,.99) 100%);
  box-shadow:
    0 0 0 1.5px rgba(52,211,153,.12) inset,
    0 0 55px rgba(34,197,94,.22),
    0 26px 80px rgba(0,0,0,.68),
    inset 0 1px 0 rgba(134,239,172,.22),
    inset 0 -1px 0 rgba(0,0,0,.45);
}

.box-caption{
  width:100%;
  text-align:center;
  padding:2px 6px 0;
}

.box-caption-title{
  font-family:'Orbitron',sans-serif;
  font-size:20px;
  line-height:1.1;
  font-weight:900;
  color:#ffffff;
  text-shadow:0 4px 16px rgba(17,24,39,.5),0 0 14px rgba(134,239,172,.3);
  letter-spacing:.02em;
}

.box-caption-sub{
  margin-top:6px;
  display:block;
  width:100%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:12px;
  line-height:1.3;
  font-weight:700;
  color:rgba(187,247,208,.92);
  text-shadow:0 2px 10px rgba(17,24,39,.4);
}

.box-wrap-opened .box-caption-sub{
  color:#fde68a;
}

.gcard.gift-card::before,
.gcard.gift-card::after{content:'';position:absolute;pointer-events:none;z-index:2;}

.gcard.gift-card::before{
  top:0;left:0;width:68px;height:68px;
  border-top:1.5px solid rgba(52,211,153,.55);
  border-left:1.5px solid rgba(52,211,153,.55);
  border-radius:24px 0 0 0;
}

.gcard.gift-card::after{
  bottom:0;right:0;width:68px;height:68px;
  border-bottom:1.5px solid rgba(52,211,153,.32);
  border-right:1.5px solid rgba(52,211,153,.32);
  border-radius:0 0 24px 0;
}

.gift-card .card-shimmer{
  position:absolute;top:0;left:-130%;width:55%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(134,239,172,.08),transparent);
  animation:shimmer 3.5s ease-in-out infinite;
  pointer-events:none;z-index:1;border-radius:22px;
}

@keyframes shimmer{0%{left:-130%;}100%{left:220%;}}

.gcard.gift-card.gift-active{
  cursor:pointer;
  border-color:rgba(110,231,183,.72);
  transition:transform .38s cubic-bezier(.34,1.56,.64,1), box-shadow .38s ease, border-color .28s ease;
  will-change:transform,box-shadow;
  animation:giftActivePulse 2.8s ease-in-out infinite;
}

@keyframes giftActivePulse{
  0%,100%{
    box-shadow:
      0 0 0 1.5px rgba(52,211,153,.14) inset,
      0 0 48px rgba(34,197,94,.28),
      0 26px 72px rgba(0,0,0,.64),
      inset 0 1px 0 rgba(134,239,172,.24);
  }
  50%{
    box-shadow:
      0 0 0 1.5px rgba(52,211,153,.26) inset,
      0 0 80px rgba(34,197,94,.55),
      0 0 140px rgba(34,197,94,.2),
      0 26px 72px rgba(0,0,0,.6),
      inset 0 1px 0 rgba(134,239,172,.38);
  }
}

.gcard.gift-card.gift-active:hover{
  transform:translateY(-10px) scale(1.018);
  border-color:rgba(134,239,172,.88);
  box-shadow:0 0 70px rgba(34,197,94,.52),0 0 140px rgba(34,197,94,.2),0 30px 80px rgba(0,0,0,.64),inset 0 1px 0 rgba(134,239,172,.32);
  animation:none;
}

.gcard.gift-card.gift-active.normal:hover .box-layer{transform:rotateX(12deg) rotateY(-3deg) translateY(-6px);}
.gcard.gift-card.gift-active.vip:hover .box-layer{transform:scale(1.14) rotateX(10deg) rotateY(-3deg) translateY(-12px);}
.gcard.gift-card.gift-active.unlucky:hover .box-layer{transform:rotateX(7deg) rotateY(11deg) skewX(-3deg) translateY(-4px);}

.gcard.gift-card.gift-inactive{opacity:.45;filter:saturate(.3);cursor:default;}

.gift-card .box-area{position:relative;height:200px;display:flex;align-items:center;justify-content:center;overflow:visible;}

.gift-card .tier-orbit,
.gift-card .tier-emblem{position:absolute;pointer-events:none;z-index:4;}

.gift-card .tier-orbit{
  width:188px;
  height:188px;
  left:50%;
  top:54%;
  border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px dashed rgba(255,255,255,.12);
  opacity:0;
}

.gift-card .tier-emblem{
  left:50%;
  top:18px;
  transform:translateX(-50%);
  width:34px;
  height:34px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  font-weight:800;
  backdrop-filter:blur(3px);
  opacity:.95;
}

.gcard.gift-card .box-layer{transition:transform .36s ease,filter .3s ease;}

.gcard.gift-card.normal .box-layer{
  transform:rotateX(8deg) rotateY(-4deg);
  animation:normalTierIdle 2.8s ease-in-out infinite;
}

.gcard.gift-card.normal .tier-emblem{
  color:#dcfce7;
  background:radial-gradient(circle,rgba(34,197,94,.36),rgba(34,197,94,.1));
  border:1px solid rgba(134,239,172,.45);
  box-shadow:0 0 14px rgba(34,197,94,.35);
}

.gcard.gift-card.normal .box-ribbon{
  filter:drop-shadow(0 0 8px rgba(74,222,128,.2));
}

.gcard.gift-card.vip .box-layer{
  transform:scale(1.08) rotateX(14deg) rotateY(-10deg) translateY(-2px);
  animation:vipTierFloat 2s ease-in-out infinite;
}

.gcard.gift-card.vip .tier-orbit{
  opacity:.85;
  border-style:solid;
  border-color:rgba(251,191,36,.38);
  box-shadow:0 0 30px rgba(251,191,36,.26),inset 0 0 26px rgba(251,191,36,.12);
}

.gcard.gift-card.vip .tier-orbit.o1{animation:vipOrbitSpin 4.8s linear infinite;}
.gcard.gift-card.vip .tier-orbit.o2{width:150px;height:150px;border-color:rgba(253,224,71,.45);animation:vipOrbitSpinReverse 3.8s linear infinite;}

.gcard.gift-card.vip .tier-emblem{
  color:#fff7cc;
  background:radial-gradient(circle,rgba(251,191,36,.52),rgba(180,83,9,.2));
  border:1px solid rgba(253,224,71,.6);
  box-shadow:0 0 20px rgba(251,191,36,.5),0 0 34px rgba(245,158,11,.28);
}

.gcard.gift-card.vip .box-lid svg,
.gcard.gift-card.vip .box-body svg{
  filter:drop-shadow(0 0 16px rgba(251,191,36,.34)) drop-shadow(0 10px 20px rgba(0,0,0,.55));
}

.gcard.gift-card.unlucky{
  border-style:dashed;
  border-width:1.5px;
}

.gcard.gift-card.unlucky .box-layer{
  transform:rotateX(6deg) rotateY(8deg) skewX(-2deg);
  filter:saturate(.55) contrast(1.05);
  animation:unluckyTierGlitch 1.2s steps(2,end) infinite;
}

.gcard.gift-card.unlucky .tier-emblem{
  color:#c4b5fd;
  background:radial-gradient(circle,rgba(99,102,241,.38),rgba(49,46,129,.16));
  border:1px solid rgba(165,180,252,.42);
  box-shadow:0 0 14px rgba(99,102,241,.34);
}

.gcard.gift-card.unlucky .box-body::after{
  content:'';
  position:absolute;
  inset:22px 16px 22px 16px;
  background:
    linear-gradient(127deg,transparent 45%,rgba(196,181,253,.34) 46%,transparent 48%),
    linear-gradient(72deg,transparent 52%,rgba(196,181,253,.26) 53%,transparent 56%),
    linear-gradient(164deg,transparent 40%,rgba(147,197,253,.24) 41%,transparent 44%);
  opacity:.72;
  pointer-events:none;
}

.gcard.gift-card.unlucky .box-spark{opacity:.5;animation-duration:1.2s;}
.gcard.gift-card.unlucky .sp2,.gcard.gift-card.unlucky .sp4{display:none;}

.gift-card .box-open-wave{
  position:absolute;
  left:50%;
  top:58%;
  width:28px;
  height:28px;
  border-radius:50%;
  transform:translate(-50%,-50%) scale(.2);
  background:radial-gradient(circle,rgba(190,242,100,.62) 0%,rgba(74,222,128,.18) 40%,rgba(34,197,94,0) 72%);
  box-shadow:0 0 26px rgba(74,222,128,.34),0 0 60px rgba(34,197,94,.18);
  opacity:0;
  pointer-events:none;
  z-index:5;
}

.gift-card.opening-lid-wave .box-open-wave{
  animation:boxOpenWave .6s cubic-bezier(.2,.9,.2,1) forwards;
}

.gift-card .box-glow{
  position:absolute;width:180px;height:120px;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(34,197,94,.28) 0%,transparent 70%);
  opacity:.6;animation:glowPulse 3s ease-in-out infinite;
}

@keyframes glowPulse{0%,100%{transform:scale(1);opacity:.55;}50%{transform:scale(1.15);opacity:.85;}}

.gift-card .box-layer{position:relative;width:140px;height:160px;z-index:2;flex-shrink:0;}
.gift-card .box-lid{position:absolute;top:0;left:0;width:140px;height:46px;transform-origin:center bottom;z-index:3;}
.gift-card .box-lid svg{width:100%;height:100%;filter:drop-shadow(0 -4px 12px rgba(34,197,94,.45));}
.gift-card .box-body{position:absolute;bottom:0;left:0;width:140px;height:118px;z-index:2;}
.gift-card .box-body svg{width:100%;height:100%;filter:drop-shadow(0 8px 20px rgba(0,0,0,.5));}

.gift-card .box-spark{position:absolute;color:#86efac;animation:spkFloat 2.4s ease-in-out infinite;pointer-events:none;user-select:none;z-index:4;font-style:normal;}
.gift-card .sp1{top:-8px;right:-10px;font-size:13px;animation-delay:0s;}
.gift-card .sp2{bottom:20px;left:-14px;font-size:9px;animation-delay:.9s;color:#fde68a;}
.gift-card .sp3{top:30%;left:-18px;font-size:14px;animation-delay:1.6s;color:#22d3ee;opacity:.7;}
.gift-card .sp4{top:10px;left:10px;font-size:8px;animation-delay:.4s;color:#f472b6;opacity:.8;}

@keyframes spkFloat{0%,100%{transform:translateY(0) scale(1) rotate(0deg);opacity:.8;}50%{transform:translateY(-7px) scale(1.25) rotate(15deg);opacity:1;}}

@keyframes boxShake{
  0%,100%{transform:rotate(0);}
  10%{transform:rotate(-4deg) translateX(-3px);}
  20%{transform:rotate(4deg) translateX(3px);}
  30%{transform:rotate(-3deg) translateX(-3px);}
  40%{transform:rotate(3deg) translateX(3px);}
  50%{transform:rotate(-2deg) translateX(-2px);}
  60%{transform:rotate(2deg) translateX(2px);}
  70%{transform:rotate(-1.5deg) translateX(-1px);}
  80%{transform:rotate(1.5deg) translateX(1px);}
  90%{transform:rotate(-.8deg);}
}

@keyframes lidOpen{
  0%{transform:rotate(0) translateY(0);opacity:1;}
  50%{transform:rotate(-38deg) translateY(-12px);opacity:1;}
  100%{transform:rotate(-65deg) translateY(-32px) translateX(-16px);opacity:0;}
}

@keyframes boxFlip{
  0%{transform:rotateY(0deg);}
  50%{transform:rotateY(170deg);}
  100%{transform:rotateY(360deg);}
}

@keyframes boxBounce{
  0%{transform:translateY(0) scale(1);}
  34%{transform:translateY(-18px) scale(1.03);}
  64%{transform:translateY(0) scale(.97);}
  100%{transform:translateY(-4px) scale(1);}
}

@keyframes boxExplode{
  0%{transform:scale(1);filter:brightness(1);}
  35%{transform:scale(1.1);filter:brightness(1.25);}
  70%{transform:scale(.92);filter:brightness(.9);}
  100%{transform:scale(1.16);filter:brightness(1.05);}
}

@keyframes boxFadePulse{
  0%{opacity:1;transform:scale(1);}
  42%{opacity:.58;transform:scale(1.06);}
  100%{opacity:1;transform:scale(1);}
}

@keyframes boxSpin3d{
  0%{transform:rotateX(0deg) rotateY(0deg);}
  100%{transform:rotateX(360deg) rotateY(360deg);}
}

@keyframes boxWarp{
  0%{transform:skewX(0deg) scale(1);}
  34%{transform:skewX(-14deg) scale(1.04);}
  76%{transform:skewX(12deg) scale(.98);}
  100%{transform:skewX(0deg) scale(1);}
}

.gift-card .card-divider{width:calc(100% - 32px);height:1px;margin:0 auto;background:linear-gradient(90deg,transparent,rgba(52,211,153,.6),rgba(74,222,128,.5),rgba(52,211,153,.6),transparent);position:relative;z-index:2;box-shadow:0 0 8px rgba(52,211,153,.28);}

.gift-card .text-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 20px 14px;gap:6px;position:relative;z-index:2;}
.gift-card .box-title{font-family:'Orbitron',sans-serif;font-size:14px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#a7f3d0;text-shadow:0 0 18px rgba(52,211,153,.5);}
.gift-card .box-subtitle{font-size:11px;font-weight:600;color:rgba(167,243,208,.72);letter-spacing:.05em;}

.gift-card .box-hint{margin-top:4px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.1em;color:rgba(187,247,208,.68);animation:hintPulse 2s ease-in-out infinite;}
.gift-card .box-hint-dot{width:5px;height:5px;border-radius:50%;background:#86efac;animation:dotPulse 2s ease-in-out infinite;}

@keyframes hintPulse{0%,100%{opacity:.45;}50%{opacity:1;}}
@keyframes dotPulse{0%,100%{transform:scale(1);opacity:.6;}50%{transform:scale(1.5);opacity:1;}}

.gift-card .btn-open{
  margin-top:8px;padding:9px 24px;border-radius:10px;
  background:linear-gradient(135deg,rgba(34,197,94,.24),rgba(21,128,61,.28));
  border:1px solid rgba(74,222,128,.52);color:#bbf7d0;
  font-family:'Orbitron',sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  box-shadow:0 0 14px rgba(34,197,94,.22),inset 0 1px 0 rgba(255,255,255,.07);
  pointer-events:none;
}

.gift-card .gwait-label{font-size:11px;color:#86efac;margin-top:6px;opacity:.85;}

/* Opened result card: keep opened box visual and reveal reward above it */
.gcard.result-opened{cursor:pointer;}
.gcard.result-opened .box-area{position:relative;}
.gcard.result-opened{
  overflow:visible;
  background:linear-gradient(162deg,rgb(6,42,28),rgb(8,60,40),rgb(5,32,22)) !important;
  border-color:rgba(52,211,153,.82) !important;
  box-shadow:
    0 0 65px rgba(34,197,94,.38),
    0 0 115px rgba(34,197,94,.14),
    0 20px 56px rgba(0,0,0,.66),
    inset 0 0 0 1px rgba(110,231,183,.28) !important;
}

.result-opened-chip{
  position:absolute;
  top:10px;
  right:10px;
  z-index:7;
  padding:4px 11px;
  border-radius:999px;
  font-family:'Orbitron',sans-serif;
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#f0fdf4;
  background:linear-gradient(90deg,rgba(20,150,68,.55),rgba(34,197,94,.58));
  border:1px solid rgba(109,234,161,.62);
  box-shadow:0 0 16px rgba(34,197,94,.42),inset 0 1px 0 rgba(255,255,255,.14);
  backdrop-filter:blur(6px);
}

.gcard.result-vip .result-opened-chip{
  background:linear-gradient(90deg,rgba(245,158,11,.38),rgba(251,191,36,.42));
  border-color:rgba(253,230,138,.68);
  box-shadow:0 0 16px rgba(251,191,36,.4);
}

.gcard.result-unlucky .result-opened-chip{
  background:linear-gradient(90deg,rgba(71,85,105,.52),rgba(100,116,139,.48));
  border-color:rgba(203,213,225,.45);
  box-shadow:0 0 12px rgba(148,163,184,.25);
}
.gcard.result-opened::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  border-radius:22px;
}
.gcard.result-normal::before{
  background:radial-gradient(ellipse 70% 45% at 50% 0%,rgba(34,197,94,.22),transparent 72%);
}
.gcard.result-vip::before{
  background:radial-gradient(ellipse 72% 48% at 50% 0%,rgba(234,179,8,.24),transparent 68%),radial-gradient(ellipse 90% 70% at 50% 100%,rgba(251,191,36,.12),transparent 72%);
}
.gcard.result-opened .box-layer{
  opacity:.2;
  transform:translateY(16px) scale(.95);
  transition:transform .4s ease,opacity .4s ease;
}
.gcard.result-opened .box-lid{
  transform:rotate(-62deg) translate(-12px,-28px);
  opacity:.12;
}
.gcard.result-opened .box-body{opacity:.42;}

.gcard.result-unlucky .box-glow{
  opacity:0;
  background:none;
  filter:none;
}

.gcard.result-normal .box-glow{
  opacity:.9;
  background:radial-gradient(ellipse,rgba(34,197,94,.36) 0%,rgba(34,197,94,.16) 45%,transparent 74%);
  filter:saturate(1.12);
}

.gcard.result-vip .box-glow{
  opacity:.94;
  background:radial-gradient(ellipse,rgba(245,158,11,.42) 0%,rgba(251,191,36,.24) 45%,transparent 74%);
  filter:saturate(1.22);
}

.gcard.result-unlucky{
  border-color:rgba(148,163,184,.42) !important;
  background:linear-gradient(162deg,rgb(6,8,24),rgb(10,14,38),rgb(7,10,26)) !important;
  box-shadow:0 0 45px rgba(59,130,246,.18),0 10px 32px rgba(0,0,0,.56),inset 0 0 0 1px rgba(148,163,184,.18) !important;
}

.gcard.result-normal{
  border-color:rgba(74,222,128,.82) !important;
  background:linear-gradient(162deg,rgb(8,52,36),rgb(10,74,49),rgb(7,42,29)) !important;
  box-shadow:0 0 46px rgba(34,197,94,.36),0 0 90px rgba(34,197,94,.18),inset 0 0 0 1px rgba(134,239,172,.24),0 10px 30px rgba(0,0,0,.56) !important;
}

.gcard.result-vip{
  border-color:rgba(245,158,11,.92) !important;
  background:linear-gradient(162deg,rgb(14,62,34),rgb(70,56,12),rgb(9,44,27)) !important;
  box-shadow:0 0 58px rgba(245,158,11,.5),0 0 112px rgba(251,191,36,.24),inset 0 0 0 1px rgba(253,224,71,.32),0 12px 34px rgba(0,0,0,.62) !important;
}

.gcard.result-opened .result-reward-layer{
  position:absolute;
  left:50%;
  top:44%;
  transform:translate(-50%,-50%) scale(1.08);
  z-index:9;
  overflow:visible;
  opacity:1;
  display:flex;
  align-items:center;
  justify-content:center;
  animation:resultRewardPop .5s cubic-bezier(.34,1.56,.64,1) both;
}

.gcard.result-normal .result-reward-layer::before,
.gcard.result-vip .result-reward-layer::before{
  content:'';
  position:absolute;
  inset:-16px;
  border-radius:24px;
  pointer-events:none;
  z-index:-1;
}

.gcard.result-normal .result-reward-layer::before{
  background:radial-gradient(circle,rgba(59,130,246,.36) 0%,rgba(59,130,246,.14) 46%,transparent 72%);
}

.gcard.result-vip .result-reward-layer::before{
  background:radial-gradient(circle,rgba(253,224,71,.36) 0%,rgba(251,191,36,.18) 46%,transparent 72%);
}

@keyframes resultRewardPop{
  0%{transform:translate(-50%,-50%) scale(0) rotate(-14deg);opacity:0;}
  60%{transform:translate(-50%,-50%) scale(1.2) rotate(3deg);opacity:1;}
  100%{transform:translate(-50%,-50%) scale(1.08) rotate(0);opacity:1;}
}

.gcard.result-opened .result-reward-icon{
  font-size:70px;
  display:inline-grid;
  place-items:center;
  position:relative;
  line-height:1;
  z-index:11;
  cursor:zoom-in;
  filter:drop-shadow(0 0 18px rgba(251,191,36,.58));
  transition:transform .28s cubic-bezier(.22,1,.36,1),filter .28s ease;
}

.gcard.result-opened .result-reward-icon-prize{
  animation:rewardIconIdle 2.4s ease-in-out infinite;
}

.gcard.result-opened .result-reward-icon:hover{
  transform:translateY(-74px) scale(1.56) rotate(-4deg);
  filter:drop-shadow(0 0 22px rgba(251,191,36,.78)) drop-shadow(0 0 52px rgba(168,85,247,.42));
  animation:rewardIconHoverBounce .65s cubic-bezier(.22,1,.36,1) 1;
}

@keyframes rewardIconIdle{
  0%,100%{transform:translateY(0) scale(1) rotate(0deg);}
  50%{transform:translateY(-2px) scale(1.03) rotate(-1deg);}
}

@keyframes rewardIconHoverBounce{
  0%{transform:translateY(0) scale(1) rotate(0deg);}
  55%{transform:translateY(-82px) scale(1.62) rotate(-5deg);}
  100%{transform:translateY(-74px) scale(1.56) rotate(-4deg);}
}

.gcard.result-vip .result-reward-icon{
  font-size:76px;
  filter:drop-shadow(0 0 24px rgba(253,224,71,.8)) drop-shadow(0 0 28px rgba(168,85,247,.45));
}

.gcard.result-normal .result-reward-icon{
  filter:drop-shadow(0 0 16px rgba(59,130,246,.62));
}

.gcard.result-unlucky .result-reward-icon{
  filter:drop-shadow(0 0 18px rgba(96,165,250,.56));
}

.gcard.result-unlucky .result-reward-icon-cry{
  animation:cryFaceIdle .92s ease-in-out infinite;
}

.gcard.result-unlucky .result-reward-icon-cry::before,
.gcard.result-unlucky .result-reward-icon-cry::after{
  content:'💧';
  position:absolute;
  top:52%;
  font-size:18px;
  line-height:1;
  opacity:.95;
  pointer-events:none;
  filter:drop-shadow(0 0 8px rgba(125,211,252,.72));
}

.gcard.result-unlucky .result-reward-icon-cry::before{
  left:8%;
  animation:cryTearLeft 1.18s ease-in infinite;
}

.gcard.result-unlucky .result-reward-icon-cry::after{
  right:8%;
  animation:cryTearRight 1.08s ease-in .2s infinite;
}

.gcard.result-unlucky .result-reward-icon-cry:hover{
  transform:translateY(-66px) scale(1.52) rotate(-6deg);
  filter:drop-shadow(0 0 22px rgba(125,211,252,.82)) drop-shadow(0 0 46px rgba(59,130,246,.5));
  animation:cryFaceHover .5s ease-in-out infinite;
}

.gcard.result-unlucky .result-reward-icon-cry:hover::before{
  animation-duration:.55s;
}

.gcard.result-unlucky .result-reward-icon-cry:hover::after{
  animation-duration:.5s;
}

@keyframes cryFaceIdle{
  0%,100%{transform:translateY(0) rotate(0deg);}
  25%{transform:translateY(1px) rotate(-2deg);}
  75%{transform:translateY(1px) rotate(2deg);}
}

@keyframes cryFaceHover{
  0%,100%{transform:translateY(-66px) scale(1.52) rotate(-6deg);}
  50%{transform:translateY(-68px) scale(1.56) rotate(-3deg);}
}

@keyframes cryTearLeft{
  0%{transform:translate(-2px,-2px) scale(.7);opacity:0;}
  20%{opacity:1;}
  100%{transform:translate(-12px,28px) scale(1.08);opacity:0;}
}

@keyframes cryTearRight{
  0%{transform:translate(2px,-2px) scale(.7);opacity:0;}
  20%{opacity:1;}
  100%{transform:translate(12px,28px) scale(1.08);opacity:0;}
}

.gcard.result-opened .result-reward-image{
  width:108px;
  height:108px;
  padding:6px;
  border-radius:20px;
  position:relative;
  object-fit:cover;
  background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.48);
  box-shadow:0 14px 30px rgba(0,0,0,.42),0 0 28px rgba(251,191,36,.3),inset 0 1px 0 rgba(255,255,255,.35);
  filter:saturate(1.08) contrast(1.06);
  backdrop-filter:blur(2px);
  z-index:11;
  cursor:zoom-in;
  transition:transform .26s cubic-bezier(.22,1,.36,1), box-shadow .26s ease, filter .26s ease;
}

.gcard.result-vip .result-reward-image{
  width:116px;
  height:116px;
  border-color:rgba(253,224,71,.62);
  background:linear-gradient(160deg,rgba(253,224,71,.24),rgba(251,191,36,.08));
  box-shadow:0 16px 34px rgba(0,0,0,.46),0 0 34px rgba(253,224,71,.52),0 0 26px rgba(168,85,247,.38),inset 0 1px 0 rgba(255,255,255,.4);
  filter:saturate(1.14) contrast(1.08);
}

.gcard.result-normal .result-reward-image{
  border-color:rgba(147,197,253,.58);
  background:linear-gradient(160deg,rgba(147,197,253,.22),rgba(59,130,246,.06));
  box-shadow:0 12px 28px rgba(0,0,0,.4),0 0 24px rgba(59,130,246,.4),inset 0 1px 0 rgba(255,255,255,.34);
}

.gcard.result-opened:hover .result-reward-image{
  transform:translateY(-3px) scale(1.04) rotate(-1deg);
  filter:saturate(1.14) contrast(1.1) brightness(1.03);
}

.gcard.result-opened .result-reward-image:hover{
  transform:translateY(-78px) scale(1.62) rotate(-1.5deg);
  box-shadow:0 22px 46px rgba(0,0,0,.55),0 0 38px rgba(251,191,36,.5),0 0 84px rgba(168,85,247,.32),inset 0 1px 0 rgba(255,255,255,.45);
  filter:saturate(1.2) contrast(1.12) brightness(1.05);
}

.gcard.result-vip:hover .result-reward-image{
  transform:translateY(-4px) scale(1.06) rotate(-1.2deg);
}

/* Opened reward preview area */
.gcard.result-opened{
  overflow:visible;
}

.gcard.result-opened .box-area{
  height:208px;
  overflow:visible;
}

.gcard.result-opened .result-reward-layer{
  inset:12px;
  transform:none;
  animation:none;
}

.gcard.result-opened .result-media-shell{
  width:100%;
  height:100%;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.34);
  background:linear-gradient(165deg,rgba(10,18,36,.9),rgba(19,35,74,.82));
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.gcard.result-opened .result-media-shell .result-reward-image{
  width:100%;
  height:100%;
  padding:0;
  border-radius:13px;
  object-fit:cover;
  border:none;
  box-shadow:none;
  filter:none;
  cursor:zoom-in;
  transform:none;
  transition:transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease, border-radius .28s ease;
}

.gcard.result-opened .result-media-shell .result-reward-icon{
  font-size:72px;
  filter:none;
  cursor:default;
  transform:none;
}

.gcard.result-opened .result-reward-image:hover,
.gcard.result-opened .result-reward-icon:hover,
.gcard.result-unlucky .result-reward-icon-cry:hover{
  transform:none;
  animation:none;
}

/* Hover image pops up above card like a thinking-bubble preview. */
.gcard.result-opened .result-media-shell:hover .result-reward-image{
  transform:translateY(-92px) scale(1.38);
  border-radius:12px;
  object-fit:contain;
  background:linear-gradient(165deg,rgb(9,14,30),rgb(15,23,42));
  box-shadow:0 24px 44px rgba(0,0,0,.56),0 0 40px rgba(96,165,250,.38),0 0 0 1px rgba(191,219,254,.34);
  z-index:30;
}

.gcard.result-opened .result-media-shell:hover{
  overflow:visible;
}

.gcard.result-normal .result-reward-layer::before,
.gcard.result-vip .result-reward-layer::before{
  display:none;
}

.gcard.result-normal .box-glow,
.gcard.result-vip .box-glow{
  opacity:0;
  background:none;
  filter:none;
}

.gcard.result-vip{
  border-color:rgba(245,158,11,.92) !important;
  background:linear-gradient(162deg,rgb(14,62,34),rgb(70,56,12),rgb(9,44,27)) !important;
  box-shadow:0 0 58px rgba(245,158,11,.5),0 0 112px rgba(251,191,36,.24),inset 0 0 0 1px rgba(253,224,71,.32),0 12px 34px rgba(0,0,0,.62) !important;
}

.gcard.result-vip .result-opened-chip{
  background:linear-gradient(90deg,rgba(245,158,11,.38),rgba(251,191,36,.42));
  border-color:rgba(253,230,138,.68);
  box-shadow:0 0 16px rgba(251,191,36,.4);
}

.gcard.result-vip .result-name-line{
  color:#fef3c7;
  text-shadow:none;
}

.gcard.result-opened .result-text-area{gap:4px;padding-top:10px;}
.gcard.result-opened .result-name-line{
  font-size:15px;
  line-height:1.28;
  font-weight:900;
  color:#f8fafc;
  text-align:center;
  text-shadow:0 1px 4px rgba(0,0,0,.6);
}

.gcard.result-vip .result-name-line{
  font-size:15px;
  line-height:1.22;
  letter-spacing:0;
  color:#fff7d6;
  text-shadow:0 0 16px rgba(253,224,71,.28);
  max-width:200px;
  min-height:36px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.gcard.result-normal .result-name-line{
  color:#dbeafe;
}
.gcard.result-opened .result-amount-line{
  font-size:31px;
  line-height:1.1;
  font-weight:900;
  color:#fbbf24;
  text-shadow:0 0 18px rgba(245,158,11,.42);
}

.gcard.result-vip .result-amount-line{
  font-size:36px;
  line-height:1.08;
  background:linear-gradient(180deg,#fef08a 0%,#fbbf24 52%,#f59e0b 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  text-shadow:none;
  filter:drop-shadow(0 0 12px rgba(253,224,71,.45));
  white-space:nowrap;
  letter-spacing:.01em;
}

.gcard.result-normal .result-amount-line{
  font-size:30px;
  color:#60a5fa;
  text-shadow:0 0 16px rgba(59,130,246,.45);
}
.gcard.result-opened .result-value-line{
  font-size:12px;
  line-height:1.45;
  font-weight:600;
  color:#cbd5e1;
  text-align:center;
  max-width:190px;
}
.gcard.result-opened .result-badge-line{
  margin-top:2px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-radius:999px;
  padding:5px 12px;
  background:linear-gradient(90deg,rgba(217,119,6,.34),rgba(245,158,11,.34));
  border:1px solid rgba(253,186,116,.58);
  color:#fde68a;
}

.gcard.result-opened .rplab{
  margin-top:3px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
}

.gcard.result-vip .result-badge-line{
  background:linear-gradient(90deg,rgba(245,158,11,.34),rgba(251,191,36,.34));
  border-color:rgba(253,224,71,.65);
  color:#fef3c7;
  box-shadow:0 0 14px rgba(245,158,11,.26);
}

.gcard.result-vip .result-text-area{
  gap:6px;
  padding-top:12px;
}

.gcard.result-normal .result-badge-line{
  background:linear-gradient(90deg,rgba(37,99,235,.3),rgba(59,130,246,.3));
  border-color:rgba(147,197,253,.58);
  color:#dbeafe;
  box-shadow:0 0 10px rgba(59,130,246,.22);
}

.gcard.result-opened .rplab{font-size:12px;font-weight:800;text-align:center;margin-top:2px;}

.gcard.result-unlucky .result-name-line{color:#dbeafe;}
.gcard.result-unlucky .result-badge-line{
  background:linear-gradient(90deg,rgba(59,130,246,.26),rgba(37,99,235,.26));
  border-color:rgba(147,197,253,.48);
  color:#bfdbfe;
}

/* Approval wait screen from redesign */
.aws-screen{
  position:fixed;
  inset:0;
  width:100vw;
  height:100dvh;
  min-height:100dvh;
  z-index:95;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#06040f;
}

.aws-bg-base{position:absolute;inset:0;background:radial-gradient(ellipse 100% 55% at 10% 0%,rgba(79,46,180,.22) 0%,transparent 55%),radial-gradient(ellipse 75% 50% at 92% 100%,rgba(59,30,140,.17) 0%,transparent 55%),radial-gradient(ellipse 55% 38% at 50% 50%,rgba(30,15,70,.3) 0%,transparent 68%),linear-gradient(175deg,#0a0718 0%,#060410 45%,#090616 100%);} 
.aws-orb{position:absolute;border-radius:50%;pointer-events:none;animation:orbMove var(--d) ease-in-out infinite alternate;}
.aws-orb1{width:500px;height:500px;background:radial-gradient(circle,rgba(109,40,217,.15),transparent 65%);top:-160px;left:-120px;--d:18s;filter:blur(2px);} 
.aws-orb2{width:360px;height:360px;background:radial-gradient(circle,rgba(79,70,229,.11),transparent 65%);bottom:-100px;right:-60px;--d:22s;animation-delay:-9s;filter:blur(2px);} 
.aws-orb3{width:200px;height:200px;background:radial-gradient(circle,rgba(245,158,11,.06),transparent 65%);top:40%;right:8%;--d:14s;animation-delay:-4s;filter:blur(1px);} 
.aws-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(139,92,246,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(139,92,246,.03) 1px,transparent 1px);background-size:60px 60px;}
.aws-noise{position:absolute;inset:0;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

.aws-wrap{position:relative;z-index:10;width:100%;max-width:424px;max-height:calc(100dvh - 24px);display:flex;flex-direction:column;gap:10px;overflow:auto;padding:2px 0;animation:awsEnter .7s cubic-bezier(.16,1,.3,1) both;}
@keyframes awsEnter{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

.aws-card{background:rgba(10,7,24,.88);border:1px solid rgba(255,255,255,.07);border-radius:22px;overflow:hidden;backdrop-filter:blur(32px);box-shadow:0 0 0 1px rgba(139,92,246,.07),0 28px 56px rgba(0,0,0,.7),0 4px 14px rgba(0,0,0,.45);position:relative;transition:box-shadow .5s ease;}
.aws-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;z-index:2;background:linear-gradient(90deg,transparent 0%,rgba(124,58,237,.3) 20%,rgba(167,139,250,.7) 50%,rgba(124,58,237,.3) 80%,transparent 100%);background-size:200% 100%;animation:awsTopShimmer 4s linear infinite;}
@keyframes awsTopShimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
@keyframes orbMove{from{transform:translate(0,0);}to{transform:translate(26px,16px);}}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.7;}50%{transform:scale(1.3);opacity:1;}}
@keyframes livepulse{0%,100%{box-shadow:0 0 3px rgba(74,222,128,.35);}50%{box-shadow:0 0 8px rgba(74,222,128,.85);}}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:0;}}

.aws-header{padding:20px 20px 17px;display:flex;align-items:center;gap:14px;border-bottom:1px solid rgba(255,255,255,.045);position:relative;}
.aws-header::before{content:'';position:absolute;top:50%;left:20px;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.18),transparent 70%);pointer-events:none;animation:awsHalo 3s ease-in-out infinite alternate;}
@keyframes awsHalo{from{opacity:.4;}to{opacity:.8;}}

.aws-spin-wrap{position:relative;width:46px;height:46px;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.aws-spinner-svg{position:absolute;inset:0;animation:spin 1.6s linear infinite;}
.aws-spinner-bg{stroke:rgba(139,92,246,.1);}
.aws-spinner-arc{stroke:url(#awArcGrad);stroke-dasharray:28 100;stroke-linecap:round;}
.aws-center-dot{position:relative;z-index:1;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle,#c4b5fd,rgba(124,58,237,.5));box-shadow:0 0 10px rgba(167,139,250,.75);animation:breathe 2.2s ease-in-out infinite;}

.aws-htext{flex:1;}
.aws-slabel{font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:rgba(167,139,250,.45);margin-bottom:4px;}
.aws-title{font-family:'Sora',sans-serif;font-size:16px;font-weight:700;color:rgba(235,228,255,.92);letter-spacing:-.025em;line-height:1.2;}
.aws-sess-badge{padding:4px 10px;border-radius:99px;background:rgba(139,92,246,.1);border:1px solid rgba(139,92,246,.2);font-size:10px;font-weight:600;letter-spacing:.06em;color:rgba(167,139,250,.65);white-space:nowrap;align-self:flex-start;}

.aws-time{padding:14px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.04);} 
.aws-time-left{display:flex;flex-direction:column;gap:2px;}
.aws-tlabel{font-size:10px;font-weight:500;color:rgba(196,181,253,.3);letter-spacing:.08em;text-transform:uppercase;}
.aws-tsub{font-size:10px;color:rgba(196,181,253,.22);} 
.aws-countdown{font-family:'Sora',sans-serif;font-size:26px;font-weight:800;color:rgba(220,212,255,.9);letter-spacing:.08em;font-variant-numeric:tabular-nums;text-shadow:0 0 20px rgba(139,92,246,.25);} 

.aws-prize{margin:13px 16px 0;padding:12px;background:linear-gradient(135deg,rgba(245,158,11,.05),rgba(245,158,11,.02));border:1px solid rgba(245,158,11,.13);border-radius:14px;display:flex;align-items:center;gap:12px;position:relative;overflow:hidden;transition:border-color .3s;}
.aws-prize::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(245,158,11,.35),transparent);}
.aws-prize::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 65% 55% at 0% 50%,rgba(245,158,11,.07),transparent 70%);pointer-events:none;}
.aws-thumb{width:54px;height:54px;flex-shrink:0;border-radius:11px;overflow:hidden;border:1px solid rgba(245,158,11,.2);background:rgba(245,158,11,.06);position:relative;z-index:1;display:flex;align-items:center;justify-content:center;font-size:24px;}
.aws-thumb img,.aw-prize-img{width:100%;height:100%;object-fit:cover;display:block;}
.aws-pinfo{position:relative;z-index:1;}
.aws-ptag{font-size:9px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(251,191,36,.5);margin-bottom:3px;}
.aws-pname{font-size:13px;font-weight:600;color:rgba(254,240,200,.88);margin-bottom:4px;line-height:1.3;}
.aws-pbadge{display:inline-block;margin-top:4px;padding:2px 8px;border-radius:4px;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.2);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(251,191,36,.65);} 

.aws-prog{padding:13px 16px 0;}
.aws-prog-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px;}
.aws-prog-lbl{font-size:10px;font-weight:500;color:rgba(196,181,253,.3);letter-spacing:.06em;text-transform:uppercase;}
.aws-prog-pct{font-size:11px;font-weight:600;color:rgba(167,139,250,.55);} 
.aws-prog-track{height:3px;background:rgba(255,255,255,.055);border-radius:2px;overflow:hidden;}
.aws-prog-fill{height:100%;width:36%;background:linear-gradient(90deg,rgba(109,40,217,.55),rgba(139,92,246,.85),rgba(167,139,250,.9));border-radius:2px;box-shadow:0 0 6px rgba(139,92,246,.4);animation:awProgress 120s linear forwards;}

.aws-assistant{margin:12px 16px 0;display:flex;align-items:flex-start;gap:10px;}
.aws-bot-avatar{width:34px;height:34px;flex-shrink:0;border-radius:10px;background:linear-gradient(135deg,rgba(109,40,217,.3),rgba(79,70,229,.2));border:1px solid rgba(139,92,246,.22);display:flex;align-items:center;justify-content:center;font-size:16px;position:relative;}
.aws-bot-online{position:absolute;bottom:-2px;right:-2px;width:8px;height:8px;border-radius:50%;background:#4ade80;border:1.5px solid rgba(10,7,24,.9);box-shadow:0 0 5px rgba(74,222,128,.65);animation:livepulse 2.5s ease-in-out infinite;}
.aws-bubble{flex:1;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07);border-radius:4px 14px 14px 14px;padding:9px 13px;min-height:50px;position:relative;}
.aws-bubble::before{content:'';position:absolute;top:10px;left:-6px;border:6px solid transparent;border-right-color:rgba(255,255,255,.07);border-left-width:0;}
.aws-bubble-meta{display:flex;align-items:center;gap:6px;margin-bottom:5px;}
.aws-bot-name{font-size:10px;font-weight:600;color:rgba(167,139,250,.6);letter-spacing:.04em;}
.aws-bot-tag{font-size:9px;font-weight:500;padding:1px 6px;border-radius:3px;background:rgba(139,92,246,.12);color:rgba(167,139,250,.5);border:1px solid rgba(139,92,246,.15);} 
.aws-typing-text{font-size:12px;color:rgba(200,190,240,.7);line-height:1.65;min-height:18px;}
.aws-typing-text.typing-active::after{content:'|';display:inline-block;width:2px;height:12px;background:rgba(167,139,250,.7);vertical-align:middle;margin-left:2px;animation:blink .75s step-end infinite;}

.aws-msg-list{margin:11px 16px 0;display:flex;flex-direction:column;gap:5px;}
.aws-msg{display:flex;align-items:flex-start;gap:8px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.05);border-left:2px solid rgba(139,92,246,.35);border-radius:0 10px 10px 0;padding:7px 11px;font-size:11.5px;color:rgba(196,181,253,.6);line-height:1.6;animation:msgIn .4s ease-out both;}
.aws-msg:nth-child(1){animation-delay:.05s;}
.aws-msg:nth-child(2){animation-delay:.15s;}
.aws-msg:nth-child(3){animation-delay:.25s;}
@keyframes msgIn{from{opacity:0;transform:translateX(-8px);}to{opacity:1;transform:translateX(0);}}

.aws-conn-row{margin:10px 16px 0;display:flex;align-items:center;gap:7px;font-size:10px;font-weight:500;color:rgba(196,181,253,.35);} 
.aws-dot-green{width:6px;height:6px;border-radius:50%;background:#4ade80;flex-shrink:0;box-shadow:0 0 5px rgba(74,222,128,.65);animation:livepulse 2.5s ease-in-out infinite;}
.aws-actions{display:none;gap:8px;padding:12px 16px 0;}

.aws-support-inline{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid rgba(56,189,248,.45);
  background:rgba(14,116,144,.18);
  color:#bae6fd;
  border-radius:999px;
  font-size:10px;
  font-weight:700;
  padding:5px 10px;
  cursor:pointer;
  transition:all .2s ease;
}

.aws-support-inline:hover{
  background:rgba(14,116,144,.28);
  border-color:rgba(56,189,248,.68);
  transform:translateY(-1px);
}

.aws-footer-note{padding:12px 16px 16px;margin-top:6px;border-top:1px solid rgba(255,255,255,.04);text-align:center;font-size:10px;color:rgba(255,255,255,.14);letter-spacing:.04em;line-height:1.7;}

.aws-screen.timeout-state .aws-actions{display:flex !important;}
.aws-screen.timeout-state .aws-msg-list{border-radius:10px;}

@media (max-width:768px){
  .box-wrap{width:236px;}
  .gcard.gift-card{width:236px;height:318px;}
  .gift-card .box-area{height:180px;}
  .aws-wrap{max-width:92vw;}
}

/* TOAST */
.toast{
  position:fixed;
  right:20px;
  bottom:calc(88px + env(safe-area-inset-bottom, 0px));
  left:auto;
  width:min(420px, calc(100vw - 28px));
  z-index:120;
  opacity:0;
  transform:translate3d(20px,0,0) scale(.98);
  transition:opacity .24s ease, transform .34s cubic-bezier(.22,.8,.3,1);
  pointer-events:none;
  --toast-life:6500ms;
}

.toast.show{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
}

.toast-card{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:10px;
  border-radius:14px;
  border:1px solid rgba(148,163,184,.34);
  background:linear-gradient(145deg, rgba(15,23,42,.95), rgba(2,6,23,.95));
  color:#e2e8f0;
  box-shadow:0 16px 36px rgba(2,6,23,.45);
  overflow:hidden;
  padding:11px 12px 14px;
  pointer-events:auto;
}

.toast-tone{
  width:4px;
  align-self:stretch;
  border-radius:999px;
  background:rgba(59,130,246,.95);
}

.toast-icon{
  width:28px;
  height:28px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:900;
  border:1px solid rgba(59,130,246,.45);
  background:rgba(59,130,246,.16);
  color:#dbeafe;
  flex:0 0 28px;
}

.toast-body{min-width:0;flex:1;}
.toast-title{font-size:12px;font-weight:800;color:#f8fafc;line-height:1.2;}
.toast-msg{margin-top:2px;font-size:13px;line-height:1.45;color:#cbd5e1;word-break:break-word;}

.toast-close{
  border:none;
  background:transparent;
  color:rgba(226,232,240,.7);
  width:22px;
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  cursor:pointer;
  font-size:16px;
  font-weight:700;
  line-height:1;
}

.toast-close:hover{background:rgba(148,163,184,.18);color:#f8fafc;}

.toast-progress{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  transform-origin:left center;
  transform:scaleX(1);
  animation:toastLife var(--toast-life, 6500ms) linear forwards;
  background:rgba(59,130,246,.95);
}

.toast.toast-success .toast-tone,
.toast.toast-success .toast-progress{background:rgba(34,197,94,.95);}
.toast.toast-success .toast-icon{background:rgba(34,197,94,.16);border-color:rgba(34,197,94,.45);color:#dcfce7;}

.toast.toast-error .toast-tone,
.toast.toast-error .toast-progress{background:rgba(239,68,68,.95);}
.toast.toast-error .toast-icon{background:rgba(239,68,68,.16);border-color:rgba(239,68,68,.45);color:#fecaca;}

.toast.toast-warning .toast-tone,
.toast.toast-warning .toast-progress{background:rgba(245,158,11,.95);}
.toast.toast-warning .toast-icon{background:rgba(245,158,11,.16);border-color:rgba(245,158,11,.45);color:#fde68a;}

.toast.toast-info .toast-tone,
.toast.toast-info .toast-progress{background:rgba(59,130,246,.95);}

@keyframes toastLife{to{transform:scaleX(0);}}

/* AAA track roll overlay */
.loot-track-ov{position:fixed;inset:0;z-index:560;display:none;align-items:center;justify-content:center;pointer-events:none;opacity:0;transition:opacity 140ms ease-out;}
.loot-track-ov.show{display:flex;opacity:1;}
.loot-track-mask{width:min(92vw,680px);border-radius:16px;border:1px solid rgba(148,163,184,.32);background:rgba(2,8,23,.9);overflow:hidden;position:relative;padding:14px 0;}
.loot-track-center-line{position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);background:linear-gradient(180deg,rgba(250,204,21,0),rgba(250,204,21,.95),rgba(250,204,21,0));}
.loot-track-strip{display:flex;gap:8px;padding:0 20px;transform:translate3d(0,0,0);will-change:transform;}
.loot-track-item{width:72px;min-width:72px;height:82px;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid rgba(148,163,184,.28);background:rgba(15,23,42,.84);color:#dbeafe;font-size:10px;font-weight:700;}
.loot-track-item .icon{font-size:22px;line-height:1;}
.loot-track-item.common{border-color:rgba(148,163,184,.35);}
.loot-track-item.rare{border-color:rgba(59,130,246,.45);}
.loot-track-item.epic{border-color:rgba(168,85,247,.5);}
.loot-track-item.legendary{border-color:rgba(234,179,8,.56);}
.loot-track-item.near-miss{transform:scale(1.04);}
.loot-track-item.is-result{transform:scale(1.08);box-shadow:0 0 0 1px rgba(250,204,21,.55) inset;}

/* Engagement HUD */
.engage-hud{position:absolute;top:82px;left:50%;transform:translateX(-50%);width:min(92vw,560px);z-index:28;border-radius:14px;border:1px solid rgba(148,163,184,.28);background:rgba(2,8,23,.72);backdrop-filter:blur(2px);padding:10px 12px;display:grid;gap:8px;}
.engage-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.engage-pity-row{font-size:12px;color:#dbeafe;font-weight:700;}
.engage-pity-track{height:8px;border-radius:999px;background:rgba(30,41,59,.92);overflow:hidden;}
.engage-pity-fill{width:0%;height:100%;background:linear-gradient(90deg,#60a5fa,#fbbf24);transition:width 160ms ease-out;}
.engage-streak,.engage-points{font-size:12px;color:#cbd5e1;font-weight:700;}
.engage-redeem-btn{border:1px solid rgba(56,189,248,.48);background:rgba(8,47,73,.92);color:#bae6fd;border-radius:10px;min-height:36px;padding:0 12px;font-weight:700;}
.engage-redeem-btn:disabled{opacity:.55;cursor:not-allowed;}
.engage-redeem-hint{font-size:11px;color:#94a3b8;}

@media (max-width:768px){
  .engage-hud{top:72px;width:min(94vw,640px);padding:9px 10px;}
  .loot-track-mask{width:min(96vw,680px);}
  .loot-track-item{width:64px;min-width:64px;height:76px;}
}

/* EFFECTS (fixed – pointer-events:none so they never block) */
.explosion-ring{position:fixed;width:300px;height:300px;margin-left:-150px;margin-top:-150px;border-radius:50%;border:3px solid rgba(245,158,11,.8);pointer-events:none;z-index:500;will-change:transform,opacity;backface-visibility:hidden;animation:rExp .72s cubic-bezier(.25,.46,.45,.94) forwards;}
.explosion-ring.pur{border-color:rgba(168,85,247,.8);}
@keyframes rExp{0%{transform:scale(.027) translateZ(0);opacity:1;}45%{transform:scale(.5) translateZ(0);opacity:.55;}100%{transform:scale(1) translateZ(0);opacity:0;}}
.bp{position:fixed;border-radius:var(--br,50%);background:var(--col,#f59e0b);pointer-events:none;z-index:499;will-change:transform,opacity;backface-visibility:hidden;animation:bFly var(--dur,.8s) ease-out forwards;}
@keyframes bFly{0%{transform:translate(0,0) scale(1);opacity:1;}100%{transform:translate(var(--tx,0),var(--ty,0)) scale(0);opacity:0;}}
.cf{position:fixed;top:-14px;pointer-events:none;z-index:498;border-radius:var(--br,3px);background:var(--col,#7c3aed);will-change:transform,opacity;backface-visibility:hidden;animation:cFall var(--dur,1.8s) var(--del,0s) ease-in forwards;}
@keyframes cFall{0%{transform:translateY(0) rotate(var(--r0,0deg)) translateX(0);opacity:1;width:var(--w,8px);height:var(--h,14px);}100%{transform:translateY(110vh) rotate(var(--r1,540deg)) translateX(var(--dx,0px));opacity:0;width:var(--w,8px);height:var(--h,14px);}}
.gfl{position:fixed;inset:0;pointer-events:none;z-index:490;animation:gfF .6s ease-out forwards;background:radial-gradient(circle at var(--cx,50%) var(--cy,50%),rgba(245,158,11,.3) 0%,transparent 58%);}
.gfl.pur{background:radial-gradient(circle at var(--cx,50%) var(--cy,50%),rgba(168,85,247,.3) 0%,transparent 58%);}
@keyframes gfF{from{opacity:1;}to{opacity:0;}}

.fx-core{position:fixed;pointer-events:none;z-index:510;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(255,255,255,.98) 0%,rgba(253,224,71,.9) 35%,rgba(245,158,11,.65) 62%,rgba(245,158,11,0) 100%);will-change:transform,opacity;backface-visibility:hidden;animation:fxCorePop .72s cubic-bezier(.2,.8,.2,1) forwards;}
.fx-core.pur{background:radial-gradient(circle,rgba(255,255,255,.98) 0%,rgba(216,180,254,.9) 35%,rgba(168,85,247,.65) 62%,rgba(168,85,247,0) 100%);}
@keyframes fxCorePop{0%{opacity:1;transform:translate(-50%,-50%) scale(.25);}45%{opacity:.95;transform:translate(-50%,-50%) scale(2.8);}100%{opacity:0;transform:translate(-50%,-50%) scale(4.2);}}

.fx-shock{position:fixed;pointer-events:none;z-index:507;border-radius:50%;width:520px;height:520px;border:2px solid rgba(255,255,255,.65);will-change:transform,opacity;backface-visibility:hidden;mix-blend-mode:screen;animation:fxShock 1.05s cubic-bezier(.25,.46,.45,.94) forwards;}
.fx-shock.pur{border-color:rgba(216,180,254,.8);}
@keyframes fxShock{0%{transform:translate(-50%,-50%) scale(.023) translateZ(0);opacity:.95;}40%{transform:translate(-50%,-50%) scale(.48) translateZ(0);opacity:.68;}100%{transform:translate(-50%,-50%) scale(1) translateZ(0);opacity:0;}}

.fx-ray{position:fixed;pointer-events:none;z-index:506;left:var(--x);top:var(--y);width:var(--w,3px);height:var(--h,120px);transform-origin:50% 0%;transform:translate(-50%,0) rotate(var(--rot,0deg));background:linear-gradient(to bottom,rgba(255,255,255,.95),rgba(253,224,71,.75),rgba(245,158,11,0));will-change:transform,opacity;backface-visibility:hidden;animation:fxRay .82s ease-out forwards;}
.fx-ray.pur{background:linear-gradient(to bottom,rgba(255,255,255,.95),rgba(216,180,254,.8),rgba(168,85,247,0));}
@keyframes fxRay{0%{opacity:1;transform:translate(-50%,0) rotate(var(--rot,0deg)) scaleY(.2);}100%{opacity:0;transform:translate(-50%,0) rotate(var(--rot,0deg)) scaleY(1.35);}}

.fx-spark{position:fixed;pointer-events:none;z-index:505;width:var(--sz,7px);height:var(--sz,7px);left:var(--x);top:var(--y);border-radius:50%;background:var(--col,#fbbf24);box-shadow:0 0 14px var(--col,#fbbf24);will-change:transform,opacity;backface-visibility:hidden;animation:fxSpark var(--dur,.8s) cubic-bezier(.12,.78,.27,1) forwards;}
@keyframes fxSpark{0%{opacity:1;transform:translate(-50%,-50%) translate(0,0) scale(1);}100%{opacity:0;transform:translate(-50%,-50%) translate(var(--tx,0),var(--ty,0)) scale(0);}}

body.fx-shake{animation:fxShake .38s cubic-bezier(.36,.07,.19,.97) both;}
@keyframes fxShake{10%,90%{transform:translate3d(-1px,0,0);}20%,80%{transform:translate3d(2px,0,0);}30%,50%,70%{transform:translate3d(-3px,0,0);}40%,60%{transform:translate3d(3px,0,0);}}

.quick-tools{
  position:absolute;
  top:calc(50% + 125px);
  left:20px;
  right:20px;
  display:none;
  justify-content:center;
  gap:8px;
  z-index:6;
  flex-wrap:wrap;
}
.quick-btn{
  border:1px solid rgba(124,58,237,.35);
  background:rgba(14,12,36,.88);
  color:#c4b5fd;
  border-radius:999px;
  padding:8px 14px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.quick-btn:hover{background:rgba(42,24,88,.95);}

.hub-box{width:min(920px,95vw);}
.hub-head-row{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;}
.hub-chip{font-size:12px;color:#c4b5fd;background:rgba(124,58,237,.15);border:1px solid rgba(124,58,237,.28);padding:8px 12px;border-radius:999px;}
.hub-list{display:grid;gap:10px;max-height:52vh;overflow:auto;padding-right:2px;}
.hub-card{background:linear-gradient(145deg,rgba(28,22,56,.75),rgba(18,14,42,.7));border:1px solid rgba(124,58,237,.3);border-radius:14px;padding:14px;box-shadow:0 4px 16px rgba(0,0,0,.3);transition:border-color .18s,box-shadow .18s;}
.hub-card:hover{border-color:rgba(124,58,237,.55);box-shadow:0 6px 24px rgba(0,0,0,.4);}
.hub-card-title{font-weight:800;font-size:14px;color:#f5f3ff;}
.hub-card-meta{font-size:12px;color:#a78bfa;margin-top:4px;}
.hub-card-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;position:relative;z-index:2;}
.hub-inline-btn{border:none;border-radius:8px;padding:8px 10px;font-size:12px;font-weight:700;cursor:pointer;position:relative;z-index:3;pointer-events:auto;touch-action:manipulation;}
.hub-inline-btn.claim{background:linear-gradient(135deg,#0ea5e9,#22d3ee);color:#03202d;}
.hub-inline-btn.convert{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;}
.hub-inline-btn.disabled{background:#24213e;color:#706d95;cursor:not-allowed;}

.hub-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px;}
.hub-stat-card{background:linear-gradient(145deg,rgba(28,22,56,.8),rgba(18,14,42,.75));border:1px solid rgba(124,58,237,.28);border-radius:14px;padding:14px;box-shadow:0 4px 14px rgba(0,0,0,.3);}
.hub-stat-label{font-size:11px;color:#8b84ad;}
.hub-stat-value{font-size:20px;font-weight:900;color:#fbbf24;margin-top:4px;}
.hub-filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}

/* ===== UX SMOOTHNESS OVERRIDES (lightweight, mobile-first) ===== */
.aws-screen {
  opacity: 0;
  transform: translate3d(0, 4px, 0);
  pointer-events: none;
  transition: opacity 160ms ease, transform 160ms ease;
  will-change: opacity, transform;
}

.aws-screen.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}

.aws-screen.is-hiding {
  opacity: 0;
  transform: translate3d(0, 4px, 0);
  pointer-events: none;
}

.aws-wrap,
.aws-card,
.aws-title,
.aws-msg-list,
.aws-footer-note {
  will-change: opacity, transform;
}

/* Reduce expensive visual effects in critical waiting flow */
.aws-card {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42) !important;
}

/* Result overlay: smooth show/hide with opacity + transform only */
.win-ov {
  display: flex;
  opacity: 0;
  pointer-events: none;
  transform: translate3d(0, 4px, 0);
  transition: opacity 160ms ease, transform 160ms ease;
  will-change: opacity, transform;
}

.win-ov.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
}

.wov-modal {
  will-change: opacity, transform;
}

/* Withdraw submit disabled state for zero-balance / blocked trust */
#modalOv .bsub:disabled {
  opacity: 0.52;
  cursor: not-allowed;
  filter: none;
  transform: none;
}

#modalOv .bsub:disabled:hover {
  filter: none;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .aws-screen,
  .win-ov {
    transition: none !important;
    transform: none !important;
  }
}

.search-session-card{position:relative;overflow:hidden;}
.search-session-card::after{content:'';position:absolute;top:0;right:0;width:140px;height:140px;background:radial-gradient(circle,rgba(34,211,238,.18),transparent 65%);pointer-events:none;}

#sessionDetailOv{z-index:92;}
#sessionDetailOv .session-detail-box{
  width:min(1240px,97vw);
  max-height:92vh;
  background:
    radial-gradient(circle at 92% 0%, rgba(34,211,238,.16), transparent 38%),
    radial-gradient(circle at 0% 100%, rgba(167,139,250,.18), transparent 42%),
    linear-gradient(160deg,rgba(13,10,34,.98),rgba(12,8,31,.98));
  border:1px solid rgba(167,139,250,.36);
  border-radius:20px;
  box-shadow:0 32px 82px rgba(0,0,0,.66),0 0 0 1px rgba(167,139,250,.1) inset;
}

#sessionDetailOv .session-detail-hdr{
  position:sticky;
  top:0;
  z-index:2;
  background:linear-gradient(180deg,rgba(12,8,30,.96),rgba(12,8,30,.84));
  backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(167,139,250,.22);
}

#sessionDetailOv .session-detail-body{
  padding:18px 22px 22px;
  display:grid;
  gap:16px;
}

.session-detail-loading{
  border:1px dashed rgba(167,139,250,.45);
  border-radius:14px;
  padding:18px;
  text-align:center;
  color:#c4b5fd;
  font-weight:700;
  background:rgba(124,58,237,.08);
}

.sd-top{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:14px;
}

.sd-hero,
.sd-wallet{
  border:1px solid rgba(167,139,250,.28);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(29,22,56,.82),rgba(17,13,43,.82));
  padding:16px;
}

.sd-code{font-size:24px;font-weight:900;color:#f5f3ff;letter-spacing:.4px;}
.sd-subline{margin-top:6px;font-size:13px;color:#c4b5fd;display:flex;gap:8px;flex-wrap:wrap;}
.sd-badge{font-size:11px;font-weight:800;padding:4px 10px;border-radius:999px;border:1px solid transparent;}
.sd-badge.active{color:#22c55e;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.4);}
.sd-badge.inactive{color:#94a3b8;background:rgba(51,65,85,.24);border-color:rgba(148,163,184,.32);}
.sd-badge.completed{color:#38bdf8;background:rgba(56,189,248,.12);border-color:rgba(56,189,248,.35);}
.sd-badge.pending{color:#f59e0b;background:rgba(245,158,11,.14);border-color:rgba(245,158,11,.35);}

.sd-meta-grid{margin-top:12px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
.sd-meta-item{background:rgba(15,23,42,.5);border:1px solid rgba(99,102,241,.22);border-radius:12px;padding:10px 12px;}
.sd-meta-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8;font-weight:700;}
.sd-meta-value{margin-top:5px;font-size:14px;font-weight:700;color:#e2e8f0;word-break:break-word;}

.sd-wallet{display:grid;gap:10px;align-content:start;}
.sd-wallet-row{display:flex;align-items:center;justify-content:space-between;gap:12px;background:rgba(15,23,42,.48);border:1px solid rgba(99,102,241,.2);border-radius:12px;padding:10px 12px;}
.sd-wallet-row .lbl{font-size:11px;color:#94a3b8;font-weight:700;}
.sd-wallet-row .val{font-size:16px;color:#f8fafc;font-weight:900;}
.sd-wallet-row .val.warn{color:#fbbf24;}

.sd-section{
  border:1px solid rgba(99,102,241,.25);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(20,16,46,.82),rgba(11,8,31,.82));
  padding:14px;
}

.sd-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap;}
.sd-section-title{font-size:15px;font-weight:900;color:#f5f3ff;letter-spacing:.2px;}
.sd-section-note{font-size:12px;color:#94a3b8;}

.sd-box-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}

.sd-box-card{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:12px;
  border:1px solid rgba(99,102,241,.28);
  border-radius:14px;
  padding:12px;
  background:linear-gradient(145deg,rgba(30,24,62,.8),rgba(15,12,38,.8));
}

.sd-box-media{
  width:112px;
  height:112px;
  border-radius:12px;
  border:1px solid rgba(196,181,253,.34);
  background:radial-gradient(circle at 25% 20%,rgba(34,211,238,.2),transparent 55%),linear-gradient(150deg,rgba(30,41,59,.92),rgba(17,24,39,.92));
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}

.sd-box-media img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in;}
.sd-box-icon{font-size:44px;line-height:1;filter:drop-shadow(0 4px 12px rgba(0,0,0,.35));}

.sd-box-title{font-size:15px;font-weight:800;color:#f8fafc;line-height:1.35;}
.sd-box-sub{margin-top:3px;font-size:12px;color:#a5b4fc;}

.sd-tags{margin-top:8px;display:flex;gap:6px;flex-wrap:wrap;}
.sd-tag{font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:999px;border:1px solid rgba(148,163,184,.34);color:#cbd5e1;background:rgba(15,23,42,.56);}

.sd-box-lines{margin-top:9px;display:grid;gap:6px;}
.sd-line{font-size:12px;color:#cbd5e1;line-height:1.4;}
.sd-line b{color:#f8fafc;font-weight:800;}

.sd-no-data{padding:14px;border:1px dashed rgba(148,163,184,.4);border-radius:12px;text-align:center;font-size:13px;color:#94a3b8;background:rgba(15,23,42,.3);}

.sd-timeline{display:grid;gap:8px;max-height:220px;overflow:auto;padding-right:2px;}
.sd-event{border:1px solid rgba(99,102,241,.22);border-radius:12px;background:rgba(15,23,42,.5);padding:10px 12px;display:flex;justify-content:space-between;gap:10px;align-items:flex-start;}
.sd-event-title{font-size:13px;font-weight:800;color:#e2e8f0;}
.sd-event-sub{font-size:12px;color:#94a3b8;margin-top:3px;}
.sd-event-time{font-size:11px;color:#a5b4fc;white-space:nowrap;}

@media (max-width: 1080px){
  #sessionDetailOv .session-detail-box{width:min(980px,97vw);}
  .sd-top{grid-template-columns:1fr;}
  .sd-box-grid{grid-template-columns:1fr;}
}

/* ===== iPad / Tablet responsive (769px – 1080px) ===== */
@media (min-width: 769px) and (max-width: 1080px){
  /* Game boxes — slightly smaller on iPad */
  .boxes-row{gap:18px;width:min(900px,96vw);}
  .gcard{width:clamp(150px,20vw,220px);height:clamp(200px,27vh,270px);}
  .gi-wrap svg{width:62px;height:62px;}
  .rprize{font-size:22px;}

  /* Wallet widget — keep right side but narrower */
  .g-wallet{top:60px;right:10px;width:min(320px,calc(100vw - 20px));}

  /* Chat fab slightly closer to edge */
  .cfab{bottom:20px;right:12px;}

  /* Hub / modal — full‑width on narrow tablets */
  .hub-modal{width:min(760px,95vw);}
  .hub-tabs{gap:8px;}
  .hub-tab{font-size:12px;padding:7px 12px;}

  /* choose-box screen */
  .choose-list{grid-template-columns:repeat(3,1fr);gap:14px;}
  .choose-card{padding:12px 8px;}
}

/* 700px–768px: large-phone landscape / narrow tablet */
@media (min-width:700px) and (max-width:768px){
  .boxes-row{gap:14px;width:min(680px,96vw);}
  .gcard{width:clamp(130px,19vw,200px);height:clamp(175px,25vh,250px);}
  .gi-wrap svg{width:54px;height:54px;}
  .rprize{font-size:19px;}
  .g-wallet{top:56px;right:8px;width:min(290px,calc(100vw - 16px));}
  .cfab{bottom:18px;right:10px;}
  .hub-modal{width:min(680px,96vw);}
  .choose-list{grid-template-columns:repeat(3,1fr);gap:11px;}
}

/* 1081px–1200px: medium laptop / large tablet landscape */
@media (min-width:1081px) and (max-width:1200px){
  .boxes-row{gap:22px;width:min(1000px,96vw);}
  .gcard{width:clamp(165px,21vw,235px);height:clamp(215px,28vh,285px);}
  .g-wallet{width:min(340px,calc(100vw - 24px));}
}

@media (max-width: 768px){
  #sessionDetailOv{padding:10px;align-items:flex-start;overflow-y:auto;}
  #sessionDetailOv .session-detail-box{max-height:none;margin-bottom:14px;}
  #sessionDetailOv .session-detail-body{padding:12px;gap:12px;}
  .sd-code{font-size:20px;}
  .sd-meta-grid{grid-template-columns:1fr;}
  .sd-box-card{grid-template-columns:1fr;}
  .sd-box-media{width:100%;height:180px;}
}

.tx-row{display:flex;justify-content:space-between;align-items:center;gap:10px;background:linear-gradient(135deg,rgba(22,18,46,.78),rgba(14,12,34,.72));border:1px solid rgba(124,58,237,.26);border-radius:12px;padding:11px 14px;transition:border-color .18s;}
.tx-row:hover{border-color:rgba(124,58,237,.45);}
.tx-left{display:flex;flex-direction:column;gap:2px;}
.tx-title{font-size:13px;font-weight:700;color:#ede9fe;}
.tx-time{font-size:11px;color:#8b84ad;}
.tx-amount{font-size:14px;font-weight:900;color:#fbbf24;}
.tx-status{font-size:11px;color:#67e8f9;}
.tx-pagination{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-top:8px;}

/* ===== Chat Widget Messenger V2 (runtime-compatible) ===== */
.cfab{
  width:62px;
  height:62px;
  border-radius:50%;
  background:#0866ff;
  box-shadow:0 0 0 3px rgba(255,255,255,0.9),0 4px 20px rgba(8,102,255,0.55),0 2px 6px rgba(0,0,0,0.2);
  animation:none;
}
.cfab:hover{transform:scale(1.08);box-shadow:0 0 0 3px rgba(255,255,255,0.9),0 8px 32px rgba(8,102,255,0.65);}
.cfab-avatar{border:0;box-shadow:none;}
.cfab-icon{border:0;background:transparent;}

#cpanel.cpanel{
  top:auto;
  left:auto;
  bottom:20px;
  right:20px;
  width:min(390px,100vw);
  height:min(700px,calc(100dvh - 40px));
  border-radius:18px;
  border:0;
  background:#ffffff;
  overflow:hidden;
  transform-origin:bottom right;
  transform:scale(0.85) translateY(20px);
  opacity:0;
  pointer-events:none;
  transition:transform 0.38s cubic-bezier(0.16,1,0.3,1),opacity 0.25s;
  box-shadow:0 0 0 1px rgba(0,0,0,0.08),0 2px 4px rgba(0,0,0,0.05),0 12px 40px rgba(0,0,0,0.18),0 40px 80px rgba(0,0,0,0.12);
  animation:none;
}
#cpanel.cpanel.open{
  transform:scale(1) translateY(0);
  opacity:1;
  pointer-events:auto;
}

#cpanel .ch{
  position:relative;
  overflow:hidden;
  min-height:68px;
  padding:12px 14px;
  border:0;
  background:linear-gradient(135deg,#0866ff 0%,#1a56db 60%,#7c3aed 100%);
  display:flex;
  align-items:center;
  gap:10px;
}
#cpanel .ch::before{
  content:'';
  position:absolute;
  bottom:-30px;
  left:-20px;
  width:160%;
  height:80px;
  background:rgba(255,255,255,0.06);
  border-radius:50%;
  transform:rotate(-2deg);
}
#cpanel .ch-avs{position:relative;width:50px;height:50px;flex-shrink:0;z-index:1;}
#cpanel .ch-av-main{width:46px;height:46px;border-radius:50%;border:2.5px solid rgba(255,255,255,0.55);overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,0.3);}
#cpanel .ch-av img{width:100%;height:100%;object-fit:cover;display:block;}
#cpanel .ch-av-status{position:absolute;bottom:2px;right:2px;width:13px;height:13px;border-radius:50%;background:#42d37a;border:2.5px solid #1d4ed8;box-shadow:0 0 6px rgba(66,211,122,0.8);}
#cpanel .ch-info{min-width:0;flex:1;z-index:1;}
#cpanel .ch-title{font-size:15px;font-weight:800;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,0.15);}
#cpanel .ch-online{display:flex;align-items:center;gap:5px;margin-top:2px;font-size:11.5px;color:rgba(255,255,255,0.88);font-weight:500;}
#cpanel .ch-online::before{content:'';width:7px;height:7px;border-radius:50%;background:#42d37a;box-shadow:0 0 5px #42d37a;}
#cpanel .ch-act,
#cpanel .ch-x{
  width:34px;
  height:34px;
  min-width:44px;
  min-height:44px;
  border-radius:50%;
  border:none;
  color:#fff;
  background:rgba(255,255,255,0.18);
  backdrop-filter:blur(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:1;
}
#cpanel .ch-x svg{width:16px;height:16px;}

#cpanel .chat-pre{background:#fff;border-bottom:1px solid #e4e6eb;padding:0;gap:0;}
#cpanel .pre-hero{padding:22px 20px 16px;background:linear-gradient(180deg,#f0f4ff 0%,#fff 100%);border-bottom:1px solid #e4e6eb;text-align:center;}
#cpanel .pre-hero-icon{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;background:linear-gradient(135deg,#0866ff,#7c3aed);box-shadow:0 6px 20px rgba(8,102,255,0.35);font-size:26px;}
#cpanel .pre-form{padding:16px 18px 20px;display:flex;flex-direction:column;gap:10px;}
#cpanel .pre-field-wrap{display:flex;flex-direction:column;gap:4px;}
#cpanel .pre-label{font-size:11.5px;font-weight:700;color:#65676b;text-transform:uppercase;letter-spacing:.05em;padding-left:2px;}
#cpanel .pre-input-wrap{position:relative;display:flex;align-items:center;}
#cpanel .pre-input-icon{position:absolute;left:13px;z-index:1;font-size:16px;}
#cpanel .chat-pre-input{width:100%;padding:13px 14px 13px 42px;border-radius:12px;border:1.5px solid #e4e6eb;background:#f7f8fa;color:#050505;font-size:16px;font-weight:500;}
#cpanel .chat-pre-input:focus{border-color:#0866ff;background:#fff;box-shadow:0 0 0 4px rgba(8,102,255,0.1);}
#cpanel .chat-pre-btn{width:100%;padding:14px;border-radius:12px;border:0;background:linear-gradient(135deg,#0866ff 0%,#1a56db 100%);color:#fff;font-size:15px;font-weight:700;box-shadow:0 4px 16px rgba(8,102,255,0.4);}
#cpanel .chat-pre-err{font-size:11.5px;color:#fa3e3e;padding-left:4px;min-height:14px;}

#cpanel .cmsgs{
  flex:1;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:10px 10px 6px;
  display:flex;
  flex-direction:column;
  gap:3px;
  background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23e4e6eb' fill-opacity='0.3' fill-rule='evenodd'%3E%3Ccircle cx='20' cy='20' r='1'/%3E%3C/g%3E%3C/svg%3E"),#f0f2f5;
}

#cpanel .cmsg-row{display:flex;flex-direction:column;margin-top:2px;animation:msgSlide .22s cubic-bezier(0.34,1.56,0.64,1) both;}
#cpanel .cmsg-row.mine{align-items:flex-end;justify-content:flex-start;}
#cpanel .cmsg-row:not(.mine){align-items:flex-start;}
#cpanel .cmsg-row-content{display:flex;align-items:flex-end;gap:7px;max-width:80%;}
#cpanel .cmsg-row.mine .cmsg-row-content{flex-direction:row-reverse;}
#cpanel .cmsg-avatar{width:28px;height:28px;border-radius:50%;overflow:hidden;border:0;background:linear-gradient(135deg,#0866ff,#7c3aed);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;color:#fff;box-shadow:none;}
#cpanel .cmsg-col{display:flex;flex-direction:column;gap:1px;min-width:0;max-width:100%;}
#cpanel .msnd{font-size:11px;font-weight:600;color:#65676b;padding:0 6px;margin-bottom:2px;}
#cpanel .mbub{padding:10px 14px;font-size:14.5px;line-height:1.48;max-width:100%;word-break:break-word;white-space:pre-wrap;border:0;box-shadow:none;background:#fff;color:#050505;border-radius:18px 18px 18px 4px;}
#cpanel .mbub.mine{background:#0866ff;color:#fff;border-radius:18px 18px 4px 18px;box-shadow:0 2px 8px rgba(8,102,255,0.3);}
#cpanel .mbub.media-only{padding:4px !important;background:transparent !important;}
#cpanel .chat-vspacer{width:100%;pointer-events:none;flex:0 0 auto;}
#cpanel .cmsg-meta{display:flex;align-items:center;gap:7px;min-height:16px;padding:0 2px;}
#cpanel .cmsg-time{margin-top:0;}
#cpanel .cmsg-status{font-size:10px;line-height:1.2;font-weight:700;color:#64748b;}
#cpanel .cmsg-status.pending{color:#1d4ed8;}
#cpanel .cmsg-status.delivered{color:#475569;}
#cpanel .cmsg-status.seen{color:#0ea5e9;}
#cpanel .cmsg-status.failed{color:#dc2626;}
#cpanel .cmsg-retry-btn{border:1px solid rgba(220,38,38,.3);background:#fff1f2;color:#b91c1c;font-size:10px;font-weight:800;border-radius:999px;padding:2px 8px;line-height:1.3;}
#cpanel .cmsg-retry-btn:hover{background:#ffe4e6;}

#cpanel .chat-attachment{margin-top:0;display:block;}
#cpanel .chat-attachment-img{max-width:220px;max-height:180px;border-radius:14px;display:block;border:0;}
#cpanel .chat-attachment-file{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:10px;background:#e7f0ff;border:1px solid rgba(8,102,255,0.22);color:#0866ff;font-size:12px;font-weight:700;}
#cpanel .mbub.mine .chat-attachment-file{background:rgba(255,255,255,0.2);border-color:rgba(255,255,255,0.45);color:#fff;}

#cpanel .cquick{padding:9px 12px;display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:7px;border-top:1px solid #e4e6eb;background:#fff;scroll-snap-type:x proximity;}
#cpanel .cquick::-webkit-scrollbar{display:none;}
#cpanel .qbtn{flex:0 0 auto;white-space:nowrap;scroll-snap-align:start;padding:8px 14px;border-radius:20px;border:1.5px solid rgba(8,102,255,0.2);background:#e7f0ff;color:#0866ff;font-size:12.5px;font-weight:600;}

#cpanel #cinputWrap{
  flex-shrink:0;
  border-top:1px solid #e4e6eb;
  background:#fff;
  padding:8px 10px;
  transition:border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
#cpanel.cpanel.is-typing #cinputWrap{
  border-top-color:#bfdbfe;
  box-shadow:0 -10px 24px rgba(8,102,255,0.08);
  background:linear-gradient(180deg,#ffffff,#f8fbff);
}
#cpanel .ctools{display:flex;align-items:center;gap:2px;margin-bottom:6px;}
#cpanel .ctool-divider{width:1px;height:22px;background:#e4e6eb;margin:0 4px;}
#cpanel .ctool,
#cpanel .c-tool,
#cpanel .c-emoji{
  width:36px;
  height:36px;
  min-width:40px;
  min-height:40px;
  border:0;
  border-radius:10px;
  background:none;
  color:#65676b;
  font-size:18px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#cpanel .ctool:hover,
#cpanel .c-tool:hover,
#cpanel .c-emoji:hover{background:#f0f2f5;color:#0866ff;transform:none;box-shadow:none;}

#cpanel .cinp-row{position:relative;bottom:auto;padding:0;border:0;background:transparent;display:flex;align-items:flex-end;gap:8px;}
#cpanel .c-inp{flex:1;min-height:44px;max-height:136px;padding:11px 16px;border-radius:22px;border:1.5px solid #e4e6eb;background:#f0f2f5;color:#050505;font-size:16px;line-height:1.45;resize:none;-webkit-overflow-scrolling:touch;transition:height .14s ease,border-color .16s ease,box-shadow .16s ease,background-color .16s ease;will-change:height;}
#cpanel .c-inp:focus{border-color:#0866ff;box-shadow:0 0 0 3px rgba(8,102,255,0.1);background:#fff;}
#cpanel .c-send{width:42px;height:42px;min-width:46px;min-height:46px;border-radius:50%;border:none;background:#0866ff;box-shadow:0 3px 12px rgba(8,102,255,0.4);transition:transform .16s ease,filter .16s ease,opacity .16s ease;}
#cpanel .c-send:active{transform:scale(.96);}
#cpanel .c-send:disabled{opacity:.45;filter:saturate(.7);cursor:not-allowed;box-shadow:none;}
#cpanel .c-send svg{width:16px;height:16px;left:1px;position:relative;}

#cpanel .cinput-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;padding:0 2px;min-height:17px;}
#cpanel .cinput-hint{font-size:11px;line-height:1.3;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#cpanel .cinput-typing{font-size:11px;line-height:1.3;color:#2563eb;font-weight:700;opacity:0;transform:translateY(2px);transition:opacity .16s ease,transform .16s ease;}
#cpanel.cpanel.is-typing .cinput-typing{opacity:1;transform:translateY(0);}

#cpanel .chat-emoji-panel{position:absolute;left:8px;right:8px;bottom:68px;width:auto;max-height:260px;padding:0;border:1px solid #e4e6eb;border-radius:14px;background:#fff;box-shadow:0 20px 38px rgba(15,23,42,.18);overflow:hidden;}
#cpanel .chat-emoji-grid{max-height:240px;overflow:auto;padding:8px;}

#cpanel .chat-upload-progress{margin:8px 0 0;padding:8px 10px;border-radius:10px;background:#e7f0ff;border:1px solid #bfd3ff;color:#1d4ed8;font-size:11px;font-weight:700;}
#cpanel .chat-drop-hint{margin:8px 0 0;padding:9px 10px;border-radius:10px;border:1px dashed #93c5fd;background:#eff6ff;color:#1e40af;font-size:11px;text-align:center;}

#cpanel.cpanel.drag-over .chat-drop-hint{display:block !important;}
#cpanel.cpanel.drag-over .cmsgs{outline:2px dashed #60a5fa;outline-offset:-4px;}

@media (max-width:540px){
  #cpanel.cpanel{
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100dvh;
    border-radius:18px 18px 0 0;
    transform:translateY(100%);
    opacity:1;
  }
  #cpanel.cpanel.open{transform:translateY(0);}
  .cfab{bottom:calc(16px + env(safe-area-inset-bottom, 0px));right:18px;}
}
.tx-page-btn{border:1px solid rgba(124,58,237,.28);background:rgba(20,16,42,.75);color:#c4b5fd;border-radius:8px;padding:6px 9px;font-size:12px;cursor:pointer;}
.tx-page-btn.active{background:rgba(124,58,237,.35);border-color:rgba(167,139,250,.6);color:#fff;}
.tx-page-btn:disabled{opacity:.45;cursor:not-allowed;}

.modal-actions{display:flex;gap:10px;justify-content:flex-end;}
.btn-cancel{border:1px solid rgba(255,255,255,.15);background:rgba(22,18,46,.8);color:#c4b5fd;border-radius:10px;padding:10px 14px;cursor:pointer;font-weight:700;}
.btn-confirm-withdraw{border:none;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;border-radius:10px;padding:10px 14px;cursor:pointer;font-weight:800;}

#winNotiContainer{position:absolute;top:66px;right:12px;z-index:30;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.win-noti{display:flex;align-items:center;gap:8px;background:rgba(18,14,46,.96);border:1px solid rgba(124,58,237,.4);border-radius:10px;padding:9px 12px;color:#c4b5fd;font-size:12px;min-width:260px;opacity:0;transform:translateY(-8px);transition:all .3s;}
.win-noti.show{opacity:1;transform:translateY(0);}

@media (max-width: 900px){
  .hub-stats{grid-template-columns:1fr;}
  .boxes-wrap{bottom:170px;}
}

@media (max-width: 768px){
  #screen-game{
    position:fixed;
    inset:0;
    height:100dvh;
    overflow-y:auto !important;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    touch-action:pan-y;
  }
  /* Overlays must be fixed so they stick to the viewport when game screen scrolls */
  .modal-ov{position:fixed;z-index:80;}
  .win-ov{position:fixed;}
  .aws-screen{position:fixed;}
  .toast{position:fixed;top:58px;}

  #modalOv{padding:14px 10px;align-items:flex-start;overflow-y:auto;}
  #modalOv .mbox{width:min(760px,100%);max-height:none;margin-top:8px;margin-bottom:16px;}

  .g-nav{position:fixed;top:0;left:0;right:0;padding:max(0px, env(safe-area-inset-top)) 10px 0 10px;height:calc(52px + env(safe-area-inset-top));gap:7px;z-index:20;}
  .nav-brand{padding:5px 8px;min-width:0;}
  .nav-brand-name{max-width:90px;overflow:hidden;text-overflow:ellipsis;}
  .nav-sess{padding:5px 8px;font-size:11px;gap:5px;min-width:0;max-width:118px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
  #gNavRightGroup{gap:6px;min-width:0;}
  .nav-home-btn{padding:7px 10px;min-height:34px;}
  .game-floating-feed{position:fixed;left:8px;right:8px;top:auto;bottom:max(8px, env(safe-area-inset-bottom));width:auto;gap:8px;z-index:19;}
  .game-floating-feed .home-feed-item{padding:9px 10px;border-radius:12px;}
  .game-floating-feed .home-feed-icon{width:30px;height:30px;}
  .game-floating-feed .home-feed-title{font-size:12px;}
  .game-floating-feed .home-feed-sub{font-size:11px;}
  .game-floating-feed .home-feed-time{font-size:10px;}

  .g-wallet{
    position:fixed;
    top:60px;
    left:auto;
    right:8px;
    width:min(232px, calc(100vw - 16px));
    bottom:auto;
    padding:0;
    z-index:18;
  }
  .wallet-panel{
    max-width:none;
    border-radius:12px;
    padding:6px 8px;
    gap:7px;
    box-shadow:0 8px 24px rgba(0,0,0,.52),0 0 0 1px rgba(148,163,184,.16) inset;
  }
  .wallet-main{gap:2px;}
  .wallet-main-head{gap:0;}
  .wsub{display:none;}
  .wallet-currency-grid{grid-template-columns:minmax(0,1fr);gap:0;}
  .wallet-currency-item{padding:0;min-height:0;border-radius:0;}
  .wallet-currency-code{font-size:9px;}
  .wallet-currency-badge{font-size:9px;padding:2px 5px;}
  .wallet-currency-symbol{font-size:11px;}
  .wallet-currency-amount span:last-child{font-size:20px;}
  .wallet-currency-note{font-size:9px;margin-top:5px;}
  .wbtns{flex-direction:row;gap:5px;}
  .wbtn,.wbtn.rut,.wbtn.doi{width:28px;height:28px;border-width:1px;box-shadow:none;}
  .wbtn svg,.wbtn.rut svg,.wbtn.doi svg{width:12px;height:12px;}

  .boxes-wrap{
    position:relative;
    display:block;
    top:auto;
    bottom:auto;
    left:auto;
    right:auto;
    margin-top:144px;
    padding-top:8px;
    padding-bottom:130px;
    width:100%;
  }

  .game-hero{width:min(680px,96vw);margin-bottom:12px;}
  .game-hero-logo{width:104px;height:104px;margin-bottom:8px;border-radius:14px;}
  .game-hero-title{font-size:38px;}
  .game-hero-subtitle{font-size:18px;max-width:94vw;min-height:30px;}

  .boxes-row{
    display:flex;
    flex-direction:column;
    gap:10px;
    width:auto;
    align-items:center;
    justify-content:flex-start;
  }
  .box-wrap{flex:0 0 auto;width:auto;}

  /* Keep mobile box size identical to desktop card size */
  .gcard{width:320px;height:340px;max-height:none;}
  .box-caption-title{font-size:18px;}
  .box-caption-sub{font-size:11px;}
}

@media (max-width: 640px){
  .g-nav{padding:max(0px, env(safe-area-inset-top)) 8px 0 8px;height:calc(50px + env(safe-area-inset-top));}
  .nav-home-btn{padding:7px 10px;font-size:11px;min-height:32px;}
  .nav-brand{font-size:13px;gap:6px;}
  .nav-brand-name{max-width:56px;}
  .nav-sess{display:none;}
  #gNavRightGroup{gap:5px;}
  .nav-icon-box{width:26px;height:26px;}
  .home-floating-feed{left:10px;right:10px;width:auto;bottom:10px;gap:8px;}
  .home-feed-item{padding:9px 10px;border-radius:12px;}
  .home-feed-icon{width:30px;height:30px;}
  .home-feed-title{font-size:12px;}
  .home-feed-sub{font-size:11px;}
  .home-feed-time{font-size:10px;}
  .game-floating-feed{left:6px;right:6px;top:auto;bottom:max(6px, env(safe-area-inset-bottom));width:auto;gap:7px;}
  .g-wallet{top:56px;left:auto;right:6px;width:min(206px, calc(100vw - 12px));}
  .wallet-panel{padding:5px 7px;gap:6px;border-radius:11px;}
  .wallet-main{gap:2px;}
  .wallet-main-head{gap:0;}
  .wi{width:34px;height:34px;border-radius:9px;}
  .wi svg{width:16px;height:16px;}
  .wlabel{font-size:8px;line-height:1.1;}
  .wsub{display:none;}
  .wallet-currency-grid{gap:0;}
  .wallet-currency-item{padding:0;min-height:0;}
  .wallet-currency-code{font-size:9px;}
  .wallet-currency-badge{font-size:8px;padding:2px 4px;}
  .wallet-currency-symbol{font-size:10px;}
  .wallet-currency-amount span:last-child{font-size:17px;}
  .wallet-currency-note{font-size:8px;line-height:1.25;}
  .wbtns{flex-direction:row;gap:4px;}
  .wbtn,.wbtn.rut,.wbtn.doi{width:25px;height:25px;padding:0;font-size:0;gap:0;border-width:1px;box-shadow:none;}
  .wbtn svg,.wbtn.rut svg,.wbtn.doi svg{width:10px;height:10px;}

  .boxes-wrap{margin-top:126px;padding-top:6px;padding-bottom:110px;}
  .game-hero-logo{width:88px;height:88px;}
  .game-hero-title{font-size:27px;}
  .game-hero-subtitle{font-size:14px;line-height:1.25;min-height:26px;}
  .boxes-row{gap:8px;}
  .gcard{width:320px;height:340px;max-height:none;}
  .box-caption-title{font-size:16px;}
  .box-caption-sub{font-size:10px;}
  .quick-tools{top:calc(50% + 98px);left:8px;right:8px;}
  .quick-btn{font-size:11px;padding:6px 9px;}

  .aws-inner{width:100%;padding:18px 12px 20px;}
  .aws-title{font-size:15px;margin-bottom:12px;}
  .aws-countdown-wrap{display:block;width:100%;padding:12px 8px;margin-bottom:12px;}
  .aws-countdown{font-size:34px;letter-spacing:2px;}
  .aws-prize-card{display:block;width:100%;padding:14px 12px;margin-bottom:12px;min-width:0;}
  .aws-prize-icon{font-size:32px;margin-bottom:4px;}
  .aw-prize-img{width:60px;height:60px;}
  .aws-prize-name{font-size:17px;margin-bottom:8px;}
  .aws-badge{font-size:11px;padding:6px 12px;}
  .aws-assistant-wrap{gap:8px;padding:8px 9px;border-radius:12px;margin-bottom:10px;}
  .aws-robot-img{width:58px;height:58px;flex-basis:58px;border-radius:10px;}
  .aws-assistant-title{font-size:10px;margin-bottom:2px;}
  .aws-assistant-text{font-size:11px;line-height:1.35;}
  .aws-msg-list{margin:10px 0;gap:6px;}
  .aws-msg{font-size:12px;line-height:1.45;text-align:left;}
  .aws-conn-row{font-size:11px;margin-bottom:8px;}
  .aws-note{font-size:11px;line-height:1.35;}
  #awActionButtons{gap:8px !important;flex-direction:column;}
  .aws-btn{width:100%;min-width:0;padding:12px 14px;font-size:14px;}
}

@media (max-width: 400px){
  .nav-home-btn span{display:none;}
  .nav-home-btn{padding:8px;gap:0;width:36px;height:36px;justify-content:center;min-width:36px;}
}

@media (max-width: 768px){
  /* Keep game background pinned while #screen-game scrolls on mobile. */
  .game-theme-bg{
    position:fixed;
    inset:0;
  }

  .game-theme-bg-frame{
    width:100vw;
    height:100dvh;
  }

  #screen-game{
    background:#060714;
  }
}

@media (max-width: 768px){
  /* Mobile performance profile: keep animations to transform/opacity only. */
  *, *::before, *::after {
    backdrop-filter:none !important;
    filter:none !important;
  }

  .gcard,
  .wallet-panel,
  .wov-modal,
  .home-feed-item,
  .chat-toast,
  .bsub,
  .wbtn,
  .nav-home-btn {
    transition-property: transform, opacity !important;
    transition-duration: .2s !important;
    box-shadow:none !important;
  }

  .game-hero,
  .boxes-wrap,
  .wallet-panel,
  .g-wallet,
  .game-floating-feed {
    min-height:1px;
  }
}

/* Final cleanup for opened-card reward area */
.gcard.result-opened.gift-card::before,
.gcard.result-opened.gift-card::after{
  display:none !important;
}

.gcard.result-opened .box-layer,
.gcard.result-opened .box-lid,
.gcard.result-opened .box-body,
.gcard.result-opened .box-spark,
.gcard.result-opened .box-glow{
  display:none !important;
}

.gcard.result-opened .result-reward-layer{
  position:absolute !important;
  inset:12px !important;
  left:auto !important;
  top:auto !important;
  transform:none !important;
  animation:none !important;
}

.gcard.result-opened .result-media-shell{
  border-radius:14px;
  border:1px solid rgba(110,231,183,.34);
  background:linear-gradient(165deg,rgb(8,40,30),rgb(10,62,44));
  overflow:hidden;
}

.gcard.result-vip{
  border-color:rgba(245,158,11,.92) !important;
  background:linear-gradient(162deg,rgb(14,62,34),rgb(70,56,12),rgb(9,44,27)) !important;
  box-shadow:0 0 58px rgba(245,158,11,.5),0 0 112px rgba(251,191,36,.24),inset 0 0 0 1px rgba(253,224,71,.32),0 12px 34px rgba(0,0,0,.62) !important;
}

.gcard.result-vip .result-name-line{
  color:#fef3c7 !important;
  text-shadow:none !important;
}

/* Opened card reveal sequence: shake box -> open lid -> reveal prize -> name -> value */
.gcard.result-opened.reveal-seq .box-layer,
.gcard.result-opened.reveal-seq .box-lid,
.gcard.result-opened.reveal-seq .box-body{
  display:block !important;
}

.gcard.result-opened.reveal-seq .box-layer{
  opacity:1 !important;
  transform:none !important;
  will-change:transform;
}

.gcard.result-opened.reveal-seq .box-lid{
  opacity:1 !important;
  transform:rotate(0deg) translate(0,0) !important;
  transform-origin:center bottom;
  will-change:transform,opacity;
}

.gcard.result-opened.reveal-seq .box-body{
  opacity:1 !important;
}

.gcard.result-opened.reveal-seq .result-reward-layer{
  position:absolute !important;
  inset:12px !important;
  transform:none !important;
  animation:none !important;
}

.gcard.result-opened.reveal-seq .result-media-shell{
  opacity:0;
  transform:translateY(18px) scale(.82);
  filter:blur(2px);
  will-change:transform,opacity,filter;
  transition:transform .42s cubic-bezier(.22,1,.36,1),opacity .42s ease,filter .42s ease;
}

.gcard.result-opened.reveal-seq .result-name-line,
.gcard.result-opened.reveal-seq .result-amount-line,
.gcard.result-opened.reveal-seq .result-value-line,
.gcard.result-opened.reveal-seq .result-badge-line,
.gcard.result-opened.reveal-seq .rplab{
  opacity:0;
  transform:translateY(14px);
  transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .34s ease;
  will-change:transform,opacity;
}

.gcard.result-opened.reveal-seq.reveal-shake .box-layer{
  animation:boxShakeStrong .76s cubic-bezier(.36,.07,.19,.97) both;
}

.gcard.result-opened.reveal-seq.reveal-lid-open .box-lid{
  animation:lidOpenStrong .56s cubic-bezier(.4,0,.2,1) forwards;
}

.gcard.result-opened.reveal-seq.reveal-prize .result-media-shell{
  opacity:1;
  transform:translateY(0) scale(1);
  filter:blur(0);
}

.gcard.result-opened.reveal-seq.reveal-name .result-name-line,
.gcard.result-opened.reveal-seq.reveal-name .result-value-line,
.gcard.result-opened.reveal-seq.reveal-name .result-badge-line{
  opacity:1;
  transform:translateY(0);
}

.gcard.result-opened.reveal-seq.reveal-value .result-amount-line,
.gcard.result-opened.reveal-seq.reveal-value .rplab{
  opacity:1;
  transform:translateY(0);
}

.gcard.result-opened.reveal-seq.reveal-done .box-lid{
  transform:rotate(-62deg) translate(-12px,-28px);
  opacity:.12;
}

.gcard.result-opened.reveal-seq.reveal-done .box-body{
  opacity:.42;
}

@keyframes boxShakeStrong{
  0%,100%{transform:translate3d(0,0,0) rotate(0deg);}
  12%{transform:translate3d(-5px,0,0) rotate(-2.8deg);}
  24%{transform:translate3d(5px,0,0) rotate(2.8deg);}
  36%{transform:translate3d(-4px,0,0) rotate(-2.2deg);}
  48%{transform:translate3d(4px,0,0) rotate(2.2deg);}
  60%{transform:translate3d(-3px,0,0) rotate(-1.7deg);}
  72%{transform:translate3d(3px,0,0) rotate(1.7deg);}
  84%{transform:translate3d(-1px,0,0) rotate(-.8deg);}
}

@keyframes lidOpenStrong{
  0%{transform:rotate(0deg) translate(0,0);opacity:1;}
  100%{transform:rotate(-62deg) translate(-12px,-28px);opacity:.12;}
}

/* Gift-boxes (1).html style pack for current 3-box UI */
#boxesRow .gcard,
#boxesRow .gcard *{
  box-sizing:border-box;
}

#boxesRow .gcard:not(.gift-card) .box-area,
#boxesRow .gcard:not(.gift-card) .box-layer,
#boxesRow .gcard:not(.gift-card) .box-lid,
#boxesRow .gcard:not(.gift-card) .box-body,
#boxesRow .gcard:not(.gift-card) .box-glow,
#boxesRow .gcard:not(.gift-card) .result-reward-layer,
#boxesRow .gcard:not(.gift-card) .result-media-shell,
#boxesRow .gcard:not(.gift-card) .result-opened-chip,
#boxesRow .gcard:not(.gift-card) .card-divider,
#boxesRow .gcard:not(.gift-card) .text-area,
#boxesRow .gcard:not(.gift-card) .box-title,
#boxesRow .gcard:not(.gift-card) .box-subtitle,
#boxesRow .gcard:not(.gift-card) .btn-open,
#boxesRow .gcard:not(.gift-card) .box-hint,
#boxesRow .gcard:not(.gift-card) .rplab,
#boxesRow .gcard:not(.gift-card) .result-name-line,
#boxesRow .gcard:not(.gift-card) .result-amount-line,
#boxesRow .gcard:not(.gift-card) .result-value-line,
#boxesRow .gcard:not(.gift-card) .result-badge-line{
  display:none !important;
}

#screen-game .stars{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  overflow:hidden;
}

#screen-game .star{
  position:absolute;
  border-radius:50%;
  background:white;
  animation:twinkleGift var(--dur,3s) ease-in-out infinite var(--delay,0s);
}

#boxesRow.scene{
  position:relative;
  z-index:1;
}

#boxesRow{
  display:flex;
  gap:40px;
  align-items:flex-start;
  justify-content:center;
  flex-wrap:wrap;
}

#boxesRow .box-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
}
#boxesRow .box-wrap.box-wrap-draggable{cursor:grab;}
#boxesRow .box-wrap.box-wrap-draggable.dragging{opacity:.55;cursor:grabbing;}
#boxesRow .box-wrap.box-wrap-draggable.over .gcard{outline:2px dashed rgba(59,130,246,.8);outline-offset:4px;}

#boxesRow .gcard{
  position:relative;
  width:300px;
  min-height:492px;
  border-radius:24px;
  background:linear-gradient(168deg,rgba(9,6,28,.99) 0%,rgba(17,10,44,.98) 46%,rgba(8,6,24,.99) 100%);
  border:1.5px solid rgba(167,139,250,.45);
  overflow:hidden;
  cursor:pointer;
  transition:transform .38s cubic-bezier(.34,1.56,.64,1), box-shadow .38s ease, border-color .28s ease;
  animation:giftCardIn .62s cubic-bezier(.34,1.56,.64,1) both;
  will-change:transform,box-shadow;
  box-shadow:0 2px 0 rgba(167,139,250,.2) inset,0 14px 54px rgba(0,0,0,.72),0 0 0 1px rgba(139,92,246,.08);
}
/* stagger the card entrance */
#boxesRow .box-wrap:nth-child(1) .gcard{animation-delay:.05s;}
#boxesRow .box-wrap:nth-child(2) .gcard{animation-delay:.18s;}
#boxesRow .box-wrap:nth-child(3) .gcard{animation-delay:.31s;}

#boxesRow .gcard:hover{
  transform:translateY(-12px) scale(1.03);
}

#boxesRow .gcard.unlucky{--glow:rgba(109,40,217,.3);}
#boxesRow .gcard.normal{--glow:rgba(34,197,94,.3);}
#boxesRow .gcard.vip{--glow:rgba(251,191,36,.35);}

#boxesRow .gcard:hover{
  box-shadow:0 30px 80px var(--glow),0 0 0 1px rgba(167,139,250,.25);
}

#boxesRow .gcard::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.06) 50%,transparent 70%);
  transform:translateX(-100%);
  transition:transform .6s ease;
  pointer-events:none;
  z-index:10;
}

#boxesRow .gcard:hover::after{
  transform:translateX(100%);
}

#boxesRow .gcard.unlucky::after{
  display:none;
}

#boxesRow .chip{
  position:absolute;
  top:14px;
  right:14px;
  z-index:20;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  padding:4px 10px;
  border-radius:20px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.15);
  backdrop-filter:blur(8px);
  color:rgba(255,255,255,.75);
}

#boxesRow .img-shell{
  position:relative;
  width:100%;
  height:318px;
  overflow:hidden;
  background:
    radial-gradient(120% 84% at 14% 4%,rgba(168,85,247,.24) 0%,rgba(168,85,247,0) 52%),
    radial-gradient(100% 82% at 90% -8%,rgba(34,211,238,.2) 0%,rgba(34,211,238,0) 58%),
    linear-gradient(160deg,rgba(58,20,126,.96) 0%,rgba(26,12,74,.97) 46%,rgba(12,6,34,.985) 100%);
  border-bottom:1px solid rgba(124,58,237,.18);
}

#boxesRow .img-shell img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  position:absolute;
  inset:0;
  transition:transform .65s cubic-bezier(.25,.46,.45,.94),filter .4s ease;
  filter:brightness(.82) saturate(1.1);
}

#boxesRow .img-shell .result-reward-image{
  width:100% !important;
  height:100% !important;
  padding:0 !important;
  border:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  transform:none !important;
}

#boxesRow .gcard:hover .img-shell img{
  transform:scale(1.12);
  filter:brightness(1.08) saturate(1.45);
}

#boxesRow .gcard:hover .img-shell .result-reward-image,
#boxesRow .img-shell .result-reward-image:hover{
  transform:scale(1.12) !important;
}

#boxesRow .img-shell::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:65%;
  background:
    linear-gradient(to top,rgba(8,5,24,1) 0%,rgba(8,5,24,.62) 38%,rgba(8,5,24,.12) 66%,transparent 100%),
    repeating-linear-gradient(115deg,rgba(190,24,93,.045) 0 8px,rgba(14,165,233,.025) 8px 16px,rgba(124,58,237,.035) 16px 24px);
  mix-blend-mode:screen;
  pointer-events:none;
  z-index:2;
}

#boxesRow .img-shell::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 18% 22%, rgba(255,255,255,.16) 0%, transparent 52%),
    radial-gradient(ellipse at 82% 16%, rgba(196,181,253,.2) 0%, transparent 56%),
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,0) 38%);
  pointer-events:none;
  z-index:1;
}

#boxesRow .img-glow{
  position:absolute;
  inset:0;
  z-index:3;
  opacity:0;
  transition:opacity .45s ease;
  pointer-events:none;
}

#boxesRow .gcard.normal .img-glow{background:radial-gradient(ellipse 80% 65% at 50% 38%,rgba(34,197,94,.22) 0%,transparent 70%);}
#boxesRow .gcard.vip .img-glow{background:radial-gradient(ellipse 80% 65% at 50% 38%,rgba(251,191,36,.26) 0%,transparent 70%);}
#boxesRow .gcard:hover .img-glow{opacity:1;}

#boxesRow .img-scan{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  overflow:hidden;
}

#boxesRow .gcard:hover .img-scan::after{
  content:'';
  position:absolute;
  top:0;
  width:55%;
  height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.11),transparent);
  animation:scanSwipeGift .6s ease-out forwards;
}

#boxesRow .emoji-fallback{
  font-size:72px;
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  animation:pulseGift 2s ease-in-out infinite;
  z-index:5;
}

#boxesRow .cry-shell{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  z-index:12;
  background:radial-gradient(ellipse 80% 80% at 50% 52%,#1e0c44 0%,#08071a 100%);
}

#boxesRow .cry-shell::before{
  content:'';
  position:absolute;
  inset:0;
  background-image:radial-gradient(circle,rgba(167,139,250,.45) 1px,transparent 1px);
  background-size:28px 28px;
  opacity:.1;
}

#boxesRow .cry-emoji{
  font-size:108px;
  line-height:1;
  position:relative;
  z-index:14;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1),filter .4s ease;
  filter:drop-shadow(0 4px 24px rgba(109,40,217,.6));
  animation:cryBobGift 2.8s ease-in-out infinite;
}

#boxesRow .cry-shell:hover .cry-emoji{
  transform:scale(1.28);
  filter:drop-shadow(0 6px 48px rgba(139,92,246,1)) drop-shadow(0 0 30px rgba(167,139,250,.7));
  animation:none;
}

#boxesRow .rain{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transition:opacity .4s;
  z-index:1;
  overflow:hidden;
}

#boxesRow .cry-shell:hover .rain{opacity:1;}

#boxesRow .raindrop{
  position:absolute;
  top:-30px;
  width:1px;
  background:linear-gradient(180deg,transparent,rgba(147,197,253,.55),transparent);
  animation:rainFallGift var(--rdur,1s) linear infinite var(--rdelay,0s);
  border-radius:2px;
}

#boxesRow .cry-puddle{
  position:absolute;
  bottom:0;
  left:8%;
  right:8%;
  height:0;
  opacity:0;
  background:linear-gradient(to top,rgba(96,165,250,.28),transparent);
  border-radius:50%;
  transition:height .5s,opacity .5s;
}

#boxesRow .cry-shell:hover .cry-puddle{
  height:38px;
  opacity:1;
}

#boxesRow .cry-vignette{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:4;
  background:radial-gradient(ellipse 66% 66% at 50% 50%,transparent 30%,rgba(4,2,18,.84) 100%);
  opacity:0;
  transition:opacity .4s;
}

#boxesRow .cry-shell:hover .cry-vignette{opacity:1;}

#boxesRow .reward-badge{
  position:absolute;
  right:14px;
  bottom:14px;
  font-size:38px;
  z-index:6;
  transition:transform .4s cubic-bezier(.34,1.56,.64,1),filter .4s ease;
  animation:badgeFloatGift 3s ease-in-out infinite;
}

#boxesRow .gcard.normal .reward-badge{filter:drop-shadow(0 0 10px rgba(34,197,94,.65));}
#boxesRow .gcard.vip .reward-badge{filter:drop-shadow(0 0 12px rgba(251,191,36,.75));}

#boxesRow .gcard:hover .reward-badge{
  transform:scale(1.5) translateY(-6px) !important;
  animation:none;
}

#boxesRow .badge-sparks{
  position:absolute;
  right:8px;
  bottom:8px;
  width:64px;
  height:64px;
  z-index:5;
  pointer-events:none;
  opacity:0;
  transition:opacity .3s;
}

#boxesRow .gcard:hover .badge-sparks{opacity:1;}

#boxesRow .sp{
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  animation:spFlyGift var(--pd,1.2s) ease-out infinite var(--ps,0s);
}

#boxesRow .gcard.normal .sp{background:#4ade80;}
#boxesRow .gcard.vip .sp{background:#fbbf24;}

#boxesRow .tier-ribbon{
  position:absolute;
  top:18px;
  left:-6px;
  z-index:15;
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  border-radius:0 4px 4px 0;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%,6px 50%);
  padding:4px 14px 4px 18px;
}

#boxesRow .tier-ribbon.unlucky{background:rgba(109,40,217,.8);color:#c4b5fd;border:1px solid rgba(167,139,250,.3);}
#boxesRow .tier-ribbon.normal{background:rgba(21,128,61,.85);color:#86efac;border:1px solid rgba(34,197,94,.3);}
#boxesRow .tier-ribbon.vip{background:linear-gradient(90deg,#92400e,#b45309);color:#fcd34d;border:1px solid rgba(251,191,36,.4);}

#boxesRow .card-body{
  padding:16px 18px 18px;
  position:relative;
}

#boxesRow .card-body::before{
  content:'';
  display:block;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(167,139,250,.65),rgba(124,58,237,.5),transparent);
  margin-bottom:14px;
}

#boxesRow .card-title{
  display:-webkit-box;
  width:100%;
  overflow:hidden;
  white-space:normal;
  text-overflow:ellipsis;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  max-height:calc(1.3em * 3);
  font-family:'Syne',sans-serif;
  font-size:17px;
  font-weight:800;
  color:#ddd6fe;
  margin-bottom:5px;
  letter-spacing:-.01em;
  line-height:1.3;
  text-shadow:0 1px 8px rgba(0,0,0,.5);
  transition:color .3s;
}

#boxesRow .gcard.vip .card-title{color:#fbbf24;}
#boxesRow .gcard:hover .card-title{color:#fff;}

#boxesRow .card-subtitle{
  font-size:13px;
  color:#9090b0;
  margin-bottom:12px;
  line-height:1.5;
}

#boxesRow .card-amount{
  font-size:24px;
  font-weight:800;
  font-variant-numeric:tabular-nums;
  margin-bottom:10px;
  background:linear-gradient(90deg,#c4b5fd,#a78bfa,#818cf8);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  text-shadow:none;
  filter:drop-shadow(0 0 10px rgba(139,92,246,.36));
}

#boxesRow .gcard.vip .card-amount{
  background:linear-gradient(90deg,#fbbf24,#f59e0b,#fcd34d);
  -webkit-background-clip:text;
  background-clip:text;
}

#boxesRow .gcard.normal .card-amount{
  background:linear-gradient(90deg,#4ade80,#22c55e);
  -webkit-background-clip:text;
  background-clip:text;
}

#boxesRow .status-row{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:600;
}

#boxesRow .status-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  flex-shrink:0;
}

#boxesRow .card-body.card-body-unified{
  display:flex;
  flex-direction:column;
  min-height:150px;
}

#boxesRow .card-body.card-body-unified .card-title{
  margin-bottom:8px;
  min-height:44px;
}

#boxesRow .card-body.card-body-unified .card-subtitle{
  min-height:38px;
  margin-bottom:10px;
}

#boxesRow .card-body.card-body-unified .status-row{
  margin-top:auto;
}

#boxesRow .status-redeemed{color:#4ade80;}
#boxesRow .status-redeemed .status-dot{background:#22c55e;box-shadow:0 0 6px #22c55e;}
#boxesRow .status-confirmed{color:#34d399;}
#boxesRow .status-confirmed .status-dot{background:#10b981;box-shadow:0 0 6px #10b981;}
#boxesRow .status-declined{color:#6b7280;}
#boxesRow .status-declined .status-dot{background:#6b7280;}
#boxesRow .status-pending{color:#f59e0b;}
#boxesRow .status-pending .status-dot{background:#f59e0b;box-shadow:0 0 6px #f59e0b;}
#boxesRow .status-ready{color:#93c5fd;}
#boxesRow .status-ready .status-dot{background:#60a5fa;box-shadow:0 0 6px #60a5fa;}

#boxesRow .particles{
  position:absolute;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:20;
  opacity:.32;
  transition:opacity .3s;
}

#boxesRow .gcard:hover .particles,
#boxesRow .gcard.reveal-seq .particles,
#boxesRow .gcard.opening-shake .particles{opacity:1;}

#boxesRow .particle{
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  box-shadow:0 0 10px rgba(255,255,255,.45), 0 0 20px rgba(167,139,250,.34);
  animation:particleFlyGift var(--pdur,1.5s) ease-out infinite var(--pdelay,0s);
}

#boxesRow .gcard.opening-shake .box-layer,
#boxesRow .gcard.opening-shake .box-body{
  animation:boxInnerRattle .24s ease-in-out infinite;
}

#boxesRow .gcard.opening-shake .box-spark{
  animation-duration:.85s;
}

#boxesRow .glow-ring{
  position:absolute;
  inset:-2px;
  border-radius:22px;
  opacity:0;
  transition:opacity .4s;
  pointer-events:none;
  z-index:-1;
}

#boxesRow .gcard.unlucky .glow-ring{box-shadow:0 0 40px 8px rgba(109,40,217,.4);}
#boxesRow .gcard.normal .glow-ring{box-shadow:0 0 40px 8px rgba(34,197,94,.35);}
#boxesRow .gcard.vip .glow-ring{box-shadow:0 0 40px 12px rgba(251,191,36,.4);}
#boxesRow .gcard:hover .glow-ring{opacity:1;}

#boxesRow .gcard.vip{border-color:rgba(251,191,36,.4);}

#boxesRow .gcard.vip::before{
  content:'';
  position:absolute;
  inset:-1px;
  border-radius:21px;
  background:linear-gradient(135deg,rgba(251,191,36,.3),transparent 40%,rgba(251,191,36,.15) 70%,transparent);
  z-index:0;
  pointer-events:none;
  transition:opacity .4s;
  opacity:.6;
}

#boxesRow .gcard.vip:hover::before{opacity:1;}

@keyframes giftCardIn{
  from{opacity:0;transform:translateY(40px) scale(.92);}
  to{opacity:1;transform:translateY(0) scale(1);}
}

@keyframes twinkleGift{
  0%,100%{opacity:.15;transform:scale(1);}
  50%{opacity:.8;transform:scale(1.4);}
}

@keyframes pulseGift{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.08);}
}

@keyframes cryBobGift{
  0%,100%{transform:translateY(0) rotate(-1.5deg);}
  50%{transform:translateY(-7px) rotate(1.5deg);}
}

@keyframes scanSwipeGift{
  from{left:-60%;}
  to{left:140%;}
}

@keyframes rainFallGift{
  to{transform:translateY(360px);opacity:0;}
}

@keyframes badgeFloatGift{
  0%,100%{transform:translateY(0) rotate(-5deg) scale(1);}
  50%{transform:translateY(-8px) rotate(5deg) scale(1.05);}
}

@keyframes spFlyGift{
  0%{transform:translate(32px,32px) scale(0);opacity:0;}
  15%{opacity:1;transform:translate(calc(32px + var(--px,0px)),calc(32px + var(--py,0px))) scale(1.2);}
  80%{opacity:.5;}
  100%{transform:translate(calc(32px + var(--px,0px) * 2.2),calc(32px + var(--py,0px) * 2.2)) scale(0);opacity:0;}
}

@keyframes particleFlyGift{
  0%{transform:translate(0,0) scale(1);opacity:.9;}
  100%{transform:translate(var(--px,24px),var(--py,-94px)) scale(0);opacity:0;}
}

@keyframes boxInnerRattle{
  0%{transform:translateX(0) translateY(0) rotate(0deg);}
  25%{transform:translateX(-1.8px) translateY(.8px) rotate(-.7deg);}
  50%{transform:translateX(1.8px) translateY(-.8px) rotate(.8deg);}
  75%{transform:translateX(-1px) translateY(.6px) rotate(-.45deg);}
  100%{transform:translateX(0) translateY(0) rotate(0deg);}
}

@keyframes boxOpenWave{
  0%{transform:translate(-50%,-50%) scale(.2);opacity:.92;}
  45%{opacity:.65;}
  100%{transform:translate(-50%,-50%) scale(8);opacity:0;}
}

@keyframes normalTierIdle{
  0%,100%{transform:rotateX(8deg) rotateY(-4deg) translateY(0);}
  50%{transform:rotateX(10deg) rotateY(-2deg) translateY(-4px);}
}

@keyframes vipTierFloat{
  0%,100%{transform:scale(1.08) rotateX(14deg) rotateY(-10deg) translateY(-2px);}
  50%{transform:scale(1.12) rotateX(12deg) rotateY(-6deg) translateY(-10px);}
}

@keyframes vipOrbitSpin{
  0%{transform:translate(-50%,-50%) rotate(0deg);}
  100%{transform:translate(-50%,-50%) rotate(360deg);}
}

@keyframes vipOrbitSpinReverse{
  0%{transform:translate(-50%,-50%) rotate(0deg);}
  100%{transform:translate(-50%,-50%) rotate(-360deg);}
}

@keyframes unluckyTierGlitch{
  0%,100%{transform:rotateX(6deg) rotateY(8deg) skewX(-2deg) translate(0,0);}
  20%{transform:rotateX(7deg) rotateY(7deg) skewX(-2deg) translate(-1px,1px);}
  40%{transform:rotateX(5deg) rotateY(9deg) skewX(-3deg) translate(1px,-1px);}
  60%{transform:rotateX(7deg) rotateY(10deg) skewX(-2deg) translate(-1px,0);}
  80%{transform:rotateX(6deg) rotateY(8deg) skewX(-1deg) translate(1px,1px);}
}

@media (max-width: 768px){
  #screen-game .boxes-wrap{
    padding-inline:10px;
  }

  #boxesRow{
    gap:14px;
    width:100%;
    padding-inline:2px;
  }

  #boxesRow .box-wrap{
    width:100%;
    max-width:370px;
  }

  #boxesRow .gcard{
    width:100%;
    min-height:390px;
    border-radius:16px;
  }

  #boxesRow .img-shell{
    height:260px;
  }

  #boxesRow .tier-ribbon{
    top:12px;
    font-size:8px;
    letter-spacing:.11em;
    padding:3px 10px 3px 14px;
  }

  #boxesRow .chip{
    top:10px;
    right:10px;
    font-size:9px;
    padding:3px 8px;
  }

  #boxesRow .card-body{
    padding:14px 14px 16px;
  }

  #boxesRow .card-title{
    font-size:17px;
  }

  #boxesRow .card-subtitle{
    font-size:12px;
    margin-bottom:10px;
  }

  #boxesRow .card-amount{
    font-size:20px;
    margin-bottom:10px;
  }

  #boxesRow .box-caption-title{
    font-size:17px;
  }

  #boxesRow .box-caption-sub{
    font-size:11px;
  }
}

@media (max-width: 480px){
  #boxesRow .box-wrap{
    max-width:100%;
  }

  #boxesRow .gcard{
    min-height:380px;
  }

  #boxesRow .img-shell{
    height:236px;
  }

  #boxesRow .emoji-fallback{
    font-size:60px;
  }

  #boxesRow .cry-emoji{
    font-size:88px;
  }

  #boxesRow .reward-badge{
    font-size:32px;
    right:10px;
    bottom:10px;
  }
}

@media (hover: none), (pointer: coarse){
  #boxesRow .gcard:hover{
    transform:none;
    box-shadow:none;
  }

  #boxesRow .gcard:hover .img-shell img,
  #boxesRow .gcard:hover .img-shell .result-reward-image,
  #boxesRow .img-shell .result-reward-image:hover{
    transform:none !important;
    filter:brightness(.92) saturate(1.15) !important;
  }

  #boxesRow .gcard:hover .reward-badge{
    transform:none !important;
  }
}

/* Normalize reward media layout: keep image/icon centered and consistent size. */
.gcard.result-opened .result-reward-layer{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.gcard.result-opened .result-media-shell{
  width:min(100%, 154px) !important;
  height:min(100%, 154px) !important;
  aspect-ratio:1 / 1;
  margin:auto;
}

.gcard.result-opened .result-media-shell .result-reward-image{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center;
  border-radius:13px;
}

.gcard.result-opened .result-media-shell .result-reward-icon,
.gcard.result-opened .result-media-shell .result-reward-icon-prize{
  width:100%;
  height:100%;
  display:flex !important;
  align-items:center;
  justify-content:center;
  font-size:62px !important;
  line-height:1;
}

.gcard.result-vip .result-media-shell .result-reward-icon,
.gcard.result-vip .result-media-shell .result-reward-icon-prize{
  font-size:66px !important;
}

@media (max-width: 768px){
  .gcard.result-opened .result-media-shell{
    width:min(100%, 132px) !important;
    height:min(100%, 132px) !important;
  }

  .gcard.result-opened .result-media-shell .result-reward-icon,
  .gcard.result-opened .result-media-shell .result-reward-icon-prize{
    font-size:54px !important;
  }
}

/* Mobile wallet redesign */
@media (max-width: 768px){
  .g-wallet{
    top:56px;
    right:8px;
    left:auto;
    width:min(206px, calc(100vw - 12px));
    z-index:22;
  }

  .wallet-panel{
    border-radius:12px;
    padding:6px 8px;
    gap:6px;
    flex-direction:row;
    align-items:center;
    background:
      radial-gradient(circle at 92% 8%, rgba(34,211,238,.2), transparent 42%),
      radial-gradient(circle at 2% 100%, rgba(129,140,248,.2), transparent 54%),
      linear-gradient(155deg, rgba(25,18,56,.95) 0%, rgba(31,24,70,.93) 45%, rgba(15,22,44,.95) 100%);
    box-shadow:0 10px 22px rgba(8,5,28,.44),0 0 0 1px rgba(255,255,255,.05) inset;
  }

  .wallet-main{
    gap:2px;
  }

  .wallet-main-head{
    gap:0;
  }

  .wlabel{
    font-size:8px;
    letter-spacing:.07em;
  }

  .wsub{
    display:none;
  }

  .wallet-currency-amount{
    gap:2px;
  }

  .wallet-currency-symbol{
    font-size:11px;
  }

  .wallet-currency-amount span:last-child{
    font-size:19px;
    letter-spacing:.1px;
  }

  .wbtns{
    flex-direction:row;
    gap:4px;
    width:auto;
  }

  .wbtn{
    width:28px;
    height:28px;
    border-radius:10px;
    font-size:0;
    padding:0;
    gap:0;
    justify-content:center;
    letter-spacing:0;
  }

  .wbtn svg{
    width:12px;
    height:12px;
    flex-shrink:0;
  }

  .wbtn.rut,
  .wbtn.doi{
    width:28px;
    height:28px;
    box-shadow:none;
  }

  .boxes-wrap{
    margin-top:136px;
  }
}

@media (max-width: 480px){
  .g-wallet{
    top:54px;
    right:6px;
    left:auto;
    width:min(192px, calc(100vw - 10px));
  }

  .wallet-panel{
    padding:5px 7px;
    border-radius:11px;
    gap:5px;
  }

  .wallet-currency-amount span:last-child{
    font-size:17px;
  }

  .wbtn{
    width:25px;
    height:25px;
    border-radius:9px;
  }

  .wbtn svg{
    width:10px;
    height:10px;
  }

  .wbtn.rut{
    width:25px;
    height:25px;
  }

  .wbtn.rut svg{
    width:10px;
    height:10px;
  }

  .boxes-wrap{
    margin-top:124px;
  }
}

/* Final wallet icon parity on mobile (override conflicting older rules). */
@media (max-width: 768px){
  .g-wallet .wbtns{
    display:grid !important;
    grid-template-columns:repeat(2, 30px);
    gap:6px !important;
    align-items:center;
    justify-items:center;
  }

  .g-wallet .wbtn,
  .g-wallet .wbtn.rut,
  .g-wallet .wbtn.doi{
    width:30px !important;
    height:30px !important;
    min-width:30px;
    min-height:30px;
    padding:0 !important;
    border-radius:10px !important;
    font-size:0 !important;
    line-height:0;
  }

  .g-wallet .wbtn svg,
  .g-wallet .wbtn.rut svg,
  .g-wallet .wbtn.doi svg{
    width:13px !important;
    height:13px !important;
    display:block;
    flex-shrink:0;
  }
}

@media (max-width: 480px){
  .g-wallet .wbtns{
    grid-template-columns:repeat(2, 27px);
    gap:5px !important;
  }

  .g-wallet .wbtn,
  .g-wallet .wbtn.rut,
  .g-wallet .wbtn.doi{
    width:27px !important;
    height:27px !important;
    min-width:27px;
    min-height:27px;
    border-radius:9px !important;
  }

  .g-wallet .wbtn svg,
  .g-wallet .wbtn.rut svg,
  .g-wallet .wbtn.doi svg{
    width:11px !important;
    height:11px !important;
  }
}



/* ── Typing Bubble & Chat Upgrade ──────────────────────────────────── */
.chat-typing-bubble {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: rgba(124,58,237,.12);
  border-radius: 18px 18px 18px 4px;
  margin: 4px 0 4px 0;
  animation: ctbFadeIn .25s ease-out;
}

@keyframes ctbFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.typing-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #a78bfa;
  animation: typingBounce 1.2s infinite ease-in-out;
}
.typing-dot:nth-child(1) { animation-delay: 0s; }
.typing-dot:nth-child(2) { animation-delay: 0.18s; }
.typing-dot:nth-child(3) { animation-delay: 0.36s; }

@keyframes typingBounce {
  0%, 80%, 100% { transform: translateY(0); opacity: .6; }
  40%            { transform: translateY(-6px); opacity: 1; }
}

.typing-label {
  font-size: 11px;
  color: #a78bfa;
  font-style: italic;
  letter-spacing: .02em;
}

/* ══════════════════════════════════════════════════════════════════
   MOBILE REDESIGN: nav + wallet card (< 1000px)
   Sticky nav + full-width wallet card based on wallet-nav.html design.
   ══════════════════════════════════════════════════════════════════ */
@media (max-width: 999px) {

  /* Scroll container – mirrors existing 768px rule; extends to tablets */
  #screen-game {
    position: fixed;
    inset: 0;
    height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
    background: #060714;
  }

  .game-theme-bg { position: fixed; inset: 0; }
  .game-theme-bg-frame { width: 100vw; height: 100dvh; }

  /* Overlays stay fixed to viewport */
  .modal-ov { position: fixed !important; z-index: 80 !important; }
  .win-ov   { position: fixed !important; }
  .aws-screen { position: fixed !important; }
  .toast {
    position: fixed !important;
    top: auto !important;
    bottom: calc(86px + env(safe-area-inset-bottom, 0px)) !important;
    left: 10px !important;
    right: 10px !important;
    max-width: none !important;
    min-width: 0 !important;
    width: auto !important;
    transform: translate3d(0, 12px, 0) scale(0.98) !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.4;
    padding: 0;
    text-align: left;
  }
  .toast.show {
    transform: translate3d(0, 0, 0) scale(1) !important;
  }

  /* ── NAV: compact sticky pill-style bar ── */
  .g-nav {
    position: sticky !important;
    top: 0 !important;
    height: auto !important;
    padding: 11px 16px !important;
    gap: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: rgba(7,11,22,0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(139,92,246,0.15) !important;
    box-shadow: none !important;
    z-index: 50 !important;
  }

  /* Brand: no desktop pill background, takes remaining flex space */
  .nav-brand {
    flex: 1 !important;
    min-width: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    font-size: 13px !important;
  }

  .nav-icon-box {
    width: 32px !important;
    height: 32px !important;
    border-radius: 9px !important;
    flex-shrink: 0 !important;
    background: linear-gradient(135deg,#ffffff,#ffffff) !important;
    box-shadow: 0 0 14px rgba(124,58,237,0.55) !important;
  }

  .nav-brand-name {
    font-size: 13px !important;
    font-weight: 700 !important;
    max-width: 140px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* Session badge: rounded pill */
  .nav-sess {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #a78bfa !important;
    background: rgba(109,40,217,0.15) !important;
    border: 1px solid rgba(109,40,217,0.3) !important;
    border-radius: 20px !important;
    padding: 4px 11px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
  }

  /* Home button: transparent bordered pill */
  .nav-home-btn {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: rgba(255,255,255,0.07) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    border-radius: 20px !important;
    padding: 6px 13px !important;
    color: #f0f0ff !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    min-height: 0 !important;
  }
  .nav-home-btn:hover { background: rgba(255,255,255,0.13) !important; }

  .nav-home-btn svg {
    width: 13px !important;
    height: 13px !important;
    flex-shrink: 0 !important;
  }

  /* ── WALLET: remove fixed float, place as full-width card in flow ── */
  .g-wallet {
    position: static !important;
    width: 100% !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    padding: 12px 14px 0 !important;
    z-index: auto !important;
  }

  /* Card styling matching wallet-nav.html */
  .wallet-panel {
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 15px 16px 14px !important;
    border-radius: 18px !important;
    gap: 0 !important;
    background: linear-gradient(135deg,
      rgba(20,8,52,0.985) 0%,
      rgba(34,10,78,0.96) 50%,
      rgba(12,6,36,0.985) 100%
    ) !important;
    border: 1px solid rgba(139,92,246,0.32) !important;
    box-shadow: 0 8px 32px rgba(109,40,217,0.22),
      inset 0 0 0 1px rgba(255,255,255,0.04) !important;
    backdrop-filter: none !important;
  }

  /* Top shimmer line
  .wallet-panel::before {
    background: linear-gradient(90deg,
      transparent 5%,
      rgba(167,139,250,0.55) 50%,
      transparent 95%) !important;
  } */

  /* Glow orb top-right */
  .wallet-panel::after {
    content: '' !important;
    position: absolute !important;
    top: -50px !important;
    right: -50px !important;
    left: auto !important;
    width: 140px !important;
    height: 140px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(109,40,217,0.18), transparent 70%) !important;
    pointer-events: none !important;
  }

  /* wallet-main: horizontal row (icon | info+amount | buttons) */
  .wallet-main {
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 11px !important;
    margin-bottom: 12px !important;
  }

  .wallet-main-row {
    display: flex !important;
    align-items: flex-start !important;
    gap: 11px !important;
    margin-bottom: 12px !important;
  }

  /* Show wallet icon */
  .wi {
    display: flex !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 11px !important;
    background: rgba(109,40,217,0.28) !important;
    border: 1px solid rgba(139,92,246,0.38) !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    margin-top: 2px !important;
  }
  .wi svg {
    width: 17px !important;
    height: 17px !important;
    color: #a78bfa !important;
  }

  /* Info block stretches to fill */
  .winfo {
    flex: 1 !important;
    min-width: 0 !important;
  }

  .wlabel {
    font-size: 9.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.09em !important;
    color: rgba(240,240,255,0.5) !important;
    margin-bottom: 3px !important;
  }

  .wsub { display: none !important; }

  /* Currency item: clean, no card wrapper */
  .wallet-currency-item {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    min-height: 0 !important;
  }
  .wallet-currency-top { display: none !important; }

  /* Large amount display */
  .wallet-currency-amount {
    display: flex !important;
    align-items: baseline !important;
    gap: 3px !important;
    flex-wrap: nowrap !important;
    margin-top: 0 !important;
  }
  .wallet-currency-symbol {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #a78bfa !important;
    line-height: 1 !important;
  }
  .wallet-currency-amount span:last-child {
    font-size: 26px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.025em !important;
    background: linear-gradient(135deg, #ede9fe, #c4b5fd 60%, #a78bfa) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    text-shadow: none !important;
  }

  .wallet-btns-icon {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
  }

  .wicon-btn {
    width: 30px !important;
    height: 30px !important;
    border-radius: 9px !important;
    border: 1px solid rgba(255,255,255,0.13) !important;
    background: rgba(255,255,255,0.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: #f0f0ff !important;
  }

  .wicon-btn svg {
    width: 13px !important;
    height: 13px !important;
  }

  .wicon-btn.blue {
    background: rgba(59,130,246,0.18) !important;
    border-color: rgba(59,130,246,0.32) !important;
  }

  /* "Có thể rút ngay" indicator – hidden on desktop, shown here */
  .wallet-available-text {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #34d399 !important;
    margin-top: 4px !important;
  }
  .wallet-available-text::before {
    content: '✓';
    font-size: 10px;
  }

  /* Trust row: separator + bar */
  .wallet-trust-row {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 2px 3px !important;
    border-top: 1px solid rgba(139,92,246,0.14) !important;
    margin-top: 0 !important;
    margin-bottom: 11px !important;
    width: 100% !important;
  }
  .wallet-trust-label {
    font-size: 9.5px !important;
    color: rgba(240,240,255,0.5) !important;
    white-space: nowrap !important;
  }
  .wallet-trust-bar {
    flex: 1 !important;
    height: 5px !important;
    border-radius: 10px !important;
    background: rgba(255,255,255,0.1) !important;
    overflow: hidden !important;
  }
  .wallet-trust-val {
    font-size: 12px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    min-width: auto !important;
  }

  /* Action buttons: override icon-only to full-width text buttons */
  .g-wallet .wbtns {
    display: flex !important;
    flex-direction: row !important;
    gap: 9px !important;
    width: 100% !important;
    grid-template-columns: none !important;
    align-items: stretch !important;
  }

  .g-wallet .wbtn,
  .g-wallet .wbtn.rut,
  .g-wallet .wbtn.doi {
    flex: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 40px !important;
    border-radius: 11px !important;
    padding: 10px 8px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    gap: 6px !important;
    justify-content: center !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
  }

  .g-wallet .wbtn svg,
  .g-wallet .wbtn.rut svg,
  .g-wallet .wbtn.doi svg {
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
  }

  /* Button colours from wallet-nav.html */
  .g-wallet .wbtn.doi {
    background: rgba(59,130,246,0.18) !important;
    border: 1px solid rgba(59,130,246,0.32) !important;
    color: #93c5fd !important;
  }
  .g-wallet .wbtn.doi:hover {
    background: rgba(59,130,246,0.28) !important;
  }
  .g-wallet .wbtn.rut {
    background: rgba(16,185,129,0.18) !important;
    border: 1px solid rgba(16,185,129,0.32) !important;
    color: #6ee7b7 !important;
  }
  .g-wallet .wbtn.rut:hover {
    background: rgba(16,185,129,0.28) !important;
  }

  /* boxes-wrap flows naturally below the wallet card */
  .boxes-wrap {
    position: relative !important;
    display: block !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    margin-top: 16px !important;
    padding-top: 8px !important;
    padding-bottom: 100px !important;
    width: 100% !important;
  }

  /* Game boxes layout on mobile */
  .boxes-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: auto !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }
  .gcard { width: 320px !important; height: 340px !important; max-height: none !important; }

  /* Floating feed: stick to bottom */
  .game-floating-feed {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    width: auto !important;
    z-index: 19 !important;
  }

  /* Win notification container */
  #winNotiContainer {
    top: auto !important;
    bottom: 16px !important;
    right: 12px !important;
  }
}

/* ── 999px sub-breakpoint: ≤ 640px fine-tuning ── */
@media (max-width: 640px) {
  .nav-brand-name { max-width: 90px !important; }
  .nav-sess {
    display: flex !important;
    padding: 4px 9px !important;
    font-size: 10px !important;
    gap: 4px !important;
  }
  .nav-home-btn { padding: 6px 10px !important; font-size: 10px !important; }

  .g-wallet { padding: 10px 12px 0 !important; }
  .wallet-panel { padding: 13px 14px 12px !important; border-radius: 16px !important; }
  .wi { width: 32px !important; height: 32px !important; }
  .wallet-currency-symbol { font-size: 13px !important; }
  .wallet-currency-amount span:last-child { font-size: 22px !important; }
  .g-wallet .wbtn, .g-wallet .wbtn.rut, .g-wallet .wbtn.doi {
    padding: 9px 6px !important;
    font-size: 11px !important;
    min-height: 36px !important;
  }
}

/* ── 999px sub-breakpoint: ≤ 400px fine-tuning ── */
@media (max-width: 400px) {
  .nav-brand-name { max-width: 65px !important; }
  .nav-home-btn span[data-i18n] { display: none !important; }
  .nav-home-btn {
    padding: 7px !important;
    gap: 0 !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    justify-content: center !important;
    border-radius: 50% !important;
  }
  .wallet-currency-amount span:last-child { font-size: 19px !important; }
  .wallet-available-text { font-size: 9px !important; }
}