:root{
  --white:#fff; --black:#020004; --purple:#8800ff; --panel:#0B0A10; --text:#fff;
  --neon:var(--purple); --radius:18px; --border:rgba(255,255,255,.12);
  --now:#F8D94E; --ok-emerald:#9CF6B1; --ok-amber:#FFD08A;
  --font-display: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  --font-body: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;
  --brand-neon: #9a6bff;
  --brand-ink: #e9e9ee;
  --muted: rgba(255,255,255,.72);
  --ach-max: 640px;
  --lb-row-spark-height: 40px;
  --lb-levelup-intensity: 0.67;
}

/* RESET + BASE LAYOUT --------------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html, body{
  min-height:100%;
  width:100%;
  max-width:100vw;
  overflow-x: clip;
  overscroll-behavior-x: none;
  touch-action: pan-y pinch-zoom;
  scroll-behavior:smooth;
}
body{
  min-height:100vh;
  background:#0b0a10;
  color:#fff;
}
.container{
  max-width:1120px;
  margin:0 auto;
  padding:0 16px;
}

/* GLOBAL TYPE ----------------------------------------------------------- */
body, p, li, .v-card__text, .v-btn {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 400;
  color: rgba(255,255,255,.92);
  line-height: 1.55;
}

/* Section titles + Hero headlines */
h1, h2, h3, .headline, .hero-title {
  font-family: 'Orbitron', sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 800 !important;
  color: #fff;
}

/* Subheaders / overlines */
.eyebrow, .stat-overline, .feature-bullet, .lb-rank, .lb-table td:first-child {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
}

/* Body emphasis */
strong, b { font-weight: 600; }

/* Buttons */
.v-btn, .btn-neon, .btn-ghost {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .05em;
  text-transform: uppercase !important;
}

/* Section dividers + captions */
.text-caption, .stat-sub, small {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  color: rgba(255,255,255,.75);
  letter-spacing: .01em;
}

/* HEADER / BRAND TYPE OVERRIDE ----------------------------------------- */
.v-app-bar, .v-toolbar__title, .v-btn--text, .nav-link, .brand-logo-text, .site-header {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* HERO TITLE + NEON WORD ------------------------------------------------ */
.hero-section {
  padding: 56px 0 72px;
  background: #05040a;
  color: #fff;
}
.hero-container {
  max-width: 1320px;
  margin: 0 auto;
}

.hero-title {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  letter-spacing: -0.02em;
  line-height: 0.95;
  text-wrap: balance;
  margin: 0 auto 14px;
  text-align: left;
  font-size: clamp(2.2rem, 9vw, 3.8rem);
  max-width: 30ch;
}
.hero-title .neon-word {
  white-space: nowrap;
}

.neon-word{
  position:relative;
  display:inline-block;
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing:.02em;
  color:#fff;
  -webkit-text-stroke:.6px rgba(255,255,255,.12);
}
.neon-word::after{
  content:attr(data-text);
  position:absolute; inset:0;
  z-index:-1;
  color:transparent;
  text-shadow:0 0 6px var(--neon),
              0 0 14px rgba(136,0,255,.75),
              0 0 26px rgba(136,0,255,.50);
  filter:blur(.2px);
  opacity:.55;
}

/* HERO SUB + CTA -------------------------------------------------------- */
.hero-sub {
  font-family: 'Inter', sans-serif;
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.6;
  color: rgba(255,255,255,.88);
  max-width: 620px;
  margin: 8px auto 0;
}
.hero-cta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:center;
  margin-bottom:18px;
}
.hero-cta .v-btn {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 700;
  letter-spacing: .05em;
}

/* HERO FEATURE LINE ----------------------------------------------------- */
.feature-line{
  display:flex;
  flex-wrap:wrap;
  gap:12px 18px;
  color:#cfd6ea;
  font-weight:800;
  white-space:normal;
  margin-top:18px;
  justify-content:center;
}
.feature-bullet{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.feature-bullet .dot{
  width:7px; height:7px; border-radius:50%;
  background: var(--neon);
  box-shadow:0 0 4px var(--neon),0 0 10px rgba(136,0,255,.4);
}

/* HERO RESPONSIVE ------------------------------------------------------- */
@media (min-width: 600px){
  .hero-title{ max-width:32ch; font-size:clamp(2rem,5vw,3.6rem); }
  .hero-sub{ margin-left:0; margin-right:0; }
  .feature-line{ justify-content:flex-start; }
}
@media (max-width: 480px) {
  .hero-title {
    font-size: clamp(2.9rem, 10vw, 4rem);
    letter-spacing: 1.8px;
    max-width: 32ch;
  }
}
@media (min-width: 960px){
  .hero-cta{ justify-content:flex-start; }
}

/* HERO METRICS TRAY / CAROUSEL ----------------------------------------- */
.metrics-tray {
  background:#121018;
  border-radius:16px;
  box-shadow:0 0 40px rgba(136,0,255,0.15);
}
.hero-carousel {
  border-radius:14px;
  overflow:hidden;
}
.hero-carousel .v-window{ width:100%; }
.hero-carousel .stat-card{
  --title:#cfd6ea;
  --body: rgba(255,255,255,.86);
  background:transparent;
  color:#fff;
  border-radius:14px;
  padding:16px 16px 14px;
  display:flex;
  flex-direction:column;
  height:100%;
  width:100%;
}
.hero-carousel .v-window-item{ display:flex; }

/* Overline */
.hero-carousel .stat-overline,
.hero-carousel .iconline.stat-overline{
  display:flex;
  align-items:center;
  gap:8px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:800;
  font-size:.78rem;
  color:var(--title);
  padding:4px 8px;
  border-radius:10px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}

/* Icon badge */
.hero-carousel .icon-badge,
.icon-badge{
  width:26px;
  height:26px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  box-shadow:0 0 14px rgba(136,0,255,.25);
}

/* Big numbers / % */
.hero-carousel .stat-number{
  font-weight:900;
  letter-spacing:-.01em;
  line-height:1;
  font-size:clamp(1.8rem,3.6vw,2.6rem);
  text-shadow:0 0 10px rgba(0,0,0,.25);
}

/* Money readout (within hero carousel) */
.hero-carousel .stat-money .money-currency{
  font-weight:900 !important;
  font-size:clamp(1.4rem,2.6vw,1.8rem) !important;
  letter-spacing:.01em;
  opacity:.95;
}
.hero-carousel .stat-money .money-value{
  font-weight:900 !important;
  font-size:clamp(2.4rem,4.8vw,3.2rem) !important;
  letter-spacing:-.02em !important;
}

/* Subtext under numbers */
.hero-carousel .stat-sub{
  margin-top:6px;
  color:var(--body);
  font-weight:800;
  letter-spacing:.02em;
  font-size:.9rem;
  opacity:.95;
  text-align:center;
}

/* Keep odometer crisp */
.hero-carousel .odometer{
  display:inline-block;
  transform:translateZ(0);
}

/* Good/warn glow */
.hero-carousel .stat-number--good{
  text-shadow:0 0 14px rgba(15,130,71,.22);
}
.hero-carousel .stat-number--warn{
  text-shadow:0 0 14px rgba(180,94,0,.22);
}

/* Card text padding */
.hero-carousel .stat-card .v-card__text{
  padding-top:6px;
  padding-left:0;
  padding-right:0;
}

/* HERO MONEY ROW (reusable pattern) ------------------------------------ */
.stat-money-row {
  margin-top: 4px;
  margin-bottom: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.stat-money {
  display:flex;
  align-items:baseline;
  gap:.4rem;
  flex-shrink:0;
  white-space:nowrap;
}
.money-currency {
  font-weight: 900;
  font-size: clamp(1.4rem, 2.4vw, 1.8rem);
  margin-right: 0.12em;
  line-height: 1;
}
.money-value {
  font-weight: 900;
  font-size: clamp(2.1rem, 3.3vw, 2.8rem);
  letter-spacing: -0.03em;
  line-height: 1;
}
.od-wrap { white-space: nowrap; }
@media (max-width: 600px) {
  .money-value { font-size: clamp(1.8rem, 7vw, 2.2rem); }
  .money-currency { font-size: clamp(1.2rem, 5vw, 1.5rem); }
}

/* SOFT CARD / GLASS ----------------------------------------------------- */
.soft-card{
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.35));
  border:1px solid var(--border)!important;
  border-radius:var(--radius)!important;
  backdrop-filter:blur(6px);
}
.glassbar{
  backdrop-filter:blur(10px);
  background:rgba(2,0,4,.9);
  border-bottom:1px solid var(--border);
}
.brand-logo{ height:67px; width:auto; display:block; transition:filter .5s ease; }
.brand-logo.crown-shimmer{ filter:drop-shadow(0 0 14px rgba(136,0,255,.85)); }

.tri-stripe{
  height:6px; width:100%;
  box-shadow:0 0 12px rgba(136,0,255,.35);
  background:linear-gradient(90deg,#fff 0 33%,#020004 33% 66%,#8800ff 66% 100%);
}

/* EYEBROW / HEADLINE UTILITIES ----------------------------------------- */
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:800;
  font-size:.78rem;
  color:#c7cde0;
}
.headline{ font-weight:900; letter-spacing:.02em; }
.headline.mini{
  font-size:1.1rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:800;
  text-shadow:0 0 8px var(--neon);
}

