/* ============================================================================
   BodyStats TV Dashboard — styles lifted from design/mockup_v2.html <style>
   v1.0.0
   NOTE: the .intro-shimmer mask-image URL is injected inline by the PHP
   shortcode (wp_add_inline_style), because asset paths depend on plugin_url().
   ============================================================================ */

@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&display=swap");

:root{
  --forest:#2F4237; --forest-2:#3a5143; --forest-deep:#243429; --ink:#1C1C1A;
  --bone:#EFECE6;   --warm:#FAF7F2;     --stone:#D8D2C7;
  --gold:#B08B4F;   --gold-warm:#c9a165; --sage:#6B7A5A;
  --silver:#B8B5AD; --bronze:#8C6A42;   --terra:#A85A3C;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{
  width:100%;height:100%;overflow:hidden;
  background:#0b1210;color:var(--ink);
  font-family:'Outfit',sans-serif;-webkit-font-smoothing:antialiased;
}
#stage{
  position:fixed;left:50%;top:50%;
  width:1920px;height:1080px;
  transform:translate(-50%,-50%) scale(var(--sc,1));
  transform-origin:center;
  background:var(--bone);overflow:hidden;
  transition:background .5s ease;
}
#stage.dark{background:var(--forest);}

/* ---------- Scan-line ambient ---------- */
#scanline{
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(107,122,90,.5),transparent);
  filter:blur(1px);opacity:.22;
  z-index:6;pointer-events:none;
  animation:scansweep 8s linear infinite;
}
#stage.dark #scanline{opacity:0;}
@keyframes scansweep{
  0%  {transform:translateY(0);opacity:0;}
  8%  {opacity:.22;}
  92% {opacity:.22;}
  100%{transform:translateY(1080px);opacity:0;}
}

.hud{position:absolute;z-index:40;pointer-events:none;}

/* Activity chip (top-left) */
#activityChip{top:54px;left:60px;display:flex;align-items:center;gap:16px;}
#activityChip .dot{
  width:9px;height:9px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 0 0 rgba(176,139,79,.55);
}
#activityChip .dot.beat{animation:heartbeatDot 1s ease-in-out infinite;}
@keyframes heartbeatDot{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(176,139,79,.45);}
  45%    {transform:scale(1.25);box-shadow:0 0 0 7px rgba(176,139,79,0);}
}
#activityChip .stack{display:flex;flex-direction:row;align-items:baseline;gap:14px;line-height:1;}
#activityChip .stack .l1::after{
  content:"\00B7";margin-left:14px;color:var(--gold);opacity:.55;font-weight:400;
}
#activityChip .l1, #activityChip .l2{
  font-family:'Outfit';font-weight:500;
  letter-spacing:.28em;text-transform:uppercase;color:var(--forest);
  transition:color .4s ease;white-space:nowrap;
}
#stage.dark #activityChip .l1, #stage.dark #activityChip .l2{color:var(--bone);}
#activityChip .l1{font-size:15px;opacity:.92;}
#activityChip .l2{font-size:15px;color:var(--sage);opacity:.85;}
#stage.dark #activityChip .l2{color:var(--gold-warm);}
#activityChip .num{font-weight:600;color:var(--forest);}
#stage.dark #activityChip .num{color:var(--bone);}
#activityChip .num.pulse{animation:numPulse .7s ease-out;}
@keyframes numPulse{
  0%  {transform:translateY(0) scale(1);color:var(--gold);}
  40% {transform:translateY(-1px) scale(1.08);color:var(--gold);}
  100%{transform:translateY(0) scale(1);color:inherit;}
}
#activityChip .num{display:inline-block;}

/* Clock (top-right) */
#liveCluster{top:54px;right:60px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
#liveClock{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:28px;
  color:var(--forest);opacity:.95;letter-spacing:-.01em;
  transition:color .4s ease;
}
#stage.dark #liveClock{color:var(--bone);}

/* Toasts */
#toastStack{
  position:absolute;bottom:110px;right:60px;z-index:42;
  display:flex;flex-direction:column-reverse;gap:14px;align-items:flex-end;
  pointer-events:none;
}
.toast{
  min-width:300px;max-width:360px;
  background:var(--warm);border:1px solid var(--stone);
  padding:14px 22px 16px;border-radius:4px;
  box-shadow:0 8px 24px rgba(47,66,55,.08);
  opacity:0;transform:translateX(40px);
  position:relative;
}
.toast::after{
  content:"";position:absolute;left:22px;right:22px;bottom:10px;
  height:1px;background:var(--gold);opacity:.55;
}
.toast .cap{
  font-family:'Outfit';font-weight:500;font-size:11px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--sage);
  margin-bottom:6px;
}
.toast .line{
  font-family:'Outfit',sans-serif;font-weight:600;font-size:22px;
  color:var(--forest);letter-spacing:-.015em;
}
.toast .line em{font-style:normal;color:var(--gold);font-weight:600;}

#syncStamp{
  position:fixed;right:10px;top:22px;z-index:40;pointer-events:none;
  font-family:'Outfit';font-weight:500;font-size:11px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--sage);opacity:.7;
  transition:color .4s ease;
}
#stage.dark #syncStamp{color:var(--gold-warm);}

#wordmark{bottom:100px;left:60px;display:flex;align-items:center;gap:18px;}
#wordmark .mark-img{
  width:auto;height:52px;display:block;
  transform:translateY(-2px);
  transform-origin:center;
  transition:filter .4s ease;
}
#stage.dark #wordmark .mark-img{filter:brightness(0) invert(1);}
#wordmark .name{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:28px;
  letter-spacing:.05em;text-transform:uppercase;color:var(--forest);line-height:1;
  transition:color .4s ease;
}
#stage.dark #wordmark .name{color:var(--bone);}

