/* =========================================================================
   PEAU « clair-obscur » (bibliotheque du socle, 17/09/2026)
   Design porte depuis capitalcityvoices.com (direction 03 « Le Clair-Obscur
   de Lignee », squelette colonne-longue, juge 17/20 le 16/09/2026).
   Une salle de repetition apres extinction, eclairee par en dessous.
   Prefixe : cob-. Feuille unique. Aucune ressource distante, aucune police
   distante, aucun script. Seule peau SOMBRE de la bibliotheque.
   ---------------------------------------------------------------------
   NEGATIF 1 : le cuivre ne touche jamais un lien. Les liens sont bleu
   fleuve, toujours.
   NEGATIF 2 : aucune ombre floue. Les ombres sont des aplats decales de
   --cob-granit, offset entier, blur 0. Une salle sombre n a pas de halo.
   NEGATIF 3 : aucune surface plus claire que --cob-granit. Pas de plaque
   grise sur fond noir : le noir est une lumiere, pas un theme.
   NEGATIF 4 : jamais de gras dans les titres. La voix porte, elle ne crie pas.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. JETONS : ce qu un site regle, et rien d autre
   ------------------------------------------------------------------------- */
:root{
  color-scheme:dark;

  /* --- palette, 9 jetons : une cave apres extinction --------------------- */
  --cob-nuit:#100d0a;          /* fond de page : nuit de cave, et rien d autre */
  --cob-ardoise:#1c1712;       /* surfaces en retrait : pupitre, bande des pupitres */
  --cob-granit:#2a231b;        /* aplats decales, fond de l ours */
  --cob-craie:#ece7de;         /* texte courant et titres : craie chaude */
  --cob-acier:#a89e90;         /* encre secondaire : chapos, legendes, liens de l ours */
  --cob-fleuve:#71a4c4;        /* liens, au repos */
  --cob-fleuve-clair:#9dc7de;  /* lien survole, contour de focus */
  --cob-cuivre:#96602b;        /* filets, portee, bord de pupitre : JAMAIS du texte */
  --cob-cuivre-texte:#d09a5c;  /* le cuivre lisible : surtitres, dates, noms de pupitre */

  /* --- derives de la palette (ne pas regler seuls) ----------------------- */
  --cob-cuivre-voile:rgba(150, 96, 43, .16);
  --cob-filet:rgba(168, 158, 144, .34);
  --cob-filet-portee:rgba(214, 205, 190, .62);
  --cob-source-froide:rgba(113, 164, 196, .075);
  --cob-source-chaude:rgba(150, 96, 43, .06);

  /* --- polices : trois roles, piles systeme ------------------------------ */
  --cob-police-titre:"Avenir Next", Avenir, Optima, Candara, "Segoe UI", sans-serif;
  --cob-police-texte:"Iowan Old Style", "Palatino Linotype", Charter, Cambria, Georgia, serif;
  --cob-police-marque:"Avenir Next Condensed", "Roboto Condensed", "Arial Narrow", "Segoe UI", system-ui, sans-serif;

  /* --- mesure et rythme -------------------------------------------------- */
  --cob-mesure:64ch;           /* la piste de lecture */
  --cob-marge:8rem;            /* gouttiere gauche des marginalia */
  --cob-respiration:2.45rem;
  --cob-corps:clamp(1.02rem, .97rem + .22vw, 1.13rem);
  --cob-interligne:1.64;
  --cob-rayon:0;               /* angles vifs : les pupitres sont carres */
  --cob-filet-epaisseur:1px;

  /* --- ratios d image nommes --------------------------------------------- */
  --cob-ratio-plateau:21 / 9;
  --cob-ratio-pupitre:4 / 3;
  --cob-ratio-partition:3 / 4;
}

/* -------------------------------------------------------------------------
   2. Remise a plat
   ------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
body{
  margin:0;
  /* deux sources de plateau tres sourdes : une froide en haut a gauche, une chaude a droite */
  background:
    radial-gradient(90% 58% at 22% 0%, var(--cob-source-froide), transparent 62%),
    radial-gradient(70% 52% at 84% 12%, var(--cob-source-chaude), transparent 66%),
    var(--cob-nuit);
  color:var(--cob-craie);font-family:var(--cob-police-texte);
  font-size:var(--cob-corps);line-height:var(--cob-interligne);
  overflow-x:hidden;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--cob-police-titre);font-weight:500;line-height:1.14;margin:0;letter-spacing:.005em}
