/* =====================================================================
   Lestha Send 3.107.0 — identité « Vert Lestha » (fondations)
   Une seule police (Instrument Sans), une seule couleur de marque (vert
   Lestha), des surfaces pleines, des filets fins, aucune lueur.
   Chargée APRÈS style.css : elle redéfinit les jetons et les composants
   communs. Les écrans (accueil, réunion, TV, console) sont repris un par
   un dans les versions 3.107.1 à 3.107.4.
   ===================================================================== */
:root {
  --chart-v: #2f6a5c;
  --bg: #111413; --bg-2: #161a18;
  --surface: #191d1b; --surface-2: #1f2421; --surface-solid: #191d1b; --elev: #222725;
  --border: #29302d; --border-2: #38403c;
  --text: #e8ece9; --muted: #9ea8a3; --faint: #8f9994;
  --cyan: #4cc3a6; --teal: #4cc3a6; --violet: #a99cf0; --amber: #e2a54a; --rose: #ef6f5e; --danger: #ef6f5e; --ok: #4cc3a6;
  --brand: #4cc3a6; --on-brand: #0d1412; --brand-soft: rgba(76, 195, 166, .12);
  --live: #ef5a48;
  --grad: var(--brand); --grad-soft: var(--brand-soft);
  --ring: 0 0 0 3px rgba(76, 195, 166, .28);
  --r-sm: 6px; --r: 10px; --r-lg: 14px; --r-xl: 14px;
  --shadow: none; --blur: 0px;
  --font: 'Instrument Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --display: var(--font);
  --well: 21 25 23; --well-2: 25 29 27; --bar: 17 20 19; --glow: #111413; --modal: #1c201e;
  --t-cyan: #7fd8c2; --t-ok: #7fd8c2; --t-bad: #f4a093; --t-warn: #edc77f; --t-violet: #c9c0f7;
}
:root[data-theme="light"] {
  --chart-v: #a9cfc3;
  --bg: #f2f4f3; --bg-2: #e8ecea;
  --surface: #ffffff; --surface-2: #f8faf9; --surface-solid: #ffffff; --elev: #ffffff;
  --border: #dce2df; --border-2: #c7cfcb;
  --text: #151917; --muted: #56605b; --faint: #616b66;
  --cyan: #0d6b5a; --teal: #0d6b5a; --violet: #5b4ccf; --amber: #a35a0a; --rose: #c2412d; --danger: #c2412d; --ok: #0d6b5a;
  --brand: #0d6b5a; --on-brand: #ffffff; --brand-soft: #e5f0ec;
  --live: #b8321f;
  --ring: 0 0 0 3px rgba(13, 107, 90, .22);
  --shadow: none;
  --well: 248 250 249; --well-2: 255 255 255; --bar: 242 244 243; --glow: #f2f4f3; --modal: #ffffff;
  --t-cyan: #0d6b5a; --t-ok: #0d6b5a; --t-bad: #a8321f; --t-warn: #8a4b06; --t-violet: #4b3cb5;
}

/* Fond : plus de taches floues ni de grille */
.bg-scene { background: var(--bg) !important; }
.blob, .grid-lines { display: none !important; }
body { font-size: 15px; letter-spacing: -.003em; }

