/* Vitrine du second cerveau — reprise du front Zite « Cerveau » (mfngktmlya), 18/10/2026 */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 200; font-display: swap; src: url(/assets/poppins-200.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/poppins-400.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url(/assets/poppins-500.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/poppins-600.woff2) format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url(/assets/poppins-700.woff2) format('woff2'); }

:root {
  --fond: hsl(220, 64%, 13%);
  --violet: #a78bfa;
  --verre: rgba(8, 8, 18, 0.45);
  --verre-bord: rgba(255, 255, 255, 0.14);
  --verre-ombre: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 8px 32px rgba(0, 0, 0, 0.4);
  --carte: rgba(12, 26, 53, 0.98);
  --police: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  background: var(--fond);
  color: #fff;
  font-family: var(--police);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior: none;
}
a { color: inherit; text-decoration: none; }
a:hover, a:focus { text-decoration: none; }
button { font-family: inherit; }
[hidden] { display: none !important; }

.ico { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }

/* ── Écran d'accueil ── */
.splash {
  position: fixed; inset: 0; z-index: 500;
  background: var(--fond);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 0 16px;
  transition: opacity .5s ease;
}
.splash.fin { opacity: 0; pointer-events: none; }
.splash-glow { position: absolute; width: 220px; height: 220px; background: radial-gradient(rgba(59,96,212,0.18) 0%, transparent 70%); filter: blur(50px); pointer-events: none; }
.splash-icon {
  width: 100px; height: 100px; border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 28px; position: relative; z-index: 1;
}
.splash-icon img { width: 75px; height: 75px; object-fit: contain; }
.splash-slogan {
  font-size: 11px; font-weight: 200; letter-spacing: 10px; text-transform: uppercase;
  color: rgba(255,255,255,0.45); position: relative; z-index: 1;
  text-align: center; line-height: 2; max-width: 100%;
}
@media (max-width: 480px) { .splash-slogan { letter-spacing: 6px; } }

/* ── Orbes de fond ── */
.orbs { position: fixed; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.orb { position: absolute; border-radius: 50%; }
.orb-1 { top: 8%; left: 12%; width: 520px; height: 520px; background: radial-gradient(circle, rgba(99,60,220,0.22) 0%, transparent 70%); filter: blur(48px); animation: orb-drift-1 22s ease-in-out infinite; }
.orb-2 { bottom: 10%; right: 18%; width: 640px; height: 640px; background: radial-gradient(circle, rgba(40,80,200,0.18) 0%, transparent 70%); filter: blur(60px); animation: orb-drift-2 30s ease-in-out infinite; }
.orb-3 { top: 30%; right: 5%; width: 380px; height: 380px; background: radial-gradient(circle, rgba(80,50,180,0.16) 0%, transparent 70%); filter: blur(40px); animation: orb-drift-3 18s ease-in-out infinite; }
@keyframes orb-drift-1 { 0%{transform:translate(0,0) scale(1);opacity:.38} 25%{transform:translate(60px,-40px) scale(1.08);opacity:.28} 50%{transform:translate(30px,70px) scale(.94);opacity:.42} 75%{transform:translate(-50px,20px) scale(1.06);opacity:.32} 100%{transform:translate(0,0) scale(1);opacity:.38} }
@keyframes orb-drift-2 { 0%{transform:translate(0,0) scale(1);opacity:.22} 30%{transform:translate(-70px,50px) scale(1.12);opacity:.16} 60%{transform:translate(40px,-60px) scale(.92);opacity:.26} 100%{transform:translate(0,0) scale(1);opacity:.22} }
@keyframes orb-drift-3 { 0%{transform:translate(0,0) scale(1);opacity:.18} 40%{transform:translate(80px,30px) scale(1.1);opacity:.12} 70%{transform:translate(-30px,-50px) scale(.9);opacity:.22} 100%{transform:translate(0,0) scale(1);opacity:.18} }
@media (prefers-reduced-motion: reduce) { .orb { animation: none; } }

/* ── Graphe ── */
#graph { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: block; z-index: 1; touch-action: none; cursor: grab; }
#graph:active { cursor: grabbing; }
#graph text { user-select: none; -webkit-user-select: none; }

.vide {
  position: fixed; left: 16px; right: 16px; top: calc(50% + 92px); z-index: 2;
  text-align: center; font-size: 12px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,0.45); pointer-events: none;
}