p,ul,ol,figure,table,blockquote,dl,dd{margin:0}
a{color:var(--cob-fleuve);text-underline-offset:.18em}
a:hover,a:focus{color:var(--cob-fleuve-clair)}
:focus-visible{outline:2px solid var(--cob-fleuve-clair);outline-offset:3px}
strong{font-weight:600;color:var(--cob-craie)}
time{font-variant-numeric:tabular-nums lining-nums}
[hidden]{display:none !important}
[id]{scroll-margin-top:6rem}
main{padding-top:1.2rem}

.cob-evitement{
  position:absolute;left:-9999px;top:0;z-index:30;
  background:var(--cob-craie);color:var(--cob-nuit);
  padding:.7rem 1.1rem;font-family:var(--cob-police-marque);letter-spacing:.08em;
}
.cob-evitement:focus{left:.6rem;top:.6rem;color:var(--cob-nuit)}

/* -------------------------------------------------------------------------
   3. LE PLATEAU : colonne unique et gouttiere de marginalia
   ------------------------------------------------------------------------- */
.cob-plateau{width:min(100% - 2.2rem, var(--cob-mesure));margin-inline:auto;position:relative}
@media (min-width: 64rem){
  .cob-plateau{width:min(100% - 4rem, calc(var(--cob-mesure) + var(--cob-marge)));padding-left:var(--cob-marge)}
}
/* Chaque grande zone du plateau s ouvre sur un filet qui s eteint aux deux bouts. */
main .cob-plateau > * + *:not(.cob-portee):not(.cob-appel):not(.cob-pupitre)::before{
  content:"";display:block;height:1px;margin-bottom:calc(var(--cob-respiration) * .7);
  background:linear-gradient(90deg, transparent, var(--cob-filet) 18%, var(--cob-filet) 82%, transparent);
}
main .cob-plateau > .cob-portee + *::before{content:none}

/* -------------------------------------------------------------------------
   4. MANCHETTE collante, soulignement anime, menu replie sans script
   ------------------------------------------------------------------------- */
.cob-manchette{
  position:sticky;top:0;z-index:20;
  border-bottom:var(--cob-filet-epaisseur) solid var(--cob-filet);
  padding:.85rem 0 .8rem;margin-bottom:var(--cob-respiration);
  background:rgba(12, 15, 18, .86);
  -webkit-backdrop-filter:blur(20px) saturate(120%);backdrop-filter:blur(20px) saturate(120%);
}
.cob-manchette__interieur{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.6rem 1.4rem;position:relative}
.cob-enseigne{font-family:var(--cob-police-titre);font-size:1.24rem;letter-spacing:.01em;color:var(--cob-craie);text-decoration:none}
.cob-enseigne:hover,.cob-enseigne:focus{color:var(--cob-fleuve-clair)}
.cob-enseigne__mention{
  display:block;font-family:var(--cob-police-marque);font-size:.66rem;
  letter-spacing:.26em;text-transform:uppercase;color:var(--cob-acier);margin-top:.28rem;
}
.cob-manchette .cob-portee{margin-top:.55rem;height:16px}
.cob-boussole ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.4rem 1.3rem}
.cob-boussole a{
  font-family:var(--cob-police-marque);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cob-acier);text-decoration:none;padding-bottom:.22rem;
  background:linear-gradient(currentColor, currentColor) left bottom / 0% 1px no-repeat;
  transition:background-size .25s ease, color .18s ease;
}
.cob-boussole a:hover,.cob-boussole a:focus{color:var(--cob-fleuve-clair);background-size:100% 1px}
.cob-boussole a[aria-current]{color:var(--cob-craie);background-size:100% 1px;background-image:linear-gradient(var(--cob-cuivre), var(--cob-cuivre))}
.cob-menu-case{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.cob-menu-declencheur{
  display:none;font-family:var(--cob-police-marque);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cob-acier);border:1px solid var(--cob-filet);
  padding:.4rem .7rem;cursor:pointer;user-select:none;min-height:44px;line-height:1.9;
}
.cob-menu-case:focus-visible + .cob-menu-declencheur{outline:2px solid var(--cob-fleuve-clair);outline-offset:3px}
.cob-menu-declencheur::before{
  content:"";display:inline-block;width:.9rem;height:.55rem;margin-right:.5rem;
  background:repeating-linear-gradient(to bottom, var(--cob-acier) 0 1px, transparent 1px 4px);
}
@media (max-width: 52rem){
  .cob-menu-declencheur{display:inline-block}
  .cob-boussole ul{
    display:none;flex-direction:column;flex-wrap:nowrap;gap:0;
    position:absolute;left:0;right:0;top:100%;z-index:25;
    background:var(--cob-ardoise);border-bottom:1px solid var(--cob-filet);padding:.4rem 1.1rem .8rem;
  }
  .cob-boussole li{border-top:1px solid var(--cob-filet)}
  .cob-boussole li:first-child{border-top:0}
  .cob-boussole a{display:block;padding:.7rem 0 .6rem}
  .cob-menu-case:checked ~ ul{display:flex}
  .cob-menu-case:checked + .cob-menu-declencheur{color:var(--cob-craie);border-color:var(--cob-acier)}
}

