:root{
  --bg:#063b1e;
  --bg-top:#0b6a39;
  --bg-mid:#074d2c;
  --bg-bottom:#042817;
  --felt:#063f22;
  --felt2:#042e18;
  --card:rgba(255,255,255,0.10);
  --text:rgba(255,255,255,0.92);
  --muted:rgba(255,255,255,0.70);
  --line:rgba(255,255,255,0.14);
  --shadow:0 12px 35px rgba(0,0,0,0.38);
  --radius:16px;
  --surface-hi:rgba(255,255,255,0.07);
  --surface-lo:rgba(0,0,0,0.24);
  --floating-bottom:16px;
  --music-panel-bottom:156px;
  --mobile-bottom-fill:#08271b;
  --accent:#f6c453;
  --danger:#ff6b6b;
  --ok:#6ee7b7;
  --currency-eur:#f6c453;
  --currency-cash:#ff8f96;
  --currency-loyalty:#ff8f96;
  --currency-vip:#ffe28a;
  --heat-bonus-threshold-pct:70%;
  --viewport-height:100svh;
}
@supports not (height: 100svh){
  :root{
    --viewport-height:100vh;
  }
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{height:100%}
html{
  background-color:#072a18;
}
html.table-theme-sapphire{
  background-color:#091f39;
}
html.table-theme-crimson{
  background-color:#3b1515;
}
html.table-theme-obsidian{
  background-color:#171717;
}
html.table-theme-diamond{
  background-color:#1f1809;
}
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--text);
  min-height:100vh;
  min-height:100svh;
  height:auto;
  background:#072a18;
  background-image:linear-gradient(
    180deg,
    #116941 0%,
    #10643d 14%,
    #0e5b37 28%,
    #0c4f30 44%,
    #0a4329 60%,
    #093922 76%,
    #072f1b 88%,
    #062916 100%
  );
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position:center top;
  overflow-x:hidden;
  transition:background-image 360ms ease, background-color 360ms ease;
}
body.table-theme-sapphire{
  --mobile-bottom-fill:#0a294a;
  background-color:#091f39;
  background-image:linear-gradient(
    180deg,
    #0f4f7d 0%,
    #0f4a74 20%,
    #0d3f66 40%,
    #0c3458 62%,
    #0a2b4d 82%,
    #091f39 100%
  );
}
body.table-theme-sapphire .topbar{
  background:linear-gradient(180deg, rgba(12,42,76,0.96), rgba(11,35,63,0.9));
  border-bottom-color:rgba(173,220,255,0.36);
}
body.table-theme-crimson{
  --mobile-bottom-fill:#4a1919;
  background-color:#3b1515;
  background-image:linear-gradient(
    180deg,
    #7b2f2f 0%,
    #6f2a2a 18%,
    #632424 38%,
    #582020 58%,
    #4b1b1b 80%,
    #3b1515 100%
  );
}
body.table-theme-crimson .topbar{
  background:linear-gradient(180deg, rgba(74,22,22,0.96), rgba(56,18,18,0.9));
  border-bottom-color:rgba(255,183,183,0.34);
}
body.table-theme-obsidian{
  --mobile-bottom-fill:#1c1c1c;
  background-color:#171717;
  background-image:linear-gradient(
    180deg,
    #343434 0%,
    #2c2c2c 24%,
    #242424 48%,
    #1d1d1d 72%,
    #171717 100%
  );
}
body.table-theme-obsidian .topbar{
  background:linear-gradient(180deg, rgba(36,36,36,0.96), rgba(24,24,24,0.9));
  border-bottom-color:rgba(255,255,255,0.22);
}
body.table-theme-diamond{
  --mobile-bottom-fill:#2b220e;
  background-color:#1f1809;
  background-image:linear-gradient(
    180deg,
    #5d4a1a 0%,
    #4f3f16 22%,
    #433512 44%,
    #372b0f 68%,
    #2b220e 100%
  );
}
body.table-theme-diamond .topbar{
  background:linear-gradient(180deg, rgba(68,54,22,0.96), rgba(45,35,14,0.9));
  border-bottom-color:rgba(255,225,156,0.3);
}

/* ===== Confetti canvas ===== */
#confetti{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:90;
  opacity:0;
  transition:opacity 160ms ease;
}
#confetti.on{opacity:1}

/* ===== Topbar ===== */
.topbar{
  position:sticky;
  top:0;
  z-index:74;
  display:flex;
  justify-content:flex-start;
  align-items:center;
  flex-wrap:nowrap;
  padding:14px 16px 26px;
  gap:14px;

  background:linear-gradient(180deg, rgba(6,30,20,0.96), rgba(7,35,23,0.90));
  border-bottom:1px solid rgba(255,255,255,0.14);
  box-shadow:0 10px 24px rgba(0,0,0,0.35);
  backdrop-filter: blur(10px) saturate(130%);
}

.heatbar{
  position:absolute;
  left:16px;
  right:16px;
  bottom:5px;
  height:6px;
  border-radius:999px;
  background:rgba(0,0,0,0.44);
  border:1px solid rgba(255,255,255,0.16);
  box-shadow:0 2px 7px rgba(0,0,0,0.45) inset, 0 1px 0 rgba(255,255,255,0.08);
  overflow:hidden;
  pointer-events:none;
}
.heatbar-fill{
  width:0;
  height:100%;
  background:linear-gradient(90deg, rgba(102,241,171,0.95), rgba(255,219,122,0.98), rgba(255,114,114,0.98));
  box-shadow:0 0 10px rgba(255,180,120,0.4);
  transition:width 220ms ease, filter 220ms ease, opacity 220ms ease;
  filter:saturate(1);
}
.heatbar.ready .heatbar-fill{
  filter:saturate(1.2) brightness(1.05);
}
.heatbar.locked .heatbar-fill{
  opacity:0.86;
}
.heatbar-threshold{
  position:absolute;
  top:-1px;
  bottom:-1px;
  width:2px;
  left:var(--heat-bonus-threshold-pct);
  transform:translateX(-1px);
  background:rgba(255,255,255,0.85);
  box-shadow:0 0 6px rgba(255,255,255,0.5);
}

.brand{display:flex;align-items:center;gap:12px;min-width:0;flex:0 0 auto}
.dot{
  width:12px;height:12px;border-radius:999px;
  background:var(--accent);
  box-shadow:0 0 0 4px rgba(246,196,83,0.18);
}
.title{font-weight:800;letter-spacing:0.3px}
.subtitle{
  font-size:11px;
  color:var(--muted);
  min-height:14px;
  max-width:min(26vw, 220px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.hud{
  --hud-box-min-height:42px;
  --hud-box-pad-y:9px;
  --hud-box-pad-x:10px;
  --hud-box-radius:14px;
  --hud-box-gap:10px;
  display:flex;
  gap:10px;
  flex-wrap:nowrap;
  justify-content:flex-end;
  flex:1 1 auto;
  min-width:0;
}
.hud.ticker-active .hud-item{
  display:none;
}
.hud.ticker-active{
  align-items:stretch;
  background:transparent;
  border:none;
  box-shadow:none;
  padding:0;
}
.hud-event-ticker{
  display:none;
  align-items:center;
  min-width:0;
  flex:1 1 auto;
  min-height:var(--hud-box-min-height);
  border:1px solid #000;
  border-radius:var(--hud-box-radius);
  background:#000;
  box-shadow:none;
  backdrop-filter:none;
  padding:var(--hud-box-pad-y) var(--hud-box-pad-x);
  overflow:hidden;
  pointer-events:none;
}
.hud.ticker-active .hud-event-ticker{
  display:flex;
}
.hud-event-ticker-track{
  white-space:nowrap;
  font-size:13px;
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-weight:700;
  letter-spacing:0.06em;
  color:#ffffff;
  text-shadow:none;
  transform:translateX(100%);
}
.hud-event-ticker-track.run{
  animation:hudEventTickerMarquee var(--hud-ticker-duration, 3500ms) linear 1 both;
}
@keyframes hudEventTickerMarquee{
  from{
    transform:translateX(100%);
  }
  to{
    transform:translateX(calc(-100% - 24px));
  }
}
.hud-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--hud-box-gap);
  padding:var(--hud-box-pad-y) var(--hud-box-pad-x);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:var(--hud-box-radius);
  background:rgba(10,49,35,0.40);
  box-shadow:0 6px 18px rgba(0,0,0,0.25);
  backdrop-filter: blur(8px) saturate(130%);
  min-width:0;
  min-height:var(--hud-box-min-height);
  flex:1 1 0;
  position:relative;
  overflow:visible;
}
.hud-item-clickable{
  cursor:pointer;
  transition:transform 120ms ease, border-color 120ms ease, background 120ms ease;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}
@media (hover: hover) and (pointer: fine){
  .hud-item-clickable:hover{
    transform:translateY(-1px);
    border-color:rgba(255,255,255,0.28);
    background:rgba(14,60,42,0.5);
  }
}
.hud-item-clickable:active{
  transform:translateY(0);
}
.hud-item-clickable:focus{
  outline:none;
}
.hud-item-clickable:focus-visible{
  outline:2px solid rgba(255,255,255,0.76);
  outline-offset:2px;
}
.hud-item-clickable:focus:not(:focus-visible){
  outline:none;
}
.hud-label{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:10px;
  color:var(--muted);
  margin-bottom:0;
  white-space:nowrap;
  min-width:0;
}
.hud-label-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  line-height:1;
}
.hud-value{
  font-weight:800;
  font-size:16px;
  text-shadow:0 2px 10px rgba(0,0,0,0.55);
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
  text-align:right;
  white-space:nowrap;
  min-width:0;
}
.currency-money-amount{
  color:var(--currency-eur);
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1;
}
.hud-item.currency-eur .hud-value{
  color:var(--currency-eur);
}
.hud-item.currency-cash .hud-value{
  color:var(--currency-loyalty);
}
.hud-item.currency-vip .hud-value{
  color:var(--currency-vip);
}
#hud-currency-lp .hud-value{
  color:#8fd9ff;
}
#hud-currency-lp.lp-alert{
  border-color:rgba(255,96,96,0.86);
  box-shadow:
    0 0 0 1px rgba(255,194,194,0.18) inset,
    0 0 0 0 rgba(255,86,86,0.46),
    0 6px 18px rgba(0,0,0,0.25);
  animation:missionBtnPulse 1050ms ease-in-out infinite;
}
#hud-currency-bankroll.salary-flash{
  animation:hudSalaryFlash 980ms ease-out;
}
.hud-value.delta-active{
  font-weight:900;
  letter-spacing:0.01em;
  transform:translateY(-1px) scale(1.04);
  animation:hudValueDeltaPulse 260ms cubic-bezier(.2,.84,.34,1);
}
.hud-value.delta-active.delta-gain{
  color:#9ff8bf;
  text-shadow:0 0 18px rgba(83,238,166,0.42), 0 2px 10px rgba(0,0,0,0.55);
}
.hud-value.delta-active.delta-loss{
  color:#ff9b9b;
  text-shadow:0 0 18px rgba(255,120,120,0.42), 0 2px 10px rgba(0,0,0,0.55);
}
.hud-value.delta-active.delta-salary{
  color:#ffe28a;
  text-shadow:0 0 18px rgba(246,196,83,0.45), 0 2px 10px rgba(0,0,0,0.55);
}
#hud-currency-bankroll .hud-value.delta-active,
#hud-currency-bankroll .hud-value.delta-active.delta-gain,
#hud-currency-bankroll .hud-value.delta-active.delta-loss,
#hud-currency-bankroll .hud-value.delta-active.delta-salary{
  color:var(--currency-eur);
  text-shadow:0 0 18px rgba(246,196,83,0.45), 0 2px 10px rgba(0,0,0,0.55);
}
@keyframes hudValueDeltaPulse{
  0%{
    transform:translateY(2px) scale(0.96);
  }
  100%{
    transform:translateY(-1px) scale(1.04);
  }
}
@keyframes hudSalaryFlash{
  0%{
    box-shadow:0 6px 18px rgba(0,0,0,0.25);
  }
  35%{
    box-shadow:
      0 0 0 2px rgba(246,196,83,0.62),
      0 0 20px rgba(246,196,83,0.42),
      0 12px 24px rgba(70,51,11,0.42);
    border-color:rgba(246,196,83,0.9);
    transform:translateY(-1px);
  }
  100%{
    box-shadow:0 6px 18px rgba(0,0,0,0.25);
    transform:translateY(0);
  }
}

.currency-money-icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.26em;
  height:0.84em;
  border-radius:0.14em;
  vertical-align:-0.08em;
  margin-right:0.2em;
  background:
    linear-gradient(180deg, #1d6a3e 0%, #1d6a3e 100%);
  border:1px solid #114429;
  box-shadow:
    0 0 0 1px rgba(13,54,33,0.34),
    0 2px 6px rgba(0,0,0,0.24);
  overflow:hidden;
}
.currency-money-icon::before{
  content:"";
  position:absolute;
  left:0.12em;
  right:0.12em;
  top:0.10em;
  bottom:0.10em;
  border-radius:0.11em;
  border:1px solid #3e9e67;
  box-shadow:0 0 0 1px #f6c453;
  background:
    radial-gradient(circle at 14% 50%, #f6c453 0 0.08em, #a87619 0.09em 0.11em, transparent 0.12em),
    radial-gradient(circle at 86% 50%, #f6c453 0 0.08em, #a87619 0.09em 0.11em, transparent 0.12em),
    linear-gradient(180deg, #c8f2d7 0%, #c8f2d7 100%);
}
.currency-money-icon::after{
  content:"C";
  position:absolute;
  left:50%;
  top:50%;
  width:0.54em;
  height:0.54em;
  transform:translate(-50%, -50%);
  border-radius:999px;
  border:2px solid #2c8a58;
  background:#eefbf3;
  color:#f6c453;
  font-size:0.40em;
  font-weight:900;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-shadow:0 1px 0 #a87619;
  pointer-events:none;
}
.currency-bankroll-icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.26em;
  height:0.84em;
  border-radius:0.14em;
  vertical-align:-0.08em;
  margin-right:0.2em;
  background:
    linear-gradient(180deg, #1d6a3e 0%, #1d6a3e 100%);
  border:1px solid #114429;
  box-shadow:
    0 0 0 1px rgba(13,54,33,0.34),
    0 2px 6px rgba(0,0,0,0.24);
  overflow:hidden;
}
.currency-bankroll-icon::before{
  content:"";
  position:absolute;
  left:0.12em;
  right:0.12em;
  top:0.10em;
  bottom:0.10em;
  border-radius:0.11em;
  border:1px solid #3e9e67;
  box-shadow:0 0 0 1px #f6c453;
  background:
    radial-gradient(circle at 14% 50%, #f6c453 0 0.08em, #a87619 0.09em 0.11em, transparent 0.12em),
    radial-gradient(circle at 86% 50%, #f6c453 0 0.08em, #a87619 0.09em 0.11em, transparent 0.12em),
    linear-gradient(180deg, #c8f2d7 0%, #c8f2d7 100%);
}
.currency-bankroll-icon::after{
  content:"C";
  position:absolute;
  left:50%;
  top:50%;
  width:0.54em;
  height:0.54em;
  transform:translate(-50%, -50%);
  border-radius:999px;
  border:2px solid #2c8a58;
  background:#eefbf3;
  color:#f6c453;
  font-size:0.40em;
  font-weight:900;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-shadow:0 1px 0 #a87619;
  pointer-events:none;
}
.currency-bankroll-icon.inline{
  margin-right:0.08em;
}
.currency-bankroll-icon.tight{
  margin-right:0;
}
.currency-money-icon.inline{
  margin-right:0.08em;
}
.currency-money-icon.tight{
  margin-right:0;
}
.currency-ruf-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.2em;
  height:1.2em;
  border-radius:0;
  vertical-align:-0.12em;
  margin-right:0.2em;
  background:center / contain no-repeat
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2096%2096%22%20fill%3D%22none%22%3E%20%20%3Cpath%20d%3D%22M14%2024h68a6%206%200%200%201%206%206v10a8%208%200%200%200%200%2016v10a6%206%200%200%201-6%206H14a6%206%200%200%201-6-6V56a8%208%200%200%200%200-16V30a6%206%200%200%201%206-6z%22%20fill%3D%22%23BB4335%22%20stroke%3D%22%236D2118%22%20stroke-width%3D%224%22%2F%3E%20%20%3Cpath%20d%3D%22M48%2030v36%22%20stroke%3D%22%23F8D17A%22%20stroke-width%3D%222%22%20stroke-dasharray%3D%223%203%22%2F%3E%20%20%3Ccircle%20cx%3D%2233%22%20cy%3D%2248%22%20r%3D%2212%22%20fill%3D%22%23D6A33A%22%20stroke%3D%22%238F6516%22%20stroke-width%3D%223%22%2F%3E%20%20%3Cpolygon%20%20%20%20points%3D%2233%2C43%2034.29%2C46.22%2037.76%2C46.45%2035.09%2C48.68%2035.94%2C52.05%2033%2C50.2%2030.06%2C52.05%2030.91%2C48.68%2028.24%2C46.45%2031.71%2C46.22%22%20%20%20%20fill%3D%22%23FFF2CD%22%20%20%2F%3E%20%20%3Cpath%20d%3D%22M56%2040h20M56%2048h16M56%2056h20%22%20stroke%3D%22%23FFDFA2%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}
.currency-ruf-icon::before{
  content:none;
}
.currency-ruf-icon::after{
  content:none;
}
.currency-ruf-icon.inline{
  margin-right:0.08em;
}
.currency-ruf-icon.tight{
  margin-right:0;
}
.currency-vip-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.2em;
  height:1.2em;
  border-radius:0;
  vertical-align:-0.12em;
  margin-right:0.2em;
  background:center / contain no-repeat
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2096%2096%22%20fill%3D%22none%22%3E%20%20%3Ccircle%20cx%3D%2248%22%20cy%3D%2248%22%20r%3D%2240%22%20fill%3D%22%231C5079%22%20stroke%3D%22%23123954%22%20stroke-width%3D%224%22%2F%3E%20%20%3Ccircle%20cx%3D%2248%22%20cy%3D%2248%22%20r%3D%2231%22%20fill%3D%22none%22%20stroke%3D%22%23BDEAFF%22%20stroke-width%3D%221.2%22%20opacity%3D%220.95%22%2F%3E%20%20%3Ccircle%20cx%3D%2248%22%20cy%3D%2248%22%20r%3D%2224%22%20fill%3D%22none%22%20stroke%3D%22%238FD9FF%22%20stroke-width%3D%223%22%2F%3E%20%20%3Ccircle%20cx%3D%2248%22%20cy%3D%2248%22%20r%3D%2217%22%20fill%3D%22none%22%20stroke%3D%22%238FD9FF%22%20stroke-width%3D%222.4%22%20opacity%3D%220.78%22%2F%3E%20%20%3Ccircle%20cx%3D%2248%22%20cy%3D%2248%22%20r%3D%2210.5%22%20fill%3D%22%23EAF8FF%22%20stroke%3D%22%238FD9FF%22%20stroke-width%3D%222%22%2F%3E%20%20%3Cpath%20d%3D%22M48%2024v7M48%2065v7M24%2048h7M65%2048h7%22%20stroke%3D%22%238FD9FF%22%20stroke-width%3D%222.1%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E");
}
.currency-vip-icon::before{
  content:none;
}
.currency-vip-icon.inline{
  margin-right:0.08em;
}
.currency-vip-icon.tight{
  margin-right:0;
}
.btn .currency-money-icon{
  transform:translateY(0.03em);
}
.btn .currency-ruf-icon{
  transform:translateY(0.03em);
}
.btn .currency-bankroll-icon{
  transform:translateY(0.03em);
}
.btn .currency-vip-icon{
  transform:translateY(0.03em);
}
.economy-resource > .shop-resource-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  line-height:1;
  color:rgba(255,255,255,0.95);
  flex:0 0 auto;
}
.economy-resource.loyalty > .shop-resource-icon{
  color:var(--currency-loyalty);
}
.economy-resource > .shop-resource-icon.currency-ruf-icon,
.economy-resource > .shop-resource-icon.currency-vip-icon{
  width:1.16em;
  height:1.16em;
  margin-right:0;
}
.economy-resource > .shop-resource-icon.currency-money-icon,
.economy-resource > .shop-resource-icon.currency-bankroll-icon{
  width:1.26em;
  height:0.84em;
  margin-right:0;
}
.help-body .currency-money-icon{
  transform:translateY(0.02em);
}
.help-body .currency-ruf-icon{
  transform:translateY(0.02em);
}
.help-body .currency-bankroll-icon{
  transform:translateY(0.02em);
}
.help-body .currency-vip-icon{
  transform:translateY(0.02em);
}

/* ===== Layout ===== */
.table{
  max-width:1080px;
  margin:0 auto;
  padding:18px 16px 72px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.table > section{
  width:100%;
  box-sizing:border-box;
}
.area{
  padding:16px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--surface-hi), var(--surface-lo));
  box-shadow:var(--shadow);
}
.area.turn-active{
  border-color:rgba(110,231,183,0.58);
  box-shadow:0 0 0 2px rgba(110,231,183,0.18), var(--shadow);
  animation:turnGlow 1.35s ease-in-out infinite;
}
.area-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.area h2{
  margin:0;
  font-size:16px;
  font-weight:800;
  letter-spacing:0.3px;
}
.player-name-head{
  display:flex;
  align-items:center;
  gap:6px;
  letter-spacing:0.2px;
  color:#fff2c6;
  text-shadow:0 1px 0 rgba(59,39,4,0.6);
}
.pill{
  padding:7px 11px;
  border-radius:999px;
  border:4px solid rgba(246,196,83,0.98);
  background:rgba(34,26,8,0.46);
  box-shadow:
    inset 0 0 0 1px rgba(255,242,191,0.50),
    0 0 0 2px rgba(246,196,83,0.35),
    0 8px 20px rgba(0,0,0,0.30);
  font-size:12px;
  font-weight:800;
  color:#fff2c6;
  text-shadow:0 1px 0 rgba(59,39,4,0.6);
}
.pill.small{
  padding:6px 9px;
  font-size:12px;
  border-width:3px;
}

.hand{
  display:flex;
  align-items:flex-end;
  min-height:118px;
  gap:var(--hand-gap, 8px);
  padding:6px 6px 2px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
}
.hand::-webkit-scrollbar{display:none}
.player-hands{display:flex;flex-direction:column;gap:10px}
.handwrap,
.dealer-wrap{
  width:100%;
  box-sizing:border-box;
  border:1px dashed rgba(255,255,255,0.14);
  border-radius:14px;
  padding:8px;
  background:transparent;
  box-shadow:none;
}
.handwrap.active{
  border-color:rgba(255,255,255,0.3);
  box-shadow:0 0 0 1px rgba(255,255,255,0.12) inset;
}
.dealer-wrap{
  border-color:rgba(255,255,255,0.3);
  box-shadow:0 0 0 1px rgba(255,255,255,0.12) inset;
}
.handwrap-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.handtag{font-size:12px;color:var(--muted)}

.player-area.split-mode .handwrap.active{
  border-color:rgba(255,255,255,0.55);
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.20) inset,
    0 0 0 0 rgba(246,196,83,0.45);
  animation:splitFocusPulse 1200ms ease-in-out infinite;
}

@keyframes splitFocusPulse{
  0%{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.20) inset,
      0 0 0 0 rgba(246,196,83,0.40);
  }
  60%{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.25) inset,
      0 0 0 7px rgba(246,196,83,0);
  }
  100%{
    box-shadow:
      0 0 0 1px rgba(255,255,255,0.20) inset,
      0 0 0 0 rgba(246,196,83,0);
  }
}

