:root{color-scheme:light;--ink:#213b3a;--muted:#65726c;--paper:#f6f4ed;--accent:#b75b39;--line:#dadfd3;font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0}a{color:inherit}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);background:#fffefa;color:var(--ink);border-radius:6px;padding:9px 13px}button:hover{background:#e6ebdf}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}.masthead,main,footer{max-width:1440px;margin:auto;padding-left:4vw;padding-right:4vw}.masthead{display:flex;justify-content:space-between;align-items:center;padding-top:25px;padding-bottom:25px;border-bottom:1px solid var(--line)}.brand{text-decoration:none;font:700 27px Georgia,serif;display:flex;align-items:center;gap:12px}.brand-icon{display:grid;place-items:center;width:38px;height:42px;background:var(--ink);color:var(--paper);border-radius:18px 18px 3px 3px}.brand-sub{font:10px system-ui;letter-spacing:2px;margin-left:18px;color:var(--muted)}.origin{font-size:12px;text-decoration:none}.intro{padding:36px 0 26px}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;margin:0 0 12px;color:var(--muted)}h1{font:normal clamp(34px,4vw,54px)/1.05 Georgia,serif;letter-spacing:-1.5px;margin:0 0 16px}.intro>p:last-child{color:var(--muted);font-size:14px;line-height:1.7;margin:0}.pages{display:flex;border-bottom:1px solid var(--line);gap:30px;margin-bottom:22px}.pages a{padding:16px 0;text-decoration:none;border-bottom:3px solid transparent;font-weight:600;font-size:14px}.pages a span{font-size:10px;margin-right:9px;color:var(--muted)}.pages a[aria-current=page]{border-color:var(--accent);color:var(--accent)}.detail{display:flex;justify-content:space-between;background:#e8eddf;border:1px solid #dbe1d1;border-radius:10px;min-height:190px;overflow:hidden;margin-bottom:32px}.detail-copy{padding:24px 28px;flex:1;min-width:0}.detail h2{font:normal 29px Georgia,serif;margin:0 0 7px}.dates{font-size:12px;color:var(--accent);font-weight:650;margin:0 0 9px}#detail-text{font-size:13px;line-height:1.65;max-height:110px;overflow:auto;margin:0;white-space:pre-line}.detail-actions{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:11px}.detail-actions button{padding:5px 10px;font-size:11px;background:transparent}.detail figure{margin:0;position:relative;flex:0 0 250px;background:#d6ddcc;min-height:190px}.detail img{display:block;width:100%;height:100%;max-height:270px;object-fit:cover}.detail figcaption{position:absolute;bottom:0;left:0;right:0;font-size:9px;color:white;background:#142928ad;padding:7px 10px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}.section-head h2{font:normal 28px Georgia,serif;margin:0}.section-head>p{font-size:12px;color:var(--muted);max-width:360px;line-height:1.6;margin:0}.toolbar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.presets,.controls{display:flex;gap:5px;flex-wrap:wrap}.presets button{background:transparent;border-color:transparent;font-size:12px}.presets button[aria-pressed=true]{background:var(--ink);color:white}.controls button{font-size:13px;padding:7px 12px}.window{font-size:11px;color:var(--muted);margin:18px 0 10px;font-variant-numeric:tabular-nums}.timeline-shell{display:grid;grid-template-columns:112px minmax(0,1fr);background:#fffefa;border:1px solid var(--line);border-radius:8px;overflow:hidden}#row-labels{border-right:1px solid var(--line);background:#eef0e7;font-size:11px;font-weight:650}#row-labels>div{padding:0 12px;display:flex;align-items:center;border-bottom:1px solid var(--line)}#stage{min-width:0;overflow:hidden}.hint{font-size:11px;color:var(--muted);margin:13px 0 30px;line-height:1.6}.catalog-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px}.catalog-head h3{font-size:16px;font-weight:550}.catalog-head h3 span{font-size:11px;color:var(--muted);margin-left:8px}.catalog-head label{font-size:10px;color:var(--muted);display:flex;flex-direction:column;gap:5px}.catalog-head input{width:300px;padding:10px 12px;border:1px solid var(--line);border-radius:5px;background:#fffefa;color:var(--ink);font-size:12px}.catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-height:400px;overflow:auto;padding:3px}.catalog button{text-align:left;padding:13px 16px;display:flex;flex-direction:column;gap:7px;min-width:0}.catalog button strong{font-weight:600;font-size:13px}.catalog button span{color:var(--muted);font-size:10px}.catalog button[aria-pressed=true]{border-color:var(--accent);background:#f8e9de}footer{padding-top:30px;padding-bottom:30px;margin-top:40px;border-top:1px solid var(--line);font-size:11px;line-height:1.8;color:var(--muted)}footer p{max-width:900px}.skip{position:absolute;top:-50px;background:white;padding:10px;z-index:5}.skip:focus{top:0}#error{background:#ffe5d9;padding:16px}#empty{color:var(--muted);padding:20px}#exploration{scroll-margin-top:20px}@media(max-width:720px){.brand-sub,.origin{display:none}.masthead{padding-top:16px;padding-bottom:16px}.intro{padding-top:28px}.pages{gap:14px}.pages a{font-size:12px;line-height:1.5}.pages a span{display:block}.detail-copy{padding:20px}.detail h2{font-size:24px}.detail figure{flex-basis:100px}.detail img{object-fit:cover}.detail figcaption{display:none}.section-head{display:block}.section-head>p{margin-top:10px}.timeline-shell{grid-template-columns:80px minmax(0,1fr)}#row-labels>div{padding:0 6px;font-size:10px}.catalog-head{align-items:stretch;flex-direction:column;gap:0}.catalog-head input{width:100%}.catalog{grid-template-columns:1fr 1fr}.detail-actions{flex-wrap:wrap}}@media(prefers-reduced-motion:no-preference){button,a{transition:background .15s,color .15s}}

#ruler{height:40px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:#fffefa}#ruler>span{position:absolute;bottom:9px;transform:translateX(-50%);white-space:nowrap;font-size:10px;color:var(--muted)}#ruler>span::after{content:"";position:absolute;left:50%;height:6px;bottom:-9px;border-left:1px solid #9aacba}

.detail{position:sticky;top:8px;z-index:10;box-shadow:0 5px 20px #213b3a0a;height:220px;min-height:0}.detail figure{min-height:0}.detail img{height:220px}.detail-copy{overflow:auto}#exploration{scroll-margin-top:240px}@media(max-width:720px){.detail{height:175px;top:4px}.detail-copy{padding:14px}.detail img{height:175px}.detail h2{font-size:21px}#detail-text{max-height:50px;font-size:12px}.detail .eyebrow{margin-bottom:6px}.detail-actions{margin-top:6px}#exploration{scroll-margin-top:190px}}

/* Présentation compacte bordeaux / pourpre, navigation issue de HOF Fréquences. */
:root{color-scheme:dark;--ink:#f5e6ec;--muted:#c4a9bc;--paper:#1c101a;--accent:#f199b5;--line:#61394f}
.masthead,main,footer{width:100%;max-width:none;padding-left:10px;padding-right:10px}.masthead{padding-top:7px;padding-bottom:7px}.brand{font-size:21px;gap:8px}.brand-icon{width:27px;height:30px;background:#83384f;color:#fff}.brand-sub{margin-left:8px}.intro{padding:9px 0 7px}.intro .eyebrow{margin-bottom:5px}h1{font-size:29px;letter-spacing:-.6px;margin-bottom:5px}.intro>p:last-child{font-size:12px;line-height:1.4}.pages{margin-bottom:0;gap:22px}.pages a{padding:7px 0;font-size:13px}.page-description{font-size:12px;color:var(--muted);margin:5px 0 8px;line-height:1.4}.detail{height:135px;top:3px;margin-bottom:8px;background:#351b30;border-color:#694258;border-radius:5px;box-shadow:0 3px 12px #0004}.detail-copy{padding:10px 14px}.detail h2{font-size:23px;margin-bottom:4px}.detail .eyebrow{margin-bottom:5px}.dates{margin-bottom:4px}.detail figure{flex-basis:180px;background:#321827}.detail img{height:135px;max-height:135px}.detail figcaption{font-size:8px;padding:3px 6px}#detail-text{font-size:12px;line-height:1.4;max-height:48px}.detail-actions{margin-top:5px;gap:6px}.detail-actions button{padding:3px 6px}.toolbar{display:block}.presets{gap:3px;margin-bottom:4px}.presets button{padding:4px 9px;color:#e5cddd}.presets button[aria-pressed=true]{background:#822c4a;color:white}.controls{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}.framing-nav{flex:1 1 560px;display:flex;align-items:center;gap:6px;min-width:0;padding:3px 5px;border:1px solid #815170;border-radius:5px;background:linear-gradient(100deg,#632339,#462151)}.framing-title{font-size:.65rem;white-space:nowrap;flex:0 0 auto}.framing-center{flex:1;display:flex;align-items:center;justify-content:center;gap:3px;min-width:0}.framing-bound{font-size:.65rem;white-space:nowrap;font-variant-numeric:tabular-nums;margin:0 3px}.controls .nav-symbol{height:1.2rem;min-width:1.4rem;padding:0 3px;font-size:.8rem;line-height:1;border-radius:3px;white-space:nowrap;background:#4f233e;border-color:#9f688b;color:#ffeaf4}.controls .nav-symbol:hover{background:#964b75;color:white}button{background:#351b30;color:var(--ink);border-color:var(--line)}button:hover{background:#57273f}.window{margin:5px 0;font-size:10px}.timeline-shell{grid-template-columns:100px minmax(0,1fr);background:#23121f;border-color:var(--line);border-radius:4px}#row-labels{background:#351b30}#row-labels>div{font-size:10px;padding:0 8px}#ruler{height:28px;background:#291524;border-color:var(--line)}#ruler>span{font-size:10px}.hint{margin:5px 0 9px;font-size:10px;line-height:1.4}.catalog-head{margin-bottom:5px}.catalog-head h3{margin:5px 0;font-size:14px}.catalog-head label{gap:2px}.catalog-head input{padding:5px 9px;background:#291524;color:var(--ink);border-color:var(--line)}.catalog{gap:4px;max-height:280px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.catalog button{padding:7px 10px;gap:3px;background:#2f1929}.catalog button[aria-pressed=true]{background:#632b47;border-color:#ed92b3}.catalog button strong{font-size:12px}.catalog button:hover{background:#4b233b}footer{margin-top:12px;padding-top:8px;padding-bottom:8px;font-size:10px;line-height:1.5}footer p{margin:4px 0;max-width:none}#exploration{scroll-margin-top:145px}.skip{background:#53213c}#error{background:#6d203c}.detail-actions button{color:#f1d8e7}
@media(max-width:720px){.masthead,main,footer{padding-left:5px;padding-right:5px}.intro{padding:7px 0}.pages{gap:16px}.pages a span{display:inline}.pages a{font-size:11px}.detail{height:128px;top:2px}.detail-copy{padding:7px 9px}.detail h2{font-size:20px}.detail figure{flex-basis:85px}.detail img{height:128px}.timeline-shell{grid-template-columns:76px minmax(0,1fr)}#row-labels>div{padding:0 4px}.catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-head{gap:4px}.catalog-head label{font-size:10px}.catalog button{padding:6px}.catalog button strong{font-size:11px}#exploration{scroll-margin-top:138px}}
@media(max-width:480px){.framing-nav{flex-wrap:wrap;gap:2px}.framing-center{flex-basis:100%;gap:2px;flex-wrap:wrap}.framing-bound{margin:0 1px;font-size:.6rem}.controls .nav-symbol{min-width:1.25rem;padding:0 2px}}

/* La sélection reste portée par l’instance Hall of Frame après chaque rendu. */
#chart .alloframe-act.act-selected{background:#ffd36b!important;color:#241020!important;border:2px solid #fff2bc!important;box-shadow:inset 0 0 0 1px #512032,0 0 7px #ffd36b!important;min-width:12px;z-index:5;filter:none!important;font-weight:800}
#chart .alloframe-act .act-thumbnail{order:-1;width:24px;height:100%;min-width:24px;object-fit:cover;flex-shrink:0;pointer-events:none}
#catalog button{position:relative}#catalog button:has(.catalog-thumbnail:not([hidden])){padding-left:62px;min-height:52px}.catalog-thumbnail{position:absolute;left:5px;top:5px;width:48px;height:42px;object-fit:contain;background:#1c101a;border-radius:3px}
.detail figure{flex-basis:32%;max-width:480px}#detail-gallery{display:flex;height:100%;overflow-x:auto;align-items:center;gap:4px;padding-bottom:15px}#detail-gallery img{height:100%;width:auto;max-width:100%;max-height:100%;object-fit:contain;flex:0 0 auto}.detail figcaption{pointer-events:none}
@media(max-width:720px){.detail figure{flex-basis:32%;min-width:85px}#detail-gallery{padding-bottom:0}#catalog button:has(.catalog-thumbnail:not([hidden])){padding-left:43px}.catalog-thumbnail{width:32px;height:36px}}

/* Les événements ponctuels gardent assez de place pour leur symbole. */
#chart .alloframe-act-point[data-has-icon]{min-width:30px}
#chart .alloframe-act-point[data-has-icon] .act-thumbnail{display:none}
#chart .alloframe-act-point[data-has-icon] .alloframe-act-label{flex-shrink:0;text-overflow:clip;padding:0 4px}

/* Palette du portail d’origine : bleu #2169bc, pourpre #570735, ivoire #ddd8c4. */
:root{--paper:#2169bc;--ink:#fff;--muted:#e1edfc;--accent:#fff0b8;--line:#83b7ef}
.brand-icon,.presets button[aria-pressed=true]{background:#570735}
.detail{background:#103d72;border-color:#a3cbfa;box-shadow:0 3px 12px #07274a80}.detail figure{background:#0b305b}
button,.catalog button,#row-labels{background:#194f8c}button:hover,.catalog button:hover{background:#123e72}
.presets button,.detail-actions button{color:#fff}
.framing-nav{background:#194f8c;border-color:#83b7ef}.controls .nav-symbol{background:#103d72;border-color:#83b7ef;color:white}.controls .nav-symbol:hover{background:#2169bc}
.timeline-shell,#ruler,.catalog-head input,.catalog-thumbnail{background:#194f8c}
.catalog button[aria-pressed=true]{background:#103d72;border-color:#fff0b8}.skip{background:#103d72}
#detail-gallery img{cursor:zoom-in}
#lesson{background:#ddd8c4;color:#172b40;border:1px solid #83b7ef;border-radius:5px;margin:8px 0;padding:14px;scroll-margin-top:145px}
#lesson>header{display:flex;gap:12px;align-items:center;flex-wrap:wrap;border-bottom:1px solid #9faeae;padding-bottom:8px}#lesson-title{margin:0;flex:1;font-size:20px}#lesson-source{font-size:12px}#lesson-body{line-height:1.6;overflow-wrap:anywhere}#lesson-body h1{font-size:26px;margin:18px 0}#lesson-body img{display:block;max-width:100%;height:auto;max-height:450px;object-fit:contain;cursor:zoom-in}#lesson-body table{display:block;max-width:100%;overflow:auto}#lesson-body a{color:#164f8d}
#image-viewer{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:55px 16px 35px;border:0;background:#061a30f5;color:#fff;overflow:hidden}
#image-viewer::backdrop{background:#061a30}#image-viewer[open]{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px}#viewer-image{min-height:0;max-width:100%;max-height:calc(100dvh - 105px);object-fit:contain}#viewer-close{position:absolute;right:12px;top:10px;background:#103d72;color:#fff}#viewer-caption{margin:0;font-size:13px}body:has(#image-viewer[open]){overflow:hidden}
@media(max-width:720px){#lesson{scroll-margin-top:138px;padding:9px}}

/* Navigation vers les cours, visible aussi sur mobile. */
.masthead{flex-wrap:wrap;gap:10px}.course-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px}.course-links .origin{display:inline}