/* ── En-tête ── */
.top-fade {
  position: fixed; top: 0; left: 0; right: 0; height: 120px; z-index: 39; pointer-events: none;
  background: linear-gradient(to bottom, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.30) 55%, transparent 100%);
  -webkit-mask-image: linear-gradient(to bottom, black 60%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 60%, transparent 100%);
}
.nav {
  position: fixed; z-index: 40; pointer-events: none;
  top: calc(12px + env(safe-area-inset-top)); left: 12px; right: 12px;
  display: flex; justify-content: center;
}
.nav-pill {
  pointer-events: auto;
  background: var(--verre);
  -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid var(--verre-bord); box-shadow: var(--verre-ombre);
  display: flex; align-items: center; border-radius: 999px;
  padding: 5px 8px 5px 5px; gap: 7px; width: 100%; min-width: 0;
}
.nav-logo { flex-shrink: 0; display: flex; align-items: center; justify-content: center; padding: 0 6px 0 10px; height: 36px; }
.nav-logo img { width: 22px; height: 22px; object-fit: contain; }
.vsep { width: 1px; height: 16px; background: rgba(255,255,255,0.20); flex-shrink: 0; }
.nav-field { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; padding: 6px 10px; cursor: text; }
.nav-field > .ico { width: 13px; height: 13px; color: rgba(255,255,255,0.35); }
.nav-field input {
  flex: 1; min-width: 0; width: 100%;
  background: transparent; border: none; outline: none;
  color: #fff; font-size: 16px; font-family: var(--police); font-weight: 500;
  caret-color: rgba(167,139,250,0.8);
}
.nav-field input::placeholder { color: rgba(255,255,255,0.35); }
.nav-clear { background: none; border: none; cursor: pointer; padding: 0 4px; color: rgba(255,255,255,0.38); display: flex; align-items: center; min-height: 32px; flex-shrink: 0; transition: color .15s; }
.nav-clear:hover { color: rgba(255,255,255,0.8); }
.nav-clear .ico { width: 13px; height: 13px; }
.nav-tags {
  flex-shrink: 0; display: flex; align-items: center; justify-content: center; gap: 6px;
  min-width: 44px; height: 36px; border-radius: 999px; background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,0.65); transition: color .18s;
}
.nav-tags .ico { width: 14px; height: 14px; }
.nav-tags-txt { display: none; }
.nav-tags:hover { color: #fff; }

@media (min-width: 768px) {
  .nav { top: 16px; left: 0; right: 0; padding: 0 16px; }
  .nav-pill { width: auto; max-width: 100%; padding: 6px 8px 6px 6px; gap: 0; }
  .nav-logo { padding: 0 16px 0 18px; }
  .nav-field {
    min-width: 380px; margin: 0 8px; padding: 5px 5px 5px 14px; gap: 9px;
    border-radius: 999px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.10);
  }
  .nav-field input { font-size: 13px; height: 26px; }
  .nav-tags { padding: 6px 18px 6px 14px; color: rgba(255,255,255,0.85); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
  .nav-tags .ico-tag { width: 12px; height: 12px; color: rgba(167,139,250,0.7); }
  .nav-tags-txt { display: inline; }
}

/* ── Zoom ── */
.zoom { display: none; }
@media (min-width: 768px) {
  .zoom { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); z-index: 45; display: flex; flex-direction: column; gap: 8px; }
  .zoom button {
    width: 36px; height: 36px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    background: var(--verre); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid var(--verre-bord); box-shadow: var(--verre-ombre);
    color: rgba(255,255,255,0.55); font-size: 18px; font-weight: 700; line-height: 1;
    transition: color .15s, border-color .15s, background .15s;
  }
  .zoom button:hover { color: #fff; border-color: rgba(167,139,250,0.45); background: rgba(30,24,70,0.55); }
  .zoom .ico { width: 14px; height: 14px; stroke-width: 2.2; }
}

/* ── Pied de page (ordinateur et tablette) ── */
.pied { display: none; }
@media (min-width: 768px) and (min-height: 600px) {
  .pied {
    display: block; position: fixed; bottom: 0; left: 0; right: 0; z-index: 10;
    background: rgba(12, 26, 54, 0.92); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-bottom: env(safe-area-inset-bottom);
  }
}
.pied-l1 { max-width: 1200px; margin: 0 auto; padding: 16px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pied-marque { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 400; color: #fff; white-space: nowrap; }
.pied-logo { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.28); background: rgba(255,255,255,0.06); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pied-logo img { width: 22px; height: 22px; object-fit: contain; }
.pied-sep { width: 1px; height: 18px; background: rgba(255,255,255,0.20); }
.pied-l2 { max-width: 1200px; margin: 0 auto; padding: 0 24px 16px; display: flex; justify-content: center; align-items: center; gap: 12px; flex-wrap: wrap; }
.pied-l2 a { font-size: 13px; font-weight: 400; color: #fff; transition: color .2s; }
.pied-l2 a:hover { color: var(--violet); }
.pied-sep2 { width: 1px; height: 12px; background: rgba(255,255,255,0.18); }

.reseaux { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.reseaux a { color: #fff; display: flex; align-items: center; justify-content: center; min-width: 28px; min-height: 28px; transition: color .15s; }
.reseaux a:hover { color: var(--violet); }
.reseaux svg { width: 16px; height: 16px; }
.reseaux .r-sep { width: 1px; height: 14px; background: rgba(255,255,255,0.18); margin: 0 8px; }

/* ── Voiles et fenêtres ── */
.voile { position: fixed; inset: 0; z-index: 200; background: rgba(10,12,40,0.82); opacity: 0; transition: opacity .22s; }
.voile.ouvert { opacity: 1; }
.sourcil { font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--violet); }
.rond {
  background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.15); border-radius: 50%;
  width: 32px; height: 32px; color: rgba(255,255,255,0.85); cursor: pointer;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .15s, color .15s;
}
.rond:hover { background: rgba(255,255,255,0.2); color: #fff; }
.rond .ico { stroke-width: 2.5; }

/* Tags */
.tags-fenetre {
  position: fixed; z-index: 201; left: 50%; top: 50%;
  width: min(560px, calc(100vw - 32px)); max-height: min(70vh, calc(100dvh - 32px));
  transform: translate(-50%, -48%) scale(.96); opacity: 0;
  transition: transform .3s cubic-bezier(.34,1.2,.64,1), opacity .2s;
  background: var(--carte); border: 1px solid rgba(255,255,255,0.1); border-radius: 22px;
  box-shadow: 0 32px 100px rgba(0,0,0,0.65);
  display: flex; flex-direction: column; overflow: hidden;
}
.tags-fenetre.ouvert { transform: translate(-50%, -50%) scale(1); opacity: 1; }
.tags-tete { display: flex; align-items: center; justify-content: space-between; padding: 20px 20px 16px; border-bottom: 1px solid rgba(167,139,250,0.08); background: linear-gradient(180deg, rgba(100,70,220,0.08) 0%, transparent 100%); }
.tags-liste { padding: 16px 20px 20px; overflow-y: auto; display: flex; flex-wrap: wrap; gap: 8px; scrollbar-width: thin; scrollbar-color: rgba(167,139,250,0.2) transparent; }
.tag-btn {
  font-family: var(--police); font-size: 12px; font-weight: 500; letter-spacing: .02em;
  min-height: 34px; padding: 6px 14px; border-radius: 999px; cursor: pointer;
  color: rgba(167,139,250,0.9); background: rgba(167,139,250,0.1); border: 1px solid rgba(167,139,250,0.28);
  display: inline-flex; align-items: center; gap: 8px; max-width: 100%; text-align: left; overflow-wrap: anywhere;
  transition: background .15s, color .15s, border-color .15s;
}
.tag-btn:hover { background: rgba(167,139,250,0.2); color: #fff; }
.tag-btn.actif { background: rgba(167,139,250,0.85); color: #0c1a35; border-color: transparent; }
.tag-btn .n { font-size: 11px; opacity: .7; }

/* Note */
.note {
  position: fixed; z-index: 201; inset: 0; width: 100%; height: 100%;
  height: 100dvh; border-radius: 0;
  background: var(--carte);
  display: flex; flex-direction: column; overflow: hidden;
  opacity: 0; transform: translateY(24px);
  transition: transform .36s cubic-bezier(.34,1.2,.64,1), opacity .22s;
  padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom);
}
.note.ouvert { opacity: 1; transform: translateY(0); }
@media (min-width: 768px) {
  .note {
    inset: auto; top: 50%; left: 50%; width: 90vw; max-width: 760px; height: auto; max-height: 88vh; max-height: 88dvh;
    border-radius: 22px; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 32px 100px rgba(0,0,0,0.65);
    transform: translate(-50%, -46%) scale(.96); padding: 0;
  }
  .note.ouvert { transform: translate(-50%, -50%) scale(1); }
}
@media (min-width: 1280px) {
  .note { width: 88vw; max-width: 960px; max-height: 86vh; max-height: 86dvh; border-radius: 24px; }
}
.note-tete {
  flex-shrink: 0; padding: 20px 20px 16px;
  background: linear-gradient(180deg, rgba(100,70,220,0.08) 0%, transparent 100%);
  border-bottom: 1px solid rgba(167,139,250,0.08);
}
@media (min-width: 768px) { .note-tete { padding: 28px 32px 20px; } }
.note-l1 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; gap: 12px; }
.note-l1-actions { display: flex; align-items: center; gap: 6px; }
.note-titre { color: #fff; font-size: 20px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
@media (min-width: 768px) { .note-titre { font-size: 24px; } }
@media (min-width: 1280px) { .note-titre { font-size: 28px; } }
.note-l3 { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 14px; }
.note-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; flex: 1; min-width: 0; }
.note-tag {
  font-size: 11px; font-weight: 500; padding: 3px 10px; border-radius: 999px; letter-spacing: .02em;
  color: rgba(167,139,250,0.9); background: rgba(167,139,250,0.1); border: 1px solid rgba(167,139,250,0.28);
  overflow-wrap: anywhere; max-width: 100%;
}
.note-actions { display: none; align-items: center; flex-shrink: 0; }
@media (min-width: 1280px) { .note-actions { display: flex; } .icobtn-m { display: none !important; } }
.icobtn {
  background: none; border: none; color: rgba(255,255,255,0.85); cursor: pointer;
  padding: 3px 5px; min-width: 32px; min-height: 32px;
  display: flex; align-items: center; justify-content: center; transition: color .15s;
}
.icobtn:hover { color: var(--violet); }
.icobtn .ico-ok { display: none; color: rgba(134,239,172,0.9); stroke-width: 2.5; }
.icobtn.copie .ico-lien { display: none; }
.icobtn.copie .ico-ok { display: block; }
.mini-sep { width: 1px; height: 12px; background: rgba(255,255,255,0.18); margin: 0 3px; }

.note-corps {
  flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;
  padding: 20px; scrollbar-width: thin; scrollbar-color: rgba(167,139,250,0.2) transparent;
}
@media (min-width: 768px) { .note-corps { padding: 24px 32px; } }
@media (min-width: 1280px) { .note-corps { padding: 28px 40px; } }
.squelette span { display: block; height: 12px; border-radius: 6px; background: rgba(255,255,255,0.08); margin-bottom: 14px; animation: pulse 1.4s ease-in-out infinite; }
.squelette span:nth-child(2) { width: 92%; } .squelette span:nth-child(3) { width: 84%; } .squelette span:nth-child(4) { width: 60%; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

.note-contenu { color: #fff; overflow-wrap: anywhere; }
.note-contenu * { color: #fff; }
.note-contenu h1 { font-size: 18px; font-weight: 700; margin: 1.2em 0 .5em; line-height: 1.35; }
.note-contenu h2 { font-size: 16px; font-weight: 600; margin: 1.1em 0 .4em; line-height: 1.35; }
.note-contenu h3 { font-size: 14px; font-weight: 600; margin: 1em 0 .35em; }
.note-contenu > :first-child { margin-top: 0; }
.note-contenu p { line-height: 1.85; margin-bottom: .85em; font-size: 14px; }
.note-contenu a, .note-contenu a * { color: var(--violet); text-decoration: none; transition: color .15s; }
.note-contenu a:hover, .note-contenu a:hover * { color: #c4b5fd; }
.note-contenu ul, .note-contenu ol { padding-left: 1.5em; margin-bottom: .85em; font-size: 14px; }
.note-contenu li { line-height: 1.85; margin-bottom: .2em; }
.note-contenu code { background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.15); border-radius: 4px; padding: 1px 5px; font-family: 'Courier New', monospace; font-size: .85em; }
.note-contenu pre { background: rgba(0,0,0,0.3); border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 14px 16px; margin-bottom: 1em; white-space: pre-wrap; overflow-wrap: anywhere; }
.note-contenu pre code { background: none; border: none; padding: 0; }
.note-contenu blockquote { border-left: 3px solid rgba(255,255,255,0.35); padding: 4px 0 4px 16px; font-style: italic; margin-bottom: 1em; }
.note-contenu hr { border: none; border-top: 1px solid rgba(255,255,255,0.07); margin: 1.5em 0; }
.note-contenu strong { font-weight: 600; }
.note-contenu img, .note-contenu video { max-width: 100%; height: auto; border-radius: 8px; margin: 8px 0; }
.note-contenu table { display: block; max-width: 100%; border-collapse: collapse; font-size: 13px; margin-bottom: 1em; }
.note-contenu th, .note-contenu td { border: 1px solid rgba(255,255,255,0.12); padding: 6px 10px; overflow-wrap: anywhere; }
.note-erreur { color: rgba(255,255,255,0.6); font-size: 14px; }

.note-pied { display: none; }
@media (min-width: 768px) {
  .note-pied {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    border-top: 1px solid rgba(167,139,250,0.12); padding: 16px 32px; flex-shrink: 0; background: rgba(8,17,35,0.5);
  }
}
.auteur { display: flex; align-items: center; gap: 10px; min-width: 0; }
.auteur img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.auteur-txt { display: flex; flex-direction: column; min-width: 0; }
.auteur-nom { color: #fff; font-size: 13px; font-weight: 600; }
.auteur-role { color: rgba(255,255,255,0.55); font-size: 11px; }
.note-pied .reseaux .r-sep { margin: 0 6px; }

/* Message bref */
.toast {
  position: fixed; z-index: 300; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); transform: translateX(-50%);
  max-width: calc(100vw - 32px); padding: 10px 18px; border-radius: 999px;
  background: var(--verre); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border: 1px solid var(--verre-bord); color: #fff; font-size: 13px; font-weight: 500; text-align: center;
}

@media print {
  .orbs, #graph, .nav, .top-fade, .zoom, .pied, .voile, .note-tete .note-l1-actions, .note-actions, .note-pied { display: none !important; }
  html, body { overflow: visible; height: auto; background: #fff; }
  .note { position: static; transform: none; opacity: 1; max-height: none; height: auto; background: #fff; border: none; box-shadow: none; }
  .note-titre, .note-contenu, .note-contenu * { color: #1a1a2e !important; }
  .note-corps { overflow: visible; }
}

/* Écrans tactiles et téléphones : cibles d'au moins 44 px */
@media (pointer: coarse), (max-width: 767px) {
  .nav-logo, .nav-tags { height: 44px; min-width: 44px; }
  .nav-field { min-height: 44px; }
  .nav-clear { min-width: 44px; min-height: 44px; justify-content: center; }
  .rond { width: 44px; height: 44px; }
  .icobtn { min-width: 44px; min-height: 44px; }
  .zoom button { width: 44px; height: 44px; }
  .reseaux a { min-width: 44px; min-height: 44px; }
  .reseaux .r-sep { margin: 0 2px; }
  .pied-marque { min-height: 44px; }
  .pied-l2 a { display: inline-flex; align-items: center; min-height: 44px; }
  .tag-btn { min-height: 44px; }
}

/* ── Vague 29 (18/10/2026) : lettre d'information et mesure d'audience ─────────────────── */
/* Bouton d'action unique du site : « S'abonner », « Accepter » et « Refuser » ont exactement la même règle
   (règle des sites : CTA = bouton « Accepter » ; CNIL : « Refuser » du même poids). Couleurs du bloc Zite. */
.cta {
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 11px 24px; border-radius: 50px;
  background: rgba(59, 96, 212, 0.18); color: rgb(240, 244, 255); border: 1px solid rgba(59, 96, 212, 0.38);
  font-family: var(--police); font-size: 13px; font-weight: 600; letter-spacing: 0.1px; line-height: 1.2;
  cursor: pointer; white-space: nowrap; transition: background 0.2s ease;
}
.cta:hover:not(:disabled) { background: rgba(59, 96, 212, 0.32); }
.cta:disabled { opacity: 0.7; cursor: default; }

/* Lettre d'information, sous chaque note (reprise de NewsletterBlock.tsx) */
.lettre { margin-top: 40px; padding-top: 32px; padding-bottom: 8px; text-align: center; font-family: var(--police); }
.lettre-sep { width: 48px; height: 1px; background: rgba(59, 96, 212, 0.4); margin: 0 auto 32px; }
.lettre-titre { font-size: clamp(1.05rem, 3.5vw, 1.3rem); font-weight: 800; letter-spacing: -0.3px; color: #fff; line-height: 1.2; margin-bottom: 28px; }
.lettre-ok { padding: 8px 0 16px; }
.lettre-ok p { font-size: clamp(1rem, 3vw, 1.2rem); font-weight: 800; color: #fff; letter-spacing: -0.3px; margin-bottom: 10px; }
.lettre-form { max-width: 400px; margin: 0 auto; }
.lettre-pilule {
  display: flex; align-items: center; gap: 6px; background: rgb(23, 33, 64);
  border: 1px solid rgba(59, 96, 212, 0.3); border-radius: 50px; padding: 5px 5px 5px 20px; transition: border-color 0.2s;
}
.lettre-pilule.erreur { border-color: rgba(239, 68, 68, 0.5); }
.lettre-pilule input[type="email"] {
  flex: 1; min-width: 0; background: transparent; border: none; outline: none;
  font-family: var(--police); font-size: 13.5px; font-weight: 300; color: rgb(240, 244, 255);
}
.lettre-pilule input[type="email"]::placeholder { color: rgba(240, 244, 255, 0.55); }
.lettre-piege { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; opacity: 0; }
.lettre-roue { display: none; width: 14px; height: 14px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.3); border-top-color: #fff; animation: lettre-tourne 0.7s linear infinite; }
.cta.charge .lettre-roue { display: inline-block; }
.cta.charge .lettre-txt { display: none; }
@keyframes lettre-tourne { to { transform: rotate(360deg); } }
.lettre-erreur { margin-top: 10px; font-size: 12px; color: rgba(239, 68, 68, 0.85); }
.lettre-mention { margin-top: 10px; font-size: 11px; line-height: 1.6; color: rgba(240, 244, 255, 0.8); }
.lettre-mention + .lettre-mention { margin-top: 6px; }
.lettre-mention a { color: rgb(240, 244, 255); font-weight: 600; text-decoration: none; }
.lettre-mention a:hover { color: var(--violet); }
.lettre-cookies { margin-top: 14px; }
.lettre-cookies a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; white-space: nowrap; }
/* Téléphone et tactile : pas de zoom d'iOS sur un champ sous 16 px */
@media (pointer: coarse) { .lettre-pilule input[type="email"] { font-size: 16px; } }

/* Fenêtre « Mesure d'audience » (même dispositif que les 7 sites, thème jasonvallee 0.1.17) */
.msc-consentement {
  position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 9990;
  max-width: 820px; margin-inline: auto; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between;
  padding: 16px; border-radius: 20px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(8, 8, 18, .82);
  -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%); overflow: hidden; isolation: isolate;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 8px 32px rgba(0, 0, 0, .4); color: #f0f4ff; font-family: var(--police);
}
.msc-consentement[hidden] { display: none; }
.msc-consentement__texte { flex: 1 1 260px; min-width: 0; }
.msc-consentement__texte strong { display: block; font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.msc-consentement__texte p { margin: 0; font-size: 13px; line-height: 1.45; }
.msc-consentement__texte a { color: var(--violet); font-weight: 600; text-decoration: none; white-space: nowrap; }
.msc-consentement__boutons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; flex: 0 0 auto; }
.msc-consentement__boutons .cta { min-width: 112px; }
@media (max-width: 480px) {
  .msc-consentement { flex-direction: column; align-items: stretch; }
  .msc-consentement__texte { flex: 0 0 auto; }
  .msc-consentement__boutons .cta { flex: 1; }
}
@media print { .lettre, .msc-consentement { display: none !important; } }

/* Aucun lien souligné, nulle part (règle de tous les sites) */
a, a:hover, a * { text-decoration: none !important; }