/* ===== Cards ===== */
.card{
  width:var(--card-width, 92px);
  aspect-ratio: 5 / 7;
  height:auto;
  display:block;
  object-fit:contain;
  border-radius:8px;
  background:white;
  border:1px solid rgba(255,255,255,0.96);
  box-shadow: 0 18px 35px rgba(0,0,0,0.55), 0 0 0 2px rgba(0,0,0,0.15);

  transform:translate3d(var(--dx,0px), var(--dy,-18px), 0) rotate(var(--rot,0deg)) scale(0.955);
  opacity:0;

  transition:
    transform 470ms cubic-bezier(.16,.86,.22,1),
    opacity 300ms ease,
    box-shadow 280ms ease,
    filter 260ms ease;
  will-change: transform, opacity;
}
.card.is-loading{
  opacity:0 !important;
  border-color:transparent;
  background:transparent;
  box-shadow:none;
}

.card.in{
  transform:translate3d(0,0,0) rotate(0deg) scale(1);
  opacity:1;
}
.card.in.card-entry{
  animation:cardSnapIn 520ms cubic-bezier(.16,.86,.22,1) both;
}
@keyframes cardSnapIn{
  0%{
    filter:blur(1.8px) saturate(0.9);
    box-shadow:0 18px 35px rgba(0,0,0,0.55), 0 0 0 2px rgba(0,0,0,0.15);
    transform:translate3d(calc(var(--dx,0px) * 0.6), calc(var(--dy,-18px) * 0.42), 0) rotate(calc(var(--rot,0deg) * 0.55)) scale(0.94);
  }
  64%{
    filter:blur(0) saturate(1.08);
    box-shadow:0 20px 36px rgba(0,0,0,0.5), 0 0 18px rgba(255,235,184,0.22);
    transform:translate3d(0,-1px,0) rotate(0deg) scale(1.012);
  }
  100%{
    filter:blur(0) saturate(1);
    box-shadow:0 18px 35px rgba(0,0,0,0.55), 0 0 0 2px rgba(0,0,0,0.15);
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
  }
}

.card.slow-reveal{
  transition-duration:1120ms, 420ms, 380ms, 300ms;
}
.card.slow-reveal.in{
  animation:dealerDecisionReveal 1180ms cubic-bezier(.18,.82,.22,1) both;
}
@keyframes dealerDecisionReveal{
  0%{
    transform:translate3d(0,0,0) rotate(0deg) scale(0.972);
    filter:blur(0.9px) saturate(0.96);
    box-shadow:0 20px 36px rgba(0,0,0,0.58), 0 0 0 2px rgba(0,0,0,0.16);
  }
  68%{
    transform:translate3d(0,-1px,0) rotate(0deg) scale(1.01);
    filter:blur(0) saturate(1.04);
    box-shadow:0 20px 38px rgba(0,0,0,0.56), 0 0 16px rgba(255,214,140,0.24);
  }
  100%{
    transform:translate3d(0,0,0) rotate(0deg) scale(1);
    filter:blur(0) saturate(1);
    box-shadow:0 18px 35px rgba(0,0,0,0.55), 0 0 0 2px rgba(0,0,0,0.15);
  }
}
.card.flip{
  backface-visibility:hidden;
  transform-style:preserve-3d;
  animation:flip var(--flip-duration, 420ms) cubic-bezier(.2,.8,.2,1);
}
.card.slow-reveal.flip{
  animation-duration:var(--flip-duration, 680ms);
  animation-timing-function:cubic-bezier(.16,.82,.2,1);
}
.card.decision-flip.flip{
  --decision-halo-rgb:255,232,175;
  --decision-halo-mid-rgb:255,220,142;
  --decision-halo-far-rgb:255,246,216;
  animation:
    dealerDecisionFlip var(--flip-duration, 980ms) cubic-bezier(.16,.84,.22,1) both,
    dealerDecisionHaloPulse var(--flip-duration, 980ms) ease-out both;
  will-change:transform, box-shadow, filter;
  position:relative;
  z-index:6;
}
.card.decision-flip.decision-tone-win,
.card.decision-flip.flip.decision-tone-win{
  --decision-halo-rgb:122,255,190;
  --decision-halo-mid-rgb:79,231,160;
  --decision-halo-far-rgb:190,255,223;
}
.card.decision-flip.decision-tone-lose,
.card.decision-flip.flip.decision-tone-lose{
  --decision-halo-rgb:255,133,133;
  --decision-halo-mid-rgb:232,89,89;
  --decision-halo-far-rgb:255,194,194;
}
.card.decision-flip.decision-tone-draw,
.card.decision-flip.flip.decision-tone-draw{
  --decision-halo-rgb:255,219,123;
  --decision-halo-mid-rgb:246,194,83;
  --decision-halo-far-rgb:255,243,188;
}
.hand.decision-halo-open{
  overflow:visible;
}
@keyframes flip{
  0%{transform:translate3d(0,0,0) rotate(0deg) scale(1) rotateY(0deg)}
  46%{transform:translate3d(0,0,0) rotate(0deg) scale(1) rotateY(90deg)}
  57%{transform:translate3d(0,0,0) rotate(0deg) scale(1) rotateY(90deg)}
  100%{transform:translate3d(0,0,0) rotate(0deg) scale(1) rotateY(0deg)}
}
@keyframes dealerDecisionFlip{
  0%{transform:translate3d(0,0,0) rotate(0deg) rotateY(0deg)}
  64%{transform:translate3d(0,0,0) rotate(0deg) rotateY(90deg)}
  80%{transform:translate3d(0,0,0) rotate(0deg) rotateY(90deg)}
  100%{transform:translate3d(0,0,0) rotate(0deg) rotateY(0deg)}
}
@keyframes dealerDecisionHaloPulse{
  0%{
    box-shadow:
      0 18px 35px rgba(0,0,0,0.55),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 0 rgba(var(--decision-halo-rgb),0),
      0 0 0 0 rgba(var(--decision-halo-mid-rgb),0),
      0 0 0 0 rgba(var(--decision-halo-far-rgb),0);
    filter:brightness(1) saturate(1);
  }
  16%{
    box-shadow:
      0 20px 36px rgba(0,0,0,0.56),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 6px rgba(var(--decision-halo-rgb),0.72),
      0 0 0 28px rgba(var(--decision-halo-mid-rgb),0.42),
      0 0 0 54px rgba(var(--decision-halo-far-rgb),0.24);
    filter:brightness(1.18) saturate(1.18);
  }
  32%{
    box-shadow:
      0 20px 36px rgba(0,0,0,0.56),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 2px rgba(var(--decision-halo-rgb),0.32),
      0 0 0 52px rgba(var(--decision-halo-mid-rgb),0.24),
      0 0 0 96px rgba(var(--decision-halo-far-rgb),0.14);
    filter:brightness(1.08) saturate(1.1);
  }
  50%{
    box-shadow:
      0 20px 36px rgba(0,0,0,0.56),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 7px rgba(var(--decision-halo-rgb),0.68),
      0 0 0 34px rgba(var(--decision-halo-mid-rgb),0.38),
      0 0 0 66px rgba(var(--decision-halo-far-rgb),0.22);
    filter:brightness(1.2) saturate(1.16);
  }
  68%{
    box-shadow:
      0 20px 36px rgba(0,0,0,0.56),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 2px rgba(var(--decision-halo-rgb),0.3),
      0 0 0 58px rgba(var(--decision-halo-mid-rgb),0.2),
      0 0 0 108px rgba(var(--decision-halo-far-rgb),0.12);
    filter:brightness(1.1) saturate(1.1);
  }
  82%{
    box-shadow:
      0 20px 36px rgba(0,0,0,0.56),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 5px rgba(var(--decision-halo-rgb),0.56),
      0 0 0 30px rgba(var(--decision-halo-mid-rgb),0.3),
      0 0 0 72px rgba(var(--decision-halo-far-rgb),0.18);
    filter:brightness(1.16) saturate(1.12);
  }
  100%{
    box-shadow:
      0 18px 35px rgba(0,0,0,0.55),
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 0 0 rgba(var(--decision-halo-rgb),0),
      0 0 0 0 rgba(var(--decision-halo-mid-rgb),0),
      0 0 0 0 rgba(var(--decision-halo-far-rgb),0);
    filter:brightness(1) saturate(1);
  }
}

/* ===== Panel / Controls ===== */
.panel{
  position:relative;
  overflow:hidden;
  padding:16px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:rgba(8,39,26,0.48);
  box-shadow:var(--shadow);
  backdrop-filter: blur(12px) saturate(140%);
}
.panel > *{
  position:relative;
  z-index:1;
}
.betbox{
  margin-top:0;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  backdrop-filter:none;
}
.bet-body{display:block}

.bet-slider-box{
  padding:10px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:12px;
  background:rgba(0,0,0,0.24);
}
.bet-slider-head{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
  font-size:12px;
  color:rgba(255,255,255,0.72);
}
#bet-slider-value{
  font-size:18px;
  font-weight:900;
  color:var(--currency-eur);
  text-shadow:0 1px 0 rgba(0,0,0,0.35);
}
.bet-slider{
  width:100%;
  accent-color:#f6c453;
  cursor:pointer;
}
.bet-slider-meta{
  margin-top:8px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  font-size:11px;
  color:rgba(255,255,255,0.7);
}
.bet-slider-meta strong{
  color:rgba(255,255,255,0.92);
}