/* Ticker */
#ticker{
  position:fixed;left:0;right:0;bottom:0;width:100vw;height:60px;z-index:9999;
  background:var(--forest);color:var(--bone);
  display:flex;align-items:center;overflow:hidden;
  border-top:1px solid rgba(176,139,79,.35);
  transition:box-shadow .5s ease, border-top-color .5s ease;
}
#stage.dark ~ #ticker, #stage.dark #ticker{
  border-top-color:rgba(176,139,79,.9);
  box-shadow:0 -14px 30px -10px rgba(176,139,79,.35),
             0 -1px 0 rgba(176,139,79,.55);
}
#ticker .track{
  display:flex;gap:80px;white-space:nowrap;
  font-family:'Outfit';font-weight:500;font-size:20px;
  letter-spacing:.12em;
  padding-left:100%;animation:tick 90s linear infinite;
}
#ticker .track span{display:inline-flex;align-items:center;gap:14px;}
#ticker .track .pip{color:var(--gold);}
#ticker .track .lead{color:var(--gold);font-weight:600;}
@keyframes tick{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ---------- Chapter stage ---------- */
#chapterStage{position:absolute;inset:0;z-index:10;}
.chapter{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;
  perspective:1400px;
}
.chapter.active{opacity:1;visibility:visible;}
.chapter.dark-ch{color:var(--bone);}

/* ---------- Chapter photo background ---------- */
.chapter-bg{
  position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;
}
.chapter-bg .photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;
  filter:saturate(.3) contrast(.9) brightness(1.05);
  transform:scale(1.02);
  animation:chapterBgKenburns 11s ease-in-out forwards;
  will-change:transform;
}
.chapter-bg::after{
  content:"";position:absolute;inset:0;
  background:rgba(239,236,230,.90);
}
.chapter.dark-ch .chapter-bg .photo{
  filter:saturate(.25) brightness(.55) sepia(.1);
  animation:chapterBgKenburnsDark 11s ease-in-out forwards;
}
.chapter.dark-ch .chapter-bg::after{
  background:linear-gradient(180deg,rgba(47,66,55,.80) 0%, rgba(36,52,41,.82) 100%);
}
@keyframes chapterBgKenburns{
  0%  {transform:scale(1.02) translate(0,0);}
  100%{transform:scale(1.06) translate(-.6%,.4%);}
}
@keyframes chapterBgKenburnsDark{
  0%  {transform:scale(1.02) translate(0,0);}
  100%{transform:scale(1.06) translate(-.6%,.4%);}
}
.chapter .board,
.chapter .agl,
.chapter .hero-grid-wrap,
.chapter .cm{
  position:relative;z-index:2;
}
.chapter .kb{ z-index:1; }

/* ---------- Transition overlays ---------- */
#transitionFX{
  position:absolute;inset:0;z-index:60;pointer-events:none;overflow:hidden;
}
.fx-wipe{
  position:absolute;inset:0;background:var(--forest);
  transform:translateX(-100%);
}
.fx-split-top,.fx-split-bot{
  position:absolute;left:0;right:0;height:50%;background:var(--forest);
}
.fx-split-top{top:0;transform:translateY(-100%);}
.fx-split-bot{bottom:0;transform:translateY(100%);}
.fx-mask{
  position:absolute;inset:0;background:var(--forest);
  clip-path:circle(0% at 50% 50%);
}

/* ---------- Intro (DARK) ---------- */
.intro-simple{
  position:relative;z-index:3;text-align:center;color:var(--bone);
  display:flex;flex-direction:column;align-items:center;gap:26px;
}
.intro-simple .is-pre{
  font-family:'Outfit';font-weight:500;font-size:44px;line-height:1;
  letter-spacing:.24em;text-transform:uppercase;color:var(--gold-warm);opacity:.95;
}
.intro-simple .is-mark{
  width:180px;height:auto;
  filter:brightness(0) invert(1);
  opacity:.95;
}
.intro-simple .is-name{
  font-family:'Outfit',sans-serif;font-weight:800;font-size:160px;line-height:.9;
  letter-spacing:-.015em;color:var(--bone);
  text-shadow:0 10px 50px rgba(0,0,0,.4);
}
.intro-wrap{
  display:flex;flex-direction:column;align-items:center;gap:40px;text-align:center;
  position:relative;z-index:3;
}
.intro-bg{
  position:absolute;inset:0;z-index:1;overflow:hidden;
}
.intro-bg .photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:0;
  filter:saturate(.35) brightness(.55) sepia(.15) hue-rotate(60deg);
  animation:kenburnsSlow 7s ease-in-out forwards;
}
.intro-bg::after{
  content:"";position:absolute;inset:0;z-index:2;
  background:linear-gradient(180deg,rgba(47,66,55,.78) 0%, rgba(36,52,41,.88) 100%);
}
@keyframes kenburnsSlow{
  0%  {transform:scale(1.05) translate(0,0);opacity:0;}
  10% {opacity:1;}
  100%{transform:scale(1.18) translate(-1.5%,1%);opacity:1;}
}
.intro-logo{
  position:relative;width:320px;height:320px;
  display:flex;align-items:center;justify-content:center;
}
.intro-mark{
  width:100%;height:100%;object-fit:contain;display:block;
  filter:brightness(0) invert(1);
}
.intro-shimmer{
  position:absolute;inset:0;pointer-events:none;border-radius:50%;
  background:linear-gradient(110deg,
    transparent 35%,rgba(201,161,101,0.00) 42%,
    rgba(201,161,101,0.75) 50%,
    rgba(201,161,101,0.00) 58%,transparent 65%);
  background-size:260% 100%;background-position:220% 0;
  mix-blend-mode:screen;opacity:0;
  -webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;
  mask-repeat:no-repeat;mask-size:contain;mask-position:center;
  /* mask-image injected inline by PHP (wp_add_inline_style) */
}
.intro-logo.shimmer-run .intro-shimmer{
  animation:introShimmer 1.6s cubic-bezier(.4,.1,.3,1) forwards;
}
@keyframes introShimmer{
  0%  {background-position:220% 0;opacity:0;}
  15% {opacity:1;}
  85% {opacity:1;}
  100%{background-position:-120% 0;opacity:0;}
}
.intro-wordmark{
  font-family:'Outfit',sans-serif;font-weight:800;
  font-size:104px;letter-spacing:.05em;text-transform:uppercase;
  color:#fff;line-height:1;
  position:relative;
}
.intro-wordmark::after{
  content:"";display:block;width:120px;height:2px;background:var(--gold);
  margin:18px auto 0;opacity:.9;
}
.intro-tag{
  font-family:'Outfit',sans-serif;font-weight:500;
  font-size:34px;color:#fff;opacity:1;max-width:1100px;
  letter-spacing:-.01em;
}
.intro-loc{
  font-family:'Outfit';font-weight:500;font-size:20px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:18px;
}
.intro-loc i{display:inline-block;width:46px;height:1px;background:var(--gold);}

