/* SUN RUNNING — AWARD POLISH LAYER
   Visual system: Obsidian / Aurora
   Goal: premium editorial hierarchy, stronger legibility, calmer depth,
   responsive consistency, and restrained motion.
*/

:root{
  --award-bg:#03101a;
  --award-bg-2:#061725;
  --award-surface:rgba(8,29,47,.88);
  --award-surface-strong:rgba(9,34,55,.96);
  --award-line:rgba(105,201,232,.18);
  --award-line-strong:rgba(105,201,232,.34);
  --award-text:#f1f8fb;
  --award-muted:#8caabb;
  --award-cyan:#62ddf6;
  --award-cyan-2:#34bce8;
  --award-mint:#67e0b2;
  --award-amber:#f0ae3d;
  --award-red:#ef6e78;
  --award-violet:#ad7cf1;
  --award-radius-xl:22px;
  --award-radius-lg:16px;
  --award-radius-md:12px;
  --award-shadow:0 22px 60px rgba(0,0,0,.22);
  --award-shadow-soft:0 10px 30px rgba(0,0,0,.14);
}

html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 84% -12%,rgba(48,135,178,.18),transparent 30%),
    radial-gradient(circle at 18% 16%,rgba(19,91,123,.10),transparent 28%),
    linear-gradient(180deg,#061522 0%,var(--award-bg) 46%,#020a11 100%)!important;
  color:var(--award-text);
}

body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.28;
  background:
    radial-gradient(circle at 20% 30%,rgba(255,255,255,.025) 0 1px,transparent 1.6px),
    radial-gradient(circle at 75% 70%,rgba(255,255,255,.02) 0 1px,transparent 1.6px);
  background-size:28px 28px,36px 36px;
}