/* BUTTON STYLES --------------------------------------------------------- */
.btn-neon{
  background:var(--neon)!important;
  color:#fff!important;
  border-radius:14px!important;
  box-shadow:0 0 32px rgba(136,0,255,.55)!important;
  text-transform:none!important;
  font-weight:800!important;
  letter-spacing:.06em!important;
  transform:translateZ(0);
}
.btn-neon:hover{
  transform:translateY(-1px) scale(1.02);
  box-shadow:0 0 42px rgba(136,0,255,.75)!important;
}
.btn-neon:active{ transform:scale(.98); }

.btn-ghost{
  background:rgba(255,255,255,.06)!important;
  border:1px solid var(--border)!important;
  color:#fff!important;
  text-transform:none!important;
  border-radius:14px!important;
}
.btn-ghost:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.32)!important;
}

/* Purple CTA on white sections */
.btn-purple {
  color: #fff !important;
  background: linear-gradient(90deg, #8800ff, #a04fff);
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  box-shadow: 0 6px 20px rgba(136, 0, 255, 0.25);
  transition: all .3s ease;
}
.btn-purple:hover {
  background: linear-gradient(90deg, #a04fff, #8800ff);
  box-shadow: 0 10px 28px rgba(136, 0, 255, 0.35);
  transform: translateY(-2px);
}

/* HERO / TOP SECTION WRAPPER ------------------------------------------- */
section#top {
  position:relative;
  padding:50px 0 32px;
  background:#0b0a10;
  color:#fff;
}

/* XP BAR + SHIMMER ------------------------------------------------------ */
.xp-wrap,
.season-progress .sp-track,
.player-pro .xp-track{
  position:relative;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid var(--border);
  overflow:hidden;
}
.xp-fill,
.player-pro .xp-fill{
  position:absolute; left:0; top:0; bottom:0;
  width:0%;
  background:linear-gradient(90deg, rgba(136,0,255,.65), rgba(255,255,255,.85));
}
.xp-shine,
.season-progress .sp-shine,
.player-pro .xp-shine{
  position:absolute; inset:0;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
  transform:translateX(-120%);
  animation:shine 2.8s ease-in-out infinite;
}
@keyframes shine{ to{ transform:translateX(140%);} }

/* AVATAR RING + BLINK --------------------------------------------------- */
.avatar{ width:34px; height:34px; border-radius:999px; overflow:hidden; position:relative; }
.avatar img{ width:100%; height:100%; object-fit:cover; display:block; }
.avatar.online::after{
  content:"";
  position:absolute; inset:-2px; border-radius:inherit;
  box-shadow:0 0 10px rgba(136,0,255,.85),
             0 0 0 2px rgba(136,0,255,.45) inset;
  animation:pulse 2.4s ease-in-out infinite;
}
@keyframes pulse{ 0%,100%{opacity:.55} 50%{opacity:1} }

/* PLAYER AVATAR RING (Leaderboard intro) --------------------------------*/
.avatar.ring{
  width:44px; height:44px; border-radius:999px; overflow:hidden; position:relative;
}
.avatar.ring::after{
  content:''; position:absolute; inset:-2px; border-radius:inherit;
  box-shadow:0 0 10px rgba(136,0,255,.85),
             0 0 0 2px rgba(136,0,255,.35) inset;
  animation:pulse 2.6s ease-in-out infinite;
}

/* TOOLTIP --------------------------------------------------------------- */
.chart-tip{
  position:fixed;
  z-index:1000;
  background:rgba(2,0,4,.95);
  color:#fff;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:10px;
  box-shadow:0 10px 24px rgba(0,0,0,.32);
  pointer-events:none;
  font-size:.85rem;
}

/* TRANSITIONS (FLIP LIST) ---------------------------------------------- */
.flip-list-move{ transition: transform 650ms cubic-bezier(.22,1,.36,1); }
.flip-list-enter-active{ transition: all 420ms cubic-bezier(.22,1,.36,1); }
.flip-list-leave-active{ transition: all 320ms cubic-bezier(.55,.085,.68,.53); }
.flip-list-enter{ opacity:0; transform: translateY(-6px) scale(.98); }
.flip-list-leave-to{ opacity:0; transform: translateY(6px) scale(.98); }

/* GLOBAL OPS SECTION / SUBTEXT ----------------------------------------- */
.ops-section { padding:56px 0; }
.ops-section .headline { font-size:clamp(1.6rem,3.6vw,2.4rem); }
.subtext {
  color:rgba(255,255,255,.86);
  max-width:640px;
  margin:10px auto 0;
}

/* LOGIN DIALOG (PORTAL) ------------------------------------------------- */
.login-portal{
  position:relative;
  overflow:hidden;
  background:radial-gradient(1200px 500px at 10% -20%, rgba(136,0,255,.25), transparent),
             rgba(10,8,16,.96);
  border:1px solid var(--border);
}
.login-portal .crown{
  width:44px;
  height:auto;
  filter:drop-shadow(0 0 12px rgba(136,0,255,.65));
}
.particle{
  position:absolute;
  width:6px; height:6px;
  border-radius:999px;
  background:rgba(136,0,255,.85);
  box-shadow:0 0 10px rgba(136,0,255,.65);
  pointer-events:none;
}

/* SEASON CARD / TICKER -------------------------------------------------- */
.season-card{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.42));
  border:1px solid var(--border);
  border-radius:14px;
  padding:10px;
}

/* KPI DOTS -------------------------------------------------------------- */
.kpi-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-top:8px;
}
.kpi-dot{
  width:8px; height:8px; border-radius:999px;
  background:rgba(255,255,255,.35);
  cursor:pointer;
}
.kpi-dot.is-active{
  background:#fff;
  box-shadow:0 0 10px rgba(255,255,255,.6);
}

/* EQUAL CARD ROWS ------------------------------------------------------- */
.equal-row > .v-col{ display:flex; }
.equal-card{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  text-align:center;
}
.equal-card .v-card__text{ flex:1 1 auto; }

@media (max-width:600px){
  .equal-row > .v-col{ display:block; }
  .equal-card{ height:auto; }
}

/* RANK BADGE / MEDALS --------------------------------------------------- */
.rank-badge{
  width: 28px; height: 28px; min-width: 28px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 0.95rem;
  letter-spacing: .02em;
  position: relative;
  isolation: isolate;
  box-shadow: 0 0 10px rgba(0,0,0,.25);
}
.rank-badge .rb-num { position: relative; z-index: 2; }

