/* PEAU « THE CARIBOU LEDGER », le registre de camp (aventuretunilik.com, 17/09/2026)
   Trois gestes signature, chacun réutilisé au moins trois fois :
   1. LE TAMPON DE CAMP (.tl-stamp) : cachet à double filet et pointillés, rotation -3°, encre sang
      séché, petites capitales. Sur les cotes des lignes, la cote de la fiche, le sceau du colophon.
   2. LA ROSE DES VENTS (.tl-rose) : étoile à 8 branches en conic-gradient sur un carré de 1 rem,
      bleu nuit, rognée au cercle. Sur le mât, l'encart, la section réseau, la page perdue.
   3. LA TRACE DE TRAÎNEau (.tl-trail-link et les liens de titre) : double filet pointillé qui glisse
      sous le mot au survol. Sur les titres de ligne, les liens de la section réseau, le renvoi de log.
   Règle négative : aucun bleu ciel, aucun orange vif, aucun dégradé décoratif de fond. La seule
   conic-gradient du fichier DESSINE la rose des vents (geste 2), elle ne remplit aucune surface. */
:root {
  --tundra-lichen: #ece5d4; --ink: #23241f; --night-boreal: #1d2a38; --dried-blood: #8c2f2b;
  --caribou-tawny: #c8b58c; --frost-white: #f4f0e4; --moss: #3d5a44; --charcoal-smoke: #5c5a50;
  --titre-police: Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
  --texte-police: "Avenir Next", Avenir, "Segoe UI", "Trebuchet MS", sans-serif;
  --chiffre-police: Menlo, Consolas, "Liberation Mono", monospace;
  --travee: 74rem; --mesure: 68ch; --rythme: 1.55rem; --filet: 1px solid var(--caribou-tawny);
  --ratio-cover: 21 / 9; --ratio-card: 16 / 10; --ratio-rail: 4 / 3; --ratio-office: 2 / 1;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--tundra-lichen); color: var(--ink); font-family: var(--texte-police);
  font-size: clamp(1rem, .97rem + .16vw, 1.0625rem); line-height: 1.6; overflow-wrap: break-word;
  background-image: repeating-linear-gradient(to bottom, rgba(92,90,80,.055) 0 1px, transparent 1px 2rem); }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { font-family: var(--titre-police); line-height: 1.14; margin: 0 0 .6em; font-weight: 600; }
h1 { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.7rem); letter-spacing: -.005em; }
h3 { font-size: 1.12rem; }
p, ul, ol, dl, table, figure { margin: 0 0 var(--rythme); }
a { color: var(--moss); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--night-boreal); }
:focus-visible { outline: 2px solid var(--dried-blood); outline-offset: 2px; }
time { font-family: var(--chiffre-police); font-variant-numeric: tabular-nums; }
time[data-frost] { color: var(--night-boreal); }
.tl-skip { position: absolute; left: -9999px; background: var(--night-boreal); color: var(--frost-white); padding: .6rem 1rem; z-index: 30; }
.tl-skip:focus { left: .5rem; top: .5rem; }
.tl-band { width: min(100% - 2rem, var(--travee)); margin-inline: auto; }