.bet-controls{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:8px;
  align-items:center;
  margin-top:10px;
}
.bet-slider-actions{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.bet-slider-actions .btn{
  flex:0 0 auto;
}
.bet-loan{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
}
.bet-loan .btn{
  flex:0 0 auto;
}
.bet-loan-status{
  font-size:11px;
  color:rgba(255,255,255,0.74);
}
.bet-loan-status.warn{
  color:#ffd6a8;
}
.bet-quick{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.chip{
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.18);
  color:rgba(255,255,255,0.9);
  cursor:pointer;
}
@media (hover: hover) and (pointer: fine){
  .chip:hover{transform:translateY(-1px)}
}
.chip:active{transform:translateY(0)}
.chip:disabled{
  opacity:0.48;
  cursor:not-allowed;
  transform:none;
}
.ghost-chip{background:rgba(255,255,255,0.08)}
@media (hover: hover) and (pointer: fine){
  .ghost-chip:hover{background:rgba(255,255,255,0.13)}
}
.bet-settings{
  margin-top:10px;
}

.toggles{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.toggle{
  display:flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  color:rgba(255,255,255,0.88);
  user-select:none;
}
.audio-mix{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.audio-mix-row{
  display:grid;
  grid-template-columns:46px 1fr 44px;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  color:rgba(255,255,255,0.88);
  font-size:11px;
  font-weight:800;
  letter-spacing:0.2px;
}
.audio-mix-row input[type="range"]{
  width:100%;
}
.audio-mix-row strong{
  text-align:right;
  color:rgba(255,240,206,0.95);
  font-variant-numeric:tabular-nums;
}

.panel-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
.controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  flex:1 1 600px;
  width:100%;
}
.controls .btn{
  min-height:44px;
  padding:11px 15px;
  font-size:14px;
  font-weight:800;
  letter-spacing:0.12px;
}
#deal{
  min-width:164px;
  font-size:16px;
  font-weight:900;
}

.panel-tools{
  display:flex;
  gap:12px;
  align-items:stretch;
  flex-wrap:wrap;
  margin:8px 0 0;
}
.privacy-quick-controls{
  margin-top:10px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:12px;
  padding:8px 10px;
  background:rgba(0,0,0,0.18);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.privacy-quick-controls .btn{
  align-self:flex-start;
}
.tool-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  flex:1 1 auto;
  align-content:flex-start;
}
.privacy-storage-pref{
  flex:1 1 320px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:12px;
  padding:8px 10px;
  background:rgba(0,0,0,0.18);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.privacy-storage-hint{
  font-size:11px;
  color:rgba(255,255,255,0.72);
  line-height:1.35;
}
.privacy-storage-hint.ok{
  color:#b8ffda;
}
.privacy-cloud-pref{
  flex:1 1 260px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:12px;
  padding:8px 10px;
  background:rgba(0,0,0,0.18);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.privacy-cloud-hint{
  font-size:11px;
  color:rgba(255,255,255,0.72);
  line-height:1.35;
}
.privacy-cloud-hint.ok{
  color:#b8ffda;
}
.rules-test-status{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(0,0,0,0.2);
  color:rgba(255,255,255,0.78);
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.rules-test-status.ok{
  border-color:rgba(143,249,203,0.48);
  color:#8ff9cb;
  background:rgba(15,88,58,0.28);
}
.rules-test-status.fail{
  border-color:rgba(255,158,158,0.48);
  color:#ff9e9e;
  background:rgba(96,24,24,0.28);
}
.shoe{
  margin-top:12px;
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(7,35,24,0.42);
  backdrop-filter: blur(8px) saturate(130%);
}
.shoe-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.shoe-title{
  font-size:12px;
  color:rgba(255,255,255,0.80);
  font-weight:800;
  letter-spacing:0.4px;
}
.shoe-meta{
  font-size:12px;
  color:rgba(255,255,255,0.86);
  font-variant-numeric:tabular-nums;
}
.shoe-meta.hot{color:#8ff9cb}
.shoe-meta.cold{color:#9ecbff}
.shoe-meta.warn{color:#ffd98d}
.shoe-track{
  width:100%;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,0.12);
  overflow:hidden;
}
.shoe-fill{
  width:100%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, #9be8ba 0%, #f6c453 55%, #ef8d73 100%);
  transition:width 200ms ease;
}
.shoe-alert{
  margin-top:8px;
  font-size:12px;
  color:#b7ffd8;
  border:1px solid rgba(144,255,199,0.28);
  background:rgba(16,114,61,0.28);
  padding:6px 8px;
  border-radius:10px;
}
.shoe-alert.show{
  animation:fadeShoe 1.4s ease;
}
@keyframes fadeShoe{
  0%{opacity:0;transform:translateY(-4px)}
  20%{opacity:1;transform:translateY(0)}
  82%{opacity:1}
  100%{opacity:0.96}
}

.advanced{
  margin-top:10px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:14px;
  background:rgba(0,0,0,0.16);
}
.advanced-summary,
.advanced-sub-summary{
  cursor:pointer;
  list-style:none;
  padding:10px 12px;
  font-size:12px;
  font-weight:800;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.84);
}
.advanced-summary::-webkit-details-marker{display:none}
.advanced-sub-summary::-webkit-details-marker{display:none}
.advanced-summary::after{
  content:"▾";
  float:right;
  transition:transform 140ms ease;
}
.advanced-sub-summary::after{
  content:"▾";
  float:right;
  transition:transform 140ms ease;
}
.advanced[open] .advanced-summary::after{transform:rotate(180deg)}
.advanced-sub[open] .advanced-sub-summary::after{transform:rotate(180deg)}
.advanced-body{
  padding:0 10px 10px;
}
.advanced-sub{
  margin-top:12px;
  border:1px solid rgba(255,255,255,0.11);
  border-radius:12px;
  background:rgba(0,0,0,0.16);
}
.advanced-sub-body{
  padding:0 10px 10px;
}
.advanced-sub .leaderboard{
  margin-top:0;
}
.stats-fold .results-log,
.stats-fold .round-audit{
  margin-top:0;
}

.economy{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.2);
}
.economy-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}
.economy-title{
  font-size:13px;
  font-weight:900;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
}
.economy-rates{
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:flex-start;
}
.economy-rate{
  font-size:12px;
  font-weight:800;
  color:var(--currency-vip);
  font-variant-numeric:tabular-nums;
}
.economy-rate.eur{
  color:var(--currency-eur);
}
.economy-rate.loyalty{
  color:var(--currency-loyalty);
}
.economy-resources{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
  width:min(100%, 320px);
}
.economy-resource{
  border:1px solid rgba(255,255,255,0.17);
  border-radius:10px;
  background:rgba(0,0,0,0.24);
  padding:7px 8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
}
.economy-resource strong{
  font-size:14px;
  font-weight:900;
  color:rgba(255,255,255,0.94);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-align:right;
}
.economy-resource.eur strong{
  color:var(--currency-eur);
}
.economy-resource.loyalty strong{
  color:var(--currency-cash);
}
.economy-resource.ep strong{
  color:var(--currency-vip);
}
.shop-app-grid{
  margin-top:14px;
  margin-bottom:16px;
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:12px;
}
.shop-app{
  flex:0 0 auto;
  position:relative;
  border:1px solid rgba(255,255,255,0.34);
  border-radius:12px;
  background:linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0.07));
  color:rgba(255,255,255,0.9);
  min-height:0;
  min-width:92px;
  padding:8px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  cursor:pointer;
  transition:transform 120ms ease, filter 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}
@media (hover: hover) and (pointer: fine){
  .shop-app:hover{
    filter:brightness(1.14);
  }
}
.shop-app:active{
  transform:translateY(1px);
}
.shop-app-icon{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  line-height:1;
  color:rgba(255,255,255,0.96);
}
.shop-app-icon::before,
.shop-app-icon::after{
  content:"";
  position:absolute;
}
.shop-app-icon.icon-tab-tables::before{
  width:15px;
  height:18px;
  border-radius:3px;
  border:2px solid currentColor;
}
.shop-app-icon.icon-tab-tables::after{
  width:5px;
  height:5px;
  border-radius:999px;
  background:currentColor;
}
.shop-app-icon.icon-tab-buffs::before{
  width:16px;
  height:16px;
  border:2px solid currentColor;
  border-radius:5px;
  transform:rotate(45deg);
}
.shop-app-icon.icon-tab-buffs::after{
  width:6px;
  height:6px;
  border-radius:999px;
  background:currentColor;
}
.shop-app-icon.icon-tab-property::before{
  width:16px;
  height:14px;
  border:2px solid currentColor;
  border-radius:2px;
}
.shop-app-icon.icon-tab-property::after{
  width:2px;
  height:10px;
  background:currentColor;
  box-shadow:-4px 0 0 0 currentColor, 4px 0 0 0 currentColor;
}
.shop-app-icon.icon-tab-investments::before{
  width:16px;
  height:14px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
}
.shop-app-icon.icon-tab-investments::after{
  width:12px;
  height:2px;
  background:currentColor;
  transform:rotate(-35deg) translate(2px, -1px);
  transform-origin:center;
}
.shop-app-icon.icon-tab-swag::before{
  width:13px;
  height:13px;
  border:2px solid currentColor;
  transform:rotate(45deg);
  border-radius:2px;
}
.shop-app-icon.icon-tab-bank::before{
  width:16px;
  height:14px;
  border:2px solid currentColor;
  border-radius:2px 2px 4px 4px;
}
.shop-app-icon.icon-tab-bank::after{
  width:10px;
  height:2px;
  background:currentColor;
  box-shadow:0 4px 0 0 currentColor;
}
.shop-app-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:0.22px;
  text-transform:uppercase;
  color:rgba(255,255,255,0.92);
  line-height:1;
}
.shop-app.active{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,0.32);
}
.shop-app.locked{
  opacity:0.46;
  filter:grayscale(1) saturate(0.3);
  cursor:help;
}
.shop-app:disabled{
  cursor:not-allowed;
  pointer-events:none;
}
.shop-app[data-shop-tab="investments"]{
  border-color:rgba(137,255,202,0.62);
  background:linear-gradient(180deg, rgba(110,231,183,0.42), rgba(31,126,89,0.36));
}
.shop-app[data-shop-tab="investments"] .shop-app-icon{
  color:#e6fff0;
}
.shop-app[data-shop-tab="investments"].active{
  border-color:rgba(170,255,217,0.96);
  background:linear-gradient(180deg, rgba(123,255,203,0.68), rgba(30,138,96,0.52));
  color:#e9ffef;
  box-shadow:0 0 0 1px rgba(207,255,233,0.4) inset, 0 8px 22px rgba(15,102,67,0.42);
}
.shop-app[data-shop-tab="ep-buffs"]{
  border-color:rgba(120,226,255,0.68);
  background:linear-gradient(180deg, rgba(120,226,255,0.46), rgba(26,98,124,0.38));
}
.shop-app[data-shop-tab="ep-buffs"] .shop-app-icon{
  color:#e5faff;
}
.shop-app[data-shop-tab="ep-buffs"].active{
  border-color:rgba(165,238,255,0.98);
  background:linear-gradient(180deg, rgba(140,233,255,0.74), rgba(26,112,141,0.58));
  color:#effcff;
  box-shadow:0 0 0 1px rgba(208,246,255,0.42) inset, 0 8px 22px rgba(20,88,112,0.46);
}
.shop-app[data-shop-tab="swag"]{
  border-color:rgba(245,161,245,0.64);
  background:linear-gradient(180deg, rgba(245,161,245,0.44), rgba(137,64,137,0.36));
}
.shop-app[data-shop-tab="swag"] .shop-app-icon{
  color:#ffe4ff;
}
.shop-app[data-shop-tab="swag"].active{
  border-color:rgba(255,194,255,0.96);
  background:linear-gradient(180deg, rgba(255,176,255,0.7), rgba(150,64,150,0.54));
  color:#fff0ff;
  box-shadow:0 0 0 1px rgba(255,215,255,0.38) inset, 0 8px 22px rgba(120,43,120,0.44);
}
.shop-app[data-shop-tab="tables"]{
  border-color:rgba(139,190,255,0.62);
  background:linear-gradient(180deg, rgba(139,190,255,0.42), rgba(50,91,140,0.36));
}
.shop-app[data-shop-tab="tables"] .shop-app-icon{
  color:#e6f2ff;
}
.shop-app[data-shop-tab="tables"].active{
  border-color:rgba(181,216,255,0.96);
  background:linear-gradient(180deg, rgba(155,207,255,0.68), rgba(51,95,146,0.55));
  color:#eaf5ff;
  box-shadow:0 0 0 1px rgba(208,232,255,0.38) inset, 0 8px 22px rgba(37,79,130,0.44);
}
.shop-app[data-shop-tab="property"]{
  border-color:rgba(173,217,141,0.64);
  background:linear-gradient(180deg, rgba(162,216,132,0.44), rgba(76,124,49,0.36));
}
.shop-app[data-shop-tab="property"] .shop-app-icon{
  color:#efffdf;
}
.shop-app[data-shop-tab="property"].active{
  border-color:rgba(211,241,187,0.96);
  background:linear-gradient(180deg, rgba(178,230,147,0.7), rgba(86,137,55,0.54));
  color:#f4ffe9;
  box-shadow:0 0 0 1px rgba(226,246,203,0.38) inset, 0 8px 22px rgba(56,104,29,0.44);
}
.shop-app[data-shop-tab="bank"]{
  border-color:rgba(150,235,255,0.64);
  background:linear-gradient(180deg, rgba(150,235,255,0.44), rgba(31,110,128,0.36));
}
.shop-app[data-shop-tab="bank"] .shop-app-icon{
  color:#e2fbff;
}
.shop-app[data-shop-tab="bank"].active{
  border-color:rgba(193,245,255,0.98);
  background:linear-gradient(180deg, rgba(164,240,255,0.7), rgba(30,117,138,0.56));
  color:#ecfbff;
  box-shadow:0 0 0 1px rgba(214,250,255,0.38) inset, 0 8px 22px rgba(20,94,115,0.44);
}
.shop-window{
  margin-top:18px;
  border:1px solid rgba(255,255,255,0.13);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(0,0,0,0.2), rgba(0,0,0,0.36));
  padding:12px;
  min-height:360px;
}
.shop-pane{
  display:none;
}
.shop-pane.active{
  display:block;
  animation:shopPaneIn 220ms ease;
}
@keyframes shopPaneIn{
  0%{
    opacity:0;
    transform:translateY(4px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}
.shop-pane-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
  margin:0 0 12px;
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,0.9);
}
.shop-pane-head span{
  font-size:11px;
  font-weight:700;
  color:rgba(255,255,255,0.62);
}
.shop-block{
  border:1px solid rgba(255,255,255,0.11);
  border-radius:11px;
  background:rgba(0,0,0,0.17);
  padding:9px;
  min-width:0;
}
.shop-title{
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,0.76);
  margin-bottom:8px;
  text-transform:uppercase;
  letter-spacing:0.35px;
}
.momentum-panel{
  margin-top:10px;
  border-color:rgba(255,200,116,0.36);
  background:linear-gradient(180deg, rgba(108,69,12,0.25), rgba(0,0,0,0.2));
}
.mission-inline-panel{
  margin-top:10px;
}
.momentum-panel.completed{
  box-shadow:0 0 0 1px rgba(255,223,158,0.32) inset;
}
.momentum-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}
.momentum-panel .shop-title{
  margin-bottom:0;
  color:rgba(255,235,186,0.92);
}
.momentum-task{
  margin-top:8px;
  font-size:12px;
  font-weight:800;
  color:rgba(255,255,255,0.92);
}
.momentum-chapter{
  margin-top:7px;
  font-size:11px;
  color:rgba(255,229,174,0.84);
  font-weight:700;
}
.momentum-progress{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
}
.momentum-progress-track{
  flex:1 1 auto;
  height:9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(0,0,0,0.28);
  overflow:hidden;
}
.momentum-progress-fill{
  width:0;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,200,102,0.92), rgba(255,236,181,0.92));
  transition:width 180ms ease;
}
.momentum-progress-meta{
  min-width:58px;
  font-size:11px;
  font-weight:800;
  color:rgba(255,245,219,0.9);
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.momentum-reward{
  margin-top:8px;
  font-size:11px;
  color:rgba(255,230,173,0.92);
}
.shop-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.shop-item{
  border:1px solid rgba(255,255,255,0.11);
  border-radius:10px;
  padding:8px;
  background:rgba(0,0,0,0.2);
  display:flex;
  flex-direction:column;
  gap:6px;
  transition:border-color 120ms ease, background 120ms ease;
}
.shop-item.affordable{
  border-color:rgba(255,255,255,0.24);
  background:rgba(0,0,0,0.24);
}
.shop-item.unlocked{
  border-color:rgba(144,255,199,0.35);
  background:rgba(13,72,44,0.26);
}
.shop-item.active{
  border-color:rgba(246,196,83,0.62);
  background:rgba(122,87,20,0.24);
  box-shadow:0 0 0 1px rgba(246,196,83,0.22) inset;
}
.shop-item[data-buff-rarity="common"] .shop-owned{
  border-color:rgba(157,252,199,0.48);
  color:#dffff0;
}
.shop-item[data-buff-rarity="uncommon"] .shop-owned{
  border-color:rgba(167,220,255,0.52);
  color:#e3f4ff;
}
.shop-item[data-buff-rarity="rare"] .shop-owned{
  border-color:rgba(202,173,255,0.56);
  color:#f1e8ff;
}
.shop-item[data-buff-rarity="legendary"] .shop-owned{
  border-color:rgba(225,159,255,0.64);
  color:#f7e9ff;
}
.shop-row{
  display:flex;
  justify-content:space-between;
  gap:8px;
  align-items:flex-start;
}
.shop-name{
  font-size:12px;
  font-weight:800;
  color:rgba(255,255,255,0.94);
}
.shop-owned{
  font-size:11px;
  color:rgba(255,255,255,0.80);
  border:1px solid rgba(255,255,255,0.24);
  border-radius:999px;
  padding:2px 7px;
  white-space:nowrap;
  line-height:1.1;
}
.shop-desc{
  font-size:11px;
  color:rgba(255,255,255,0.68);
  line-height:1.35;
}
.shop-meta{
  font-size:11px;
  color:rgba(190,233,255,0.86);
  font-weight:700;
}
.shop-cost{
  font-size:11px;
  color:rgba(255,255,255,0.76);
  font-variant-numeric:tabular-nums;
  line-height:1.3;
}
.shop-cost .cost-eur{
  color:var(--currency-eur);
}
.shop-cost .cost-loyalty{
  color:var(--currency-loyalty);
}
.shop-cost .cost-vip{
  color:var(--currency-vip);
}
.shop-cost .cost-join{
  color:rgba(255,255,255,0.5);
}
.shop-cost[data-currency="cash"],
.shop-cost[data-currency="loyalty"]{
  color:var(--currency-loyalty);
}
.shop-cost[data-currency="eur"]{
  color:var(--currency-eur);
}
.shop-cost[data-currency="vip"]{
  color:var(--currency-vip);
}
.shop-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}
.shop-actions .btn{
  margin-left:auto;
}
.shop-pane .shop-block + .shop-block{
  margin-top:10px;
}
.lp-shell-game{
  margin-top:10px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:12px;
  padding:10px;
  background:
    radial-gradient(140% 120% at 0% -10%, rgba(255,236,181,0.1), rgba(255,236,181,0) 54%),
    rgba(0,0,0,0.2);
  display:flex;
  flex-direction:column;
  gap:8px;
}
.lp-shell-game.busy{
  opacity:0.92;
}
.lp-shell-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.lp-shell-title{
  font-size:13px;
  font-weight:900;
  color:rgba(255,255,255,0.96);
}
.lp-shell-stake-display{
  font-size:11px;
  color:rgba(255,255,255,0.86);
}
.lp-shell-stake-display strong{
  color:var(--currency-vip);
}
.lp-shell-desc{
  font-size:11px;
  color:rgba(255,255,255,0.74);
  line-height:1.35;
}
.lp-shell-stakes{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.lp-shell-stake{
  min-height:30px;
}
.lp-shell-stake.is-active{
  border-color:rgba(246,196,83,0.88);
  background:
    radial-gradient(120% 110% at 20% 0%, rgba(255,238,184,0.32), rgba(255,238,184,0) 55%),
    linear-gradient(180deg, rgba(167,117,23,0.38), rgba(103,68,16,0.3));
  color:#fff3cf;
}
.lp-shell-board{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}
.lp-shell-cup{
  position:relative;
  min-height:88px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(0,0,0,0.18);
  cursor:pointer;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:10px 8px 12px;
  transition:transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
  -webkit-tap-highlight-color:transparent;
}
.lp-shell-cup:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.3);
}
.lp-shell-cup:disabled{
  opacity:0.52;
  cursor:not-allowed;
  transform:none;
}
.lp-shell-cup-shape{
  position:relative;
  width:52px;
  height:42px;
  border-radius:16px 16px 10px 10px;
  background:linear-gradient(180deg, #fff6d6 0%, #f6c453 62%, #cc8f22 100%);
  border:1px solid rgba(69,41,7,0.58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.6),
    0 6px 10px rgba(0,0,0,0.26);
}
.lp-shell-cup-shape::before{
  content:"";
  position:absolute;
  left:50%;
  top:-7px;
  transform:translateX(-50%);
  width:46px;
  height:12px;
  border-radius:999px;
  border:1px solid rgba(81,49,9,0.5);
  background:linear-gradient(180deg, #fff8de 0%, #e4ab3e 100%);
}
.lp-shell-token{
  position:absolute;
  bottom:8px;
  width:14px;
  height:14px;
  border-radius:999px;
  border:1px solid rgba(13,54,33,0.5);
  background:radial-gradient(circle at 34% 32%, #d6ffe8 0%, #7be2ac 56%, #2d915c 100%);
  box-shadow:0 0 8px rgba(123,226,172,0.45);
  opacity:0;
  transform:translateY(4px) scale(0.84);
  transition:opacity 120ms ease, transform 120ms ease;
}
.lp-shell-cup.reveal-winner .lp-shell-token{
  opacity:1;
  transform:translateY(0) scale(1);
}
.lp-shell-cup.reveal-picked{
  border-color:rgba(192,230,255,0.94);
  box-shadow:0 0 0 1px rgba(216,241,255,0.44) inset;
}
.lp-shell-cup.reveal-hit{
  border-color:rgba(123,226,172,0.94);
  box-shadow:
    0 0 0 1px rgba(197,255,225,0.44) inset,
    0 0 18px rgba(123,226,172,0.28);
}
.lp-shell-cup.is-shuffling .lp-shell-cup-shape{
  animation:lpShellShuffle 190ms ease-in-out 4;
}
@keyframes lpShellShuffle{
  0%{
    transform:translateX(0);
  }
  35%{
    transform:translateX(-6px);
  }
  70%{
    transform:translateX(5px);
  }
  100%{
    transform:translateX(0);
  }
}
.lp-shell-status{
  min-height:18px;
  font-size:11px;
  color:rgba(255,255,255,0.84);
}
.lp-shell-status.ok{
  color:#b8ffda;
}
.lp-shell-status.error{
  color:#ffb9b9;
}
.campaign-panel{
  margin-top:12px;
}
.campaign-panel.locked{
  opacity:0.72;
}
.campaign-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
}
.campaign-field{
  display:flex;
  flex-direction:column;
  gap:5px;
  font-size:11px;
  color:rgba(255,255,255,0.78);
  font-weight:700;
}
.campaign-field input,
.campaign-field select{
  width:100%;
  min-height:32px;
  border-radius:9px;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(0,0,0,0.25);
  color:rgba(255,255,255,0.92);
  font-size:12px;
  padding:6px 8px;
}
.campaign-field input:disabled,
.campaign-field select:disabled{
  opacity:0.65;
}
.campaign-meta{
  margin-top:8px;
  font-size:11px;
  color:rgba(190,233,255,0.9);
  line-height:1.35;
  min-height:28px;
}
.campaign-actions{
  margin-top:8px;
  display:flex;
  justify-content:flex-end;
}
.campaign-status{
  margin-top:8px;
  font-size:11px;
  color:rgba(255,255,255,0.72);
  min-height:16px;
}

.bank-panel{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.bank-card{
  border:1px solid rgba(255,255,255,0.12);
  border-radius:11px;
  background:rgba(0,0,0,0.2);
  padding:10px;
}
.bank-title{
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,0.92);
  margin-bottom:8px;
}
.bank-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  font-size:12px;
  color:rgba(255,255,255,0.82);
  margin-top:6px;
}
.bank-row strong{
  font-size:12px;
  color:#fff4d1;
  font-variant-numeric:tabular-nums;
}
.bank-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.bank-note{
  margin-top:8px;
  font-size:11px;
  color:rgba(255,255,255,0.64);
  line-height:1.35;
}

.hud-skill{
  margin-top:10px;
  border:1px solid rgba(255,255,255,0.11);
  border-radius:11px;
  background:rgba(0,0,0,0.18);
  padding:10px;
}
.hud-skill-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.hud-skill-title{
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,0.9);
}
.hud-skill-state{
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,0.74);
}
.hud-skill-state.on{
  color:#8ff9cb;
}
.hud-skill-advice{
  margin-top:8px;
  font-size:12px;
  color:rgba(255,255,255,0.82);
  min-height:16px;
}
.hud-skill-actions{
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.hud-skill-cooldown{
  font-size:11px;
  color:rgba(255,255,255,0.72);
}
.economy-offline-note{
  margin-top:8px;
  font-size:11px;
  color:#b7ffd8;
  min-height:14px;
}

.stats-grid{
  margin-top:10px;
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
}
.stat-card{
  padding:10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
}
.stat-label{
  font-size:11px;
  color:rgba(255,255,255,0.70);
  margin-bottom:6px;
}
.stat-value{
  font-size:17px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}
.stat-value.up{color:#8ff9cb}
.stat-value.down{color:#ff9e9e}

.results-log{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
}
.results-log-head{
  font-size:13px;
  font-weight:900;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
}
.results-log-table-wrap{
  margin-top:8px;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  max-height:220px;
  background:rgba(0,0,0,0.2);
}
.results-log-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.results-log-table th,
.results-log-table td{
  padding:7px 8px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  text-align:left;
  white-space:nowrap;
}
.results-log-table thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:rgba(12,42,30,0.96);
  color:rgba(255,255,255,0.74);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.34px;
}
.results-log-table tbody tr:last-child td{
  border-bottom:none;
}
.results-log-table tbody tr.empty td{
  color:rgba(255,255,255,0.62);
  text-align:center;
}
.result-log-row.win td:nth-child(2),
.result-log-row.blackjack td:nth-child(2){
  color:#9ff8bf;
  font-weight:800;
}
.result-log-row.loss td:nth-child(2){
  color:#ffb2b8;
  font-weight:800;
}
.result-log-row.draw td:nth-child(2){
  color:#ffe49f;
  font-weight:800;
}
.result-log-row.blackjack td:nth-child(2){
  color:#ffe49f;
}
.result-log-row.win td:nth-child(3),
.result-log-row.blackjack td:nth-child(3){
  color:#9ff8bf;
}
.result-log-row.loss td:nth-child(3){
  color:#ffb2b8;
}
.result-log-row.boss-round td:first-child{
  position:relative;
  padding-left:16px;
}
.result-log-row.boss-round td:first-child::before{
  content:"*";
  position:absolute;
  left:6px;
  top:50%;
  transform:translateY(-52%);
  color:rgba(255,215,122,0.95);
  font-size:10px;
}
.round-audit{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
}
.round-audit-head{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.round-audit-head span{
  font-size:13px;
  font-weight:900;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
}
.round-audit-head strong{
  font-size:11px;
  font-weight:700;
  color:rgba(255,255,255,0.7);
}
.round-audit-table-wrap{
  margin-top:8px;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:10px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  max-height:220px;
  background:rgba(0,0,0,0.2);
}
.round-audit-table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.round-audit-table th,
.round-audit-table td{
  padding:7px 8px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  text-align:left;
  white-space:nowrap;
}
.round-audit-table thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:rgba(12,42,30,0.96);
  color:rgba(255,255,255,0.74);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.34px;
}
.round-audit-table tbody tr:last-child td{
  border-bottom:none;
}
.round-audit-table tbody tr.empty td{
  color:rgba(255,255,255,0.62);
  text-align:center;
}
.round-audit-table td.amount{
  font-weight:800;
}
.round-audit-table tr.positive td.amount{
  color:#9ff8bf;
}
.round-audit-table tr.negative td.amount{
  color:#ffb2b8;
}
.round-audit-table tr.neutral td.amount{
  color:#ffe49f;
}
.round-audit-table tr.summary td{
  background:rgba(246,196,83,0.1);
}

.leaderboard{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
}
.leaderboard-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}
.leaderboard-title{
  font-size:13px;
  font-weight:900;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
}
.leaderboard-submit{
  margin-top:10px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
}
/* Name input handled by startup modal prompt */
.leaderboard-submit{display:none}
.leaderboard-current{
  margin-top:8px;
  font-size:12px;
  color:rgba(255,255,255,0.74);
}
.leaderboard-current strong{
  color:rgba(255,255,255,0.95);
}
.leaderboard-submit input{
  width:100%;
  min-width:0;
  padding:10px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.28);
  color:var(--text);
  outline:none;
}
.leaderboard-note{
  margin-top:8px;
  font-size:12px;
  color:rgba(255,255,255,0.72);
}
.leaderboard-note.error{
  color:#ffb2b2;
}
.leaderboard-list{
  margin:8px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.leaderboard-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:10px;
  padding:7px 8px;
  background:rgba(0,0,0,0.2);
}
.leaderboard-main{
  display:flex;
  gap:8px;
  align-items:baseline;
  min-width:0;
}
.leaderboard-rank{
  min-width:22px;
  color:rgba(255,255,255,0.72);
  font-size:12px;
  font-weight:800;
}
.leaderboard-name{
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:185px;
}
.leaderboard-score{
  font-weight:900;
  color:#b5ffdb;
}
.leaderboard-meta{
  font-size:11px;
  color:rgba(255,255,255,0.66);
  width:100%;
  text-align:right;
  white-space:nowrap;
}
.leaderboard-empty{
  padding:8px 10px;
  border:1px dashed rgba(255,255,255,0.18);
  border-radius:10px;
  color:rgba(255,255,255,0.66);
  font-size:12px;
}

