:root{
  --navy:#06111f;--navy2:#0a1b31;--ink:#0b213a;--muted:#6c8298;--cyan:#17c9ef;--cyan2:#77edff;
  --blue:#0879ee;--red:#ff4055;--green:#26c88a;--amber:#ffaf37;--paper:#f6fbff;--line:#c8d9e7;
  --shadow:0 14px 32px rgba(0,25,55,.13)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#07121f;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans HK","PingFang HK",sans-serif}
.app-frame{display:grid;grid-template-columns:145px minmax(0,1fr);max-width:1660px;margin:auto;min-height:100vh;background:#0a1727;box-shadow:0 0 120px #000}
.side-rail{position:sticky;top:0;height:100vh;padding:24px 14px 18px;background:linear-gradient(180deg,#061321,#081a2e 70%,#06111d);color:#dff8ff;border-right:1px solid #163b59;overflow:hidden}
.side-rail:before,.side-rail:after{content:"";position:absolute;width:85px;height:2px;background:var(--red);transform:rotate(-32deg);opacity:.7}.side-rail:before{left:-25px;top:155px}.side-rail:after{right:-35px;bottom:110px}
.brand-lockup{display:flex;align-items:center;gap:10px;position:relative;z-index:2}.brand-mark{width:44px;height:34px;background:linear-gradient(135deg,var(--red),#ff1b37);clip-path:polygon(0 52%,72% 0,45% 42%,100% 24%,28% 100%,48% 57%);font-size:0;filter:drop-shadow(0 0 10px #ff365588)}
.brand-lockup strong{display:block;font-size:12px;font-style:italic;letter-spacing:.06em}.brand-lockup span{display:block;color:var(--cyan2);font-size:10px;letter-spacing:.22em;font-weight:800}.rail-tag{font-size:9px;letter-spacing:.22em;line-height:1.65;color:#8db1cb;margin:22px 4px 28px}
.rail-nav{display:grid;gap:4px}.rail-nav a{color:#a9bfd2;text-decoration:none;padding:12px 10px;display:flex;gap:9px;align-items:center;font-size:12px;border-left:3px solid transparent}.rail-nav a:hover,.rail-nav a.active{color:#071524;background:linear-gradient(90deg,#27ddff,#d7f7ff);border-left-color:#fff}.rail-nav b{font-size:15px}.rail-footer{position:absolute;bottom:22px;left:18px;color:#4e9ec8;font-size:9px;letter-spacing:.32em;line-height:1.7}
.page{min-width:0;background:#e8f1f7}

/* compact dynamic weather strip */
.weather-hero{height:132px;position:relative;overflow:hidden;color:#fff;border-bottom:3px solid var(--cyan);background:#112c48}
.weather-sky{position:absolute;inset:0;overflow:hidden;background:linear-gradient(120deg,#153a64,#3181ad);transition:background .7s ease}
.weather-sky:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,18,34,.76),rgba(4,18,34,.24) 43%,rgba(4,18,34,.1)),linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:auto,52px 52px,52px 52px}
.weather-sun{position:absolute;width:92px;height:92px;border-radius:50%;right:7%;top:-22px;background:radial-gradient(circle,#fff 0 8%,#fff5a5 20%,#ffd55a 42%,#ffca42aa 58%,transparent 72%);filter:blur(.2px);opacity:0;transition:.6s}
.weather-clouds{position:absolute;inset:0;opacity:.68;transition:.6s;background:radial-gradient(ellipse at 72% 42%,#dceaf4dd 0 8%,transparent 9%),radial-gradient(ellipse at 80% 47%,#dceaf4cc 0 10%,transparent 11%),radial-gradient(ellipse at 90% 37%,#dceaf4bb 0 8%,transparent 9%),radial-gradient(ellipse at 58% 62%,#d7e5efaa 0 11%,transparent 12%);animation:cloudDrift 26s linear infinite}
.weather-rain,.weather-fog,.weather-flash{position:absolute;inset:0;pointer-events:none;opacity:0}
.weather-rain{background:repeating-linear-gradient(105deg,transparent 0 19px,#b9edff88 20px 21px,transparent 22px 33px);background-size:70px 90px;animation:rainFall .55s linear infinite}
.weather-fog{background:linear-gradient(180deg,transparent,#eaf6ff66 46%,#dbeaf466 60%,transparent);filter:blur(6px);animation:fogMove 8s ease-in-out infinite alternate}
.weather-flash{background:#e7f8ff;mix-blend-mode:screen}
.weather-clear-day .weather-sky{background:linear-gradient(120deg,#087bc0,#4ec7ea 62%,#a9e8f5)}.weather-clear-day .weather-sun{opacity:1}.weather-clear-day .weather-clouds{opacity:.16}
.weather-clear-night .weather-sky{background:radial-gradient(circle at 83% 22%,#1e4269,#071426 52%,#030b15)}.weather-clear-night .weather-sun{opacity:.85;background:radial-gradient(circle,#eef7ff 0 24%,#b9d8f5 37%,#9cc7ee66 52%,transparent 69%);width:66px;height:66px;top:9px}.weather-clear-night .weather-clouds{opacity:.12}
.weather-cloudy .weather-sky{background:linear-gradient(120deg,#183650,#416981,#7c9bab)}.weather-cloudy .weather-clouds{opacity:.88}
.weather-rainy .weather-sky{background:linear-gradient(120deg,#0a2238,#294b61,#3c6375)}.weather-rainy .weather-clouds{opacity:.9}.weather-rainy .weather-rain{opacity:.72}
.weather-heavy-rain .weather-sky{background:linear-gradient(120deg,#061624,#152e42,#27485a)}.weather-heavy-rain .weather-clouds{opacity:1}.weather-heavy-rain .weather-rain{opacity:1;background-size:54px 72px}
.weather-foggy .weather-sky{background:linear-gradient(120deg,#5b7180,#8799a3,#b0bdc4)}.weather-foggy .weather-clouds{opacity:.35}.weather-foggy .weather-fog{opacity:.9}
.weather-thunder .weather-sky{background:linear-gradient(120deg,#071522,#172b40,#283c52)}.weather-thunder .weather-clouds{opacity:1}.weather-thunder .weather-rain{opacity:.85}.weather-thunder .weather-flash{animation:lightning 6s steps(1) infinite}
.weather-snow .weather-sky{background:linear-gradient(120deg,#526b82,#8ca5b8,#c5d8e5)}.weather-snow .weather-rain{opacity:.7;background:radial-gradient(circle,#fff 0 2px,transparent 2.5px);background-size:22px 28px;animation:snowFall 4s linear infinite}
@keyframes cloudDrift{from{transform:translateX(-2%)}to{transform:translateX(5%)}}@keyframes rainFall{from{background-position:0 -90px}to{background-position:-16px 90px}}@keyframes fogMove{from{transform:translateX(-2%)}to{transform:translateX(3%)}}@keyframes snowFall{from{background-position:0 -40px}to{background-position:18px 50px}}@keyframes lightning{0%,91%,94%,100%{opacity:0}92%,93%{opacity:.72}}
.top-brand{position:absolute;left:24px;top:15px;z-index:3}.top-brand span{display:block;font-size:9px;letter-spacing:.26em;color:#8defff}.top-brand strong{display:block;margin-top:6px;font-style:italic;font-size:17px;letter-spacing:.06em;text-shadow:0 2px 12px #001}
.top-kpis{position:absolute;z-index:3;left:22px;right:16px;bottom:11px;display:grid;grid-template-columns:1.35fr repeat(4,1fr);gap:7px}.top-kpi{height:62px;background:linear-gradient(135deg,rgba(4,22,39,.78),rgba(13,51,76,.58));border:1px solid rgba(116,218,255,.38);backdrop-filter:blur(6px);padding:7px 9px;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.top-kpi>span{display:block;font-size:8px;letter-spacing:.11em;color:#a8dcef}.top-kpi>strong{display:block;font-size:16px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-kpi>small{display:block;font-size:8px;color:#b6cfdd;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.weather-main>div{display:flex;align-items:baseline;gap:6px}.weather-main b{font-size:20px;color:#dff8ff}.weather-main strong{font-size:23px}.weather-main em{font-size:10px;font-style:normal;color:#cae8f5}.sync-kpi strong{font-size:10px;margin-top:8px}

/* dashboard */
.dashboard{padding:10px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:9px;align-items:start}
.panel{position:relative;background:linear-gradient(180deg,#fff,#f3f8fc);border:1px solid #bed1df;box-shadow:var(--shadow);padding:13px;overflow:hidden;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.panel:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--cyan),transparent 60%);opacity:.8}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}.panel-head>div{display:flex;align-items:baseline;gap:7px;min-width:0}.panel-head i{width:4px;height:15px;background:var(--cyan);transform:skew(-10deg);align-self:center}.panel-head i.red{background:var(--red)}.panel-head h2{font-size:16px;margin:0;white-space:nowrap}.panel-head span{font-size:8px;letter-spacing:.1em;color:#5e7891;font-weight:700}.panel-head em{font-style:normal;border:1px solid #71c9f3;color:#087bdc;border-radius:5px;padding:2px 6px;font-size:9px;font-weight:800}.panel-note{max-width:60%;text-align:right;line-height:1.35}
.status-panel{grid-column:span 5}.today-panel{grid-column:span 4}.return-panel{grid-column:span 3}.week-panel{grid-column:span 5}.load-panel{grid-column:span 4}.recent-panel{grid-column:span 3}.biomech-panel{grid-column:span 12}
.status-body{display:grid;grid-template-columns:132px 1fr;gap:15px;align-items:center}.recovery-ring{--pct:0;display:grid;place-items:center;width:118px;height:118px;border-radius:50%;background:conic-gradient(var(--cyan) calc(var(--pct)*1%),#dfeaf2 0);position:relative;box-shadow:0 0 24px #2bcceb2b}.recovery-ring:before{content:"";position:absolute;width:88px;height:88px;border-radius:50%;background:white;box-shadow:inset 0 0 0 1px #d4e3ed}.recovery-ring>div{z-index:1;text-align:center}.recovery-ring strong{display:block;font-size:31px;line-height:1}.recovery-ring span{font-size:10px;color:#536d84;font-weight:700}.status-list{display:grid;gap:4px}.status-list>div{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid #e1ebf2}.status-list span{font-size:10px;color:#6e8294}.status-list strong{font-size:11px}.status-message{margin-top:8px;background:#edf8fc;border-left:3px solid var(--cyan);padding:8px 9px;font-size:11px;line-height:1.4;color:#28485f}
.status-chip{font-size:9px;font-weight:800;padding:5px 8px;border-radius:999px;background:#dceaf3;color:#32526b}.status-chip.orange{background:#fff0d7;color:#a65f00}.status-chip.green{background:#d9f7ea;color:#08704b}.status-chip.red{background:#ffe0e4;color:#b91e35}
.today-plan{min-height:151px;display:flex;flex-direction:column;justify-content:center;padding:10px;border:1px solid #d0e0ec;background:linear-gradient(135deg,#fafdff,#eaf7fd);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}.today-plan h3{margin:0 0 5px;font-size:18px}.today-plan .muted{font-size:10px;color:#5e7891}.today-plan p{font-size:11px;line-height:1.45;margin:6px 0;color:#36536a}.today-plan p:last-child{padding-top:7px;border-top:1px solid #cfe0ea}
.return-body{display:grid;grid-template-columns:1fr 72px;gap:7px;min-height:154px}.progress-track{height:7px;background:#dce8f0;border-radius:999px;overflow:hidden;margin:4px 0 7px}.progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#27ddff,#078bff);border-radius:999px}.gate-list{display:grid;gap:4px}.gate{display:grid;grid-template-columns:14px 1fr;gap:5px;align-items:start;font-size:9px;line-height:1.2;color:#476177}.gate i{width:12px;height:12px;border:1px solid #9bb0c1;border-radius:50%}.gate.done i{background:var(--green);border-color:var(--green);box-shadow:inset 0 0 0 3px white}.knee-visual{position:relative;background:#07172a;overflow:hidden}.knee-visual img{width:100%;height:100%;object-fit:cover}.knee-score{position:absolute;right:3px;bottom:5px;color:white;text-align:right;text-shadow:0 0 12px #00cfff}.knee-score small{display:block;font-size:6px;letter-spacing:.1em}.knee-score strong{font-size:18px;color:#65e8ff}
.week-plan{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.day{min-height:108px;background:#edf4f9;border:1px solid #d4e0e9;padding:7px 5px;text-align:center;border-radius:5px}.day.current{border:2px solid #0a9cff;background:#f5fcff}.day .dow{font-size:9px;font-weight:800}.day .date{font-size:8px;color:#758b9e;margin-bottom:6px}.day h4{font-size:10px;line-height:1.2;margin:6px 0 4px}.day p{font-size:9px;color:#61788a;margin:0}.day .day-icon{display:grid;place-items:center;margin:auto;width:24px;height:24px;border-radius:50%;background:white;border:1px solid #cfdee8;color:#1189dd;font-weight:900}
.big-total{font-size:18px;color:#102e48}.load-chart{height:174px;display:flex;align-items:flex-end;gap:4px;border-bottom:1px solid #bdd0de;padding:8px 4px 22px;position:relative}.bar-wrap{height:100%;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:4px}.bar{width:100%;max-width:11px;min-height:1px;background:linear-gradient(180deg,#26ddff,#0aa5df);border-radius:2px 2px 0 0;box-shadow:0 0 10px #17c9ef3d}.bar.alert{background:linear-gradient(180deg,#ff6a78,#ff314a)}.bar-wrap small{position:absolute;bottom:3px;font-size:8px;color:#7890a4}
.activity-cards{display:grid;gap:6px}.activity-card{display:grid;grid-template-columns:50px 1fr 14px;gap:7px;align-items:center;padding:6px;border-bottom:1px solid #d8e4ec;cursor:pointer}.activity-card:hover{background:#eef8fd}.activity-thumb{height:39px;background:linear-gradient(135deg,#0d263d,#174f6a);position:relative;overflow:hidden}.activity-thumb:after{content:"";position:absolute;inset:5px;background:linear-gradient(130deg,transparent 20%,#24dbff 21% 25%,transparent 26% 43%,#ff4b5f 44% 47%,transparent 48%);opacity:.75}.activity-card h4{font-size:10px;margin:0 0 3px}.activity-meta{font-size:8px;color:#597287;display:flex;gap:6px;flex-wrap:wrap}.activity-arrow{color:#1d8fd7;font-size:17px}
.metric-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.metric-card{background:linear-gradient(180deg,#f9fcff,#eef5fa);border:1px solid #d3e0e9;padding:9px;min-width:0}.metric-card label{display:block;font-size:10px;font-weight:800;margin:2px 0 3px}.metric-card label small{font-weight:500;color:#71869a}.metric-card strong{font-size:16px}.metric-icon{font-size:15px;color:#0a90e8}.metric-icon.heart,.metric-icon.power{color:#ff4055}.spark{height:40px;margin-top:4px}.spark svg{width:100%;height:100%;overflow:visible}.coach-notes{margin-top:8px;background:#07192c;color:#cfe7f8;padding:9px 11px;border-left:4px solid var(--cyan);font-size:10px;line-height:1.5}
dialog{max-width:760px;width:calc(100% - 28px);background:#f4f9fd;color:var(--ink);border:1px solid #6fa6c7;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);padding:22px;box-shadow:0 30px 100px #001b}.close{position:absolute;right:13px;top:8px;border:0;background:none;color:#294a63;font-size:28px;cursor:pointer}dialog::backdrop{background:#03101bd9}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.detail-grid>div{background:white;border:1px solid #d5e2ec;padding:9px}.detail-grid span{display:block;font-size:9px;color:#71879a}.detail-grid strong{font-size:14px}
@media(max-width:1180px){.app-frame{grid-template-columns:78px 1fr}.brand-lockup>div:last-child,.rail-tag,.rail-nav span,.rail-footer{display:none}.side-rail{padding:22px 10px}.brand-lockup{justify-content:center}.rail-nav a{justify-content:center}.top-kpis{grid-template-columns:1.2fr repeat(2,1fr)}.top-kpi:nth-child(4),.top-kpi:nth-child(5){display:none}.status-panel{grid-column:span 6}.today-panel{grid-column:span 6}.return-panel{grid-column:span 12}.week-panel{grid-column:span 12}.load-panel{grid-column:span 7}.recent-panel{grid-column:span 5}.metric-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.app-frame{display:block}.side-rail{position:static;height:auto;display:flex;align-items:center;justify-content:space-between;padding:10px 12px}.rail-nav{display:flex}.rail-nav a{padding:8px}.weather-hero{height:178px}.top-brand{top:10px;left:12px}.top-kpis{left:8px;right:8px;bottom:8px;grid-template-columns:1.2fr 1fr}.top-kpi{height:56px}.top-kpi:nth-child(3){display:none}.dashboard{padding:7px;grid-template-columns:1fr}.panel{grid-column:1!important}.status-body{grid-template-columns:105px 1fr}.recovery-ring{width:98px;height:98px}.recovery-ring:before{width:74px;height:74px}.recovery-ring strong{font-size:25px}.week-plan{overflow:auto;grid-template-columns:repeat(7,100px);padding-bottom:3px}.metric-grid{grid-template-columns:repeat(2,1fr)}.return-body{grid-template-columns:1fr 68px}.detail-grid{grid-template-columns:repeat(2,1fr)}}


/* === Desktop readability pass: information first, allow vertical scroll === */
@media (min-width:1181px){
  .app-frame{grid-template-columns:128px minmax(0,1fr);max-width:1920px}
  .side-rail{padding:24px 12px 18px}
  .brand-lockup strong{font-size:13px}.brand-lockup span{font-size:10px}.rail-nav a{font-size:13px;padding:13px 9px}

  .weather-hero{height:150px}
  .top-brand{left:26px;top:16px}.top-brand span{font-size:10px}.top-brand strong{font-size:20px;margin-top:7px}
  .top-kpis{left:24px;right:18px;bottom:12px;gap:9px;grid-template-columns:1.25fr repeat(4,1fr)}
  .top-kpi{height:72px;padding:9px 12px}
  .top-kpi>span{font-size:10px}.top-kpi>strong{font-size:20px;margin-top:5px}.top-kpi>small{font-size:10px;margin-top:2px}
  .weather-main b{font-size:24px}.weather-main strong{font-size:29px}.weather-main em{font-size:12px}.sync-kpi strong{font-size:12px;margin-top:10px}

  .dashboard{padding:14px;gap:14px}
  .panel{padding:19px;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
  .panel-head{margin-bottom:15px}.panel-head h2{font-size:20px}.panel-head span{font-size:10px}.panel-head em{font-size:11px;padding:3px 8px}.panel-note{font-size:11px}

  /* two readable cards first; recovery criteria gets its own row */
  .status-panel{grid-column:span 6}.today-panel{grid-column:span 6}.return-panel{grid-column:span 12}
  .week-panel{grid-column:span 12}.load-panel{grid-column:span 7}.recent-panel{grid-column:span 5}.biomech-panel{grid-column:span 12}

  .status-body{grid-template-columns:180px 1fr;gap:24px}
  .recovery-ring{width:158px;height:158px}.recovery-ring:before{width:118px;height:118px}
  .recovery-ring strong{font-size:42px}.recovery-ring span{font-size:13px}
  .status-list{gap:7px}.status-list>div{padding:9px 0}.status-list span{font-size:13px}.status-list strong{font-size:15px}
  .status-message{font-size:14px;line-height:1.5;padding:11px 12px;margin-top:12px}.status-chip{font-size:11px;padding:6px 10px}

  .today-plan{min-height:225px;padding:18px}.today-plan h3{font-size:26px;margin:2px 0 10px}
  .today-plan .muted{font-size:13px}.today-plan p{font-size:15px;line-height:1.58;margin:10px 0}

  .return-body{grid-template-columns:1fr 130px;gap:18px;min-height:195px}
  .progress-track{height:10px;margin:7px 0 12px}.gate-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}
  .gate{grid-template-columns:18px 1fr;gap:8px;font-size:14px;line-height:1.35}.gate i{width:16px;height:16px}
  .knee-visual{min-height:190px}.knee-score small{font-size:8px}.knee-score strong{font-size:25px}

  .week-plan{gap:8px}.day{min-height:150px;padding:12px 9px}.day .dow{font-size:13px}.day .date{font-size:11px;margin-bottom:9px}
  .day .day-icon{width:34px;height:34px;font-size:16px}.day h4{font-size:14px;line-height:1.3;margin:10px 0 7px}.day p{font-size:12px;line-height:1.3}

  .big-total{font-size:24px}.load-chart{height:270px;padding:12px 6px 28px}.bar{max-width:16px}.bar-wrap small{font-size:10px}

  .activity-cards{gap:9px}.activity-card{grid-template-columns:76px 1fr 18px;gap:12px;padding:10px 8px}
  .activity-thumb{height:58px}.activity-card h4{font-size:14px;margin-bottom:7px}.activity-meta{font-size:11px;gap:10px}.activity-arrow{font-size:22px}

  .metric-grid{grid-template-columns:repeat(3,1fr);gap:10px}.metric-card{padding:15px}
  .metric-card label{font-size:14px;margin:5px 0}.metric-card label small{font-size:11px}.metric-card strong{font-size:23px}
  .metric-icon{font-size:20px}.spark{height:68px;margin-top:8px}.coach-notes{font-size:14px;line-height:1.65;padding:14px 16px;margin-top:12px}

  dialog{max-width:900px;padding:28px}.detail-grid{grid-template-columns:repeat(4,1fr);gap:10px}
  .detail-grid span{font-size:11px}.detail-grid strong{font-size:18px}
}


/* === Analytical charts: real axes, dates, units, injury breakpoint === */
.load-chart{
  display:block !important;
  height:300px !important;
  padding:0 !important;
  border-bottom:0 !important;
  overflow:visible !important;
}
.spark{
  height:155px !important;
  margin-top:10px !important;
}
.analysis-svg{
  width:100%;
  height:100%;
  display:block;
  overflow:visible;
}
.analysis-svg .grid-line{
  stroke:#d7e3ec;
  stroke-width:1;
  stroke-dasharray:3 4;
  vector-effect:non-scaling-stroke;
}
.analysis-svg .axis-line{
  stroke:#8ba2b5;
  stroke-width:1.1;
  vector-effect:non-scaling-stroke;
}
.analysis-svg .axis-tick{
  stroke:#8ba2b5;
  stroke-width:1;
  vector-effect:non-scaling-stroke;
}
.analysis-svg .axis-label{
  fill:#667f94;
  font-size:11px;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans HK",sans-serif;
}
.analysis-svg .axis-unit{
  fill:#45657d;
  font-size:10px;
  font-weight:800;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans HK",sans-serif;
}
.analysis-svg .data-line{
  fill:none;
  stroke-width:2.4;
  vector-effect:non-scaling-stroke;
}
.analysis-svg .data-point{
  stroke:white;
  stroke-width:1.5;
  vector-effect:non-scaling-stroke;
  cursor:crosshair;
}
.analysis-svg .data-point:hover{
  r:6;
  filter:drop-shadow(0 0 4px rgba(0,121,238,.5));
}
.analysis-svg .bar-rect{
  fill:#13bfe6;
}
.analysis-svg .bar-rect:hover{
  fill:#079bd0;
}
.analysis-svg .bar-rect.injury{
  fill:#ff4055;
}
.analysis-svg .injury-line{
  stroke:#ff4055;
  stroke-width:1.5;
  stroke-dasharray:5 4;
  vector-effect:non-scaling-stroke;
}
.analysis-svg .injury-label{
  fill:#d32139;
  font-size:10px;
  font-weight:800;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans HK",sans-serif;
}
.chart-empty{
  height:100%;
  display:grid;
  place-items:center;
  color:#71879a;
  font-size:12px;
}
.metric-card{
  min-height:250px;
}
@media(max-width:1180px){
  .spark{height:135px !important}
  .metric-card{min-height:225px}
  .load-chart{height:270px !important}
}
@media(max-width:760px){
  .spark{height:125px !important}
  .metric-card{min-height:210px}
  .load-chart{height:250px !important}
  .analysis-svg .axis-label{font-size:10px}
}


/* === Daily readiness + wellness === */
.daily-decision-panel{
  grid-column:span 12;
  background:linear-gradient(135deg,#07192c 0%,#0b2741 56%,#103953 100%);
  color:#eefaff;
  border-color:#27799b;
  box-shadow:0 18px 42px rgba(0,35,67,.22);
}
.daily-decision-panel:before{background:linear-gradient(90deg,var(--red),var(--cyan),transparent 75%)}
.daily-decision-panel .panel-head h2{color:#fff}
.daily-decision-panel .panel-head span{color:#8bdcf4}
.daily-decision-grid{display:grid;grid-template-columns:1.25fr 1.15fr .9fr;gap:16px;align-items:stretch}
.decision-primary{display:grid;grid-template-columns:118px 1fr;gap:16px;align-items:center}
.state-orb{
  width:112px;height:112px;border-radius:50%;display:grid;place-items:center;text-align:center;
  background:radial-gradient(circle at 50% 42%,#173953,#071423 70%);
  border:2px solid #496a80;box-shadow:inset 0 0 0 8px #071726,0 0 26px #1bbfea22;
  position:relative;overflow:hidden
}
.state-orb:before{content:"";position:absolute;inset:7px;border-radius:50%;border:7px solid #35546b;border-top-color:#6b8798;transform:rotate(-25deg)}
.state-orb span,.state-orb strong{z-index:1}.state-orb span{font-size:10px;color:#8fb3c7;letter-spacing:.16em}.state-orb strong{font-size:24px;color:white;margin-top:-24px}
.state-orb.state-green{border-color:#36d99b;box-shadow:0 0 28px #36d99b35}.state-orb.state-green:before{border-top-color:#36d99b}
.state-orb.state-blue{border-color:#3ca7ff;box-shadow:0 0 28px #3ca7ff35}.state-orb.state-blue:before{border-top-color:#3ca7ff}
.state-orb.state-amber{border-color:#ffb64b;box-shadow:0 0 28px #ffb64b35}.state-orb.state-amber:before{border-top-color:#ffb64b}
.state-orb.state-red{border-color:#ff5267;box-shadow:0 0 28px #ff526735}.state-orb.state-red:before{border-top-color:#ff5267}
.state-orb.state-unknown{border-color:#527184}.state-orb.state-unknown:before{border-top-color:#7896a8}
.decision-copy{min-width:0}.decision-copy h2{font-size:24px;line-height:1.18;margin:8px 0;color:#fff}.decision-copy p{font-size:13px;line-height:1.55;color:#c4dce8;margin:0}
.decision-badge{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:800;background:#304b5d;color:#dcecf3}
.decision-badge.green{background:#123f33;color:#94f0c8}.decision-badge.blue{background:#103a60;color:#95ceff}.decision-badge.amber{background:#513715;color:#ffd38b}.decision-badge.red{background:#4e1b24;color:#ffb3bd}
.wellness-kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wellness-kpi{background:linear-gradient(145deg,#0a1d31,#102e47);border:1px solid #2d5c78;padding:10px 12px;min-height:78px;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.wellness-kpi span{display:block;font-size:10px;color:#86afc5;letter-spacing:.08em}.wellness-kpi strong{display:block;font-size:22px;color:#fff;margin-top:5px}.wellness-kpi small{display:block;font-size:9px;color:#9ec6d8;margin-top:3px}
.decision-action{background:linear-gradient(145deg,#f9fdff,#e8f6fc);border:1px solid #60c8ea;color:var(--ink);padding:14px 15px;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}
.decision-action>span{font-size:10px;color:#58778e;letter-spacing:.12em}.decision-action>strong{display:block;font-size:24px;line-height:1.15;margin:8px 0;color:#0b3553}.decision-action p{font-size:12px;line-height:1.5;color:#456379;margin:0}
.daily-flags{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.daily-flags span{font-size:9px;padding:4px 7px;border-radius:999px;background:#d8edf6;color:#28556d}

.wellness-panel{grid-column:span 12}
.wellness-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.wellness-chart-card{background:linear-gradient(180deg,#fbfdff,#eef5fa);border:1px solid #d1dfe9;padding:11px;min-width:0}
.wellness-chart-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.wellness-chart-head span{font-size:12px;font-weight:800;color:#37546b}.wellness-chart-head strong{font-size:18px;color:#102e48}
.wellness-chart{height:145px;margin-top:6px}
.wellness-analysis{margin-top:10px;background:#07192c;color:#cfe7f8;padding:11px 13px;border-left:4px solid #8a62ff;font-size:12px;line-height:1.6}
.analysis-svg .baseline-line{stroke:#8a62ff;stroke-width:1.3;stroke-dasharray:6 4;opacity:.8;vector-effect:non-scaling-stroke}
.analysis-svg .baseline-label{fill:#7250d8;font-size:9px;font-weight:800;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Noto Sans HK",sans-serif}

@media(min-width:1181px){
  .daily-decision-panel{padding:20px 22px}
  .daily-decision-grid{grid-template-columns:1.3fr 1.05fr .9fr;gap:18px}
  .decision-primary{grid-template-columns:140px 1fr}.state-orb{width:132px;height:132px}.state-orb strong{font-size:28px}
  .decision-copy h2{font-size:28px}.decision-copy p{font-size:14px}
  .wellness-kpi{min-height:88px;padding:12px 14px}.wellness-kpi strong{font-size:25px}.wellness-kpi span{font-size:11px}.wellness-kpi small{font-size:10px}
  .decision-action{padding:17px}.decision-action>strong{font-size:27px}.decision-action p{font-size:13px}
  .wellness-chart{height:165px}.wellness-chart-card{padding:14px}.wellness-analysis{font-size:14px}
}
@media(max-width:1180px){
  .daily-decision-grid{grid-template-columns:1fr 1fr}.decision-action{grid-column:span 2}
  .wellness-detail-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .daily-decision-grid{grid-template-columns:1fr}.decision-primary{grid-template-columns:95px 1fr;gap:10px}.decision-action{grid-column:span 1}
  .state-orb{width:88px;height:88px}.state-orb strong{font-size:19px}.decision-copy h2{font-size:20px}
  .wellness-kpis{grid-template-columns:1fr 1fr}.wellness-kpi{min-height:72px;padding:9px}.wellness-kpi strong{font-size:18px}
  .wellness-detail-grid{grid-template-columns:1fr}.wellness-chart{height:135px}
}


/* === Provenance + no-run rehab mode === */
.provenance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}
.provenance-card{background:#0a1a2b;border:1px solid #31556d;padding:10px 12px;min-height:86px}
.source-head,.log-title,.trend-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.source-head small,.log-title small{font-size:9px;color:#8eafc1}
.source-badge{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.04em;white-space:nowrap}
.source-badge.objective{background:#dff4ff;color:#075c82;border:1px solid #8dd9f4}
.source-badge.manual{background:#fff0d8;color:#9a5a00;border:1px solid #ffc96d}
.source-badge.subjective{background:#efe7ff;color:#6546a4;border:1px solid #c5b3ef}
.source-badge.tiny{font-size:8px;padding:2px 5px}
.source-body{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.source-body span{font-size:10px;color:#d6e8f2;background:#102b42;border:1px solid #284d65;padding:4px 6px;border-radius:5px}

.rehab-progress-panel,.daily-log-panel,.recovery-trend-panel{grid-column:span 12}
.rehab-stage-summary{text-align:right}.rehab-stage-summary>span{display:block;font-size:9px;color:#6c8298}.rehab-stage-summary strong{display:block;font-size:16px;color:#0d3856}.rehab-stage-summary small{font-size:9px;color:#678096}
.rehab-timeline{display:grid;grid-template-columns:repeat(10,1fr);gap:5px;align-items:stretch}
.rehab-step{position:relative;min-height:84px;background:#eef4f8;border:1px solid #d2dfe8;padding:10px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.rehab-step:after{content:"";position:absolute;top:50%;right:-6px;width:7px;height:2px;background:#b4c7d5;z-index:2}.rehab-step:last-child:after{display:none}
.rehab-step span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:1px solid #a8bdcc;color:#7790a2;background:white;font-size:12px;font-weight:900}
.rehab-step strong{font-size:10px;line-height:1.25;color:#506b80}
.rehab-step.done{background:#e8f9f3;border-color:#9addc5}.rehab-step.done span{background:#28bf88;color:white;border-color:#28bf88}.rehab-step.done strong{color:#176b4d}
.rehab-step.current{background:#e7f7fd;border:2px solid #17bde4}.rehab-step.current span{background:#17bde4;color:white;border-color:#17bde4;box-shadow:0 0 14px #17bde455}.rehab-step.current strong{color:#075a78}
.rehab-step.next{background:#fff8e9;border-color:#ffc86d}.rehab-step.next span{border-color:#f1ae37;color:#a96a00}.rehab-step.next strong{color:#805500}
.rehab-gate-note{margin-top:10px;padding:9px 11px;background:#f4f8fb;border-left:3px solid #ff4055;font-size:11px;line-height:1.5;color:#456379}

.daily-log-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.log-column{border:1px solid #d3e1ea;background:#f9fcfe;padding:12px}.log-list{display:grid;gap:6px;margin-top:9px}.log-row{display:grid;grid-template-columns:64px 1fr;gap:8px;padding:7px 0;border-bottom:1px solid #e1ebf1}.log-row:last-child{border-bottom:0}.log-row time{font-size:10px;color:#6d8396}.log-row strong{display:block;font-size:12px}.log-row span{display:block;font-size:10px;color:#657d90;margin-top:2px;line-height:1.35}.empty-log{color:#8093a4;font-size:11px;padding:14px 0}

.recovery-trend-grid{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:10px}.recovery-trend-card,.recovery-function-card{border:1px solid #d2e0e9;background:#f9fcfe;padding:11px;min-width:0}.trend-card-head strong{font-size:12px;color:#24455e}.manual-bar{fill:#00a8c9}.manual-bar:hover{fill:#007f9a}
.single-value-chart{height:100%;display:grid;place-items:center;text-align:center}.single-value-chart strong{font-size:34px;color:#0d3856}.single-value-chart span{display:block;font-size:10px;color:#708799;margin-top:-25px}
.function-trend{margin-top:8px;overflow:auto}.function-row{display:grid;grid-template-columns:72px repeat(5,1fr);gap:4px;align-items:center;min-width:420px;padding:5px 0;border-bottom:1px solid #e3ebf1;font-size:10px;text-align:center}.function-head{font-weight:800;color:#617a8e}.function-row>span:first-child{text-align:left;color:#647d91}.function-row .good{color:#11835d;font-weight:900}.function-row .warn{color:#d66c00;font-weight:900}.function-row .pending{color:#6e55a8;font-weight:900}.function-row .unknown{color:#9cadb9}

.rehab-mode .wellness-panel,.rehab-mode .rehab-progress-panel,.rehab-mode .daily-log-panel,.rehab-mode .recovery-trend-panel{box-shadow:0 14px 36px rgba(0,74,110,.15)}
.rehab-mode .load-panel,.rehab-mode .recent-panel,.rehab-mode .biomech-panel{opacity:.78}
.rehab-mode .biomech-panel:after{content:"近期無跑步：此區保留最後 FIT 歷史數據，唔代表今日狀態";position:absolute;right:18px;top:18px;font-size:9px;color:#7f91a0;background:#eef3f6;padding:4px 7px;border-radius:999px}
.rehab-mode .daily-decision-panel{box-shadow:0 20px 48px rgba(0,87,124,.28)}

@media(min-width:1181px){
  .provenance-card{min-height:96px}.source-body span{font-size:11px}
  .rehab-step{min-height:100px;padding:12px 7px}.rehab-step strong{font-size:11px}.rehab-step span{width:29px;height:29px}
  .rehab-gate-note{font-size:13px}.log-row{grid-template-columns:78px 1fr}.log-row time{font-size:12px}.log-row strong{font-size:14px}.log-row span{font-size:12px}
  .recovery-trend-card,.recovery-function-card{padding:14px}.function-row{font-size:11px}
}
@media(max-width:1180px){
  .provenance-grid{grid-template-columns:1fr}.rehab-timeline{overflow:auto;grid-template-columns:repeat(10,130px);padding-bottom:4px}.recovery-trend-grid{grid-template-columns:1fr 1fr}.recovery-function-card{grid-column:span 2}
}
@media(max-width:760px){
  .daily-log-grid,.recovery-trend-grid{grid-template-columns:1fr}.recovery-function-card{grid-column:span 1}.rehab-stage-summary{text-align:left}.provenance-card{min-height:0}
  .rehab-mode .biomech-panel:after{position:static;display:block;margin:0 0 10px;text-align:center}
}


/* === General dashboard first; temporary rehab UI collapsed === */
.rehab-details-shell{
  grid-column:span 12;
  background:linear-gradient(180deg,#f8fbfd,#eef5f9);
  border:1px solid #bfd3e0;
  box-shadow:0 10px 26px rgba(0,35,60,.08);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  overflow:hidden;
}
.rehab-details-shell>summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:62px;
  padding:13px 18px;
  background:linear-gradient(90deg,#f7fbfd,#eaf4f9);
  border-left:4px solid #7aa9bf;
  user-select:none;
}
.rehab-details-shell>summary::-webkit-details-marker{display:none}
.rehab-summary-main{display:flex;align-items:center;gap:12px;min-width:0}
.rehab-summary-icon{
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:#e0edf3;color:#315e73;font-size:20px;font-weight:500;transition:transform .2s ease
}
.rehab-summary-main strong{display:block;font-size:16px;color:#15384d}
.rehab-summary-main small{display:block;margin-top:3px;font-size:10px;color:#6f8796}
.rehab-summary-hint{font-size:10px;color:#698294;white-space:nowrap}
.rehab-details-shell[open] .rehab-summary-icon{transform:rotate(45deg)}
.rehab-details-shell[open]>summary{border-bottom:1px solid #cedde6}
.rehab-details-content{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:10px;
  padding:10px;
  background:#eaf2f7;
}
.rehab-details-content>.panel{box-shadow:0 8px 20px rgba(0,32,58,.08)}
.rehab-details-content .status-panel{grid-column:span 5}
.rehab-details-content .today-panel{grid-column:span 4}
.rehab-details-content .return-panel{grid-column:span 3}
.rehab-details-content .rehab-progress-panel,
.rehab-details-content .daily-log-panel,
.rehab-details-content .recovery-trend-panel{grid-column:span 12}

/* Running / wellness remain first-class even during a temporary injury */
.rehab-mode .load-panel,
.rehab-mode .recent-panel,
.rehab-mode .biomech-panel{opacity:1}
.rehab-mode .biomech-panel:after{display:none}

/* Make the plan visually prominent near the top */
.week-panel{
  border-top-color:#7dd9ef;
  box-shadow:0 15px 34px rgba(0,83,118,.13);
}
.week-panel:before{background:linear-gradient(90deg,var(--red) 0 12%,var(--cyan) 12% 55%,transparent 82%)}

@media(max-width:1180px){
  .rehab-details-content .status-panel,
  .rehab-details-content .today-panel{grid-column:span 6}
  .rehab-details-content .return-panel{grid-column:span 12}
}
@media(max-width:760px){
  .rehab-details-shell>summary{padding:12px;align-items:flex-start}
  .rehab-summary-main small{font-size:9px;line-height:1.35}
  .rehab-summary-hint{display:none}
  .rehab-details-content{grid-template-columns:1fr;padding:7px}
  .rehab-details-content>.panel{grid-column:1!important}
}