/* Généré par scripts/build_accueil_css.py — ne pas modifier à la main. */
/* site/maquettes/gallery.css */
:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;background:#151515;color:#f5f5f5;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-underline-offset:4px}button:focus-visible,a:focus-visible{outline:2px solid white;outline-offset:5px}::selection{background:#fff;color:#111}[hidden]{display:none!important}
header{min-height:70px;margin:0 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #373737}.brand{font-size:22px;font-weight:900;font-style:italic;letter-spacing:-.035em}.edition{font-size:13px;color:#bdbdbd;margin-left:18px}header a{font-size:13px;color:#d0d0d0}.tabs{display:flex;gap:5px;overflow:auto;padding:18px 32px;scrollbar-width:thin;scrollbar-color:#656565 #151515}.tabs button{border:1px solid transparent;border-radius:24px;padding:10px 16px;white-space:nowrap;color:#bdbdbd;background:transparent;font-size:14px}.tabs button:hover{color:#fff;background:#252525}.tabs button[aria-pressed=true]{color:#151515;background:#f5f5f5}
main{padding:0 24px 30px;max-width:1728px;margin:auto}.frame{margin:0;background:#080808;overflow:hidden;aspect-ratio:16/10;position:relative}.frame>img{display:block;width:100%;height:100%;object-fit:contain}.opening{width:100%;height:100%;padding:2.4% 4%;display:flex;flex-direction:column}.mini-nav{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #333;padding-bottom:1.8%;font-size:clamp(8px,1.2vw,20px)}.mini-nav>img{width:10%;height:auto}.mini-nav span{color:#ddd}.promise{margin:auto 0;font-size:clamp(44px,14.6vw,242px);font-weight:400;line-height:.95;letter-spacing:-.04em}.promise strong{font-style:italic;font-weight:900;display:block}.opening-foot{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:clamp(8px,1.35vw,22px);padding-bottom:1.5%}.opening-foot p{margin:0;line-height:1.4}.opening-foot small{color:#bdbdbd;font-size:.8em}.pill{background:#fff;color:#111;border-radius:40px;padding:.7em 1.4em;white-space:nowrap;font-size:.8em;font-weight:600}
.details{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin:20px 8px 0}.copy{max-width:800px}.copy h1{font-size:18px;line-height:1.4;margin:0 0 7px;font-weight:600}.status{font-size:12px;color:#bdbdbd;font-weight:400;margin-left:12px}.copy p{font-size:14px;color:#bdbdbd;line-height:1.6;margin:0}.controls{display:flex;align-items:center;gap:10px;flex-shrink:0}.controls button{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid #454545;background:#242424;color:white}.controls button:hover{background:#333}.controls svg{height:18px;width:18px;fill:none;stroke:currentColor;stroke-width:1.5}#count{font-size:13px;color:#bdbdbd;font-variant-numeric:tabular-nums;min-width:40px;text-align:center}#full{font-size:13px;display:inline-block;margin-top:14px;color:#dedede}.notice{font-size:12px;color:#a7a7a7;margin:24px 8px 0;line-height:1.6}.error{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:24px;color:#dedede}
@media(max-width:650px){header{margin:0 16px;min-height:64px}.edition{display:block;margin:4px 0 0;font-size:11px}.brand{font-size:20px}header a{font-size:11px}.tabs{padding:14px 12px;gap:1px}.tabs button{padding:9px 12px;font-size:13px}main{padding:0 8px 24px}.details{margin:18px 8px 0;display:block}.controls{margin-top:16px}.copy h1{font-size:17px}.status{display:block;margin:3px 0 0}.copy p{font-size:13px}.promise{font-size:14.3vw}.mini-nav{font-size:7px}.opening-foot{font-size:7px}.notice{font-size:11px}#full{margin-top:10px}}

/* site/maquettes/v02/scenes.css */
/* site/maquettes/v02/fonts.css */
@font-face{font-family:TRNR Inter;font-style:italic;font-weight:900;font-display:swap;src:url(/site/maquettes/v02/inter-italic-900.woff2) format('woff2'),url(/site/maquettes/v02/inter-italic-900.ttf) format('truetype')}
@font-face{font-family:TRNR Inter;font-style:normal;font-weight:300;font-display:swap;src:url(/site/maquettes/v02/inter-normal-300.woff2) format('woff2'),url(/site/maquettes/v02/inter-normal-300.ttf) format('truetype')}
@font-face{font-family:TRNR Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/site/maquettes/v02/inter-normal-400.woff2) format('woff2'),url(/site/maquettes/v02/inter-normal-400.ttf) format('truetype')}
@font-face{font-family:TRNR Inter;font-style:normal;font-weight:900;font-display:swap;src:url(/site/maquettes/v02/inter-normal-900.woff2) format('woff2'),url(/site/maquettes/v02/inter-normal-900.ttf) format('truetype')}
@font-face{font-family:"TRNR Display";font-style:italic;font-weight:900;font-display:swap;src:url(/site/maquettes/v02/roboto-condensed-black-italic.woff2) format('woff2'),url(/site/maquettes/v02/roboto-condensed-black-italic.ttf) format('truetype')}

@font-face{font-family:"TRNR Accent";font-style:normal;font-weight:400;font-display:swap;src:url(/site/maquettes/v02/archivo-black.woff2) format('woff2'),url(/site/maquettes/v02/archivo-black.ttf) format('truetype')}

.native-scene{position:absolute;left:0;top:0;width:1280px;height:800px;transform-origin:top left;font-family:'TRNR Inter',sans-serif;font-synthesis:none;overflow:hidden;background:#080808;color:#fff}
.scene-art{position:absolute;inset:0;width:1280px;height:800px;object-fit:fill}
.scene-title{position:absolute;margin:0;font-size:80px;line-height:1;letter-spacing:-.04em;font-weight:300;z-index:2}
.scene-title span{display:block;white-space:nowrap}.scene-title em{font-style:italic;font-weight:900}.scene-title .accent{color:var(--accent,#fff)}
.scene-kicker{position:absolute;margin:0;font-size:12px;font-weight:400;letter-spacing:.25em;z-index:2}
.scene-prime{--accent:#c6a052}.scene-prime .scene-title{left:64px;top:280px;font-size:76px}.scene-prime .scene-kicker{left:65px;top:240px}
.scene-alpha{--accent:#ede6d6}.scene-alpha .scene-title{left:768px;top:204px;font-size:80px}.scene-alpha .scene-kicker{left:770px;top:165px}
.scene-pmt{--accent:#d83c32}.scene-pmt .scene-title{left:752px;top:220px;font-size:64px;line-height:1.08}.scene-pmt .scene-kicker{left:752px;top:176px}
.scene-tabata{--accent:#9b51e0}.scene-tabata .scene-title{left:65px;top:290px;font-size:66px;line-height:.99}.scene-tabata .scene-kicker{left:65px;top:267px;font-size:10px}
.scene-circuit{--accent:#4ecb94}.scene-circuit .scene-title{left:685px;top:271px;font-size:76px;line-height:.99}
.scene-watch{background:#f5f5f7;color:#080808}.scene-watch .scene-title{left:40px;top:235px;font-size:89px;line-height:1.12}
.scene-duo .scene-title{left:657px;top:205px;font-size:80px;line-height:1.04}.scene-duo .scene-title span:last-child{font-size:76px;margin-top:10px}
.hero-native-nav{position:absolute;top:17px;left:50px;right:50px;height:40px;border-bottom:1px solid #353535;display:flex;justify-content:space-between;align-items:flex-start;font-size:12px;z-index:5}.hero-native-nav img{width:122px;height:auto}.hero-native-nav div{display:flex;gap:42px;align-items:center}.hero-native-nav .cta{margin-top:-6px;border-radius:30px;background:white;color:black;padding:11px 29px;font-size:12px;font-weight:900}
.hero-title{position:absolute;left:49px;top:132px;margin:0;font-weight:300;letter-spacing:-.055em;line-height:.91;z-index:1;font-size:264px}.hero-title span{display:block;white-space:nowrap}.hero-title strong{display:block;font-weight:900;font-style:italic;font-size:276px;letter-spacing:-.045em;line-height:1.02}
.hero-foot{position:absolute;left:50px;right:50px;bottom:121px;display:flex;justify-content:space-between;align-items:center;z-index:4}.hero-foot p{font-size:21px;margin:0;line-height:1.45;font-weight:400}.hero-foot small{font-size:17px;color:#bdbdbd}.hero-foot .cta{background:#fff;color:#111;border-radius:32px;padding:14px 24px;font-size:12px;font-weight:900}.hero-foot .soon{text-align:right;font-size:11px;color:#bdbdbd;margin-top:12px}.hero-bottom{position:absolute;bottom:46px;width:100%;text-align:center;font-size:9px;letter-spacing:.35em}.hero-bottom svg{display:block;margin:0 auto 17px;width:18px;height:36px;stroke:#fff;fill:none;stroke-width:1}
.hero-phones{position:absolute;inset:0;width:1280px;height:800px;z-index:3;clip-path:url(#phones-outline)}
body.focus-view header,body.focus-view>.tabs,body.focus-view .details,body.focus-view .notice{display:none}body.focus-view main{padding:0;max-width:none}body.focus-view .frame{width:100%;margin:auto}body.focus-view{background:#080808}

/* Fixed states of the same series, before motion design. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.prime-demo{position:absolute;left:64px;top:610px;width:550px;display:grid;grid-template-columns:170px 194px 150px;column-gap:0;z-index:3;font-variant-numeric:tabular-nums}
.prime-demo p{margin:0}.demo-number{font-size:56px;font-weight:300;letter-spacing:-.03em;line-height:1.08}.demo-number span{font-size:17px;letter-spacing:0;margin-left:7px;color:#c7c7c7}.prime-demo .demo-caption{font-size:14px;line-height:1.4;color:#c7c7c7;margin-top:9px;white-space:nowrap}
.demo-progress svg{width:146px;height:60px;overflow:visible;display:block;fill:#c6a052}.chart-axis{fill:none;stroke:#494949;stroke-width:1}.chart-line{fill:none;stroke:#c6a052;stroke-width:2}.demo-progress text{font-size:12px;text-anchor:middle;fill:#e5e5e5}.prime-demo .demo-disclosure{grid-column:1/-1;font-size:12px;letter-spacing:.02em;color:#aaa;margin-top:16px}

/* Native copy, independent of the transparent subject layers. */

.scene-prime .scene-title{top:261px;font-size:80px;line-height:1.04;letter-spacing:-.025em}
.scene-prime .scene-title .prime-emphasis{font-family:'TRNR Display',sans-serif;font-style:italic;font-weight:900;font-size:100px;line-height:1;letter-spacing:-.02em;margin-top:5px;-webkit-text-stroke:.7px currentColor}
.prime-description{position:absolute;left:64px;top:466px;z-index:2;font-size:21px;line-height:1.4;margin:0;font-weight:400;letter-spacing:-.01em}
.prime-rule{position:absolute;left:64px;top:553px;width:488px;height:1px;background:#686868;z-index:2}
.prime-labels{position:absolute;left:64px;top:577px;display:grid;grid-template-columns:170px 194px 150px;font-size:19px;color:#ddd;z-index:2}
.prime-labels span{position:relative}.prime-labels span+span:before{content:'';position:absolute;left:-39px;top:0;width:1px;height:22px;background:#555}


.prime-demo .demo-disclosure{margin-top:10px}

/* Reference-driven uppercase lettering: dense weight, oblique stems,
   uniform cap-height; transform stays separate from source artwork. */
.scene-prime .scene-title .prime-emphasis{font-family:'TRNR Accent',sans-serif;font-style:normal;font-weight:400;font-size:96px;letter-spacing:-.025em;-webkit-text-stroke:.5px currentColor;transform:skewX(-11deg) scaleX(.75);transform-origin:left center}


/* PRIME 04: reference image never rendered. Original-resolution transparent subjects. */
.prime-background{position:absolute;inset:0;background:#080808}
.prime-wordmark{position:absolute;inset:0;width:1280px;height:800px;overflow:hidden}
.prime-subject{position:absolute;inset:0;width:1280px;height:800px;object-fit:fill;pointer-events:none}
.scene-prime .hero-native-nav a{text-decoration:none}

/* ALPHA: source-pixel subject and independently editable lettering/copy. */
.alpha-wordmark,.alpha-subject{position:absolute;inset:0;width:1280px;height:800px}
.scene-alpha .scene-title{left:768px;top:195px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-alpha .alpha-emphasis{font-family:'TRNR Accent',sans-serif;font-size:90px;font-weight:400;font-style:normal;letter-spacing:-.025em;color:#ede6d6;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.alpha-description{position:absolute;left:770px;top:391px;font-size:20px;line-height:1.4;margin:0;letter-spacing:-.02em}
.alpha-rule{position:absolute;left:770px;top:469px;width:446px;height:1px;background:#555}
.alpha-frequency{position:absolute;left:770px;top:491px;font-size:25px;font-weight:700;margin:0}
.alpha-labels{position:absolute;left:770px;top:548px;width:446px;display:flex;justify-content:space-between;color:#aaa;font-size:17px}
.alpha-labels span+span{border-left:1px solid #555;padding-left:37px}
.alpha-explore{position:absolute;left:770px;top:608px;color:#bbb;font-size:15px;letter-spacing:.03em;text-decoration:none;border-bottom:1px solid #777;padding-bottom:8px;display:flex;gap:16px;align-items:center}
.alpha-explore svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4}



/* ALPHA 02: give the P room above the silhouette, without shrinking the bust. */
.alpha-subject{transform:translate(28px,48px)}
.alpha-wordmark{transform:translateY(-10px)}

/* Continuous, linked illustrative data. Typography and artwork stay fixed. */
.metrics-demo{position:absolute;z-index:3;font-variant-numeric:tabular-nums}
.metrics-prime{left:64px;top:610px;width:514px}
.metrics-alpha{left:770px;top:580px;width:446px}
.metrics-values{display:grid;grid-template-columns:170px 194px 150px}
.metrics-alpha .metrics-values{grid-template-columns:150px 150px 146px}
.metric-number{font-size:56px;line-height:1.08;font-weight:300;letter-spacing:-.03em;margin:0;white-space:nowrap}
.metrics-alpha .metric-number{font-size:50px}
.metric-number small{font-size:17px;color:#c7c7c7;margin-left:7px;letter-spacing:0}
.metric-caption{font-size:14px;line-height:1.4;color:#c7c7c7;margin:9px 0 0;white-space:nowrap}
.metric-disclosure{font-size:12px;color:#aaa;letter-spacing:.02em;margin:10px 0 0}
.metric-progress svg{width:146px;height:60px;display:block;overflow:visible}
.metric-axis{stroke:#494949;stroke-width:1;fill:none}
.metric-trace{clip-path:inset(0 87% 0 0);transition:clip-path 600ms cubic-bezier(.23,1,.32,1)}
.metric-trace path{fill:none;stroke:var(--accent);stroke-width:2}.metric-trace circle{fill:var(--accent)}
.metric-progress text{fill:#ddd;font-size:12px;text-anchor:middle}
.programme-explore{position:absolute;z-index:3;display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 20px;border:0;border-radius:999px;background:#fff;color:#080808;font:400 13px 'TRNR Inter',sans-serif;letter-spacing:0;white-space:nowrap;text-decoration:none}

.motion-toggle{position:absolute;z-index:4;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #555;border-radius:50%;background:transparent;color:#bbb;cursor:pointer}
.motion-toggle svg{display:block;width:12px;height:12px;fill:currentColor}

.motion-toggle:focus-visible,.programme-explore:focus-visible{outline:2px solid white;outline-offset:4px}
@media(hover:hover) and (pointer:fine){.motion-toggle:hover{color:white;border-color:#999}}
@media(prefers-reduced-motion:reduce){.metric-trace{transition:none}}


/* Space for the new Explorer row without overlapping the example label. */



.metric-number [data-reps]{display:inline-block}

/* One gallery selector; programme actions follow the data with a measured gap. */
.programme-actions{display:flex;align-items:center;justify-content:space-between;margin-top:24px;height:36px}
.programme-actions .programme-explore{position:static;height:36px}
.programme-actions .motion-toggle{position:static;width:36px;height:36px}
/* Retain 32px of breathing room below PRIME's action row. */
.prime-rule{top:543px}
.prime-labels{top:563px}
.metrics-prime{top:594px}

/* PMT: original-resolution subject, independent vector lettering and live copy. */
.pmt-wordmark{position:absolute;inset:0;width:1280px;height:800px}
.pmt-subject{position:absolute;left:-150px;top:150px;width:1000px;height:auto;pointer-events:none}
.scene-pmt .hero-native-nav a{text-decoration:none}
.scene-pmt .scene-title{left:720px;top:195px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-pmt .pmt-emphasis{font-family:'TRNR Accent',sans-serif;font-weight:400;font-style:normal;font-size:65px;letter-spacing:-.025em;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.pmt-emphasis b{font-weight:400;color:#d83c32}
.pmt-description{position:absolute;left:752px;top:379px;font-size:20px;line-height:1.4;margin:0;letter-spacing:-.02em}
.pmt-levels{position:absolute;left:752px;top:452px;width:460px;border-top:1px solid #555;padding-top:26px;display:flex;justify-content:space-around;font-size:15px;color:#bdbdbd}
.pmt-levels span{position:relative;padding:0 8px 12px}
.pmt-levels .selected{color:white;border-bottom:2px solid #ddd}
.pmt-levels span+span:before{content:'';position:absolute;left:-24px;top:1px;width:1px;height:20px;background:#555}
.pmt-benefits{position:absolute;left:782px;top:555px;width:430px;display:flex;justify-content:space-around;font-size:12px;letter-spacing:.15em;color:#bdbdbd}
.pmt-benefits span+span{border-left:1px solid #555;padding-left:28px}

/* One restrained explanatory rhythm. Subject artwork remains untouched. */
.pmt-motion{position:absolute;left:830px;top:555px;width:382px;color:#eee}
.pmt-motion-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pmt-motion-item h3{margin:0;font-size:15px;font-weight:400;letter-spacing:0}
.pmt-motion-item svg{display:block;width:100%;height:76px;margin:16px 0 12px;overflow:visible;fill:none;stroke:#d83c32;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pmt-motion-item .motion-guide{stroke:#464646;stroke-width:1}
.pmt-motion-item p{margin:0;font-size:11px;color:#bdbdbd;white-space:nowrap;letter-spacing:-.01em}
.pmt-motion-footer{display:flex;align-items:center;justify-content:space-between;margin-top:24px;height:36px;font-size:11px;color:#aaa}
.pmt-motion-footer .motion-toggle{position:static;width:36px;height:36px}
.cardio-beat{animation:pmt-cardio 8s linear infinite;transform-origin:72px 38px}
.cardio-light{fill:#d83c32;stroke:none;animation:pmt-light 8s linear infinite}
.joint-base{stroke:#e6e6e6}.joint-pivot{fill:#080808;stroke:#eee}
.joint-arm{transform-origin:68px 48px;animation:pmt-mobility 8s cubic-bezier(.77,0,.175,1) infinite}.joint-arm circle{fill:#d83c32;stroke:none}
.endurance-trace{animation:pmt-endurance 8s linear infinite}
.endurance-dot{fill:#d83c32;stroke:none;animation:pmt-endurance-dot 8s linear infinite}
@keyframes pmt-cardio{0%,18%,34%,48%,60%,80%,100%{opacity:.45;transform:scaleY(.82)}8%,25%,40%,53%,68%,90%{opacity:1;transform:scaleY(1)}}
@keyframes pmt-light{0%,18%,34%,48%,60%,80%,100%{opacity:.2}8%,25%,40%,53%,68%,90%{opacity:1}}
@keyframes pmt-mobility{0%,100%{transform:rotate(-42deg)}50%{transform:rotate(58deg)}}
@keyframes pmt-endurance{0%{clip-path:inset(0 100% 0 0);opacity:1}88%{clip-path:inset(0 0 0 0);opacity:1}100%{clip-path:inset(0 0 0 0);opacity:0}}
@keyframes pmt-endurance-dot{0%{transform:translate(0,0);opacity:1}15%{transform:translate(20px,-22px)}30%{transform:translate(40px,0)}44%{transform:translate(60px,22px)}59%{transform:translate(80px,0)}74%{transform:translate(100px,-22px)}88%{transform:translate(120px,0);opacity:1}100%{transform:translate(120px,0);opacity:0}}
.scene-pmt[hidden] .pmt-motion *, .pmt-motion.is-paused *,.pmt-motion.is-away *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.pmt-motion:not(.motion-opt-in) *{animation:none!important}.pmt-motion .endurance-trace{clip-path:none}}

/* PMT 03: readable demonstrations, no abstract endurance drawing. */
.pmt-motion-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pmt-motion-item{text-align:center}
.pmt-monitor,.mobility-frames,.endurance-clock{height:88px;margin:12px 0;position:relative;overflow:hidden}
.pmt-monitor{mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.pmt-monitor svg{height:88px;width:100%;margin:0;overflow:hidden}
.ecg-track{animation:pmt-ecg 2.4s linear infinite;stroke:#d83c32;stroke-width:1.6;fill:none}
@keyframes pmt-ecg{to{transform:translateX(-140px)}}
.mobility-frames{overflow:visible}
.mobility-frames img{position:absolute;left:-12px;top:0;width:calc(100% + 24px);height:88px;object-fit:contain;opacity:0;animation:pmt-gorilla 3.6s linear infinite;animation-delay:calc(var(--frame)*.6s - 3.6s)}
@keyframes pmt-gorilla{0%,12%{opacity:1}16.66%,95%{opacity:0}100%{opacity:1}}
.endurance-clock{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-variant-numeric:tabular-nums}
.endurance-clock span{font-size:34px;line-height:1;letter-spacing:-.03em;font-weight:300;color:#eee}
.endurance-clock small{font-size:10px;color:#aaa;letter-spacing:.06em}
@media(prefers-reduced-motion:reduce){.pmt-motion:not(.motion-opt-in) .mobility-frames img{opacity:0}.pmt-motion:not(.motion-opt-in) .mobility-frames img:first-child{opacity:1}}

/* Independent reflected-light facets. Nothing is painted into source imagery. */
.facet-layer{position:absolute;pointer-events:none;overflow:hidden;z-index:1}
.facet-pixels{position:absolute;display:block;opacity:0;filter:brightness(2.1);pointer-events:none}
.facets-prime-man,.facets-prime-woman{inset:0;width:1280px;height:800px}
.facets-alpha{inset:0;width:1280px;height:800px;transform:translate(28px,48px)}
.facets-pmt{left:-150px;top:150px;width:1000px;height:666.6667px}
@media(prefers-reduced-motion:reduce){.facet-layer{display:none}}

/* Soft moving spotlight, masked exclusively by existing source highlights. */
.specular-pixels{position:absolute;inset:0;width:100%;height:100%;opacity:0;filter:brightness(1.85);mask-image:radial-gradient(ellipse at center,#000 12%,rgba(0,0,0,.85) 35%,transparent 72%);mask-size:260px 260px;mask-repeat:no-repeat;mask-position:0 0;-webkit-mask-image:radial-gradient(ellipse at center,#000 12%,rgba(0,0,0,.85) 35%,transparent 72%);-webkit-mask-size:260px 260px;-webkit-mask-repeat:no-repeat;-webkit-mask-position:0 0}

/* Continuous PMT demonstrations: source texture, articulated deformation and live trace. */
.pmt-monitor{mask-image:none}
.cardio-live{display:block;width:100%;height:88px}
.mobility-rig{height:88px;margin:12px -12px;position:relative}
.mobility-source,.gorilla-live{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.mobility-source{visibility:hidden}
.gorilla-live{display:block}

.scene-pmt .scene-kicker{left:720px;top:155px}

/* TABATA: independent source, lettering and live type. */
.tabata-wordmark{position:absolute;inset:0;width:1280px;height:800px;z-index:0}
.tabata-floor{position:absolute;left:535px;top:661px;width:650px;height:113px;background:radial-gradient(ellipse,rgba(109,42,156,.19),transparent 69%);z-index:0}
.tabata-subject{position:absolute;left:250px;top:130px;width:1200px;height:800px;z-index:1}
.scene-tabata .scene-kicker{left:65px;top:278px;font-size:11px}
.scene-tabata .scene-title{left:64px;top:304px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-tabata .tabata-emphasis{font-family:'TRNR Accent',sans-serif;font-size:90px;font-weight:400;font-style:normal;letter-spacing:-.025em;color:#9b51e0;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.tabata-description{position:absolute;left:65px;top:490px;width:445px;margin:0;font-size:21px;line-height:1.4;z-index:2}
.tabata-explore{position:absolute;left:65px;top:610px;height:36px;z-index:2}

/* TABATA timing: same native data/action hierarchy, independent of artwork. */
.tabata-timer{position:absolute;left:65px;top:601px;width:440px;z-index:2;border-top:1px solid #484848;padding-top:15px}
.tabata-timer-grid{display:grid;grid-template-columns:1fr 1fr .7fr;gap:24px}
.tabata-metric-label{margin:0 0 8px;font-size:15px;line-height:1.2;color:#ccc}
.tabata-number{margin:0;font-size:40px;line-height:1;font-weight:300;letter-spacing:-.025em;font-variant-numeric:tabular-nums;color:#777;transition:color 200ms ease}
.tabata-number small{font-size:16px;margin-left:6px;letter-spacing:0;color:#aaa}
.tabata-phase.is-active .tabata-number{color:#b775f0}
.tabata-cycle .tabata-number{color:#eee}
.tabata-track{height:2px;background:#333;margin-top:9px;overflow:hidden}
.tabata-track span{display:block;height:100%;background:#b775f0;transform:scaleX(0);transform-origin:left center}
.tabata-demo-caption{margin:9px 0 0;font-size:11px;line-height:1;color:#aaa}
.scene-tabata .tabata-explore{top:732px}
.scene-tabata .tabata-pause{position:absolute;left:469px;top:732px;width:36px;height:36px;z-index:2}
@media(prefers-reduced-motion:reduce){.tabata-number{transition:none}}

/* CIRCUIT: native composition, each athlete and each interface layer separate. */
.circuit-wordmark{position:absolute;inset:0;width:1280px;height:800px;z-index:0}
.circuit-subject{position:absolute;width:550px;height:825px;z-index:1}
.circuit-woman{left:20px;top:10px}.circuit-man{left:100px;top:25px}
.scene-circuit .scene-title{left:685px;top:280px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-circuit .circuit-emphasis{font-family:'TRNR Accent',sans-serif;font-size:75px;font-weight:400;font-style:normal;letter-spacing:-.025em;color:#fff;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.circuit-description{position:absolute;left:685px;top:456px;width:530px;margin:0;font-size:21px;line-height:1.4;z-index:2}
.circuit-demo{position:absolute;left:685px;top:536px;width:530px;z-index:2;border-top:1px solid #484848;padding-top:18px}
.circuit-choices{display:grid;grid-template-columns:.8fr 1.1fr 1.1fr;gap:22px}
.circuit-choices p{margin:0 0 13px;font-size:15px;color:#ccc}
.circuit-choices strong{display:block;font-size:20px;line-height:1.2;font-weight:400;white-space:nowrap;opacity:.4}
.circuit-choices small{font-size:15px}.circuit-choices i{display:block;height:2px;background:#4ecb94;margin-top:14px;transform:scaleX(0);transform-origin:left}
.circuit-session{margin-top:16px}.circuit-session p{margin:0 0 8px;font-size:13px;color:#4ecb94}
.circuit-exercises{display:flex;gap:24px;font-size:18px;line-height:1.2}.circuit-exercises span{opacity:0}
.circuit-disclosure{font-size:11px;color:#aaa;margin:9px 0 0}
.scene-circuit .circuit-explore{position:absolute;left:685px;top:732px;height:36px;z-index:2}
.scene-circuit .circuit-pause{position:absolute;left:1179px;top:732px;width:36px;height:36px;z-index:2}

.circuit-emphasis b{font-weight:400;color:#4ecb94}

.prime-emphasis .prime-se{font-weight:inherit;background:linear-gradient(#c09e5a 0%,#c19f5b 24%,#bb9958 50%,#aa894e 75%,#977a45 100%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-stroke:0}

/* STREET: independent artwork and explanatory phase sequence. */
.street-wordmark{position:absolute;inset:0;width:1280px;height:800px;z-index:0}
.street-layer{position:absolute;left:-165px;top:151px;width:921.6px;height:614.4px;z-index:1}
.street-athlete{z-index:2}
.scene-street .scene-kicker{left:670px;top:311px}
.scene-street .scene-title{left:670px;top:345px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-street .street-emphasis{font-family:'TRNR Accent',sans-serif;font-size:68px;font-weight:400;letter-spacing:-.025em;color:#69b4ec;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.street-description{position:absolute;left:670px;top:507px;width:540px;margin:0;font-size:21px;line-height:1.4;z-index:2}
.street-demo{position:absolute;left:670px;top:596px;width:540px;border-top:1px solid #484848;padding-top:15px;z-index:2}
.street-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.street-phase p{margin:0 0 10px;font-size:15px;color:#ccc}
.street-phase strong{font-size:29px;font-weight:300;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.street-phase small{font-size:11px;color:#aaa;display:block;margin-top:4px}
.street-track{height:2px;background:#333;margin-top:10px;overflow:hidden}.street-track i{display:block;height:100%;background:#69b4ec;transform:scaleX(0);transform-origin:left}
.street-focus{height:18px;position:relative;margin-top:12px;color:#8ac7f4;font-size:13px}.street-focus span{position:absolute;inset:0;opacity:0}
.street-disclosure{font-size:10px;color:#aaa;margin:7px 0 0}
.scene-street .street-explore{position:absolute;left:670px;top:751px;height:36px;z-index:2}
.scene-street .street-pause{position:absolute;left:1174px;top:751px;width:36px;height:36px;z-index:2}
.scene-street .scene-kicker{top:291px}
.scene-street .scene-title{top:325px}
.street-description{top:487px}
.street-demo{top:559px}
.street-phase strong{display:block;line-height:1}
.street-phase small{line-height:1.2}
.street-focus{margin-top:10px}
.street-disclosure{line-height:1.2;margin-top:6px}
.scene-street .street-explore,.scene-street .street-pause{top:732px}

/* White product scene: separate devices, screens, typography and shadows. */
.scene-watch{background:#f5f5f7;color:#111}
.scene-watch .hero-native-nav{border-bottom-color:#d5d5d8;color:#111}
.scene-watch .hero-native-nav .cta{background:#111;color:#fff;text-decoration:none}
.watch-brand{position:relative!important;display:block!important;width:120px;height:33px}
.watch-brand>img{position:absolute;inset:0;width:120px!important;height:auto!important;filter:brightness(0)}
.watch-brand>.gold-r{position:absolute;inset:0;background:#c6a052;mask:url(/site/assets/logo-trnr-wordmark.png) left top/120px auto no-repeat;-webkit-mask:url(/site/assets/logo-trnr-wordmark.png) left top/120px auto no-repeat;clip-path:polygon(77.5% 0,100% 0,100% 100%,70.5% 100%)}
.scene-watch .scene-title{left:55px;top:277px;font-size:72px;line-height:1.07;letter-spacing:-.025em}
.scene-watch .watch-emphasis{font-family:'TRNR Accent',sans-serif;font-weight:400;font-size:90px;transform:skewX(-11deg) scaleX(.86);transform-origin:left center;letter-spacing:-.025em;margin-top:3px;-webkit-text-stroke:.5px currentColor}
.watch-description{position:absolute;left:55px;top:469px;margin:0;font-size:21px;line-height:1.4;z-index:4}
.watch-separator{position:absolute;left:55px;top:570px;width:450px;height:1px;background:#c3c3c8}
.watch-devices{position:absolute;left:55px;top:594px;margin:0;font-size:14px;letter-spacing:.045em;color:#515154}
.ultra-device{position:absolute;left:135px;top:100px;width:1030.9px;height:644.8px;z-index:3;pointer-events:none}
.ultra-frame,.ultra-screen{position:absolute;inset:0;width:100%;height:100%}
.ultra-content{position:absolute;left:520px;top:267px;width:135px;text-align:center;transform:skewY(-1deg) rotate(2deg)}
.ultra-content img{width:135px;height:auto}.ultra-content span{display:block;margin-top:24px;color:#b9b9bd;font-size:9px;letter-spacing:.07em}
.air-device{position:absolute;left:943px;top:178px;width:285px;height:555px;z-index:2}
.air-frame{width:100%;height:100%;object-fit:contain}
.air-content{position:absolute;left:16%;top:44%;width:68%;text-align:center;color:#b9b9bd}
.air-content img{width:140px;height:auto}.air-content span{display:block;margin-top:24px;font-size:10px;letter-spacing:.08em}
.watch-device-shadow,.air-device-shadow{position:absolute;height:22px;background:#0002;border-radius:50%;filter:blur(12px);top:668px;left:654px;width:282px;z-index:1}
.air-device-shadow{left:968px;top:719px;width:234px;height:13px;background:#0002;filter:blur(9px)}
.air-device{left:967px;top:190px;width:235px;height:520px}
.air-content{left:10%;top:45%;width:80%}
.air-device-shadow{left:982px;top:704px;width:212px}

/* A single product group: the Ultra sits in front of the tilted Air. */
.air-device{left:869px;top:131px;width:251px;height:555px;transform:rotate(12deg);transform-origin:50% 90%;z-index:2}
.ultra-device{left:127px;top:121px;transform:rotate(-5deg);transform-origin:76% 73%;z-index:3}
.air-frame{filter:drop-shadow(8px 12px 9px #0002)}
.air-device-shadow{left:849px;top:673px;width:317px;height:26px;background:#0003;filter:blur(13px);transform:rotate(-5deg)}
.air-device-shadow::after{content:"";position:absolute;left:62px;top:7px;width:205px;height:9px;border-radius:50%;background:#0005;filter:blur(5px)}
.watch-device-shadow{left:627px;top:683px;width:318px;height:30px;background:#0003;filter:blur(13px)}
.watch-device-shadow::after{content:"";position:absolute;left:36px;top:8px;width:241px;height:10px;border-radius:50%;background:#0005;filter:blur(5px)}

/* Product hierarchy: tall Air, compact Ultra across the lower foreground. */
.air-device{left:868px;top:98px;width:277px;height:613px;transform:perspective(1200px) rotateY(-18deg) rotateZ(9deg);transform-origin:50% 90%;z-index:2}
.ultra-device{left:100px;top:149px;transform:scale(.72) rotate(-12deg);transform-origin:76% 73%;z-index:3}
.air-device-shadow{left:856px;top:703px;width:278px;height:19px;transform:rotate(0);background:#0002;filter:blur(10px)}
.watch-device-shadow{left:646px;top:698px;width:276px;height:19px;background:#0003;filter:blur(9px)}
.watch-device-shadow::after{left:30px;top:5px;width:201px;height:7px}
.air-device-shadow::after{left:55px;top:5px;width:177px;height:7px}
.ultra-device{left:155px}
.watch-device-shadow{left:701px}

/* site/integration.css */
html,body,.frame,.native-scene,.prime-background,body.focus-view{background:#171c22}.hero-native-nav{display:none}.site-header{max-width:1440px;margin:auto;height:76px;padding:0 6%;border-bottom:1px solid #ffffff20}.site-brand{display:block;flex-shrink:0}.site-brand img{display:block;width:104px;height:auto}.signup-link{font-size:13px;color:#f3f3ef;text-decoration:none}.tabs{max-width:1440px;margin:auto;padding:22px 6%;scrollbar-color:#697783 #171c22}.tabs button{color:#bdc6d0}.tabs button[aria-pressed=true]{background:#f3f3ef;color:#171c22}main{padding:0;max-width:1440px}.frame{aspect-ratio:16/10}.pmt-explore{left:770px;top:739px}.site-footer{border-top:1px solid #ffffff20;display:flex;align-items:center;gap:14px;padding:35px 6%;color:#aeb9c6;font-family:'TRNR Inter',sans-serif}.site-footer p{margin:0;font-size:13px}.site-footer nav{margin-left:auto;display:flex;gap:26px;font-size:12px}.site-footer a{text-decoration:none;color:#f3f3ef}.mobile-discovery{display:none}@media(max-width:650px){.site-header{margin:0;padding:0 24px;height:68px;min-height:68px}.site-brand img{width:86px}.tabs{padding:18px 12px}.site-footer{padding:30px 24px;flex-wrap:wrap;gap:22px 14px}.site-footer p{order:3;flex-basis:100%}.site-footer nav{gap:22px;flex-wrap:wrap;margin-left:0;flex-basis:100%}.mobile-discovery:not([hidden]){display:block;width:max-content;max-width:calc(100% - 48px);margin:12px auto 32px;padding:15px 22px;border:1px solid #ffffff38;border-radius:14px;color:#f3f3ef;font-size:15px;text-decoration:none}}:root{background:#171c22}body{min-height:100vh;display:flex;flex-direction:column}.site-header,.tabs,main{width:100%}.site-footer{margin-top:auto}
.site-header,.tabs,main{margin:0 auto;flex-shrink:0}

/* Information demos removed at Franck’s request; discovery links remain independent. */
.scene-prime .explore-prime{position:absolute;left:64px;top:595px;z-index:5}.scene-alpha .explore-alpha{position:absolute;left:770px;top:580px;z-index:5}.scene-pmt .pmt-explore{position:absolute;left:770px;top:505px;z-index:5}.scene-tabata .tabata-explore{top:565px}.scene-circuit .circuit-explore{top:585px}
.scene-tabata .tabata-explore{top:610px}.scene-street .street-explore{top:610px}

/* TABATA: regenerated ground pose, full silhouette, contact and cast shadows. */
.scene-tabata .tabata-subject{left:510px;top:252px;width:760px;height:507px;object-fit:contain;object-position:center 42%;z-index:2;transform:none;mask:none;filter:none}.scene-tabata .tabata-floor{display:none}.scene-tabata .scene-title{top:325px}.scene-tabata .scene-kicker{top:294px}.scene-tabata .tabata-description{top:510px}.scene-tabata .tabata-explore{top:635px}.scene-tabata .tabata-wordmark{z-index:1}.tabata-grounding{position:absolute;inset:0;width:1280px;height:800px;z-index:1;pointer-events:none}

/* Slight overlap with the large TABATA lettering; ground shadows follow the same scale. */
.scene-tabata .tabata-subject{left:485px;top:195px;width:815px;height:544px}

/* PRIME: one coherent regenerated duo with grounded stance. */
.scene-prime .prime-duo{position:absolute;left:622.5px;top:170px;width:620px;height:620px;object-fit:contain;z-index:2;pointer-events:none}.prime-grounding{position:absolute;inset:0;width:1280px;height:800px;z-index:1;pointer-events:none}
/* Refreshed character assets, independent from unchanged large programme names. */
.scene-alpha .refreshed-character{left:100px;top:180px;width:600px;height:600px}
.scene-pmt .refreshed-character{left:15px;top:180px;width:710px;height:600px}
.scene-circuit .refreshed-character{left:25px;top:180px;width:625px;height:610px}
.scene-street .refreshed-character{left:35px;top:155px;width:570px;height:625px}
.refreshed-character{position:absolute;object-fit:contain;z-index:2;pointer-events:none}.character-ground{position:absolute;inset:0;width:1280px;height:800px;z-index:1;pointer-events:none}
/* CIRCUIT trial: localized diffuse backlight, independent of crisp letter contours. */
.scene-circuit::before{content:"";position:absolute;left:235px;top:60px;width:620px;height:310px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 45% 52%,rgba(202,238,222,.055) 0%,rgba(144,204,176,.025) 27%,rgba(104,172,138,.010) 48%,transparent 72%)}
.scene-circuit .circuit-wordmark{z-index:1}


/* PRIME: localized warm gold light, matching the displayed trial. */
.scene-prime::before{content:"";position:absolute;left:590px;top:110px;width:540px;height:310px;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 45% 52%,rgba(240,219,166,.055) 0%,rgba(209,177,105,.025) 27%,rgba(180,143,72,.010) 48%,transparent 72%)}
.scene-prime .prime-wordmark{z-index:1}

/* Same restrained local illumination approved for PRIME and CIRCUIT. */
.scene-alpha::before{content:"";position:absolute;left:120px;top:85px;width:510px;height:315px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 45% 52%,rgba(220,229,236,.055) 0%,rgba(220,229,236,.025) 27%,rgba(220,229,236,.010) 48%,transparent 72%)}
.scene-alpha .alpha-wordmark{z-index:1}
.scene-street::before{content:"";position:absolute;left:225px;top:65px;width:620px;height:310px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 45% 52%,rgba(177,211,239,.055) 0%,rgba(177,211,239,.025) 27%,rgba(177,211,239,.010) 48%,transparent 72%)}
.scene-street .street-wordmark{z-index:1}
.scene-pmt::before{content:"";position:absolute;left:100px;top:90px;width:520px;height:325px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 45% 52%,rgba(238,189,177,.055) 0%,rgba(238,189,177,.025) 27%,rgba(238,189,177,.010) 48%,transparent 72%)}
.scene-pmt .pmt-wordmark{z-index:1}
.scene-tabata::before{content:"";position:absolute;left:280px;top:60px;width:620px;height:310px;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 45% 52%,rgba(218,195,238,.055) 0%,rgba(218,195,238,.025) 27%,rgba(218,195,238,.010) 48%,transparent 72%)}
.scene-tabata .tabata-wordmark{z-index:1}

/* Home: original wordmark file, no generated logo. */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.frame.home-frame{aspect-ratio:auto}.home-scene{display:flex;flex-direction:column;align-items:center;padding:0 0 32px}.home-art{width:100%;max-width:1320px;position:relative;aspect-ratio:3/2}.team-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1}.home-original-logo{position:absolute;left:18.2%;top:60.55%;width:63.2%;height:auto;z-index:2}.team-front{z-index:3;clip-path:polygon(0 0,100% 0,100% 100%,67% 100%,67% 63%,0 63%);pointer-events:none}.home-logo-shadow{position:absolute;left:18.8%;top:84.7%;width:63%;height:2.3%;background:radial-gradient(ellipse,#0009, #0004 45%,transparent 73%);filter:blur(4px);z-index:0;transform:skewX(-12deg)}.home-explore{display:flex;gap:25px;align-items:center;padding:16px 24px;border:1px solid #ffffff30;border-radius:14px;background:linear-gradient(#2d333b,#20262d);box-shadow:inset 0 1px #ffffff15;color:#f3f3ef;text-decoration:none;font:14px 'TRNR Inter',sans-serif}.home-explore span{color:#c6a052}.home-explore:hover{border-color:#c6a05280}
@media(max-width:650px){.home-scene{min-height:calc(100svh - 240px);justify-content:center;padding-bottom:36px}.home-explore{margin-top:24px;font-size:13px}}
/* Match the actual contact line of the generated poses, preserving logo ratio. */
.home-original-logo{left:0;top:43.2%;width:100%;z-index:1}.team-layer{z-index:2}.team-front{display:none}.home-logo-shadow{left:3%;top:81.8%;width:94%;height:2.5%;z-index:0}
.home-original-logo{top:38.4%}.home-logo-shadow{top:75.6%;height:2.1%;opacity:.8}.home-art{margin-top:-50px;margin-bottom:-65px}@media(max-width:650px){.home-art{margin-top:0;margin-bottom:0}}

.home-coherent{max-width:none;margin-top:-35px;margin-bottom:-35px;isolation:isolate}.home-complete-scene{display:block;width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(to bottom,transparent,black 9%,black 89%,transparent)}@media(max-width:650px){.home-coherent{margin:0}.home-scene{padding-top:0}}

/* Approval step: exact original logo only. Characters postponed. */
.logo-only-review{width:min(100%,1150px);margin:45px auto 65px}.logo-only-review svg{width:100%;height:auto;display:block}.home-scene:has(.logo-only-review){min-height:65vh;justify-content:center;padding:0 3%}@media(max-width:650px){.logo-only-review{margin:35px 0}.home-scene:has(.logo-only-review){min-height:60vh}}

.logo-only-review>img{display:block;width:100%;height:auto}

/* Logo retained; restrained shadow and six existing faceted characters. */
.home-team-approved{width:100%;max-width:1320px;margin-top:-65px;margin-bottom:-65px}.home-team-approved>svg{display:block;width:100%;height:auto}.home-scene:has(.home-team-approved){padding:0 0 38px;min-height:0}
@media(max-width:650px){.home-team-approved{margin:0}.home-scene:has(.home-team-approved){min-height:calc(100svh - 240px);justify-content:center;padding-bottom:34px}}

/* Complete newly composed scene: shared supports and illumination. */
.home-team-scene{width:100%;max-width:1440px;aspect-ratio:1536/850;overflow:hidden;position:relative;margin-top:-30px;mask-image:linear-gradient(to bottom,transparent,black 9%,black 90%,transparent)}.home-team-scene>img{display:block;width:100%;height:auto}.home-scene:has(.home-team-scene){padding:0 0 36px;min-height:0}.home-scene:has(.home-team-scene) .home-explore{margin-top:8px}
@media(max-width:650px){.home-team-scene{margin:0;aspect-ratio:1536/850}.home-scene:has(.home-team-scene){min-height:calc(100svh - 240px);justify-content:center}.home-scene:has(.home-team-scene) .home-explore{margin-top:24px}}

/* Approved homepage introduction, using the site's existing Inter family. */
.home-intro{max-width:850px;margin:0 auto;padding:0 28px 32px;text-align:center;color:#edece7;font-family:'TRNR Inter',sans-serif}.home-intro h2{margin:0 0 18px;font-size:clamp(29px,3.3vw,48px);font-weight:300;line-height:1.16;letter-spacing:-.035em}.home-intro h2 em{font-style:normal;color:#c6a052;font-weight:400}.home-intro p{max-width:620px;margin:0 auto;color:#c0c5cc;font-size:clamp(15px,1.25vw,18px);font-weight:400;line-height:1.65;text-wrap:balance}.home-availability{display:block;margin-top:24px;color:#959da7;font-size:12px;letter-spacing:.045em}.home-scene:has(.home-intro){padding-bottom:22px}@media(max-width:650px){.home-intro{padding:8px 26px 24px}.home-intro h2{font-size:30px}.home-intro h2 em{display:block}.home-availability{margin-top:20px;font-size:11px}}

/* Match the programme headings exactly: Inter light + skewed Archivo Black. */
.home-intro h2{font-family:'TRNR Inter',sans-serif;font-size:clamp(30px,3.2vw,46px);font-weight:300;line-height:1.08;letter-spacing:-.035em;margin-bottom:23px}.home-intro h2 span{display:block}.home-intro h2 em{display:block;margin-top:5px;font-family:'TRNR Accent',sans-serif;font-style:normal;font-weight:400;font-size:clamp(42px,5vw,70px);letter-spacing:-.025em;line-height:1;color:#f3f3ef;transform:skewX(-11deg) scaleX(.86);transform-origin:center;-webkit-text-stroke:.5px currentColor}@media(max-width:650px){.home-intro h2{font-size:30px}.home-intro h2 em{font-size:43px}}

.home-intro h2 em{color:#c6a052}

.home-intro{max-width:1120px}.home-intro h2 em{font-size:clamp(32px,4.2vw,60px);text-wrap:balance}@media(max-width:650px){.home-intro h2 em{font-size:35px;line-height:1.06}}

/* Independent native-resolution character sources, vector wordmark and floor lighting. */
.home-retina>svg{display:block;width:100%;height:auto}.home-retina{background:#181c20}

/* site/discovery-buttons.css */
/* Native reference: TRNRReliefControlButtonStyle, TRNRControl.swift:303.
   Return / Music / Info controls, expanded for a label; exact programme colour, no tint mixing.
   Hero only: view selectors remain unchanged. */
:is(.native-scene .programme-explore,.mobile-discovery){--discovery-accent:#c6a052;display:inline-flex;align-items:center;justify-content:center;width:auto;min-width:220px;max-width:100%;min-height:56px;padding:17px 30px;border:0;border-radius:999px;background:var(--discovery-accent);color:#171c22;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;font-size:15px;font-weight:900;font-style:italic;letter-spacing:-.5px;line-height:1.3;text-transform:uppercase;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #00000040,0 4px 4px #0000003d;transition:transform 160ms ease-out;transform:none}
:is(.native-scene .programme-explore,.mobile-discovery)[data-discovery=alpha]{--discovery-accent:#ede6d6}
:is(.native-scene .programme-explore,.mobile-discovery)[data-discovery=street]{--discovery-accent:#56ccf2}
@media(hover:hover) and (pointer:fine){:is(.native-scene .programme-explore,.mobile-discovery):hover{background:var(--discovery-accent);color:#171c22}}
:is(.native-scene .programme-explore,.mobile-discovery):active{transform:scale(.98);box-shadow:inset 0 1px 0 #ffffff38,inset 0 -1px 0 #00000040,0 3px 3px #0000003d}
:is(.native-scene .programme-explore,.mobile-discovery):focus-visible{outline:2px solid var(--discovery-accent);outline-offset:5px}
@media(prefers-reduced-motion:reduce){:is(.native-scene .programme-explore,.mobile-discovery){transition:none}:is(.native-scene .programme-explore,.mobile-discovery):active{transform:none}}

:is(.native-scene .programme-explore,.mobile-discovery)[data-discovery=pmt]{--discovery-accent:#d83c32}
:is(.native-scene .programme-explore,.mobile-discovery)[data-discovery=tabata]{--discovery-accent:#9b51e0}
:is(.native-scene .programme-explore,.mobile-discovery)[data-discovery=circuit]{--discovery-accent:#48d68b}


:is(.native-scene .programme-explore,.mobile-discovery)::after{content:none}.mobile-discovery{display:none;margin-top:12px;margin-bottom:32px}@media(max-width:650px){.native-scene .programme-explore{display:none}.mobile-discovery:not([hidden]){display:flex}}
/* Exactly one discovery button at each viewport size. */
a.mobile-discovery.mobile-discovery{display:none}
@media(max-width:650px){.native-scene .programme-explore{display:none}a.mobile-discovery.mobile-discovery:not([hidden]){display:flex}}

/* site/motion.css */
/* Mouvements TRNR, posés par-dessus le rendu validé du 4 octobre.
   On n'anime que `opacity` et les propriétés indépendantes `translate` / `scale` :
   les `transform` existants (italiques penchés, échelles des scènes) restent intacts.
   Une seule lecture à chaque apparition, aucune boucle, aucun rebond. */
:root{--trnr-ease:cubic-bezier(.22,1,.36,1)}
@keyframes trnr-rise{from{opacity:0;translate:0 var(--rise,18px)}to{opacity:1;translate:0 0}}
@keyframes trnr-fade{from{opacity:0}to{opacity:1}}
@keyframes trnr-settle{from{opacity:0;scale:1.035}to{opacity:1;scale:1}}

/* Programmes : le grand nom, puis le personnage qui se pose, puis le texte.
   Rejoué à chaque changement d'onglet (la scène repasse de masquée à affichée).
   Ralenti d'environ 15 % à la demande de Franck (05/10 : « très légèrement »). */
.native-scene[data-ready=true] :is(.prime-wordmark,.alpha-wordmark,.street-wordmark,.pmt-wordmark,.tabata-wordmark,.circuit-wordmark){--rise:22px;animation:trnr-rise 1150ms var(--trnr-ease) both}
.native-scene[data-ready=true]::before{animation:trnr-fade 1600ms ease-out 230ms both}
.native-scene[data-ready=true] :is(.prime-duo,.refreshed-character,.tabata-subject){--rise:26px;animation:trnr-rise 1250ms var(--trnr-ease) 140ms both}
.native-scene[data-ready=true] :is(.prime-grounding,.character-ground,.tabata-grounding){animation:trnr-fade 1030ms ease-out 440ms both}
.native-scene[data-ready=true] .scene-kicker{animation:trnr-rise 920ms var(--trnr-ease) 300ms both}
.native-scene[data-ready=true] .scene-title>span:first-child{animation:trnr-rise 920ms var(--trnr-ease) 370ms both}
.native-scene[data-ready=true] .scene-title>span:nth-child(2){animation:trnr-rise 920ms var(--trnr-ease) 460ms both}
.native-scene[data-ready=true] :is(.prime-description,.alpha-description,.street-description,.pmt-description,.tabata-description,.circuit-description){animation:trnr-rise 920ms var(--trnr-ease) 550ms both}
.native-scene[data-ready=true] :is(.prime-rule,.alpha-rule,.alpha-frequency){animation:trnr-rise 920ms var(--trnr-ease) 620ms both}
.native-scene[data-ready=true] .programme-explore{animation:trnr-rise 920ms var(--trnr-ease) 690ms both}
/* Sur téléphone, le bouton « Découvrir » est hors de la scène : motion.js le fait arriver avec elle, au même moment
   que sur ordinateur, au lieu de changer d'un coup. */
.mobile-discovery.waiting{opacity:0}
.mobile-discovery.arrive{animation:trnr-rise 920ms var(--trnr-ease) 690ms both}

/* Accueil : l'image se pose, puis la phrase. Attend que l'image soit décodée (motion.js). */
html.motion .home-scene:not([data-ready]) :is(.home-team-scene>img,.home-intro h2>*,.home-intro p,.home-availability){opacity:0}
/* Scène en calques (SVG) : Safari ne prépare pas les images d'un élément invisible. La scène reste donc visible pendant le
   chargement, mais cachée derrière le voile (.stage, posé par motion.js) ; elle n'est masquée qu'avant l'arrivée du voile. */
html.motion .home-team-scene:not(:has(>.stage))>svg{opacity:0}
/* La scène sort de l'ombre depuis le sol (retenu par Franck le 05/10, avec le miroir et le halo) :
   un voile de la couleur du fond, deux fois plus haut que la scène, opaque en haut et transparent en bas,
   couvre tout puis remonte et sort. Il remplace l'ancienne apparition de l'image. */
html.motion .home-team-scene>.stage{position:absolute;left:0;right:0;top:0;height:220%;pointer-events:none;z-index:2;
 background:linear-gradient(to bottom,#14171c 0%,#14171c 45%,rgba(20,23,28,0) 72%)}
html.motion .home-scene[data-ready] .home-team-scene>.stage{animation:trnr-lever 1900ms cubic-bezier(.33,1,.68,1) 150ms both}
@keyframes trnr-lever{from{translate:0 0}to{translate:0 -100%}}

/* Sol miroir (sans mouvement) : l'image retournée autour de la ligne du sol (712 px sur 1 024), dont on ne
   garde que la bande juste au-dessus (pieds, bas des lettres), qui s'efface en s'éloignant. La scène
   s'agrandit vers le bas pour lui laisser de la place. */
.home-team-scene{aspect-ratio:1536/975!important;-webkit-mask-image:linear-gradient(to bottom,transparent,black 8%,black 84%,transparent);mask-image:linear-gradient(to bottom,transparent,black 8%,black 84%,transparent)}
.home-team-scene>img.mirror{position:absolute;left:0;top:0;width:100%;height:auto;pointer-events:none;
 transform-origin:50% 69.53%;transform:scaleY(-1);opacity:.3;animation:none!important;filter:blur(1.2px) saturate(.85);
 -webkit-mask-image:linear-gradient(to bottom,transparent 52%,rgba(0,0,0,.4) 62%,#000 69.4%,transparent 69.6%);
 mask-image:linear-gradient(to bottom,transparent 52%,rgba(0,0,0,.4) 62%,#000 69.4%,transparent 69.6%)}
/* Le gorille est au premier plan : ses appuis sont à 748 px, sous la ligne du logo.
   Son reflet a son propre axe ; la coupure horizontale tombe entre lui et les pieds de PRIME. */
.home-team-scene>img.mirror:not(.mirror-gorilla){clip-path:inset(0 0 0 27%)}
.home-team-scene>img.mirror-gorilla{clip-path:inset(0 73% 0 0);transform-origin:50% 73.05%;
 -webkit-mask-image:linear-gradient(to bottom,transparent 55.52%,rgba(0,0,0,.4) 65.52%,#000 72.92%,transparent 73.12%);
 mask-image:linear-gradient(to bottom,transparent 55.52%,rgba(0,0,0,.4) 65.52%,#000 72.92%,transparent 73.12%)}
/* Halo (sans mouvement) : lumière d'ambiance très douce derrière chaque statue, dans la couleur de son programme.
   Baissé d'un cran sur les personnages à la demande de Franck (05/10). */
/* Positions en % de la scène agrandie (975 px de haut sur l'image d'origine). */
.home-team-scene>.halo{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:.5;
 background:
  radial-gradient(ellipse 18% 33.152% at 14% 57.5%,rgba(224,90,71,0.2500) 0%, rgba(224,90,71,0.2175) 15%, rgba(224,90,71,0.1200) 35%, rgba(224,90,71,0.0400) 60%, rgba(224,90,71,0.0063) 82%, rgba(224,90,71,0.0000) 100%),
  radial-gradient(ellipse 15.6% 43.008% at 21% 33.1%,rgba(198,160,82,0.2500) 0%, rgba(198,160,82,0.2175) 15%, rgba(198,160,82,0.1200) 35%, rgba(198,160,82,0.0400) 60%, rgba(198,160,82,0.0063) 82%, rgba(198,160,82,0.0000) 100%),
  radial-gradient(ellipse 15.6% 43.008% at 37% 33.1%,rgba(237,230,214,0.1600) 0%, rgba(237,230,214,0.1392) 15%, rgba(237,230,214,0.0768) 35%, rgba(237,230,214,0.0256) 60%, rgba(237,230,214,0.0040) 82%, rgba(237,230,214,0.0000) 100%),
  radial-gradient(ellipse 18% 43.008% at 60% 33.1%,rgba(86,204,242,0.2200) 0%, rgba(86,204,242,0.1914) 15%, rgba(86,204,242,0.1056) 35%, rgba(86,204,242,0.0352) 60%, rgba(86,204,242,0.0055) 82%, rgba(86,204,242,0.0000) 100%),
  radial-gradient(ellipse 14.4% 33.152% at 77% 36.6%,rgba(155,81,224,0.2500) 0%, rgba(155,81,224,0.2175) 15%, rgba(155,81,224,0.1200) 35%, rgba(155,81,224,0.0400) 60%, rgba(155,81,224,0.0063) 82%, rgba(155,81,224,0.0000) 100%),
  radial-gradient(ellipse 14.4% 43.008% at 90% 34.9%,rgba(72,214,139,0.2200) 0%, rgba(72,214,139,0.1914) 15%, rgba(72,214,139,0.1056) 35%, rgba(72,214,139,0.0352) 60%, rgba(72,214,139,0.0055) 82%, rgba(72,214,139,0.0000) 100%)}
/* Le halo se reflète aussi, très faiblement, dans le sol verni (demande de Franck : « vraiment très très léger ») :
   sous chaque statue, une trace aplatie de sa couleur, juste sous la ligne du sol (73 % de la scène). */
.home-team-scene>.halo::after{content:"";position:absolute;inset:0;
 background:
  radial-gradient(ellipse 14% 6% at 14% 77%,rgba(224,90,71,.30),transparent 70%),
  radial-gradient(ellipse 12% 6% at 21% 76%,rgba(198,160,82,.30),transparent 70%),
  radial-gradient(ellipse 12% 6% at 37% 76%,rgba(237,230,214,.18),transparent 70%),
  radial-gradient(ellipse 14% 6% at 60% 76%,rgba(86,204,242,.28),transparent 70%),
  radial-gradient(ellipse 11% 5% at 77% 75%,rgba(155,81,224,.30),transparent 70%),
  radial-gradient(ellipse 11% 6% at 90% 76%,rgba(72,214,139,.28),transparent 70%)}
@media(prefers-reduced-motion:reduce){html.motion .home-team-scene>.stage{display:none}}
html.motion .home-scene[data-ready] .home-intro h2>span{animation:trnr-rise 900ms var(--trnr-ease) 350ms both}
html.motion .home-scene[data-ready] .home-intro h2>em{animation:trnr-rise 900ms var(--trnr-ease) 450ms both}
html.motion .home-scene[data-ready] .home-intro p{animation:trnr-rise 900ms var(--trnr-ease) 560ms both}
html.motion .home-scene[data-ready] .home-availability{animation:trnr-fade 900ms ease-out 700ms both}
/* Date de sortie, en or, sous « Bientôt sur iPhone et Apple Watch » (demande de Franck, 05/10).
   Même lettrage que « PREND UNE AUTRE DIMENSION », en petit. */
.home-sortie{display:block;margin-top:10px;font-family:'TRNR Accent',sans-serif;font-weight:400;font-size:clamp(17px,1.5vw,21px);line-height:1.1;
 letter-spacing:-.01em;text-transform:uppercase;color:#c6a052;transform:skewX(-11deg) scaleX(.86);transform-origin:center}
html.motion .home-scene:not([data-ready]) .home-sortie{opacity:0}
html.motion .home-scene[data-ready] .home-sortie{animation:trnr-fade 900ms ease-out 800ms both}

/* Onglets : une seule pastille, en goutte de verre (Liquid Glass d'iOS 26, retenu par Franck le 05/10).
   Version allégée choisie par Franck (« A ») : un voile clair, un fin liseré de lumière en haut, une ombre très
   douce, sans contour ; motion.js l'étire et la reforme comme un liquide.
   Le vrai effet de loupe (déformation de ce qui est derrière) n'existe que dans Chrome : on ne s'en sert pas. */
.tabs.has-pill{position:relative}
.tabs.has-pill::before{content:"";position:absolute;left:0;top:0;width:var(--pill-w,0);height:var(--pill-h,0);
 translate:var(--pill-x,0) var(--pill-y,0);scale:var(--pill-sx,1) var(--pill-sy,1);border-radius:999px;pointer-events:none;
 background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.08));
 box-shadow:inset 0 1px 0 rgba(255,255,255,.30),0 2px 8px rgba(0,0,0,.18)}
.tabs.has-pill button{position:relative;z-index:1;transition:color 300ms ease,scale 120ms ease-out}
.tabs.has-pill button[aria-pressed=true]{background:transparent;color:#fff}
@media(prefers-reduced-transparency:reduce){.tabs.has-pill::before{background:#3a424c}}
@media(prefers-contrast:more){.tabs.has-pill::before{background:#f3f3ef;box-shadow:none}.tabs.has-pill button[aria-pressed=true]{color:#171c22}}
/* « Être prévenu » en haut à droite : bouton doré « Relief », le même que « Découvrir » et les boutons de l'app
   (choix 1 de Franck, 05/10 : la pilule de verre, gris sur gris, ne se voyait pas). Relief = liseré de lumière en
   haut, arête sombre en bas, ombre portée noire. Jamais de lueur autour (refusé : « années 80 »). */
.site-header .signup-link{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 18px;border-radius:999px;text-decoration:none;
 background:#c6a052;color:#171c22;font:italic 900 12.5px -apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;letter-spacing:-.2px;text-transform:uppercase;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -2px 0 rgba(0,0,0,.18),0 4px 6px rgba(0,0,0,.35);
 transition:scale 120ms ease-out,box-shadow 120ms ease-out;-webkit-tap-highlight-color:transparent}
.site-header .signup-link:active{scale:.97;box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(0,0,0,.18),0 2px 3px rgba(0,0,0,.35)}
.site-header .signup-link:focus-visible{outline:2px solid #c6a052;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.site-header .signup-link:active{scale:none}}
/* Glisser d'un programme à l'autre : le doigt horizontal est pour nous, le vertical reste au navigateur ;
   le geste à deux doigts du trackpad ne doit pas déclencher le retour en arrière de Safari. */
.frame{touch-action:pan-y}
/* Pendant le glissement, c'est le cadre entier qui se déplace : il est rogné aux bords de la page, sans défilement horizontal. */
main{overflow-x:clip}
html,body{overscroll-behavior-x:none}
.tabs.has-pill button:active{scale:.96}

html{scroll-behavior:smooth}

/* Réduire les animations : fondus seuls, sans déplacement ni glissement. */
@media(prefers-reduced-motion:reduce){
@keyframes trnr-rise{from{opacity:0}to{opacity:1}}
@keyframes trnr-settle{from{opacity:0}to{opacity:1}}
.tabs.has-pill button:active{scale:none}
html{scroll-behavior:auto}
}

/* Version téléphone (retours de Franck, 05/10).
   Barre d'onglets : on glisse toujours au doigt, mais la barre de défilement grise n'apparaît plus. */
.tabs{scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
/* Bouton « Découvrir » : il prenait toute la largeur de l'écran ; largeur naturelle, centré. */
.mobile-discovery:not([hidden]){width:max-content!important;max-width:calc(100% - 48px)!important;margin:12px auto 32px!important}
/* Pied de page : « © 2026 » à côté du logo, comme sur les pages des programmes (la phrase « Votre
   entraînement, à votre rythme » est retirée). Sur téléphone, il restait rejeté sous les liens. */
@media(max-width:650px){.site-footer p{order:0;flex-basis:auto}}
/* Onglets de programme sur téléphone : le bloc « scène + bouton Découvrir » est centré verticalement entre les
   onglets et le pied de page (retour de Franck : tout le vide s'accumulait sous le bouton). */
@media(max-width:650px){html.native-entry main{flex:1 0 auto;display:flex;flex-direction:column;justify-content:center}}

/* site/telephone.css */
/* Onglets de programme sur téléphone : composition en hauteur (retour de Franck, 05/10 : « tout petit,
   moins flamboyant que la version ordinateur »).
   La scène garde son dessin d'ordinateur (unités 1280 × 800) ; on n'en montre que la zone du nom géant,
   agrandie à toute la largeur, le personnage en grand dessous, puis les textes (bloc .scene-copy).
   Cadrage par scène, en unités de la scène :
     --vw  largeur montrée (nom + 4,5 % de marge de chaque côté)   --x0  bord gauche montré
     --ly0 haut du nom                                              --art-bottom  pieds du personnage
   motion.js en tire l'échelle (--k = largeur de l'écran / --vw, appliquée par zoom), le haut montré (--y0), la place des textes
   (--copy-top) et la hauteur du cadre. Les tailles de texte sont en pixels d'écran : « 40px / --k ». */
.scene-copy{display:contents}
@media(max-width:650px){
  .frame .scene-prime{--vw:860;--x0:441;--ly0:93;--art-bottom:779}
  .frame .scene-alpha{--vw:781;--x0:10;--ly0:80;--art-bottom:679}
  .frame .scene-street{--vw:1172.5;--x0:-7.8;--ly0:61;--art-bottom:995}
  .frame .scene-pmt{--vw:769;--x0:-19.6;--ly0:88;--art-bottom:704}
  .frame .scene-tabata{--vw:1133;--x0:84;--ly0:44;--art-bottom:939}
  .frame .scene-circuit{--vw:1348;--x0:-37.7;--ly0:32;--art-bottom:1111}

  /* La scène est mise à l'échelle par « zoom » et non par une transformation : l'iPhone la dessine directement à la
     taille de l'écran. Rapetissée par transformation, elle était peinte à sa taille d'ordinateur (1280 × 2600, soit
     4 à 10 fois trop de pixels), ce qui faisait ramer les changements de programme (retour de Franck, 05/10). */
  .frame .native-scene{height:2600px;transform:none!important;zoom:var(--k,.3);left:calc(var(--x0) * -1px);top:calc(var(--y0,0) * -1px)}

  /* Personnages recentrés sous le nom ; quand le nom couvre toute la largeur (STREET, TABATA, CIRCUIT),
     le personnage est agrandi autour de ses pieds, son ombre au sol avec lui. */
  .frame .scene-prime :is(.prime-duo,.prime-grounding){transform:translateX(-74px)}
  /* ALPHA, un peu réduit depuis la tête, pour que le bouton tienne dans le premier écran. */
  .frame .scene-alpha .refreshed-character{transform-origin:304px 16px;transform:scale(.85)}
  .frame .scene-alpha .character-ground{transform-origin:404px 196px;transform:scale(.85)}
  .frame .scene-street .refreshed-character{transform-origin:285px 604px;transform:translate(258px,236px) scale(1.4)}
  .frame .scene-street .character-ground{transform-origin:320px 759px;transform:translate(258px,236px) scale(1.4)}
  .frame .scene-tabata .tabata-subject{transform-origin:404px 544px;transform:translate(-238.5px,200px) scale(1.37)}
  .frame .scene-tabata .tabata-grounding{transform-origin:889px 739px;transform:translate(-238.5px,200px) scale(1.37)}
  .frame .scene-circuit .refreshed-character{transform-origin:310.5px 591px;transform:translate(300.8px,340px) scale(1.6)}
  .frame .scene-circuit .character-ground{transform-origin:335.5px 771px;transform:translate(300.8px,340px) scale(1.6)}

  /* Textes : dans l'ordre, alignés sur le bord gauche du nom. */
  .frame .native-scene .scene-copy{display:block;position:absolute;left:calc((var(--x0) + var(--vw) * .045) * 1px);top:calc(var(--copy-top,800) * 1px);width:calc(var(--vw) * .91px);z-index:3}
  .frame .native-scene .scene-copy>*{position:relative;left:auto;top:auto;width:auto;max-width:100%;margin:0}
  .frame .native-scene .scene-copy .scene-kicker{font-size:calc(10px / var(--k));letter-spacing:.22em;margin-bottom:calc(6px / var(--k))}
  .frame .native-scene .scene-copy .scene-title{font-size:calc(40px / var(--k));line-height:1.04;margin-bottom:calc(8px / var(--k))}
  .frame .native-scene .scene-copy .scene-title>span:last-child{margin-top:0}
  .frame .scene-prime .scene-copy .prime-emphasis{font-size:1.263em}
  .frame .scene-alpha .scene-copy .alpha-emphasis{font-size:1.25em}
  .frame .scene-street .scene-copy .street-emphasis{font-size:.944em}
  .frame .scene-pmt .scene-copy .pmt-emphasis{font-size:.903em}
  .frame .scene-tabata .scene-copy .tabata-emphasis{font-size:1.25em}
  .frame .scene-circuit .scene-copy .circuit-emphasis{font-size:1.042em}
  .frame .native-scene .scene-copy :is(.prime-description,.alpha-description,.street-description,.pmt-description,.tabata-description,.circuit-description){font-size:calc(14.5px / var(--k));line-height:1.38}
  /* Les filets décoratifs disparaissent : le bouton Découvrir vient juste dessous. */
  .frame .native-scene .scene-copy :is(.prime-rule,.alpha-rule){display:none}
  .frame .native-scene .scene-copy .alpha-frequency{font-size:calc(15px / var(--k));margin-top:calc(10px / var(--k))}
}

/* site/fenetre.css */
/* Fenêtre « Être prévenu » (demande de Franck, 05/10) : même recette que les fenêtres de l'app
   (TRNRWorkoutExitOverlay, validées le 2026-09-28) : page floutée et assombrie de 20 % derrière, panneau de
   verre teinté ardoise aux coins de 30, titre à deux tons (dernier mot en or), bouton principal « Relief » or,
   arrivée en 0,28 s depuis 94 %. Précision de Franck : fond flouté comme un portrait en gros plan, fenêtre en
   VERRE transparent au premier plan, rien d'autre (« en verre », pas « en vert »).
   REFUSÉ par Franck : toute déformation de la page (ondulation, loupe), le vert.
   Noms de classes neutres : les bloqueurs de publicité de Safari masquent « popup », « newsletter »… */
:root{--fen-accent:#c6a052;--fen-ardoise:#171c22}
html.fen-ouverte{overflow:hidden}
/* La page derrière se floute comme l'arrière-plan d'un portrait, en même temps que la fenêtre arrive. */
html.fen-ouverte body{filter:blur(0);transition:filter 280ms ease-in-out}
html.fen-floue body{filter:blur(6px)} /* 6 : le flou des fenêtres de l'app (14 jugé trop fort par Franck) */
html.fen-ouverte.fen-ferme body{transition-duration:320ms;transition-timing-function:ease-out}

.fen-voile{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:22px;background:rgba(0,0,0,0);
 transition:background-color 280ms ease-in-out;-webkit-tap-highlight-color:transparent}
.fen-voile[hidden]{display:none}
.fen-voile.fen-visible{background:rgba(0,0,0,.2)}
.fen-panneau{position:relative;width:100%;max-width:380px;padding:28px 24px 14px;border-radius:30px;color:#f4f4f1;
 font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
 background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04)),rgba(30,38,48,.30);
 -webkit-backdrop-filter:blur(24px) saturate(170%);backdrop-filter:blur(24px) saturate(170%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.22),inset 0 -1px 0 rgba(255,255,255,.06),inset 0 0 0 .5px rgba(255,255,255,.09),0 30px 70px rgba(0,0,0,.42);
 opacity:0;scale:.94;transition:opacity 280ms ease-in-out,scale 280ms ease-in-out}
.fen-visible .fen-panneau{opacity:1;scale:1}
/* Sur iPhone, le panneau reçoit la main à l'ouverture (sans faire surgir le clavier) : pas de contour bleu de Safari. */
.fen-panneau:focus,.fen-panneau:focus-visible{outline:none}
.fen-voile.fen-ferme,.fen-voile.fen-ferme .fen-panneau{transition-duration:320ms;transition-timing-function:ease-out}

.fen-fermer{position:absolute;top:10px;right:10px;width:44px;height:44px;display:grid;place-items:center;border:0;padding:0;background:none;cursor:pointer;color:#fff}
.fen-fermer span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.05);
 box-shadow:inset 0 .5px 0 rgba(255,255,255,.3)}
.fen-fermer svg{width:12px;height:12px;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.fen-titre{margin:0;padding-right:36px;font-size:25px;line-height:1.12;font-weight:900;font-style:italic;letter-spacing:-.5px;color:#f4f4f1}
.fen-titre b{font-weight:900;color:var(--fen-accent)}
.fen-texte{margin:8px 0 0;font-size:15px;line-height:1.45;color:#b4bdc7}
.fen-champ{display:block;width:100%;height:52px;margin-top:22px;padding:0 18px;border:0;border-radius:17px;outline:none;
 font:500 16px -apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;color:#f4f4f1;background:rgba(255,255,255,.07);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.19);transition:box-shadow 160ms ease}
.fen-champ::placeholder{color:#97a1ad}
/* Texte sélectionné (Safari sélectionne l'adresse qu'il vient de remplir) : teinte or au lieu du rectangle blanc. */
.fen-champ::selection{background:rgba(198,160,82,.38);color:#fff;-webkit-text-fill-color:#fff}
/* Remplissage automatique de Safari : il peint le champ en jaune. On garde la couleur du verre (Franck : « ça fait moche »). */
.fen-champ:-webkit-autofill,.fen-champ:-webkit-autofill:hover,.fen-champ:-webkit-autofill:focus{
 -webkit-text-fill-color:#f4f4f1;caret-color:#f4f4f1;-webkit-box-shadow:inset 0 0 0 100px #2b333d,inset 0 1px 0 rgba(255,255,255,.19);
 box-shadow:inset 0 0 0 100px #2b333d,inset 0 1px 0 rgba(255,255,255,.19);transition:background-color 99999s}
.fen-champ:-webkit-autofill:focus{-webkit-box-shadow:inset 0 0 0 100px #2b333d,inset 0 1px 0 rgba(255,255,255,.19),0 0 0 2px rgba(198,160,82,.6);
 box-shadow:inset 0 0 0 100px #2b333d,inset 0 1px 0 rgba(255,255,255,.19),0 0 0 2px rgba(198,160,82,.6)}
.fen-champ:focus{box-shadow:inset 0 1px 0 rgba(255,255,255,.19),0 0 0 2px rgba(198,160,82,.6)}
.fen-erreur .fen-champ{box-shadow:inset 0 1px 0 rgba(255,255,255,.19),0 0 0 2px rgba(224,90,71,.7)}
/* Bouton principal de l’app : 52 pt, coins 17, reflet supérieur et ombre noire courte. */
.fen-action{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:10px;border:0;border-radius:999px;cursor:pointer;
 font:italic 900 14px -apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;letter-spacing:-1px;text-transform:uppercase;
 color:var(--fen-ardoise);background:var(--fen-accent);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 5px 6px rgba(0,0,0,.27);transition:scale 120ms ease-out,opacity 160ms ease}
.fen-action:active{scale:.98}
.fen-action:disabled{opacity:.6;cursor:default}
.fen-message{min-height:20px;margin:10px 2px 0;font-size:13px;line-height:1.4;color:#97a1ad}
.fen-erreur .fen-message{color:#ee8a7c}
.fen-note{margin:4px 2px 0;font-size:12px;line-height:1.4;color:#97a1ad}
.fen-note a{color:#c9d1d9;text-underline-offset:2px}
.fen-champ:focus-visible,.fen-action:focus-visible,.fen-fermer:focus-visible span{outline:2px solid var(--fen-accent);outline-offset:3px}

@media(prefers-reduced-motion:reduce){.fen-panneau{scale:1;transition:opacity 200ms ease}}
@media(prefers-reduced-transparency:reduce){.fen-panneau{background:#26303b;-webkit-backdrop-filter:none;backdrop-filter:none}
 html.fen-floue body{filter:none}.fen-voile.fen-visible{background:rgba(0,0,0,.6)}}