.save-panel{
  margin-top:0;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
}
.save-identity-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.save-identity-card{
  border:1px solid rgba(255,255,255,0.14);
  border-radius:10px;
  background:rgba(0,0,0,0.24);
  padding:8px 9px;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.save-identity-card span{
  font-size:10px;
  font-weight:800;
  letter-spacing:0.3px;
  text-transform:uppercase;
  color:rgba(255,255,255,0.62);
}
.save-identity-card strong{
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,0.95);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.save-identity-card small{
  font-size:11px;
  line-height:1.35;
  color:rgba(255,255,255,0.74);
}
.save-identity-card-single{
  margin-bottom:10px;
}
.save-slot-wrap{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}
.save-mini-label{
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,0.74);
  letter-spacing:0.3px;
  text-transform:uppercase;
}
.save-slot-tabs{
  display:inline-flex;
  gap:6px;
}
.save-help-row{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
}
.save-help-toggle{
  width:32px;
  min-width:32px;
  height:32px;
  padding:0;
  border-radius:10px;
  font-size:16px;
  font-weight:900;
  line-height:1;
}
.save-help-label{
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,0.74);
  letter-spacing:0.3px;
  text-transform:uppercase;
}
.save-help-box{
  margin-top:8px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:10px;
  background:rgba(0,0,0,0.24);
  padding:9px 10px;
  display:grid;
  gap:6px;
  font-size:11px;
  color:rgba(255,255,255,0.78);
}
.save-help-box p{
  margin:0;
  line-height:1.36;
}
.save-help-box strong{
  color:rgba(255,255,255,0.92);
}
.save-slot-tab{
  appearance:none;
  min-width:36px;
  height:30px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(0,0,0,0.24);
  color:rgba(255,255,255,0.82);
  font-size:12px;
  font-weight:900;
  cursor:pointer;
  transition:transform 120ms ease, border-color 120ms ease, background 120ms ease;
}
.save-slot-tab:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.32);
}
.save-slot-tab:disabled{
  opacity:0.55;
  cursor:not-allowed;
  transform:none;
}
.save-slot-tab.active{
  border-color:rgba(246,196,83,0.58);
  color:#ffe6ad;
  background:linear-gradient(180deg, rgba(246,196,83,0.28), rgba(0,0,0,0.18));
}
#save-slot-label,
#save-link-token{
  margin-top:6px;
  width:100%;
  min-width:0;
  padding:10px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.28);
  color:var(--text);
  outline:none;
  font-size:12px;
  font-weight:700;
}
#save-link-token{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  letter-spacing:0.1px;
}
#save-slot-label:focus-visible,
#save-link-token:focus-visible{
  border-color:rgba(255,255,255,0.36);
  box-shadow:0 0 0 2px rgba(246,196,83,0.18);
}
.save-meta-grid{
  margin-top:10px;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}
.save-meta-item{
  border:1px solid rgba(255,255,255,0.12);
  border-radius:10px;
  background:rgba(0,0,0,0.2);
  padding:8px 9px;
  font-size:11px;
  color:rgba(255,255,255,0.72);
}
.save-meta-item strong{
  display:block;
  margin-top:3px;
  font-size:12px;
  color:rgba(255,255,255,0.92);
  font-variant-numeric:tabular-nums;
}
.save-actions{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.save-actions .btn{
  flex:1 1 140px;
}
.save-import-label{
  margin-top:10px;
  display:block;
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,0.74);
  letter-spacing:0.3px;
}
#save-import-code{
  margin-top:6px;
  width:100%;
  min-height:72px;
  resize:vertical;
  padding:10px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.28);
  color:var(--text);
  outline:none;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:11px;
  line-height:1.35;
}
#save-import-code:focus-visible{
  border-color:rgba(255,255,255,0.36);
  box-shadow:0 0 0 2px rgba(246,196,83,0.18);
}
.save-note{
  margin-top:8px;
  font-size:12px;
  color:rgba(255,255,255,0.74);
}
.save-note.error{
  color:#ffb3b3;
}
.save-note.ok{
  color:#9ff8bf;
}

.btn{
  position:relative;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.20);
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,255,255,0.12), rgba(255,255,255,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(0,0,0,0.18));
  color:rgba(255,255,255,0.92);
  cursor:pointer;
  transition:transform 120ms ease, background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, filter 120ms ease;
  font-weight:700;
  -webkit-tap-highlight-color:transparent;
  box-shadow:
    0 8px 18px rgba(0,0,0,0.28),
    0 0 0 1px rgba(255,255,255,0.06) inset;
}
@media (hover: hover) and (pointer: fine){
  .btn:hover{
    transform:translateY(-1px);
    background:
      radial-gradient(120% 120% at 20% 0%, rgba(255,255,255,0.18), rgba(255,255,255,0) 55%),
      linear-gradient(180deg, rgba(255,255,255,0.14), rgba(0,0,0,0.16));
    border-color:rgba(255,255,255,0.32);
    box-shadow:
      0 12px 22px rgba(0,0,0,0.32),
      0 0 0 1px rgba(255,255,255,0.10) inset;
    filter:brightness(1.04);
  }
}
.btn:active{transform:translateY(0px)}
.btn:disabled{
  opacity:0.45;
  cursor:not-allowed;
  transform:none;
}
.btn.has-unread::after{
  content:"";
  position:absolute;
  top:-5px;
  right:-5px;
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.92);
  background:#ff3b30;
  box-shadow:
    0 0 0 2px rgba(255,59,48,0.24),
    0 3px 10px rgba(0,0,0,0.34);
  animation:fabUnreadPulse 1.25s ease-in-out infinite;
}
.btn.primary{
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,240,189,0.38), rgba(255,240,189,0) 58%),
    linear-gradient(180deg, rgba(246,196,83,0.40), rgba(168,118,25,0.30));
  border-color:rgba(246,196,83,0.74);
  color:#fff5d4;
  box-shadow:
    0 10px 24px rgba(72,48,8,0.34),
    0 0 0 1px rgba(255,238,179,0.26) inset;
}
@media (hover: hover) and (pointer: fine){
  .btn.primary:hover{
    background:
      radial-gradient(120% 120% at 20% 0%, rgba(255,244,202,0.42), rgba(255,244,202,0) 58%),
      linear-gradient(180deg, rgba(246,196,83,0.46), rgba(168,118,25,0.34));
  }
}
#hit{
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,210,210,0.34), rgba(255,210,210,0) 58%),
    linear-gradient(180deg, rgba(206,53,53,0.56), rgba(132,24,24,0.48));
  border-color:rgba(255,142,142,0.78);
  color:#ffe7e7;
  box-shadow:
    0 10px 24px rgba(88,14,14,0.36),
    0 0 0 1px rgba(255,197,197,0.2) inset;
}
@media (hover: hover) and (pointer: fine){
  #hit:hover:not(:disabled){
    background:
      radial-gradient(120% 120% at 20% 0%, rgba(255,224,224,0.38), rgba(255,224,224,0) 58%),
      linear-gradient(180deg, rgba(226,66,66,0.62), rgba(150,30,30,0.5));
    border-color:rgba(255,168,168,0.88);
    box-shadow:
      0 12px 26px rgba(96,18,18,0.4),
      0 0 0 1px rgba(255,214,214,0.26) inset;
  }
}
#hit:active:not(:disabled){
  transform:translateY(0);
  filter:brightness(0.98);
}
#deal{
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,210,210,0.34), rgba(255,210,210,0) 58%),
    linear-gradient(180deg, rgba(206,53,53,0.56), rgba(132,24,24,0.48));
  border-color:rgba(255,142,142,0.78);
  color:#ffe7e7;
  box-shadow:
    0 10px 24px rgba(88,14,14,0.36),
    0 0 0 1px rgba(255,197,197,0.2) inset;
}
@media (hover: hover) and (pointer: fine){
  #deal:hover:not(:disabled){
    background:
      radial-gradient(120% 120% at 20% 0%, rgba(255,224,224,0.38), rgba(255,224,224,0) 58%),
      linear-gradient(180deg, rgba(226,66,66,0.62), rgba(150,30,30,0.5));
    border-color:rgba(255,168,168,0.88);
    box-shadow:
      0 12px 26px rgba(96,18,18,0.4),
      0 0 0 1px rgba(255,214,214,0.26) inset;
  }
}
#deal:active:not(:disabled){
  transform:translateY(0);
  filter:brightness(0.98);
}
#deal.hit-mode{
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(255,210,210,0.34), rgba(255,210,210,0) 58%),
    linear-gradient(180deg, rgba(206,53,53,0.56), rgba(132,24,24,0.48));
  border-color:rgba(255,142,142,0.78);
  color:#ffe7e7;
  box-shadow:
    0 10px 24px rgba(88,14,14,0.36),
    0 0 0 1px rgba(255,197,197,0.2) inset;
}
@media (hover: hover) and (pointer: fine){
  #deal.hit-mode:hover:not(:disabled){
    background:
      radial-gradient(120% 120% at 20% 0%, rgba(255,224,224,0.38), rgba(255,224,224,0) 58%),
      linear-gradient(180deg, rgba(226,66,66,0.62), rgba(150,30,30,0.5));
    border-color:rgba(255,168,168,0.88);
    box-shadow:
      0 12px 26px rgba(96,18,18,0.4),
      0 0 0 1px rgba(255,214,214,0.26) inset;
  }
}
#deal.hit-mode:active:not(:disabled){
  transform:translateY(0);
  filter:brightness(0.98);
}
@media (hover: none) and (pointer: coarse){
  #hit:active:not(:disabled),
  #deal:active:not(:disabled),
  #deal.hit-mode:active:not(:disabled){
    filter:none;
  }
}
.btn.ghost{
  background:rgba(0,0,0,0.10);
  border-color:rgba(255,255,255,0.18);
}
.legal-nav-btn{
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  -webkit-tap-highlight-color:transparent;
  -webkit-touch-callout:none;
}
.legal-nav-btn:visited{
  color:rgba(255,255,255,0.92);
}
.legal-nav-btn:focus{
  outline:none;
}
.legal-nav-btn:focus-visible{
  outline:2px solid rgba(246,196,83,0.78);
  outline-offset:2px;
}
#mission-btn,
#buffs-main-btn,
#skilltree-btn{
  -webkit-tap-highlight-color:transparent;
}
#mission-btn:focus,
#buffs-main-btn:focus,
#skilltree-btn:focus{
  outline:none;
}
#mission-btn.main-menu-active,
#buffs-main-btn.main-menu-active,
#skilltree-btn.main-menu-active{
  border-color:rgba(246,196,83,0.98);
  border-width:3px;
  background:rgba(34,26,8,0.46);
  color:#fff2c6;
  box-shadow:
    inset 0 0 0 1px rgba(255,242,191,0.50),
    0 0 0 2px rgba(246,196,83,0.35),
    0 8px 20px rgba(0,0,0,0.30);
  text-shadow:0 1px 0 rgba(59,39,4,0.6);
}
#mission-btn.mission-alert{
  border-color:rgba(255,96,96,0.86);
  box-shadow:
    0 0 0 1px rgba(255,194,194,0.18) inset,
    0 0 0 0 rgba(255,86,86,0.46);
  animation:missionBtnPulse 1050ms ease-in-out infinite;
}
@keyframes missionBtnPulse{
  0%{
    transform:translateY(0) scale(1);
    box-shadow:
      0 0 0 1px rgba(255,194,194,0.18) inset,
      0 0 0 0 rgba(255,86,86,0.46);
  }
  55%{
    transform:translateY(-1px) scale(1.02);
    box-shadow:
      0 0 0 1px rgba(255,205,205,0.22) inset,
      0 0 0 10px rgba(255,86,86,0);
  }
  100%{
    transform:translateY(0) scale(1);
    box-shadow:
      0 0 0 1px rgba(255,194,194,0.18) inset,
      0 0 0 0 rgba(255,86,86,0);
  }
}
.btn.small{padding:9px 10px;font-size:12px;border-radius:11px}
.btn.hinted{
  border-color:rgba(246,196,83,0.80);
  box-shadow:0 0 0 3px rgba(246,196,83,0.20);
  animation:hintPulse 640ms ease;
}
.btn.attention{
  border-color:rgba(110,231,183,0.88);
  box-shadow:
    0 0 0 1px rgba(175,255,224,0.24) inset,
    0 0 0 0 rgba(110,231,183,0.52);
  animation:insuranceGlow 980ms ease-in-out infinite;
}
.btn.toggled{
  border-color:rgba(255,236,170,0.90);
  background:
    radial-gradient(110% 130% at 12% 0%, rgba(255,247,207,0.34), rgba(255,247,207,0) 58%),
    linear-gradient(180deg, rgba(205,150,42,0.38), rgba(126,86,18,0.34));
  color:#fff4d2;
  box-shadow:
    0 0 0 1px rgba(255,240,188,0.28) inset,
    0 8px 18px rgba(92,58,8,0.28);
  animation:none;
}
.btn.unlock-flash,
.fab.unlock-flash{
  animation:unlockFlash 820ms ease;
}
@keyframes unlockFlash{
  0%{
    transform:translateY(0) scale(1);
    box-shadow:0 0 0 0 rgba(108,197,255,0.64);
  }
  45%{
    transform:translateY(-1px) scale(1.05);
    box-shadow:0 0 0 8px rgba(108,197,255,0);
  }
  100%{
    transform:translateY(0) scale(1);
    box-shadow:0 0 0 0 rgba(108,197,255,0);
  }
}
body.unlock-celebration .topbar{
  animation:unlockTopbarPulse 1200ms ease;
}
body.unlock-celebration .table{
  animation:unlockTablePulse 1200ms ease;
}
@keyframes unlockTopbarPulse{
  0%{
    box-shadow:0 10px 24px rgba(0,0,0,0.35);
  }
  40%{
    box-shadow:
      0 12px 34px rgba(0,0,0,0.4),
      0 0 22px rgba(94,178,255,0.38);
  }
  100%{
    box-shadow:0 10px 24px rgba(0,0,0,0.35);
  }
}
@keyframes unlockTablePulse{
  0%{
    transform:translateY(0) scale(1);
    box-shadow:var(--shadow);
  }
  42%{
    transform:translateY(-1px) scale(1.006);
    box-shadow:
      0 0 0 1px rgba(184,230,255,0.36) inset,
      0 24px 44px rgba(0,0,0,0.42),
      0 0 18px rgba(84,174,255,0.24);
  }
  100%{
    transform:translateY(0) scale(1);
    box-shadow:var(--shadow);
  }
}
@keyframes hintPulse{
  0%{transform:translateY(0) scale(1)}
  35%{transform:translateY(-1px) scale(1.03)}
  100%{transform:translateY(0) scale(1)}
}
@keyframes insuranceGlow{
  0%{
    box-shadow:
      0 0 0 1px rgba(175,255,224,0.22) inset,
      0 0 0 0 rgba(110,231,183,0.46);
  }
  60%{
    box-shadow:
      0 0 0 1px rgba(175,255,224,0.34) inset,
      0 0 0 9px rgba(110,231,183,0);
  }
  100%{
    box-shadow:
      0 0 0 1px rgba(175,255,224,0.22) inset,
      0 0 0 0 rgba(110,231,183,0);
  }
}

.icon-btn{
  width:34px;height:34px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(0,0,0,0.18);
  color:rgba(255,255,255,0.92);
  cursor:pointer;
  display:grid;
  place-items:center;
  -webkit-tap-highlight-color:transparent;
}
@media (hover: hover) and (pointer: fine){
  .icon-btn:hover{background:rgba(0,0,0,0.28)}
}

.status{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(10,45,31,0.38);
  color:rgba(255,255,255,0.92);
  white-space:pre-line;
  backdrop-filter: blur(8px) saturate(125%);
  position:relative;
  overflow:hidden;
  transform:translateZ(0);
  transition:border-color 160ms ease, box-shadow 160ms ease, background 180ms ease, color 140ms ease;
}
.status .status-result{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:2px 10px;
  align-items:center;
}
.status .status-result-badge{
  width:34px;
  height:34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  font-size:18px;
  font-weight:900;
  line-height:1;
  border:1px solid rgba(255,255,255,0.35);
  background:rgba(255,255,255,0.15);
  box-shadow:0 5px 12px rgba(0,0,0,0.24);
}
.status .status-result-body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:0;
}
.status .status-result-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:1.5px;
  text-transform:uppercase;
  opacity:0.92;
}
.status .status-result-value{
  font-size:clamp(21px, 4.2vw, 31px);
  font-weight:900;
  line-height:1.02;
  letter-spacing:0.2px;
}
.status .status-result-extra{
  grid-column:1 / -1;
  margin-top:1px;
  padding-top:4px;
  border-top:1px solid rgba(255,255,255,0.17);
  font-size:12px;
  font-weight:700;
  letter-spacing:0.2px;
  opacity:0.95;
}
.status::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transform:translateX(-120%);
  background:linear-gradient(
    110deg,
    transparent 0%,
    rgba(255,255,255,0.04) 35%,
    rgba(255,255,255,0.30) 50%,
    rgba(255,255,255,0.05) 64%,
    transparent 100%
  );
}
.status.result-flash::after{
  opacity:1;
  animation:statusSweep 760ms ease forwards;
}
.status.result-flash .status-result{
  animation:statusResultPop 430ms cubic-bezier(.2,.84,.34,1);
}
.status.result-win{
  border-color:rgba(83,255,186,0.80);
  background:linear-gradient(135deg, rgba(13,96,63,0.76), rgba(18,66,49,0.74));
  color:#ecfff4;
  box-shadow:
    0 0 0 1px rgba(114,255,193,0.26) inset,
    0 0 26px rgba(45,225,149,0.36);
}
.status.result-win .status-result-badge{
  color:#deffef;
  border-color:rgba(171,255,217,0.86);
  background:linear-gradient(140deg, rgba(73,228,159,0.80), rgba(29,130,90,0.78));
}
.status.result-win .status-result-value{
  color:#f3fff8;
  text-shadow:0 0 16px rgba(85,239,165,0.50);
  animation:statusValuePulseWin 620ms ease-out;
}
.status.result-blackjack{
  border-color:rgba(255,219,116,0.9);
  background:
    radial-gradient(120% 120% at 22% 0%, rgba(255,246,201,0.16), rgba(255,246,201,0) 56%),
    linear-gradient(135deg, rgba(120,88,20,0.9), rgba(84,58,14,0.84));
  box-shadow:
    0 0 0 1px rgba(255,235,173,0.24) inset,
    0 0 26px rgba(255,204,83,0.38);
  animation:blackjackEventPulse 950ms ease-in-out infinite;
}
.status.result-lose{
  border-color:rgba(255,120,120,0.82);
  background:linear-gradient(135deg, rgba(124,33,33,0.78), rgba(70,24,24,0.74));
  color:#fff2f2;
  box-shadow:
    0 0 0 1px rgba(255,133,133,0.22) inset,
    0 0 26px rgba(255,88,88,0.34);
}
.status.result-lose .status-result-badge{
  color:#ffe7e7;
  border-color:rgba(255,186,186,0.88);
  background:linear-gradient(140deg, rgba(246,106,106,0.84), rgba(171,52,52,0.82));
}
.status.result-lose .status-result-value{
  color:#fff2f2;
  text-shadow:0 0 14px rgba(255,132,132,0.40);
}
.status.result-draw{
  border-color:rgba(255,217,115,0.82);
  background:linear-gradient(135deg, rgba(128,92,21,0.78), rgba(84,60,15,0.76));
  color:#fff9e8;
  box-shadow:
    0 0 0 1px rgba(255,224,145,0.24) inset,
    0 0 24px rgba(255,199,72,0.32);
}
.status.result-draw .status-result-badge{
  color:#fff7db;
  border-color:rgba(255,230,168,0.88);
  background:linear-gradient(140deg, rgba(228,179,65,0.86), rgba(171,122,26,0.84));
}
.status.result-draw .status-result-value{
  color:#fffbe8;
  text-shadow:0 0 14px rgba(255,209,100,0.42);
}
.status.result-buff{
  border-color:rgba(137,194,255,0.80);
  background:linear-gradient(135deg, rgba(24,73,122,0.74), rgba(22,51,89,0.72));
  color:#f1f7ff;
  box-shadow:
    0 0 0 1px rgba(147,191,255,0.22) inset,
    0 0 24px rgba(97,155,255,0.30);
}
.status.result-buff .status-result-badge{
  color:#ecf5ff;
  border-color:rgba(180,220,255,0.84);
  background:linear-gradient(140deg, rgba(118,176,255,0.83), rgba(54,111,196,0.82));
}
.status.result-buff .status-result-value{
  color:#f4f9ff;
  text-shadow:0 0 14px rgba(130,179,255,0.42);
}
.status.result-debuff{
  border-color:rgba(255,120,120,0.82);
  background:linear-gradient(135deg, rgba(124,33,33,0.78), rgba(70,24,24,0.74));
  color:#fff2f2;
  box-shadow:
    0 0 0 1px rgba(255,133,133,0.22) inset,
    0 0 26px rgba(255,88,88,0.34);
}
.status.result-debuff .status-result-badge{
  color:#ffe7e7;
  border-color:rgba(255,186,186,0.88);
  background:linear-gradient(140deg, rgba(246,106,106,0.84), rgba(171,52,52,0.82));
}
.status.result-debuff .status-result-value{
  color:#fff2f2;
  text-shadow:0 0 14px rgba(255,132,132,0.40);
}
.status.result-shake{
  border-color:rgba(255,94,94,0.88);
}
.status.result-shake .status-result{
  animation:statusShake 360ms cubic-bezier(.36,.07,.19,.97);
}
.status.pulse{
  animation:statusPulse 260ms ease;
}
#status{
  display:none !important;
}
@keyframes statusSweep{
  0%{
    opacity:0;
    transform:translateX(-120%);
  }
  16%{
    opacity:0.72;
  }
  100%{
    opacity:0;
    transform:translateX(120%);
  }
}
@keyframes statusPulse{
  0%{transform:translateY(0);filter:brightness(1)}
  45%{transform:translateY(-1px);filter:brightness(1.09)}
  100%{transform:translateY(0);filter:brightness(1)}
}
@keyframes statusResultPop{
  0%{
    opacity:0.56;
    transform:scale(0.94) translateY(2px);
  }
  66%{
    opacity:1;
    transform:scale(1.02) translateY(-1px);
  }
  100%{
    opacity:1;
    transform:scale(1) translateY(0);
  }
}
@keyframes statusValuePulseWin{
  0%{
    transform:scale(0.96);
    filter:brightness(1);
  }
  52%{
    transform:scale(1.06);
    filter:brightness(1.24);
  }
  100%{
    transform:scale(1);
    filter:brightness(1);
  }
}
@keyframes blackjackEventPulse{
  0%, 100%{
    transform:translateY(0) scale(1);
    filter:brightness(1);
  }
  50%{
    transform:translateY(-1px) scale(1.02);
    filter:brightness(1.12);
  }
}
@keyframes statusShake{
  0%{transform:translate3d(0,0,0)}
  18%{transform:translate3d(-3px,0,0)}
  32%{transform:translate3d(3px,0,0)}
  48%{transform:translate3d(-2px,0,0)}
  64%{transform:translate3d(2px,0,0)}
  82%{transform:translate3d(-1px,0,0)}
  100%{transform:translate3d(0,0,0)}
}
@media (prefers-reduced-motion: reduce){
  .status.result-flash::after{
    animation:none;
    opacity:0.42;
    transform:none;
  }
  .status.result-flash .status-result,
  .status.result-shake .status-result,
  .status.result-win .status-result-value{
    animation:none;
  }
  .bet-status.result-flash,
  .bet-status.result-shake,
  .status.result-blackjack,
  .bet-status.result-blackjack,
  #mission-btn.mission-alert,
  #hud-currency-lp.lp-alert,
  #hud-currency-bankroll.salary-flash,
  .hud-value.delta-active,
  body.boss-round-active::before,
  body.boss-round-active .table > section.area,
  body.boss-round-active .controls,
  body.boss-round-active .bet-panel.inline,
  body.boss-round-active .status,
  body.boss-round-active .table > section.area::before,
  body.boss-round-active .controls::before,
  body.boss-round-active .bet-panel.inline::before,
  body.boss-round-active .status::before,
  body.bonus-round-active::before,
  body.bonus-round-active .table > section.area,
  body.bonus-round-active .controls,
  body.bonus-round-active .bet-panel.inline,
  body.bonus-round-active .status,
  .table.win-bonus-flash,
  #hud-currency-ruf.bonus-ruf-pop,
  #hud-currency-ruf.bonus-ruf-pop .hud-value,
  .card.in,
  .card.flip{
    animation:none;
  }
}
@keyframes turnGlow{
  0%{box-shadow:0 0 0 2px rgba(110,231,183,0.14), var(--shadow)}
  50%{box-shadow:0 0 0 3px rgba(110,231,183,0.22), var(--shadow)}
  100%{box-shadow:0 0 0 2px rgba(110,231,183,0.14), var(--shadow)}
}