/* ---------- Hero grid (SINCE WE OPENED) ---------- */
.hero-grid-wrap{
  width:100%;padding:0 120px;display:flex;flex-direction:column;
  align-items:center;gap:32px;transform-style:preserve-3d;
}
.hero-greet{
  font-family:'Outfit',sans-serif;font-weight:500;
  font-size:20px;letter-spacing:.42em;text-transform:uppercase;
  color:var(--sage);opacity:0;
}
.hero-greet .sep{color:var(--gold);margin:0 14px;opacity:.7;}
.hero-grid-kicker{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:24px;
  letter-spacing:.36em;text-transform:uppercase;color:var(--sage);
  display:flex;align-items:center;gap:20px;
}
.hero-grid-kicker i{display:inline-block;width:80px;height:1px;background:var(--gold);}
.hero-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:40px 60px;width:100%;max-width:1680px;
  transform-style:preserve-3d;
}
.hero-grid.five-tiles{grid-template-columns:repeat(6,1fr);}
.hero-grid.five-tiles .hero-tile:nth-child(1){grid-column:1 / span 2;}
.hero-grid.five-tiles .hero-tile:nth-child(2){grid-column:3 / span 2;}
.hero-grid.five-tiles .hero-tile:nth-child(3){grid-column:5 / span 2;}
.hero-grid.five-tiles .hero-tile:nth-child(4){grid-column:2 / span 2;}
.hero-grid.five-tiles .hero-tile:nth-child(5){grid-column:4 / span 2;}
.hero-tile{
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;
  padding:22px 12px;border-top:1px solid var(--stone);
  transform-style:preserve-3d;
  will-change:transform;
  min-width:0;
}
.hero-tile .big{
  font-family:'Outfit',sans-serif;font-weight:700;
  font-size:84px;line-height:.92;letter-spacing:-.035em;color:var(--forest);
  display:flex;align-items:flex-end;gap:12px;justify-content:center;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.hero-tile .big .count{
  display:inline-flex;
  text-shadow:0 1px 0 rgba(47,66,55,.06);
}
.hero-tile .big .unit{
  font-family:'Outfit',sans-serif;
  font-size:22px;font-weight:500;
  color:var(--sage);padding-bottom:14px;letter-spacing:.08em;text-transform:uppercase;
}
.hero-tile .lbl{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:18px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--ink);opacity:.75;
}

/* Split-flap digit */
.flap{
  display:inline-block;position:relative;overflow:hidden;
  font-variant-numeric:tabular-nums;
  line-height:.92;
  min-width:.6em;
  text-align:center;
}
.flap .stream{
  display:block;will-change:transform;
  transform:translateY(0);
}
.flap .stream > span{display:block;}

/* ---------- Leaderboards ---------- */
.board{
  display:grid;grid-template-columns: 1fr;
  width:100%;height:100%;padding:130px 100px 130px;align-content:start;
}

/* Stacked layout: M on top, F on bottom, shared title at top */
.board.board-split{padding:90px 100px 120px;}
.board-split .board-head{margin-bottom:20px;}
.board-split .board-head .title{font-size:60px;}
.board-halves{
  display:grid;grid-template-rows:1fr 1px 1fr;gap:22px;
  align-items:start;
}
.board-half{display:flex;flex-direction:column;gap:12px;min-width:0;}
.half-label{
  display:flex;align-items:center;gap:10px;
  font-family:'Outfit';font-weight:500;font-size:14px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--forest);opacity:.85;
}
.half-label .ring{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;
  font-family:'Outfit';font-weight:700;font-size:11px;letter-spacing:.02em;
  color:var(--warm);
}
.half-label .ring.m{background:var(--sage);}
.half-label .ring.f{background:var(--gold);}
.half-divider{
  height:1px;width:100%;background:var(--stone);opacity:.7;
}
.board-split .board-triptych{gap:0;}
.board-split .board-col{padding:0 24px;}
.board-split .board-col:first-child{padding-left:0;}
.board-split .board-col:last-child{padding-right:0;}
.board-split .board-col .row .value{font-size:28px;}
.board-split .board-col .row{height:52px;padding:0 14px;}
.board-split .col-head .lbl{font-size:15px;letter-spacing:.28em;}
.board-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  border-bottom:1px solid var(--stone);padding-bottom:22px;margin-bottom:30px;
}
.board-head .title{
  font-family:'Outfit',sans-serif;font-weight:600;font-size:68px;line-height:1;
  color:var(--forest);letter-spacing:-.025em;
}
.board-head .title em{font-style:normal;color:var(--gold);font-weight:700;}

