/* Pocketbot, pages de texte (confidentialité, conditions, assistance, page introuvable).
   Mêmes jetons que la page d’accueil : deux couleurs, inversées entre clair et sombre. Aucun script. */
:root{--canvas:#F4EFE8;--ink:#0B0B0C;--m:24px;--ease-out:cubic-bezier(.16,1,.3,1)}
@media (min-width:600px){ :root{--m:40px} }
@media (min-width:960px){ :root{--m:64px} }
@media (prefers-color-scheme:dark){ :root{--canvas:#09090A;--ink:#F1EBE2} }

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 1.0625rem/1.6 "Inter",system-ui,-apple-system,"Segoe UI",sans-serif;font-kerning:normal;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.24em;text-decoration-thickness:1.5px;overflow-wrap:anywhere;transition:text-underline-offset .25s var(--ease-out)}
a:hover{text-underline-offset:.34em}
a:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}

.bar,.foot,main{padding-left:max(var(--m), env(safe-area-inset-left));padding-right:max(var(--m), env(safe-area-inset-right))}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:max(16px, env(safe-area-inset-top));padding-bottom:16px}
.bar a{display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.bar .brand{font:600 1.125rem/1 "Inter Display","Inter",sans-serif;letter-spacing:-.01em;text-decoration:none}

main{padding-top:clamp(24px, 6vh, 72px);padding-bottom:clamp(56px, 10vh, 112px)}
main > *{max-width:46rem}
main > .table{max-width:68rem}
h1{margin:0 0 24px;font:700 clamp(2.25rem, 1.6rem + 3.2vw, 3.75rem)/1 "Inter Display","Inter",sans-serif;letter-spacing:-.03em;text-wrap:balance}
h2{margin:56px 0 12px;font:600 1.375rem/1.2 "Inter Display","Inter",sans-serif;letter-spacing:-.015em}
p,ul{margin:0 0 16px;text-wrap:pretty}
ul{padding-left:1.25em}
li{margin-bottom:8px}
strong{font-weight:600}
h1 + p{opacity:.72}

/* Tableau des connexions : en colonnes sur grand écran, une fiche par ligne sur téléphone. */
.table{margin:24px 0}
table{width:100%;border-collapse:collapse;font-size:.9375rem;line-height:1.5}
th,td{padding:12px 16px 12px 0;text-align:left;vertical-align:top;border-top:1px solid color-mix(in srgb, currentColor 22%, transparent)}
th{font-weight:600}
@media (max-width:759px){
  thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  tr{display:block;padding:16px 0;border-top:1px solid color-mix(in srgb, currentColor 22%, transparent)}
  td{display:block;padding:0 0 12px;border:0}
  td::before{content:attr(data-label);display:block;font-weight:600;font-size:.8125rem;opacity:.72}
}

.foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 28px;padding-top:24px;padding-bottom:max(32px, env(safe-area-inset-bottom));border-top:1px solid color-mix(in srgb, currentColor 22%, transparent);font-size:.9375rem}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 28px}
.foot a{display:inline-flex;align-items:center;min-height:44px;font-weight:500}
.foot p{margin:0;opacity:.72}

/* Page introuvable : deux langues à la suite. */
p + h1{margin-top:48px}