.btn:focus-visible,
.icon-btn:focus-visible,
.advanced-summary:focus-visible,
.advanced-sub-summary:focus-visible,
.chip:focus-visible,
.bet-slider:focus-visible,
.leaderboard-submit input:focus-visible,
#name-input:focus-visible{
  outline:2px solid rgba(246,196,83,0.75);
  outline-offset:2px;
}
.btn:focus:not(:focus-visible),
.icon-btn:focus:not(:focus-visible){
  outline:none;
}

/* ===== Music ===== */
.fab{
  position:fixed;
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + env(safe-area-inset-bottom, 0px));
  z-index:70;
  width:54px;height:54px;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.92);
  backdrop-filter:blur(8px) saturate(125%);
  box-shadow:
    0 14px 28px rgba(5,8,12,0.45),
    0 0 0 1px rgba(255,255,255,0.06) inset;
  cursor:pointer;
  font-size:0;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:background 140ms ease, transform 140ms ease, border-color 140ms ease, opacity 140ms ease, box-shadow 140ms ease;
}
.fab-icon{
  width:30px;
  height:30px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  color:rgba(255,255,255,0.95);
}
@media (hover: hover) and (pointer: fine){
  .fab:hover{
    background:rgba(255,255,255,0.12);
    border-color:rgba(255,255,255,0.26);
    box-shadow:
      0 16px 30px rgba(5,8,12,0.48),
      0 0 0 1px rgba(255,255,255,0.1) inset;
  }
}
.fab.active{
  border-color:rgba(246,196,83,0.98);
  border-width:3px;
  background:rgba(34,26,8,0.46);
  color:#fff2c6;
  box-shadow:
    inset 0 0 0 1px rgba(255,242,191,0.50),
    0 0 0 2px rgba(246,196,83,0.35),
    0 8px 20px rgba(0,0,0,0.30);
}
.fab.active .fab-icon{
  color:#fff2c6;
}
.fab.active:hover{
  background:rgba(47,35,11,0.52);
  border-color:rgba(246,196,83,0.98);
}
.fab:active{
  transform:translateY(1px);
}
.fab:focus{
  outline:none;
}
.menu-fab{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(6px) scale(0.94);
}
body.fab-menu-open .menu-fab:not([hidden]){
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}
body.fab-menu-open .settings-fab{
  animation:fabSettingsPulse 760ms ease-in-out infinite;
}
body.fab-slider-active .menu-fab:not([hidden]){
  transition:
    transform 170ms cubic-bezier(.22,.8,.3,1),
    box-shadow 170ms cubic-bezier(.22,.8,.3,1),
    border-color 170ms ease,
    background 170ms ease,
    opacity 170ms ease,
    filter 170ms ease;
}
body.fab-slider-active .settings-fab{
  border-color:rgba(196,221,255,0.62);
  border-width:1px;
  background:
    radial-gradient(125% 125% at 22% 10%, rgba(255,255,255,0.16), rgba(255,255,255,0) 58%),
    linear-gradient(180deg, rgba(40,62,94,0.44), rgba(19,35,58,0.42));
  color:#eef6ff;
  box-shadow:
    inset 0 0 0 1px rgba(238,246,255,0.18),
    0 10px 24px rgba(5,8,12,0.42),
    0 0 18px rgba(141,188,255,0.24);
  animation:fabSettingsPulse 620ms ease-in-out infinite;
}
body.fab-slider-active .settings-fab .fab-icon{
  color:#eef6ff;
  filter:drop-shadow(0 2px 8px rgba(122,178,255,0.32));
}
body.fab-slider-active .menu-fab:not(.slider-focus):not([hidden]){
  opacity:0.56;
  transform:translateY(0) scale(0.92);
  filter:saturate(0.68) brightness(0.92);
}
body.fab-slider-active .menu-fab.active:not(.slider-focus):not([hidden]){
  border-color:rgba(255,255,255,0.22);
  border-width:1px;
  background:rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.92);
  box-shadow:
    0 14px 28px rgba(5,8,12,0.45),
    0 0 0 1px rgba(255,255,255,0.06) inset;
}
body.fab-slider-active .menu-fab.active:not(.slider-focus):not([hidden]) .fab-icon{
  color:rgba(255,255,255,0.95);
}
body.fab-slider-active .menu-fab.slider-focus:not([hidden]){
  opacity:1;
  transform:translateY(0) translateX(-4px) scale(1.14);
  border-color:rgba(196,221,255,0.62);
  border-width:1px;
  background:
    radial-gradient(125% 125% at 22% 10%, rgba(255,255,255,0.20), rgba(255,255,255,0) 58%),
    linear-gradient(180deg, rgba(40,62,94,0.58), rgba(19,35,58,0.54));
  color:#eef6ff;
  box-shadow:
    inset 0 0 0 1px rgba(238,246,255,0.22),
    0 10px 24px rgba(5,8,12,0.48),
    0 0 22px rgba(141,188,255,0.28);
  animation:fabSliderFocusPulse 620ms ease-in-out infinite;
}
body.fab-slider-active .menu-fab.slider-focus .fab-icon{
  color:#eef6ff;
  filter:drop-shadow(0 2px 8px rgba(122,178,255,0.38));
}
@keyframes fabSliderFocusPulse{
  0%,100%{
    transform:translateY(0) translateX(-4px) scale(1.14);
  }
  50%{
    transform:translateY(0) translateX(-5px) scale(1.18);
  }
}
@keyframes fabSettingsPulse{
  0%,100%{
    transform:translateY(0) scale(1);
  }
  50%{
    transform:translateY(-1px) scale(1.06);
  }
}
@media (prefers-reduced-motion: reduce){
  body.fab-menu-open .settings-fab,
  body.fab-slider-active .settings-fab{
    animation:none;
  }
}
.bet-fab{
  display:none !important;
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 132px + env(safe-area-inset-bottom, 0px));
}
.settings-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + env(safe-area-inset-bottom, 0px));
  z-index:72;
  touch-action:none;
}
.fab.has-unread::after{
  content:"";
  position:absolute;
  top:8px;
  right:8px;
  width:10px;
  height:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.92);
  background:#ff3b30;
  box-shadow:
    0 0 0 2px rgba(255,59,48,0.26),
    0 4px 10px rgba(0,0,0,0.34);
  animation:fabUnreadPulse 1.25s ease-in-out infinite;
}
@keyframes fabUnreadPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.13)}
}
.stats-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 66px + env(safe-area-inset-bottom, 0px));
}
#music-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 198px + env(safe-area-inset-bottom, 0px));
}
.shop-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 264px + env(safe-area-inset-bottom, 0px));
}
.events-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 330px + env(safe-area-inset-bottom, 0px));
}
.buffs-fab{
  right:16px;
  left:auto;
  bottom:calc(var(--floating-bottom) + 132px + env(safe-area-inset-bottom, 0px));
}
.bet-panel{
  position:relative;
  right:auto;
  left:auto;
  bottom:auto;
  width:100%;
  max-height:none;
  z-index:1;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(5,29,19,0.46);
  backdrop-filter: blur(10px) saturate(140%);
  box-shadow:var(--shadow);
  overflow:visible;
  transform:none;
  opacity:1;
  pointer-events:auto;
  transition:none;
}
.bet-panel.open{
  opacity:1;
  transform:none;
  pointer-events:auto;
}
body.table-theme-crimson .bet-panel{
  border-color:rgba(255,183,183,0.28);
  background:rgba(56,18,18,0.52);
}
body.table-theme-obsidian .bet-panel{
  border-color:rgba(255,255,255,0.24);
  background:rgba(24,24,24,0.56);
}
body.table-theme-diamond .bet-panel{
  border-color:rgba(255,225,156,0.3);
  background:rgba(46,35,14,0.56);
}
.bet-panel-head{
  display:none;
}
.bet-panel-body{
  padding:12px;
}
.bet-status{
  min-height:76px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.18);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(12,45,31,0.9), rgba(8,31,22,0.9));
  box-shadow:0 0 0 1px rgba(255,255,255,0.08) inset;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:16px;
  font-weight:800;
  line-height:1.28;
  color:rgba(255,255,255,0.95);
}
body.table-theme-crimson .bet-status{
  border-color:rgba(255,183,183,0.35);
  background:linear-gradient(180deg, rgba(72,24,24,0.93), rgba(50,18,18,0.9));
}
body.table-theme-obsidian .bet-status{
  border-color:rgba(255,255,255,0.26);
  background:linear-gradient(180deg, rgba(38,38,38,0.92), rgba(23,23,23,0.9));
}
body.table-theme-diamond .bet-status{
  border-color:rgba(255,225,156,0.36);
  background:linear-gradient(180deg, rgba(78,60,22,0.93), rgba(49,37,13,0.9));
}
.bet-status.result-flash{
  animation:betStatusIn 220ms ease;
}
.bet-status.result-win{
  border-color:rgba(84,248,180,0.76);
  background:linear-gradient(180deg, rgba(14,84,56,0.95), rgba(10,49,36,0.92));
  box-shadow:
    0 0 0 1px rgba(188,255,226,0.16) inset,
    0 0 24px rgba(62,219,147,0.3);
}
.bet-status.result-blackjack{
  border-color:rgba(255,220,120,0.9);
  background:
    radial-gradient(120% 120% at 22% 0%, rgba(255,246,202,0.24), rgba(255,246,202,0) 58%),
    linear-gradient(180deg, rgba(134,99,22,0.95), rgba(91,63,14,0.92));
  box-shadow:
    0 0 0 1px rgba(255,239,187,0.18) inset,
    0 0 28px rgba(255,200,72,0.34);
  animation:blackjackEventPulse 950ms ease-in-out infinite;
}
.bet-status.result-lose{
  border-color:rgba(255,126,126,0.82);
  background:linear-gradient(180deg, rgba(112,32,32,0.94), rgba(62,22,22,0.92));
  box-shadow:
    0 0 0 1px rgba(255,205,205,0.14) inset,
    0 0 24px rgba(255,97,97,0.32);
}
.bet-status.result-draw{
  border-color:rgba(255,217,115,0.82);
  background:linear-gradient(180deg, rgba(126,90,20,0.94), rgba(88,62,16,0.91));
  box-shadow:
    0 0 0 1px rgba(255,236,182,0.14) inset,
    0 0 24px rgba(255,200,80,0.3);
}
.bet-status.result-buff{
  border-color:rgba(138,196,255,0.8);
  background:linear-gradient(180deg, rgba(24,75,127,0.93), rgba(16,49,88,0.9));
  box-shadow:
    0 0 0 1px rgba(214,235,255,0.12) inset,
    0 0 24px rgba(94,159,255,0.3);
}
.bet-status.result-debuff{
  border-color:rgba(255,126,126,0.82);
  background:linear-gradient(180deg, rgba(112,32,32,0.94), rgba(62,22,22,0.92));
  box-shadow:
    0 0 0 1px rgba(255,205,205,0.14) inset,
    0 0 24px rgba(255,97,97,0.32);
}
.bet-status.result-loan-debt{
  border-color:rgba(255,118,118,0.9);
  background:linear-gradient(180deg, rgba(120,28,28,0.97), rgba(80,19,19,0.95));
  box-shadow:0 0 0 1px rgba(255,210,210,0.16) inset;
}
.bet-status.result-shake{
  animation:betStatusLosePulse 320ms ease-out;
}
@keyframes betStatusIn{
  from{
    opacity:0;
    transform:translateY(6px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}
@keyframes betStatusLosePulse{
  0%{
    filter:brightness(1);
    box-shadow:
      0 0 0 1px rgba(255,205,205,0.14) inset,
      0 0 24px rgba(255,97,97,0.18);
  }
  45%{
    filter:brightness(1.15);
    box-shadow:
      0 0 0 1px rgba(255,205,205,0.22) inset,
      0 0 30px rgba(255,97,97,0.35);
  }
  100%{
    filter:brightness(1);
    box-shadow:
      0 0 0 1px rgba(255,205,205,0.14) inset,
      0 0 24px rgba(255,97,97,0.18);
  }
}
.bet-panel.inline{
  margin-top:-2px;
}
.bet-panel.round-hidden:not(.status-message){
  display:none !important;
}
.bet-panel.status-message .betbox{
  display:none;
}
.bet-panel.status-message .bet-status{
  display:flex;
}
.bet-panel.inline .bet-slider-box{
  padding:7px 8px;
}
.bet-panel.inline .bet-slider-head{
  margin-bottom:5px;
  font-size:11px;
}
.bet-panel.inline #bet-slider-value{
  font-size:15px;
}
.bet-panel.inline .bet-slider-meta,
.bet-panel.inline .bet-slider-actions,
.bet-panel.inline .bet-controls,
.bet-panel.inline .bet-loan,
.bet-panel.inline .bet-quick,
.bet-panel.inline .bet-settings{
  display:none !important;
}
.stats-panel{
  position:fixed;
  top:max(70px, calc(env(safe-area-inset-top, 0px) + 12px));
  right:max(14px, calc(env(safe-area-inset-right, 0px) + 12px));
  width:min(410px, calc(100vw - 28px));
  max-height:calc(var(--viewport-height) - 100px);
  z-index:75;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  overflow:hidden;
  transform: translateY(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease, transform 160ms ease;
  display:flex;
  flex-direction:column;
  touch-action:pan-y;
}
.stats-panel.open{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}
.stats-panel-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:12px 14px 10px;
  border-bottom:1px solid rgba(255,255,255,0.10);
  position:sticky;
  top:0;
  z-index:2;
  background:rgba(6,24,17,0.94);
}
.stats-panel-head .icon-btn{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:14px;
  font-size:28px;
  line-height:1;
  padding:0;
  position:relative;
  z-index:3;
}
.stats-panel-body{
  padding:12px;
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  overscroll-behavior:contain;
  max-height:calc(var(--viewport-height) - 170px);
}
.stats-panel .shoe{
  margin-top:0;
}
.stats-panel .advanced{
  margin-top:10px;
}
.shop-panel{
  position:fixed;
  top:max(70px, calc(env(safe-area-inset-top, 0px) + 12px));
  right:max(14px, calc(env(safe-area-inset-right, 0px) + 12px));
  width:min(520px, calc(100vw - 28px));
  max-height:calc(var(--viewport-height) - 100px);
  z-index:75;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  overflow:hidden;
  transform: translateY(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease, transform 160ms ease;
  display:flex;
  flex-direction:column;
  touch-action:pan-y;
}
.shop-panel.open{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.shop-panel .economy{
  margin-top:0;
}
.shop-panel .stats-panel-head{
  padding-right:18px;
}
.shop-panel .stats-panel-head .icon-btn{
  width:40px;
  height:40px;
  border-radius:14px;
  position:relative;
  z-index:2;
}
.shop-window .hud-skill{
  margin-top:10px;
}
.events-panel{
  position:fixed;
  top:max(70px, calc(env(safe-area-inset-top, 0px) + 12px));
  right:max(14px, calc(env(safe-area-inset-right, 0px) + 12px));
  width:min(430px, calc(100vw - 28px));
  max-height:calc(var(--viewport-height) - 100px);
  z-index:75;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  overflow:hidden;
  transform: translateY(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease, transform 160ms ease;
  display:flex;
  flex-direction:column;
  touch-action:pan-y;
}
.events-panel.open{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.events-history{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.events-history-row{
  border:1px solid rgba(255,255,255,0.16);
  border-radius:11px;
  background:rgba(0,0,0,0.24);
  padding:8px 9px;
  display:grid;
  gap:4px;
}
.events-history-time{
  font-size:10px;
  letter-spacing:0.04em;
  color:rgba(188,205,232,0.82);
  font-variant-numeric:tabular-nums;
}
.events-history-text{
  font-size:12px;
  color:rgba(255,255,255,0.94);
  line-height:1.32;
}
.events-empty{
  border:1px dashed rgba(255,255,255,0.2);
  border-radius:10px;
  padding:8px;
  font-size:11px;
  color:rgba(255,255,255,0.66);
}
.buffs-panel{
  position:fixed;
  top:max(70px, calc(env(safe-area-inset-top, 0px) + 12px));
  right:max(14px, calc(env(safe-area-inset-right, 0px) + 12px));
  width:min(460px, calc(100vw - 28px));
  max-height:calc(var(--viewport-height) - 100px);
  z-index:75;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  overflow:hidden;
  transform: translateY(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease, transform 160ms ease;
  display:flex;
  flex-direction:column;
  touch-action:pan-y;
}
.buffs-panel.open{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.buff-section{
  border:1px solid rgba(255,255,255,0.11);
  border-radius:12px;
  background:rgba(0,0,0,0.16);
  padding:10px;
}
.buff-section + .buff-section{
  margin-top:10px;
}
.buff-achievements-fold{
  margin-top:10px;
}
.buff-achievements-fold .advanced-sub-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.buff-achievements-fold .advanced-sub-summary strong{
  font-size:11px;
  color:rgba(255,255,255,0.72);
  font-weight:700;
}
.buff-achievements-fold .advanced-sub-body{
  padding:0 10px 10px;
}
.buff-section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}
.buff-section-head span{
  font-size:13px;
  font-weight:900;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
}
.buff-section-title{
  position:relative;
  padding-right:14px;
}
.buff-section-title.has-unread::after{
  content:"";
  position:absolute;
  top:1px;
  right:0;
  width:9px;
  height:9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.92);
  background:#ff3b30;
  box-shadow:
    0 0 0 2px rgba(255,59,48,0.22),
    0 2px 8px rgba(0,0,0,0.3);
  animation:fabUnreadPulse 1.25s ease-in-out infinite;
}
.buff-section-head strong{
  font-size:11px;
  color:rgba(255,255,255,0.7);
}
.buff-list,
.debuff-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.debuff-list{
  margin-top:8px;
}
.buff-row{
  border:1px solid rgba(255,255,255,0.12);
  border-radius:10px;
  background:rgba(0,0,0,0.2);
  padding:8px;
  display:grid;
  gap:4px;
}
.buff-row.positive{
  border-color:rgba(140,248,198,0.34);
}
.buff-row.negative{
  border-color:rgba(255,151,151,0.34);
}
.buff-row.achievement.unlocked{
  border-color:rgba(246,196,83,0.42);
}
.buff-row.achievement.locked{
  opacity:0.72;
}
.buff-row.loadout{
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:6px 10px;
}
.buff-row.loadout.selected{
  border-color:rgba(140,248,198,0.44);
  box-shadow:0 0 0 1px rgba(140,248,198,0.2) inset;
}
.buff-row.loadout .buff-main{
  min-width:0;
  display:grid;
  gap:4px;
}
.buff-name-line{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.buff-rarity-chip{
  font-size:10px;
  font-weight:900;
  letter-spacing:0.3px;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,0.26);
  border-radius:999px;
  padding:1px 6px;
  color:rgba(255,255,255,0.88);
  white-space:nowrap;
}
.buff-rarity-chip.common{
  border-color:rgba(157,252,199,0.56);
  color:#e2fff0;
}
.buff-rarity-chip.uncommon{
  border-color:rgba(167,220,255,0.58);
  color:#e6f6ff;
}
.buff-rarity-chip.rare{
  border-color:rgba(202,173,255,0.62);
  color:#f3ebff;
}
.buff-rarity-chip.legendary{
  border-color:rgba(225,159,255,0.68);
  color:#f8ecff;
}
.buff-toggle{
  align-self:center;
  white-space:nowrap;
}
.buff-name{
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,0.92);
}
.buff-meta{
  font-size:11px;
  color:rgba(255,255,255,0.74);
}
.buff-effect{
  font-size:11px;
  color:#ffe6ad;
  font-weight:700;
}
.buff-row.negative .buff-effect{
  color:#ffb9b9;
}
.buff-time{
  font-size:10px;
  color:rgba(255,255,255,0.66);
}
.buff-empty{
  border:1px dashed rgba(255,255,255,0.2);
  border-radius:10px;
  padding:8px;
  font-size:11px;
  color:rgba(255,255,255,0.65);
}
.music-panel{
  position:fixed;
  top:70px;
  right:14px;
  width:min(360px, calc(100vw - 28px));
  max-height:calc(var(--viewport-height) - 100px);
  z-index:75;
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.42);
  backdrop-filter: blur(10px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  overflow:hidden;

  transform: translateY(10px);
  opacity:0;
  pointer-events:none;
  transition:opacity 160ms ease, transform 160ms ease;
}
.music-panel.open{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}
.music-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  padding:12px 12px 10px;
  border-bottom:1px solid rgba(255,255,255,0.10);
}
.music-title{font-weight:900}
.music-sub{font-size:12px;color:var(--muted)}
.music-body{padding:12px}
.music-body audio{width:100%;margin-bottom:10px}
.music-mix-fold{
  margin-top:10px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:12px;
  background:rgba(0,0,0,0.2);
  overflow:hidden;
}
.music-mix-fold > summary{
  list-style:none;
  cursor:pointer;
  padding:10px 12px;
  font-size:12px;
  font-weight:800;
  letter-spacing:0.3px;
  color:rgba(255,255,255,0.9);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.music-mix-fold > summary::-webkit-details-marker{
  display:none;
}
.music-mix-fold > summary::after{
  content:"▾";
  transition:transform 140ms ease;
}
.music-mix-fold[open] > summary::after{
  transform:rotate(180deg);
}
.music-mix-fold .audio-mix{
  margin-top:0;
  padding:0 10px 10px;
}
.tracks{display:flex;flex-direction:column;gap:8px;max-height:40vh;overflow:auto;padding-right:4px}
.track{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  cursor:pointer;
}
.track:hover{background:rgba(0,0,0,0.26)}
.track.active{border-color:rgba(246,196,83,0.55);background:rgba(246,196,83,0.12)}
.track .name{font-weight:800}
.track .meta{font-size:12px;color:var(--muted)}
.music-hint{margin-top:10px;font-size:12px;color:var(--muted);line-height:1.4}

/* ===== Overlay / Modal ===== */
.overlay{
  position:fixed;
  inset:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,0.55);
  backdrop-filter: blur(6px);
}
.mission-overlay{
  align-items:flex-end;
  padding:8px 18px max(12px, env(safe-area-inset-bottom, 0px));
  background:transparent;
  backdrop-filter:none;
}
.modal.mission-modal{
  width:min(620px, calc(100vw - 28px));
  height:clamp(240px, 42vh, 320px);
  max-height:clamp(240px, 42vh, 320px);
  overflow-y:auto;
  overscroll-behavior:contain;
  border-color:rgba(246,196,83,0.42);
  background:#050505;
  backdrop-filter:none;
  box-shadow:
    0 24px 64px rgba(0,0,0,0.62),
    0 0 28px rgba(246,196,83,0.16);
}
.modal.mission-modal .shop-block,
.modal.mission-modal .momentum-panel{
  margin-top:10px;
  background:#101010;
  border-color:rgba(246,196,83,0.36);
}
.modal.active-buffs-modal .shop-block,
.modal.active-buffs-modal .momentum-panel{
  margin-top:10px;
  background:#101010;
  border-color:rgba(246,196,83,0.36);
}
.modal.mission-modal .momentum-progress-track{
  background:#0b0b0b;
}
.active-buffs-overlay{
  align-items:flex-end;
  padding:8px 18px max(12px, env(safe-area-inset-bottom, 0px));
  background:transparent;
  backdrop-filter:none;
}
.modal.active-buffs-modal{
  width:min(620px, calc(100vw - 28px));
  height:clamp(240px, 42vh, 320px);
  max-height:clamp(240px, 42vh, 320px);
  overflow-y:auto;
  overscroll-behavior:contain;
  background:#050505;
  border-color:rgba(246,196,83,0.42);
  backdrop-filter:none;
  box-shadow:
    0 24px 64px rgba(0,0,0,0.62),
    0 0 28px rgba(246,196,83,0.12);
}
.skilltree-overlay{
  align-items:center;
  padding:10px;
  background:rgba(0,0,0,0.58);
  backdrop-filter:blur(5px);
}
.modal.skilltree-modal{
  width:min(1180px, calc(100vw - 20px));
  height:min(calc(var(--viewport-height) - 20px), 860px);
  max-height:min(calc(var(--viewport-height) - 20px), 860px);
  overflow:hidden;
  overscroll-behavior:contain;
  display:flex;
  flex-direction:column;
  background:
    radial-gradient(140% 120% at 0% -10%, rgba(137,226,177,0.08), rgba(137,226,177,0) 56%),
    radial-gradient(160% 130% at 100% 0%, rgba(116,176,228,0.08), rgba(116,176,228,0) 58%),
    linear-gradient(180deg, #071410, #04100d 62%, #030c0a);
  border-color:rgba(180,231,206,0.34);
  backdrop-filter:none;
  box-shadow:
    0 24px 64px rgba(0,0,0,0.62),
    0 0 34px rgba(92,178,130,0.16);
}
.skilltree-meta{
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px 10px;
  flex-wrap:wrap;
  border:1px solid rgba(162,225,194,0.2);
  border-radius:14px;
  padding:8px 10px;
  background:rgba(8,24,18,0.5);
  font-size:12px;
  font-weight:800;
  color:rgba(228,246,237,0.94);
  line-height:1.35;
}
#skilltree-meta-text{
  flex:1 1 260px;
  min-width:180px;
}
#skilltree-buy-lp{
  flex:0 0 auto;
  white-space:nowrap;
}
.skilltree-tabs{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:2px;
  border:1px solid rgba(166,220,255,0.34);
  border-radius:999px;
  background:rgba(10,31,46,0.64);
}
.skilltree-tab{
  border:1px solid rgba(176,224,255,0.28);
  border-radius:999px;
  padding:7px 13px;
  background:rgba(38,85,120,0.58);
  color:rgba(232,247,255,0.94);
  font-size:12px;
  font-weight:900;
  letter-spacing:0.2px;
  cursor:pointer;
  transition:border-color 140ms ease, box-shadow 140ms ease, transform 120ms ease, color 120ms ease;
}
@media (hover: hover) and (pointer: fine){
  .skilltree-tab:hover{
    transform:translateY(-1px);
  }
}
.skilltree-tab:focus-visible{
  outline:2px solid rgba(246,196,83,0.76);
  outline-offset:2px;
}
.skilltree-tab.active{
  border-color:rgba(203,238,255,0.98);
  color:#072639;
  background:
    radial-gradient(150% 120% at 18% 0%, rgba(225,246,255,0.56), rgba(225,246,255,0) 56%),
    linear-gradient(180deg, rgba(169,224,255,0.98), rgba(123,196,241,0.98));
  box-shadow:
    0 0 0 1px rgba(241,251,255,0.52) inset,
    0 0 14px rgba(130,200,241,0.34);
}
.skilltree-list{
  margin-top:8px;
  position:relative;
  flex:1 1 auto;
  min-height:340px;
  border:1px solid rgba(255,255,255,0.13);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(7,20,16,0.96), rgba(3,9,7,0.98));
  overflow:auto;
  padding:14px;
  touch-action:pan-y;
  cursor:default;
  scrollbar-gutter:stable;
}
.skilltree-list.panning{
  cursor:default;
}
.skilltree-canvas{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:100%;
}
.skilltree-board{
  padding-bottom:8px;
}
.skilltree-tier{
  border:1px solid rgba(177,229,203,0.14);
  border-radius:16px;
  background:
    radial-gradient(130% 130% at 16% -6%, rgba(206,248,224,0.1), rgba(206,248,224,0) 54%),
    linear-gradient(180deg, rgba(17,38,30,0.84), rgba(8,24,19,0.9));
  padding:10px;
  box-shadow:
    0 8px 20px rgba(0,0,0,0.24),
    0 0 0 1px rgba(205,249,226,0.05) inset;
}
.skilltree-tier-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}
.skilltree-tier-title{
  font-size:12px;
  font-weight:900;
  letter-spacing:0.4px;
  color:rgba(228,248,237,0.95);
  text-transform:uppercase;
}
.skilltree-tier-count{
  font-size:10px;
  font-weight:800;
  color:rgba(200,235,219,0.78);
}
.skilltree-tier-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
  gap:14px;
}
.skilltree-node-item{
  --skill-node-shell-border: rgba(174,226,200,0.2);
  --skill-node-shell-bg:
    radial-gradient(150% 120% at 12% 0%, rgba(199,245,219,0.06), rgba(199,245,219,0) 56%),
    rgba(7,17,14,0.74);
  --skill-node-core-border: rgba(143,183,164,0.5);
  --skill-node-core-bg:
    radial-gradient(140% 120% at 22% 10%, rgba(210,249,228,0.18), rgba(210,249,228,0) 60%),
    linear-gradient(180deg, rgba(22,37,31,0.98), rgba(11,20,16,0.98));
  --skill-node-icon-border: rgba(192,236,214,0.36);
  --skill-node-icon-bg: rgba(15,41,31,0.72);
  --skill-node-icon-color: #e4f5eb;
  --skill-node-selected-border: rgba(149,226,191,0.82);
  --skill-node-selected-inset: rgba(211,255,234,0.24);
  --skill-node-selected-glow: rgba(132,217,173,0.2);
  --skill-node-core-selected-border: rgba(164,236,203,0.98);
  --skill-node-core-selected-inset: rgba(221,255,239,0.3);
  --skill-node-core-selected-glow: rgba(132,217,173,0.2);
  position:relative;
  transform:none;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  z-index:2;
  width:auto;
  min-height:92px;
  padding:10px;
  border:1px solid var(--skill-node-shell-border);
  border-radius:14px;
  background:var(--skill-node-shell-bg);
  box-shadow:
    0 8px 20px rgba(0,0,0,0.3),
    0 0 0 1px rgba(205,249,226,0.05) inset;
  transition:border-color 140ms ease, box-shadow 140ms ease, transform 120ms ease;
}
.skilltree-node-item.tier-low{
  --skill-node-shell-border: rgba(171,227,197,0.24);
  --skill-node-shell-bg:
    radial-gradient(145% 118% at 12% 0%, rgba(177,244,206,0.12), rgba(177,244,206,0) 58%),
    rgba(7,19,15,0.78);
  --skill-node-core-border: rgba(146,212,180,0.62);
  --skill-node-core-bg:
    radial-gradient(145% 125% at 20% 10%, rgba(203,249,225,0.2), rgba(203,249,225,0) 60%),
    linear-gradient(180deg, rgba(20,47,35,0.98), rgba(10,27,20,0.98));
  --skill-node-icon-border: rgba(172,236,204,0.54);
  --skill-node-icon-bg: rgba(15,56,37,0.78);
  --skill-node-icon-color: #e6fff2;
}
.skilltree-node-item.tier-mid{
  --skill-node-shell-border: rgba(168,219,255,0.44);
  --skill-node-shell-bg:
    radial-gradient(150% 124% at 12% 0%, rgba(183,230,255,0.28), rgba(183,230,255,0) 58%),
    rgba(20,49,72,0.78);
  --skill-node-core-border: rgba(181,224,255,0.88);
  --skill-node-core-bg:
    radial-gradient(145% 125% at 20% 10%, rgba(222,243,255,0.4), rgba(222,243,255,0) 60%),
    linear-gradient(180deg, rgba(69,133,181,0.95), rgba(43,96,144,0.95));
  --skill-node-icon-border: rgba(190,230,255,0.74);
  --skill-node-icon-bg: rgba(63,121,170,0.86);
  --skill-node-icon-color: #f7fcff;
  --skill-node-selected-border: rgba(186,228,255,0.96);
  --skill-node-selected-inset: rgba(231,247,255,0.42);
  --skill-node-selected-glow: rgba(149,206,244,0.36);
  --skill-node-core-selected-border: rgba(206,236,255,0.98);
  --skill-node-core-selected-inset: rgba(240,251,255,0.48);
  --skill-node-core-selected-glow: rgba(149,206,244,0.34);
}
.skilltree-node-item.tier-high{
  --skill-node-shell-border: rgba(198,156,255,0.32);
  --skill-node-shell-bg:
    radial-gradient(150% 124% at 12% 0%, rgba(209,162,255,0.16), rgba(209,162,255,0) 58%),
    rgba(20,10,30,0.82);
  --skill-node-core-border: rgba(210,172,255,0.72);
  --skill-node-core-bg:
    radial-gradient(145% 125% at 20% 10%, rgba(226,195,255,0.24), rgba(226,195,255,0) 60%),
    linear-gradient(180deg, rgba(61,33,93,0.98), rgba(34,18,53,0.98));
  --skill-node-icon-border: rgba(214,176,255,0.62);
  --skill-node-icon-bg: rgba(67,39,105,0.8);
  --skill-node-icon-color: #f7ebff;
  --skill-node-selected-border: rgba(212,171,255,0.9);
  --skill-node-selected-inset: rgba(244,227,255,0.28);
  --skill-node-selected-glow: rgba(201,147,255,0.28);
  --skill-node-core-selected-border: rgba(224,190,255,0.98);
  --skill-node-core-selected-inset: rgba(248,236,255,0.34);
  --skill-node-core-selected-glow: rgba(201,147,255,0.26);
}
.skilltree-node-item::before{
  display:none;
}
.skilltree-node-item.unlocked::before{
  display:none;
}
.skilltree-node-item.invested::before{
  display:none;
}
.skilltree-node-item.maxed::before{
  display:none;
}
.skilltree-node-item.locked::before{
  display:none;
}
.skilltree-node-item:hover{
  transform:translateY(-1px);
}
.skilltree-node-item.selected{
  border-color:var(--skill-node-selected-border);
  box-shadow:
    0 0 0 1px var(--skill-node-selected-inset) inset,
    0 0 0 2px var(--skill-node-selected-glow),
    0 12px 24px rgba(0,0,0,0.34);
}
.skilltree-node-core{
  width:100%;
  height:62px;
  border-radius:12px;
  border:2px solid var(--skill-node-core-border);
  background:var(--skill-node-core-bg);
  color:#e4f5eb;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  position:relative;
  padding:0 10px;
  transition:transform 130ms ease, border-color 130ms ease, box-shadow 130ms ease, filter 130ms ease;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.skilltree-node-core:hover{
  transform:translateY(-1px);
}
.skilltree-node-core:focus{
  outline:none;
}
.skilltree-node-core:focus-visible{
  outline:2px solid rgba(130,217,171,0.78);
  outline-offset:2px;
}
.skilltree-node-core:disabled{
  cursor:not-allowed;
  opacity:0.8;
}
.skilltree-node-item.selected .skilltree-node-core{
  transform:translateY(-1px);
  border-color:var(--skill-node-core-selected-border);
  box-shadow:
    0 0 0 1px var(--skill-node-core-selected-inset) inset,
    0 0 0 2px var(--skill-node-core-selected-glow);
}
.skilltree-node-item.invested .skilltree-node-core{
  border-color:rgba(122,205,245,0.86);
  box-shadow:
    0 0 0 1px rgba(206,242,255,0.2) inset,
    0 0 14px rgba(110,193,238,0.2);
}
.skilltree-node-item.maxed .skilltree-node-core{
  border-color:rgba(255,228,152,0.92);
  box-shadow:
    0 0 0 1px rgba(255,244,201,0.26) inset,
    0 0 22px rgba(246,196,83,0.28);
}
.skilltree-node-item.locked .skilltree-node-core{
  border-color:rgba(113,122,137,0.36);
  filter:saturate(0.55);
}
.skilltree-node-icon{
  font-size:18px;
  font-weight:900;
  letter-spacing:0.01em;
  text-align:center;
  text-transform:none;
  white-space:normal;
  line-height:1.15;
  width:100%;
  max-width:100%;
  min-height:0;
  padding:0 8px;
  margin:0 auto;
  border-radius:0;
  border:0;
  background:none;
  color:var(--skill-node-icon-color);
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.skilltree-node-level{
  position:absolute;
  right:6px;
  top:6px;
  min-width:28px;
  padding:2px 5px;
  border-radius:8px;
  border:1px solid rgba(176,229,201,0.42);
  background:rgba(12,41,30,0.88);
  color:#dbf6e7;
  font-size:10px;
  font-weight:800;
  text-align:center;
}
.skilltree-node-name{
  display:none;
}
.skilltree-node-preview{
  display:none;
}
.skilltree-node-state{
  display:none;
}
.skilltree-node-actions{
  display:none;
}
.skilltree-node-invest{
  display:none;
}
.skilltree-node-item.maxed .skilltree-node-invest{
  opacity:0.88;
}
.skilltree-node-state.is-locked{
  display:none;
}
.skilltree-node-state.is-ready{
  display:none;
}
.skilltree-node-state.is-expensive{
  display:none;
}
.skilltree-node-state.is-max{
  display:none;
}
.skilltree-node-state.is-active{
  display:none;
}
.skilltree-node-popover{
  position:sticky;
  top:8px;
  z-index:12;
  min-width:0;
  max-width:none;
  border:2px solid rgba(154,224,190,0.86);
  border-radius:12px;
  background:rgba(8,20,16,0.96);
  box-shadow:
    0 18px 32px rgba(0,0,0,0.6),
    0 0 24px rgba(125,208,167,0.22);
  padding:10px;
  margin-bottom:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  pointer-events:auto;
}
.skilltree-list.has-popover-overlay .skilltree-node-popover{
  position:absolute;
  margin-bottom:0;
}
.skilltree-list.has-popover-overlay .skilltree-board{
  pointer-events:none;
}
.skilltree-node-popover-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}
#skilltree-popover-title{
  font-size:13px;
  color:#ebfff4;
}
#skilltree-popover-level{
  font-size:11px;
  font-weight:800;
  color:#ccf6df;
}
.skilltree-node-popover-desc,
.skilltree-node-popover-effect,
.skilltree-node-popover-req{
  font-size:11px;
  color:rgba(224,245,235,0.9);
  line-height:1.35;
}
.skilltree-node-popover-req{
  color:rgba(198,241,219,0.95);
}
.skilltree-node-popover-actions{
  margin-top:2px;
  display:flex;
}
.skilltree-node-popover-actions .btn{
  width:100%;
}
.modal.active-buffs-modal .buff-section-head{
  margin-top:2px;
  margin-bottom:8px;
}
.modal.active-buffs-modal .buff-section-head span{
  color:rgba(255,235,186,0.92);
}
.modal.active-buffs-modal .buff-section-head strong{
  color:rgba(255,230,173,0.92);
}
.modal.active-buffs-modal .buff-row{
  background:#111111;
}
.modal.active-buffs-modal .buff-empty{
  background:#0e0e0e;
}
.hidden{display:none !important}
.modal{
  width:min(520px, 100%);
  border-radius:18px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(0,0,0,0.55);
  box-shadow:0 20px 60px rgba(0,0,0,0.55);
  padding:14px;
}
.modal.help{width:min(720px, 100%)}
.tutorial-overlay{
  --tutorial-focus-x:50vw;
  --tutorial-focus-y:42vh;
  --tutorial-focus-r:0px;
  --tutorial-modal-left:50vw;
  --tutorial-modal-top:50vh;
  z-index:88;
  background:rgba(0,0,0,0.64);
  backdrop-filter:none;
  overflow:hidden;
}
.tutorial-overlay.has-focus{
  background:
    radial-gradient(
      circle at var(--tutorial-focus-x) var(--tutorial-focus-y),
      rgba(0,0,0,0) 0,
      rgba(0,0,0,0) calc(var(--tutorial-focus-r) * 0.55),
      rgba(0,0,0,0.26) calc(var(--tutorial-focus-r) * 0.82),
      rgba(0,0,0,0.64) calc(var(--tutorial-focus-r) + 2px)
    ),
    rgba(0,0,0,0.64);
}
.tutorial-focus-ring{
  position:fixed;
  left:50%;
  top:42%;
  width:120px;
  height:80px;
  border-radius:16px;
  border:3px solid rgba(246,196,83,0.94);
  box-shadow:
    0 0 0 2px rgba(255,236,181,0.54),
    0 0 22px rgba(246,196,83,0.42);
  transform:translate(-50%, -50%);
  opacity:0;
  transition:
    left 220ms ease,
    top 220ms ease,
    width 220ms ease,
    height 220ms ease,
    opacity 180ms ease;
  pointer-events:none;
  z-index:0;
}
.tutorial-overlay.has-focus .tutorial-focus-ring{
  opacity:1;
}
.modal.tutorial-modal{
  width:min(540px, calc(100vw - 26px));
  position:fixed;
  left:var(--tutorial-modal-left);
  top:var(--tutorial-modal-top);
  transform:translate(-50%, -50%);
  margin:0;
  z-index:1;
  border:1px solid rgba(246,196,83,0.42);
  background:
    radial-gradient(120% 85% at 50% 0%, rgba(246,196,83,0.2), rgba(246,196,83,0) 64%),
    linear-gradient(180deg, rgba(7,27,19,0.96), rgba(4,15,10,0.95));
  box-shadow:
    0 24px 62px rgba(0,0,0,0.58),
    0 0 26px rgba(246,196,83,0.2);
  max-height:calc(var(--viewport-height) - 22px);
  overflow-y:auto;
  overscroll-behavior:contain;
}
.tutorial-meta{
  margin-top:8px;
  font-size:12px;
  font-weight:700;
  color:rgba(255,236,182,0.92);
}
.tutorial-actions .btn{
  min-width:110px;
}
.tutorial-target-highlight{
  box-shadow:
    0 0 0 3px rgba(246,196,83,0.92),
    0 0 0 6px rgba(255,239,186,0.32),
    0 0 20px rgba(246,196,83,0.28);
  filter:brightness(1.16);
}
.tutorial-target-highlight.hud-item,
.tutorial-target-highlight.fab{
  border-radius:999px;
}
.name-overlay{
  background:
    radial-gradient(90% 70% at 50% 0%, rgba(246,196,83,0.24), rgba(246,196,83,0) 70%),
    rgba(0,0,0,0.62);
  backdrop-filter: blur(9px) saturate(150%);
}
.name-modal{
  position:relative;
  width:min(540px, calc(100vw - 28px));
  border:1px solid rgba(246,196,83,0.46);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,0.16), rgba(255,255,255,0) 64%),
    linear-gradient(180deg, rgba(6,31,20,0.92), rgba(4,22,14,0.92));
  box-shadow:
    0 26px 60px rgba(0,0,0,0.58),
    0 0 34px rgba(246,196,83,0.2);
  animation:nameModalIn 360ms cubic-bezier(.16,.88,.2,1);
}
.name-modal::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  border:1px solid rgba(255,237,188,0.2);
  pointer-events:none;
}
.name-modal .modal-head{
  justify-content:center;
}
.name-modal h3{
  text-align:center;
}
.name-modal .modal-sub{
  text-align:center;
  color:rgba(255,255,255,0.88);
}
.name-prompt-form{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.name-prompt-label{
  font-size:12px;
  font-weight:800;
  color:rgba(255,255,255,0.86);
}
#name-input{
  width:100%;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.18);
  background:rgba(0,0,0,0.3);
  color:var(--text);
  font-size:16px;
  font-weight:700;
  letter-spacing:0.2px;
  outline:none;
}
#name-input::placeholder{
  color:rgba(255,255,255,0.45);
}
.name-prompt-hint{
  font-size:11px;
  color:rgba(255,255,255,0.72);
  min-height:14px;
}
.name-prompt-hint.error{
  color:#ffb7b7;
}
.name-legal-consent{
  margin-top:6px;
  border:1px solid rgba(255,255,255,0.16);
  border-radius:12px;
  background:rgba(0,0,0,0.24);
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.name-legal-checkbox{
  display:flex;
  align-items:flex-start;
  gap:8px;
  color:rgba(255,255,255,0.86);
  font-size:11px;
  line-height:1.45;
}
#name-legal-accept{
  margin-top:2px;
  width:16px;
  height:16px;
  flex:0 0 16px;
}
.name-storage-consent{
  border-top:1px solid rgba(255,255,255,0.1);
  margin-top:2px;
  padding-top:8px;
}
#name-storage-optin{
  margin-top:2px;
  width:16px;
  height:16px;
  flex:0 0 16px;
}
.name-legal-links{
  display:flex;
  align-items:center;
  gap:7px;
  font-size:11px;
}
.name-legal-links a{
  color:#fff0c3;
  text-decoration:underline;
  text-underline-offset:2px;
  font-weight:700;
}
.name-legal-links a:hover{
  color:#fff8e0;
}
.name-legal-hint{
  font-size:11px;
  color:rgba(255,255,255,0.68);
  min-height:14px;
}
.name-legal-hint.error{
  color:#ffb7b7;
}
.name-storage-hint{
  font-size:11px;
  color:rgba(255,255,255,0.68);
  min-height:14px;
}
.name-storage-hint.ok{
  color:#b8ffda;
}
.name-modal .modal-actions{
  margin-top:10px;
  justify-content:center;
}
@keyframes nameModalIn{
  0%{
    opacity:0;
    transform:translateY(16px) scale(0.93);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  letter-spacing:0.6px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(255,255,255,0.10);
}
.badge.win{border-color:rgba(110,231,183,0.45);background:rgba(110,231,183,0.12)}
.badge.lose{border-color:rgba(255,107,107,0.55);background:rgba(255,107,107,0.12)}
.badge.draw{border-color:rgba(255,255,255,0.20);background:rgba(255,255,255,0.10)}
.badge.neutral{
  border:4px solid rgba(246,196,83,0.98);
  background:rgba(34,26,8,0.46);
  color:#fff2c6;
  text-shadow:0 1px 0 rgba(59,39,4,0.6);
  box-shadow:
    inset 0 0 0 1px rgba(255,242,191,0.50),
    0 0 0 2px rgba(246,196,83,0.35),
    0 8px 20px rgba(0,0,0,0.30);
}
.modal h3{margin:6px 0 6px;font-size:20px}
.modal-sub{color:rgba(255,255,255,0.86);line-height:1.5}
.modal-economy{
  margin-top:4px;
  font-size:12px;
  font-weight:800;
  color:rgba(255,255,255,0.82);
  font-variant-numeric:tabular-nums;
}
.modal-economy.up{color:#baffdc}
.modal-economy.down{color:#ffd1d1}
.modal-economy.even{color:#fff3ce}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.help-body ul{margin-top:8px}
.help-body li{margin:6px 0}

#overlay .modal{
  position:fixed;
  left:50%;
  top:var(--result-center-y, 45vh);
  width:min(560px, calc(100vw - 28px));
  transform:translate(-50%, -50%);
  text-align:center;
  cursor:default;
  border:2px solid rgba(255,255,255,0.32);
  border-radius:22px;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,0.18), rgba(255,255,255,0) 60%),
    linear-gradient(180deg, rgba(6,18,15,0.76), rgba(8,20,18,0.66));
  box-shadow:
    0 30px 70px rgba(0,0,0,0.55),
    0 0 0 1px rgba(255,255,255,0.10) inset;
  backdrop-filter: blur(8px) saturate(135%);
  padding:14px 16px 12px;
  animation:resultBoxIn 320ms cubic-bezier(.17,.84,.24,1);
}
#overlay .modal-head{
  justify-content:center;
  margin-bottom:6px;
  position:static;
}
#overlay #result-close{
  display:none;
}
#overlay .badge{
  padding:8px 12px;
  font-size:12px;
  font-weight:900;
  letter-spacing:0.16em;
  border-width:2px;
  border-style:solid;
  border-radius:999px;
  text-shadow:none;
}
#overlay .badge.win{
  color:#bcffd8;
  border-color:rgba(110,231,183,0.82);
  background:rgba(30,124,84,0.34);
  box-shadow:
    0 0 0 1px rgba(163,255,221,0.36) inset,
    0 0 22px rgba(110,231,183,0.25);
}
#overlay .badge.lose{
  color:#ffd0d0;
  border-color:rgba(255,107,107,0.86);
  background:rgba(140,32,32,0.38);
  box-shadow:
    0 0 0 1px rgba(255,180,180,0.28) inset,
    0 0 22px rgba(255,107,107,0.22);
}
#overlay .badge.draw{
  color:#fff0c2;
  border-color:rgba(246,196,83,0.84);
  background:rgba(133,100,28,0.34);
  box-shadow:
    0 0 0 1px rgba(255,236,175,0.30) inset,
    0 0 22px rgba(246,196,83,0.22);
}
#result-title{
  display:block;
  margin:2px 0 6px;
  font-size:clamp(58px, 14vw, 138px);
  line-height:0.92;
  font-weight:1000;
  letter-spacing:0.12em;
  text-transform:uppercase;
  font-family:"Arial Black","Segoe UI",system-ui,sans-serif;
  animation:resultTextIn 360ms cubic-bezier(.16,.86,.24,1);
}
#overlay .modal-sub{
  display:block;
  margin:0 0 4px;
  font-size:clamp(28px, 7vw, 56px);
  line-height:0.95;
  font-weight:1000;
  letter-spacing:0.05em;
  font-variant-numeric:tabular-nums;
  font-family:"Arial Black","Segoe UI",system-ui,sans-serif;
  text-transform:uppercase;
  transform-origin:50% 50%;
  animation:resultAmountSpin 760ms cubic-bezier(.16,.88,.2,1);
}
#overlay .modal-sub.up{
  color:#c8ffe5;
  text-shadow:
    0 2px 0 rgba(10,56,35,0.75),
    0 0 18px rgba(110,231,183,0.45);
}
#overlay .modal-sub.down{
  color:#ffd6d6;
  text-shadow:
    0 2px 0 rgba(79,19,19,0.76),
    0 0 18px rgba(255,107,107,0.45);
}
#overlay .modal-sub.even{
  color:#fff3ce;
  text-shadow:
    0 2px 0 rgba(82,62,17,0.74),
    0 0 16px rgba(246,196,83,0.42);
}
#overlay .modal-economy{
  display:block;
  margin:2px 0 0;
  font-size:clamp(12px, 2.6vw, 17px);
  letter-spacing:0.08em;
  text-transform:uppercase;
  font-weight:900;
}
#overlay .modal-economy.up{
  color:#c8ffe5;
  text-shadow:0 0 12px rgba(110,231,183,0.35);
}
#overlay .modal-economy.down{
  color:#ffd6d6;
  text-shadow:0 0 12px rgba(255,107,107,0.35);
}
#overlay .modal-economy.even{
  color:#fff3ce;
  text-shadow:0 0 10px rgba(246,196,83,0.32);
}
#overlay .modal-actions{
  display:none;
}
#overlay{
  background:transparent;
  backdrop-filter:none;
  pointer-events:none;
}

