
:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:#192c29;background:#f4f5f0;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,select{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #248779;outline-offset:3px}header{border-bottom:1px solid #dde2d9;background:#fafbf7;padding:22px max(24px,calc((100vw - 1120px)/2));display:flex;align-items:center;justify-content:space-between}.brand{font-weight:800;font-size:22px;letter-spacing:-1px}.brand span{color:#257362}.badge{font-size:12px;background:#e8eedf;padding:8px 12px;border-radius:20px;color:#405339}main{max-width:1168px;margin:auto;padding:40px 24px 48px}h1{font-size:40px;letter-spacing:-1.7px;margin:8px 0}h2{font-size:20px;letter-spacing:-.5px;margin:0}h3{margin:0;font-size:17px}.muted,.sub{color:#62716b;font-size:14px;line-height:1.6}.eyebrow{text-transform:uppercase;letter-spacing:2px;color:#557465;font-size:11px;font-weight:750}.intro{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:28px}.intro p{margin:8px 0 0}.periods{display:flex;flex-wrap:wrap;gap:5px;background:#e8ece3;padding:5px;border-radius:12px;width:fit-content}.periods button,.toggle button{border:0;background:none;padding:10px 15px;border-radius:8px;color:#536258;font-size:13px}.periods button[aria-pressed=true],.toggle button[aria-pressed=true]{background:#fff;color:#173b31;box-shadow:0 2px 6px #173b3110;font-weight:700}.dates{margin:12px 0 24px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.card,.panel{background:#fff;border:1px solid #e0e5dc;border-radius:16px}.card{padding:23px}.value{font-size:33px;letter-spacing:-1px;font-weight:650;margin:12px 0 7px}.change{font-size:12px;color:#416751}.change span{color:#748177}.panel{padding:26px;margin-top:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.panel-head p{margin:5px 0 0}.toggle{display:flex;flex-wrap:wrap;background:#f0f3ed;border-radius:8px;padding:3px}.toggle button{padding:7px 10px;font-size:12px}select{background:#f8f9f5;border:1px solid #dde3d7;border-radius:7px;padding:7px 10px}.chart{height:175px;display:flex;gap:5px;align-items:end;margin-top:28px;border-bottom:1px solid #e0e5dc;background:repeating-linear-gradient(to top,transparent 0,transparent 42px,#edf0e9 43px,#edf0e9 44px)}.bar{flex:1;min-width:2px;border:0;background:#367864;border-radius:4px 4px 0 0;padding:0}.bar:hover,.bar:focus-visible{background:#153e32}.bar.empty{background:#bdc6b7}.bar.future{background:#edf0e9}.months{display:flex;justify-content:space-between;font-size:11px;color:#738174;margin-top:10px}.chart-caption{font-size:12px;color:#5f7066;min-height:20px;margin-top:15px}.activities{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:19px}.activity{background:#f6f8f3;padding:20px;border-radius:10px}.activity .value{font-size:26px}.activity p{margin:4px 0}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3a8269;margin-right:8px}.strength{background:#b98750}.bike{background:#78929f}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;margin-top:18px;text-align:left;white-space:nowrap}th{font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:#718073;font-weight:600;padding:12px 10px;border-bottom:1px solid #dfe6d9}td{font-size:14px;padding:17px 10px;border-bottom:1px solid #edf0e9}td:first-child,th:first-child{padding-left:0}tbody tr:last-child td{border-bottom:0}td small{display:block;color:#7a877b;font-size:11px;margin-top:5px}.neutral{color:#536b62}.context{padding:24px 3px;font-size:13px;color:#607064;line-height:1.7}.context summary{cursor:pointer;color:#294d3d;font-weight:600}.custom{display:flex;gap:12px;flex-wrap:wrap;margin-top:15px;align-items:end}.custom label{display:grid;gap:5px;font-size:12px}.custom input{border:1px solid #bdcbb7;border-radius:7px;padding:9px;background:#fff}.custom button{padding:10px 16px;border:0;background:#235c47;color:white;border-radius:7px}[hidden]{display:none!important}.notice{color:#805b2f;font-size:12px}.footer{font-size:11px;color:#798575;text-align:center;margin-top:18px}.account{font-size:13px;color:#647565}.chartkey{display:flex;gap:16px;font-size:11px;color:#687964;margin-top:8px}@media(max-width:760px){main{padding:28px 18px}h1{font-size:33px}.intro{display:block}.intro .badge{display:inline-block;margin-top:14px}.cards{grid-template-columns:repeat(2,1fr)}.card{padding:17px}.value{font-size:28px}.panel{padding:19px}.panel-head{align-items:start;flex-wrap:wrap}.activities{grid-template-columns:1fr}.chart{gap:3px}.account{display:none}.periods button{padding:9px 10px}}
/* Identité issue de Rick / landing-MC-light : blanc, gris Apple, violet. */
:root{color:#1d1d1f;background:#fff;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Helvetica Neue',Arial,sans-serif}body{-webkit-font-smoothing:antialiased}header{background:#fafafc;border-color:#e8e8ed}.brand span,.eyebrow{color:#5e6ad2}.muted,.sub,.account{color:#6e6e73}.badge{background:#f0effb;color:#5059ad}.periods,.toggle{background:#f5f5f7}.periods button,.toggle button{color:#6e6e73}.periods button[aria-pressed=true],.toggle button[aria-pressed=true]{background:#5e6ad2;color:#fff}.periods,.periods button{border-radius:999px}.card,.panel{border-color:#e8e8ed;border-radius:22px}.card{background:#f5f5f7;border:0}.activity{background:#f5f5f7;border-radius:16px}.dot,.bar{background:#5e6ad2}.strength{background:#949ce3}.bike{background:#424a91}.bar:hover,.bar:focus-visible{background:#424a91}.bar.empty{background:#aaaab3}.bar.future{background:#eeeef2}.chart{border-color:#e8e8ed;background:repeating-linear-gradient(to top,transparent 0,transparent 42px,#f0f0f3 43px,#f0f0f3 44px)}th,td{border-color:#ededf1}.custom button{background:#5e6ad2;border-radius:999px}.context,.context summary{color:#6e6e73}button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#5e6ad2}.change{color:#6e6e73}.variation{font-weight:600}.variation.up,.variation.up span{color:#18713e}.variation.down,.variation.down span{color:#bd303a}.variation.flat,.variation.flat span{color:#6e6e73}.ai-panel{background:#faf9ff;border-color:#e1def5}.ai-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px}.ai-empty{border:1px dashed #d1cdec;padding:20px;border-radius:14px;color:#6e6e73;line-height:1.6;font-size:14px}.ai-label{color:#5e6ad2;font-size:12px;font-weight:600;letter-spacing:.3px}.ai-layout p{font-size:14px;color:#6e6e73;line-height:1.6;margin:8px 0}.ai-layout strong{color:#1d1d1f}.chartkey{color:#6e6e73}@media(max-width:760px){.ai-layout{grid-template-columns:1fr}}

/* Source : site-freelance-next/DESIGN.md — maximecasal-apple-orbes */
:root{--primary:#0066cc;--surface:#f5f5f7;--ink:#1d1d1f;font-size:17px}
header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.8);backdrop-filter:blur(20px);border:0}
.brand span{color:var(--ink)}.eyebrow{text-transform:none;letter-spacing:0;font-size:16px;color:#6e6e73}
h1{font-size:clamp(40px,5vw,64px);font-weight:600;line-height:1.05;letter-spacing:-.02em}
h2{font-size:clamp(26px,3vw,34px);font-weight:600;line-height:1.1}
.badge{background:#f5f5f7;color:#6e6e73}.periods button[aria-pressed=true],.toggle button[aria-pressed=true],.custom button{background:var(--primary);box-shadow:none}
.panel{border:0;border-radius:0;padding:40px 24px;margin:28px -24px 0}.panel:nth-of-type(even){background:var(--surface)}
.card,.activity{border-radius:18px;box-shadow:none;border:0}.cards{grid-template-columns:repeat(5,minmax(0,1fr))}
.value{font-variant-numeric:tabular-nums;font-size:30px}.activity .value{font-size:26px}.card{padding:20px}
.ai-panel,.panel.ai-panel{background:#000;color:#f5f5f7}.ai-panel .sub,.ai-layout p,.ai-empty{color:#a1a1a6}
.ai-label{color:#a1a1a6;text-transform:none}.ai-layout strong{color:#f5f5f7}.ai-empty{background:#1d1d1f;border:0;border-radius:18px}
.ai-panel .badge{background:#272729;color:#f5f5f7}.dot,.strength,.bike,.bar{background:var(--primary)}.bar:hover,.bar:focus-visible{background:#0077ed}
.activity{display:block;width:100%;text-align:left;color:var(--ink);background:#fff;padding:22px;cursor:pointer}
.activity[aria-pressed=true]{outline:2px solid var(--primary);outline-offset:2px}
.activity-title{font-size:24px;font-weight:600}.activity .sub,.activity .value,.activity .change{display:block}
.activity-state{display:block;color:var(--primary);font-size:13px;margin-top:14px}
button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#0071e3}
button:active{transform:scale(.97)}.focus-strip{display:flex;gap:15px;align-items:center;flex-wrap:wrap;padding:18px 0}
.reset-filter{border:1px solid var(--primary);border-radius:999px;background:transparent;color:var(--primary);padding:9px 16px}
.variation.up,.variation.up span{color:#1e7a3a}.skip-link{position:absolute;left:15px;top:-80px;background:white;padding:12px;z-index:30}.skip-link:focus{top:10px}
@media(hover:hover) and (pointer:fine){.activity:hover{background:#e8e8ed}}
@media(max-width:1000px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.panel{padding:28px 18px;margin-left:-18px;margin-right:-18px}.activity-title{font-size:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}button:active{transform:none}}
/* Nappes pastel de section et illustrations locales, sans requête externe. */
:root{--ease-out:cubic-bezier(.23,1,.32,1);--ease-in-out:cubic-bezier(.77,0,.175,1)}
main{position:relative;isolation:isolate}.intro{position:relative;padding:32px 0 40px;min-height:210px;align-items:center}.intro::before{content:"";position:absolute;z-index:-1;inset:-40px -24px -5px;background:radial-gradient(ellipse at 85% 15%,#a7e5d366,transparent 60%),radial-gradient(ellipse at 45% 70%,#a8c8e840,transparent 60%);pointer-events:none}.intro h1{margin-top:14px}.intro .badge{background:#ffffffb8}
.sport-nav{display:flex;gap:16px;align-items:center;margin-left:auto;margin-right:24px;font-size:13px}.sport-nav span{color:#0066cc;font-weight:600;border-bottom:2px solid #0066cc;padding:8px 2px}
.panel:has(#activities){position:relative;isolation:isolate;background:#fafafc;overflow:hidden}.panel:has(#activities)::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 10% 80%,#f4c5a85c,transparent 65%),radial-gradient(ellipse at 95% 20%,#e8b8c452,transparent 65%);pointer-events:none}
.activity-art{display:block;width:100%;height:115px;margin:0 0 20px;background:#fafafc;border-radius:12px;overflow:hidden}.activity-art svg{width:100%;height:100%;display:block}.activity .value{margin-top:18px}.activity{overflow:hidden}.panel:has(#chart){background:#f5f5f7}.chart{background-color:#ffffff80;border-radius:12px 12px 0 0;padding:12px 10px 0}.ai-panel{border-radius:18px;margin-left:0;margin-right:0;padding:32px}.ai-label{letter-spacing:0;font-size:14px}.ai-panel h2{max-width:600px}.context{background:#f5f5f7;border-radius:18px;padding:24px;margin-top:26px}
.panel-swap{animation:panel-swap 150ms var(--ease-out)}@keyframes panel-swap{from{opacity:.45}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){.intro{animation:page-enter 500ms var(--ease-out)}.cards .card{animation:page-enter 500ms var(--ease-out) both;animation-delay:calc(var(--i,0)*50ms)}.bar{transform-origin:bottom;animation:bar-enter 500ms var(--ease-out) both;animation-delay:calc(var(--i,0)*5ms)}.reveal-ready{opacity:0;transform:translateY(14px);transition:opacity 500ms var(--ease-out),transform 500ms var(--ease-out)}.reveal-ready.is-visible{opacity:1;transform:none}}
@keyframes page-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes bar-enter{from{transform:scaleY(.05);opacity:.4}to{transform:scaleY(1);opacity:1}}
@media(max-width:600px){.intro{padding:12px 0 25px;min-height:auto}.sport-nav{margin-right:0}.intro::before{inset:-28px -18px 0}.activity-art{height:125px}.ai-panel{padding:24px}.brand>span:last-child{display:none}}
/* Direction photographique : bleu pétrole, brume et reflet. */
:root{--primary:#315f70}.intro{min-height:390px;padding:48px 32px;margin-bottom:28px;align-items:flex-start;border-radius:28px;overflow:hidden;background:#d7e3e7 url('assets/kazsport-hero.png') center 60% / cover no-repeat;isolation:isolate}.intro::before{inset:0;background:linear-gradient(90deg,rgba(235,242,244,.92),rgba(235,242,244,.66) 38%,rgba(235,242,244,0) 72%);z-index:-1}.intro h1{color:#18333e}.intro .muted,.intro .eyebrow{color:#304f5b}.intro .badge{font-size:11px;background:rgba(255,255,255,.85)}.sport-nav span{color:#315f70;border-color:#315f70}.bar:hover,.bar:focus-visible{background:#244956}.periods button[aria-pressed=true],.toggle button[aria-pressed=true]{background:#315f70}.activity-art svg{stroke:#315f70}button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#315f70}.reset-filter,.activity-state{color:#315f70}.reset-filter{border-color:#315f70}
@media(max-width:600px){.intro{min-height:350px;padding:25px 20px;background-position:65% center}.intro::before{inset:0;background:linear-gradient(180deg,rgba(235,242,244,.96),rgba(235,242,244,.68) 42%,transparent 85%)}.intro .badge{margin-top:8px}.intro h1{font-size:40px}}
.intro{background-image:url('assets/kazsport-hero-male.png')}

/* Photographies locales et présence renforcée du bleu pétrole. */
header{background:rgba(230,239,242,.92)}.brand{color:#244956}
.periods{background:#e3edf0}.periods button,.toggle button{color:#315f70}
.card{background:#e8f0f3}.card .value{color:#244956}.card:first-child{background:#315f70}.card:first-child .value,.card:first-child .muted{color:#fff}.card:first-child .change{background:#fff;border-radius:8px;padding:7px;width:fit-content}
.panel:has(#chart){background:#e3edf0}.toggle{background:#d5e4e9}.chart{background-color:#ffffffa6}
.panel.ai-panel{background:#244956}.ai-empty{background:#315f70}.ai-panel .sub,.ai-layout p,.ai-label,.ai-empty{color:#e0ebee}.ai-panel .badge{background:#3b6170;color:#fff}
.panel:has(#activities){background:#edf3f5}.panel:has(#activities)::before{background:radial-gradient(ellipse at 5% 90%,#a7e5d344,transparent 65%),radial-gradient(ellipse at 95% 10%,#a8c8e860,transparent 65%)}
.activity-art{height:auto;aspect-ratio:3/2;margin:0 0 20px;border-radius:12px;background:#d7e3e7}.activity-art img{display:block;width:100%;height:100%;object-fit:cover}
.activity[aria-pressed=true]{background:#e0ecf0;outline:3px solid #315f70}
.activity-state{font-weight:600}.context{background:#e8f0f3}.context strong{color:#244956}
/* Tables : hiérarchie des valeurs et repères de lecture. */
.panel:has(#condition),.panel:has(#workouts){background:#edf3f5;border-radius:18px;margin:28px 0 0;padding:28px}
.panel:has(#condition) h2,.panel:has(#workouts) h2{color:#244956}
.panel:has(#condition) .table-wrap,.panel:has(#workouts) .table-wrap{margin-top:20px;background:#fff;border-radius:14px;overflow:auto}
.panel:has(#condition) table,.panel:has(#workouts) table{margin:0;font-variant-numeric:tabular-nums}
.panel:has(#condition) th,.panel:has(#workouts) th{background:#315f70;color:#fff;font-size:12px;font-weight:600;letter-spacing:.3px;padding:16px 20px;border:0}
.panel:has(#condition) td,.panel:has(#workouts) td{padding:19px 20px;border-bottom:1px solid #dce6ea;color:#243f4b}
.panel:has(#condition) tbody tr:nth-child(even),.panel:has(#workouts) tbody tr:nth-child(even){background:#f0f5f7}
#condition td:first-child{font-weight:600;color:#244956}
#condition td:nth-child(2){font-weight:650;font-size:18px}
#condition td:nth-child(3){color:#536975}
#condition td small{font-size:12px;font-weight:400;color:#526975;margin-top:7px}
#workouts td:first-child{font-weight:600}#workouts td:nth-child(2){font-weight:600;color:#315f70}
#workouts td:nth-child(n+3){font-weight:550}
.panel:has(#condition) tbody tr:last-child td,.panel:has(#workouts) tbody tr:last-child td{border:0}
@media(max-width:600px){.panel:has(#condition),.panel:has(#workouts){padding:20px 16px}.panel:has(#condition) td,.panel:has(#workouts) td,.panel:has(#condition) th,.panel:has(#workouts) th{padding:15px 14px}#condition td:nth-child(2){font-size:16px}}
.condition-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;background:#e0ecf0;color:#315f70;margin-right:11px;vertical-align:middle}.condition-icon svg{width:20px;height:20px;display:block}

/* Hero pleine largeur, navigation superposée à la photographie. */
body{position:relative;isolation:isolate}
body::before{content:"";position:absolute;top:0;left:0;right:0;height:340px;z-index:-1;background:linear-gradient(90deg,rgba(230,239,242,.94) 0%,rgba(230,239,242,.64) 35%,rgba(230,239,242,.04) 75%),url('assets/kazsport-hero-male.png') center 57% / cover no-repeat}
header{position:relative;background:transparent;backdrop-filter:none;border:0;min-height:72px;color:#244956}
header .account{color:#304f5b}
main{padding-top:0}
.intro{background:none!important;border-radius:0;overflow:visible;min-height:268px;margin:0 0 30px;padding:40px 0 25px;isolation:auto}
.intro::before{display:none}.intro h1{font-size:clamp(40px,5vw,60px)}
.intro .badge{margin-top:5px}
.panel:has(#activities){margin:18px 0 0;padding:22px;border-radius:18px}
.panel:has(#activities) h2{font-size:26px}
.activity-art{max-height:150px;aspect-ratio:2/1}
.activity{padding:16px}.activity .value{font-size:25px;margin:10px 0}.activity-state{margin-top:10px}
.focus-strip{padding-top:24px}.freshness{color:#526975;font-size:12px;margin-top:-12px}
.ai-panel .sub{margin-bottom:0}.ai-panel h2{margin-top:7px;font-size:28px}
@media(max-width:600px){body::before{height:330px;background:linear-gradient(90deg,rgba(230,239,242,.9),rgba(230,239,242,.48) 55%,transparent),url('assets/kazsport-hero-male.png') 65% center / cover no-repeat}header{min-height:66px;padding:16px 18px}.intro{min-height:264px;padding:30px 0 20px;margin-bottom:22px}.intro .badge{margin-top:16px}.panel:has(#activities){padding:18px}.activity-art{max-height:160px}}

.login-panel{max-width:440px;margin:35px auto;background:#edf3f5;border-radius:18px;padding:28px}
#login{display:grid;gap:16px;margin-top:22px}#login label{display:grid;gap:7px;color:#244956;font-size:14px}
#login input{padding:12px;border:1px solid #d2d2d7;border-radius:12px;min-width:0}
#login button,#retry{border:0;border-radius:999px;background:#315f70;color:white;padding:12px 20px;cursor:pointer}
.account button{border:1px solid #315f70;color:#244956;background:#ffffffbb;padding:8px 12px;border-radius:999px}
#status{color:#315f70;min-height:24px}#status.error{color:#a42631}button:disabled{opacity:.6;cursor:wait}
.activity-art img{width:100%;height:100%;object-fit:cover}
.bar.unknown{background:#c2cdd1}.bar.current{outline:1px dashed #315f70;outline-offset:2px}
.bar.selected{background:#173a48}.chart{position:relative}.chart-empty{padding:20px;color:#526975}
#dashboard[aria-busy=true]{opacity:.6;pointer-events:none}
#condition .muted{font-size:12px}.partial-note{grid-column:1/-1;font-size:12px;color:#526975;margin-top:8px}
@media(max-width:600px){header .account{display:block}.account button{font-size:11px;padding:6px 8px}.sport-nav{margin-right:10px}header{flex-wrap:wrap;gap:5px}}

/* Confort mobile : zones sûres, gestes tactiles et tableaux explicites. */
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior:none}
body{padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}
header{padding-top:calc(16px + env(safe-area-inset-top,0px))}
.footer{padding-bottom:env(safe-area-inset-bottom,0px)}
button,a,[role="button"],select{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
button{transition:transform 120ms var(--ease-out)}
input,select{font-size:16px}
.table-wrap{overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.mobile-scroll-hint{display:none;color:#526975;font-size:12px;margin:12px 0 0}
@media(hover:hover) and (pointer:fine){.bar:hover{background:#244956}}
@media(max-width:600px){
  main{overflow:hidden;padding-bottom:calc(42px + env(safe-area-inset-bottom,0px))}
  header{padding-top:calc(14px + env(safe-area-inset-top,0px))}
  .login-panel{margin:22px 0;padding:22px 18px}
  .periods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .periods button:last-child{grid-column:1/-1}
  .custom{align-items:stretch}.custom label{flex:1 1 135px}.custom button{width:100%}
  .cards{gap:10px}.card{min-width:0}.card .value{font-size:clamp(23px,7vw,28px)}
  .toggle{width:100%!important;display:grid;grid-template-columns:repeat(3,1fr)}
  .toggle button{padding:10px 6px}
  .chart{height:150px;padding-inline:5px;gap:2px}.months{font-size:9px}
  .chartkey{flex-direction:column;gap:5px}
  .mobile-scroll-hint{display:block}
  .table-wrap{margin-inline:-16px!important;border-radius:0!important;padding-left:16px}
  table{min-width:680px}
  .context{padding:20px}
}
@media(max-width:390px){.cards{grid-template-columns:1fr}.sport-nav{display:none}.account{margin-left:auto}.intro h1{font-size:36px}}

/* Images optimisées pour le réseau mobile. */
.intro{background-image:url('assets/kazsport-hero-male.webp')}
body::before{background-image:linear-gradient(90deg,rgba(230,239,242,.94) 0%,rgba(230,239,242,.64) 35%,rgba(230,239,242,.04) 75%),url('assets/kazsport-hero-male.webp')}
@media(max-width:600px){body::before{background-image:linear-gradient(90deg,rgba(230,239,242,.9),rgba(230,239,242,.48) 55%,transparent),url('assets/kazsport-hero-male.webp')}}

/* Mobile V1 : filtres compacts, sélection du graphe claire et données sans défilement latéral. */
.bar.selected{background:#173a48;outline:3px solid #fff;box-shadow:0 0 0 4px #e59b62;position:relative;z-index:2}
.chart-caption{background:#f7fafb;border-left:4px solid #315f70;border-radius:10px;padding:11px 13px;min-height:42px;font-weight:650;color:#244956}
@media(max-width:600px){
  main{overflow:visible}
  .periods{display:flex;flex-wrap:wrap;gap:8px;width:100%;padding:0;background:transparent;border-radius:0}
  .periods button,.periods button:last-child{flex:1 1 calc(50% - 4px);grid-column:auto;min-height:44px;padding:10px 8px;border-radius:12px;background:#e6eff2}
  .periods button:last-child{flex-basis:100%}
  .periods button[aria-pressed=true]{background:#315f70;color:#fff;box-shadow:0 4px 12px rgba(49,95,112,.2)}
  .chart{overflow:visible;margin-top:22px}
  .bar.selected{outline-width:2px;box-shadow:0 0 0 3px #e59b62;transform:scaleX(1.35);transform-origin:bottom}
  .chart-caption{margin-top:16px;font-size:13px;line-height:1.45}
  .panel:has(#condition),.panel:has(#workouts){padding:20px 16px}
  .panel:has(#condition) h2,.panel:has(#workouts) h2{font-size:28px;line-height:1.08}
  .panel:has(#condition) .table-wrap,.panel:has(#workouts) .table-wrap{overflow:visible;margin:18px 0 0!important;padding:0;border-radius:0!important;background:transparent}
  .panel:has(#condition) table,.panel:has(#workouts) table{display:block;width:100%;min-width:0;white-space:normal}
  .panel:has(#condition) thead,.panel:has(#workouts) thead{display:none}
  .panel:has(#condition) tbody,.panel:has(#workouts) tbody{display:grid;gap:12px}
  .panel:has(#condition) tr,.panel:has(#workouts) tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;padding:16px;background:#fff!important;border:1px solid #dce6ea;border-radius:14px;box-shadow:0 5px 14px rgba(36,73,86,.06)}
  .panel:has(#condition) td,.panel:has(#workouts) td{display:block;min-width:0;padding:0!important;border:0!important;font-size:14px;overflow-wrap:anywhere}
  .panel:has(#condition) td::before,.panel:has(#workouts) td::before{content:attr(data-label);display:block;margin-bottom:5px;color:#6b7d85;font-size:10px;font-weight:750;letter-spacing:.45px;text-transform:uppercase}
  #workouts td:first-child,#workouts td:nth-child(2){font-size:16px}
  #condition td:first-child{grid-column:1/-1;display:flex;align-items:center;padding-bottom:12px!important;border-bottom:1px solid #e1eaed!important;font-size:16px}
  #condition td:first-child::before{display:none}
  #condition td:nth-child(2){font-size:16px}
  #condition td:last-child{grid-column:1/-1;padding:10px 12px!important;border-radius:10px!important;background:#eaf2f4}
  #workouts .empty-row{display:block}.empty-row td{display:block!important}
  .mobile-scroll-hint{display:none}
}

/* Repères pastel par métrique sur les cartes de données mobiles. */
:root{--metric-mint:#a7e5d3;--metric-peach:#f4c5a8;--metric-lavender:#c8b8e0;--metric-sky:#a8c8e8;--metric-rose:#e8b8c4}
thead th[data-tone]{color:#243f4b;border-bottom:3px solid transparent}
thead th[data-tone="mint"]{background:color-mix(in srgb,var(--metric-mint) 42%,white);border-bottom-color:var(--metric-mint)}
thead th[data-tone="peach"]{background:color-mix(in srgb,var(--metric-peach) 42%,white);border-bottom-color:var(--metric-peach)}
thead th[data-tone="lavender"]{background:color-mix(in srgb,var(--metric-lavender) 42%,white);border-bottom-color:var(--metric-lavender)}
thead th[data-tone="sky"]{background:color-mix(in srgb,var(--metric-sky) 42%,white);border-bottom-color:var(--metric-sky)}
thead th[data-tone="rose"]{background:color-mix(in srgb,var(--metric-rose) 42%,white);border-bottom-color:var(--metric-rose)}
thead th:first-child{padding-left:10px;border-radius:10px 0 0 0}thead th:last-child{border-radius:0 10px 0 0}
#condition tr[data-tone="rose"] .condition-icon{background:color-mix(in srgb,var(--metric-rose) 68%,white);color:#7a3447}
#condition tr[data-tone="lavender"] .condition-icon{background:color-mix(in srgb,var(--metric-lavender) 68%,white);color:#55416f}
#condition tr[data-tone="sky"] .condition-icon{background:color-mix(in srgb,var(--metric-sky) 68%,white);color:#315f70}
@media(min-width:601px){
  .panel:has(#condition) tbody tr:hover,.panel:has(#workouts) tbody tr:hover{background:#f7fafb}
  .panel:has(#condition) td:first-child,.panel:has(#workouts) td:nth-child(2){font-weight:650;color:#244956}
}
.ai-meta,.ai-foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#b9d3dc;font-size:12px}.ai-meta{margin-top:22px}.ai-verdict{max-width:760px;margin:18px 0 0;font-size:20px;line-height:1.45;color:#fff}.ai-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}.ai-stat{padding:16px;border-radius:14px;background:#315f70}.ai-stat span,.ai-stat small{display:block;color:#c5dce4;font-size:12px}.ai-stat strong{display:block;margin:7px 0 3px;font-size:24px;color:#fff}.ai-layout h3,.ai-context strong{color:#fff}.ai-layout ul,.ai-layout ol,.ai-context ul{margin:12px 0 0;padding-left:20px;color:#e0ebee;line-height:1.6;font-size:14px}.ai-context{margin-top:22px;padding:16px 18px;border-radius:14px;background:#183a46}.ai-foot{margin-top:20px;padding-top:16px;border-top:1px solid #477180}
@media(max-width:600px){.ai-stats{grid-template-columns:1fr}.ai-verdict{font-size:18px}}
@media(max-width:600px){
  .intro{margin-bottom:-10px}
  .periods{margin-bottom:18px}
  .dates{margin-top:0}
  .panel:has(#condition) td::before,.panel:has(#workouts) td::before{width:max-content;max-width:100%;padding:4px 7px;border-radius:7px;color:#243f4b}
  td[data-tone="mint"]::before{background:color-mix(in srgb,var(--metric-mint) 62%,white)}
  td[data-tone="peach"]::before{background:color-mix(in srgb,var(--metric-peach) 62%,white)}
  td[data-tone="lavender"]::before{background:color-mix(in srgb,var(--metric-lavender) 62%,white)}
  td[data-tone="sky"]::before{background:color-mix(in srgb,var(--metric-sky) 62%,white)}
  td[data-tone="rose"]::before{background:color-mix(in srgb,var(--metric-rose) 62%,white)}
  #condition tr[data-tone="rose"] .condition-icon{background:color-mix(in srgb,var(--metric-rose) 68%,white);color:#7a3447}
  #condition tr[data-tone="lavender"] .condition-icon{background:color-mix(in srgb,var(--metric-lavender) 68%,white);color:#55416f}
  #condition tr[data-tone="sky"] .condition-icon{background:color-mix(in srgb,var(--metric-sky) 68%,white);color:#315f70}
}

/* Lecture unifiée desktop/mobile : une teinte stable par métrique. */
.panel:has(#workouts) thead th[data-tone],.panel:has(#condition) thead th[data-tone]{color:#243f4b;border-bottom:3px solid transparent}
.panel:has(#workouts) thead th[data-tone="mint"],.panel:has(#condition) thead th[data-tone="mint"]{background:color-mix(in srgb,var(--metric-mint) 58%,white);border-bottom-color:var(--metric-mint)}
.panel:has(#workouts) thead th[data-tone="peach"],.panel:has(#condition) thead th[data-tone="peach"]{background:color-mix(in srgb,var(--metric-peach) 58%,white);border-bottom-color:var(--metric-peach)}
.panel:has(#workouts) thead th[data-tone="lavender"],.panel:has(#condition) thead th[data-tone="lavender"]{background:color-mix(in srgb,var(--metric-lavender) 58%,white);border-bottom-color:var(--metric-lavender)}
.panel:has(#workouts) thead th[data-tone="sky"],.panel:has(#condition) thead th[data-tone="sky"]{background:color-mix(in srgb,var(--metric-sky) 58%,white);border-bottom-color:var(--metric-sky)}
.panel:has(#workouts) thead th[data-tone="rose"],.panel:has(#condition) thead th[data-tone="rose"]{background:color-mix(in srgb,var(--metric-rose) 58%,white);border-bottom-color:var(--metric-rose)}
.bar.selected{background:var(--metric-peach);outline:none;box-shadow:none;transform:none;position:relative;z-index:2}
.bar.selected:hover{background:var(--metric-peach)}
.bar.selected:focus-visible{background:var(--metric-peach);outline:3px solid #244956;outline-offset:3px}
