/* fs-site.css — styles partagés des pages projet (nav + zone contenu).
   La grammaire : serif = lecture, mono = système. Bleu = lien, vert = interaction. */
.fs ::selection{background:#9fe700;color:#111;}
/* focus clavier : un seul halo, dans la charte (vert = interaction). Invisible à la souris. */
.fs :focus-visible{outline:2px solid #9fe700;outline-offset:2px;border-radius:2px;}
html,body{margin:0;background:#fafafa;}
.fs{position:relative;min-height:100vh;font-family:Georgia,"Times New Roman",serif;color:#111;
  /* déport constant de la nav (la nav reste ancrée à gauche, même offset partout) ;
     le contenu, lui, s'élargit pour occuper la place à droite */
  --fb-shift:48px; --fb-cat-max:1480px; --fb-preview-max:1100px;}

/* colonne de navigation */
.fs-nav{position:fixed;top:0;left:var(--fb-shift,0px);width:18.5rem;height:100vh;box-sizing:border-box;
  display:flex;flex-direction:column;padding:42px 22px;overflow:auto;}
.fs-nav .wm{font:700 19px/1.2 Georgia,serif;margin-bottom:24px;white-space:nowrap;color:#111;text-decoration:none;display:block;cursor:default;}
.fs-nav .wm:hover{color:#111;}
.fs-nav .sec{font:700 15px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#111;letter-spacing:.02em;margin:0 0 24px;}
.fs-nav ul{list-style:none;margin:0 0 52px;padding:0;}
.fs-nav li{font:13.5px/1.75 Georgia,serif;}
.fs-nav a{color:#111;text-decoration:none;cursor:pointer;}
.fs-nav a:hover{color:#9fe700;text-decoration:underline;text-underline-offset:2px;}
.fs-nav .cur{color:#111;font-weight:700;}

/* ── arbre de navigation : un vrai « tree » (now → works → info) ── */
.fs-nav .ftree{list-style:none;margin:14px 0 46px;padding:0;}
.fs-nav .ftree ul{list-style:none;margin:0;padding:0 0 0 14px;}
.fs-nav .ftree li{position:relative;padding-left:13px;font:13px/1.9 Georgia,serif;white-space:nowrap;}
/* spine verticale reliant les frères d'un même dossier */
.fs-nav .ftree li::before{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px solid #cfcfcf;}
/* coude horizontal vers l'étiquette */
.fs-nav .ftree li::after{content:"";position:absolute;left:0;top:.93em;width:9px;border-top:1px solid #cfcfcf;}
/* dernier enfant : la spine s'arrête au coude → └ */
.fs-nav .ftree li:last-child::before{bottom:auto;height:.93em;}
/* étiquettes */
/* bleu = lien (on peut y aller) · encre grasse = page courante (on y est) · vert = survol */
.fs-nav .ftree a{color:#0a2ed6;text-decoration:none;cursor:pointer;}
.fs-nav .ftree a:hover{color:#9fe700;text-decoration:underline;text-underline-offset:2px;}
.fs-nav .ftree a.onpath{color:#111;}            /* chemin menant à la page courante = encre */
.fs-nav .ftree a.onpath:hover{color:#9fe700;}
.fs-nav .ftree .lbl{color:#0a2ed6;cursor:default;}
.fs-nav .ftree .cur{color:#111;text-decoration:none;}      /* page courante : encre, pas un lien */
.fs-nav .ftree .dir>a,.fs-nav .ftree .dir>.lbl,.fs-nav .ftree .dir>.cur{font-weight:700;}

.fs-nav .sweety{display:block;width:58px;margin-top:auto;animation:fs-bob 3.6s ease-in-out infinite;}
@keyframes fs-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.fs-nav .upd{font:11px/1.6 ui-monospace,monospace;color:#aaa;margin-top:14px;}

/* zone contenu */
#fs-project{display:none;}
.fs .page-content{box-sizing:border-box;padding:5.2rem 3rem 3rem calc(20.5rem + var(--fb-shift,0px));}

/* ── pages info (about / cv / press) : colonne de lecture + listings type répertoire ── */
.fs .doc{box-sizing:border-box;}
.fs .doc.read{max-width:680px;}
.fs .doc.wide{max-width:1140px;}   /* CV : assez large pour que chaque entr\u00e9e tienne sur une ligne sur un 14" */
.fs .doc .kick{font:700 13px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.02em;color:#111;margin:0 0 16px;}
.fs .doc .kick + .kick,.fs .doc p + .kick{margin-top:34px;}
.fs .doc p.lede{font:15px/1.7 Georgia,"Times New Roman",serif;color:#222;margin:0 0 14px;}
.fs .doc a{color:#0a2ed6;text-decoration:underline;text-underline-offset:2px;}
.fs .doc a:hover{color:#9fe700;}
.fs .doc .nl{display:flex;align-items:center;gap:14px;max-width:430px;padding:6px 0;margin:0 0 6px;}
.fs .doc .nl input{flex:1;min-width:0;border:0;background:transparent;font:15px/1.6 Georgia,"Times New Roman",serif;color:#111;padding:0;outline:none;}
.fs .doc .nl button{border:0;background:transparent;font:12px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#0a2ed6;cursor:pointer;padding:0;white-space:nowrap;}
.fs .doc .nl button:hover{color:#9fe700;text-decoration:underline;text-underline-offset:2px;}
.fs .doc .nl-msg{font:12px/1.6 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#8a8a8a;margin:0 0 10px;}
.fs .doc .nl-msg:empty{display:none;margin:0;}

.fs .dirblock{margin:0 0 46px;padding-left:6px;}
.fs .dir-head{display:grid;grid-template-columns:1fr;align-items:baseline;
  font:12.5px/2.05 ui-monospace,"SF Mono",Menlo,Consolas,monospace;margin-bottom:11px;}
.fs .dir-head .mk{display:none;}
.fs .dir-head .nm{color:#111;font-weight:700;}
.fs .dir-head .ct{display:none;}   /* compteur retiré du CV : non pertinent ici */
.fs .dir-row{display:grid;column-gap:14px;align-items:baseline;padding:1px 0 1px 18px;
  font:12.5px/2.05 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#111;}
.fs .dir-row.cv{grid-template-columns:64px minmax(0,1.5fr) minmax(0,1fr);padding-top:4px;padding-bottom:4px;}
/* CV : lieu en colonne alignée à gauche (bord commun, scannable) — pas ferré à droite
   comme le reste du site, qui est en colonnes « Index of / ». */
.fs .dir-row.cv .ve{text-align:left;color:#6f6f6f;font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:14px;}
/* hiérarchie : le titre de l'entrée en gras (ancre du scan), les métadonnées en gris lisible */
.fs .dir-row.cv .ti{font-weight:600;}
/* curateur/invité : sur la m\u00eame ligne que le titre, mais en serif italique \u2014 la fonte
   de lecture du site (mono = syst\u00e8me, serif = lecture). Un nom propre se lit mieux ainsi,
   et le changement de fonte le distingue du titre sans 4e colonne ni sous-ligne. */
.fs .dir-row.cv .curator{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-weight:400;font-size:14px;color:#7a7a7a;}
/* blocs sans lieu (grants, publications) : le titre occupe toute la largeur → pas de vide à droite */
.fs .dirblock.full .dir-row.cv{grid-template-columns:64px 1fr;}
.fs .dir-row.pr{grid-template-columns:1fr minmax(230px,auto);}
.fs .dir-row .yr{color:#b0b0b0;}
.fs .dir-row .ve,.fs .dir-row .src{color:#8a8a8a;text-align:right;}
.fs .dir-row .curator{color:#8a8a8a;}
.fs .dir-row a{color:#0a2ed6;text-decoration:underline;text-underline-offset:2px;}
.fs .dir-row a:hover{color:#9fe700;}

/* ── responsive : téléphone / tablette étroite ── */
.fs-navtoggle{display:none;}
@media (max-width:760px){
  .fs-nav{position:fixed;inset:0 0 auto 0;width:auto;height:auto;flex-direction:row;align-items:center;
    justify-content:space-between;padding:13px 18px;background:#fafafa;border-bottom:1px solid #e3e3e3;
    overflow:visible;z-index:50;}
  .fs-nav .wm{margin-bottom:0;}
  .fs-navtoggle{display:block;border:0;background:transparent;cursor:pointer;
    font:13px/1 ui-monospace,"SF Mono",Menlo,Consolas,monospace;color:#0a2ed6;padding:6px 2px;}
  .fs-nav .ftree{display:none;position:absolute;top:100%;left:0;right:0;margin:0;
    padding:16px 18px 22px;background:#fafafa;border-bottom:1px solid #e3e3e3;
    max-height:78vh;overflow:auto;box-shadow:0 12px 26px rgba(0,0,0,.07);}
  .fs-nav.open .ftree{display:block;}
  .fs-nav .sweety,.fs-nav .upd{display:none;}

  .fs .page-content{padding:62px 18px 46px;}

  /* (pages « navigateur » : mise en page verrouillée gérée en ≤1180, voir plus bas) */

  /* pages info : pleine largeur, colonnes qui s'empilent */
  .fs .doc.read,.fs .doc.wide{max-width:none;}
  .fs .dir-row{padding-left:42px;}
  .fs .dir-row.cv{grid-template-columns:40px 1fr;}
  .fs .dir-row.cv .ve{grid-column:1 / -1;text-align:left;padding-top:1px;}
  .fs .dir-row.pr{grid-template-columns:1fr;}
  .fs .dir-row.pr .src{text-align:left;padding-top:1px;}
}

/* ── pages projet (fs-catalog), DESKTOP >1180px : page FIXE à la hauteur de l'écran.
   La liste de fichiers défile en interne (utile à 50+ fichiers), l'aperçu reste à côté.
   Scopé à .cat-wrap → n'affecte ni about/cv ni le feed d'accueil. */
@media (min-width:1181px){
  .fs .page-content:has(.cat-wrap){height:100vh;height:100dvh;overflow:hidden;padding-bottom:8.5rem;}
  .fs .page-content:has(.cat-wrap) > #fs-mount{height:100%;display:flex;flex-direction:column;min-height:0;}
  .fs .page-content:has(.cat-wrap) .cat-wrap{flex:1;min-height:0;display:flex;flex-direction:column;}
  .fs .page-content:has(.cat-wrap) .cat-cols{flex:1;min-height:0;align-items:stretch !important;grid-template-rows:minmax(0,1fr) !important;}
  .fs .page-content:has(.cat-wrap) .cat-index{min-height:0;height:100%;overflow-y:auto;overflow-x:hidden;padding-right:8px;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 34px),transparent 100%);
    mask-image:linear-gradient(to bottom,#000 calc(100% - 34px),transparent 100%);}
  /* scrollbar entièrement masquée — la liste reste défilable (molette / trackpad) */
  .fs .page-content:has(.cat-wrap) .cat-index::-webkit-scrollbar{width:0;height:0;display:none;}
  .fs .page-content:has(.cat-wrap) .cat-preview{min-height:0;height:100%;align-items:flex-start;overflow:auto;}
}

/* ── pages « navigateur de fichiers » (projet / activity / works), ≤1180px ──
   page VERROUILLÉE : l'aperçu reste fixe en haut, seule la liste défile.
   La hauteur vient de page-content (height:100dvh + son propre padding) → fonctionne que la nav
   soit en barre haute (téléphone) ou en colonne latérale (tablette). N'affecte pas about/cv (pas de .root/.cat-wrap). */
@media (max-width:1180px){
  .fs .page-content:has(.cat-wrap),
  .fs .page-content:has(.root){height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;}
  .fs .page-content:has(.cat-wrap) > #fs-mount{flex:1;min-height:0;display:flex;flex-direction:column;}
  .fs .page-content:has(.root) > .root{flex:1;min-height:0;display:flex;flex-direction:column;}

  /* projet (fs-catalog) */
  .fs .cat-wrap{flex:1;min-height:0;display:flex;flex-direction:column;margin-top:0 !important;}
  .fs .cat-cols{flex:1;min-height:0;display:flex !important;flex-direction:column;gap:0 !important;}
  .fs .cat-preview{order:-1;flex:0 0 auto;width:100%;align-self:stretch;height:min(44vh,340px);min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;background:#fafafa;margin-bottom:14px;}
  .fs .cat-index{flex:1 1 auto;width:100%;align-self:stretch;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;}
  /* aligne la colonne des marqueurs [EXH]/[DIR]/[IMG]… sur le bord gauche de l'image au-dessus */
  .fs .cat-index > div{padding-left:0 !important;}
  .fs .dirlist .row{padding-left:0;}
  /* aperçu : le média adopte son propre ratio à hauteur fixe → image entière, sans bandes ni rognage */
  .fs .cat-preview img,
  .fs .cat-preview video{width:auto !important;max-width:100% !important;height:min(30vh,230px) !important;object-fit:contain !important;}
  .fs .cat-preview iframe{max-height:min(30vh,230px) !important;}
  /* 3D : boîte ~carrée (sinon bande trop plate → l'objet paraît coupé/écrasé) */
  .fs .cat-preview model-viewer{width:min(30vh,230px) !important;height:min(30vh,230px) !important;max-width:100% !important;}
}

/* visionneuse — sur mobile, les flèches passent SOUS l'image (coins bas) au lieu de la chevaucher ;
   l'image est limitée à 86vh, l'espace du bas est donc libre.
   (la lightbox de fs-catalog est attachée au <body>, hors de .fs → pas de préfixe .fs) */
@media (max-width:760px){
  .fsx-lb .fsx-nav{top:auto !important;bottom:10px !important;transform:none !important;padding:10px 20px !important;}
  .fsx-lb .fsx-prev{left:4px !important;}
  .fsx-lb .fsx-next{right:4px !important;}
  .fsx-lb .fsx-count{left:50% !important;right:auto !important;bottom:18px !important;transform:translateX(-50%) !important;}
}

/* accessibilité : titre lisible par lecteur d'écran sans changer le visuel */
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* respect de « moins d'animations » (réglage système / OS) */
@media (prefers-reduced-motion: reduce){
  .fs-nav .sweety{animation:none !important;}
  .fs .stage .slide{transition:none !important;}
}