/* ══════════════════════════════════════════════════════════════════════════
   tigrebois.fr — base.css
   Reset moderne, polices auto-hébergées, typographie et styles d'élément.
   Dépend de tokens.css, qui doit être chargé AVANT cette feuille.
   Propriétaire du fichier : agent Fondation CSS.
   ══════════════════════════════════════════════════════════════════════════ */

/* ══ 1. POLICES ═══════════════════════════════════════════════════════════
   Cinq blocs pour quatre fichiers woff2, tous servis depuis /assets/fonts/ :
   aucune requête vers un CDN. Inter est découpée en deux blocs (latin et
   latin étendu) avec
   les plages Unicode de Google Fonts : le navigateur ne télécharge le fichier
   latin-ext que si la page contient réellement ces caractères.
   ═══════════════════════════════════════════════════════════════════════ */

/* Titres — variable font, axes wght 400→700 et opsz 8→45. */
@font-face{
  font-family:'Cal Sans';
  src:url('/assets/fonts/CalSans-var.woff2') format('woff2-variations'),
      url('/assets/fonts/CalSans-var.woff2') format('woff2');
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}

/* Texte courant — latin. */
@font-face{
  font-family:'Inter';
  src:url('/assets/fonts/Inter-var-latin.woff2') format('woff2-variations'),
      url('/assets/fonts/Inter-var-latin.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC,
                U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Texte courant — latin étendu (chargé à la demande seulement). */
@font-face{
  font-family:'Inter';
  src:url('/assets/fonts/Inter-var-latin-ext.woff2') format('woff2-variations'),
      url('/assets/fonts/Inter-var-latin-ext.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Gothique — RÉSERVÉE au mot-marque « Tigre Bois » et aux initiales d'avatar.
   Police fournie par le club : Old English Text MT (Monotype), sous-ensemblée
   en latin + accents français. Pour en changer un jour, il suffit de remplacer
   le fichier .woff2 et cette seule règle : le nom de famille est repris par
   --tb-font-gothique dans tokens.css, et nulle part ailleurs en dur. */
@font-face{
  font-family:'Old English Text MT';
  src:url('/assets/fonts/OldEnglishTextMT.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* Repli métrique de la gothique : évite un saut de mise en page brutal sur le
   mot-marque tant que OldEnglishTextMT.woff2 n'est pas arrivé. Aucune requête
   réseau, on ne s'appuie que sur des polices déjà présentes.
   Valeurs calées sur les métriques réelles du fichier fourni :
   ascendante 86,1 %, descendante 13,9 %, largeur moyenne des capitales
   0,788 em — soit environ 116 % de celle d'un Times New Roman. */
@font-face{
  font-family:'Gothique secours';
  src:local('Times New Roman'), local('Georgia'), local('Times');
  font-weight:400;
  font-style:normal;
  size-adjust:116%;
  ascent-override:86%;
  descent-override:14%;
  line-gap-override:0%;
}


/* ══ 2. RESET ═════════════════════════════════════════════════════════════ */

*,*::before,*::after{ box-sizing:border-box; }

/* Marges par défaut supprimées : tout le rythme vertical est explicite. */
html,body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd,ol,ul,pre,fieldset,legend{
  margin:0;
}

/* Les listes porteuses d'une classe sont mises en forme par le site et perdent
   leurs puces ; les listes de contenu rédactionnel les gardent (voir § 3). */
ul[class],ol[class]{ list-style:none; padding:0; }

html{
  font-size:100%;                       /* on respecte la taille choisie par l'utilisateur */
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
  /* Une ancre ne doit jamais se retrouver cachée sous le header collant. */
  scroll-padding-top:calc(var(--tb-header-h) + var(--tb-e5));
  -moz-tab-size:2;
  tab-size:2;
}

body{
  font-family:var(--tb-font-texte);
  font-size:var(--tb-t-corps);
  font-weight:400;
  line-height:1.6;
  color:var(--tb-encre);
  background-color:var(--tb-ivoire);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-synthesis-weight:none;           /* pas de faux gras sur une variable font */
}

/* Médias : blocs, jamais plus larges que leur conteneur, ratio conservé. */
img,picture,video,canvas,svg,iframe{
  display:block;
  max-width:100%;
}
img,video{ height:auto; }
svg{ fill:currentColor; }

/* Contrôles de formulaire : ils héritent de la police et de la taille. */
input,button,textarea,select,optgroup{
  font:inherit;
  color:inherit;
  letter-spacing:inherit;
}
button,[type='button'],[type='submit'],[type='reset']{
  background:none;
  border:0;
  padding:0;
  cursor:pointer;
  text-align:inherit;
  -webkit-appearance:none;
  appearance:none;
}
button:disabled,[type='button']:disabled,[type='submit']:disabled{
  cursor:not-allowed;
}
textarea{ resize:vertical; }

/* Évite les débordements de mots très longs (noms de parcours, URL). */
p,li,dd,dt,figcaption,h1,h2,h3,h4,h5,h6{ overflow-wrap:break-word; }


/* ══ 3. TYPOGRAPHIE DE BASE ═══════════════════════════════════════════════ */

h1,h2,h3,h4,h5,h6{
  font-family:var(--tb-font-titre);
  font-variation-settings:'wght' 600;
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.01em;
  color:var(--tb-vert);
  text-wrap:balance;
}
h1{ font-size:var(--tb-t-h1); }
h2{ font-size:var(--tb-t-h2); }
h3{ font-size:var(--tb-t-h3); }
h4{ font-size:1.125rem; }
h5{ font-size:1rem; }
h6{ font-size:var(--tb-t-petit); letter-spacing:.04em; text-transform:uppercase; }

p{ text-wrap:pretty; }
p + p{ margin-top:var(--tb-e4); }

strong,b{ font-weight:600; }
em,i{ font-style:italic; }
small{ font-size:var(--tb-t-petit); }

/* Le mot-marque : seule utilisation autorisée de la gothique. */
.tb-gothique{
  font-family:var(--tb-font-gothique);
  font-weight:400;
  letter-spacing:.01em;
}

/* Liens : soulignement fin, décalé, qui s'épaissit au survol. */
a{
  color:var(--tb-vert);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.18em;
  text-decoration-color:rgb(var(--tb-vert-clair-rvb) / .45);
  transition:color var(--tb-d0) var(--tb-ease),
             text-decoration-color var(--tb-d0) var(--tb-ease);
}
a:hover{
  color:var(--tb-vert-clair);
  text-decoration-color:var(--tb-orange);
}
a:active{ color:var(--tb-orange); }

/* Listes de contenu rédactionnel. */
ul:not([class]),ol:not([class]){
  padding-left:1.25em;
}
ul:not([class]) li + li,ol:not([class]) li + li{ margin-top:var(--tb-e2); }
ul:not([class])::marker,ul:not([class]) li::marker{ color:var(--tb-orange); }

dl{ margin:0; }
dt{ font-weight:600; }
dd{ margin-left:0; color:var(--tb-encre-70); }

blockquote{
  padding-left:var(--tb-e5);
  border-left:3px solid var(--tb-orange);
  color:var(--tb-encre-70);
}

hr{
  height:1px;
  border:0;
  margin-block:var(--tb-e8);
  background-image:var(--tb-lisere-encre);
}

figure{ margin:0; }
figcaption{
  margin-top:var(--tb-e3);
  font-size:var(--tb-t-petit);
  color:var(--tb-encre-70);
}

abbr[title]{ text-decoration:underline dotted; cursor:help; }
mark{ background:var(--tb-orange-pale); color:var(--tb-encre); padding:0 .15em; }

code,kbd,samp,pre{
  font-family:ui-monospace,'SFMono-Regular','Cascadia Mono','Consolas',monospace;
  font-size:.9em;
}
code{
  padding:.12em .38em;
  border-radius:var(--tb-r1);
  background:rgb(var(--tb-encre-rvb) / .06);
}
pre{
  padding:var(--tb-e5);
  border-radius:var(--tb-r2);
  background:rgb(var(--tb-encre-rvb) / .06);
  overflow-x:auto;
}
pre code{ padding:0; background:none; }

/* Tables nues : les tableaux de classement sont habillés dans components.css. */
table{
  width:100%;
  border-collapse:collapse;
  border-spacing:0;
}
caption{ text-align:left; }
th{ text-align:left; font-weight:600; }
th,td{ padding:var(--tb-e3) var(--tb-e4); vertical-align:middle; }

/* Le contenu d'un <details> se ferme et s'ouvre proprement. */
summary{ cursor:pointer; }
summary::-webkit-details-marker{ display:none; }


/* ══ 4. SÉLECTION, FOCUS, CIBLES ══════════════════════════════════════════ */

::selection{
  background:var(--tb-selection);
  color:var(--tb-encre);
}

/* Focus visible global : contour orange de 2 px, décalé de 2 px.
   Le contour reste visible sur fond vert comme sur fond ivoire. */
:focus-visible{
  outline:var(--tb-focus-trait) solid var(--tb-focus-couleur);
  outline-offset:var(--tb-focus-ecart);
  border-radius:var(--tb-r1);
}
/* On ne retire le contour qu'au clic souris, jamais au clavier. */
:focus:not(:focus-visible){ outline:none; }

/* Cible d'ancre mise en évidence une fraction de seconde. */
:target{ scroll-margin-top:calc(var(--tb-header-h) + var(--tb-e5)); }


/* ══ 5. UTILITAIRES DE BASE ═══════════════════════════════════════════════ */

/* Contenu réservé aux lecteurs d'écran. */
.tb-sr{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* Chiffres alignés en colonne : OBLIGATOIRE sur toute cellule numérique
   (classements, points, compteurs animés). */
.tb-num{
  font-variant-numeric:tabular-nums lining-nums;
  font-feature-settings:'tnum' 1,'lnum' 1;
}

/* Empêche une coupure au milieu d'un groupe « 1 234 pts ». */
.tb-insecable{ white-space:nowrap; }


/* ══ 6. MOUVEMENT RÉDUIT ══════════════════════════════════════════════════
   Règle absolue du projet : sous prefers-reduced-motion, tout se rend
   immédiatement à son état final. Aucune exception.
   ═══════════════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }

  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    transition-delay:0ms !important;
    scroll-behavior:auto !important;
  }
}