.rank-badge.rb--gold   { background: linear-gradient(180deg,#FFE89A 0%, #D8A800 100%); color:#2b2000; }
.rank-badge.rb--silver { background: linear-gradient(180deg,#F2F4F7 0%, #B7C0D0 100%); color:#1f2733; }
.rank-badge.rb--bronze { background: linear-gradient(180deg,#F4C9A2 0%, #C07C3A 100%); color:#2b1600; }
.rank-badge.rb--std    { background: rgba(255,255,255,.15); color:#fff; border:1px solid rgba(255,255,255,.25); }

.rank-badge::before{
  content:'';
  position:absolute; inset:-2px;
  border-radius:inherit;
  box-shadow: 0 0 12px rgba(136,0,255,.35) inset;
  pointer-events:none;
}

/* LEADERBOARD TABLE (BASE) --------------------------------------------- */
.lb-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 10px;
  table-layout:fixed;
}
.lb-table td{
  vertical-align:middle;
  padding:12px 14px;
  background:rgba(255,255,255,.03);
  border:1px solid var(--border);
}
.lb-table tr td:first-child{ border-radius:12px 0 0 12px; }
.lb-table tr td:last-child { border-radius:0 12px 12px 0; }

.lb-name     { width:45%; }
.lb-progress { width:40%; }
.lb-amount   {
  width:15%;
  text-align:right;
  white-space:nowrap;
}

.lb-table td .rank-badge .rb-num { mix-blend-mode:normal; opacity:1; }
.lb-table tr[data-rank="1"] .rank-badge { filter: drop-shadow(0 0 12px rgba(255,215,0,.35)); }
.lb-table tr[data-rank="2"] .rank-badge { filter: drop-shadow(0 0 12px rgba(200,200,200,.35)); }
.lb-table tr[data-rank="3"] .rank-badge { filter: drop-shadow(0 0 12px rgba(192,124,58,.35)); }

/* LEADERBOARD GLOBAL TOKENS -------------------------------------------- */
.lb-table .spark{
  height: var(--lb-row-spark-height);
}
.lb-table .lb-row{
  transition:
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background-color 0.18s ease,
    filter 0.18s ease;
}
.lb-table .lb-row.row-celebrate {
  background-color: rgba(248, 217, 78, calc(0.05 * var(--lb-levelup-intensity)));
  box-shadow:
    0 0 calc(3px + 8px * var(--lb-levelup-intensity))
      rgba(248, 217, 78, calc(0.30 + 0.40 * var(--lb-levelup-intensity))),
    0 0 calc(8px + 16px * var(--lb-levelup-intensity))
      rgba(160, 139, 255, calc(0.18 + 0.30 * var(--lb-levelup-intensity)));
  border-top: 1px solid rgba(248, 217, 78, calc(0.4 + 0.4 * var(--lb-levelup-intensity)));
  border-bottom: 1px solid rgba(248, 217, 78, calc(0.4 + 0.4 * var(--lb-levelup-intensity)));
}

/* CELEBRATION ROW HALO (FINAL OVERRIDE) -------------------------------- */
.lb-wrap{ position: relative; }
.lb-table tr.row-celebrate{
  position:relative;
  z-index:1;
}
.lb-table tr.row-celebrate::after{
  content:"";
  position:absolute;
  left:0; right:0; top:-5px; bottom:-5px;
  border-radius:12px;
  pointer-events:none;
  box-shadow:0 0 0 2px rgba(0,255,153,.80),
             0 0 24px rgba(0,255,153,.45);
  animation: rowHalo 2s ease-out forwards;
}
@keyframes rowHalo{
  0%   { box-shadow: 0 0 0 3px rgba(0,255,153,.9), 0 0 28px rgba(0,255,153,.55); }
  40%  { box-shadow: 0 0 0 2px rgba(0,255,153,.65), 0 0 20px rgba(0,255,153,.40); }
  100% { box-shadow: 0 0 0 1px rgba(0,255,153,.30), 0 0 8px  rgba(0,255,153,.18); }
}
tr.row-celebrate td{
  background: rgba(255,255,255,.03) !important;
  box-shadow: none !important;
}

/* AMOUNT CELL COMPACT --------------------------------------------------- */
.lb-amount{
  background: inherit !important;
  border: inherit !important;
  color: inherit !important;
  padding: 12px 14px !important;
  text-align: center !important;
  vertical-align: middle !important;
}
.lb-amount .amt-center{
  display:inline-flex;
  align-items:baseline;
  justify-content:center;
  gap:6px;
  white-space:nowrap;
  font-weight:900;
  letter-spacing:.01em;
  line-height:1;
  color:inherit;
}
.lb-amount .cur,
.lb-amount .odometer{
  color:inherit !important;
  opacity:1 !important;
}
@media (min-width:960px){
  .lb-amount .amt-center{ font-size:1.5rem; }
}

/* LEADERBOARD DESKTOP COLGROUP LAYOUT ---------------------------------- */
@media (min-width:960px){
  .lb-table{ table-layout:fixed; border-spacing:0 10px; }
  .lb-table col.col-amount  { width:180px; }
  .lb-table col.col-name    { width:auto; }
  .lb-table col.col-progress{ width:auto; }
  .lb-name, .lb-progress, .lb-amount{ width:auto !important; }

  .lb-amount{
    white-space:nowrap;
    text-align:right;
    padding-right:18px;
    font-weight:900;
    font-size:1.45rem;
    letter-spacing:.01em;
    display:flex; align-items:center; justify-content:flex-end;
  }
  .lb-amount .odometer{ transform:translateY(1px); }
}

/* LEADERBOARD MOBILE LAYOUT -------------------------------------------- */
@media (max-width:959px){
  .lb-amount{ display:none !important; }
  .lb-name   { width:65% !important; }
  .lb-progress{ width:35% !important; }
  .lb-name .mini-kpis{ margin-top:6px; }
}

@media (max-width:600px){
  .lb-table{ table-layout:auto !important; }
  .lb-name   { width:auto !important; }
  .lb-progress{
    width:100% !important;
    padding:6px 6px 4px 6px !important;
  }
  .lb-progress .spark{
    display:block;
    width:100% !important;
    height:var(--spark-h,68px) !important;
  }
  .lb-progress .text-caption{
    margin-top:4px !important;
    font-size:.8rem !important;
    line-height:1.2 !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }
  .lb-name .mini-kpis{
    gap:6px !important;
    margin-top:4px !important;
  }
  .lb-name .mini-kpis .mini-chip{
    border:1px solid rgba(255,255,255,.16);
    background:rgba(255,255,255,.05);
    border-radius:12px;
    font-size:.76rem !important;
    padding:2px 7px !important;
  }
}

/* LEADERBOARD EDGE-TO-EDGE ON PHONES ----------------------------------- */
@media (max-width:600px){
  #leaderboard .container{
    max-width:100%;
    padding-left:0;
    padding-right:0;
  }
  #leaderboard .lb-board-col{
    padding-left:0 !important;
    padding-right:0 !important;
  }
  #leaderboard .lb-wrap{
    margin-left:calc(-1 * var(--lb-edge, 0px));
    margin-right:calc(-1 * var(--lb-edge, 0px));
    border-radius:14px;
  }
  :root{ --lb-edge:12px; }
  #leaderboard .lb-table{
    width:100%;
    table-layout:fixed;
  }
}

/* WEATHER INLINE CHIP FOR ROWS ----------------------------------------- */
.wx-inline{
  padding:1px 6px;
  margin-left:6px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,.06);
  font-size:.78rem;
  line-height:1.1;
  white-space:nowrap;
  color:#fff;
}
.wx-inline .v-icon{ font-size:14px; opacity:.9; }

@media (max-width:600px){
  .wx-chip{ display:none !important; }
}
@media (max-width:380px){
  .wx-inline .v-icon{ display:none !important; }
  .wx-inline{ padding:1px 5px; }
}
@media (min-width:960px){
  .wx-inline{ display:none !important; }
  .wx-chip{ display:inline-flex !important; }
}

/* KPI CARD (TOP ROW + EXPANDER) ---------------------------------------- */
.kpi-card{
  position:relative;
  background: radial-gradient(140% 100% at 100% 0%, rgba(154,107,255,.06), rgba(255,255,255,.03) 40%) !important;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
  display:flex;
  flex-direction:column;
  width:100%;
  min-height:170px;
  overflow:hidden;
}
.kpi-card::before{
  content:"";
  position:absolute;
  left:12px; right:12px; top:42px; height:2px;
  background: linear-gradient(90deg, transparent, rgba(154,107,255,.35), transparent);
  opacity:.35;
}
.kpi-card::after{
  content:"";
  position:absolute;
  width:180px; height:180px;
  right:-60px; top:-60px;
  border-radius:50%;
  filter: blur(22px);
  opacity:.14;
  background: radial-gradient(circle, var(--brand-neon), transparent 60%);
  pointer-events:none;
  animation: kpiGlow 7s ease-in-out infinite alternate;
}
@keyframes kpiGlow{
  from{ transform: translate(6px,4px) scale(1); opacity:.10; }
  to  { transform: translate(0,0)   scale(1.06); opacity:.18; }
}

.kpi-head-row{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.kpi-value-row{ margin-top:8px; }

.kpi-title{
  display:inline-flex; align-items:center; gap:8px;
  font-family: var(--font-display);
  font-weight:800;
  font-size:.92rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  padding:6px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
}
.kpi-title .v-icon{ font-size:16px; opacity:.9; }

.kpi-dot{
  width:8px; height:8px; border-radius:50%;
  background: var(--brand-neon);
  box-shadow:0 0 10px var(--brand-neon);
}

.kpi-value{
  font-family: var(--font-display);
  font-weight:900;
  font-size:clamp(1.6rem,4.8vw,2.2rem);
  line-height:1.1;
  text-align:center;
  color: var(--brand-ink);
  text-shadow:0 0 10px rgba(255,255,255,.12);
}
.kpi-sub{
  margin-top:6px;
  font-family:var(--font-body);
  font-size:.88rem;
  color:var(--muted);
}

.stat-number--good,
.stat-sub.good{ color:#39e58c; text-shadow:0 0 10px rgba(57,229,140,.30); }
.stat-number--warn,
.stat-sub.warn{ color:#ff6b6b; text-shadow:0 0 10px rgba(255,107,107,.30); }

/* KPI EXPANDER + REVEAL ------------------------------------------------- */
.kpi-expander{
  width:100%;
  display:flex; align-items:center; justify-content:center;
  gap:8px;
  padding:8px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  color:#fff;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.kpi-expander:hover{
  transform: translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.kpi-expander .chev{
  transition: transform .25s ease;
}
.kpi-expander .chev.rot{
  transform: rotate(180deg);
}

.kpi-reveal{
  border:1px solid var(--border);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border-radius:14px;
  padding:12px;
  position:relative;
  overflow:clip;
}
.kpi-reveal::before{
  content:"";
  position:absolute;
  inset:-40% -40% auto auto;
  width:200px; height:200px;
  border-radius:50%;
  filter: blur(20px);
  opacity:.12;
  background: radial-gradient(circle, var(--brand-neon,#9a6bff), transparent 60%);
  animation: kpiOrb 6s ease-in-out infinite alternate;
  pointer-events:none;
}
@keyframes kpiOrb{
  from{ transform: translate(10px,8px) scale(1); opacity:.08; }
  to  { transform: translate(0,0) scale(1.06);  opacity:.16; }
}

@media (max-width:600px){
  .kpi-card{ min-height:155px; border-radius:12px; }
  .kpi-expander{ padding:8px 10px; }
}

/* Remove KPI chevron bubbles under the cards */
.kpi-card--chevron {
  padding-bottom: 0 !important;   /* reclaim the space */
}

.kpi-card--chevron .kpi-arrow-dock {
  display: none !important;       /* hide the purple circle + arrow */
}
/* Center KPI content vertically inside the card */
.kpi-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;   /* <-- centers vertically */
  align-items: center !important;        /* <-- centers horizontally */
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Keep natural spacing between title + value */
.kpi-title {
  margin-bottom: 10px !important;
}

.kpi-value {
  margin-top: 0 !important;
}


/* KPI STACK GAP ON MOBILE ---------------------------------------------- */
@media (max-width:600px){
  .kpi-compact > .v-col{ margin-bottom:18px !important; }
  .kpi-compact > .v-col:nth-last-child(-n+2){
    margin-bottom:0 !important;
  }
}

/* CORE PILLARS (WHITE SECTION) ----------------------------------------- */
.ops-core-pillars{
  background:#fff;
  padding:72px 0;
  text-align:center;
  color:#0b0a10;
}
.ops-core-pillars .headline{
  color:#0b0a10;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}

/* Pillar card */
.pillar-card{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  height:100%;
  background:#0b0a10;
  color:#fff;
  border:1px solid rgba(136,0,255,0.2);
  border-radius:18px;
  box-shadow:0 10px 24px rgba(0,0,0,.25);
  padding:36px 28px;
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.ops-core-pillars .pillar-card{ padding:34px 26px; }

.pillar-card:hover{
  transform:translateY(-5px);
  border-color:rgba(136,0,255,0.45);
  box-shadow:0 18px 40px rgba(136,0,255,0.25);
}

/* Pillar tags */
.pillar-tags{
  flex-shrink:0;
  display:flex;
  justify-content:center;
  gap:8px;
  margin-bottom:16px;
}
.ops-core-pillars .pillar-chip{
  margin-bottom:2px;
}
.pillar-chip{
  text-transform:uppercase;
  border-color:rgba(136,0,255,0.5) !important;
  color:#e0cfff !important;
  background:rgba(136,0,255,0.1) !important;
  font-weight:700 !important;
  letter-spacing:.05em;
}

/* Pillar content */
.pillar-content{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding-top:8px;
  text-align:left;
}
.ops-core-pillars .pillar-content{
  max-width:420px;
  margin:0 auto;
}
.pillar-title{
  font-family:"Orbitron",sans-serif;
  font-weight:800;
  font-size:1.1rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#fff;
  margin-bottom:18px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.ops-core-pillars .pillar-title{
  font-size:1.08rem;
  margin:0 0 12px;
}
.ops-core-pillars .pillar-title::after{
  content:"";
  display:block;
  width:56px; height:2px;
  margin:10px auto 0;
  background:linear-gradient(90deg,#8800ff,rgba(136,0,255,.35));
  border-radius:2px;
  opacity:.85;
}

.pillar-list{
  margin:0;
  padding:0;
  list-style:none;
  margin-top:auto;
  padding-top:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.ops-core-pillars .pillar-list{ padding-top:14px; margin-top:auto; }
.pillar-list li{
  display:flex;
  align-items:center;
  gap:10px;
  color:rgba(255,255,255,.85);
  font-size:.95rem;
  padding:6px 0;
  line-height:1.4;
}
.ops-core-pillars .pillar-list li{
  padding:7px 0;
  line-height:1.45;
}
.pillar-list .v-icon{ color: var(--neon,#8800ff); }
.ops-core-pillars .pillar-list li .v-icon{
  width:16px;
  text-align:center;
  transform:translateY(1px);
  color:#a873ff;
}

/* Pillar shine */
.pillar-shine{
  position:absolute; inset:0;
  background: linear-gradient(115deg, transparent 45%, rgba(255,255,255,.08) 50%, transparent 55%);
  transform:translateX(-120%);
  animation:pillarSweep 6s ease-in-out infinite;
  pointer-events:none;
}
@keyframes pillarSweep{
  0%{ transform:translateX(-120%); }
  60%,100%{ transform:translateX(120%); }
}

/* PILLARS / FEATURES RESPONSIVE ---------------------------------------- */
@media (max-width:1264px){
  .container{ padding-left:20px; padding-right:20px; }
  .ops-core-pillars .pillar-content{ max-width:480px; }
}
@media (max-width:960px){
  .ops-core-pillars{ padding:56px 0; }
  .pillar-card{ padding:22px !important; }
  .pillar-title{ font-size:1rem; }
  .pillar-list li{ font-size:.93rem; }
}
@media (max-width:600px){
  .ops-core-pillars,
  .ops-features{ padding:56px 0; }
  .ops-core-pillars .headline{ font-size:1.25rem; }
  .pillar-card,
  .feature-card{
    margin-bottom:16px;
    padding:24px 20px;
  }
  .pillar-title,
  .fc-title{
    font-size:.96rem;
    letter-spacing:.04em;
  }
  .pillar-chip,
  .fc-chip{
    font-size:.65rem !important;
    padding:2px 6px !important;
  }
  .pillar-list li,
  .fc-item{
    line-height:1.5;
    padding:5px 0;
  }
  .btn-purple,
  .ops-features .btn-ghost{
    width:100%;
  }
}

/* PURPLE FEATURES SECTION ---------------------------------------------- */
.ops-features{
  padding:72px 0;
  background:#8800ff;
  background-image:
    radial-gradient(800px 300px at 10% 0%, rgba(255,255,255,0.12), transparent 60%),
    radial-gradient(600px 260px at 90% 0%, rgba(0,0,0,0.20), transparent 65%);
  color:#fff;
}
.ops-features .headline{ color:#fff; }

/* Feature card */
.feature-card{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:100%;
  background:linear-gradient(180deg, rgba(0,0,0,.38), rgba(0,0,0,.62));
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  padding:36px 28px;
  transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s ease;
}
.feature-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 36px rgba(0,0,0,0.45),
             0 0 24px rgba(136,0,255,0.22);
}

.fc-title{
  font-family:"Orbitron",sans-serif;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#fff;
  font-size:1.1rem;
  margin:8px 0 16px;
  text-align:center;
}

.fc-tags{
  flex-shrink:0;
  display:flex;
  gap:6px;
  justify-content:center;
  margin-bottom:12px;
}
.fc-chip{
  border-color: rgba(255,255,255,0.35) !important;
  background: rgba(255,255,255,0.08) !important;
  color:#fff !important;
  text-transform:uppercase;
  font-weight:700 !important;
  letter-spacing:0.05em;
}

.fc-list{
  padding-top:16px;
  min-height:120px;
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  margin-top:auto;
}
.fc-item{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,0.95);
  padding:6px 0;
  font-weight:600;
  line-height:1.5;
}
.fc-item .v-icon{
  color:#fff;
  opacity:.95;
  transform:translateY(-1px);
}

/* Feature shine */
.fc-shine{
  position:absolute; inset:0;
  background: linear-gradient(115deg, transparent 45%, rgba(255,255,255,.12) 50%, transparent 55%);
  transform: translateX(-120%);
  animation: sweep 4.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes sweep{
  0%{transform:translateX(-120%)}
  60%,100%{transform:translateX(120%)}
}

/* STACKED CARD GUTTERS -------------------------------------------------- */
.ops-core-pillars .v-col.d-flex,
.ops-features .v-col.d-flex{ margin-bottom:18px; }

@media (min-width:960px){
  .ops-core-pillars .v-col.d-flex,
  .ops-features .v-col.d-flex{ margin-bottom:0; }
}

@media (max-width:960px){
  #features .v-col.d-flex + .v-col.d-flex,
  #core-pillars .v-col.d-flex + .v-col.d-flex{
    margin-top:8px;
  }
}
@media (max-width:600px){
  .pillar-shine, .fc-shine{ opacity:.7; }
}

/* DEMO / CTA SECTION ---------------------------------------------------- */
.ops-demo{
  padding:88px 0;
  background: radial-gradient(800px 400px at 50% 0%, rgba(136,0,255,.25), rgba(0,0,0,.9));
  color:#fff;
  position:relative;
  text-align:center;
}
.ops-demo::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(900px 400px at 50% -30%, rgba(255,255,255,.08), transparent 70%);
  pointer-events:none;
}
.ops-demo .headline{
  font-size:clamp(1.8rem,4vw,2.6rem);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:#fff;
  margin-bottom:12px;
}
.ops-demo .demo-sub{
  color:rgba(255,255,255,.85);
  font-size:1.05rem;
  font-weight:500;
  max-width:720px;
  margin:0 auto;
  line-height:1.55;
}
.ops-demo .demo-cta{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px;
  margin-top:32px;
}
.ops-demo .demo-embed{
  min-height:520px;
  max-width:900px;
  margin:48px auto 0;
  box-shadow:0 0 60px rgba(136,0,255,.28);
  display:none;
}

/* SEASON STRIP / PROGRESS ---------------------------------------------- */
.season-strip .strip-title{
  font-weight:800;
  letter-spacing:.02em;
}
.season-progress .sp-fill{
  position:absolute; left:0; top:0; bottom:0;
  background:linear-gradient(90deg, #8800ff, #d3b400);
  width:40%;
}

/* INTRO ROW / LB -------------------------------------------------------- */
.lb-intro .soft-card{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.38));
  border:1px solid var(--border);
}
.mini-strong{ font-weight:900; letter-spacing:.02em; }

.chip-dark{
  background:rgba(255,255,255,.06)!important;
  border:1px solid var(--border)!important;
  color:#fff!important;
  font-weight:700!important;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.chip-pulse{
  background:rgba(136,0,255,.15)!important;
  border:1px solid rgba(136,0,255,.45)!important;
  color:#fff!important;
  box-shadow:0 0 14px rgba(136,0,255,.25);
}
.chip-ghost{
  background:rgba(255,255,255,.06)!important;
  border:1px solid var(--border)!important;
  color:rgba(255,255,255,.92)!important;
}

.min-w-0{ min-width:0; }
.text-truncate{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.lb-intro .d-flex > .stretch-card{
  display:flex;
  flex-direction:column;
  height:100%;
  overflow:hidden;
}

/* “YOU” CARD (Business card + XP) -------------------------------------- */
/* Outer card */
.you-card{
  width:100%;
  border:1px solid var(--border);
  border-radius:16px;
  background:
    radial-gradient(120% 140% at 8% -20%, rgba(154,107,255,.22), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
  overflow:hidden;
}
.you-card.pro-elevated{
  background: linear-gradient(180deg, rgba(255,255,255,.035) 0%, rgba(255,255,255,.02) 100%);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 16px;
}

/* Headline row */
.you-headline{
  display:grid;
  grid-template-columns:108px 1fr;
  column-gap:16px;
  align-items:start;
  padding:16px 18px 10px;
}
.you-avatar img{
  width:108px; height:108px;
  border-radius:50%;
  object-fit:cover;
  display:block;
  box-shadow:0 0 0 3px rgba(255,255,255,.08),
             0 6px 26px rgba(154,107,255,.35);
}
.you-meta{ min-width:0; }
.you-name{
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  line-height:1.05;
  margin-bottom:6px;
}
.you-chipgroup{ margin-top:4px; }

/* XP row */
.you-sep{
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  margin:2px 12px 0;
  border-radius:1px;
}
.you-xprow{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  padding:12px 18px 14px;
}
.you-xp-label{
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  opacity:.85;
  grid-column:1/2;
}
.you-xpbar{
  grid-column:1/2;
  position:relative;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.you-xpfill{
  position:absolute;
  inset:0 auto 0 0;
  width:0;
  background:linear-gradient(90deg, #9b5cff, #f3c04d);
  transition:width .45s ease;
}
.you-xpshine{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0));
}
.you-xpnums{
  grid-column:2/3;
  text-align:right;
  opacity:.9;
}

/* YOU HERO ROW INSET */
.you-hero-row--inset{ margin-left:0; margin-right:0; }

/* Responsive YOU card */
@media (max-width:600px){
  .you-headline{
    grid-template-columns:1fr;
    row-gap:12px;
    justify-items:center;
    text-align:center;
    padding:14px 12px 8px;
  }
  .you-avatar img{ width:88px; height:88px; }
  .you-xprow{
    grid-template-columns:1fr;
    text-align:center;
    gap:8px;
    padding:10px 12px 12px;
  }
  .you-xpnums{ grid-column:1/-1; text-align:center; }
}
@media (min-width:600px) and (max-width:959px){
  .you-headline{ grid-template-columns:96px 1fr; }
  .you-avatar img{ width:96px; height:96px; }
}
@media (max-width:959.98px){
  .you-headline{ align-items:flex-start !important; }
}

/* YOU FLAG PANEL / AVATAR RING (FLAGS TAB) ----------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;600;700;800&display=swap');

.you-flag-card { border-radius:14px !important; overflow:hidden; }
.you-panels .v-expansion-panel { border-radius:12px !important; overflow:hidden; }
.you-panels .v-expansion-panel + .v-expansion-panel{ margin-top:10px; }

.you-flag-card,
.you-flag-card .v-expansion-panel-header,
.you-flag-card .v-expansion-panel-content,
.you-flag-card .v-card__text,
.you-flag-card .v-chip{
  font-family:"Rajdhani",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,sans-serif !important;
  letter-spacing:.02em;
}
.you-panels .v-expansion-panel-header{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,0));
  border:1px solid var(--border, rgba(255,255,255,.12));
  min-height:48px;
  padding:0 14px;
}
.you-panels .v-expansion-panel-content{
  border:1px solid var(--border, rgba(255,255,255,.12));
  border-top:0;
  background:rgba(255,255,255,.04);
}

.ep-title{ text-transform:uppercase; letter-spacing:.06em; font-weight:800; }
.you-name{ text-transform:uppercase; letter-spacing:.06em; font-weight:900; font-size:1.1rem; }

/* Avatar core (flags) – final override */
.you-avatar__core{
  position:relative;
  width:200px; height:200px;
  border-radius:50%;
  margin:0 auto;
  display:grid;
  place-items:center;
  background:#121214;
  border:1.5px solid rgba(255,255,255,.14);
  box-shadow:0 2px 0 rgba(255,255,255,.06) inset,0 14px 28px rgba(0,0,0,.55);
}
@media (max-width:1264px){
  .you-avatar__core{ width:160px; height:160px; }
}
@media (max-width:960px){
  .you-avatar__core{ width:120px; height:120px; }
}

.you-avatar__img{
  width:100%!important;
  height:100%!important;
  border-radius:50%!important;
  overflow:hidden;
  object-fit:cover !important;
  object-position:center 38% !important;
}
.you-avatar__img .v-image__image{
  border-radius:50%;
  background-size:cover!important;
  background-position:center 38%!important;
}
.you-avatar__grad,
.you-avatar__initials{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
}
.you-avatar__grad{
  background: radial-gradient(120% 120% at 10% 10%, #6f42c1 0%, #e2b24a 55%, #2b2b35 100%);
  filter:saturate(1.05);
}
.you-avatar__initials{
  font-family:'Orbitron','Inter',system-ui;
  font-weight:900;
  letter-spacing:.06em;
  font-size:32px;
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}

/* Conic ring */
.you-avatar__core.you-avatar--ring::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:3px;
  background:conic-gradient(from 210deg,#a78bfa 0%,#8b5cf6 25%,#f59e0b 55%,#a78bfa 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
  z-index:2;
  visibility:hidden;
  opacity:0;
  animation:none;
  transform:none;
}
.you-avatar__core.you-avatar--ring.is-ready::before{
  visibility:visible;
  opacity:1;
  animation:ringIntro .8s cubic-bezier(.2,.8,.2,1) both, ringLoop 18s linear infinite 1.2s;
}
@keyframes ringIntro{
  0%{transform:scale(.92) rotate(-60deg);opacity:0;filter:brightness(.9)}
  60%{transform:scale(1.02) rotate(-10deg);opacity:1;filter:brightness(1.08)}
  100%{transform:scale(1) rotate(0);opacity:1;filter:brightness(1)}
}
@keyframes ringLoop{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){
  .you-avatar__core.you-avatar--ring.is-ready::before{
    animation:none;
    opacity:1;
    visibility:visible;
  }
}

/* Combined XP header */
.you-xp-combined .v-expansion-panel-header{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:10px 14px;
}
.xp-header .xp-title strong{ letter-spacing:.3px; }
.xp-inline-track{
  position:relative;
  flex:1 1 auto;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
  min-width:140px;
}
.xp-inline-fill{
  position:absolute; top:0; left:0; height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, #9b5cff 0%, #f3c04d 55%, #f3c04d 100%);
  transition:width .45s ease;
}
.xp-inline-num{
  white-space:nowrap;
  color:rgba(255,255,255,.85);
}
@media (max-width:959.98px){
  .xp-header{ align-items:stretch; }
  .xp-inline-num{ margin-top:4px; }
}

/* BUSINESS CARD SLAB (YOU) --------------------------------------------- */
.card--biz{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
  padding:14px 16px 12px;
}
.bizbar{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:10px 12px;
}
.biz-avatar{ position:relative; overflow:visible; }
.biz-avatar-grad{
  position:absolute; inset:0; border-radius:999px;
  background: radial-gradient(120% 120% at 30% 20%, rgba(136,0,255,.55) 0%, rgba(255,200,100,.55) 45%, rgba(0,0,0,.15) 100%);
}
.biz-initials{
  position:relative; z-index:1;
  color:#fff; font-weight:800; font-size:26px;
  font-family:'Orbitron','Inter',system-ui;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}
.biz-name{
  font-weight:800; letter-spacing:.35px;
  font-size:22px; line-height:1.1;
}
.rail-group{ margin-top:10px; }
.rail-label{
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.12rem;
  opacity:.7;
  margin:2px 0 6px 2px;
}
.rail{
  display:flex; gap:8px; flex-wrap:wrap;
  padding:8px;
  border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
}
.rail--stats .v-chip,
.rail--badges .v-chip{ height:26px; }
.biz-chips{ margin-top:10px; }
.biz-panel{ margin-top:6px; }

.xp-inline-track{
  position:relative;
  flex:1 1 280px;
  height:8px;
  min-width:180px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.xp-inline-fill{
  position:absolute;
  inset:0;
  right:auto;
  width:0%;
  background:linear-gradient(90deg, #9b5cff 0%, #f3c04d 60%, #f3c04d 100%);
  border-radius:999px;
  transition:width .45s ease;
}
.xp-inline-num{
  white-space:nowrap;
  color:rgba(255,255,255,.9);
}
@media (max-width:959.98px){
  .xp-inline-track{ flex-basis:100%; }
  .bizbar{ align-items:flex-start; }
}

/* BEST SELLERS STREAM --------------------------------------------------- */
.bs-stream{
  margin-top:16px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(255,255,255,.03);
  overflow:hidden;
  position:relative;
}
.bs-track{
  display:flex;
  gap:12px;
  padding:10px 14px;
  animation: bsScroll 20s linear infinite;
}
.bs-track.paused{ animation-play-state:paused; }
@keyframes bsScroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

.bs-item{
  display:flex; align-items:center; gap:10px;
  padding:6px 12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  border-radius:999px;
  white-space:nowrap;
}
.bs-thumb{
  width:24px; height:24px;
  border-radius:6px;
  overflow:hidden;
  background:#222;
  box-shadow:0 0 8px rgba(0,0,0,.2);
}
.bs-thumb img{
  width:100%; height:100%;
  object-fit:cover;
}
.bs-name{ font-weight:700; letter-spacing:.2px; }
.bs-metrics{ display:inline-flex; align-items:center; gap:10px; }
.bs-trend{
  display:inline-flex; align-items:center; gap:4px;
}
.bs-trend.up{ color:#39e58c; }
.bs-trend.down{ color:#ff6b6b; }

@media(max-width:600px){
  .bs-track{ padding:10px; gap:8px; }
  .bs-item{ padding:6px 10px; }
}

/* DRILLDOWN SECTION ----------------------------------------------------- */
@media (max-width:600px){
  #drilldown .container{
    max-width:100%;
    padding-left:0;
    padding-right:0;
  }
  #drilldown .dd-row{
    margin-left:calc(-1 * var(--container-x, 16px));
    margin-right:calc(-1 * var(--container-x, 16px));
  }
  #drilldown .dd-col{
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* Drill wrapper + header */
.drill-wrap{
  border:1px solid var(--border);
  background: radial-gradient(120% 100% at 100% 0%, rgba(154,107,255,.05), rgba(255,255,255,.03) 40%);
}
.store-head{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  padding:8px;
  border-radius:10px;
  background:rgba(255,255,255,.05);
  border:1px solid var(--border);
}
.store-title .eyebrow{ opacity:.8; margin-bottom:2px; }
.store-title .headline{
  font-size:1.05rem;
  font-weight:900;
  line-height:1.15;
}

/* Range group */
.dd-range{
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.dd-range .seg{
  max-width:240px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  padding:2px;
}

/* Chart cards */
.chart-card{
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.03);
}
.stat-overline{
  padding:4px 8px;
  border-radius:10px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.04);
  display:inline-flex;
  gap:8px;
  align-items:center;
}

/* Chart layout helpers */
.dd-canvas{ height:200px; }
@media (max-width:600px){
  .store-head{
    grid-template-columns:1fr;
    gap:8px;
  }
  .store-title{ text-align:center; }
  .dd-range{ justify-content:center; }
  .dd-range .seg{ max-width:100%; }
  .dd-kpis .v-col{
    padding-left:8px !important;
    padding-right:8px !important;
  }
  .dd-canvas{ height:180px; }
}

.dd-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:8px;
}
.dd-head-left{ justify-self:start; }
.dd-head-center{ justify-self:center; }
.dd-head-right{
  justify-self:end;
  display:flex;
  align-items:center;
  gap:8px;
}
.dd-title{
  font-weight:700;
  letter-spacing:.04em;
  opacity:.9;
}
.dd-head-center .range-picker{ margin-top:0 !important; }
.dd-head-center .range-picker > div:first-child{
  flex-direction:row !important;
  gap:10px !important;
}
.dd-head-center .range-picker .rp-date{ display:none; }

.chart-card .chart-bar{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:10px;
}
.chart-actions .v-btn{ opacity:.8; }
.chart-actions .v-btn:hover{ opacity:1; }

/* Fullscreen chart */
.dd-fs-card{
  background:linear-gradient(180deg, rgba(0,0,0,.86), rgba(0,0,0,.94));
}
.dd-fs-bar{
  display:flex;
  align-items:center;
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.dd-fs-body{
  height:calc(100vh - 48px);
  padding:10px;
}
.dd-fs-body canvas{
  width:100% !important;
  height:100% !important;
}

/* Inline expansion animation */
.dd-grid .chart-col{
  transition:
    flex-basis 0.26s ease,
    max-width 0.26s ease,
    transform 0.26s ease,
    opacity 0.26s ease;
}
.dd-grid .chart-card{
  transition:
    box-shadow 0.26s ease,
    transform 0.26s ease,
    border-color 0.26s ease,
    background 0.26s ease;
}
.dd-grid--has-expanded .chart-col--expanded{
  flex:0 0 100%;
  max-width:100%;
}
.dd-grid--has-expanded .chart-card--expanded{
  box-shadow:0 18px 48px rgba(0,0,0,.72);
  border:1px solid rgba(255,255,255,.20);
  transform:translateY(-4px);
}
.dd-grid--has-expanded .chart-col:not(.chart-col--expanded){
  opacity:.35;
  transform:translateY(10px) scale(.97);
}
.dd-grid--has-expanded .chart-col:not(.chart-col--expanded) .chart-card{
  pointer-events:none;
}
.chart-card--expanded .dd-canvas{ min-height:260px; }
@media (min-width:960px){
  .chart-card--expanded .dd-canvas{ min-height:320px; }
}

/* Drilldown card alignment */
#drilldown .chart-card,
#drilldown .kpi-tile{
  display:flex;
  flex-direction:column;
  gap:6px;
}
#drilldown .kpi-tile,
#drilldown .metric-card{
  align-items:center;
  justify-content:center;
  text-align:center;
}
#drilldown .chart-card:not(.metric-card){
  align-items:stretch;
  justify-content:flex-start;
  text-align:left;
}
#drilldown .kpi-tile .kpi-title,
#drilldown .metric-card .stat-overline{
  justify-content:center;
  text-align:center;
}
#drilldown .kpi-value,
#drilldown .metric-card .kpi-value{
  font-weight:800;
  font-size:clamp(1.6rem,4vw,2.2rem);
  line-height:1.15;
  text-align:center;
  margin-top:6px;
}
#drilldown .chart-card:not(.metric-card) .stat-overline,
#drilldown .chart-card:not(.metric-card) .text-caption{
  text-align:left;
}
@media (min-width:960px){
  #drilldown .drill-wrap{ padding:28px 28px 32px !important; }
  #drilldown .dd-kpis{ margin:24px 0 !important; row-gap:16px !important; }
  #drilldown .dd-grid{ margin:28px 0 !important; row-gap:20px !important; }
  #drilldown .chart-card, #drilldown .kpi-tile{ padding:18px !important; }
  #drilldown .dd-canvas--heat{ margin-top:14px; }
}

/* RANGE PICKER STATES --------------------------------------------------- */
.range-picker .rp-toggle{ white-space:nowrap; }
.range-picker .rp-date{
  opacity:.86;
  cursor:default;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease,
    border-color 0.15s ease,
    opacity 0.15s ease;
}
.range-picker.is-live .rp-toggle{
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;
}
.range-picker .rp-date-live{ font-weight:600; }
.range-picker .rp-date-stale{
  opacity:.9;
  border-style:dashed;
}
.range-picker .rp-date-clickable{ cursor:pointer; }
.range-picker .rp-date-stale::after{
  content:" • jump to today";
  font-size:.75em;
  text-transform:uppercase;
  letter-spacing:.04em;
  opacity:.8;
  margin-left:4px;
}
.range-picker .rp-date-clickable:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(0,0,0,0.18);
}

/* SPARKLINES (LB + HERO) ----------------------------------------------- */
.lb-progress,
.hero-progress{
  position:relative;
  padding-top:4px;
  padding-bottom:4px;
}
.lb-progress .spark,
.hero-progress .spark{
  display:block;
}
.spark-bar{
  transform-origin:50% 100%;
  opacity:.7;
  transition:opacity 120ms ease-out;
}
.spark-bar.future{ opacity:.35; }
.lb-progress:hover .spark-bar,
.hero-progress:hover .spark-bar{ opacity:.4; }
.spark-bar.is-hovered{
  opacity:1 !important;
  stroke:rgba(255,255,255,0.85);
  stroke-width:0.4;
  animation: lbSparkInjected 520ms cubic-bezier(.25,.9,.45,1.2) infinite;
}
@keyframes lbSparkInjected{
  0%   { transform: translateY(0)       scaleY(1.00); }
  12%  { transform: translateY(-1.2px)  scaleY(1.10); }
  26%  { transform: translateY(0.8px)   scaleY(0.92); }
  46%  { transform: translateY(-0.6px)  scaleY(1.04); }
  70%  { transform: translateY(0.2px)   scaleY(0.98); }
  100% { transform: translateY(0)       scaleY(1.00); }
}

/* HOUR DETAIL CARD / DONUT --------------------------------------------- */
.lb-hour-card{
  position:relative;
  overflow:hidden;
  border-radius:18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,255,255,0.08), transparent 55%),
    radial-gradient(circle at 80% 120%, rgba(156,246,177,0.16), transparent 60%),
    #040509;
  border:1px solid rgba(255,255,255,0.07);
  box-shadow:
    0 32px 60px rgba(0,0,0,0.9),
    0 0 0 1px rgba(255,255,255,0.02);
}
.lb-hour-card::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:conic-gradient(
    from 180deg,
    rgba(156,246,177,0.20),
    rgba(167,139,250,0.18),
    rgba(255,208,138,0.26),
    transparent 70%
  );
  opacity:.35;
  mix-blend-mode:screen;
  filter:blur(20px);
  pointer-events:none;
}
.lb-hour-card > *{ position:relative; z-index:1; }
.lb-hour-card .v-card-title{ padding:14px 18px 4px; }
.lb-hour-card .v-card-text{ padding:10px 18px 18px; }
.lb-hour-card .headline{ letter-spacing:0.03em; }
.lb-hour-card .text-caption{ opacity:0.72; }

.lb-hour-donut{
  flex:0 0 86px;
  height:86px;
  border-radius:999px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(
    circle at 30% 25%,
    rgba(255,255,255,0.18),
    rgba(4,6,16,1) 70%
  );
  box-shadow:0 12px 32px rgba(0,0,0,0.9);
}
.lb-hour-donut::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  background:conic-gradient(
    from -90deg,
    var(--neon) 0 var(--donut-sweep, 0%),
    rgba(255,255,255,0.08) var(--donut-sweep, 0%) 100%
  );
  opacity:0.95;
  pointer-events:none;
}
.lb-hour-donut::after{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:inherit;
  background:radial-gradient(
    circle at 30% 20%,
    rgba(0,0,0,0.1),
    rgba(0,0,0,1)
  );
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.18),
    0 0 12px rgba(0,0,0,0.8);
  pointer-events:none;
}
.lb-hour-donut-center{
  position:relative;
  z-index:1;
  width:52px; height:52px;
  border-radius:50%;
  background:radial-gradient(
    circle at 30% 20%,
    rgba(255,255,255,0.12),
    rgba(4,7,20,1)
  );
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
.lb-hour-donut-pct{
  font-size:0.85rem;
  font-weight:600;
}
.lb-hour-donut-label{
  font-size:0.64rem;
  opacity:0.78;
}

/* HERO HOUR STORE HEADER ------------------------------------------------ */
.hero-hour-store-header{
  position:relative;
  border-radius:999px;
  overflow:hidden;
}
.hero-hour-store-main{
  position:relative !important;
  z-index:2 !important;
  padding:8px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.hero-hour-store-meta{
  display:flex;
  align-items:center;
}
.hero-hour-store-bar{
  background:rgba(255,255,255,.04);
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  pointer-events:none !important;
}
.hero-hour-store-bar-fill{
  width:0;
  position:absolute;
  inset:0;
  height:100%;
}

/* RANGE PICKER CHIP STATES (LIVE/STALLED) already above */

/* HERO CAROUSEL EDGE-TO-EDGE ON MOBILE --------------------------------- */
@media (max-width:600px){
  .hero-section .hero-container{
    padding-left:10 !important;
    padding-right:0 !important;
  }
  .hero-section .metrics-tray{
    margin-left:calc(-1 * var(--container-x, 16px));
    margin-right:calc(-1 * var(--container-x, 16px));
    border-radius:12px !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }
  .hero-section .hero-carousel{ width:100%; }
}

/* HIDE SECONDARY CTA ON VERY NARROW ------------------------------------ */
@media (max-width:424px){
  .btn-claim{ display:none !important; }
}

/* SCROLL REVEAL UTILITY ------------------------------------------------ */
.reveal-on-scroll{
  opacity:0;
  transform:translateY(28px) scale(0.985);
  transition:
    opacity .6s cubic-bezier(.17,.67,.4,1),
    transform .6s cubic-bezier(.17,.67,.4,1);
  will-change:opacity,transform;
}
.reveal-on-scroll.is-visible{
  opacity:1;
  transform:translateY(0) scale(1);
}
.stack-3 > .v-col:nth-child(1) .reveal-on-scroll { transition-delay:0.0s; }
.stack-3 > .v-col:nth-child(2) .reveal-on-scroll { transition-delay:0.08s; }
.stack-3 > .v-col:nth-child(3) .reveal-on-scroll { transition-delay:0.16s; }

/* CHAT AREA (AVATARS, TAGS, COMPOSER) ---------------------------------- */
/* Avatar strip */
.chat-header{
  background:radial-gradient(circle at top left,
    rgba(255,255,255,0.08),
    transparent 55%
  );
  border-radius:18px;
}
.chat-avatar-strip-wrap{ flex:1 1 auto; overflow:hidden; }
.chat-avatar-strip{
  flex-wrap:nowrap;
  -ms-overflow-style:none;
  flex:1 1 auto;
  display:flex;
  align-items:center;
  gap:12px;
  padding:4px 6px;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
.chat-avatar-strip::-webkit-scrollbar{ display:none; }
.chat-avatar-strip .avatar{
  transition:transform 0.15s ease, box-shadow 0.15s ease;
  flex:0 0 auto;
  width:44px; height:44px;
  border-radius:50%;
  border:2px solid rgba(156,246,177,0.7);
  box-shadow:0 0 0 1px rgba(0,0,0,.8);
  overflow:hidden;
  position:relative;
}
.chat-avatar-strip .avatar.online{
  box-shadow:
    0 0 0 1px rgba(0,0,0,.9),
    0 0 12px rgba(156,246,177,0.5);
}
.chat-avatar-strip .avatar img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}

/* Chat row layout */
.chat-message-row{
  transition:all 0.18s ease-out;
  display:flex;
  align-items:flex-start;
  padding:10px 14px;
  margin-bottom:6px;
  border-radius:14px;
  background:radial-gradient(circle at top left,
    rgba(255,255,255,0.06),
    rgba(0,0,0,0.9)
  );
}
.chat-message-row + .chat-message-row{ margin-top:6px; }
.chat-message-row:hover{
  box-shadow:0 8px 24px rgba(0,0,0,0.45);
  transform:translateY(-1px);
  background:rgba(255,255,255,0.02);
}

.chat-message-avatar{
  width:40px; height:40px;
  border-radius:999px;
  overflow:hidden;
  box-shadow:0 0 0 2px rgba(0,0,0,.75);
  flex:0 0 40px;
  margin-right:12px;
}
.chat-message-avatar img{
  width:40px; height:40px;
  border-radius:50%;
  object-fit:cover;
  display:block;
  border:2px solid rgba(255,255,255,0.12);
}

.chat-message-body{ flex:1 1 auto; min-width:0; }
.chat-message-meta{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:2px;
}
.chat-message-user{
  color:#fff;
  font-family: var(--font-display, 'Rajdhani', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  font-weight:600;
  font-size:.9rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.chat-message-text{
  opacity:.95;
  white-space:pre-wrap;
  margin-top:4px;
  font-family:var(--font-body, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
  font-size:.86rem;
  line-height:1.45;
  color:rgba(255,255,255,0.88);
}
.chat-message-time{
  margin-left:auto;
  font-size:.7rem;
  opacity:.7;
}

/* Chat media */
.chat-media-card{
  display:inline-block;
  max-width:260px;
  border-radius:10px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(0,0,0,0.6);
}
.chat-media-card img,
.chat-media-card video{
  border-radius:12px;
  border:1px solid var(--border);
  box-shadow:0 8px 20px rgba(0,0,0,0.28);
  width:100%;
  max-height:260px;
  object-fit:cover;
  display:block;
}

/* Chat transitions */
.chat-list-enter-active,
.chat-list-leave-active{
  transition:all 0.18s ease-out;
}
.chat-list-enter,
.chat-list-leave-to{
  opacity:0;
  transform:translateY(6px);
}
.chat-list-move{ transition:transform 0.15s ease-out; }

/* Composer + tag strip */
.chat-composer{
  position:relative;
  z-index:20;
  overflow:visible !important;
}
.chat-stream{
  border-radius:18px;
  position:relative;
  z-index:1;
}
.chat-tag-strip-wrap{ flex:1 1 auto; overflow:hidden; max-width:420px; }
.chat-tag-strip{
  display:flex;
  flex-wrap:nowrap;
  overflow-x:auto;
  padding-bottom:2px;
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.chat-tag-strip::-webkit-scrollbar{ display:none; }
.chat-tag-nav{ min-width:28px; }

.post-tag-chip.v-chip{
  position:relative;
  overflow:visible !important;
  cursor:pointer;
  transition:
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}
.post-tag-chip--selected{
  background:rgba(255,255,255,0.06);
  transform:translateY(-1px);
  box-shadow:0 0 0 1px #bb86ff;
}
.post-tag-chip::after{
  /* base sheen is invisible unless .post-tag-chip--selected, but left blank here */
}
.post-tag-count{
  position:absolute;
  top:-8px; right:-6px;
  padding:2px 6px;
  font-size:10px;
  line-height:1;
  border-radius:999px;
  background:#ff3f7c;
  color:#fff;
  z-index:5;
}

/* Tag suggestions popover */
.chat-tag-input-wrap{
  position:relative;
  z-index:30;
}
.tag-suggest-popover{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  min-width:260px;
  max-width:360px;
  z-index:40;
  margin-top:4px;
  padding:6px 8px;
  font-size:12px;
}
.tag-suggest-pop-enter-active,
.tag-suggest-pop-leave-active{
  transition:opacity .18s ease-out, transform .18s ease-out;
}
.tag-suggest-pop-enter,
.tag-suggest-pop-leave-to{
  opacity:0;
  transform:translateY(-4px);
}
.tag-suggest-list{ display:flex; flex-direction:column; }
.tag-suggest-row,
.tag-suggest-create{
  background:transparent;
  border:none;
  text-align:left;
  padding:6px 4px;
  width:100%;
  cursor:pointer;
}
.tag-suggest-row:hover,
.tag-suggest-create:hover{ opacity:.9; }

/* In-message clickable tags + shimmer hint ----------------------------- */
.chat-message-body .clickable-tag{
  position:relative;
  overflow:hidden;
  cursor:pointer;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}
.chat-message-body .clickable-tag:hover{
  transform:translateY(-1px);
  box-shadow:0 0 0 1px rgba(159,122,255,0.6);
}
.chat-message-body .clickable-tag::after{
  content:"";
  position:absolute;
  top:0; left:-130%;
  width:50%; height:100%;
  background:linear-gradient(
    120deg,
    transparent,
    rgba(255,255,255,0.28),
    transparent
  );
  transform:skewX(-25deg);
  opacity:0;
  pointer-events:none;
  animation:tag-sheen 2.4s ease-in-out infinite;
}
.chat-message-body .clickable-tag-hint::after{
  opacity:1;
}
@keyframes tag-sheen{
  0%   { transform:translateX(-130%) skewX(-25deg); }
  20%  { transform:translateX(130%)  skewX(-25deg); }
  100% { transform:translateX(130%)  skewX(-25deg); }
}

/* Composer “current tag” chip */
.v-chip.chip-post-selected{
  background-color:rgba(164,116,255,0.18);
  border-color:#a474ff !important;
}
.v-chip.chip-post-current{
  background-color:rgba(255,255,255,0.08);
  border-color:transparent;
}

/* ACTIVE FILTER CHIP IN FEED ------------------------------------------- */
.v-chip.active-filter-chip{
  background-color:rgba(164,116,255,0.12);
  border-color:#a474ff !important;
}

/* “You” hero layout tweak (desktop offset) ----------------------------- */
@media (min-width:601px){
  .you-avatar__core{ margin-left:56px !important; }
}

/* FINAL: FOOTER DISABLE WHEN DRAWER OPEN ------------------------------- */
.ops-footer{
  position:relative;
  z-index:10;
}
.footer-disabled{
  pointer-events:none !important;
  opacity:0.65;
}

/* SETTINGS DRAWER (LEADERBOARD) ---------------------------------------- */
.v-navigation-drawer.lb-drawer{
  position:fixed !important;
  z-index:4000 !important;
}
.lb-drawer .v-navigation-drawer{
  background: rgba(2,0,4,.96) !important;
  border-left: 1px solid var(--border) !important;
  backdrop-filter: blur(8px);
}
.lb-drawer .drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid var(--border);
}
.lb-drawer .drawer-title{
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  font-size:.95rem;
}
.lb-drawer .drawer-body{
  padding:14px 16px;
  display:grid;
  gap:14px;
}
#leaderboard .lb-wrap{ --spark-h:64px; }
@media (max-width:600px){
  .lb-progress .spark{ height:var(--spark-h); }
}
.btn-cog.is-open{
  box-shadow:0 0 10px rgba(255,255,255,.25) inset;
}

/* HIDE SECOND CTA ON narrow already above */

/* END OF DEDUPED SHEET -------------------------------------------------- */
  #drilldown .dd-grid {
    position: relative;
  }

  #drilldown .dd-grid .chart-col {
    transition: flex-basis 260ms cubic-bezier(0.4, 0, 0.2, 1),
      max-width 260ms cubic-bezier(0.4, 0, 0.2, 1),
      order 260ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  #drilldown .dd-grid .chart-card {
    transition: box-shadow 260ms cubic-bezier(0.4, 0, 0.2, 1),
      transform 260ms cubic-bezier(0.4, 0, 0.2, 1);
  }

  #drilldown .dd-debug-btn {
    opacity: 0.7;
  }

  #drilldown .dd-debug-btn:hover {
    opacity: 1;
  }

  #drilldown .dd-trend-days-btn {
    min-width: 0;
    padding: 0 8px;
    text-transform: none;
    font-size: 11px;
  }

  #drilldown .dd-trend-days-menu {
    min-width: 240px;
  }

  /* ✅ Push the action buttons (ladybug + green expand) all the way right */
  #drilldown .chart-head-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
  }
	
	/* HERO MONEY ROW (reusable pattern) ------------------------------------ */
.stat-money-row {
  margin-top: 8px;
  margin-bottom: 4px;
  display: flex;
  justify-content: center;
  align-items: baseline;
  overflow: visible; /* don't clip the digits */
}

.stat-money {
  display: flex;
  align-items: baseline;
  gap: 0.35rem;
  white-space: nowrap;
}

/* $ symbol */
.money-currency {
  font-weight: 900;
  line-height: 1;
  font-size: clamp(1.2rem, 1.6vw, 1.6rem);
  transform: translateY(2px); /* tucks it down slightly */
}

/* main number */
.money-value {
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  font-size: clamp(2.0rem, 2.8vw, 2.6rem);
}

/* odometer wrapper */
.od-wrap {
  white-space: nowrap;
}

/* mobile tuning */
@media (max-width: 960px) {
  .money-value {
    font-size: clamp(1.9rem, 6.4vw, 2.3rem);
  }
  .money-currency {
    font-size: clamp(1.1rem, 4.6vw, 1.4rem);
  }
}
/* Ensure hero stat cards never clip bottom text */
.hero-carousel .stat-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* <-- KEY: allocates space for the bottom text */
  height: 100% !important;        /* fills the v-carousel height */
  overflow: visible;              /* prevents accidental clipping */
}

/* Caption row: allow wrap + visible space */
.hero-spark-caption {
  margin-top: 6px;
  white-space: normal !important;
  text-align: center;
}
/* Make sure the % line is horizontally centered inside fit-line */
.hero-carousel .fit-line {
  display: flex;
  justify-content: center;
}
/* Leaderboard sparkline sizing */
.lb-table .lb-progress .spark {
  display: block;
  width: 100%;                    /* fill the entire cell width */
  height: var(--lb-row-spark-height, 70px);
}
.pillar-list {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: auto;
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.ops-core-pillars .pillar-list { padding-top: 14px; }

.pillar-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: rgba(255,255,255,.9);
  font-family: 'Rajdhani', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 600;
  letter-spacing: .03em;
  font-size: .9rem;
  line-height: 1.5;
  padding: 6px 0;
}

.ops-core-pillars .pillar-list li {
  padding: 7px 0;
}

/* nudge icons down so text baseline feels cleaner */
.ops-core-pillars .pillar-list li .v-icon {
  transform: translateY(1px);
}

/* desktop: give each bullet row a consistent “slot” height so rows line up */
@media (min-width: 960px) {
  .ops-core-pillars .pillar-list li {
    min-height: 2.6em; /* ~2 lines worth; keeps bullets visually linear across the 3 cards */
  }
}
/* CONNECT. TRACK. CONQUER. bullets ------------------------- */

.neat-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.neat-list li {
  position: relative;
  padding: 5px 0 5px 18px;
  font-family: 'Rajdhani', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 600;
  letter-spacing: .03em;
  font-size: .9rem;
  line-height: 1.55;
  color: rgba(255,255,255,.9);
}

/* custom bullet dot */
.neat-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: .4em;
  font-size: .8em;
  opacity: .8;
}

@media (min-width: 960px) {
  .neat-list li {
    padding-top: 7px;
    padding-bottom: 7px; /* a bit more vertical spacing on desktop */
  }
}
.fc-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,0.95);
  padding: 6px 0;
  font-family: 'Rajdhani', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-weight: 600;
  letter-spacing: .03em;
  font-size: .9rem;
  line-height: 1.5;
}

.fc-item .v-icon {
  color: #fff;
  opacity: .95;
  transform: translateY(-1px);
}