.board-triptych{
  display:grid;grid-template-columns:1fr 1fr 1fr;
  gap:0;margin-top:8px;
}
.board-col{
  padding:0 36px;
  border-right:1px solid var(--stone);
  display:flex;flex-direction:column;gap:18px;
}
.board-col:first-child{padding-left:0;}
.board-col:last-child{padding-right:0;border-right:none;}
.col-head{
  display:flex;align-items:center;gap:12px;
  padding-bottom:14px;margin-bottom:6px;
  border-bottom:1px solid var(--stone);
}
.col-head .lbl{
  font-family:'Outfit';font-weight:500;font-size:18px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--forest);opacity:.78;
}
.col-head .dot{
  width:6px;height:6px;border-radius:50%;background:var(--gold);opacity:0;
}
.col-head.recent .dot{opacity:1;}
.col-head .underline{flex:1;height:1px;background:var(--sage);opacity:.25;}

.board-col .row{
  position:relative;
  display:grid;grid-template-columns:1fr auto;
  align-items:center;height:56px;padding:0 16px;
  background:var(--warm);border:1px solid var(--stone);border-radius:10px;
  gap:12px;
}
.board-col .row .ident{
  display:flex;align-items:center;gap:10px;font-size:22px;
  min-width:0;flex-wrap:nowrap;
}
.board-col .row .ident .age{
  font-family:'Outfit',sans-serif;font-weight:500;color:var(--forest);
  letter-spacing:-.005em;white-space:nowrap;
}
.board-col .row .value{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:34px;
  color:var(--forest);letter-spacing:-.025em;
  text-align:right;
}
.board-col .row .value .u{
  font-family:'Outfit';font-size:12px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--sage);margin-left:6px;
}
.board-col .medal{
  width:32px;height:32px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:'Outfit',sans-serif;font-weight:700;font-size:15px;
  color:var(--warm);margin-right:4px;position:relative;letter-spacing:-.01em;
}
.board-col .medal.g{background:var(--gold);}
.board-col .medal.s{background:var(--silver);}
.board-col .medal.b{background:var(--bronze);}
.board-col .medal.g::after{
  content:"";position:absolute;inset:-2px;border-radius:50%;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);
  background-size:250% 100%;background-position:200% 0;
  animation:shimmer 3.2s linear infinite;mix-blend-mode:overlay;
}
@keyframes shimmer{to{background-position:-50% 0;}}
.board-col .rank-chip{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;
  background:transparent;border:1px solid var(--stone);
  font-family:'Outfit',sans-serif;font-weight:500;font-size:12px;
  letter-spacing:.14em;color:var(--sage);margin-right:4px;
}

.move{
  display:inline-flex;align-items:center;gap:2px;
  font-family:'Outfit',sans-serif;font-weight:500;font-size:13px;
  letter-spacing:.04em;min-width:32px;
}
.move.up{color:var(--sage);}
.move.down{color:var(--terra);}
.move.same{color:var(--silver);}
.move.new{color:var(--gold);}
.move .arrow{font-size:13px;line-height:1;}
.move .n{font-variant-numeric:tabular-nums;}

.retBadge{
  display:inline-flex;align-items:center;gap:4px;
  font-family:'Outfit',sans-serif;font-weight:500;font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--sage);
  padding:2px 7px;border-radius:3px;
  background:rgba(107,122,90,.09);border:1px solid rgba(107,122,90,.22);
  line-height:1;white-space:nowrap;
}
.retBadge .g{font-size:12px;line-height:1;}

.newTag{
  position:absolute;top:-9px;right:-8px;
  font-family:'Outfit';font-weight:700;font-size:9px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--warm);
  background:var(--gold);padding:2px 6px;border-radius:3px;
  opacity:0;pointer-events:none;
  box-shadow:0 3px 10px rgba(176,139,79,.38);
  z-index:3;
}

/* ---------- Age-group leaders ---------- */
.agl{
  width:100%;height:100%;padding:120px 100px 130px;
  display:flex;flex-direction:column;align-items:stretch;
  transform-style:preserve-3d;
}
.agl-head{
  border-bottom:1px solid var(--stone);
  padding-bottom:22px;margin-bottom:38px;
  display:flex;flex-direction:column;gap:10px;
}
.agl-head .kicker{
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:16px;
}
.agl-head .kicker i{display:inline-block;width:44px;height:1px;background:var(--gold);opacity:.7;}
.agl-head .title{
  font-family:'Outfit',sans-serif;font-weight:600;font-size:60px;line-height:1;
  color:var(--forest);letter-spacing:-.025em;
}
.agl-head .title em{font-style:normal;color:var(--gold);font-weight:700;}
.agl-grid{
  display:grid;grid-template-columns:repeat(5,1fr);
  grid-template-rows:auto auto;
  gap:22px 22px;
  transform-style:preserve-3d;
}
.agl-sexlabel{
  grid-column:1 / -1;
  font-family:'Outfit';font-weight:500;font-size:14px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--sage);
  border-bottom:1px dotted var(--stone);padding-bottom:10px;margin-bottom:4px;
}
.agl-tile{
  background:var(--warm);border:1px solid var(--stone);
  border-top:3px solid var(--sage);
  border-radius:10px;padding:22px 20px 20px;
  display:flex;flex-direction:column;gap:10px;min-height:148px;
  transform-style:preserve-3d;
  will-change:transform;
  box-shadow:
    0 10px 24px -16px rgba(47,66,55,.28),
    inset 0 1px 0 rgba(255,255,255,.4);
}
.agl-tile.women{border-top-color:var(--gold);}
.agl-tile .bucket{
  font-family:'Outfit';font-weight:500;font-size:13px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--sage);
}
.agl-tile .val{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:52px;line-height:1;
  color:var(--forest);letter-spacing:-.03em;
  display:flex;align-items:flex-end;gap:8px;
}
.agl-tile .val .u{
  font-family:'Outfit';font-size:12px;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--sage);
  padding-bottom:8px;
}
.agl-tile .age{
  font-family:'Outfit';font-weight:500;font-size:14px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ink);opacity:.7;
}