/* geste 2 : la rose des vents */
.tl-rose { display: inline-block; width: 1rem; height: 1rem; border-radius: 50%;
  background: repeating-conic-gradient(var(--night-boreal) 0deg 4deg, transparent 4deg 45deg);
  -webkit-mask: radial-gradient(circle at 50% 50%, #000 26%, transparent 74%);
  mask: radial-gradient(circle at 50% 50%, #000 26%, transparent 74%); }

/* geste 1 : le tampon de camp */
.tl-stamp { display: inline-block; padding: .1rem .5rem .08rem; border: 2px solid var(--dried-blood);
  box-shadow: inset 0 0 0 2px var(--tundra-lichen), inset 0 0 0 3px var(--dried-blood);
  border-radius: 3px; transform: rotate(-3deg); color: var(--dried-blood); background: transparent;
  font-family: var(--chiffre-police); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.tl-stamp--seal { font-size: .66rem; padding: .18rem .6rem; }

/* geste 3 : la trace de traîneau */
.tl-trail-link, .tl-line__title a, .tl-mast__name, .tl-colophon__list a {
  text-decoration: none; border-bottom: 1px dotted var(--caribou-tawny); padding-bottom: 1px; }
.tl-trail-link:hover, .tl-line__title a:hover, .tl-colophon__list a:hover {
  color: var(--night-boreal); border-bottom: 1px dotted var(--night-boreal); box-shadow: 0 2px 0 -1px var(--caribou-tawny); }

/* mât */
.tl-mast { padding-top: 0; }
.tl-mast__rule { height: 6px; background: repeating-linear-gradient(to right, var(--night-boreal) 0 14px, var(--dried-blood) 14px 22px, var(--caribou-tawny) 22px 36px); }
.tl-mast__inner { width: min(100% - 2rem, var(--travee)); margin-inline: auto; padding: 1.4rem 0 1.1rem;
  display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; align-items: baseline; border-bottom: var(--filet); }
.tl-mast__seal { margin: 0; grid-row: 1 / span 2; align-self: start; padding-top: .35rem; }
.tl-mast__name { font-family: var(--titre-police); font-size: clamp(1.4rem, 1.1rem + 1.3vw, 2rem);
  text-transform: uppercase; letter-spacing: .11em; color: var(--night-boreal); }
.tl-mast__tagline { margin: 0; color: var(--charcoal-smoke); font-size: .875rem; font-style: italic; }
.tl-mast__nav { grid-column: 1 / -1; margin-top: .55rem; }
.tl-trail { display: flex; flex-wrap: wrap; gap: .2rem 1.35rem; list-style: none; margin: 0; padding: 0; }
.tl-trail__link { color: var(--charcoal-smoke); text-decoration: none; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.tl-trail__link:hover, .tl-trail__link[aria-current] { color: var(--dried-blood); }
.tl-trail__link[aria-current] { border-bottom: 2px solid var(--dried-blood); }

/* fil de piste */
.tl-crumb { padding: .85rem 0 0; }
.tl-crumb__list { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0; padding: 0;
  font-size: .78rem; letter-spacing: .07em; text-transform: uppercase; color: var(--charcoal-smoke); }
.tl-crumb__step + .tl-crumb__step::before { content: "›"; margin-right: .35rem; color: var(--caribou-tawny); }
.tl-crumb__link { color: var(--charcoal-smoke); text-decoration: none; }

/* préambule */
.tl-cover { width: min(100% - 2rem, var(--travee)); margin: 1.6rem auto 0; display: grid; gap: 1.2rem 2.6rem; }
.tl-cover__lede h1 { margin-bottom: .5rem; color: var(--night-boreal); }
.tl-cover__intro { font-size: 1.09rem; max-width: 46rem; }
.tl-head__lede, .tl-head__count { color: var(--charcoal-smoke); font-size: .9rem; }
.tl-entry__lede, .tl-office__lede { font-size: 1.14rem; font-family: var(--titre-police); font-style: italic; max-width: 44rem; }
.tl-tally { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin: 0; border-top: var(--filet); padding-top: .7rem; }
.tl-tally__row { display: flex; flex-direction: column-reverse; margin: 0; }
.tl-tally__label { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal-smoke); }
.tl-tally__figure { margin: 0; font-family: var(--chiffre-police); font-size: 1.5rem; color: var(--night-boreal); }
.tl-cover__plate { width: min(100% - 2rem, var(--travee)); margin: 1.8rem auto; }
.tl-cover__plate picture, .tl-entry__plate picture, .tl-office__plate picture { display: block; }
.tl-cover__plate img { aspect-ratio: var(--ratio-cover); object-fit: cover; width: 100%; }
.tl-cover__plate figcaption, .tl-entry__plate figcaption, .tl-office__plate figcaption,
.tl-line__plate figcaption { font-size: .78rem; color: var(--charcoal-smoke); padding-top: .4rem; font-style: italic; }
@media (min-width: 62rem) { .tl-cover { grid-template-columns: minmax(0, 2.1fr) minmax(16rem, 1fr); align-items: end; } }

/* un log : titre de section */
.tl-folio, .tl-log, .tl-other { width: min(100% - 2rem, var(--travee)); margin: 2.2rem auto 0; }
.tl-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; border-bottom: 3px double var(--caribou-tawny); padding-bottom: .4rem; margin-bottom: 1.1rem; }
.tl-head__title { margin: 0; font-size: 1.32rem; text-transform: uppercase; letter-spacing: .06em; color: var(--night-boreal); }
.tl-head__title a { color: inherit; text-decoration: none; }
.tl-head__lede { flex-basis: 100%; margin: 0; max-width: 52rem; }
.tl-head__count { margin: 0 0 0 auto; }
.tl-head--other { border-bottom-style: solid; border-bottom-width: 1px; }
.tl-head--other .tl-rose { margin-right: .5rem; }

/* la ligne du registre */
.tl-folio__grid { display: grid; gap: 1.6rem; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
.tl-line { display: flex; flex-direction: column; background: var(--frost-white); border: var(--filet); border-top: 3px solid var(--night-boreal); }
.tl-line__plate { margin: 0; }
.tl-line__plate img { aspect-ratio: var(--ratio-card); object-fit: cover; width: 100%; }
.tl-line__head { display: flex; align-items: center; gap: .6rem; padding: .7rem .9rem 0; }
.tl-line__log { font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal-smoke); text-decoration: none; }
.tl-line__sheet { padding: .55rem .9rem 0; flex: 1 1 auto; }
.tl-line__title { margin: 0 0 .4rem; font-size: 1.14rem; }
.tl-line__note { font-size: .92rem; color: var(--charcoal-smoke); margin: 0; }
.tl-line__foot { padding: .6rem .9rem .75rem; font-size: .8rem; color: var(--charcoal-smoke); }
.tl-log__stack { display: grid; gap: 1rem; }
.tl-line--rail { flex-direction: row; align-items: stretch; }
.tl-line--rail .tl-line__plate { flex: 0 0 190px; }
.tl-line--rail .tl-line__plate img { aspect-ratio: var(--ratio-rail); height: 100%; }
.tl-line--rail .tl-line__head { padding: .8rem 1rem 0 0; }
.tl-line--rail .tl-line__sheet { padding: .5rem 1rem 0 0; }
.tl-line--rail .tl-line__foot { padding: .6rem 1rem .8rem 0; }
.tl-log__more { margin: .9rem 0 0; font-family: var(--chiffre-police); font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; }
.tl-log__more .tl-trail-link::after { content: " ›"; }
@media (max-width: 34rem) {
  .tl-line--rail { flex-direction: column; }
  .tl-line--rail .tl-line__plate { flex-basis: auto; }
  .tl-line--rail .tl-line__head, .tl-line--rail .tl-line__sheet, .tl-line--rail .tl-line__foot { padding-right: .9rem; padding-left: .9rem; }
}

/* l'encart */
.tl-note { width: min(100% - 2rem, var(--travee)); margin: 2.2rem auto 0; }
.tl-note__inner { border: var(--filet); border-left: 5px solid var(--dried-blood); background: var(--frost-white); padding: 1.1rem 1.3rem; }
.tl-note__title { margin: 0 0 .4rem; font-size: 1.1rem; text-transform: uppercase; letter-spacing: .07em; }
.tl-note__text { margin: 0; color: var(--charcoal-smoke); }
.tl-note__inner .tl-rose { margin-right: .5rem; }

/* la section réseau */
.tl-other__list { list-style: none; margin: 0; padding: 0; border-top: 1px dotted var(--caribou-tawny); }
.tl-other__item { border-bottom: 1px dotted var(--caribou-tawny); padding: .85rem 0; font-style: italic; color: var(--charcoal-smoke); }
.tl-other__item p { margin: 0; }
@media (min-width: 58rem) { .tl-other__list { columns: 2; column-gap: 2.6rem; } .tl-other__item { break-inside: avoid; } }

/* onglets de rubrique */
.tl-tabs { padding: .5rem 0 0; }
.tl-tabs__list { display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; margin: 0; padding: 0; }
.tl-tabs__link { display: inline-block; padding: .25rem .7rem; border: var(--filet); background: var(--frost-white);
  color: var(--charcoal-smoke); text-decoration: none; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.tl-tabs__link--here { border-color: var(--dried-blood); color: var(--dried-blood); }

/* la fiche (article) */
.tl-entry, .tl-office { width: min(100% - 2rem, var(--travee)); margin: 1.6rem auto 0; }
.tl-entry__stamprow { display: flex; align-items: center; gap: .7rem; margin: 0 0 .5rem; }
.tl-entry__log { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal-smoke); text-decoration: none; }
.tl-entry__head h1, .tl-office__head h1 { color: var(--night-boreal); }
.tl-entry__checked { font-size: .82rem; color: var(--charcoal-smoke); }
.tl-entry__plate, .tl-office__plate { margin: 1.5rem 0; }
.tl-entry__plate img { aspect-ratio: var(--ratio-cover); object-fit: cover; width: 100%; }
.tl-office__plate img { aspect-ratio: var(--ratio-office); object-fit: cover; width: 100%; }
.tl-entry__duo { display: grid; gap: 1.6rem 2.6rem; }
.tl-entry__body { max-width: var(--mesure); counter-reset: repere; }
@media (min-width: 66rem) { .tl-entry__duo { grid-template-columns: minmax(0, 1fr) minmax(15rem, 19rem); } }
.tl-entry__body > p:first-of-type::first-letter { float: left; font-family: var(--titre-police); font-size: 3.1rem;
  line-height: .84; padding: .06em .12em 0 0; color: var(--night-boreal); }
.tl-entry__body h2 { counter-increment: repere; font-size: 1.32rem; margin-top: 1.7rem; border-top: 1px dotted var(--caribou-tawny); padding-top: .55rem; }
.tl-entry__body h2::before { content: counter(repere, decimal-leading-zero) " · "; font-family: var(--chiffre-police); font-size: .8rem; color: var(--dried-blood); }
.tl-entry__body h3 { font-family: var(--titre-police); font-size: 1.06rem; color: var(--night-boreal); }
.tl-entry__body ul, .tl-entry__body ol { padding-left: 1.2rem; }
.tl-entry__body table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tl-entry__body th, .tl-entry__body td { text-align: left; padding: .45rem .6rem; border-bottom: 1px dotted var(--caribou-tawny); }
.tl-entry__body th { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--charcoal-smoke); }
.tl-entry__body td + td, .tl-entry__body th + th { font-family: var(--chiffre-police); font-variant-numeric: tabular-nums; }
.tl-entry__body blockquote { margin: 1.2rem 0; padding: .2rem 0 .2rem 1rem; border-left: 3px solid var(--caribou-tawny); color: var(--charcoal-smoke); font-style: italic; }
.tl-margin { align-self: start; }
@media (min-width: 66rem) { .tl-margin { position: sticky; top: 1.2rem; } }
.tl-margin__block { border-top: 3px double var(--caribou-tawny); padding-top: .5rem; margin-bottom: 1.3rem; }
.tl-margin__title { font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal-smoke); margin-bottom: .45rem; }
.tl-margin__list, .tl-margin__src { list-style: none; margin: 0; padding: 0; font-size: .88rem; }
.tl-margin__list li, .tl-margin__src li { padding: .3rem 0; border-bottom: 1px dotted var(--caribou-tawny); }
.tl-margin__list a { text-decoration: none; color: var(--moss); }
.tl-margin__src a { font-family: var(--chiffre-police); font-size: .8rem; color: var(--charcoal-smoke); }
.tl-folio--neighbours .tl-line__plate img { aspect-ratio: var(--ratio-card); }

/* le bureau (pages de service) */
.tl-office__body { max-width: var(--mesure); }
.tl-office__body > p:first-of-type::first-letter { float: left; font-family: var(--titre-police); font-size: 3.1rem;
  line-height: .84; padding: .06em .12em 0 0; color: var(--night-boreal); }
.tl-office__body h2 { font-size: 1.28rem; margin-top: 1.6rem; border-top: 1px dotted var(--caribou-tawny); padding-top: .5rem; }

/* la page perdue */
.tl-lost { width: min(100% - 2rem, var(--travee)); margin: 3rem auto; }
.tl-lost__box { border: 2px solid var(--dried-blood); box-shadow: inset 0 0 0 3px var(--tundra-lichen), inset 0 0 0 4px var(--dried-blood); padding: 1.6rem 1.4rem; max-width: 40rem; }
.tl-lost__rose { margin: 0 0 .5rem; }
.tl-lost__title { margin-bottom: .4rem; color: var(--night-boreal); }
.tl-lost__text { color: var(--charcoal-smoke); }

/* le colophon */
.tl-colophon { margin-top: 3.2rem; border-top: 6px solid var(--night-boreal); background: var(--frost-white); }
.tl-colophon__inner { width: min(100% - 2rem, var(--travee)); margin-inline: auto; padding: 1.6rem 0 1rem;
  display: grid; gap: 1.4rem 2.4rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.tl-colophon__seal { margin: 0 0 .6rem; }
.tl-colophon__text, .tl-colophon__note { font-size: .9rem; color: var(--charcoal-smoke); }
.tl-colophon__note { font-style: italic; }
.tl-colophon__title { font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--charcoal-smoke); }
.tl-colophon__list { list-style: none; margin: 0; padding: 0; font-size: .92rem; }
.tl-colophon__list li { padding: .25rem 0; }
.tl-colophon__clear { clear: both; }
.tl-colophon__line { width: min(100% - 2rem, var(--travee)); margin: 0 auto; padding: .8rem 0 1.2rem; border-top: var(--filet);
  font-family: var(--chiffre-police); font-size: .78rem; color: var(--charcoal-smoke); }