
@font-face{font-family:"Mona Sans";src:url("MonaSansVF.woff2") format("woff2");font-weight:200 900;font-display:swap}
:root{--ink:#1E1E1E;--cream:#FAF6EE;--cream2:#F0EADC;--card:#fff;--border:#E8DECC;--muted:#F5F0E6;--muted-fg:#6E6455;--sand3:#EBCFA8;--sand4:#E3BE8A;--sand5:#D9AE74;--sand6:#C09860;--chip-bg:#F6EDDD;--chip-line:#EBD9BC;--chip-fg:#7A5A2E;--label:#B98F55;
--display:"Mona Sans","Inter","SF Pro Display",system-ui,sans-serif;--meta:"Inter","SF Pro Text",system-ui,sans-serif;--italic:"Cormorant Garamond","Iowan Old Style",Georgia,serif}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font:500 16px/1.6 var(--display);letter-spacing:-.005em;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
/* top bar */
.bar{border-bottom:1px solid var(--border);background:rgba(250,246,238,.9);backdrop-filter:blur(8px)}.bar .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px}.brand .mark{width:26px;height:26px;border-radius:7px;background:var(--ink);display:grid;place-items:center;color:var(--cream);font:700 12px var(--meta)}.brand em{font-style:normal;color:var(--sand5)}
.bar .right{display:flex;align-items:center;gap:14px;font:500 14px var(--meta);color:var(--muted-fg)}.btn-dark{background:var(--ink);color:#fff;border-radius:999px;padding:9px 16px;font:600 14px var(--meta);text-decoration:none}
/* hero head */
.head{padding:44px 0 20px;text-align:left}.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--chip-line);background:var(--chip-bg);color:var(--chip-fg);border-radius:999px;padding:5px 12px;font:600 12.5px var(--meta)}.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sand5)}
h1{font:800 clamp(30px,4.2vw,50px)/1.05 var(--display);letter-spacing:-.025em;margin:16px 0 12px;text-wrap:balance}h1 .hl{background:linear-gradient(transparent 58%,var(--sand3) 58%);padding:0 2px}
.meta{display:flex;gap:18px;flex-wrap:wrap;font:500 14px var(--meta);color:var(--muted-fg)}.meta span::before{content:"·";margin-right:18px;color:var(--sand5)}.meta span:first-child::before{content:none}
/* player row */
.player{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:stretch;margin-top:22px}
.frame{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:10px;box-shadow:0 12px 40px -30px rgba(11,11,11,.35)}.frame .tabs{display:flex;align-items:center;gap:6px;padding:2px 6px 10px}.frame .tabs i{width:9px;height:9px;border-radius:50%;background:var(--sand3);display:inline-block}.frame .tabs b{margin-left:8px;font:500 12px var(--meta);color:var(--muted-fg);background:var(--chip-bg);border-radius:8px;padding:3px 10px}
video{width:100%;display:block;border-radius:12px;background:#000}
.side{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px 10px;overflow:auto;max-height:calc((1180px - 56px - 358px) * 9 / 16 + 44px)}
.label{font:600 11.5px var(--meta);letter-spacing:.1em;text-transform:uppercase;color:var(--label);padding:0 10px 8px}
.chapters{list-style:none;margin:0;padding:0}.chapters li{display:flex;gap:12px;padding:9px 10px;border-radius:10px;cursor:pointer;border:1px solid transparent;font-size:15px;line-height:1.35}
.chapters li:hover{background:var(--muted)}.chapters li.on{background:var(--ink);color:var(--cream);border-bottom:2px solid var(--sand5)}.chapters li.on time{color:var(--sand4)}
.chapters time{font:600 12px var(--meta);color:var(--label);flex:0 0 52px;padding-top:3px;font-variant-numeric:tabular-nums}
/* below */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}.wide{grid-column:1/-1}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px 24px}.card .label{padding:0 0 10px}
.one{background:var(--ink);color:var(--cream);border-color:var(--ink)}.one .label{color:var(--sand4)}.one p{margin:0;font:600 22px/1.35 var(--display);letter-spacing:-.015em}.one p em{font:italic 600 1.15em var(--italic);color:var(--sand4)}
.obj{list-style:none;padding:0;margin:0;display:grid;gap:10px}.obj li{background:var(--muted);border:1px solid var(--border);border-radius:12px;padding:12px 14px;font-size:15px}.obj b{display:block;font:600 11px var(--meta);letter-spacing:.1em;text-transform:uppercase;color:var(--label);margin-bottom:3px}
.moments{list-style:none;padding:0;margin:0}.moments li{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--border);font-size:15px;line-height:1.45}.moments li:last-child{border:0}
.moments button{border:1px solid var(--chip-line);background:var(--chip-bg);color:var(--chip-fg);font:600 12px var(--meta);border-radius:999px;padding:4px 10px;cursor:pointer;height:26px;flex:0 0 auto;margin-top:2px}.moments button:hover{background:var(--sand3)}
.tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.tool{background:var(--muted);border:1px solid var(--border);border-radius:12px;padding:14px 16px}.tool h4{margin:0 0 4px;font:700 15px var(--display)}.tool p{margin:0;font-size:14px;color:var(--muted-fg);line-height:1.5}
footer{margin-top:34px;background:var(--ink);color:rgba(250,246,238,.7);font:500 13px var(--meta);padding:26px 0}footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}footer b{color:var(--cream)}
@media(max-width:960px){.player{grid-template-columns:1fr}.side{max-height:none}.grid{grid-template-columns:1fr}}
.switch{position:fixed;top:74px;right:12px;z-index:9;background:#fff;border:1px solid var(--border);border-radius:999px;padding:6px 8px;font:600 13px var(--meta);box-shadow:0 2px 10px rgba(0,0,0,.08)}.switch a{margin:0 6px;text-decoration:none;color:var(--ink)}.switch a.cur{background:var(--ink);color:#fff;border-radius:999px;padding:4px 10px}

/* ===== Replay : rythme vertical + onglets flottants (décision du 11/09/2026) ===== */
.head{padding:48px 0 24px}.player{margin-top:44px;gap:24px}.grid{gap:44px 24px;margin-top:48px}
.card{position:relative;overflow:visible;padding:44px 28px 28px}.card .label,.side .label{display:none}
.side.card{position:relative;overflow:visible;max-height:none;padding:44px 10px 14px;min-height:280px}
.side .body{position:absolute;top:44px;left:10px;right:10px;bottom:12px;max-height:none;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--sand4) transparent;padding-right:4px}
.side.card::after{content:"";position:absolute;left:1px;right:1px;bottom:1px;height:40px;border-radius:0 0 18px 18px;background:linear-gradient(rgba(255,255,255,0),#fff 85%);pointer-events:none}
.side .chapters li:last-child{margin-bottom:28px}
.ttl{position:absolute;top:-24px;left:22px;margin:0;display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--cream);font:700 19px/1 var(--display);letter-spacing:-.015em;padding:15px 22px 13px;border-radius:12px;border-bottom:3px solid var(--sand5);box-shadow:0 10px 24px -14px rgba(30,30,30,.6);white-space:nowrap}
.ttl::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sand5)}
.ttl small{font:600 11.5px var(--meta);letter-spacing:.1em;text-transform:uppercase;color:var(--sand4);margin-left:4px}
.one .ttl{background:var(--sand5);color:var(--ink);border-bottom-color:var(--ink)}.one .ttl::before{background:var(--ink)}.one .ttl small{color:#fff;opacity:1;font-weight:700}
.one .body p{margin:0;font:600 22px/1.35 var(--display);letter-spacing:-.015em}
.moments li{padding:11px 0}.obj{gap:12px}.tools{gap:14px}footer{margin-top:56px}
.plain{margin:0;padding-left:20px;font-size:15px;line-height:1.55}.plain li{margin:6px 0}
.lead{font-size:17px;line-height:1.6;color:var(--muted-fg);margin:0}
.brand{text-decoration:none;color:inherit}
.empty{max-width:760px;padding-bottom:120px}.empty h1{margin-top:18px}.empty .lead{margin-top:14px}
.switch{display:none}
@media(max-width:960px){.ttl{font-size:16px;padding:12px 16px 11px;white-space:normal;max-width:calc(100% - 44px)}.ttl small{display:none}.card{padding-top:40px}.side.card{min-height:0;padding:40px 10px 14px}.side .body{position:static;overflow:visible;padding-right:0}.side.card::after{display:none}.side .chapters li:last-child{margin-bottom:0}}

/* ===== Correctifs mobile et cadre vidéo (11/09/2026) ===== */
html,body{overflow-x:hidden}
.player>*,.grid>*{min-width:0}
.frame .tabs{min-width:0}.frame .tabs b{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frame video{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.bar .wrap{gap:12px}.bar .right{min-width:0}
@media(max-width:600px){.bar .right span{display:none}.head{padding:32px 0 20px}.meta{gap:10px}.meta span::before{margin-right:10px}h1{font-size:30px}}

/* ===== Mobile : colonnes bornées (1fr a un minimum implicite = largeur intrinsèque de la vidéo) ===== */
.player{grid-template-columns:minmax(0,1fr) 340px}.grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.head{padding:48px 28px 24px}.frame video{max-width:100%}.bar .brand{min-width:0;white-space:nowrap}
@media(max-width:960px){.player{grid-template-columns:minmax(0,1fr)}.grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.wrap{padding:0 18px}.head{padding:32px 18px 20px}.brand em{display:none}.bar .wrap{height:56px}}