/* ---------- Community Milestones (DARK) ---------- */
.cm{
  width:100%;height:100%;padding:0 140px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:56px;
  position:relative;text-align:center;
  color:var(--bone);
}
.cm .kicker{
  font-family:'Outfit';font-weight:500;font-size:22px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:22px;
}
.cm .kicker i{display:inline-block;width:56px;height:1px;background:var(--gold);}
.cm-row{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:80px;width:100%;max-width:1680px;
  position:relative;padding-bottom:28px;
}
.cm-row::after{
  content:"";position:absolute;left:25%;right:25%;bottom:0;height:1px;
  background:var(--gold);opacity:.8;
}
.cm-stat{display:flex;flex-direction:column;align-items:center;gap:14px;opacity:0;}
.cm-stat .n{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:96px;line-height:.95;
  letter-spacing:-.025em;color:var(--bone);
}
.cm-stat .lbl{
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--bone);opacity:.75;
}
.cm-warm{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:30px;
  color:var(--bone);opacity:.85;letter-spacing:-.01em;
}

/* ---------- Client Spotlight (DARK) ---------- */
.spotlight{
  width:100%;height:100%;padding:90px 140px 140px;
  display:flex;flex-direction:column;align-items:center;gap:32px;
  position:relative;color:var(--bone);text-align:center;
}
.sp-head{display:flex;flex-direction:column;align-items:center;gap:12px;}
.sp-kicker{
  font-family:'Outfit';font-weight:500;font-size:18px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:20px;
}
.sp-kicker i{display:inline-block;width:56px;height:1px;background:var(--gold);opacity:.8;}
.sp-title{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:56px;line-height:1;
  color:var(--bone);letter-spacing:-.02em;
}
.sp-title em{font-style:normal;color:var(--gold);font-weight:700;}
.sp-cred{
  font-family:'Outfit';font-weight:500;font-size:11px;
  letter-spacing:.38em;text-transform:uppercase;color:var(--gold);opacity:.75;
}
.sp-scans{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:48px;width:100%;max-width:1500px;
}
.sp-scans figure{
  display:flex;flex-direction:column;align-items:center;gap:12px;margin:0;
  background:rgba(239,236,230,.04);border:1px solid rgba(201,161,101,.25);
  border-radius:8px;padding:18px;
}
.sp-scans figure img{
  max-width:100%;max-height:380px;width:auto;height:auto;
  display:block;object-fit:contain;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.35));
}
.sp-scans figcaption{
  font-family:'Outfit';font-weight:500;font-size:14px;
  letter-spacing:.28em;text-transform:uppercase;color:var(--bone);opacity:.82;
}
.sp-scans figcaption b{color:var(--gold-warm);font-weight:600;}
.sp-arrow{
  font-family:'Outfit';font-weight:300;font-size:56px;color:var(--gold);
  line-height:1;opacity:.85;
}
.sp-stats{
  display:flex;gap:64px;margin-top:4px;
  padding:20px 48px;border-top:1px solid rgba(201,161,101,.45);
}
.sp-stat{display:flex;flex-direction:column;align-items:center;gap:6px;}
.sp-stat .n{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:56px;line-height:1;
  letter-spacing:-.02em;color:var(--bone);font-variant-numeric:tabular-nums;
}
.sp-stat .n.up{color:#9dc28a;}
.sp-stat .n.down{color:var(--gold-warm);}
.sp-stat .l{
  font-family:'Outfit';font-weight:500;font-size:13px;
  letter-spacing:.3em;text-transform:uppercase;color:var(--bone);opacity:.75;
}

/* ---------- Welcome (DARK) ---------- */
.welcome-wrap{
  display:flex;flex-direction:column;align-items:center;gap:32px;
  text-align:center;position:relative;z-index:3;padding:0 160px;max-width:1560px;
}
.welcome-kicker{
  font-family:'Outfit';font-weight:500;font-size:18px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:22px;opacity:0;
}
.welcome-kicker i{display:inline-block;width:56px;height:1px;background:var(--gold);opacity:.8;}
.welcome-title{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:96px;line-height:1;
  letter-spacing:-.025em;color:var(--bone);opacity:0;
}
.welcome-title em{font-style:normal;color:var(--gold);font-weight:700;}
.welcome-tag{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:34px;
  color:var(--bone);opacity:0;letter-spacing:-.01em;max-width:1200px;
}
.welcome-body{
  font-family:'Outfit',sans-serif;font-weight:400;font-size:22px;
  color:var(--bone);opacity:0;letter-spacing:.01em;max-width:900px;line-height:1.5;
}

/* Sex badge used in combined M/W leaderboards */
.sexTag{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;height:22px;padding:0 6px;border-radius:4px;
  font-family:'Outfit';font-weight:600;font-size:12px;letter-spacing:.08em;
  color:var(--warm);background:var(--sage);line-height:1;
}
.sexTag.f{background:var(--gold);}

/* Persistent QR "Find your rank" — bottom-right, above ticker (off the wordmark) */
#qrBadge{
  position:fixed;right:18px;bottom:74px;z-index:9998;
  display:flex;align-items:center;gap:12px;pointer-events:none;
  background:var(--warm);border:1px solid var(--stone);
  padding:8px 14px 8px 8px;border-radius:10px;
  box-shadow:0 6px 18px rgba(47,66,55,.14);
}
#qrBadge img{
  width:74px;height:74px;display:block;border-radius:4px;
  background:var(--bone);
}
#qrBadge .qrCap{display:flex;flex-direction:column;gap:2px;line-height:1.1;}
#qrBadge .qrL1{
  font-family:'Outfit';font-weight:600;font-size:13px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--forest);
}
#qrBadge .qrL1 em{font-style:normal;color:var(--gold);font-weight:700;}
#qrBadge .qrL2{
  font-family:'Outfit';font-weight:500;font-size:11px;
  letter-spacing:.12em;color:var(--sage);
}

