/*
  ============================================================
  MERITLY - LA MARGE, POSEE PAR-DESSUS
  Les pages qui ne sont ni sur le socle public ni dans l'app
  (candidats, tests, onboarding, avis, ecrans d'administration
  annexes) gardent leurs styles. Cette feuille vient apres, et
  leur donne le vocabulaire decide le 2026-09-28 : la regle rouge,
  la chasse fixe, plus rien d'arrondi, des boutons tampons, pas de
  halo. Elle ne connait pas leurs jetons : elle travaille avec
  --m-encre (l'encre de la page, noire sur clair, blanche sur
  sombre) que chaque page fixe dans une ligne de style.
  Source : ce fichier ; docs/outils-site.py le hache en marge-<sha>.css.
  ============================================================
*/
:root{
  --m-encre:#141414;
  --m-rouge:#e5202a;
  --m-display:"Funnel Display","Funnel Sans",system-ui,sans-serif;
  --m-sans:"Funnel Sans",system-ui,sans-serif;
  --m-mono:"Fragment Mono",ui-monospace,Menlo,Consolas,monospace;
  --m-ease:cubic-bezier(.22,.61,.36,1);
  --m-marge-x:max(14px,calc((100vw - 1100px) / 2 - 48px));
}

/* La police. */
body,button,input,select,textarea{font-family:var(--m-sans)!important}
h1,h2,h3,[class*="title"]:not(input):not(textarea),[class*="titre"]{font-family:var(--m-display)!important;letter-spacing:-.035em;font-weight:800!important}
[class*="eyebrow"],[class*="kicker"],[class*="badge"],[class*="tag"]:not([class*="tagline"]),[class*="chip"],[class*="step"],[class*="etape"],[class*="meta"],[class*="count"],[class*="date"],[class*="num"],[class*="mono"],kbd,code{
  font-family:var(--m-mono)!important;font-weight:400!important;letter-spacing:.04em}

/* La marge : la regle rouge, fixe, a gauche du contenu. */
body::before{content:"";position:fixed;top:0;bottom:0;left:var(--m-marge-x);width:2px;background:var(--m-rouge);opacity:.85;z-index:2147483000;pointer-events:none}

/* Plus rien d'arrondi. */
button,input,select,textarea,a[class*="btn"],[class*="btn"],[class*="card"],[class*="box"],[class*="panel"],[class*="modal"],[class*="banner"],[class*="teaser"],
[class*="badge"],[class*="pill"],[class*="tag"],[class*="chip"],[class*="avatar"],[class*="toast"],[class*="field"],[class*="input"],[class*="select"],[class*="option"],
[class*="tile"],[class*="cell"],[class*="row"],[class*="item"],[class*="bar"],[class*="progress"],[class*="track"],[class*="menu"],[class*="drop"],[class*="popover"],[class*="tooltip"],
[class*="section"],[class*="bloc"],[class*="block"],[class*="hero"],[class*="cta"],[class*="logo-icon"],img,video{border-radius:2px!important}
/* Ce qui doit rester rond : les cases a cocher rondes, les interrupteurs, les points. */
input[type=radio],[class*="switch"],[class*="toggle"] i,[class*="dot"],[class*="point"],[class*="spinner"],[class*="loader"]{border-radius:999px!important}

/* Plus de halo, plus de lueur, plus de verre. */
[class*="glow"],[class*="halo"],[class*="orb"],[class*="blob"],[class*="aurora"],[class*="noise"]{display:none!important}
body{background-image:none!important}
[class*="card"],[class*="box"],[class*="panel"],[class*="modal"],[class*="teaser"],[class*="hero"]{box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Les tampons : un bord d'encre, une ombre dure, ils s'enfoncent. */
button:not([class*="icon"]):not([class*="close"]):not([class*="toggle"]):not([class*="switch"]):not([class*="tab"]):not([class*="nav"]):not([aria-label]),
a[class*="btn"]:not([class*="icon"]),[class*="btn-primary"],[class*="btn-secondary"],[class*="btn-outline"],[class*="rally-btn"],[class*="ca-btn"],[class*="mi-btn"]{
  border:1.5px solid var(--m-encre)!important;box-shadow:2px 2px 0 var(--m-encre)!important;border-radius:2px!important;
  transition:transform .12s var(--m-ease),box-shadow .12s var(--m-ease),background .15s ease,color .15s ease!important}
button:not([class*="icon"]):not([class*="close"]):not([class*="toggle"]):not([class*="switch"]):not([class*="tab"]):not([class*="nav"]):not([aria-label]):hover,
a[class*="btn"]:not([class*="icon"]):hover,[class*="btn-primary"]:hover,[class*="btn-secondary"]:hover,[class*="btn-outline"]:hover,[class*="rally-btn"]:hover{
  transform:translate(-1px,-1px)!important;box-shadow:3px 3px 0 var(--m-encre)!important}
button:not([class*="icon"]):not([class*="close"]):not([class*="toggle"]):not([class*="switch"]):not([class*="tab"]):not([class*="nav"]):not([aria-label]):active,
a[class*="btn"]:not([class*="icon"]):active,[class*="btn-primary"]:active,[class*="btn-secondary"]:active,[class*="btn-outline"]:active,[class*="rally-btn"]:active{
  transform:translate(2px,2px)!important;box-shadow:0 0 0 var(--m-encre)!important}
button:disabled,[class*="btn"]:disabled,[aria-disabled="true"]{opacity:.42;transform:none!important;box-shadow:none!important;cursor:not-allowed}

/* Les champs : un bord, pas d'ombre, le focus a l'encre. */
input:not([type=radio]):not([type=checkbox]),select,textarea{box-shadow:none!important}
input:not([type=radio]):not([type=checkbox]):focus,select:focus,textarea:focus{outline:none;box-shadow:none!important;border-color:var(--m-encre)!important}

/* Les etats. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--m-rouge)!important;outline-offset:3px!important}
:focus:not(:focus-visible){outline:none}
::selection{background:rgba(229,32,42,.16)}
button,a,label{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}
@media (max-width:900px){:root{--m-marge-x:8px}}