/* -------------------------------------------------------------------------
   5. SIGNATURE A : la portee a quatre voix
   Quatre filets de 1 px qui s eteignent aux deux bouts ; le quatrieme,
   celui des basses qui portent l harmonie, est en cuivre.
   ------------------------------------------------------------------------- */
.cob-portee{
  height:22px;margin-block:1.35rem;
  background:repeating-linear-gradient(to bottom, var(--cob-filet-portee) 0 1px, transparent 1px 7px);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.cob-portee--cuivre{box-shadow:inset 0 22px 0 -21px var(--cob-cuivre)}
.cob-portee--fine{height:15px;background:repeating-linear-gradient(to bottom, var(--cob-filet-portee) 0 1px, transparent 1px 5px)}
.cob-portee--fine.cob-portee--cuivre{box-shadow:inset 0 15px 0 -14px var(--cob-cuivre)}
.cob-ouverture > .cob-portee:last-child,.cob-liminaire > .cob-portee:last-child{margin-bottom:.4rem}

/* -------------------------------------------------------------------------
   6. SIGNATURE B : la rampe de plateau
   Toute image est desaturee, assombrie, masquee en radial recentre bas,
   et posee sur un voile de cuivre : le feu vient d en bas.
   ------------------------------------------------------------------------- */
.cob-rampe{position:relative}
.cob-rampe > picture{display:block;position:relative;background:linear-gradient(to top, var(--cob-cuivre-voile), transparent 42%)}
.cob-rampe img{
  filter:grayscale(.28) contrast(1.06) brightness(.82);
  -webkit-mask-image:radial-gradient(132% 118% at 50% 56%, #000 54%, transparent 86%);
          mask-image:radial-gradient(132% 118% at 50% 56%, #000 54%, transparent 86%);
}
.cob-rampe figcaption{
  font-family:var(--cob-police-marque);font-size:.72rem;letter-spacing:.05em;color:var(--cob-acier);
  margin-top:.55rem;padding-left:.7rem;border-left:2px solid var(--cob-filet);max-width:60ch;
}
.cob-plage{margin:1.8rem 0 0}
.cob-plage img{height:clamp(220px, 38vh, 420px);object-fit:cover;width:100%}
.cob-bandeau{margin:1.8rem 0}
.cob-bandeau img{aspect-ratio:var(--cob-ratio-plateau);object-fit:cover;width:100%}
.cob-planche{margin:2.2rem 0}
.cob-planche img{aspect-ratio:var(--cob-ratio-pupitre);object-fit:cover;width:100%}

/* -------------------------------------------------------------------------
   7. SIGNATURE C : le pupitre
   Le cartouche d ardoise a filet cuivre qui tient ce qu on lit debout, vite.
   ------------------------------------------------------------------------- */
.cob-pupitre{
  background:var(--cob-ardoise);border-left:3px solid var(--cob-cuivre);
  padding:1.15rem 1.35rem 1.15rem 1.15rem;box-shadow:6px 6px 0 -1px var(--cob-granit);
}
/* Le troisieme role typographique : les capitales espacees cuivre. Surtitres, noms
   de pupitre, dates du flux. Jamais dans le corps, jamais sur un lien. */
.cob-pupitre-marque{
  font-family:var(--cob-police-marque);font-size:.68rem;font-weight:600;
  letter-spacing:.26em;text-transform:uppercase;color:var(--cob-cuivre-texte);
}
.cob-surtitre.cob-pupitre-marque{font-size:.72rem}
.cob-portion__titre.cob-pupitre-marque,.cob-sommaire__titre.cob-pupitre-marque,.cob-notes__titre.cob-pupitre-marque{color:var(--cob-acier)}

/* -------------------------------------------------------------------------
   8. OUVERTURE, LIMINAIRE, FIL
   ------------------------------------------------------------------------- */
.cob-liminaire{padding-top:.8rem}
.cob-ouverture{padding-block:clamp(2rem, 5vh, 3.6rem) 0}
.cob-surtitre{margin-bottom:.9rem}
.cob-surtitre a{color:var(--cob-fleuve);text-decoration:none;border-bottom:1px solid var(--cob-filet)}
.cob-surtitre a:hover,.cob-surtitre a:focus{color:var(--cob-fleuve-clair);border-bottom-color:currentColor}
.cob-titre-page{font-size:clamp(2rem, 1.5rem + 2.3vw, 3.15rem);letter-spacing:-.004em;margin-bottom:1rem;max-width:22ch;overflow-wrap:break-word}
.cob-chapo{font-size:clamp(1.1rem, 1.03rem + .42vw, 1.3rem);line-height:1.5;color:var(--cob-acier);margin-bottom:1.3rem}
.cob-chapo p{margin-bottom:.6rem}
.cob-signature{font-size:.86rem;color:var(--cob-acier);display:flex;flex-wrap:wrap;gap:.3rem .9rem;padding-bottom:1.5rem;margin-bottom:.4rem}
.cob-signature span::after{content:"\00B7";margin-left:.9rem;color:var(--cob-filet)}
.cob-signature span:last-child::after{content:"";margin:0}
.cob-fil{width:min(100% - 2.2rem, calc(var(--cob-mesure) + var(--cob-marge)));margin:0 auto 1.6rem}
@media (min-width: 64rem){ .cob-fil{width:min(100% - 4rem, calc(var(--cob-mesure) + var(--cob-marge)));padding-left:var(--cob-marge)} }
.cob-fil ol{
  list-style:none;display:flex;flex-wrap:wrap;gap:.3rem .55rem;padding:0;margin:0;
  font-family:var(--cob-police-marque);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cob-acier);
}
.cob-fil li + li::before{content:"/";margin-right:.55rem;color:var(--cob-filet)}
.cob-fil a{color:var(--cob-acier);text-decoration:none}
.cob-fil a:hover,.cob-fil a:focus{color:var(--cob-fleuve-clair)}
.cob-fil [aria-current]{color:var(--cob-craie)}

/* L edito : la voix du site, lettrine a filet cuivre */
.cob-edito{position:relative;margin-top:1.8rem}
.cob-edito p{max-width:var(--cob-mesure);margin-bottom:1.15rem}
.cob-lettrine::first-letter{
  float:left;font-family:var(--cob-police-titre);font-weight:500;font-size:3.1em;line-height:.82;
  padding:.06em .2em .02em 0;margin-right:.14em;color:var(--cob-craie);border-right:2px solid var(--cob-cuivre);
}

/* -------------------------------------------------------------------------
   9. LA PORTION : le recueil date, jamais de plaques
   ------------------------------------------------------------------------- */
.cob-portion{margin-bottom:var(--cob-respiration)}
.cob-portion__titre{padding-bottom:.55rem;border-bottom:1px solid var(--cob-filet);margin-bottom:1.3rem}
.cob-recueil{list-style:none;margin:0;padding:0}
.cob-entree{padding:1.6rem 0;position:relative}
.cob-entree:first-child{padding-top:.4rem}
/* la portee fine separe deux entrees du flux date */
.cob-recueil > .cob-entree + .cob-entree::before{
  content:"";display:block;height:15px;margin:-.4rem 0 1.4rem;grid-column:1 / -1;
  background:repeating-linear-gradient(to bottom, var(--cob-filet-portee) 0 1px, transparent 1px 5px);
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent);
}
.cob-entree__date{display:block;font-size:.68rem;margin-bottom:.5rem}
@media (min-width: 64rem){
  .cob-entree__date{position:absolute;left:calc(-1 * var(--cob-marge));top:2rem;width:calc(var(--cob-marge) - 1.6rem);text-align:right;margin:0}
  .cob-entree:first-child .cob-entree__date{top:.7rem}
}
.cob-entree__titre{font-size:clamp(1.24rem, 1.12rem + .6vw, 1.6rem);margin-bottom:.5rem;max-width:34ch}
.cob-entree__titre a{color:var(--cob-craie);text-decoration:none}
.cob-entree__titre a:hover,.cob-entree__titre a:focus{color:var(--cob-fleuve-clair);text-decoration:underline}
.cob-entree__amorce{color:var(--cob-acier);margin-bottom:.6rem;max-width:var(--cob-mesure)}
.cob-entree__pied{
  font-family:var(--cob-police-marque);font-size:.74rem;letter-spacing:.06em;color:var(--cob-acier);
  display:flex;flex-wrap:wrap;gap:.25rem .8rem;
}
.cob-entree__pied span + span::before{content:"\00B7";margin-right:.8rem;color:var(--cob-filet)}
.cob-entree--illustree{display:grid;grid-template-columns:7rem 1fr;column-gap:1rem;row-gap:.2rem;align-items:start}
.cob-entree--illustree > .cob-entree__date{grid-column:1 / -1}
.cob-entree--illustree > .cob-tuile{grid-column:1}
.cob-entree--illustree > .cob-entree__texte{grid-column:2;min-width:0}
.cob-tuile{margin:.15rem 0 0}
.cob-tuile img{aspect-ratio:var(--cob-ratio-partition);object-fit:cover;width:100%;height:auto}
.cob-tuile figcaption{
  font-size:.64rem;line-height:1.45;margin-top:.5rem;padding-left:.5rem;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
@media (min-width: 48rem){ .cob-entree--illustree{grid-template-columns:11rem 1fr;column-gap:1.5rem} }

/* -------------------------------------------------------------------------
   10. L IDEE : la bande des pupitres, retournee en pleine largeur
   ------------------------------------------------------------------------- */
.cob-appel{
  margin-inline:calc(50% - 50vw);margin-block:var(--cob-respiration);
  padding:clamp(2rem, 5vh, 3.6rem) max(1.2rem, calc(50vw - 50% ));
  background:var(--cob-ardoise);
}
@media (min-width: 64rem){
  .cob-appel{
    margin-left:calc(50% - 50vw - var(--cob-marge) / 2);
    margin-right:calc(50% - 50vw + var(--cob-marge) / 2);
    padding-left:max(1.2rem, calc(50vw - 33ch + var(--cob-marge) / 2));
    padding-right:max(1.2rem, calc(50vw - 33ch - var(--cob-marge) / 2));
  }
}
.cob-appel__surtitre{margin-bottom:.5rem}
.cob-appel__titre{font-size:clamp(1.6rem, 1.35rem + 1.1vw, 2.1rem);margin-bottom:1.2rem}
.cob-appel__intro{color:var(--cob-acier);max-width:var(--cob-mesure);margin-bottom:.4rem}
.cob-appel-pupitres{list-style:none;margin:0;padding:0}
.cob-appel-pupitres li{
  display:grid;grid-template-columns:12rem 9rem 1fr auto;align-items:center;gap:1.1rem;
  padding:.85rem 0;border-top:1px solid var(--cob-filet);
}
/* la derniere ligne boucle la metaphore : son filet est cuivre */
.cob-appel-pupitres li:last-child{border-top-color:var(--cob-cuivre)}
.cob-appel__tete{display:flex;align-items:center;gap:.75rem;min-width:0}
.cob-appel__nom{font-size:.76rem}
.cob-vignette-pupitre{margin:0;flex:none;width:3rem}
.cob-vignette-pupitre img{aspect-ratio:var(--cob-ratio-partition);object-fit:cover;width:100%}
.cob-appel__tessiture{font-family:var(--cob-police-marque);font-size:.8rem;letter-spacing:.08em;color:var(--cob-acier);font-variant-numeric:tabular-nums}
.cob-appel__role{color:var(--cob-craie);font-size:.96rem}
.cob-appel__lien{
  font-family:var(--cob-police-marque);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;border-bottom:1px solid var(--cob-filet);white-space:nowrap;
}
.cob-appel__lien:hover,.cob-appel__lien:focus{border-bottom-color:var(--cob-fleuve-clair)}
/* version reduite a une ligne : tete de rubrique et page introuvable */
.cob-appel--simple{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem 1rem;margin:1.6rem 0;padding:.7rem 0;
  border-top:1px solid var(--cob-filet);border-bottom:1px solid var(--cob-filet);font-size:.92rem;
}
.cob-appel--simple .cob-appel__role{color:var(--cob-acier);font-size:.92rem}
.cob-appel--simple a{
  font-family:var(--cob-police-marque);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;border-bottom:1px solid var(--cob-filet);margin-right:.8rem;
}
@media (max-width: 52rem){
  .cob-appel-pupitres li{grid-template-columns:1fr auto;grid-template-areas:"tete tess" "role lien";row-gap:.45rem}
  .cob-appel__tete{grid-area:tete}
  .cob-appel__tessiture{grid-area:tess;text-align:right}
  .cob-appel__role{grid-area:role}
  .cob-appel__lien{grid-area:lien}
}

/* -------------------------------------------------------------------------
   11. ENCART PUPITRE, TRIPLET, CAHIERS (section des autres salles)
   ------------------------------------------------------------------------- */
.cob-encart{margin:2.2rem 0;max-width:var(--cob-mesure)}
.cob-encart__titre{margin-bottom:.6rem}
.cob-encart p{color:var(--cob-acier);font-size:.95rem;margin-bottom:.6rem}
.cob-encart__sources{list-style:none;margin:0;padding:0;font-family:var(--cob-police-marque);font-size:.82rem;letter-spacing:.06em;color:var(--cob-acier)}
.cob-encart__sources li{padding:.3rem 0;border-top:1px dotted var(--cob-filet)}
.cob-encart__sources li:first-child{border-top:0}

.cob-triplet{margin:.6rem 0 1.6rem}
.cob-triplet dt{margin-top:.9rem}
.cob-triplet dt:first-child{margin-top:0}
.cob-triplet dd{margin:.3rem 0 0;color:var(--cob-acier);font-size:.95rem;overflow-wrap:anywhere}

.cob-cahiers{position:relative;margin-bottom:var(--cob-respiration)}
.cob-cahiers__phrase{color:var(--cob-acier);max-width:58ch;margin-bottom:.8rem}
.cob-cahiers__vide{font-style:italic;color:var(--cob-acier);font-size:.95rem;padding:.8rem 0;border-bottom:1px dotted var(--cob-filet)}
.cob-cahier-liste{list-style:none;margin:0;padding:0}
.cob-cahier{padding:1.05rem 0 1.15rem;border-bottom:1px dotted var(--cob-filet)}
.cob-cahier__compte{font-family:var(--cob-police-marque);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cob-acier)}
.cob-cahier p{margin:.4rem 0 0;font-size:.98rem;color:var(--cob-craie);max-width:58ch}

/* -------------------------------------------------------------------------
   12. LE CORPS LONG : lettrine, intertitres numerotes en gouttiere
   ------------------------------------------------------------------------- */
.cob-corps{counter-reset:cob-intertitre;padding-top:1.6rem}
.cob-corps p{margin-bottom:1.15rem;max-width:var(--cob-mesure)}
.cob-corps > ul,.cob-corps > ol{margin:0 0 1.5rem;padding-left:1.3rem;max-width:var(--cob-mesure)}
.cob-corps li{margin-bottom:.5rem}
.cob-corps li::marker{color:var(--cob-cuivre-texte)}
.cob-corps a{color:var(--cob-fleuve);text-decoration:underline}
.cob-corps a:hover,.cob-corps a:focus{color:var(--cob-fleuve-clair)}
.cob-corps > p:first-of-type::first-letter{
  float:left;font-family:var(--cob-police-titre);font-weight:500;font-size:3.5em;line-height:.82;
  padding:.06em .12em 0 0;color:var(--cob-fleuve-clair);
}
.cob-corps h2{
  font-size:clamp(1.38rem, 1.2rem + 1vw, 1.86rem);margin:2.5rem 0 .9rem;padding-top:1.1rem;
  border-top:1px solid var(--cob-filet);position:relative;max-width:var(--cob-mesure);scroll-margin-top:6.5rem;
}
.cob-corps h2::before{
  counter-increment:cob-intertitre;content:counter(cob-intertitre, decimal-leading-zero);
  display:block;font-family:var(--cob-police-marque);font-weight:400;font-size:.78rem;letter-spacing:.16em;
  color:var(--cob-fleuve);margin-bottom:.45rem;font-variant-numeric:tabular-nums lining-nums;
}
@media (min-width: 64rem){
  .cob-corps h2::before{position:absolute;left:calc(-1 * var(--cob-marge));top:1.35rem;width:calc(var(--cob-marge) - 1.6rem);text-align:right;margin:0}
}
.cob-corps h3{font-family:var(--cob-police-marque);font-size:.95rem;letter-spacing:.06em;text-transform:uppercase;margin:1.9rem 0 .7rem;color:var(--cob-craie)}
/* l exergue : la phrase qu on retient, cassee vers la gouttiere */
.cob-corps blockquote{
  margin:2.1rem 0;padding-left:1.1rem;border-left:3px solid var(--cob-cuivre);
  font-family:var(--cob-police-titre);font-size:clamp(1.18rem, 1.08rem + .55vw, 1.5rem);line-height:1.32;color:var(--cob-craie);
}
.cob-corps blockquote p{margin:0}
@media (min-width: 64rem){
  .cob-corps blockquote{margin-left:calc(-1 * var(--cob-marge));padding-left:0;border-left:0;border-top:2px solid var(--cob-cuivre);padding-top:.9rem;max-width:calc(var(--cob-mesure) + 4rem)}
}
.cob-corps table{border-collapse:collapse;width:100%;font-family:var(--cob-police-marque);font-size:.84rem;margin:2rem 0;display:block;overflow-x:auto}
.cob-corps th,.cob-corps td{text-align:left;padding:.6rem .9rem;border-bottom:1px solid var(--cob-filet);vertical-align:top}
.cob-corps thead th{background:var(--cob-ardoise);color:var(--cob-craie);font-weight:600}
.cob-corps--service h2::before{content:none}

/* -------------------------------------------------------------------------
   13. SOMMAIRE A POINTILLES, NOTES, SUITE
   ------------------------------------------------------------------------- */
.cob-sommaire{margin-top:2.8rem;padding:1.4rem 0 0;border-top:1px solid var(--cob-filet);max-width:var(--cob-mesure)}
.cob-sommaire__titre{margin-bottom:1rem}
.cob-sommaire ol{list-style:none;margin:0;padding:0;counter-reset:cob-ligne}
.cob-sommaire li{margin-bottom:.55rem}
.cob-sommaire a{
  display:grid;grid-template-columns:auto minmax(0, auto) minmax(1.5rem, 1fr) auto;align-items:baseline;gap:.55rem;
  text-decoration:none;color:var(--cob-craie);font-family:var(--cob-police-marque);font-size:.88rem;letter-spacing:.04em;
}
.cob-sommaire a:hover,.cob-sommaire a:focus{color:var(--cob-fleuve-clair)}
.cob-sommaire a::before{counter-increment:cob-ligne;content:counter(cob-ligne, decimal-leading-zero);color:var(--cob-fleuve);font-size:.78rem;letter-spacing:.08em}
.cob-pointille{border-bottom:1px dotted var(--cob-filet);transform:translateY(-.28em)}
.cob-sommaire__page{color:var(--cob-acier);font-size:.78rem}

.cob-notes{margin-top:3rem;padding-top:1.2rem;border-top:1px solid var(--cob-filet);max-width:var(--cob-mesure)}
.cob-notes__titre{margin-bottom:1rem}
.cob-notes ol{margin:0;padding-left:1.35rem;font-size:.92rem;color:var(--cob-acier)}
.cob-notes li{margin-bottom:.75rem;overflow-wrap:anywhere}
.cob-notes li::marker{font-family:var(--cob-police-marque);color:var(--cob-fleuve)}

.cob-suite{margin-top:2.6rem}
.cob-suite ul{list-style:none;margin:0;padding:0}
.cob-suite li{padding:.7rem 0;border-bottom:1px dotted var(--cob-filet);display:flex;gap:1rem;align-items:flex-start}
.cob-tuile-suite{margin:0;flex:0 0 4.2rem}
.cob-tuile-suite img{aspect-ratio:var(--cob-ratio-partition);object-fit:cover;width:100%}
.cob-suite a{font-family:var(--cob-police-titre);font-weight:500;font-size:1.05rem;color:var(--cob-craie);text-decoration:none}
.cob-suite a:hover,.cob-suite a:focus{color:var(--cob-fleuve-clair);text-decoration:underline}
.cob-suite .cob-pupitre-marque{display:block;font-size:.64rem;color:var(--cob-acier);margin-bottom:.2rem}

/* -------------------------------------------------------------------------
   14. L OURS : le pied qui prouve
   ------------------------------------------------------------------------- */
.cob-ours{margin-top:calc(var(--cob-respiration) * 1.4);padding:0 0 3rem;font-size:.92rem;color:var(--cob-acier);background:var(--cob-granit)}
.cob-ours .cob-plateau{padding-top:1.5rem}
.cob-ours .cob-portee{margin:0 0 1.8rem}
.cob-ours__nom{font-family:var(--cob-police-titre);font-weight:500;font-size:1.08rem;color:var(--cob-craie);margin-bottom:.5rem}
.cob-ours p{margin-bottom:.9rem;max-width:var(--cob-mesure)}
.cob-ours ul{
  list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;
  font-family:var(--cob-police-marque);font-size:.76rem;letter-spacing:.08em;
}
/* sur le granit, le lien de l ours passe a l acier : le bleu fleuve n y tient pas 4,5:1 */
.cob-ours a{color:var(--cob-acier);text-decoration:none;border-bottom:1px solid var(--cob-filet)}
.cob-ours a:hover,.cob-ours a:focus{color:var(--cob-craie);border-bottom-color:var(--cob-craie)}
.cob-mention{font-size:.82rem;letter-spacing:.03em}
.cob-colophon{font-family:var(--cob-police-marque);font-size:.74rem;letter-spacing:.06em;color:var(--cob-acier)}

/* -------------------------------------------------------------------------
   15. Sous la gouttiere : telephone a 360 px
   ------------------------------------------------------------------------- */
@media (max-width: 63.99rem){
  main .cob-plateau,.cob-ours .cob-plateau{width:min(100% - 2.4rem, var(--cob-mesure))}
  body{background:radial-gradient(90% 58% at 22% 0%, var(--cob-source-froide), transparent 62%), var(--cob-nuit)}
  .cob-rampe img{
    -webkit-mask-image:radial-gradient(132% 118% at 50% 60%, #000 54%, transparent 86%);
            mask-image:radial-gradient(132% 118% at 50% 60%, #000 54%, transparent 86%);
  }
  .cob-pupitre{box-shadow:4px 4px 0 -1px var(--cob-granit)}
  .cob-appel{padding-inline:max(1.2rem, calc(50vw - 50%))}
}
@media (max-width: 30rem){
  .cob-entree--illustree{grid-template-columns:5.2rem 1fr;column-gap:.85rem}
  .cob-appel-pupitres li{grid-template-columns:1fr;grid-template-areas:"tete" "tess" "role" "lien"}
  .cob-appel__tessiture{text-align:left}
  .cob-sommaire a{grid-template-columns:auto minmax(0, 1fr);row-gap:.1rem}
  .cob-pointille,.cob-sommaire__page{display:none}
  .cob-pupitre{padding:1rem 1rem 1rem .9rem}
}

/* -------------------------------------------------------------------------
   16. Impression : la salle rallume la lumiere
   ------------------------------------------------------------------------- */
@media print{
  :root{
    --cob-nuit:#ffffff;--cob-ardoise:#f4f4f4;--cob-granit:#e0e0e0;--cob-craie:#000000;--cob-acier:#333333;
    --cob-fleuve:#1a1a1a;--cob-fleuve-clair:#1a1a1a;--cob-cuivre:#444444;--cob-cuivre-texte:#444444;
    --cob-filet:#999999;--cob-filet-portee:#777777;
  }
  body{background:#ffffff}
  .cob-boussole,.cob-suite,.cob-evitement,.cob-fil,.cob-menu-declencheur{display:none}
  .cob-rampe img{filter:none;mask-image:none;-webkit-mask-image:none}
}