/* ---------- Your Dashboard walkthrough (DARK cinematic) ---------- */
.yourdash-shot{
  width:100%;height:100%;padding:110px 90px 150px;
  display:grid;grid-template-columns:1fr 1.35fr;gap:64px;align-items:center;
  position:relative;color:var(--bone);
}
.yd-shot-copy{display:flex;flex-direction:column;gap:18px;}
.yd-shot-copy .yd-brand{
  margin-bottom:18px;display:flex;align-items:center;gap:22px;
  opacity:0;transform:translateY(8px);
}
.yd-shot-copy .yd-brand .yd-brand-mark{
  width:auto;height:96px;display:block;
  /* bodystats-mark.png is transparent — invert forest green to bone-white for dark chapter */
  filter:brightness(0) invert(1);opacity:.95;
}
.yd-shot-copy .yd-brand .yd-brand-word{
  display:flex;flex-direction:column;line-height:1;
}
.yd-shot-copy .yd-brand .yd-brand-name{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:42px;
  letter-spacing:.02em;color:var(--bone);
}
.yd-shot-copy .yd-brand .yd-brand-sub{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:18px;
  letter-spacing:.42em;color:var(--gold-warm);margin-top:8px;
}
.yd-shot-copy .kicker{
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:14px;
}
.yd-shot-copy .kicker i{display:inline-block;width:44px;height:1px;background:var(--gold);opacity:.7;}
.yd-shot-copy .title{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:60px;line-height:.98;
  color:var(--bone);letter-spacing:-.025em;
}
.yd-shot-copy .title em{font-style:normal;color:var(--gold);font-weight:700;}
.yd-shot-copy .lead{
  font-family:'Outfit',sans-serif;font-weight:500;font-size:22px;line-height:1.4;
  color:var(--bone);opacity:.82;letter-spacing:-.005em;max-width:520px;
}
.yd-shot-copy .bullets{
  display:flex;flex-direction:column;gap:8px;margin-top:8px;
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.04em;color:var(--bone);opacity:.75;max-width:520px;
}
.yd-shot-copy .bullets li{list-style:none;padding-left:20px;position:relative;line-height:1.4;}
.yd-shot-copy .bullets li::before{
  content:"";position:absolute;left:0;top:11px;width:10px;height:1px;background:var(--gold);
}
.yd-shot-copy .cta{
  margin-top:16px;display:inline-flex;align-items:center;gap:14px;
  font-family:'Outfit';font-weight:600;font-size:13px;
  letter-spacing:.32em;text-transform:uppercase;color:var(--bone);
  padding:10px 16px;border:1px solid rgba(201,161,101,.5);border-radius:6px;
  background:rgba(176,139,79,.08);align-self:flex-start;
}
.yd-shot-copy .cta .arrow{color:var(--gold);font-size:18px;}
.yd-shot-frame{
  position:relative;opacity:0;transform:translateY(20px) scale(.98);
  border-radius:14px;overflow:hidden;
  box-shadow:0 40px 80px -24px rgba(0,0,0,.55),
             0 0 0 1px rgba(201,161,101,.28),
             0 0 60px -10px rgba(201,161,101,.22);
  background:var(--warm);
  max-height:calc(100vh - 280px);
}
.yd-shot-frame::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 60px rgba(47,66,55,.15);border-radius:14px;
}
.yd-shot-frame img{display:block;width:100%;height:auto;object-fit:contain;background:var(--warm);}
.yd-callouts{position:absolute;inset:0;pointer-events:none;}
.yd-callout{position:absolute;display:flex;align-items:center;transform:translate(-50%,-50%);}
.yd-callout .pin{
  width:14px;height:14px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 0 4px rgba(176,139,79,.22), 0 0 0 8px rgba(176,139,79,.12);
  flex-shrink:0;position:relative;z-index:3;
  animation:calloutPulse 2s ease-in-out infinite;
}
@keyframes calloutPulse{
  0%,100%{box-shadow:0 0 0 4px rgba(176,139,79,.22), 0 0 0 8px rgba(176,139,79,.12);}
  50%    {box-shadow:0 0 0 6px rgba(176,139,79,.28), 0 0 0 12px rgba(176,139,79,.18);}
}
.yd-callout .line{
  height:2px;background:var(--gold);transform-origin:left center;
  box-shadow:0 0 6px rgba(176,139,79,.4);
}
.yd-callout .lbl{
  background:rgba(47,66,55,.94);color:var(--bone);
  font-family:'Outfit';font-weight:500;font-size:12px;line-height:1.25;
  letter-spacing:.03em;padding:5px 10px;border-radius:5px;
  border:1px solid rgba(201,161,101,.5);
  box-shadow:0 6px 18px rgba(47,66,55,.25);
  max-width:180px;text-align:left;
}
.yd-callout.yd-side-right{flex-direction:row;}
.yd-callout.yd-side-right .line{width:26px;margin:0 8px 0 6px;}
.yd-callout.yd-side-left{flex-direction:row-reverse;}
.yd-callout.yd-side-left .line{width:26px;margin:0 6px 0 8px;transform-origin:right center;}