/* Typographie : une famille, trois graisses, une échelle */
h1, h2, h3 { font-family: var(--font); letter-spacing: -.022em; }
h1 { font-size: clamp(30px, 5vw, 48px); font-weight: 600; line-height: 1.06; }
h2 { font-size: clamp(22px, 3vw, 28px); font-weight: 600; }
h3 { font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.grad-text, .brand-name b { background: none !important; -webkit-text-fill-color: currentColor !important; color: inherit !important; }
.grad-text { color: var(--brand) !important; }
.eyebrow { color: var(--muted); letter-spacing: .04em; text-transform: none; font-weight: 500; font-size: 13px; }
.eyebrow .pulse-dot { display: none; }
.lead { color: var(--muted); font-size: 17px; line-height: 1.55; }

/* Barre du haut : sobre, onglets soulignés */
.topbar { background: var(--bg) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-bottom: 1px solid var(--border); }
.brand { font-family: var(--font); font-weight: 600; letter-spacing: -.02em; }
.brand-mark { filter: none !important; }
.brand:hover .brand-mark { transform: none; }
.nav { background: transparent !important; border: 0 !important; padding: 0; gap: 2px; }
.nav a { border-radius: 8px; padding: 8px 12px; font-weight: 500; color: var(--muted); }
.nav a:hover { background: var(--surface-2); color: var(--text); }
.nav a.active { background: var(--surface) !important; color: var(--text) !important; box-shadow: inset 0 0 0 1px var(--border) !important; }
.nav a.active .i { color: var(--brand); }
.icon-btn { border-radius: 8px; background: transparent; }
.icon-btn:hover { transform: none; background: var(--surface-2); }

/* Cartes : pleines, bord fin, pas d'ombre, pas de verre */
.card { background: var(--surface) !important; border: 1px solid var(--border); box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; border-radius: 14px; }
.card.glow::before { display: none; }

/* Boutons */
.btn { border-radius: 10px; font-weight: 600; min-height: 44px; box-shadow: none !important; transition: background .15s, border-color .15s, color .15s; background: var(--surface); border-color: var(--border-2); }
.btn:hover { transform: none; border-color: var(--text); }
.btn:active { transform: none; }
.btn.primary { background: var(--brand) !important; color: var(--on-brand) !important; }
.btn.primary::after { display: none; }
.btn.primary:hover { filter: brightness(1.08); }
.btn[disabled] { opacity: 1; background: var(--bg-2) !important; color: var(--faint) !important; border: 1px solid var(--border) !important; }
.btn.danger { background: transparent; color: var(--danger); border-color: var(--border-2); }
.btn .ripple { display: none; }
.chip { border-radius: 8px !important; box-shadow: none !important; }

/* Champs */
.input, select.input, textarea.input { border-radius: 10px; background: var(--surface) !important; border-color: var(--border-2); }
.input:focus { border-color: var(--brand); box-shadow: var(--ring); }
.field > span, .label { color: var(--text); font-weight: 500; font-size: 13px; }

/* Mouvement : seulement ce qui informe */
.view > * { animation: none !important; }

/* Accueil */
.hero-badges { gap: 18px !important; }
.hero-badge { background: none !important; border: 0 !important; padding: 0 !important; color: var(--muted) !important; font-weight: 500 !important; box-shadow: none !important; }
.hero-badge .i { color: var(--brand); }
.segmented { background: var(--bg-2) !important; border: 1px solid var(--border) !important; border-radius: 10px !important; box-shadow: none !important; }
.seg-pill { background: var(--surface) !important; box-shadow: 0 0 0 1px var(--border-2) !important; border-radius: 8px !important; }
.segmented button.active { color: var(--text) !important; }
.segmented button.active .i { color: var(--brand); }
.mode-hint, .banner { background: transparent !important; border: 0 !important; border-left: 2px solid var(--brand) !important; border-radius: 0 !important; padding: 2px 0 2px 12px !important; color: var(--muted) !important; }
.dropzone { background: var(--surface) !important; border: 1.5px dashed var(--border-2) !important; border-radius: 14px !important; box-shadow: none !important; }
.dropzone:hover { border-color: var(--brand) !important; }
.dz-orb { background: var(--brand-soft) !important; color: var(--brand) !important; box-shadow: none !important; border-radius: 12px !important; animation: none !important; }
.dz-orb::before, .dz-orb::after { display: none !important; }
.dz-title { font-family: var(--font) !important; font-weight: 600 !important; }

/* Pied de page */
.sf-cta, .site-footer .sf-cta { background: var(--surface) !important; border: 1px solid var(--border) !important; box-shadow: none !important; }

/* Bandeaux : la couleur dit la gravité */
.banner.bad { border-left-color: var(--danger) !important; color: var(--text) !important; }
.banner.bad .i { color: var(--danger); }
.banner.warn { border-left-color: var(--amber) !important; color: var(--text) !important; }
.banner.warn .i { color: var(--amber); }
/* Console : chiffres en grille continue, sans halos */
.kpis { gap: 0 !important; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); overflow: hidden; }
.kpi { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: inset -1px -1px 0 var(--border) !important; padding: 18px 20px !important; }
.kpi:hover { transform: none !important; }
.kpi::after { display: none !important; }
.kpi-icon { background: transparent !important; color: var(--faint) !important; width: auto; height: auto; }
.kpi-top { font-weight: 500 !important; }
.kpi-value { font-family: var(--font) !important; font-weight: 600 !important; font-variant-numeric: tabular-nums; }
.adm-tabs { gap: 0 !important; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.adm-tabs .chip { border: 0 !important; background: transparent !important; border-radius: 0 !important; color: var(--muted) !important; padding: 10px 12px !important; box-shadow: inset 0 -2px 0 transparent !important; font-weight: 500; }
.adm-tabs .chip.active { color: var(--text) !important; box-shadow: inset 0 -2px 0 var(--brand) !important; }
.adm-tabs .chip.active .i { color: var(--brand); }
/* Lestha TV : surfaces pleines, focus épais lisible à 3 m */
.tv-shell .tv-tab { background: transparent !important; border-radius: 10px !important; }
.tv-shell .tv-tab.active { background: var(--surface) !important; color: var(--text) !important; box-shadow: inset 0 0 0 1px var(--border) !important; }
.tv-shell .tv-tab.active::before { background: var(--brand) !important; }
html[data-tv-mode="display"] .tv-shell .tv-tab:focus, .tv-shell .tv-tab:focus { transform: none !important; background: var(--brand) !important; color: var(--on-brand) !important; box-shadow: 0 0 0 3px var(--bg), 0 0 0 6px var(--brand) !important; }
.tv-shell .tv-tab:focus::before { display: none; }
.tv-clock { color: var(--text) !important; }

/* Les anciennes polices ne sont plus chargées : les textes qui les nommaient prennent la police Lestha */
.rx-code-v, .rc-code, .sd-no b, .salle-url, .mt-av, .meet .meet-title b, .sf-pitch, .dc-size,
.bd-eyebrow, .bd-title, .bd-clock b, .bd-star-tag, .bd-star-name, .bd-star-price, .bd-item-name, .bd-price,
.bd-pray-clock, .bd-pray-next b, .bd-pray-name b, .bd-pray-time, .bd-garde-name, .bd-garde-tel, .bd-poster-title,
.tv-prog-time, .tv-chan-time { font-family: var(--font) !important; }
.rx-code-v, .rc-code, .sd-no b, .tv-prog-time, .tv-chan-time { font-variant-numeric: tabular-nums; }

/* Le bandeau « Direct » de la TV : aplat au lieu du dégradé */
.tv-ticker-tag { background: var(--brand) !important; color: var(--on-brand) !important; }

/* Mouvement réduit si l'appareil le demande */
@media (prefers-reduced-motion: reduce) { .btn, .chip, .nav a, .input { transition: none !important; } }

/* ---------------------------------------------------------------------
   3.107.1 — contrastes WCAG 2.2 AA (contrôle axe-core sur 13 pages,
   thèmes clair et sombre) : --faint relevé à 4,5:1 minimum, texte lisible
   sur tout aplat vert, liens soulignés dans les phrases.
   --------------------------------------------------------------------- */
.skip-link, .chip.active, .nav-badge, .success-burst, .avatar, .radar-avatar, .peer-badge, .p-av,
.founder-photo span, .q-badge, .lv-send-btn, .lv-step span, .lv-kind.active .lv-kind-ico, .ps-opt.hot .ps-ico,
.doc-bar .db.dl, .db-live, .gal-tile.picked .gal-check .i, .gv-pill.on, .gv-pill.primary, .q-btn #qBadge,
.dv-tab.on, .vq-chip.on, .vt-bal.ok .vt-n, .vt-opt.on .vt-tick, .vt-done-ic, .rv-check input:checked + span,
.tv-chan-pick input:checked + .tv-chan-ord {
  background: var(--brand) !important; border-color: transparent !important; color: var(--on-brand) !important; box-shadow: none !important;
}
.chip.active .i, .gv-pill.on .i, .vq-chip.on .i { color: inherit; }
.ps-sound input:checked + .ps-check::after { border-color: var(--on-brand) !important; }
p a, .small a, .tiny a, .faint a, .muted a, .lead a, li a, .hint a { text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.lv-hero-badge { color: var(--live) !important; background: transparent !important; border: 1px solid currentColor !important; }
.segmented button small { color: var(--muted) !important; opacity: 1 !important; }
.adm-tabs .chip.active { background: transparent !important; color: var(--text) !important; }
/* Pastilles d'initiales : teinte de la personne conservée, à plat et assez foncée pour le texte blanc */
.lv-avatar, .lv-av, .lv-mock-chat i, .lp-thumb b { background: hsl(var(--h) 45% 32%) !important; }
.lv.is-live .lv-avatar { box-shadow: 0 0 0 3px var(--surface-solid), 0 0 0 5px var(--live); }

/* ---------------------------------------------------------------------
   3.107.2 — Envoyer / Recevoir : accueil en 3 étapes, barre du bas sur
   téléphone (Envoyer, Recevoir, Réunion, Direct, Plus).
   --------------------------------------------------------------------- */
.tabbar { display: none; }
@media (max-width: 760px) {
  html.has-tabbar { --tabbar-h: calc(60px + env(safe-area-inset-bottom, 0px)); }
  html.has-tabbar .tabbar {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: fixed; z-index: 60; left: 0; right: 0; bottom: 0;
    padding: 4px max(6px, env(safe-area-inset-left, 0px)) calc(4px + env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-right, 0px));
    background: var(--surface); border-top: 1px solid var(--border);
  }
  html.has-tabbar #mainNav { display: none !important; }
  html.has-tabbar body:not(.in-meet) { padding-bottom: var(--tabbar-h); }
  html.has-tabbar .toasts { bottom: calc(12px + var(--tabbar-h)); }
  html.has-tabbar .zipbar { bottom: calc(10px + var(--tabbar-h)); }
  html.has-tabbar .tv-rc-pill { bottom: calc(12px + var(--tabbar-h)); }   /* 3.107.10 : la pastille télécommande ne cache plus « Plus » */
  html.kb-open .tabbar, body.in-meet .tabbar, body.live-tv-full .tabbar, html[data-tv-mode="display"] .tabbar { display: none !important; }
  html.kb-open body { padding-bottom: 0 !important; }
  html.kb-open .toasts, html.kb-open .zipbar, html.kb-open .tv-rc-pill { bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}
.tabbar a, .tabbar button {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 52px; padding: 4px 2px;
  border: 0; border-radius: 8px; background: none; color: var(--muted); font: 500 11.5px/1.15 var(--font); text-decoration: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: color .15s;
}
.tabbar .i { width: 22px; height: 22px; margin-bottom: 4px; }
.tabbar a[hidden] { display: none; }
.tabbar a.active, .tabbar button.active, .tabbar button[aria-expanded="true"] { color: var(--brand); font-weight: 600; }
.tabbar a.active::before, .tabbar button.active::before { content: ''; position: absolute; top: -4px; left: 28%; right: 28%; height: 2px; border-radius: 0 0 2px 2px; background: var(--brand); }
.tabbar .nav-badge { position: absolute; top: 3px; left: 50%; margin-left: 6px; }

.tab-sheet-bd { position: fixed; z-index: 90; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: flex-end; background: rgba(8, 12, 10, .45); }
.tab-sheet {
  width: 100%; max-height: 82vh; overflow-y: auto; box-sizing: border-box; background: var(--surface); border-top: 1px solid var(--border);
  border-radius: 14px 14px 0 0; padding: 6px 12px calc(12px + env(safe-area-inset-bottom, 0px));
}
.tab-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 4px 6px 6px; }
.tab-sheet-head h2 { margin: 0; font-size: 17px; font-weight: 600; letter-spacing: -.01em; }
.tab-sheet-list { list-style: none; margin: 0; padding: 0; }
.tab-sheet-list li + li { border-top: 1px solid var(--border); }
.tab-sheet-list a { display: flex; align-items: center; min-height: 58px; padding: 8px 6px; border-radius: 10px; color: var(--text); text-decoration: none !important; }
.tab-sheet-list a:hover, .tab-sheet-list a[aria-current="page"] { background: var(--surface-2); }
.tab-sheet-ic { flex: none; display: grid; place-items: center; width: 38px; height: 38px; margin-right: 12px; border-radius: 10px; background: var(--brand-soft); color: var(--brand); }
.tab-sheet-t { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.tab-sheet-t b { font-size: 15px; font-weight: 600; }
.tab-sheet-t small { margin-top: 2px; color: var(--muted); font-size: 13px; }
@media (min-width: 761px) { .tab-sheet-bd { display: none; } }

/* Accueil en 3 étapes : 1 vos fichiers, 2 Cloud ou Direct, 3 options et envoi */
.step-h { display: flex; align-items: center; margin: 4px 0 -4px; font-size: 15px; font-weight: 600; letter-spacing: -.005em; color: var(--text); }
.step-n {
  flex: none; display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 10px; border-radius: 50%;
  border: 1px solid var(--border-2); color: var(--brand); font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.send-steps > .stack > .step-h ~ .step-h { margin-top: 14px; }
#btnGo[disabled] { font-weight: 500; font-size: 15px; }
@media (max-width: 760px) {
  .hero h1 { font-size: 31px; line-height: 1.08; }
  .hero .lead { font-size: 15.5px; line-height: 1.5; }
  .hero-badges { display: none !important; }
  .send-steps .dropzone:not(.compact) { padding-top: 22px; padding-bottom: 22px; }
}

/* ---------------------------------------------------------------------
   3.107.3 — Réunion, Direct, Smart Drop, Tableau de bord.
   Salle de réunion : reste sombre quel que soit le thème (la vidéo s'y
   lit mieux), mais dans les gris verts de Lestha au lieu du bleu nuit ;
   vignettes à plat, pas de halo, rouge de fin d'appel accordé.
   --------------------------------------------------------------------- */
body.in-meet { background: #0e1110 !important; }
.meet { background: #0e1110 !important; color: #e8ece9 !important; }
.meet, .meet-bar, .mt-net, .meet-bar [data-tip]::after, .mt-tile.v-wait.has-video::after, .meet-bar .mb.rec.wide { font-family: var(--font) !important; }
.meet .meet-title b { font-family: var(--font) !important; font-weight: 600 !important; color: #e8ece9 !important; }
.meet .meet-title > span { color: #9ea8a3 !important; }
.meet .mt-tile { background: hsl(var(--h) 10% 16%) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06) !important; animation: none !important; }
.meet .mt-av, .mt-av { background: hsl(var(--h) 42% 32%) !important; box-shadow: none !important; font-family: var(--font) !important; font-weight: 600 !important; }
.meet .mt-name { background: rgba(14, 17, 16, .78) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.mt-role { color: #7fd8c2 !important; }
.meet .mt-tile.speaking { box-shadow: inset 0 0 0 2px #4cc3a6 !important; }
.mt-net { border-color: rgba(255, 255, 255, .1) !important; background: transparent !important; color: #c9d1cd !important; }
.mt-net.ok i { background: #4cc3a6 !important; box-shadow: none !important; }
.meet-bar { background: #181c1a !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 12px 32px rgba(0, 0, 0, .35) !important; }
.mb-group.side { border-left-color: rgba(255, 255, 255, .1) !important; }
.meet-bar .mb { background: rgba(255, 255, 255, .07); color: #e8ece9; }
.meet-bar .mb:hover { transform: none !important; background: rgba(255, 255, 255, .13); }
.meet-bar .mb.leave, .meet-bar .mb.rec.wide { background: #c8402d !important; color: #fff !important; }
.meet-bar .mb.leave:hover { background: #d64a36 !important; }
.meet-bar .mb.live { background: #4cc3a6 !important; color: #0d1412 !important; }
.meet-bar .mb.badge, .meet-bar .mb-badge { border-color: #181c1a !important; }
.meet-bar [data-tip]::after { background: #222725 !important; color: #e8ece9 !important; }
body.in-meet .meet-panel, body.in-meet .meet-react, .meet-more { background: #181c1a !important; color: #e8ece9 !important; border-color: rgba(255, 255, 255, .08) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
body.in-meet .meet-panel .muted { color: #9ea8a3 !important; }
body.in-meet .meet-panel .faint { color: #8f9994 !important; }
body.in-meet .meet-panel .chip.active { background: #4cc3a6 !important; color: #0d1412 !important; border-color: transparent !important; }
body.in-meet .mp-msg.me { background: rgba(76, 195, 166, .16) !important; }

/* Choix « Audio / Vidéo », « Lien / Flux » : carte choisie = bord vert et fond vert pâle, sans dégradé */
.mt-kind button.active, .lv-kind.active {
  background: var(--brand-soft) !important; border-color: var(--brand) !important; box-shadow: none !important;
}
.lv-kind.active::after { background: var(--brand) !important; color: var(--on-brand) !important; }

/* Pastilles d'icône : à plat. Vert pour les actions Lestha, rouge pour l'urgence, ambre pour le son */
.mt-vote-cta > .ic, .mt-vote-ic, .vt-hero-ic, .bo-arrive-ic, .qa-vote.on { background: var(--brand) !important; color: var(--on-brand) !important; box-shadow: none !important; }
.mt-ql-ic { background: #c8402d !important; color: #fff !important; }
.mm-fi { background: var(--brand-soft) !important; color: var(--brand) !important; }
body.in-meet .mm-fi, .meet-more .mm-fi { background: rgba(76, 195, 166, .16) !important; color: #7fd8c2 !important; }
.al-art { background: #a35a0a !important; }
.mt-vote-cta:hover { transform: none !important; box-shadow: inset 0 0 0 1px var(--border-2) !important; }
/* Fonds décoratifs retirés (halos, nuages de couleur) */
.sf-band::before, .sf-band::after, .lv-stage-wrap::before, .lv-stage-wrap::after { display: none !important; }
.brand-head { background: var(--surface) !important; }
.pending-card { background: var(--surface) !important; border-left: 2px solid #c98a1a !important; }
.live-empty, .live-wait { background: #111413 !important; }
.lv-soon { background: #161a18 !important; }
.lv-mock-stage { background: #1f2421 !important; }
.lv-mine-thumb { background: hsl(var(--h) 25% 22%) !important; }
.audio-art { background: var(--bg-2) !important; }
.lv .chat-msg.host { background: transparent !important; box-shadow: inset 2px 0 0 var(--live); }
.lv-regie-row [data-st="live"]:not(.ghost) { background: var(--live) !important; color: #fff !important; box-shadow: none !important; }
.vt-proj { background: #0e1110 !important; }
/* Graphique d'activité : vues en vert pâle, téléchargements en vert Lestha */
.chart .bar-v { fill: var(--chart-v) !important; }
.chart .bar-d { fill: var(--brand) !important; }
.chart g.col:hover .bar-v { fill: var(--brand-soft) !important; stroke: var(--brand); stroke-width: 1; }

/* ---------------------------------------------------------------------
   3.107.4 — Lestha TV : hiérarchie des liens lisible à 3 m.
   Catégorie en grand, sous-catégorie en petit avec un filet vert,
   vignettes plus petites (5 à 6 par ligne sur une TV de 65 pouces),
   sigle de la chaîne sur un aplat au lieu d'un émoji sur fond noir,
   étiquette « Direct » en rouge. Pas d'agrandissement au focus :
   un double anneau vert, visible sur tout fond.
   --------------------------------------------------------------------- */
.tv-cards { grid-template-columns: repeat(auto-fill, minmax(clamp(200px, 14vw, 280px), 1fr)) !important; gap: clamp(12px, 1.2vw, 20px) !important; }
.tv-card { border-width: 0 !important; border-radius: 12px !important; background: var(--surface) !important; box-shadow: inset 0 0 0 1px var(--border); transition: box-shadow .15s !important; }
.tv-card.active { box-shadow: inset 0 0 0 2px var(--brand) !important; }
.tv-card:focus, .tv-card:focus-visible, html[data-tv-mode="display"] .tv-card:focus { outline: none !important; transform: none !important; box-shadow: 0 0 0 3px var(--bg), 0 0 0 7px var(--brand) !important; }
.tv-card-thumb { position: relative; background: #0e1110 !important; }
.tv-mono {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
  background: hsl(var(--mh) 28% 20%); color: hsl(var(--mh) 55% 84%);
  font: 600 clamp(30px, 2.8vw, 52px)/1 var(--font); letter-spacing: .02em; font-variant-numeric: tabular-nums;
}
.tv-tag {
  position: absolute; top: 10px; left: 10px; padding: 4px 9px; border-radius: 6px;
  background: rgba(14, 17, 16, .82); color: #e8ece9; font: 600 clamp(12px, .85vw, 15px)/1.2 var(--font); letter-spacing: .01em;
}
.tv-tag.live { background: #c8402d; color: #fff; }
.tv-tag.live::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #fff; vertical-align: 1px; }
.tv-card-txt { padding: 12px 14px 14px !important; }
.tv-card-txt b { font-size: clamp(16px, 1.2vw, 21px) !important; font-weight: 600 !important; line-height: 1.25; }
.tv-card-txt span, .tv-card-txt em { font-size: clamp(13px, .95vw, 16px) !important; }

/* Titres : page > « Gardés sur cette TV » > catégorie > sous-catégorie */
.tv-folder { margin: 0 0 clamp(26px, 2.6vw, 44px) !important; }
.tv-folder-h { font: 600 clamp(24px, 2vw, 34px)/1.15 var(--font) !important; letter-spacing: -.015em; margin: clamp(14px, 1.4vw, 22px) 0 clamp(12px, 1vw, 16px) !important; }
.tv-folder-h .tv-fold-ico { color: var(--brand); opacity: 1 !important; }
.tv-folder-h .tv-n, .tv-sub .tv-n, .tv-cat .tv-n, .tv-fam .tv-n {
  display: inline-block; min-width: 1.6em; margin-left: .5em; padding: .12em .5em; border-radius: 999px; border: 1px solid var(--border-2);
  font-size: .58em !important; font-weight: 600 !important; opacity: 1 !important; color: var(--muted); text-align: center; vertical-align: .2em;
}
.tv-sub { font: 600 clamp(16px, 1.25vw, 21px)/1.2 var(--font) !important; color: var(--muted) !important; margin: 18px 0 10px !important; }
.tv-cat { font-family: var(--font) !important; font-weight: 600 !important; }
.tv-fam { font-family: var(--font) !important; font-weight: 600 !important; }

/* « Garder / Ranger » sous la vignette : discret, net quand on y arrive à la télécommande */
.tv-save { font-size: clamp(13px, .95vw, 16px) !important; padding: 5px 12px !important; border-width: 2px !important; background: transparent !important; color: var(--muted) !important; }
.tv-save.on { color: var(--text) !important; }
.tv-save:focus, .tv-save:focus-visible { border-color: var(--brand) !important; color: var(--text) !important; }
.tv-chip { border-width: 1px !important; }
.tv-sec { margin: clamp(6px, .8vw, 12px) 0 clamp(10px, 1vw, 14px) !important; color: var(--muted) !important; font: 500 clamp(15px, 1.1vw, 19px)/1.2 var(--font) !important; letter-spacing: .06em; text-transform: uppercase; }

/* ---------------------------------------------------------------------
   3.107.5 — Console : plus large pour les chiffres, onglets sur une
   seule ligne (sans icônes, qui se répétaient), étiquette « Console » et
   voyant « En direct » à plat.
   --------------------------------------------------------------------- */
#adm.view { max-width: 1280px; }
.adm-tag { background: var(--brand-soft) !important; color: var(--brand) !important; border: 0 !important; box-shadow: none !important; }
.topbar .live-badge { background: transparent !important; border: 1px solid var(--border-2); color: var(--text) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; font-weight: 600 !important; letter-spacing: 0 !important; animation: none !important; }
.topbar .live-badge i { background: var(--brand) !important; }
.topbar .live-badge.off i { background: var(--faint) !important; }
.adm-tabs { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; }
.adm-tabs::-webkit-scrollbar { display: none; }
.adm-tabs .chip { flex: none; padding: 10px 11px !important; font-size: 14px !important; }
.adm-tabs .chip .i { display: none !important; }
.kpi-value { font-variant-numeric: tabular-nums; font-weight: 600 !important; }