#overlay[data-result-kind="win"] .modal{
  border-color:rgba(137,255,205,0.70);
  box-shadow:
    0 28px 64px rgba(0,0,0,0.52),
    0 0 30px rgba(110,231,183,0.22),
    0 0 0 1px rgba(146,255,212,0.28) inset;
}
#overlay[data-result-kind="lose"] .modal{
  border-color:rgba(255,145,145,0.68);
  box-shadow:
    0 28px 64px rgba(0,0,0,0.52),
    0 0 28px rgba(255,107,107,0.20),
    0 0 0 1px rgba(255,188,188,0.22) inset;
}
#overlay[data-result-kind="draw"] .modal{
  border-color:rgba(255,221,138,0.70);
  box-shadow:
    0 28px 64px rgba(0,0,0,0.52),
    0 0 28px rgba(246,196,83,0.20),
    0 0 0 1px rgba(255,238,183,0.26) inset;
}

#overlay[data-result-kind="win"] #result-title{
  color:#baffdc;
  text-shadow:
    0 2px 0 rgba(11,49,34,0.72),
    0 0 22px rgba(110,231,183,0.46),
    0 0 45px rgba(74,224,160,0.34);
}
#overlay[data-result-kind="lose"] #result-title{
  color:#ffd1d1;
  text-shadow:
    0 2px 0 rgba(70,20,20,0.72),
    0 0 22px rgba(255,107,107,0.42),
    0 0 45px rgba(224,74,74,0.30);
}
#overlay[data-result-kind="draw"] #result-title{
  color:#fff1c6;
  text-shadow:
    0 2px 0 rgba(77,58,16,0.70),
    0 0 20px rgba(246,196,83,0.42),
    0 0 42px rgba(236,182,64,0.32);
}