/* ---------- Your Dashboard walkthrough teaser (legacy 4-card) ---------- */
.yourdash{
  width:100%;height:100%;padding:110px 120px 140px;
  display:flex;flex-direction:column;align-items:stretch;gap:28px;
  position:relative;
}
.yd-head{
  border-bottom:1px solid var(--stone);padding-bottom:22px;
  display:flex;flex-direction:column;gap:10px;
}
.yd-kicker{
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:16px;
}
.yd-kicker i{display:inline-block;width:44px;height:1px;background:var(--gold);opacity:.7;}
.yd-title{
  font-family:'Outfit',sans-serif;font-weight:600;font-size:56px;line-height:1;
  color:var(--forest);letter-spacing:-.02em;
}
.yd-title em{font-style:normal;color:var(--gold);font-weight:700;}
.yd-sub{
  font-family:'Outfit';font-weight:500;font-size:22px;
  color:var(--ink);opacity:.78;letter-spacing:-.005em;
}
.yd-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:26px;flex:1;
}
.yd-card{
  background:var(--warm);border:1px solid var(--stone);border-radius:14px;
  padding:26px 30px;display:flex;flex-direction:column;gap:14px;
  box-shadow:0 10px 24px -18px rgba(47,66,55,.25);position:relative;overflow:hidden;
  opacity:0;transform:translateY(14px);
}
.yd-card .yd-ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:8px;
  background:rgba(176,139,79,.14);color:var(--gold);
  font-family:'Outfit';font-weight:700;font-size:18px;
}
.yd-card .yd-h{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:26px;line-height:1.1;
  color:var(--forest);letter-spacing:-.015em;
}
.yd-card .yd-h em{font-style:normal;color:var(--gold);}
.yd-card .yd-p{
  font-family:'Outfit';font-weight:500;font-size:16px;
  color:var(--ink);opacity:.78;line-height:1.4;
}

/* Mini-chart previews inside cards */
.yd-mini{
  margin-top:auto;height:64px;position:relative;
  border-top:1px dashed rgba(107,122,90,.35);padding-top:12px;
}
.yd-mini svg{width:100%;height:100%;display:block;}
.yd-mini .p{fill:none;stroke:var(--sage);stroke-width:2;stroke-linejoin:round;stroke-linecap:round;}
.yd-mini .p.gold{stroke:var(--gold);stroke-width:2.2;}
.yd-mini .dot{fill:var(--gold);}
.yd-bars{display:flex;align-items:flex-end;gap:6px;height:100%;}
.yd-bars .b{flex:1;background:linear-gradient(180deg,var(--sage),#4e5e44);border-radius:2px 2px 0 0;}
.yd-bars .b.fat{background:linear-gradient(180deg,var(--gold-warm),var(--gold));}
.yd-pct{
  display:flex;align-items:baseline;gap:10px;margin-top:auto;
  border-top:1px dashed rgba(107,122,90,.35);padding-top:12px;
}
.yd-pct .n{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:42px;
  color:var(--gold);line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.yd-pct .l{
  font-family:'Outfit';font-weight:500;font-size:13px;
  letter-spacing:.26em;text-transform:uppercase;color:var(--sage);
}

/* Version badge — discreet very-top-right, above all HUD elements */
#versionBadge{
  position:fixed;right:10px;top:6px;z-index:10000;
  font-family:'Outfit';font-weight:500;font-size:10px;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--sage);opacity:.4;pointer-events:none;
  font-variant-numeric:tabular-nums;
}

/* ---------- 12-Month Volume bar chart ---------- */
.volume{
  width:100%;height:100%;padding:120px 120px 150px;
  display:flex;flex-direction:column;align-items:stretch;gap:28px;
  position:relative;
}
.volume .vol-head{
  border-bottom:1px solid var(--stone);padding-bottom:22px;
  display:flex;flex-direction:column;gap:10px;
}
.volume .vol-kicker{
  font-family:'Outfit';font-weight:500;font-size:16px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--gold);
  display:flex;align-items:center;gap:16px;
}
.volume .vol-kicker i{display:inline-block;width:44px;height:1px;background:var(--gold);opacity:.7;}
.volume .vol-title{
  font-family:'Outfit',sans-serif;font-weight:600;font-size:56px;line-height:1;
  color:var(--forest);letter-spacing:-.02em;
}
.volume .vol-title em{font-style:normal;color:var(--gold);font-weight:700;}
.volume .vol-legend{
  display:flex;gap:28px;margin-left:auto;margin-top:-34px;align-self:flex-end;
  font-family:'Outfit';font-size:14px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--forest);opacity:.85;
}
.volume .vol-legend .sw{
  display:inline-block;width:14px;height:14px;border-radius:3px;
  vertical-align:middle;margin-right:8px;
}
.volume .vol-legend .sw.muscle{background:var(--sage);}
.volume .vol-legend .sw.fat{background:var(--gold);}