::selection{background:rgba(98,221,246,.25);color:#fff}

/* ---------- shell ---------- */
@media(min-width:900px){
  .app-frame{
    background:transparent!important;
    grid-template-columns:clamp(220px,12.2vw,300px) minmax(0,1fr)!important;
  }

  .side-rail{
    background:
      linear-gradient(180deg,rgba(4,18,30,.98),rgba(3,14,23,.99))!important;
    border-right:1px solid rgba(108,202,232,.14)!important;
    box-shadow:18px 0 60px rgba(0,0,0,.20)!important;
  }
  .side-rail:before{
    opacity:.24!important;
    filter:blur(.2px);
  }
  .brand-lockup{
    border-bottom:0!important;
    padding-bottom:18px!important;
  }
  .brand-lockup strong{
    letter-spacing:.11em!important;
    font-weight:800!important;
  }
  .brand-lockup span{
    color:#79ddf1!important;
    letter-spacing:.22em!important;
  }
  .rail-tag{
    color:#66889b!important;
    letter-spacing:.17em!important;
  }
  .rail-nav{
    gap:7px!important;
  }
  .rail-nav a{
    border:1px solid transparent!important;
    border-radius:14px!important;
    transition:background .22s ease,border-color .22s ease,transform .22s ease,color .22s ease!important;
  }
  .rail-nav a:hover{
    transform:translateX(3px);
    border-color:rgba(98,221,246,.14)!important;
    background:linear-gradient(90deg,rgba(35,111,147,.16),rgba(11,42,62,.08))!important;
  }
  .rail-nav a.active{
    background:
      linear-gradient(90deg,rgba(29,118,158,.36),rgba(8,42,64,.18))!important;
    border-color:rgba(98,221,246,.22)!important;
    box-shadow:
      inset 3px 0 0 var(--award-cyan),
      0 12px 28px rgba(0,0,0,.15)!important;
  }
  .rail-nav a b{
    border-radius:10px!important;
    background:rgba(76,190,231,.08)!important;
  }
  .rail-nav a.active b{
    box-shadow:inset 0 0 0 1px rgba(124,232,255,.18);
  }

  /* ---------- hero ---------- */
  .weather-hero{
    border-bottom:1px solid rgba(98,221,246,.20)!important;
    background:
      radial-gradient(circle at 86% 29%,rgba(255,237,180,.96) 0 14px,rgba(255,237,180,.16) 15px 30px,transparent 31px),
      linear-gradient(180deg,rgba(11,47,72,.78),rgba(5,24,39,.94)),
      linear-gradient(120deg,#0b2a43,#061723)!important;
    box-shadow:inset 0 -20px 50px rgba(0,0,0,.14);
  }
  .weather-hero:before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(90deg,rgba(98,221,246,.07),transparent 22%,transparent 78%,rgba(98,221,246,.04)),
      radial-gradient(circle at 66% 105%,rgba(46,157,196,.12),transparent 28%);
  }
  .weather-sky{filter:saturate(.88)}
  .top-brand strong{font-weight:820!important}
  .top-brand span{color:#73ddf5!important}

  .top-kpi{
    border:1px solid rgba(111,203,234,.22)!important;
    background:
      linear-gradient(180deg,rgba(10,38,60,.90),rgba(7,26,42,.86))!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 14px 34px rgba(0,0,0,.14)!important;
    border-radius:14px!important;
    backdrop-filter:blur(10px) saturate(110%);
    transition:border-color .2s ease,transform .2s ease,background .2s ease!important;
  }
  .top-kpi:hover{
    transform:translateY(-2px);
    border-color:rgba(111,213,243,.38)!important;
    background:linear-gradient(180deg,rgba(12,45,69,.94),rgba(8,30,48,.90))!important;
  }

  /* ---------- global content ---------- */
  .dashboard{
    gap:clamp(12px,.76vw,18px)!important;
    padding:clamp(14px,.95vw,22px) clamp(16px,1.2vw,28px) 42px!important;
  }

  .panel{
    position:relative;
    overflow:hidden;
    border:1px solid var(--award-line)!important;
    border-radius:var(--award-radius-xl)!important;
    background:
      linear-gradient(145deg,rgba(8,31,50,.96),rgba(5,21,35,.96))!important;
    box-shadow:
      var(--award-shadow-soft),
      inset 0 1px 0 rgba(255,255,255,.026)!important;
    transition:border-color .24s ease,box-shadow .24s ease,transform .24s ease!important;
  }
  .panel:after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
      linear-gradient(118deg,rgba(255,255,255,.028),transparent 20%,transparent 78%,rgba(98,221,246,.025));
    opacity:.75;
  }
  .panel:hover{
    border-color:rgba(98,221,246,.27)!important;
    box-shadow:
      0 22px 48px rgba(0,0,0,.18),
      inset 0 1px 0 rgba(255,255,255,.035)!important;
  }
  .panel-head{
    position:relative;
    z-index:2;
  }
  .panel-head>div{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
  }
  .panel-head i{
    width:4px!important;
    height:21px!important;
    border-radius:999px!important;
    background:linear-gradient(180deg,#83efff,#3bbbdc)!important;
    box-shadow:0 0 18px rgba(98,221,246,.18);
  }
  .panel-head h2{
    letter-spacing:-.018em;
    font-weight:780!important;
  }
  .panel-head span{
    letter-spacing:.09em!important;
    text-transform:uppercase;
  }

  /* ---------- hero decision ---------- */
  .daily-decision-panel{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    overflow:visible!important;
  }
  .daily-decision-panel:after{display:none}
  .decision-v2-grid{
    gap:clamp(10px,.65vw,15px)!important;
  }
  .decision-status-card,
  .decision-readiness-card,
  .decision-gate-card,
  .decision-action-card{
    position:relative;
    overflow:hidden;
    border:1px solid rgba(111,201,230,.20)!important;
    border-radius:18px!important;
    background:
      radial-gradient(circle at 110% -12%,rgba(64,151,188,.10),transparent 34%),
      linear-gradient(145deg,rgba(8,31,50,.98),rgba(5,22,36,.98))!important;
    box-shadow:
      0 18px 44px rgba(0,0,0,.16),
      inset 0 1px 0 rgba(255,255,255,.03)!important;
    transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
  }
  .decision-status-card:hover,
  .decision-readiness-card:hover,
  .decision-gate-card:hover{
    transform:translateY(-3px);
    border-color:rgba(103,214,243,.34)!important;
    box-shadow:0 24px 54px rgba(0,0,0,.20)!important;
  }
  .decision-status-card:before,
  .decision-readiness-card:before,
  .decision-gate-card:before,
  .decision-action-card:before{
    width:4px!important;
    box-shadow:0 0 20px currentColor;
  }
  .decision-status-card:before{background:linear-gradient(180deg,#ffc35c,#c98517)!important}
  .decision-readiness-card:before{background:linear-gradient(180deg,#73edff,#31add5)!important}
  .decision-gate-card:before{background:linear-gradient(180deg,#83efc2,#38bf88)!important}

  .decision-status-pill{
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      0 8px 22px rgba(0,0,0,.14)!important;
  }
  .decision-status-card h2,
  .decision-action-card>strong{
    letter-spacing:-.025em;
  }

  .readiness-track{
    background:#061522!important;
    border-color:rgba(104,188,219,.24)!important;
    box-shadow:inset 0 2px 8px rgba(0,0,0,.24);
  }
  .readiness-fill{
    box-shadow:0 0 18px rgba(92,226,181,.22);
  }
  .readiness-mini-grid>div{
    border-radius:12px!important;
    background:
      linear-gradient(180deg,rgba(8,31,49,.96),rgba(5,23,38,.94))!important;
    border-color:rgba(97,183,215,.20)!important;
  }

  .gate-dots i{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  }
  .gate-dots i.done{
    box-shadow:0 0 18px rgba(88,223,170,.15);
  }

  .decision-action-card{
    background:
      radial-gradient(circle at 100% 0,rgba(111,217,245,.12),transparent 35%),
      linear-gradient(145deg,#f7fbfd,#eaf5f9)!important;
    box-shadow:
      0 20px 46px rgba(0,0,0,.18),
      inset 0 1px 0 #fff!important;
  }
  .decision-action-card:hover{
    transform:translateY(-3px);
    box-shadow:0 28px 60px rgba(0,0,0,.22)!important;
  }
  .daily-flags span{
    border-radius:999px!important;
  }

  /* ---------- week ---------- */
  .week-panel{
    overflow:hidden!important;
  }
  .week-plan{
    gap:clamp(8px,.52vw,12px)!important;
  }
  .day{
    position:relative;
    overflow:hidden;
    border-radius:15px!important;
    background:
      linear-gradient(155deg,rgba(10,38,61,.94),rgba(6,25,42,.96))!important;
    border-color:rgba(79,160,192,.18)!important;
    transition:transform .20s ease,border-color .20s ease,background .20s ease!important;
  }
  .day:after{
    content:"";
    position:absolute;
    inset:auto 12px 0 12px;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(98,221,246,.18),transparent);
  }
  .day:hover{
    transform:translateY(-3px);
    border-color:rgba(92,210,241,.34)!important;
    background:linear-gradient(155deg,rgba(12,48,74,.96),rgba(7,29,47,.98))!important;
  }
  .day.current{
    border-color:#55dcf7!important;
    box-shadow:
      0 0 0 1px rgba(85,220,247,.13),
      0 18px 32px rgba(0,0,0,.18),
      inset 0 0 32px rgba(58,185,220,.055)!important;
  }
  .day.current:before{
    background:linear-gradient(90deg,#baf7ff,#8ee9fb)!important;
    color:#06465e!important;
    letter-spacing:.06em;
  }

  /* ---------- fitness ---------- */
  .fitness-chart-wrap{
    border-radius:16px!important;
    background:
      linear-gradient(180deg,rgba(7,27,44,.66),rgba(4,18,30,.48))!important;
    border-color:rgba(75,163,197,.17)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
  }
  .fitness-legend{
    color:#91adbb!important;
    letter-spacing:.02em;
  }
  .fitness-legend i{
    box-shadow:0 0 12px currentColor;
  }
  .fitness-summary-card{
    border-radius:14px!important;
    background:
      linear-gradient(180deg,rgba(8,31,49,.96),rgba(5,23,38,.95))!important;
    border-color:rgba(79,161,194,.19)!important;
    transition:transform .2s ease,border-color .2s ease!important;
  }
  .fitness-summary-card:hover{
    transform:translateX(-2px);
    border-color:rgba(91,205,237,.32)!important;
  }
  .fitness-zone{
    border-radius:14px!important;
    background:linear-gradient(180deg,rgba(10,35,54,.96),rgba(7,26,42,.96))!important;
  }

  /* ---------- activity ---------- */
  .completed-today{
    border-radius:13px!important;
    border:1px solid rgba(80,183,215,.18)!important;
    background:linear-gradient(90deg,rgba(8,37,58,.96),rgba(6,27,44,.95))!important;
  }
  .provenance-card{
    border-radius:12px!important;
    background:linear-gradient(180deg,rgba(7,27,44,.95),rgba(5,22,36,.96))!important;
  }
  .source-badge{
    font-weight:800!important;
    letter-spacing:.02em;
  }
  .activity-card{
    border-radius:12px!important;
    transition:background .18s ease,border-color .18s ease,transform .18s ease!important;
  }
  .activity-card:hover{
    transform:translateX(3px);
    border-color:rgba(85,196,229,.32)!important;
    background:rgba(11,42,65,.90)!important;
  }
  .activity-arrow{
    transition:transform .18s ease,color .18s ease;
  }
  .activity-card:hover .activity-arrow{
    transform:translateX(3px);
    color:#8cecff;
  }

  /* ---------- analytics ---------- */
  .load-panel,
  .biomech-panel,
  .wellness-panel{
    background:
      radial-gradient(circle at 90% -20%,rgba(44,138,178,.06),transparent 34%),
      linear-gradient(145deg,rgba(7,29,47,.98),rgba(4,19,32,.98))!important;
  }
  .metric-card,
  .wellness-chart-card{
    border-radius:14px!important;
    border-color:rgba(82,167,200,.17)!important;
    background:
      linear-gradient(180deg,rgba(7,27,44,.92),rgba(5,22,36,.95))!important;
    transition:border-color .2s ease,transform .2s ease!important;
  }
  .metric-card:hover,
  .wellness-chart-card:hover{
    transform:translateY(-2px);
    border-color:rgba(97,205,236,.30)!important;
  }
  .metric-card strong,
  .wellness-chart-head strong,
  .big-total{
    letter-spacing:-.025em;
  }
  .wellness-analysis,
  .coach-notes{
    border-radius:12px!important;
    background:rgba(4,18,30,.76)!important;
    border:1px solid rgba(79,158,189,.14)!important;
  }

  /* ---------- details / dialogs ---------- */
  .rehab-details-shell{
    border:1px solid rgba(94,181,214,.18)!important;
    border-radius:18px!important;
    background:rgba(5,20,33,.72)!important;
    overflow:hidden;
  }
  .rehab-details-shell>summary{
    transition:background .2s ease;
  }
  .rehab-details-shell>summary:hover{
    background:rgba(31,95,124,.09);
  }

  dialog{
    border:1px solid rgba(91,182,214,.28)!important;
    border-radius:20px!important;
    box-shadow:0 36px 100px rgba(0,0,0,.48)!important;
  }
  dialog::backdrop{
    background:rgba(1,8,14,.74);
    backdrop-filter:blur(8px);
  }

  /* ---------- chart polish ---------- */
  .analysis-svg .grid-line,
  .analysis-svg .form-grid-line{
    stroke:rgba(94,164,191,.16)!important;
  }
  .analysis-svg .axis-line,
  .analysis-svg .axis-tick{
    stroke:rgba(100,176,205,.25)!important;
  }
  .analysis-svg .axis-label,
  .analysis-svg .axis-unit{
    fill:#7897a7!important;
  }
  .analysis-svg .baseline-line{
    opacity:.7;
  }
  .analysis-svg .data-point{
    filter:drop-shadow(0 0 5px rgba(255,255,255,.06));
  }
}

/* ---------- mobile polish ---------- */
@media(max-width:899px){
  body{
    background:
      radial-gradient(circle at 80% 0,rgba(46,137,176,.13),transparent 26%),
      linear-gradient(180deg,#061522 0%,#03101a 100%)!important;
  }

  .mobile-today-panel{
    border-radius:22px!important;
    border:1px solid rgba(99,204,235,.20)!important;
    background:
      radial-gradient(circle at 110% -5%,rgba(58,167,208,.12),transparent 35%),
      linear-gradient(155deg,#071f33,#061827)!important;
    box-shadow:0 24px 60px rgba(0,0,0,.22)!important;
  }
  .mobile-today-head h1{
    letter-spacing:-.03em;
  }
  .mobile-state-pill,
  .mobile-refresh-btn{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  }
  .mobile-today-meta>div,
  .mobile-wellness-strip>div,
  .mobile-workout-block,
  .mobile-condition-block{
    border-radius:14px!important;
  }
  .week-panel,
  .fitness-panel,
  .recent-panel,
  .load-panel,
  .biomech-panel,
  .wellness-panel{
    border-radius:18px!important;
  }
  .day{
    border-radius:14px!important;
  }
  .fitness-chart-wrap{
    border-radius:14px!important;
  }
  .fitness-summary-card,
  .fitness-zone{
    border-radius:12px!important;
  }
  .activity-card{
    border-radius:12px!important;
  }
}

/* ---------- states, focus, motion ---------- */
a,button,summary,.activity-card,.day{ -webkit-tap-highlight-color:transparent }

button:focus-visible,
a:focus-visible,
summary:focus-visible,
.activity-card:focus-visible{
  outline:2px solid #79e9fb!important;
  outline-offset:3px!important;
}

body.data-ready .panel,
body.data-ready .decision-status-card,
body.data-ready .decision-readiness-card,
body.data-ready .decision-gate-card,
body.data-ready .decision-action-card{
  animation:awardRise .46s cubic-bezier(.2,.72,.2,1) both;
}
body.data-ready .panel:nth-of-type(2){animation-delay:.03s}
body.data-ready .panel:nth-of-type(3){animation-delay:.06s}

@keyframes awardRise{
  from{opacity:.92;transform:translateY(7px)}
  to{opacity:1;transform:translateY(0)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *:before,
  *:after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}


/* Fitness chart final details */
.fitness-svg .fitness-today-line{
  stroke:rgba(214,240,248,.28);
  stroke-width:1;
  stroke-dasharray:4 5;
}
.fitness-svg .fitness-today-label{
  fill:#86adbd!important;
  font-size:10px;
  letter-spacing:.08em;
}
.fitness-svg .fitness-area,
.fitness-svg .fatigue-area,
.fitness-svg .form-area{
  pointer-events:none;
}

/* High-quality scrollbars */
*{
  scrollbar-width:thin;
  scrollbar-color:rgba(108,200,230,.28) transparent;
}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(91,192,226,.30),rgba(91,192,226,.15));
  border-radius:99px;
}
*::-webkit-scrollbar-thumb:hover{background:rgba(102,211,242,.40)}

/* Prevent long metric strings from visually breaking premium cards */
.top-kpi>strong,
.decision-action-card>strong,
.day h4,
.activity-card h4,
.fitness-zone span{
  overflow-wrap:anywhere;
}

/* Premium modal detail cards */
.detail-grid>div{
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(9,31,48,.96),rgba(6,23,37,.96))!important;
  border:1px solid rgba(87,177,208,.18)!important;
}

/* Selected / interactive cursor treatment */
.activity-card,
.day,
.rail-nav a,
summary,
button{cursor:pointer}


/* Final QA pass: anchor offsets and premium mobile navigation */
#overview,#week,#fitness,#activities,#biomech,#wellness{scroll-margin-top:14px}

@media(max-width:899px){
  .side-rail{
    border-top:1px solid rgba(103,205,236,.18)!important;
    background:rgba(3,15,25,.90)!important;
    box-shadow:0 -16px 38px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(18px) saturate(120%)!important;
  }
  .rail-nav a{
    border-radius:12px!important;
    transition:background .18s ease,color .18s ease,transform .18s ease!important;
  }
  .rail-nav a b{
    border-radius:8px;
    background:rgba(72,176,214,.06);
    min-width:29px;
    min-height:29px;
    display:grid;
    place-items:center;
  }
  .rail-nav a.active{
    background:linear-gradient(180deg,rgba(25,100,135,.38),rgba(12,47,70,.30))!important;
    box-shadow:inset 0 0 0 1px rgba(103,220,247,.20)!important;
  }
  .rail-nav a.active b{
    color:#9cf3ff;
    background:rgba(68,195,232,.12);
  }

  .mobile-today-panel{
    clip-path:none!important;
  }
  .mobile-refresh-btn{
    border-color:rgba(108,211,241,.28)!important;
    background:rgba(12,45,68,.78)!important;
  }
  .mobile-workout-block{
    box-shadow:0 12px 28px rgba(0,0,0,.10);
  }
  .week-plan{
    scroll-padding-inline:2px;
  }
  .fitness-panel,
  .recent-panel,
  .load-panel,
  .biomech-panel,
  .wellness-panel{
    box-shadow:0 18px 42px rgba(0,0,0,.16)!important;
  }
}

/* subtle content density improvement on common laptop/desktop widths */
@media(min-width:900px) and (max-width:1700px){
  .dashboard{
    gap:12px!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .decision-v2-grid{gap:10px!important}
  .fitness-activity-row,.performance-row{gap:12px!important}
}


/* =====================================================================
   PERFORMANCE COLUMN V2 — mileage + weight stacked 50 / 50
   ===================================================================== */
@media(min-width:900px){
  .performance-row .load-panel{
    padding:0!important;
    overflow:hidden!important;
  }

  .load-stack{
    display:grid;
    grid-template-rows:minmax(0,1fr) minmax(0,1fr);
    height:100%;
    min-height:clamp(360px,24vw,520px);
  }

  .load-block{
    min-height:0;
    padding:clamp(12px,.75vw,17px);
    display:flex;
    flex-direction:column;
    position:relative;
  }

  .load-block+.load-block{
    border-top:1px solid rgba(99,190,222,.18);
  }

  .load-block+.load-block:before{
    content:"";
    position:absolute;
    top:-1px;
    left:clamp(16px,1vw,24px);
    width:clamp(70px,5.5vw,120px);
    height:1px;
    background:linear-gradient(90deg,var(--award-cyan),transparent);
  }

  .load-block .panel-head{
    flex:0 0 auto;
    margin-bottom:4px!important;
  }

  .load-block .big-total{
    font-size:clamp(20px,1.35vw,30px)!important;
    color:#dff7ff!important;
    opacity:.95;
  }

  .run-volume-block .load-chart{
    flex:1 1 auto;
    width:100%;
    height:auto!important;
    min-height:clamp(135px,8.3vw,180px)!important;
  }

  .weight-block .weight-chart{
    flex:1 1 auto;
    width:100%;
    min-height:clamp(125px,7.9vw,172px);
  }

  .weight-chart .analysis-svg{
    width:100%;
    height:100%;
    display:block;
  }

  .weight-svg .weight-area{
    pointer-events:none;
  }

  .weight-svg .weight-line{
    fill:none;
    stroke:#62ddf6;
    stroke-width:3;
    vector-effect:non-scaling-stroke;
    filter:drop-shadow(0 0 8px rgba(98,221,246,.10));
  }

  .weight-svg .weight-point{
    fill:#061827;
    stroke:#9beeff;
    stroke-width:2;
    vector-effect:non-scaling-stroke;
  }

  .weight-meta{
    flex:0 0 auto;
    margin-top:2px;
    color:#7193a4;
    font-size:clamp(8.5px,.48vw,10.5px);
    line-height:1.4;
  }

  .weight-single{
    height:100%;
    min-height:120px;
    display:grid;
    place-items:center;
    align-content:center;
    gap:4px;
    border:1px dashed rgba(99,190,222,.16);
    border-radius:12px;
    color:#7e9dac;
  }
  .weight-single strong{
    color:#e9f8fc;
    font-size:clamp(26px,1.7vw,38px);
  }
  .weight-single span{
    font-size:10px;
  }

  /* Keep biomechanics visually balanced against the stacked left column */
  .performance-row .biomech-panel{
    min-height:clamp(360px,24vw,520px)!important;
  }
}

/* Mobile: mileage and weight stay stacked, with readable compact charts */
@media(max-width:899px){
  .load-panel{padding:0!important}
  .load-stack{display:block}
  .load-block{padding:13px 10px}
  .load-block+.load-block{border-top:1px solid rgba(92,181,214,.18)}
  .run-volume-block .load-chart{height:190px!important}
  .weight-block .weight-chart{height:190px}
  .weight-meta{margin-top:5px;color:#7698a9;font-size:9px;line-height:1.4}
}