@keyframes resultBoxIn{
  0%{
    opacity:0;
    transform:translate(-50%, calc(-50% + 16px)) scale(0.86);
    filter:blur(2px) saturate(1.1);
  }
  100%{
    opacity:1;
    transform:translate(-50%, -50%) scale(1);
    filter:blur(0) saturate(1);
  }
}
@keyframes resultTextIn{
  0%{
    opacity:0;
    transform:translateY(12px) scale(0.9);
    letter-spacing:0.22em;
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
    letter-spacing:0.12em;
  }
}
@keyframes resultAmountSpin{
  0%{
    opacity:0;
    transform:translateY(14px) rotateX(64deg) scale(0.74);
    filter:blur(1px);
  }
  55%{
    opacity:1;
    transform:translateY(-1px) rotateX(-8deg) scale(1.04);
    filter:blur(0);
  }
  100%{
    opacity:1;
    transform:translateY(0) rotateX(0) scale(1);
    filter:blur(0);
  }
}
@keyframes resultPulse{
  0%,100%{transform:translate(-50%, -50%) scale(1)}
  50%{transform:translate(-50%, -50%) scale(1.012)}
}
@keyframes neonFlicker{
  0%,100%{opacity:1}
  42%{opacity:0.96}
  46%{opacity:0.88}
  52%{opacity:0.98}
  58%{opacity:0.92}
  64%{opacity:1}
}

/* ===== Win/Loss flashes ===== */
@keyframes winflash{
  0%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
  35%{
    box-shadow:
      0 0 0 1px rgba(149,255,214,0.28) inset,
      0 20px 38px rgba(0,0,0,0.40),
      0 0 10px rgba(110,231,183,0.16);
    filter:brightness(1.04);
  }
  100%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
}
@keyframes loseflash{
  0%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
  35%{
    box-shadow:
      0 0 0 1px rgba(255,184,184,0.24) inset,
      0 20px 38px rgba(0,0,0,0.40),
      0 0 10px rgba(255,107,107,0.16);
    filter:brightness(1.03);
  }
  100%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
}
.table.win-bonus-flash > section.area{
  animation:winBonusFlash 720ms cubic-bezier(.16,.84,.24,1);
}
@keyframes winBonusFlash{
  0%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
  34%{
    box-shadow:
      0 0 0 2px rgba(255,150,150,0.24) inset,
      0 20px 38px rgba(0,0,0,0.40),
      0 0 16px rgba(255,122,122,0.22);
    filter:brightness(1.05);
  }
  100%{
    box-shadow:var(--shadow);
    filter:brightness(1);
  }
}
.table.win-anim > section.area{animation:winflash 520ms ease}
.table.lose-anim > section.area{animation:loseflash 520ms ease}
.table.shake{animation:none}
@media (max-width: 780px){
  .table.win-anim > section.area,
  .table.lose-anim > section.area{
    animation:none !important;
  }
}

body.bonus-round-active .table,
body.boss-round-active .table{
  position:relative;
  isolation:isolate;
}
body.bonus-round-active .table > section,
body.boss-round-active .table > section{
  position:relative;
  z-index:1;
}
body.bonus-round-active .table::before{
  content:"";
  position:absolute;
  inset:4px 4px 8px;
  border-radius:22px;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255,224,143,0.26), rgba(255,224,143,0) 58%),
    repeating-linear-gradient(
      135deg,
      rgba(255,221,132,0.12) 0 12px,
      rgba(150,108,24,0.08) 12px 24px
    ),
    linear-gradient(180deg, rgba(86,62,16,0.70), rgba(48,32,6,0.78));
  box-shadow:
    inset 0 0 0 1px rgba(255,229,165,0.26),
    inset 0 0 34px rgba(255,196,80,0.20);
}
body.boss-round-active .table::before{
  content:"";
  position:absolute;
  inset:4px 4px 8px;
  border-radius:22px;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 36% 36%, rgba(240,240,240,0.16) 0 22px, rgba(0,0,0,0) 24px),
    radial-gradient(circle at 64% 36%, rgba(240,240,240,0.16) 0 22px, rgba(0,0,0,0) 24px),
    radial-gradient(ellipse at 50% 56%, rgba(240,240,240,0.14) 0 16px, rgba(0,0,0,0) 18px),
    radial-gradient(ellipse at 50% 40%, rgba(242,242,242,0.10) 0 88px, rgba(0,0,0,0) 90px),
    repeating-linear-gradient(
      135deg,
      rgba(180,28,28,0.13) 0 12px,
      rgba(0,0,0,0) 12px 24px
    ),
    linear-gradient(180deg, rgba(12,12,12,0.86), rgba(0,0,0,0.92));
  box-shadow:
    inset 0 0 0 1px rgba(255,94,94,0.22),
    inset 0 0 34px rgba(255,94,94,0.16);
}
body.boss-round-active .table::after{
  content:"☠";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  font-size:clamp(68px, 11vw, 126px);
  font-weight:900;
  letter-spacing:0.02em;
  color:rgba(255,255,255,0.12);
  text-shadow:0 0 24px rgba(255,116,116,0.26);
  pointer-events:none;
  z-index:0;
}

body.bonus-round-active::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:63;
  background:
    radial-gradient(68% 62% at 50% 34%, rgba(255,245,200,0.14), rgba(255,245,200,0) 68%),
    linear-gradient(135deg, rgba(255,162,162,0.07), rgba(255,195,120,0.08), rgba(255,162,162,0.07));
  animation:bonusOverlayPulse 1150ms ease-in-out infinite;
}
body.bonus-round-active .table > section.area,
body.bonus-round-active .controls,
body.bonus-round-active .bet-panel.inline,
body.bonus-round-active .status{
  border-color:rgba(246,196,83,0.88);
  box-shadow:
    0 0 0 2px rgba(246,196,83,0.52) inset,
    0 0 0 1px rgba(255,236,170,0.84),
    0 0 22px rgba(246,196,83,0.26);
  animation:bonusUiBlink 920ms ease-in-out infinite;
}
body.bonus-round-active .table > section.area{
  background:linear-gradient(180deg, rgba(110,82,21,0.58), rgba(49,34,6,0.76));
}
body.boss-round-active::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:62;
  background:
    radial-gradient(74% 60% at 50% 30%, rgba(255,170,170,0.16), rgba(255,170,170,0) 70%),
    linear-gradient(145deg, rgba(255,84,84,0.08), rgba(255,128,128,0.10), rgba(255,84,84,0.08));
  animation:none;
}
body.boss-round-active .table > section.area,
body.boss-round-active .controls,
body.boss-round-active .bet-panel.inline,
body.boss-round-active .status{
  position:relative;
  isolation:isolate;
  border-color:rgba(255,86,86,0.96);
  box-shadow:
    0 0 0 2px rgba(255,86,86,0.56) inset,
    0 0 0 1px rgba(255,221,221,0.76),
    0 0 18px rgba(255,86,86,0.24);
  animation:none;
}
body.boss-round-active .table > section.area{
  background:linear-gradient(180deg, rgba(26,26,26,0.80), rgba(8,8,8,0.90));
}
body.boss-round-active .table > section.area::before,
body.boss-round-active .controls::before,
body.boss-round-active .bet-panel.inline::before,
body.boss-round-active .status::before{
  content:none !important;
}
body.boss-round-active .bet-panel.inline{
  pointer-events:auto;
}
@keyframes bossFramePulse{
  0%{
    border-color:rgba(255,86,86,0.94);
    box-shadow:
      0 0 0 1px rgba(255,221,221,0.72) inset,
      0 0 16px rgba(255,86,86,0.30);
    opacity:0.92;
  }
  45%{
    border-color:rgba(255,116,116,1);
    box-shadow:
      0 0 0 1px rgba(255,236,236,0.84) inset,
      0 0 24px rgba(255,108,108,0.40);
    opacity:1;
  }
  100%{
    border-color:rgba(255,86,86,0.94);
    box-shadow:
      0 0 0 1px rgba(255,221,221,0.72) inset,
      0 0 16px rgba(255,86,86,0.30);
    opacity:0.92;
  }
}
@keyframes bossOverlayPulse{
  0%{
    opacity:0.2;
  }
  44%{
    opacity:0.62;
  }
  100%{
    opacity:0.24;
  }
}
@keyframes bonusUiBlink{
  0%{
    box-shadow:
      0 0 0 2px rgba(246,196,83,0.52) inset,
      0 0 0 1px rgba(255,236,170,0.84),
      0 0 22px rgba(246,196,83,0.26);
    border-color:rgba(246,196,83,0.88);
  }
  46%{
    box-shadow:
      0 0 0 3px rgba(255,212,122,0.72) inset,
      0 0 0 1px rgba(255,245,196,0.9),
      0 0 30px rgba(255,193,90,0.32);
    border-color:rgba(255,224,138,0.95);
  }
  100%{
    box-shadow:
      0 0 0 2px rgba(246,196,83,0.52) inset,
      0 0 0 1px rgba(255,236,170,0.84),
      0 0 22px rgba(246,196,83,0.26);
    border-color:rgba(246,196,83,0.88);
  }
}
@keyframes bonusOverlayPulse{
  0%{
    opacity:0.18;
  }
  44%{
    opacity:0.62;
  }
  100%{
    opacity:0.2;
  }
}
#hud-currency-ruf.bonus-ruf-pop{
  border-color:rgba(255,162,162,0.9);
  animation:rufPop 780ms cubic-bezier(.16,.84,.24,1);
}
#hud-currency-ruf.bonus-ruf-pop .hud-value{
  color:#ffd4d4;
  animation:rufPopValue 780ms cubic-bezier(.16,.84,.24,1);
}
@keyframes rufPop{
  0%{
    transform:translateY(0) scale(1);
    box-shadow:0 6px 18px rgba(0,0,0,0.25);
  }
  40%{
    transform:translateY(-2px) scale(1.045);
    box-shadow:
      0 0 0 2px rgba(255,162,162,0.34),
      0 0 18px rgba(255,122,122,0.3),
      0 12px 24px rgba(66,17,17,0.34);
  }
  100%{
    transform:translateY(0) scale(1);
    box-shadow:0 6px 18px rgba(0,0,0,0.25);
  }
}
@keyframes rufPopValue{
  0%{
    letter-spacing:0;
    text-shadow:0 2px 10px rgba(0,0,0,0.55);
  }
  36%{
    letter-spacing:0.02em;
    text-shadow:0 0 16px rgba(255,160,160,0.46), 0 2px 10px rgba(0,0,0,0.55);
  }
  100%{
    letter-spacing:0;
    text-shadow:0 2px 10px rgba(0,0,0,0.55);
  }
}