.volume .vol-chart{
  flex:1;display:grid;grid-template-columns:repeat(12,1fr);
  gap:24px;align-items:end;padding:10px 0 34px;
  border-bottom:1px solid rgba(107,122,90,.25);
  position:relative;
}
/* Volume trendline removed in v1.0.12 (kept running into aspect-ratio issues). */
.vol-bar{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  height:100%;justify-content:flex-end;
}
.vol-bar .pair{
  display:flex;align-items:flex-end;gap:4px;width:100%;justify-content:center;
  height:calc(100% - 34px);
}
.vol-bar .col{
  width:24px;border-radius:4px 4px 0 0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
  transform-origin:bottom center;
  height:0;
  transition:height .7s cubic-bezier(.2,.8,.2,1);
  position:relative;
}
.vol-bar .col .tot{
  position:absolute;left:50%;bottom:100%;transform:translateX(-50%);
  margin-bottom:10px;white-space:nowrap;pointer-events:none;
}
.vol-bar .col.muscle{background:linear-gradient(180deg,var(--sage),#4e5e44);}
.vol-bar .col.fat{   background:linear-gradient(180deg,var(--gold-warm),var(--gold));}
.vol-bar .col.tests{ background:linear-gradient(180deg,var(--gold-warm),var(--gold));}
/* Tests-per-month chart: single wider bar, no muscle/fat split. */
.volume.tests-chart .vol-bar .pair.single{justify-content:center;}
.volume.tests-chart .vol-bar .col.tests{width:56px;}
.volume.tests-chart .vol-bar .tot{font-size:32px;line-height:1;color:var(--forest);font-weight:700;font-variant-numeric:tabular-nums;}
/* Final-bar flourish: a single gold pulse once its count-up lands. */
.vol-bar.final.finale .col.tests{
  animation:bsTvFinalPulse 1.2s cubic-bezier(.2,.8,.2,1) 1;
  box-shadow:0 0 0 0 rgba(176,139,79,.55), inset 0 1px 0 rgba(255,255,255,.25);
}
.vol-bar.final.finale .tot{animation:bsTvFinalTot 1.2s ease-out 1;}
@keyframes bsTvFinalPulse{
  0%  {box-shadow:0 0 0 0 rgba(176,139,79,.55), inset 0 1px 0 rgba(255,255,255,.25); filter:brightness(1);}
  40% {box-shadow:0 0 24px 6px rgba(176,139,79,.55), inset 0 1px 0 rgba(255,255,255,.35); filter:brightness(1.12);}
  100%{box-shadow:0 0 0 0 rgba(176,139,79,0),   inset 0 1px 0 rgba(255,255,255,.25); filter:brightness(1);}
}
@keyframes bsTvFinalTot{
  0%  {transform:translateX(-50%) scale(1);   color:var(--forest);}
  40% {transform:translateX(-50%) scale(1.18);color:var(--gold);}
  100%{transform:translateX(-50%) scale(1);   color:var(--forest);}
}
.vol-bar .lbl{
  font-family:'Outfit';font-weight:500;font-size:13px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--forest);opacity:.75;
}
.vol-bar .tot{
  font-family:'Outfit';font-weight:600;font-size:11px;
  color:var(--sage);font-variant-numeric:tabular-nums;
}

.kb{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5;}
.kb svg{
  position:absolute;left:-5%;top:-5%;width:110%;height:110%;
  opacity:.14;animation:kenburns 32s ease-in-out infinite alternate;
}
@keyframes kenburns{
  from{transform:scale(1) translate(0,0);}
  to  {transform:scale(1.10) translate(-2%,1.2%);}
}

/* Heartbeat */
.heartbeat{animation:heartbeat 1s ease-in-out infinite;}
@keyframes heartbeat{
  0%,100%{transform:scale(1);}
  45%    {transform:scale(1.02);}
}
.heartbeat-opacity{animation:heartbeatOpacity 1s ease-in-out infinite;}
@keyframes heartbeatOpacity{
  0%,100%{opacity:1;}
  45%    {opacity:.78;}
}

/* ---------- v1.0.15 LBS Scanned chapters ---------- */
.scanned-hero{
  width:100%;height:100%;padding:0 140px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:44px;
  position:relative;text-align:center;color:var(--bone);
}
.scanned-hero .kicker{
  font-family:'Outfit';font-weight:500;font-size:24px;
  letter-spacing:.44em;text-transform:uppercase;color:var(--gold-warm);
  display:flex;align-items:center;gap:22px;
}
.scanned-hero .kicker i{display:inline-block;width:56px;height:1px;background:var(--gold);}
.scanned-hero .sc-total{
  display:flex;align-items:baseline;gap:22px;
  font-family:'Outfit',sans-serif;font-weight:700;color:var(--bone);
  letter-spacing:-.035em;line-height:.9;
}
.scanned-hero .sc-total .n{font-size:280px;}
.scanned-hero .sc-total .u{
  font-size:64px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-warm);
}
.scanned-hero .sc-sub{
  font-family:'Outfit';font-weight:500;font-size:22px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--bone);opacity:.78;
}
.scanned-hero .sc-split{
  display:grid;grid-template-columns:repeat(2,1fr);gap:120px;margin-top:18px;
  padding-top:34px;border-top:1px solid rgba(176,139,79,.55);
  min-width:720px;
}
.scanned-hero .sc-stat{display:flex;flex-direction:column;align-items:center;gap:10px;}
.scanned-hero .sc-stat .n{
  font-family:'Outfit',sans-serif;font-weight:700;font-size:84px;line-height:.95;
  letter-spacing:-.02em;color:var(--bone);
}
.scanned-hero .sc-stat .n.muscle{color:var(--gold-warm);}
.scanned-hero .sc-stat .n.fat{color:var(--sage);}
.scanned-hero .sc-stat .lbl{
  font-family:'Outfit';font-weight:500;font-size:14px;
  letter-spacing:.34em;text-transform:uppercase;color:var(--bone);opacity:.7;
}

/* Full-width 7-day chart override (base .vol-chart is a fixed 12-col grid). */
.volume.scanned-week .vol-chart{
  grid-template-columns:repeat(7, 1fr);
  gap:64px;
  padding-left:40px;padding-right:40px;
}
.volume.scanned-week .vol-bar .col{width:64px;}
.volume.scanned-week .vol-bar .lbl{font-size:18px;letter-spacing:.3em;}
.volume.scanned-week .vol-bar .tot{font-size:16px;}
.volume.scanned-week .vol-title{font-size:72px;}

/* Bigger kicker labels for volume charts (Last 7 Days / Last 12 Months). */
.volume .vol-kicker{font-size:44px !important;letter-spacing:.32em !important;}
.volume .vol-kicker i{width:96px !important;height:2px !important;}


/* v1.0.16: head-below-chart layout — header/title sits under the bars so the
   "Last 7 Days" / "Last 12 Months" label is the last thing the eye lands on. */
.volume.head-bottom .vol-chart{
  order:1;border-bottom:0;border-top:1px solid rgba(107,122,90,.25);padding:34px 0 10px;
}
.volume.head-bottom .vol-head{
  order:2;border-bottom:0;border-top:1px solid var(--stone);
  padding-top:28px;padding-bottom:0;margin-top:6px;
  align-items:center;text-align:center;gap:14px;
}
.volume.head-bottom .vol-kicker{justify-content:center;}
.volume.head-bottom .vol-legend{
  order:0;margin-top:0;margin-bottom:-8px;align-self:flex-end;
}