/* TRAINING. design system – coherent spacing, typography, and subtle card hierarchy. */
:root{--training-accent:#c2e68c;--training-deep:#0b1422;--training-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",sans-serif;font-family:var(--training-font);--radius-card:16px}
body{font-family:var(--training-font);background:radial-gradient(ellipse 75% 52% at 90% 0,rgba(24,52,60,.33),transparent 70%),#090f1a}
button,input,textarea,select{font-family:var(--training-font)}
.training-wordmark{font-size:24px!important;letter-spacing:-.075em!important;line-height:1.04!important;font-weight:820!important;color:#edf6f4}
.training-wordmark span,.training-login-title span{color:var(--training-accent)}
.training-login-title{font-family:var(--training-font);font-size:clamp(44px,6vw,64px);font-weight:820;letter-spacing:-.085em;line-height:1.03;margin:20px 0 15px}
.login-card .brand-mark{border-radius:15px}
.brand{margin-bottom:46px;gap:12px}.brand-icon{width:42px;height:42px;border-radius:11px;font-size:26px;box-shadow:none}
.brand div:nth-child(2){gap:4px}.brand small{font-size:9px;letter-spacing:.15em;font-weight:650}
.topbar{height:71px;padding-inline:clamp(20px,3vw,42px)}.content{padding-top:33px}
.page-top,.v2-page-head{margin-bottom:24px}
.page-top h1,.v2-page-head h1{font-size:clamp(28px,3vw,40px);font-weight:750}
.nav-title,.eyebrow{letter-spacing:.105em}
.nav-item{padding:12px 13px;min-height:45px;transition:background-color .16s ease}
.sidebar{padding-top:25px}.sidebar-bottom .goal-mini{margin-bottom:18px}
.card,.v2-today-card,.v2-calendar-panel,.v2-insights .card{border-radius:var(--radius-card);border-color:#2e4155}
.card{box-shadow:0 10px 28px #03091124}
.card .subtle,.v2-page-head p{color:#a5b8c8}
.v2-page-head .v2-sync{align-self:center}
.v2-action-card,.v2-weekly-cta{gap:16px}
.v2-calendar-stats{border-radius:14px}
.btn{font-size:12px;line-height:1.35}
.btn.primary{color:#14201b}.btn.danger{color:#f0aeb2}
.v2-plot-card .v2-inline-between,.v2-analytics-grid .v2-inline-between{gap:12px}
.v2-power-profile,.v2-chart-legend,.v2-power-svg-wrap{min-width:0}
.v2-coach-note{border-radius:13px}
input:not([type=checkbox]),textarea,select{border-radius:10px}
:where(.btn,.nav-item,button):focus-visible{outline:2px solid #c2e68c;outline-offset:3px}
:where(.card,section).compare-discover{margin-top:19px;padding:25px 26px}
.compare-discover h3{font-size:21px;font-weight:730;letter-spacing:-.035em;margin:8px 0 7px}
.compare-discover p{font-size:12px;color:#a9becc;max-width:610px;margin:0;line-height:1.65}
.compare-activity-list{margin-top:17px;border-top:1px solid #34495c}
.compare-activity{display:flex;width:100%;gap:14px;justify-content:space-between;align-items:center;text-align:left;padding:15px 3px;background:transparent;border:0;border-bottom:1px solid #34495c;color:#ebf4fa}
.compare-activity:hover,.compare-activity:focus-visible{background:#1c3244;border-radius:8px;padding-inline:11px}
.compare-activity span{display:flex;flex-direction:column;gap:5px;min-width:0}
.compare-activity strong{font-size:13px;font-weight:705;overflow-wrap:anywhere}
.compare-activity small{font-size:11px;color:#8eaabf}
.compare-activity b{font-size:11px;white-space:nowrap;color:#ceeaa3}
.compare-detail{max-width:920px}.compare-detail .section-header{margin-bottom:16px}
.compare-detail .detail-heading p{font-size:12px;margin:7px 0 0;line-height:1.55}
.compare-info{padding:11px 14px;border:1px solid #345b50;background:#17352f;border-radius:10px;color:#bedecf;font-size:12px;margin-bottom:17px}
.compare-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.compare-metric{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 11px;padding:13px 14px;border:1px solid #30475a;background:#101e30;border-radius:11px;min-width:0}
.compare-metric>span{grid-column:span 2;color:#9fb5c7;font-size:10px;letter-spacing:.04em;font-weight:680}
.compare-metric>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.compare-metric small{font-size:10px;color:#87a3b6}.compare-metric strong{font-size:clamp(16px,1.8vw,23px);letter-spacing:-.045em;font-weight:750;color:#eef4f7;font-variant-numeric:tabular-nums}
.compare-metric>div:last-child strong{color:#c4e9aa}
.compare-graph-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:21px 0 10px}
.compare-graph-title h4{font-size:15px;margin:0;letter-spacing:-.015em}
.compare-graph-title span{font-size:11px;color:#9bb0c1}
.compare-chart{background:#0c1a2a;border:1px solid #304b61;border-radius:13px;padding:9px 10px 12px}
.compare-svg{width:100%;height:auto;display:block}
.compare-grid{stroke:#2e4860;stroke-width:1;stroke-dasharray:2 5}
.compare-baseline{stroke:#7491aa;stroke-width:1.4}
.compare-axis,.compare-unit{fill:#a3b9c7;font-size:13px;font-family:var(--training-font)}
.compare-unit{font-weight:760}
.compare-planned{fill:#6bc1a6;opacity:.28;stroke:#79d3b6;stroke-width:1.3}
.compare-actual{stroke:#f0bb61;stroke-width:3.6;fill:none;stroke-linejoin:round;stroke-linecap:round}
.compare-point{fill:#f0bb61}
.compare-legend{display:flex;flex-wrap:wrap;gap:9px 22px;color:#b4c9d6;font-size:11px;padding:10px 8px 0}
.compare-legend span{display:inline-flex;align-items:center;gap:7px}
.compare-legend i{display:inline-block;width:17px;height:8px;border-radius:2px}
.compare-key-plan{background:#6bc1a6;border:1px solid #a8e4d2;opacity:.8}
.compare-key-actual{background:#f0bb61}
.compare-caveat{font-size:11px;line-height:1.65;color:#94aebd;margin:12px 0}
.compare-caveat b{font-weight:700;color:#c4d7e2}
.compare-steps{margin:17px 0;border:1px solid #33485b;border-radius:12px;overflow:hidden;background:#122235}
.compare-steps summary{cursor:pointer;padding:13px 16px;font-size:12px;font-weight:730;color:#d0e6e2;background:#1a3043}
.compare-steps>p{padding:0 16px 13px}
.compare-step{display:grid;grid-template-columns:minmax(105px,1.5fr) 66px 69px 69px 74px;gap:10px;padding:11px 15px;border-bottom:1px solid #2b4154;align-items:center;font-size:11px}
.compare-step:last-of-type{border-bottom:none}
.compare-step span{overflow-wrap:anywhere}.compare-step small{color:#94aec0;font-size:10px}
.compare-step b{font-size:11px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.compare-step-head{background:#203548;color:#afc1cc;text-transform:uppercase;font-size:9px}
.compare-step-head b{font-size:9px}.compare-near{color:#bddd9c}
.activity-metrics{margin-top:13px;border-top:1px solid #30485d}
@media(max-width:1000px){.compare-summary{grid-template-columns:1fr}.compare-metric{grid-template-columns:1fr 1fr}.compare-detail{padding:23px}}
@media(max-width:730px){.training-wordmark{font-size:19px!important}.brand{margin-bottom:24px}.topbar{padding-inline:15px}.content{padding-top:21px}
 .compare-discover{padding:18px!important}.compare-detail{padding:18px 15px}
 .compare-metric{padding:11px}.compare-step{grid-template-columns:minmax(85px,1.4fr) 46px 52px 52px 59px;gap:5px;padding:9px 7px;font-size:10px}
 .compare-step b,.compare-step small{font-size:9px}.compare-chart{overflow-x:auto}.compare-svg{min-width:470px}
 .compare-activity{gap:9px}.compare-activity b{font-size:10px}}
@media(prefers-reduced-motion:reduce){.nav-item,.btn{transition:none}}