/* ===== Blackjack special ===== */
body.blackjack-anim::before{
  content:none;
}
body.blackjack-anim::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:87;
  pointer-events:none;
  background:
    radial-gradient(55% 45% at 50% 34%, rgba(246,196,83,0.30), rgba(246,196,83,0) 65%),
    linear-gradient(120deg, rgba(255,255,255,0) 35%, rgba(255,247,210,0.32) 50%, rgba(255,255,255,0) 65%);
  animation:bjFlash 900ms ease;
}
/* extra emphasis on player's box during natural blackjack */
.area.bj-celebrate{
  border-color:rgba(246,196,83,0.90);
  box-shadow:
    0 0 0 2px rgba(246,196,83,0.30),
    0 20px 44px rgba(0,0,0,0.40);
  animation:bjAreaPulse 980ms cubic-bezier(.18,.82,.2,1);
}
@keyframes bjAreaPulse{
  0%{transform:translateY(0) scale(1)}
  35%{transform:translateY(-2px) scale(1.01)}
  100%{transform:translateY(0) scale(1)}
}
@keyframes bjTitle{
  0%{opacity:0;transform:translate(-50%, 14px) scale(0.88)}
  22%{opacity:1;transform:translate(-50%, 0) scale(1.02)}
  68%{opacity:1;transform:translate(-50%, -2px) scale(1)}
  100%{opacity:0;transform:translate(-50%, -8px) scale(0.97)}
}
@keyframes bjFlash{
  0%{opacity:0}
  24%{opacity:1}
  100%{opacity:0}
}

/* ===== Footer ===== */
.footer{
  margin-top:10px;
  padding:16px 16px 26px;
  color:rgba(255,255,255,0.70);
  text-align:center;
  font-size:12px;
  border-top:none;
  background:transparent;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}
.footer-legal-links{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
}
.footer-link{
  color:#fff2c6;
  text-decoration:underline;
  text-underline-offset:2px;
  font-weight:700;
}
.footer-link:hover{
  color:#fff7de;
}
.footer-link-sep{
  color:rgba(255,255,255,0.45);
}

/* Touch devices: let HUD scroll naturally */
@media (hover: none) and (pointer: coarse){
  .topbar{
    position:relative;
  }
}

/* ===== Mobile: keep controls reachable ===== */
@media (max-width: 780px){
  body::after{
    content:"";
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    height:calc(env(safe-area-inset-bottom, 0px) + 16px);
    background:var(--mobile-bottom-fill);
    z-index:60;
    pointer-events:none;
  }
  .topbar{
    position:sticky;
    flex-wrap:nowrap;
    align-items:center;
    justify-content:flex-start;
    padding:8px 10px 18px;
    gap:8px;
    background:linear-gradient(180deg, rgba(7,33,22,0.98), rgba(9,39,26,0.98));
    box-shadow:none;
    backdrop-filter:none;
  }
  .heatbar{
    left:10px;
    right:10px;
    bottom:4px;
    height:4px;
  }
  body.table-theme-sapphire .topbar{
    background:linear-gradient(180deg, rgba(12,42,76,0.98), rgba(11,35,63,0.98));
    border-bottom-color:rgba(173,220,255,0.36);
  }
  body.table-theme-crimson .topbar{
    background:linear-gradient(180deg, rgba(74,22,22,0.98), rgba(56,18,18,0.98));
    border-bottom-color:rgba(255,183,183,0.34);
  }
  body.table-theme-obsidian .topbar{
    background:linear-gradient(180deg, rgba(36,36,36,0.98), rgba(24,24,24,0.98));
    border-bottom-color:rgba(255,255,255,0.22);
  }
  body.table-theme-diamond .topbar{
    background:linear-gradient(180deg, rgba(68,54,22,0.98), rgba(45,35,14,0.98));
    border-bottom-color:rgba(255,225,156,0.3);
  }
  .brand{
    min-width:0;
    gap:8px;
    flex:0 0 auto;
  }
  .title{
    font-size:15px;
    letter-spacing:0.2px;
  }
  .subtitle{
    display:none;
  }
  .hud{
    --hud-box-min-height:38px;
    --hud-box-pad-y:6px;
    --hud-box-pad-x:7px;
    --hud-box-radius:10px;
    --hud-box-gap:8px;
    width:auto;
    flex:1 1 auto;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:5px;
  }
  .hud.ticker-active{
    display:flex;
    width:100%;
    padding:0;
  }
  .hud-event-ticker{
    grid-column:1 / -1;
    min-height:var(--hud-box-min-height);
    border-radius:var(--hud-box-radius);
    padding:var(--hud-box-pad-y) var(--hud-box-pad-x);
    background:#000;
    border-color:#000;
  }
  .hud-event-ticker-track{
    font-size:12px;
    letter-spacing:0.05em;
  }
  .hud-item{
    flex:0 0 auto;
    min-width:0;
    border-radius:var(--hud-box-radius);
    padding:var(--hud-box-pad-y) var(--hud-box-pad-x);
    gap:var(--hud-box-gap);
  }
  .hud-label{
    font-size:9px;
    gap:4px;
    margin-bottom:0;
  }
  .hud-label-icon{
    font-size:14px;
  }
  .hud-value{
    font-size:13px;
  }
  .table{
    padding-top:6px;
    padding-bottom:calc(236px + env(safe-area-inset-bottom, 0px));
    gap:6px;
  }
  body.boss-round-active .table{
    padding-bottom:calc(372px + env(safe-area-inset-bottom, 0px));
  }
  body.boss-round-active .panel{
    overflow:visible;
  }
  body.boss-round-active .bet-panel.inline{
    margin-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    z-index:63;
  }
  body.boss-round-active .bet-panel.inline .bet-slider{
    touch-action:pan-x;
  }
  body.boss-round-active .controls{
    z-index:68;
    bottom:calc(10px + env(safe-area-inset-bottom, 0px));
  }
  body.boss-round-active .status{
    display:none;
  }
  .bet-panel.inline{
    margin-top:0;
    min-height:86px;
  }
  .bet-panel.inline .bet-panel-body{
    padding:7px;
    min-height:72px;
  }
  .bet-panel.inline.round-hidden:not(.status-message){
    display:block !important;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
  }
  .bet-panel.inline .bet-slider-box{
    padding:6px 7px;
  }
  .bet-panel.inline .bet-slider-head{
    margin-bottom:4px;
    font-size:10px;
  }
  .bet-panel.inline #bet-slider-value{
    font-size:14px;
  }
  .area{
    padding:7px;
  }
  .area-head{
    gap:8px;
    margin-bottom:7px;
  }
  .area h2{
    font-size:14px;
  }
  .pill{
    padding:5px 8px;
    font-size:11px;
    border-width:3px;
  }
  .pill.small{
    padding:4px 7px;
    font-size:10px;
    border-width:2px;
  }
  .hand{
    min-height:68px;
    gap:var(--hand-gap, 5px);
  }
  .card{
    width:var(--card-width, 62px);
  }
  #overlay .modal{
    width:min(420px, calc(100vw - 20px));
    padding:12px 12px 10px;
  }
  #help-overlay{
    align-items:flex-start;
    overflow-y:auto;
    padding:calc(10px + env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px));
  }
  #help-overlay .modal.help{
    width:min(720px, calc(100vw - 20px));
    max-height:calc(var(--viewport-height) - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  #tutorial-overlay{
    align-items:flex-end;
    padding:10px 10px calc(12px + env(safe-area-inset-bottom, 0px));
  }
  #tutorial-overlay .tutorial-modal{
    width:min(560px, calc(100vw - 20px));
  }
  .tutorial-focus-ring{
    border-width:2px;
    border-radius:14px;
  }
  #mission-overlay,
  #active-buffs-overlay{
    align-items:flex-end;
    overflow-y:auto;
    padding:8px 10px calc(12px + env(safe-area-inset-bottom, 0px));
  }
  #skilltree-overlay{
    align-items:center;
    padding:6px;
  }
  #mission-overlay .mission-modal,
  #active-buffs-overlay .active-buffs-modal{
    width:min(640px, calc(100vw - 20px));
    height:min(46svh, calc(var(--viewport-height) - 24px - env(safe-area-inset-bottom, 0px)));
    max-height:min(46svh, calc(var(--viewport-height) - 24px - env(safe-area-inset-bottom, 0px)));
  }
  #skilltree-overlay .skilltree-modal{
    width:calc(100vw - 12px);
    height:calc(var(--viewport-height) - 12px - env(safe-area-inset-bottom, 0px));
    max-height:calc(var(--viewport-height) - 12px - env(safe-area-inset-bottom, 0px));
  }
  .skilltree-tabs{
    gap:6px;
  }
  .skilltree-tab{
    padding:6px 10px;
    font-size:11px;
  }
  .skilltree-list{
    min-height:0;
    padding:10px;
  }
  .skilltree-tier{
    padding:8px;
  }
  .skilltree-tier-grid{
    grid-template-columns:1fr;
    gap:10px;
  }
  .skilltree-tier-title{
    font-size:11px;
  }
  .skilltree-tier-count{
    font-size:10px;
  }
  .skilltree-node-item{
    min-height:82px;
    padding:7px;
  }
  .skilltree-node-core{
    height:50px;
    padding:0 8px;
  }
  .skilltree-node-icon{
    font-size:13px;
    letter-spacing:0.06px;
    text-align:center;
    padding:0 6px;
  }
  .skilltree-node-preview{
    display:none;
  }
  .skilltree-node-state{
    display:none;
  }
  .skilltree-node-invest{
    display:none;
  }
  .skilltree-node-popover{
    max-height:calc(100% - 16px);
    overflow:auto;
    overscroll-behavior:contain;
    padding:8px;
    gap:5px;
    box-shadow:
      0 22px 36px rgba(0,0,0,0.68),
      0 0 28px rgba(125,208,167,0.2);
  }
  .skilltree-list.has-popover-overlay .skilltree-board{
    opacity:0.35;
    filter:blur(1.6px);
  }
  #skilltree-popover-title{
    font-size:12px;
  }
  #skilltree-popover-level{
    font-size:10px;
  }
  .skilltree-node-popover-desc,
  .skilltree-node-popover-effect,
  .skilltree-node-popover-req{
    font-size:10px;
  }
  #help-overlay .modal-head{
    position:sticky;
    top:0;
    z-index:3;
    margin-bottom:8px;
    padding-bottom:8px;
    background:rgba(4,20,14,0.94);
  }
  #help-overlay #help-close{
    width:40px;
    height:40px;
    flex:0 0 40px;
  }
  .name-modal{
    width:min(420px, calc(100vw - 20px));
    padding:12px;
  }
  #name-input{
    font-size:15px;
  }
  .name-legal-checkbox{
    font-size:10px;
  }
  .name-legal-links,
  .name-legal-hint{
    font-size:10px;
  }
  #result-title{
    font-size:clamp(46px, 18vw, 92px);
  }
  #overlay .modal-sub{
    font-size:clamp(24px, 10vw, 42px);
  }
  #overlay .modal-economy{
    font-size:clamp(11px, 3.2vw, 14px);
  }
  .handwrap{
    padding:6px;
  }
  .panel-actions{
    align-items:flex-start;
  }
  .panel{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    z-index:1;
    margin:0;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    padding-bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  }
  .panel-actions{
    gap:0;
  }
  .controls{
    position:fixed;
    left:50%;
    right:auto;
    width:min(calc(100vw - 32px), 1048px);
    transform:translateX(-50%);
    bottom:calc(12px + env(safe-area-inset-bottom, 0px));
    z-index:64;
    flex:1 1 auto;
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:4px;
    padding:6px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,0.18);
    background:linear-gradient(180deg, rgba(5,33,22,0.96), rgba(4,23,16,0.96));
    box-shadow:0 14px 30px rgba(0,0,0,0.42);
    backdrop-filter:none;
  }
  body.table-theme-sapphire .controls{
    background:linear-gradient(180deg, rgba(11,34,63,0.96), rgba(8,26,48,0.96));
    border-color:rgba(173,220,255,0.34);
  }
  body.table-theme-crimson .controls{
    background:linear-gradient(180deg, rgba(57,20,20,0.96), rgba(44,16,16,0.96));
    border-color:rgba(255,183,183,0.32);
  }
  body.table-theme-obsidian .controls{
    background:linear-gradient(180deg, rgba(29,29,29,0.96), rgba(20,20,20,0.96));
    border-color:rgba(255,255,255,0.24);
  }
  body.table-theme-diamond .controls{
    background:linear-gradient(180deg, rgba(64,49,18,0.96), rgba(44,33,12,0.96));
    border-color:rgba(255,225,156,0.3);
  }
  .controls .btn{
    flex:0 0 auto;
    min-width:0;
    text-align:center;
    min-height:34px;
    padding:6px 4px;
    font-size:9px;
  }
  #deal{
    min-width:0;
    font-size:11px;
  }
  #deal{
    grid-column:span 2;
  }
  .status{
    display:block;
    margin-top:8px;
    margin-bottom:calc(140px + env(safe-area-inset-bottom, 0px));
    padding:7px 10px;
    border-radius:12px;
    font-size:12px;
    line-height:1.25;
    min-height:64px;
    max-height:112px;
    overflow:auto;
  }
  .status .status-result-badge{
    width:30px;
    height:30px;
    border-radius:10px;
    font-size:16px;
  }
  .status .status-result-label{
    font-size:9px;
    letter-spacing:1.2px;
  }
  .status .status-result-value{
    font-size:clamp(18px, 6vw, 24px);
  }
  .status .status-result-extra{
    font-size:11px;
  }
  .bet-status{
    min-height:66px;
    padding:10px 11px;
    font-size:14px;
    line-height:1.24;
  }
  .bet-slider-meta{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }
  .bet-controls{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
  .bet-loan{
    flex-direction:column;
    align-items:stretch;
    gap:6px;
  }
  .panel-tools{
    flex-direction:column;
    align-items:stretch;
  }
  .tool-actions{
    flex:1 1 auto;
  }
  .tool-actions .btn{
    flex:1 1 120px;
  }
  .rules-test-status{
    width:100%;
    justify-content:center;
  }
  .shoe{
    min-width:0;
  }
  .shop-app-grid{
    gap:8px;
  }
  .shop-app{
    min-width:82px;
    padding:7px 8px;
    gap:4px;
  }
  .shop-app-icon{
    font-size:14px;
  }
  .shop-app-label{
    font-size:10px;
  }
  .shop-window{
    margin-top:14px;
    min-height:300px;
    padding:8px;
  }
  .economy-head{
    flex-direction:column;
    align-items:stretch;
  }
  .momentum-head{
    flex-direction:column;
    align-items:flex-start;
  }
  .momentum-progress{
    flex-direction:column;
    align-items:stretch;
  }
  .momentum-progress-meta{
    min-width:0;
    text-align:left;
  }
  .economy-resources{
    width:100%;
  }
  .economy-rates{
    align-items:flex-start;
  }
  .shop-actions{
    align-items:flex-start;
    flex-direction:column;
  }
  .shop-actions .btn{
    margin-left:0;
    width:100%;
  }
  .lp-shell-board{
    gap:8px;
  }
  .lp-shell-cup{
    min-height:76px;
    padding-bottom:10px;
  }
  .lp-shell-cup-shape{
    width:46px;
    height:37px;
  }
  .lp-shell-cup-shape::before{
    width:40px;
  }
  .campaign-grid{
    grid-template-columns:1fr;
  }
  .campaign-actions{
    justify-content:stretch;
  }
  .campaign-actions .btn{
    width:100%;
  }
  .bank-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .bank-actions .btn{
    width:100%;
  }
  .stats-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  .leaderboard-submit{
    grid-template-columns:1fr;
  }
  .save-identity-grid{
    grid-template-columns:1fr;
  }
  .save-meta-grid{
    grid-template-columns:1fr;
  }
  .save-slot-wrap{
    align-items:flex-start;
    flex-direction:column;
  }
  .save-actions{
    flex-direction:column;
    align-items:stretch;
  }
  .save-actions .btn{
    width:100%;
  }
  .leaderboard-name{
    max-width:120px;
  }
  .footer{
    margin-top:6px;
    padding:8px 12px calc(146px + env(safe-area-inset-bottom, 0px));
    font-size:11px;
    display:flex;
  }
  .fab{
    top:auto;
    right:12px;
    left:auto;
  }
  .stats-fab{
    right:12px;
    left:auto;
  }
  #music-fab{
    right:12px;
    left:auto;
  }
  .shop-fab{
    right:12px;
    left:auto;
  }
  .events-fab{
    right:12px;
    left:auto;
  }
  .buffs-fab{
    right:12px;
    left:auto;
  }
  .settings-fab{
    right:12px;
    left:auto;
  }
  .stats-panel{
    top:auto;
    bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    right:max(12px, calc(env(safe-area-inset-right, 0px) + 8px));
    max-height:calc(var(--viewport-height) - 96px);
  }
  .shop-panel{
    top:max(10px, calc(env(safe-area-inset-top, 0px) + 8px));
    bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    right:max(12px, calc(env(safe-area-inset-right, 0px) + 8px));
    max-height:calc(var(--viewport-height) - 96px - env(safe-area-inset-top, 0px));
  }
  .events-panel{
    top:max(10px, calc(env(safe-area-inset-top, 0px) + 8px));
    bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    right:max(12px, calc(env(safe-area-inset-right, 0px) + 8px));
    max-height:calc(var(--viewport-height) - 96px - env(safe-area-inset-top, 0px));
  }
  .buffs-panel{
    top:max(10px, calc(env(safe-area-inset-top, 0px) + 8px));
    bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    right:max(12px, calc(env(safe-area-inset-right, 0px) + 8px));
    max-height:calc(var(--viewport-height) - 96px - env(safe-area-inset-top, 0px));
  }
  .buff-section-head{
    flex-direction:column;
    align-items:flex-start;
  }
  .shop-panel .stats-panel-head{
    padding:14px 16px 10px;
  }
  .shop-panel .stats-panel-head .icon-btn{
    width:42px;
    height:42px;
  }
  .stats-panel .stats-panel-head .icon-btn{
    width:42px;
    height:42px;
  }
  .stats-panel-body{
    max-height:calc(var(--viewport-height) - 150px);
  }
  .music-panel{
    top:auto;
    bottom:calc(72px + env(safe-area-inset-bottom, 0px));
    right:12px;
    max-height:calc(var(--viewport-height) - 96px);
  }
  #help-overlay .modal.help{
    display:flex;
    flex-direction:column;
  }
  #help-overlay .help-body{
    overflow:auto;
    padding-bottom:8px;
  }
}