/* LE SYSTÈME VISUEL D'OMNIS, DANS LE NAVIGATEUR DE CREA.
 *
 * Les deux navigateurs sont le même : celui d'OMNIS est né de celui de CREA et
 * se pose encore dessus — src/app.js produit déjà .rbrowser, .rbrowser-tabs et
 * .rbrowser-urlbar, exactement les ancres que la couche d'OMNIS cherche. Ce qui
 * les séparait visuellement, c'est ce fichier : 466 classes .omnis-*, dont
 * AUCUNE n'existait ici (mesuré, 0 sur 466).
 *
 * COPIE VERBATIM depuis index.html du dépôt Omnis.web, à une seule
 * transformation près, décrite plus bas. Ne pas retoucher ici : une copie
 * améliorée divergerait de l'original au premier changement, et les deux
 * navigateurs recommenceraient à ne plus se ressembler — ce qu'on est
 * précisément en train de corriger. Pour changer l'apparence, la changer dans
 * OMNIS et régénérer ce fichier.
 *
 * LES VARIABLES DE THÈME NE SONT PAS REPRISES. CREA en a déjà 8 des 9 aux
 * mêmes noms (--bg-primary, --border, --accent, --t-primary...). Les
 * réimporter écraserait SON thème, et c'est justement ce qui rend cette copie
 * possible sans rien emporter d'autre. Seule --bg-glass-hov manquait ; elle
 * est définie en fin de fichier, en repli.
 *
 * TROIS SECTIONS, TROIS TRAITEMENTS :
 *
 *   1. Ce qui ne touche que .omnis-* — tel quel, sans risque.
 *   2. Ce qui dépend d'une classe de body qu'OMNIS pose lui-même — tel quel,
 *      inerte tant que la couche ne l'a pas décidé. C'est notamment le cas de
 *      .omnis-cadre-fenetre, qui réserve la place des boutons de fenêtre et
 *      n'est posée que lorsque OMNIS possède réellement la fenêtre.
 *   3. Ce qui était VRAIMENT global (sélection de texte, anneau de focus,
 *      barre de défilement) — CANTONNÉ à #preview-panel. C'est le navigateur
 *      de CREA qui doit ressembler à celui d'OMNIS ; le reste de
 *      l'application n'a pas demandé à changer d'apparence.
 */

/* ═══ 1. PROPRE À OMNIS — aucune de ces classes n'existait dans CREA ═══ */

/* Favicon de l'onglet, comme Chrome — injectée par l'adaptateur, jamais
       par le fichier de référence immuable. */
    .omnis-tab-favicon {
      display: inline-flex;
      flex: none;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
      margin-right: 7px;
    }

.omnis-tab-favicon .omnis-favicon {
      width: 16px;
      height: 16px;
      border: 1px solid var(--border);
      background: var(--bg-glass);
      font-size: .58rem;
    }

.omnis-tab-favicon .omnis-favicon img { padding: 2px; background: transparent; }

.omnis-tab-favicon svg { width: 100%; height: 100%; color: var(--t-faint); }

/* Indicateur audio / mise en sourdine par onglet. */
    .omnis-tab-audio {
      display: grid;
      place-items: center;
      flex: none;
      width: 18px;
      height: 18px;
      margin-right: 2px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-tab-audio:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-tab-audio svg { width: 13px; height: 13px; }

/* Menu contextuel (clic droit) sur un onglet. */
    .omnis-tab-context-menu {
      position: fixed;
      z-index: 60;
      min-width: 220px;
      padding: 6px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--bg-primary);
      box-shadow: 0 8px 24px rgba(0,0,0,.10);
    }

.omnis-tab-context-menu button {
      display: block;
      width: 100%;
      padding: .5rem .7rem;
      border: 0;
      border-radius: .45rem;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .8rem;
    }

.omnis-tab-context-menu button:hover { background: var(--bg-glass-hov); }

/* Favoris : DANS la barre d'adresse, collé à son bord droit — pas un
       bouton de plus dans la rangée d'outils, déjà chargée. */
    .omnis-urlbar-wrap {
      position: relative;
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 2px;
      padding: 0 4px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: var(--bg-input);
    }

.omnis-urlbar-wrap:focus-within { border-color: var(--accent); }

/* Accueil (maison) posé DANS la barre d'adresse, comme les favoris —
       plus un bouton séparé de la rangée d'outils. */
    .omnis-home-btn {
      flex: none;
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
    }

.omnis-home-btn:hover { background: var(--bg-glass-hov); color: var(--accent); }

.omnis-home-btn svg { width: 17px; height: 17px; }

.omnis-fav-btn {
      position: absolute;
      top: 50%;
      right: 4px;
      transform: translateY(-50%);
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-fav-btn:hover { background: var(--bg-glass-hov); color: var(--accent); }

.omnis-fav-btn svg { width: 17px; height: 17px; }

/* Panneau du compte : ouvert au clic sur l'avatar, en-tête centré avec
       grande photo, nom et adresse, puis lignes d'action — comme le modèle. */
    body:is(.omnis-desktop, .omnis-web) .omnis-account-quick {
      position: absolute;
      right: 0;
      top: calc(100% + 8px);
      width: 300px;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-primary);
      color: var(--t-primary);
      box-shadow: 0 8px 24px rgba(0,0,0,.10);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
      pointer-events: none;
      z-index: 45;
    }

/* Multi-profils : liste des profils dans le menu du compte, façon Chrome. */
    body:is(.omnis-desktop, .omnis-web) .omnis-profiles-section { padding: 2px 4px 4px; }

.omnis-menu-btn-anchor { position: relative; }

.omnis-update-badge {
      position: absolute;
      top: 3px;
      right: 3px;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--accent);
      border: 1.5px solid var(--bg-primary);
      pointer-events: none;
      opacity: 0;
      transform: scale(.6);
      transition: opacity .15s ease, transform .15s ease;
    }

.omnis-update-badge.is-visible { opacity: 1; transform: scale(1); }

/* BARRE DE CHARGEMENT DE PAGE — le liseré coloré sous la barre d'adresse,
       comme Chrome. Position absolue : elle ne décale JAMAIS la mise en page
       quand elle apparaît ou disparaît. */
    .omnis-chargement {
      position: absolute;
      left: 0;
      /* Collée au bord INFÉRIEUR de la barre d'adresse, donc exactement à la
         frontière avec le contenu de la page — là où Chrome la place. */
      bottom: -1px;
      z-index: 25;
      width: 0;
      height: 3px;
      background: var(--accent);
      opacity: 0;
      pointer-events: none;
      transition: width .18s ease-out, opacity .2s ease;
    }

.omnis-chargement.is-actif { opacity: 1; }

/* La fin doit se sentir nette : remplissage plus rapide puis disparition. */
    .omnis-chargement.is-fini { transition: width .12s ease-out, opacity .26s ease; opacity: 0; }

/* MOTEUR VISUEL — piloté par le métamoteur (/api/meta), jamais par une
       supposition du frontend. Trois niveaux posés en classe sur <body> :
         sober    : petite machine OU mémoire tendue — aucune animation, ombres
                    minimales. L'app reste nette et complète, juste sobre.
         standard : le rendu de référence.
         rich     : grosse machine au repos — on s'autorise la profondeur.
       Le niveau baisse tout seul sous pression et remonte quand ça respire. */
    body.omnis-visual-sober * {
      animation: none !important;
      transition: none !important;
    }

.omnis-internal-host {
      overflow: auto;
      background: var(--bg-primary);
    }

/* Finition transverse des pages OMNIS : défilement discret, transitions
       courtes et anneaux de focus lisibles sur toutes les surfaces internes. */
    .omnis-internal-host * { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }

.omnis-internal-host ::-webkit-scrollbar { width: 10px; height: 10px; }

.omnis-internal-host ::-webkit-scrollbar-thumb {
      border: 3px solid transparent;
      border-radius: 999px;
      background: var(--border);
      background-clip: content-box;
    }

.omnis-internal-host ::-webkit-scrollbar-thumb:hover { background: var(--t-faint); background-clip: content-box; }

.omnis-internal-host ::-webkit-scrollbar-track { background: transparent; }

.omnis-internal-host button,
    .omnis-internal-host a,
    .omnis-internal-host input,
    .omnis-internal-host select {
      transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
    }

.omnis-internal-host button:focus-visible,
    .omnis-internal-host a:focus-visible,
    .omnis-internal-host input:focus-visible,
    .omnis-internal-host select:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }

.omnis-internal-host ::selection { background: var(--accent-bg); color: var(--t-primary); }

/* Anneau de focus visible partout ailleurs (barre d'outils, onglets, menus
       et panneaux flottants) — sans ça, seuls les éléments dans .omnis-internal-host
       avaient un focus visible au clavier. */
    button:focus-visible,
    a:focus-visible,
    input:focus-visible,
    select:focus-visible,
    [tabindex]:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }

@media (prefers-reduced-motion: reduce) {
      .omnis-internal-host * { transition: none !important; animation: none !important; }
    }

.omnis-internal-page {
      width: min(1080px, calc(100% - 40px));
      margin: 0 auto;
      padding: 38px 0 56px;
      color: var(--t-primary);
    }

.omnis-internal-header {
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 24px;
      margin-bottom: 26px;
    }

.omnis-internal-kicker {
      margin: 0 0 6px;
      color: var(--t-faint);
      font-size: .66rem;
      font-weight: 800;
      letter-spacing: .16em;
    }

.omnis-internal-header h1 {
      margin: 0;
      font-size: 1.7rem;
      line-height: 1.15;
      font-weight: 700;
    }

.omnis-internal-header p:not(.omnis-internal-kicker) {
      margin: 8px 0 0;
      color: var(--t-dim);
      font-size: .78rem;
    }

.omnis-internal-tools {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      flex-wrap: wrap;
    }

.omnis-internal-tools input,
    .omnis-settings-card select {
      min-width: 230px;
      height: 36px;
      padding: 0 12px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
      color: var(--t-primary);
      outline: none;
      font-size: .75rem;
    }

.omnis-internal-tools input:focus,
    .omnis-settings-card select:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 2px var(--accent-bg);
    }

.omnis-internal-tools button,
    .omnis-internal-actions button,
    .omnis-settings-card button {
      min-height: 32px;
      padding: 0 12px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: transparent;
      color: var(--t-primary);
      cursor: pointer;
      font-size: .72rem;
    }

.omnis-internal-tools button:hover,
    .omnis-internal-actions button:hover:not(:disabled),
    .omnis-settings-card button:hover {
      background: var(--bg-glass-hov);
    }

.omnis-settings-card label {
      display: grid;
      gap: 6px;
      margin: 12px 0 0;
      color: var(--t-dim);
      font-size: .73rem;
    }

.omnis-settings-card label:has(input[type="checkbox"]),
    .omnis-settings-card label:has(input[type="radio"]) {
      display: flex;
      align-items: center;
      gap: 8px;
    }

.omnis-settings-card input:not([type="checkbox"]):not([type="radio"]) {
      width: 100%;
      height: 36px;
      padding: 0 12px;
      border: 1px solid var(--border);
      border-radius: 9px;
      background: var(--bg-input);
      color: var(--t-primary);
      outline: none;
      font-size: .75rem;
    }

.omnis-settings-card small {
      display: block;
      margin-top: 10px;
      color: var(--t-faint);
      font-size: .67rem;
      line-height: 1.45;
    }

.omnis-account-hero {
      display: flex;
      align-items: center;
      gap: 14px;
      margin: -4px 0 24px;
      padding: 16px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-glass);
    }

.omnis-account-avatar {
      display: grid;
      place-items: center;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: .88rem;
      font-weight: 800;
    }

.omnis-account-hero strong,
    .omnis-account-hero span { display: block; }

.omnis-account-hero strong { font-size: .86rem; }

.omnis-account-hero span { margin-top: 3px; color: var(--t-faint); font-size: .7rem; }

.omnis-auth-tabs {
      display: flex;
      gap: 6px;
      margin-top: 10px;
    }

.omnis-auth-tabs button {
      flex: 1;
    }

.omnis-auth-tabs button.active {
      background: var(--accent-bg);
      border-color: var(--accent);
      color: var(--accent);
      font-weight: 600;
    }

.omnis-auth-error {
      display: block;
      margin-top: 10px;
      color: #e5484d;
      font-size: .7rem;
    }

/* Écran de connexion/inscription : jusqu'ici une carte de réglages
       générique (petits boutons ternes, aucun repère visuel) — devient un
       vrai écran d'accueil de compte, centré, avec un CTA qui se voit. */
    .omnis-auth-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 32px 28px;
      gap: 4px;
    }

.omnis-auth-card-icon {
      display: grid;
      place-items: center;
      width: 52px;
      height: 52px;
      margin-bottom: 10px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
    }

.omnis-auth-card-icon svg { width: 24px; height: 24px; }

.omnis-auth-card h2 { margin: 0; font-size: 1.1rem; }

.omnis-auth-card > p { margin: 4px 0 0; max-width: 320px; color: var(--t-muted); font-size: .78rem; line-height: 1.5; }

.omnis-auth-card .omnis-auth-tabs { width: 100%; max-width: 320px; margin-top: 20px; padding: 3px; border-radius: 999px; background: var(--bg-secondary); }

.omnis-auth-card .omnis-auth-tabs button {
      min-height: 30px;
      border: 0;
      border-radius: 999px;
      background: none;
      color: var(--t-muted);
    }

.omnis-auth-card .omnis-auth-tabs button.active {
      background: var(--bg-elevated);
      border-color: transparent;
      color: var(--t-primary);
      box-shadow: 0 1px 4px rgba(0,0,0,.12);
    }

.omnis-auth-form { width: 100%; max-width: 320px; text-align: left; }

.omnis-auth-form input:not([type="checkbox"]):not([type="radio"]) { height: 42px; }

/* Spécificité : .omnis-settings-card button (2 sélecteurs) l'emporterait
       sinon sur .omnis-auth-submit seul (1 sélecteur) malgré l'ordre dans la
       feuille de style — d'où l'ancêtre répété ici. */
    .omnis-auth-card .omnis-auth-submit {
      width: 100%;
      height: 42px;
      margin-top: 18px;
      border: 0;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      font-weight: 600;
      font-size: .8rem;
    }

.omnis-auth-card .omnis-auth-submit:hover:not(:disabled) { background: var(--accent-l); }

.omnis-auth-card .omnis-auth-submit:disabled { opacity: .6; cursor: default; }

.omnis-search-form {
      display: flex;
      align-items: center;
      gap: 8px;
      width: min(620px, 100%);
    }

.omnis-search-form input {
      flex: 1;
      min-width: 0;
      height: 40px;
      padding: 0 15px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
      color: var(--t-primary);
      outline: none;
      font-size: .8rem;
    }

.omnis-search-form input:focus { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-bg); }

.omnis-search-form button {
      height: 40px;
      padding: 0 15px;
      border: 0;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
      font-size: .75rem;
      font-weight: 650;
    }

.omnis-search-intro {
      padding: 28px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-glass);
    }

.omnis-search-intro h2 { margin: 0; font-size: 1.28rem; }

.omnis-search-intro p { max-width: 620px; margin: 10px 0 0; color: var(--t-dim); font-size: .8rem; line-height: 1.55; }

.omnis-search-intro div { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 20px; }

.omnis-search-intro span,
    .omnis-search-result-source {
      color: var(--t-faint);
      font-size: .66rem;
    }

.omnis-search-intro span { padding: 5px 8px; border: 1px solid var(--border); border-radius: 999px; }

.omnis-search-summary { margin: 0 0 14px; color: var(--t-faint); font-size: .73rem; }

.omnis-search-results { display: grid; gap: 8px; }

.omnis-search-result { padding: 16px; border: 1px solid var(--border); border-radius: 13px; background: var(--bg-glass); }

.omnis-search-result-source,
    .omnis-search-result-url { display: block; }

.omnis-search-result button {
      display: block;
      max-width: 100%;
      margin: 5px 0 4px;
      padding: 0;
      border: 0;
      background: none;
      color: var(--accent);
      cursor: pointer;
      font-size: .92rem;
      font-weight: 700;
      text-align: left;
    }

.omnis-search-result-url { overflow: hidden; color: var(--t-muted); font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }

.omnis-search-result p { margin: 9px 0 0; color: var(--t-dim); font-size: .75rem; line-height: 1.5; }

/* Page de résultats : agencement repris du modèle de référence — marque à
       gauche, barre de recherche large, onglets de filtre soulignés, résultats
       avec favicon, fil d'Ariane, titre en lien et extrait. */
    .omnis-serp { display: flex; flex-direction: column; min-height: 100%; }

.omnis-serp-header {
      display: flex;
      align-items: center;
      gap: 22px;
      padding: 16px 26px 0;
    }

.omnis-serp-brand {
      flex: none;
      padding: 0;
      border: 0;
      background: none;
      /* Plus de remplissage vert : contour fin sur fond vide, comme le
         logotype de l'accueil (.omnis-newtab-brand). */
      color: var(--accent);
      cursor: pointer;
      font-size: 1.6rem;
      font-weight: 600;
      letter-spacing: .18em;
      -webkit-text-stroke: 1px var(--t-primary);
      paint-order: stroke fill;
    }

/* Le mot OMNIS se contourait mal contre le fond (texte plein sans
       démarcation) — un contour fin plutôt qu'un bloc de couleur derrière,
       repris partout où le mot est utilisé comme logotype autonome. */
    .omnis-wordmark {
      -webkit-text-stroke: 1px var(--t-primary);
      paint-order: stroke fill;
    }

.omnis-serp-search {
      display: flex;
      align-items: center;
      gap: 4px;
      flex: 1;
      max-width: 700px;
      height: 46px;
      padding: 0 8px 0 16px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
    }

.omnis-serp-search:focus-within {
      border-color: transparent;
      box-shadow: 0 1px 8px rgba(0, 0, 0, .16);
    }

.omnis-serp-search-icon { display: grid; place-items: center; color: var(--t-faint); }

.omnis-serp-search input {
      flex: 1;
      min-width: 0;
      height: 100%;
      padding: 0 10px;
      border: 0;
      background: none;
      color: var(--t-primary);
      outline: none;
      font-size: .88rem;
    }

.omnis-serp-search-btn {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-serp-search-btn svg { width: 21px; height: 21px; }

.omnis-serp-search-btn:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-serp-search-submit { color: var(--accent); }

.omnis-serp-search-sep { width: 1px; height: 22px; margin: 0 4px; background: var(--border); }

/* Bouton « + » des barres de recherche et son menu d'import, repris du
       modèle : image puis fichier, ancré sous le bouton. */
    .omnis-plus-wrap { position: relative; flex: none; }

.omnis-plus-btn {
      display: grid;
      place-items: center;
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
    }

.omnis-plus-btn:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-plus-menu {
      position: absolute;
      top: calc(100% + 12px);
      left: -6px;
      z-index: 60;
      display: grid;
      min-width: 216px;
      padding: 7px;
      border: 1px solid var(--border);
      border-radius: 13px;
      background: var(--bg-primary);
      box-shadow: 0 12px 34px rgba(0, 0, 0, .18);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
    }

.omnis-plus-wrap.is-open .omnis-plus-menu { opacity: 1; visibility: visible; transform: translateY(0); }

.omnis-plus-menu button {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      padding: 10px 12px;
      border: 0;
      border-radius: 9px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .79rem;
    }

.omnis-plus-menu button:hover { background: var(--bg-glass-hov); }

.omnis-plus-menu svg { flex: none; color: var(--t-faint); }

.omnis-assistant-typing { opacity: .75; font-style: italic; }

/* Bouton « Mode IA » des barres de recherche, repris du modèle : pilule
       discrète collée aux icônes, avec l'étincelle et le libellé. */
    .omnis-ai-chip {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      flex: none;
      height: 38px;
      padding: 0 16px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-primary);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .82rem;
      font-weight: 500;
      white-space: nowrap;
    }

.omnis-ai-chip:hover { background: var(--accent-bg); border-color: var(--accent); color: var(--accent); }

/* Barre de favoris horizontale sous la barre d'adresse, comme Chrome. */
    body.omnis-desktop #preview-panel .omnis-bookmarks-bar {
      display: flex;
      align-items: center;
      gap: 2px;
      overflow-x: auto;
      padding: 4px 10px;
      border-bottom: 1px solid var(--border);
      background: var(--bg-secondary);
      scrollbar-width: none;
    }

.omnis-bookmark-chip {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      flex: none;
      max-width: 190px;
      height: 28px;
      padding: 0 9px;
      border: 0;
      border-radius: 7px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      font-size: .74rem;
    }

.omnis-bookmark-chip:hover { background: var(--bg-glass-hov); }

.omnis-bookmark-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.omnis-bookmark-chip .omnis-favicon { border: 0; background: transparent; }

.omnis-bookmarks-empty { color: var(--t-faint); font-size: .7rem; padding: 4px 6px; }

/* Accès web ouvert, mis en avant quand OMNIS n'a rien de pertinent : aller
       directement sur le site ou lancer une vraie recherche web. */
    .omnis-web-access {
      max-width: 640px;
      margin-bottom: 22px;
      padding: 18px 20px;
      border: 1px solid var(--accent);
      border-radius: 16px;
      background: var(--accent-bg);
    }

/* Variante plus discrète : les résultats existent et s'affichent quand
       même en dessous, contrairement au bandeau "aucun résultat pertinent"
       ci-dessus — pas la même gravité, pas le même poids visuel. */
    .omnis-web-access-head { display: flex; align-items: center; gap: 10px; color: var(--t-primary); font-size: .82rem; font-weight: 600; }

.omnis-web-access-head svg { color: var(--accent); flex: none; }

.omnis-web-access-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }

.omnis-web-access-primary {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      height: 40px;
      padding: 0 16px;
      border: 0;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
      font-size: .78rem;
      font-weight: 600;
    }

.omnis-web-access-primary:hover { filter: brightness(1.06); }

.omnis-web-access-primary + .omnis-web-access-primary {
      background: var(--bg-input);
      color: var(--accent);
      border: 1px solid var(--accent);
    }

.omnis-serp-count.omnis-serp-weak { color: var(--t-faint); font-style: italic; }

/* Moteurs de génération/planification : un résumé ou des étapes
       générés, toujours étiquetés et sourcés — jamais présentés avec le
       même poids visuel qu'un fait déjà vérifié par le crawl. */
    .omnis-serp-generated {
      max-width: 640px;
      margin-bottom: 18px;
      padding: 16px 18px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-secondary);
    }

.omnis-serp-generated-label {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--t-faint);
      font-size: .7rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: .02em;
    }

.omnis-serp-generated-label svg { width: 14px; height: 14px; flex: none; }

.omnis-serp-generated-text { margin: 10px 0 0; color: var(--t-primary); font-size: .86rem; line-height: 1.6; }

.omnis-serp-plan-steps { margin: 10px 0 0; padding-left: 20px; color: var(--t-primary); font-size: .86rem; line-height: 1.7; }

.omnis-serp-plan-steps li { margin-bottom: 4px; }

.omnis-serp-generated-sources { margin: 10px 0 0; color: var(--t-faint); font-size: .72rem; }

.omnis-serp-generated-sources a { color: var(--accent); text-decoration: none; }

.omnis-serp-generated-sources a:hover { text-decoration: underline; }

/* Repli Web : sortir explicitement de l'index OMNIS vers un fournisseur
       externe, clairement nommé, sans faire passer ça pour du résultat OMNIS. */
    .omnis-web-fallback {
      max-width: 640px;
      margin-top: 34px;
      padding: 20px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-glass);
    }

.omnis-web-fallback h2 { margin: 0 0 6px; font-size: .9rem; font-weight: 600; }

.omnis-web-fallback p { margin: 0 0 14px; color: var(--t-dim); font-size: .76rem; line-height: 1.55; }

.omnis-web-fallback-row { display: flex; gap: 8px; flex-wrap: wrap; }

.omnis-web-fallback-row button {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      height: 36px;
      padding: 0 14px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .75rem;
    }

.omnis-web-fallback-row button:hover { border-color: var(--accent); color: var(--accent); }

.omnis-crea-toggle img { display: block; border-radius: 3px; }

.omnis-assistant, .omnis-crea-panel {
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      z-index: 90;
      display: flex;
      flex-direction: column;
      width: 360px;
      border-left: 1px solid var(--border);
      background: var(--bg-primary);
      box-shadow: -12px 0 34px rgba(0, 0, 0, .1);
    }

.omnis-crea-embed { flex: 1; width: 100%; border: 0; background: #0d0d0d; }

.omnis-assistant-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 14px 16px;
      border-bottom: 1px solid var(--border);
    }

.omnis-assistant-title { display: flex; align-items: center; gap: 9px; font-size: .82rem; font-weight: 600; }

.omnis-assistant-close {
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-assistant-close:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-assistant-context {
      display: flex;
      align-items: center;
      gap: 8px;
      overflow: hidden;
      padding: 11px 16px;
      border-bottom: 1px solid var(--border);
      color: var(--t-faint);
      font-size: .7rem;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.omnis-assistant-embed { flex: 1; width: 100%; border: 0; background: var(--bg-primary); }

.omnis-assistant-thread { flex: 1; overflow: auto; padding: 18px 16px; display: flex; flex-direction: column; gap: 10px; }

.omnis-assistant-intro { display: grid; justify-items: center; gap: 8px; margin-top: 34%; text-align: center; }

.omnis-assistant-intro svg { color: var(--accent); }

.omnis-assistant-intro strong { font-size: .92rem; font-weight: 600; }

.omnis-assistant-intro span { max-width: 240px; color: var(--t-faint); font-size: .74rem; line-height: 1.5; }

/* Bulles asymétriques + attribution des couleurs comme la vraie extension
       CREA (sidebar.html) : le message de l'utilisateur reste neutre, seule
       la réponse de CREA porte la teinte verte — pas l'inverse. */
    .omnis-assistant-msg {
      max-width: 88%;
      padding: 8px 11px;
      font-size: .78rem;
      line-height: 1.6;
      word-break: break-word;
    }

.omnis-assistant-msg.is-user {
      align-self: flex-end;
      background: var(--bg-tertiary);
      border: 1px solid var(--border);
      border-radius: 12px 12px 2px 12px;
      color: var(--t-primary);
    }

.omnis-assistant-msg.is-omnis {
      align-self: flex-start;
      background: var(--accent-bg);
      border: 1px solid var(--border-focus);
      border-radius: 2px 12px 12px 12px;
      color: var(--t-primary);
    }

.omnis-assistant-typing { align-self: flex-start; }

.omnis-assistant-composer { flex-shrink: 0; padding: 8px 10px; }

.omnis-assistant-inbox {
      background: var(--bg-tertiary);
      border-radius: 16px;
      padding: 10px 10px 7px;
    }

.omnis-assistant-input {
      width: 100%;
      min-height: 20px;
      max-height: 90px;
      padding: 2px 4px 8px;
      border: 0;
      background: none;
      color: var(--t-primary);
      outline: none;
      resize: none;
      font: inherit;
      font-size: .78rem;
      line-height: 1.5;
      display: block;
    }

.omnis-assistant-tools { display: flex; align-items: center; gap: 6px; }

.omnis-assistant-mic {
      display: flex;
      flex: none;
      align-items: center;
      justify-content: center;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-assistant-mic:hover { color: var(--t-primary); }

.omnis-assistant-mic.is-recording { color: var(--danger); }

.omnis-assistant-mic svg { width: 15px; height: 15px; }

.omnis-assistant-tools-spacer { flex: 1; }

/* CREA en PLEINE PAGE (omnis://crea) : le fil occupe toute la zone de
       contenu, le composeur reste collé en bas — comme le Mode IA de Google,
       plus un panneau latéral étroit. */
    .omnis-crea-page {
      display: flex;
      flex-direction: column;
      gap: 14px;
      width: 100%;
      max-width: 780px;
      height: 100%;
      margin: 0 auto;
      padding: 18px 16px 16px;
      text-align: left;
    }

.omnis-crea-thread {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 16px;
      padding-right: 4px;
    }

.omnis-crea-intro { margin: auto 0; text-align: center; }

.omnis-crea-brand {
      margin: 0 0 10px;
      /* Remplissage vert + contour fin, comme les deux autres logotypes. */
      color: var(--accent);
      -webkit-text-stroke: 1px var(--t-primary);
      paint-order: stroke fill;
      font-size: 2.5rem;
      font-weight: 600;
      letter-spacing: .3em;
      text-indent: .3em;
      line-height: 1;
    }

.omnis-crea-intro p {
      margin: 0 auto;
      max-width: 460px;
      color: var(--t-muted);
      font-size: .86rem;
      line-height: 1.6;
    }

.omnis-crea-msg { display: flex; flex-direction: column; gap: 4px; }

.omnis-crea-who {
      color: var(--t-faint);
      font-size: .7rem;
      font-weight: 600;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

.omnis-crea-text {
      color: var(--t-primary);
      font-size: .92rem;
      line-height: 1.65;
      white-space: pre-wrap;
    }

.omnis-crea-msg.is-user .omnis-crea-text {
      align-self: flex-start;
      padding: 10px 14px;
      border-radius: 14px;
      background: var(--bg-secondary);
    }

.omnis-crea-typing { color: var(--t-muted); font-style: italic; }

.omnis-crea-composer {
      flex: none;
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 22px;
      background: var(--bg-input);
    }

.omnis-crea-input {
      width: 100%;
      max-height: 180px;
      border: 0;
      background: none;
      color: var(--t-primary);
      outline: none;
      resize: none;
      font: inherit;
      font-size: .95rem;
      line-height: 1.5;
    }

.omnis-crea-tools { display: flex; align-items: center; gap: 8px; }

.omnis-crea-tools-spacer { flex: 1; }

.omnis-crea-mic {
      display: grid;
      place-items: center;
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-crea-mic:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-crea-mic svg { width: 18px; height: 18px; }

.omnis-crea-send {
      display: grid;
      place-items: center;
      width: 38px;
      height: 38px;
      border: 0;
      border-radius: 50%;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
    }

.omnis-crea-send:disabled { opacity: .45; cursor: default; }

.omnis-crea-send svg { width: 18px; height: 18px; }

.omnis-assistant-model {
      flex: none;
      max-width: 150px;
      height: 26px;
      padding: 0 6px;
      border: 1px solid var(--border);
      border-radius: 13px;
      background: var(--bg-input);
      color: var(--t-secondary);
      font-size: .7rem;
      cursor: pointer;
    }

.omnis-assistant-send {
      display: grid;
      flex: none;
      place-items: center;
      width: 26px;
      height: 26px;
      border: 0;
      border-radius: 50%;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
    }

.omnis-assistant-send:disabled { background: var(--bg-tertiary); color: var(--t-faint); cursor: default; }

/* Palette de recherche d'onglets (Ctrl+Maj+A), overlay plein écran centré. */
    .omnis-tab-search {
      position: fixed;
      inset: 0;
      z-index: 95;
      display: flex;
      justify-content: center;
      padding-top: 12vh;
      background: rgba(0, 0, 0, .28);
    }

.omnis-tab-search-box {
      width: min(560px, 92vw);
      max-height: 60vh;
      display: flex;
      flex-direction: column;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-primary);
      box-shadow: 0 12px 32px rgba(0, 0, 0, .12);
      overflow: hidden;
    }

.omnis-tab-search-input-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 16px;
      border-bottom: 1px solid var(--border);
      color: var(--t-faint);
    }

.omnis-tab-search-input-row input {
      flex: 1;
      border: 0;
      background: none;
      color: var(--t-primary);
      outline: none;
      font-size: .9rem;
    }

.omnis-tab-search-input-row input:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
      border-radius: 4px;
    }

.omnis-tab-search-list { overflow: auto; padding: 6px; }

.omnis-tab-search-row {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      padding: 9px 10px;
      border: 0;
      border-radius: 10px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font: inherit;
    }

.omnis-tab-search-row:hover { background: var(--bg-glass-hov); }

.omnis-tab-search-text { flex: 1; min-width: 0; display: grid; }

.omnis-tab-search-text strong { overflow: hidden; font-size: .82rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }

.omnis-tab-search-text span { overflow: hidden; color: var(--t-faint); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }

.omnis-tab-search-row em { color: var(--accent); font-size: .66rem; font-style: normal; }

.omnis-tab-search-empty { padding: 24px; color: var(--t-faint); font-size: .8rem; text-align: center; }

/* Bouton générateur de mot de passe, injecté sous le champ Sancti ID. */
    .omnis-pass-gen-btn {
      display: flex;
      align-items: center;
      gap: 7px;
      padding: .35rem .5rem;
      border: 1px dashed var(--accent);
      border-radius: .4rem;
      background: var(--accent-bg);
      color: var(--accent);
      cursor: pointer;
      font-size: .68rem;
    }

.omnis-pass-gen-btn:hover { filter: brightness(1.05); }

.omnis-pass-gen-btn svg { flex: none; width: 13px; height: 13px; }

/* Mode lecture : contenu extrait, débarrassé de pub/nav, façon liseuse. */
    .omnis-reading-page {
      height: 100%;
      overflow-y: auto;
      background: var(--surface);
      display: flex;
      justify-content: center;
      padding: 40px 24px 80px;
    }

.omnis-reading-exit {
      position: sticky;
      top: 0;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin: 0 auto 28px;
      padding: .5rem .9rem;
      border: 1px solid var(--border);
      border-radius: .6rem;
      background: var(--panel);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .78rem;
      font-weight: 650;
      z-index: 2;
    }

.omnis-reading-exit:hover { filter: brightness(1.05); }

.omnis-reading-exit svg { flex: none; width: 15px; height: 15px; }

.omnis-reading-article {
      max-width: 680px;
      width: 100%;
      color: var(--t-primary);
      font-size: 1.05rem;
      line-height: 1.75;
    }

.omnis-reading-article h1 { font-size: 1.7rem; font-weight: 800; margin: 0 0 1.4rem; line-height: 1.3; }

.omnis-reading-article h2 { font-size: 1.3rem; font-weight: 750; margin: 1.8rem 0 .8rem; }

.omnis-reading-article h3 { font-size: 1.1rem; font-weight: 700; margin: 1.5rem 0 .6rem; }

.omnis-reading-article p { margin: 0 0 1.1rem; }

.omnis-reading-article img { max-width: 100%; border-radius: .5rem; margin: 1rem 0; }

.omnis-reading-article a { color: var(--accent); text-decoration: underline; }

.omnis-reading-article blockquote {
      margin: 1.2rem 0;
      padding: .2rem 0 .2rem 1rem;
      border-left: 3px solid var(--accent);
      color: var(--t-dim);
    }

.omnis-reading-article pre, .omnis-reading-article code {
      background: var(--accent-bg);
      border-radius: .4rem;
      font-size: .88rem;
    }

.omnis-reading-article pre { padding: .8rem 1rem; overflow-x: auto; }

.omnis-reading-article code { padding: .1rem .3rem; }

.omnis-reading-article ul, .omnis-reading-article ol { margin: 0 0 1.1rem 1.4rem; }

/* Barre de recherche dans la page (Ctrl+F), flottante au-dessus du webview actif. */
    .omnis-findbar {
      position: absolute;
      top: 12px;
      right: 12px;
      z-index: 5;
      display: flex;
      align-items: center;
      gap: 6px;
      padding: .4rem .5rem;
      border: 1px solid var(--border);
      border-radius: .6rem;
      background: var(--panel);
      box-shadow: 0 8px 24px rgba(0,0,0,.18);
      pointer-events: auto;
    }

.omnis-findbar input {
      width: 220px;
      border: none;
      background: transparent;
      color: var(--t-primary);
      font-size: .82rem;
      padding: .25rem .3rem;
      outline: none;
    }

.omnis-findbar input:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
      border-radius: 4px;
    }

.omnis-findbar-count {
      flex: none;
      min-width: 44px;
      font-size: .72rem;
      color: var(--t-muted);
      text-align: right;
    }

.omnis-findbar-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      flex: none;
      width: 26px;
      height: 26px;
      border: none;
      border-radius: .4rem;
      background: transparent;
      color: var(--t-dim);
      cursor: pointer;
    }

.omnis-findbar-btn:hover { background: var(--accent-bg); color: var(--t-primary); }

.omnis-findbar-btn svg { width: 15px; height: 15px; }

.omnis-findbar-prev svg { transform: rotate(180deg); }

/* Page « Site bloqué » du contrôle parental. */
    .omnis-blocked-page {
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 10px;
      padding: 40px 24px;
      text-align: center;
      background: var(--surface);
    }

.omnis-blocked-icon { color: var(--t-faint); }

.omnis-blocked-icon svg { width: 40px; height: 40px; }

.omnis-blocked-page h1 { margin: 0; font-size: 1.3rem; font-weight: 750; }

.omnis-blocked-page p { margin: 0 0 8px; max-width: 420px; color: var(--t-dim); font-size: .86rem; }

.omnis-blocked-back,
    .omnis-blocked-settings {
      padding: .55rem 1.1rem;
      border-radius: .6rem;
      border: 1px solid var(--border);
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .8rem;
    }

.omnis-blocked-back:hover, .omnis-blocked-settings:hover { background: var(--accent-bg); }

/* Réglages : contrôle parental — ajout/suppression de domaines bloqués. */
    .omnis-parental-add { display: flex; gap: 8px; margin: 10px 0; }

.omnis-parental-add input {
      flex: 1;
      min-width: 0;
      padding: .5rem .7rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-input);
      color: var(--t-primary);
      font-size: .82rem;
    }

.omnis-parental-add button {
      padding: .5rem 1rem;
      border: 0;
      border-radius: .5rem;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
      font-size: .82rem;
    }

.omnis-parental-list { display: grid; gap: 4px; }

.omnis-parental-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: .5rem .7rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-glass);
      font-size: .82rem;
    }

.omnis-parental-row button {
      border: 0;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
      font-size: .9rem;
    }

.omnis-parental-row button:hover { color: var(--t-primary); }

/* Synchro complète : onglets ouverts sur les autres appareils du compte. */
    .omnis-other-devices {
      margin-bottom: 16px;
      padding: 14px;
      border: 1px solid var(--border);
      border-radius: .8rem;
      background: var(--bg-glass);
    }

.omnis-other-devices h2 { margin: 0 0 10px; font-size: .82rem; font-weight: 650; color: var(--t-dim); }

.omnis-other-device { margin-bottom: 10px; }

.omnis-other-device:last-child { margin-bottom: 0; }

.omnis-other-device-name { margin: 0 0 4px; font-size: .74rem; font-weight: 600; color: var(--t-primary); }

.omnis-other-device-name small { font-weight: 400; color: var(--t-faint); }

.omnis-other-device-tab {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      padding: .4rem .5rem;
      border: 0;
      border-radius: .5rem;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      font-size: .78rem;
      text-align: left;
    }

.omnis-other-device-tab:hover { background: var(--bg-glass-hov); }

.omnis-other-device-tab span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.omnis-serp-account {
      display: grid;
      flex: none;
      place-items: center;
      width: 40px;
      height: 40px;
      border: 1px solid var(--border);
      border-radius: 50%;
      /* Plus de rond vert sur vert : fond et texte neutres, plus sobre. */
      background: var(--bg-secondary);
      color: var(--t-secondary);
      font-size: .82rem;
      font-weight: 600;
      cursor: pointer;
      font-size: .7rem;
      font-weight: 700;
    }

/* MENU ⋮ DE LA PAGE DE RÉSULTATS : dans le coin, à droite du rond de
       compte — le coin supérieur droit est l'endroit où on va chercher le menu
       d'un navigateur, et la page de résultats n'y faisait pas exception
       jusqu'ici. Ancré à droite, sinon il déborderait de la fenêtre.

       LE GROUPE DE DROITE EST POUSSÉ AU BORD. Mesuré dans l'application : le
       bandeau étant un flex simple, ses derniers éléments s'arrêtaient juste
       après la barre de recherche, à 240 px du bord — « dans le coin » était
       donc faux pour le rond de compte aussi, pas seulement pour le menu.
       Cette marge automatique repousse le groupe applications + compte + menu
       à l'extrémité, quelle que soit la largeur de la fenêtre. */
    .omnis-serp-header .omnis-ecosystem-wrap { margin-left: auto; }

.omnis-serp-menu-wrap { position: relative; flex: none; }

/* Fermer le navigateur : dernier bouton de la barre d’adresse, apres le
       menu. Meme taille et meme forme que les autres outils — c’est un
       bouton de barre, pas une exception. La marge a gauche le detache du
       menu sans le repousser au bord. */
    .omnis-fermer-navigateur {
      flex: none;
      margin-left: 2px;
    }

.omnis-serp-menu-btn {
      display: grid;
      place-items: center;
      width: 36px;
      height: 36px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-secondary);
      cursor: pointer;
    }

.omnis-serp-menu-btn:hover { background: var(--bg-hover); color: var(--t-primary); }

.omnis-serp-menu {
      display: none;
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      width: 250px;
      padding: 6px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--panel);
      box-shadow: 0 10px 30px rgba(0,0,0,.16);
      z-index: 30;
    }

.omnis-serp-menu-wrap.is-open .omnis-serp-menu { display: block; }

.omnis-serp-menu button {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 8px 10px;
      border: 0;
      border-radius: .5rem;
      background: none;
      color: var(--t-primary);
      font: inherit;
      font-size: .8rem;
      text-align: left;
      cursor: pointer;
    }

.omnis-serp-menu button:hover { background: var(--bg-hover); }

/* Menu écosystème : bouton grille façon Google, à gauche du rond de
       compte, ouvrant sur les vraies applications de l'écosystème OMNIS. */
    .omnis-ecosystem-wrap { position: relative; flex: none; }

.omnis-ecosystem-btn {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
    }

.omnis-ecosystem-btn:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-ecosystem-panel {
      position: absolute;
      top: calc(100% + 12px);
      right: -6px;
      z-index: 60;
      width: 296px;
      padding: 18px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-primary);
      box-shadow: 0 10px 28px rgba(0, 0, 0, .10);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
    }

.omnis-ecosystem-wrap.is-open .omnis-ecosystem-panel { opacity: 1; visibility: visible; transform: translateY(0); }

.omnis-ecosystem-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }

.omnis-ecosystem-tile {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      padding: 10px 4px;
      border: 0;
      border-radius: 12px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
    }

.omnis-ecosystem-tile:hover { background: var(--bg-glass-hov); }

.omnis-ecosystem-tile.is-soon { opacity: .55; }

.omnis-ecosystem-icon {
      display: grid;
      place-items: center;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      color: #fff;
      font-size: 1.05rem;
      font-weight: 700;
    }

.omnis-ecosystem-label { font-size: .68rem; text-align: center; line-height: 1.2; }

.omnis-ecosystem-soon-badge {
      position: absolute;
      top: 2px;
      right: 2px;
      padding: 1px 5px;
      border-radius: 999px;
      background: var(--bg-glass-hov);
      color: var(--t-faint);
      font-size: .56rem;
      font-weight: 600;
    }

.omnis-serp-tabs {
      display: flex;
      gap: 4px;
      padding: 10px 26px 0;
      border-bottom: 1px solid var(--border);
    }

.omnis-serp-tab {
      position: relative;
      padding: 10px 12px;
      border: 0;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
      font-size: .78rem;
    }

.omnis-serp-tab:hover { color: var(--t-primary); }

.omnis-serp-tab.is-active { color: var(--accent); }

.omnis-serp-tab.is-active::after {
      content: "";
      position: absolute;
      right: 8px;
      bottom: -1px;
      left: 8px;
      height: 3px;
      border-radius: 3px 3px 0 0;
      background: var(--accent);
    }

.omnis-serp-tools { margin-left: auto; }

.omnis-serp-body { padding: 20px 26px 40px; }

.omnis-serp-count { margin: 0 0 18px; color: var(--t-faint); font-size: .72rem; }

.omnis-serp-results { display: grid; gap: 26px; max-width: 640px; }

.omnis-serp-result-head { display: flex; align-items: center; gap: 11px; }

.omnis-favicon {
      position: relative;
      display: grid;
      flex: none;
      place-items: center;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 50%;
      background: var(--bg-glass);
      color: var(--t-dim);
      font-size: .68rem;
      font-weight: 700;
    }

.omnis-favicon img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      padding: 5px;
      background: var(--bg-input);
      object-fit: contain;
      opacity: 0;
    }

.omnis-favicon img.is-ready { opacity: 1; }

.omnis-serp-result-site { display: grid; min-width: 0; }

.omnis-serp-site-name { color: var(--t-primary); font-size: .76rem; }

.omnis-serp-site-url {
      overflow: hidden;
      color: var(--t-faint);
      font-size: .68rem;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.omnis-serp-result-more {
      display: grid;
      place-items: center;
      width: 28px;
      height: 28px;
      margin-left: 4px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
      opacity: 0;
    }

.omnis-serp-result:hover .omnis-serp-result-more { opacity: 1; }

.omnis-serp-result-more:hover { background: var(--bg-glass-hov); }

.omnis-serp-result { scroll-margin-top: 90px; }

.omnis-serp-result h3 { margin: 6px 0 0; font-size: 1.06rem; font-weight: 500; line-height: 1.35; }

.omnis-serp-result h3 a { color: var(--accent); cursor: pointer; text-decoration: none; }

.omnis-serp-result h3 a:hover { text-decoration: underline; }

.omnis-serp-snippet { margin: 4px 0 0; color: var(--t-dim); font-size: .8rem; line-height: 1.58; }

.omnis-serp-snippet b { color: var(--t-primary); font-weight: 700; }

.omnis-serp-date { color: var(--t-faint); }

.omnis-serp-provenance.is-live {
      display: inline-flex;
      align-items: center;
      padding: 1px 7px;
      border-radius: 999px;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: .64rem;
      font-weight: 600;
    }

.omnis-serp-open-badge {
      display: inline-flex;
      align-items: center;
      margin-left: 8px;
      padding: 2px 9px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-glass);
      color: var(--t-dim);
      font-size: .64rem;
      font-weight: 600;
      cursor: pointer;
    }

.omnis-serp-open-badge:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

/* Panneau d'explicabilité — pourquoi ce résultat est classé ici, à
       partir des vrais signaux déjà calculés par le moteur (rankingSignals),
       remplace l'ancien toast qui n'affichait que l'URL. */
    .omnis-serp-insights {
      position: fixed;
      z-index: 200;
      width: 240px;
      padding: 10px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg-elevated);
      box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    }

.omnis-serp-insights-title { display: flex; align-items: center; gap: 7px; font-size: .74rem; font-weight: 700; color: var(--t-primary); padding: 2px 4px 8px; }

.omnis-serp-insights-title svg { color: var(--accent); width: 15px; height: 15px; flex: none; }

.omnis-serp-insight-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 4px; border-radius: 6px; }

.omnis-serp-insight-row:hover { background: var(--bg-hover); }

.omnis-serp-insight-label { font-size: .68rem; color: var(--t-dim); }

.omnis-serp-insight-value { font-size: .68rem; font-weight: 600; color: var(--t-primary); text-align: right; }

/* « Vouliez-vous dire » : la correction était appliquée sans être dite.
       Discrète — une note, pas une alerte : rien n'a échoué, on signale juste
       ce qui a été lu autrement que ce qui a été tapé. */
    .omnis-serp-correction { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; margin: 2px 0 14px; font-size: .82rem; color: var(--t-dim); }

.omnis-serp-correction em { font-style: italic; }

.omnis-serp-correction strong { color: var(--t-primary); font-weight: 600; }

.omnis-serp-correction-go { border: 0; background: none; padding: 0; font: inherit; color: var(--accent, #3b82f6); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }

.omnis-serp-correction-go:hover { opacity: .8; }

.omnis-serp-pagination { display: flex; gap: 6px; align-items: center; margin-top: 34px; }

.omnis-serp-page {
      min-width: 32px;
      height: 32px;
      padding: 0 9px;
      border: 0;
      border-radius: 999px;
      background: none;
      color: var(--accent);
      cursor: pointer;
      font-size: .78rem;
    }

.omnis-serp-page:hover { background: var(--bg-glass-hov); }

.omnis-serp-page.is-current {
      display: grid;
      place-items: center;
      background: var(--accent-bg);
      color: var(--t-primary);
      font-weight: 700;
    }

.omnis-serp-page-step { color: var(--t-dim); }

/* Résultats Images : grille dense de vignettes, légende et source, chaque
       image venant d'une page réellement indexée. */
    .omnis-image-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
      gap: 18px 14px;
      max-width: 1180px;
    }

.omnis-image-tile { margin: 0; cursor: pointer; }

.omnis-image-frame {
      display: block;
      overflow: hidden;
      aspect-ratio: 4 / 3;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg-glass);
    }

.omnis-image-frame img { width: 100%; height: 100%; object-fit: cover; transition: transform .22s ease; }

.omnis-image-tile:hover .omnis-image-frame img { transform: scale(1.04); }

.omnis-image-tile.is-verified .omnis-image-frame { position: relative; }

.omnis-image-tile.is-verified .omnis-image-frame::after {
      content: '✓ Vérifiée';
      position: absolute;
      right: 6px;
      bottom: 6px;
      padding: 2px 7px;
      border-radius: 999px;
      background: rgba(0, 0, 0, .55);
      color: #fff;
      font-size: .62rem;
      letter-spacing: .01em;
    }

.omnis-image-tile figcaption {
      display: -webkit-box;
      overflow: hidden;
      margin-top: 8px;
      color: var(--t-primary);
      font-size: .74rem;
      line-height: 1.35;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

.omnis-image-source {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-top: 5px;
      color: var(--t-faint);
      font-size: .66rem;
    }

/* Résultats Vidéos : vignette à gauche, titre et extrait à droite. */
    .omnis-video-list { display: grid; gap: 24px; max-width: 700px; }

.omnis-video-item { display: flex; gap: 16px; }

.omnis-video-thumb {
      position: relative;
      display: grid;
      flex: none;
      place-items: center;
      overflow: hidden;
      width: 168px;
      height: 96px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg-glass);
    }

.omnis-video-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

.omnis-video-thumb em {
      position: relative;
      display: grid;
      place-items: center;
      width: 34px;
      height: 34px;
      border-radius: 50%;
      background: rgba(0, 0, 0, .55);
      color: #fff;
      font-size: .78rem;
      font-style: normal;
    }

.omnis-video-text { min-width: 0; }

.omnis-video-text h3 { margin: 5px 0 0; font-size: 1rem; font-weight: 500; line-height: 1.35; }

.omnis-video-text h3 a { color: var(--accent); cursor: pointer; text-decoration: none; }

.omnis-video-text h3 a:hover { text-decoration: underline; }

.omnis-video-meta { display: block; margin-top: 7px; color: var(--t-faint); font-size: .7rem; }

/* Résultats Actualités : source, titre, extrait, date et vignette à droite. */
    .omnis-news-list { display: grid; gap: 26px; max-width: 720px; }

.omnis-news-item { display: flex; gap: 18px; align-items: flex-start; }

.omnis-news-text { flex: 1; min-width: 0; }

.omnis-news-source { display: flex; align-items: center; gap: 8px; color: var(--t-primary); font-size: .73rem; }

.omnis-news-item h3 { margin: 8px 0 0; font-size: 1.04rem; font-weight: 500; line-height: 1.35; }

.omnis-news-item h3 a { color: var(--accent); cursor: pointer; text-decoration: none; }

.omnis-news-item h3 a:hover { text-decoration: underline; }

.omnis-news-date { display: block; margin-top: 8px; color: var(--t-faint); font-size: .7rem; }

.omnis-news-thumb {
      display: block;
      overflow: hidden;
      flex: none;
      width: 132px;
      height: 92px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg-glass);
    }

.omnis-news-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Vue Sources : les domaines réellement présents dans la page de résultats. */
    .omnis-source-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
      gap: 12px;
      max-width: 820px;
    }

.omnis-source-card {
      display: grid;
      justify-items: start;
      gap: 8px;
      padding: 18px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-glass);
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font: inherit;
    }

.omnis-source-card:hover { background: var(--bg-glass-hov); }

.omnis-source-card strong { font-size: .84rem; }

.omnis-source-card span { color: var(--t-faint); font-size: .69rem; line-height: 1.45; }

.omnis-serp-status {
      max-width: 620px;
      padding: 22px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-glass);
      color: var(--t-dim);
      font-size: .82rem;
      line-height: 1.6;
    }

.omnis-serp-status strong { color: var(--t-primary); font-size: .95rem; }

/* Indicateur de recherche en cours. Le texte reste porteur de l'information
       (« Recherche OMNIS en cours… ») parce que les animations de cette zone
       sont coupées sous prefers-reduced-motion : un spinner seul serait muet. */
    .omnis-serp-loading { display: flex; flex-direction: column; gap: 12px; }

.omnis-serp-loading-bar {
      display: block;
      height: 3px;
      border-radius: 999px;
      background: var(--bg-secondary);
      overflow: hidden;
      position: relative;
    }

.omnis-serp-loading-bar::after {
      content: '';
      position: absolute;
      inset: 0;
      width: 40%;
      border-radius: 999px;
      background: var(--accent);
      animation: omnisSerpLoading 1.1s ease-in-out infinite;
    }

.omnis-serp-retry {
      margin-top: 12px;
      padding: 8px 16px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-secondary);
      color: var(--t-primary);
      font-size: .78rem;
      cursor: pointer;
    }

.omnis-serp-retry:hover { background: var(--bg-glass-hov); }

.omnis-serp-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }

.omnis-serp-chips span {
      padding: 5px 9px;
      border: 1px solid var(--border);
      border-radius: 999px;
      color: var(--t-faint);
      font-size: .66rem;
    }

/* margin auto en haut et en bas : le bloc reste centré verticalement quand
       il y a de la place, et se cale en haut (scroll) seulement s'il déborde. */
    .omnis-newtab {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 26px;
      width: min(620px, 100%);
      margin: auto;
      padding: 32px 0;
    }

/* Logotype épuré : un contour fin sur fond vide, pas un lettrage plein en
       couleur d'accent doublé d'un trait épais de 2px d'une AUTRE couleur —
       cette combinaison donnait un rendu de bande dessinée. Poids et taille
       réduits, interlettrage élargi : la respiration fait le premium, pas
       l'épaisseur. */
    .omnis-newtab-brand {
      margin: 0;
      color: var(--accent);
      font-size: 2.5rem;
      font-weight: 600;
      letter-spacing: .3em;
      text-indent: .3em;
      line-height: 1;
      -webkit-text-stroke: 1px var(--t-primary);
      paint-order: stroke fill;
    }

.omnis-newtab-search {
      display: flex;
      align-items: center;
      gap: 6px;
      width: 100%;
      height: 58px;
      padding: 0 10px 0 20px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
    }

.omnis-newtab-search:focus-within {
      border-color: transparent;
      box-shadow: 0 1px 10px rgba(0, 0, 0, .18);
    }

.omnis-newtab-search input {
      flex: 1;
      min-width: 0;
      height: 100%;
      padding: 0 12px;
      border: 0;
      background: none;
      color: var(--t-primary);
      outline: none;
      font-size: 1.02rem;
    }

.omnis-shortcut-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(76px, 1fr));
      gap: 4px;
      width: 100%;
    }

.omnis-shortcut-tile {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 9px;
      padding: 14px 6px;
      border: 0;
      border-radius: 12px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-decoration: none;
      font: inherit;
    }

.omnis-shortcut-tile:hover { background: var(--bg-glass-hov); }

.omnis-shortcut-tile .omnis-favicon { font-size: 1.05rem; }

.omnis-shortcut-plus { color: var(--accent); font-size: 1.35rem; font-weight: 400; }

.omnis-shortcut-label {
      max-width: 88px;
      overflow: hidden;
      color: var(--t-dim);
      font-size: .7rem;
      text-align: center;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.omnis-recent {
      width: 100%;
      padding: 14px 8px 8px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-glass);
      text-align: left;
    }

.omnis-recent-head { display: flex; align-items: center; justify-content: space-between; padding: 0 10px 10px; }

.omnis-recent-head h2 { margin: 0; color: var(--t-dim); font-size: .78rem; font-weight: 600; }

.omnis-recent-menu {
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-recent-menu:hover { background: var(--bg-glass-hov); }

.omnis-recent-list { display: grid; gap: 2px; }

.omnis-recent-row {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      padding: 9px 10px;
      border: 0;
      border-radius: 10px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font: inherit;
    }

.omnis-recent-row:hover { background: var(--bg-glass-hov); }

.omnis-recent-text { display: grid; min-width: 0; }

.omnis-recent-text strong { overflow: hidden; font-size: .79rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }

.omnis-recent-text span { overflow: hidden; color: var(--t-faint); font-size: .68rem; text-overflow: ellipsis; white-space: nowrap; }

.omnis-recent-more {
      margin: 4px 0 0;
      padding: 8px 10px;
      border: 0;
      background: none;
      color: var(--accent);
      cursor: pointer;
      font-size: .74rem;
    }

.omnis-newtab-alt-engine {
      border: 0;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
      font-size: .7rem;
      text-decoration: underline;
    }

.omnis-newtab-topleft {
      position: absolute;
      top: 16px;
      left: 20px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 6px;
    }

/* Bandeau temps réel (date/heure/saison/météo) : affiché en dur sur la
       page d'accueil dès le premier écran, jamais caché derrière un clic —
       version condensée de la page omnis://actus (.omnis-actus-*). */
    .omnis-realtime-strip {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-glass);
      color: var(--t-dim);
      font-size: .72rem;
      white-space: nowrap;
    }

.omnis-realtime-clock { color: var(--t-primary); font-weight: 650; font-variant-numeric: tabular-nums; }

.omnis-realtime-sep { color: var(--t-faint); }

.omnis-realtime-weather-btn { border: 0; background: none; color: var(--accent); cursor: pointer; font: inherit; padding: 0; text-decoration: underline; }

/* PAGE ACTUS/MÉTÉO/FINANCE (omnis://actus) — la troisième surface d'OMNIS.
       Ce n'est plus une superposition : une page pleine, avec l'heure en très
       grand parce que c'est ce qu'on vient y chercher en premier. */
    .omnis-actus { display: grid; gap: 18px; }

.omnis-actus-maintenant {
      padding: 22px 24px;
      border: 1px solid var(--border);
      border-radius: 1rem;
      background: var(--bg-glass);
    }

.omnis-actus-etiquette {
      margin: 0 0 6px;
      font-size: .66rem;
      text-transform: uppercase;
      letter-spacing: .09em;
      color: var(--t-muted);
    }

.omnis-actus-heure {
      margin: 0;
      font-size: 2.6rem;
      line-height: 1.05;
      font-weight: 680;
      color: var(--t-primary);
      /* Les chiffres ne doivent pas danser à chaque minute qui passe. */
      font-variant-numeric: tabular-nums;
    }

.omnis-actus-date { margin: 6px 0 0; font-size: .85rem; color: var(--t-dim); }

.omnis-actus-meteo { margin: 10px 0 0; font-size: .85rem; color: var(--t-dim); }

/* Deux colonnes quand la place existe, une seule sinon — la page doit
       rester lisible dans une fenêtre étroite comme dans un plein écran. */
    .omnis-actus-colonnes {
      display: grid;
      gap: 16px;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

.omnis-actus-bloc {
      padding: 18px 20px;
      border: 1px solid var(--border);
      border-radius: 1rem;
      background: var(--panel);
    }

.omnis-actus-bloc h2 {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 10px;
      font-size: .95rem;
      color: var(--t-primary);
    }

.omnis-actus-vide { margin: 0; font-size: .8rem; line-height: 1.55; color: var(--t-muted); }

.omnis-actus-lien {
      margin-top: 12px;
      padding: 7px 14px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: none;
      color: var(--t-primary);
      font: inherit;
      font-size: .78rem;
      cursor: pointer;
    }

.omnis-actus-lien:hover { background: var(--bg-hover); }

/* Bouton onglets (nouveau système), voir omnisTabsButtonHtml. Posé sur la
       barre d'adresse comme n'importe quel autre bouton (rbrowser-tool-btn :
       même style que le compte, le menu ⋮, l'accueil…) — jamais un bloc
       flottant séparé au-dessus du contenu de la page. */
    .omnis-tabsbtn-wrap { position: relative; display: inline-flex; align-items: center; }

.omnis-tabsbtn-toggle { position: relative; }

.omnis-tabsbtn-count {
      position: absolute;
      top: -4px;
      right: -4px;
      min-width: 15px;
      height: 15px;
      padding: 0 3px;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      font-size: .6rem;
      font-weight: 700;
      display: grid;
      place-items: center;
    }

.omnis-tabsbtn-panel {
      display: none;
      position: absolute;
      top: calc(100% + 8px);
      left: 0;
      width: 280px;
      max-height: 60vh;
      overflow: auto;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--panel);
      box-shadow: 0 10px 30px rgba(0,0,0,.16);
      z-index: 30;
    }

.omnis-tabsbtn-wrap.is-open .omnis-tabsbtn-panel { display: block; }

.omnis-tabsbtn-empty { padding: 10px; font-size: .78rem; color: var(--t-muted); text-align: center; }

.omnis-tabsbtn-group h4 { margin: 8px 6px 4px; font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; color: var(--t-muted); }

.omnis-tabsbtn-row { display: flex; align-items: center; gap: 4px; border-radius: .5rem; }

.omnis-tabsbtn-row.is-active { background: var(--accent-bg); }

.omnis-tabsbtn-open {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 8px;
      border: 0;
      background: none;
      color: var(--t-primary);
      font-size: .78rem;
      text-align: left;
      cursor: pointer;
    }

.omnis-tabsbtn-open span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.omnis-tabsbtn-close {
      flex: none;
      width: 22px;
      height: 22px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-muted);
      cursor: pointer;
    }

.omnis-tabsbtn-close:hover { background: var(--bg-hover); }

/* LES QUATRE PANNEAUX — favoris, extensions, téléchargements, média.
       Même squelette que le panneau des onglets ci-dessus : c'est voulu, ce
       sont les mêmes gestes. Ancrés à DROITE (right: 0) et non à gauche : posés
       à l'extrémité de la barre, un panneau ancré à gauche déborderait de la
       fenêtre. */
    .omnis-panneaux { display: inline-flex; align-items: center; gap: 2px; }

.omnis-panneau-wrap { position: relative; display: inline-flex; align-items: center; }

.omnis-panneau {
      display: none;
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      width: 300px;
      padding: 6px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--panel);
      box-shadow: 0 10px 30px rgba(0,0,0,.16);
      z-index: 30;
    }

.omnis-panneau-wrap.is-open .omnis-panneau { display: block; }

.omnis-panneau-tete {
      padding: 6px 8px 8px;
      font-size: .66rem;
      text-transform: uppercase;
      letter-spacing: .06em;
      color: var(--t-muted);
    }

/* LE DÉFILEMENT est ici, sur le corps seul : la tête et le pied restent
       visibles. Sur le panneau entier, une longue liste de favoris aurait
       poussé « Tous les favoris » hors de portée. */
    .omnis-panneau-corps { max-height: 46vh; overflow-y: auto; }

.omnis-panneau-vide { padding: 14px 10px; font-size: .78rem; color: var(--t-muted); text-align: center; line-height: 1.5; }

.omnis-panneau-ligne {
      display: flex;
      align-items: center;
      gap: 4px;
      border-radius: .5rem;
      padding-right: 4px;
    }

.omnis-panneau-ligne:hover { background: var(--bg-hover); }

.omnis-panneau-ouvrir {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 7px 8px;
      border: 0;
      background: none;
      color: var(--t-primary);
      font: inherit;
      font-size: .78rem;
      text-align: left;
      cursor: pointer;
    }

.omnis-panneau-ouvrir[disabled] { opacity: .5; cursor: default; }

.omnis-panneau-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.omnis-panneau-detail { flex: none; font-size: .68rem; color: var(--t-muted); }

.omnis-panneau-lien {
      flex: none;
      border: 0;
      background: none;
      color: var(--accent);
      font: inherit;
      font-size: .72rem;
      cursor: pointer;
    }

.omnis-panneau-son {
      flex: none;
      width: 26px;
      height: 26px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-muted);
      cursor: pointer;
    }

.omnis-panneau-son:hover { background: var(--bg-glass); color: var(--t-primary); }

.omnis-panneau-pied {
      width: 100%;
      margin-top: 6px;
      padding: 8px;
      border: 0;
      border-top: 1px solid var(--border);
      border-radius: 0 0 .5rem .5rem;
      background: none;
      color: var(--accent);
      font: inherit;
      font-size: .75rem;
      cursor: pointer;
    }

.omnis-panneau-pied:hover { background: var(--bg-hover); }

/* Interrupteur des modules, repris tel quel du style de la page Extensions :
       le même objet doit se reconnaître au premier coup d'oeil aux deux
       endroits. */
    .omnis-panneau-switch { flex: none; position: relative; width: 34px; height: 19px; cursor: pointer; }

.omnis-panneau-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }

.omnis-panneau-switch span {
      position: absolute;
      inset: 0;
      border-radius: 999px;
      background: var(--border);
      transition: background .15s ease;
      pointer-events: none;
    }

.omnis-panneau-switch span::after {
      content: '';
      position: absolute;
      top: 2px;
      left: 2px;
      width: 15px;
      height: 15px;
      border-radius: 50%;
      background: #fff;
      transition: transform .15s ease;
    }

.omnis-panneau-switch input:checked + span { background: var(--accent); }

.omnis-panneau-switch input:checked + span::after { transform: translateX(15px); }

.omnis-panneau-switch input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Diffusion Chromecast : même squelette que la superposition actus/météo. */
    .omnis-cast-overlay {
      position: fixed;
      inset: 0;
      z-index: 45;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, .45);
    }

.omnis-cast-panel {
      width: min(340px, calc(100% - 40px));
      max-height: 70vh;
      overflow: auto;
      padding: 18px;
      border-radius: 1rem;
      background: var(--panel);
      border: 1px solid var(--border);
      box-shadow: 0 12px 32px rgba(0,0,0,.12);
    }

.omnis-cast-panel header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }

.omnis-cast-panel h2 { margin: 0; font-size: 1rem; }

.omnis-cast-close { border: 0; background: none; color: var(--t-muted); cursor: pointer; }

.omnis-cast-empty { margin: 0; font-size: .8rem; color: var(--t-muted); line-height: 1.5; text-align: center; padding: 8px 0; }

/* Recours quand la découverte ne trouve rien : beaucoup de réseaux ne
       transmettent pas le multicast SSDP, et l'appareil reste pourtant
       parfaitement joignable par son adresse. */
    .omnis-cast-manual {
      width: 100%;
      margin-top: 8px;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: .6rem;
      background: none;
      color: var(--t-muted);
      font: inherit;
      font-size: .8rem;
      cursor: pointer;
    }

.omnis-cast-manual:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

/* Ce que les AUTRES doivent savoir pour diffuser vers ce poste. */
    .omnis-cast-moi {
      margin: 10px 0 0;
      padding: 8px 10px;
      border-radius: .6rem;
      background: var(--bg-glass);
      color: var(--t-muted);
      font-size: .78rem;
      line-height: 1.5;
    }

.omnis-cast-moi[hidden] { display: none; }

.omnis-cast-device {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 10px 8px;
      border: 0;
      border-radius: .6rem;
      background: none;
      color: var(--t-primary);
      font-size: .82rem;
      text-align: left;
      cursor: pointer;
    }

.omnis-cast-device:hover { background: var(--bg-glass-hov); }

.omnis-cast-device-row { display: flex; align-items: center; gap: 4px; }

.omnis-cast-device-row .omnis-cast-device { flex: 1; }

.omnis-cast-device-mirror {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 34px;
      height: 34px;
      flex: none;
      border: 0;
      border-radius: .6rem;
      background: none;
      color: var(--t-muted);
      cursor: pointer;
    }

.omnis-cast-device-mirror:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

/* Miroir d'écran (app OMNIS Cast Receiver) : même schéma que
       .omnis-cast-overlay, voir le commentaire sur [hidden] ci-dessus — même
       piège, même parade. */
    .omnis-mirror-overlay {
      position: fixed;
      inset: 0;
      z-index: 45;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, .7);
    }

.omnis-mirror-overlay[hidden] { display: none; }

.omnis-mirror-panel {
      width: min(90vw, 960px);
      max-height: 90vh;
      display: flex;
      flex-direction: column;
      padding: 14px;
      border-radius: 1rem;
      background: var(--panel);
      border: 1px solid var(--border);
      box-shadow: 0 12px 32px rgba(0,0,0,.12);
    }

.omnis-mirror-panel header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }

.omnis-mirror-panel h2 { margin: 0; font-size: 1rem; }

.omnis-mirror-close { border: 0; background: none; color: var(--t-muted); cursor: pointer; }

.omnis-mirror-canvas { max-width: 100%; max-height: 75vh; border-radius: .6rem; background: #000; align-self: center; }

/* Premier lancement : un accueil semi-transparent au-dessus de tout,
       montré une seule fois (voir ensureOnboardingOverlay). */
    .omnis-onboarding-overlay {
      /* Ancree en bas, jamais au centre : le centre, c'est la barre de
         recherche. Et surtout AUCUN voile — un fond sombre plein ecran
         intercepte les clics meme la ou il n'y a rien a lire. */
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 60;
      display: flex;
      justify-content: center;
      padding: 0 16px 20px;
      background: transparent;
      /* Le conteneur laisse passer les clics ; seule la carte les recoit. */
      pointer-events: none;
    }

.omnis-onboarding-overlay > * { pointer-events: auto; }

.omnis-onboarding-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      width: min(380px, calc(100% - 40px));
      padding: 32px 28px 24px;
      border-radius: 1.1rem;
      background: var(--panel);
      border: 1px solid var(--border);
      box-shadow: 0 14px 36px rgba(0,0,0,.16);
    }

.omnis-onboarding-dots { display: flex; gap: 6px; margin-bottom: 18px; }

.omnis-onboarding-dots span { width: 6px; height: 6px; border-radius: 50%; background: var(--border); }

.omnis-onboarding-dots span.is-active { background: var(--accent); width: 18px; border-radius: 999px; }

.omnis-onboarding-icon { display: grid; place-items: center; width: 56px; height: 56px; margin-bottom: 8px; border-radius: 50%; background: var(--accent-bg); color: var(--accent); }

.omnis-onboarding-card h2 { margin: 4px 0 0; font-size: 1.05rem; }

.omnis-onboarding-card p { margin: 8px 0 0; color: var(--t-muted); font-size: .8rem; line-height: 1.5; }

.omnis-onboarding-status { font-size: .74rem !important; }

.omnis-onboarding-card button[data-omnis-onboarding-set-default] {
      margin-top: 14px;
      height: 38px;
      padding: 0 18px;
      border: 0;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      font-weight: 600;
      font-size: .78rem;
    }

.omnis-onboarding-radio { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: .8rem; color: var(--t-primary); text-align: left; }

.omnis-onboarding-actions { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-top: 22px; }

.omnis-onboarding-skip { border: 0; background: none; color: var(--t-muted); font-size: .78rem; cursor: pointer; }

.omnis-onboarding-next {
      height: 38px;
      padding: 0 22px;
      border: 0;
      border-radius: 999px;
      background: var(--accent);
      color: #fff;
      font-weight: 600;
      font-size: .78rem;
      margin-left: auto;
    }

.omnis-onboarding-next:hover { background: var(--accent-l); }

.omnis-customize {
      position: fixed;
      right: 20px;
      bottom: 20px;
      display: flex;
      align-items: center;
      gap: 8px;
      height: 38px;
      padding: 0 16px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
      color: var(--accent);
      cursor: pointer;
      font-size: .76rem;
      font-weight: 600;
      box-shadow: 0 1px 6px rgba(0, 0, 0, .12);
    }

.omnis-customize:hover { background: var(--accent-bg); }

/* Panneau « Personnaliser OMNIS », façon panneau latéral de Chrome. */
    .omnis-customize-panel {
      position: fixed;
      top: 20px;
      right: 20px;
      bottom: 20px;
      z-index: 6;
      display: flex;
      flex-direction: column;
      gap: 18px;
      width: 300px;
      padding: 18px;
      overflow-y: auto;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-primary);
      box-shadow: 0 8px 24px rgba(0,0,0,.10);
    }

.omnis-customize-panel header { display: flex; align-items: center; justify-content: space-between; }

.omnis-customize-panel h2 { margin: 0; font-size: .92rem; font-weight: 700; }

.omnis-customize-panel h3 { margin: 0 0 10px; color: var(--t-dim); font-size: .74rem; font-weight: 650; }

.omnis-customize-close {
      display: grid;
      place-items: center;
      width: 28px;
      height: 28px;
      border: 0;
      border-radius: 50%;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

.omnis-customize-close:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

.omnis-customize-close svg { width: 14px; height: 14px; }

.omnis-customize-swatches { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 10px; }

.omnis-customize-default {
      grid-column: span 4;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .74rem;
    }

.omnis-customize-default.is-active,
    .omnis-customize-swatch.is-active {
      outline: 2px solid var(--accent);
      outline-offset: 2px;
    }

.omnis-customize-swatch {
      aspect-ratio: 1;
      border: 1px solid var(--border);
      border-radius: 8px;
      cursor: pointer;
      padding: 0;
    }

.omnis-customize-upload {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      width: 100%;
      padding: 9px;
      border: 1px dashed var(--border);
      border-radius: 8px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      font-size: .78rem;
    }

.omnis-customize-upload:hover { background: var(--bg-glass-hov); }

.omnis-customize-upload svg { width: 15px; height: 15px; }

.omnis-customize-toggle {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 7px 2px;
      color: var(--t-primary);
      font-size: .78rem;
      cursor: pointer;
    }

/* Réglages : barre latérale de navigation à gauche et panneau en cartes à
       droite, comme la page de paramètres du modèle. */
    .omnis-settings-page { display: flex; align-items: flex-start; min-height: 100%; }

.omnis-settings-nav {
      position: sticky;
      top: 0;
      flex: none;
      width: 236px;
      padding: 26px 12px 40px;
    }

.omnis-settings-nav-title {
      padding: 0 14px 18px;
      color: var(--t-primary);
      font-size: 1.16rem;
      font-weight: 600;
    }

.omnis-settings-nav-item {
      display: flex;
      align-items: center;
      gap: 13px;
      width: 100%;
      padding: 10px 14px;
      border: 0;
      border-radius: 0 999px 999px 0;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
      text-align: left;
      font-size: .8rem;
    }

.omnis-settings-nav-item:hover { background: var(--bg-glass-hov); }

.omnis-settings-nav-item.is-active { background: var(--accent-bg); color: var(--accent); font-weight: 600; }

.omnis-settings-nav-icon { width: 18px; text-align: center; font-size: .86rem; }

.omnis-settings-main {
      flex: 1;
      min-width: 0;
      max-width: 760px;
      padding: 26px 30px 60px;
    }

.omnis-settings-main h1 { margin: 0 0 20px; font-size: 1.32rem; font-weight: 600; }

.omnis-settings-main .omnis-settings-card { margin-bottom: 12px; }

.omnis-settings-card.omnis-settings-profile { display: flex; flex-direction: row; align-items: center; gap: 15px; }

.omnis-settings-avatar {
      display: grid;
      flex: none;
      place-items: center;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: .86rem;
      font-weight: 800;
    }

.omnis-settings-profile-text { flex: 1; min-width: 0; display: grid; }

.omnis-settings-profile-text strong { font-size: .85rem; font-weight: 600; }

.omnis-settings-profile-text span { overflow: hidden; color: var(--t-faint); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }

.omnis-settings-action { flex: none; }

.omnis-settings-action.is-primary {
      border-color: transparent !important;
      background: var(--accent) !important;
      color: #fff !important;
    }

.omnis-settings-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      margin-bottom: 12px;
      padding: 16px 18px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-glass);
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .82rem;
    }

.omnis-settings-row:hover { background: var(--bg-glass-hov); }

.omnis-settings-row em { color: var(--t-faint); font-size: 1.05rem; font-style: normal; }

/* Espace compte complet : navigation latérale, identité en grand format et
       sections détaillées, sur le modèle d'un vrai espace de gestion de compte. */
    .omnis-account-page { display: flex; align-items: flex-start; min-height: 100%; }

.omnis-account-page:not(.has-nav) {
      display: grid;
      justify-items: center;
      padding: 56px 24px;
    }

.omnis-account-hero-lg { display: grid; justify-items: center; margin-bottom: 30px; text-align: center; }

.omnis-account-hero-lg h1 { margin: 16px 0 6px; font-size: 1.5rem; font-weight: 600; }

.omnis-account-hero-lg p { margin: 0; color: var(--t-faint); font-size: .8rem; }

.omnis-account-signin { width: min(440px, 100%); }

.omnis-account-hero-avatar {
      display: grid;
      place-items: center;
      width: 84px;
      height: 84px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: 1.7rem;
      font-weight: 800;
      letter-spacing: .02em;
    }

.omnis-account-nav {
      position: sticky;
      top: 0;
      flex: none;
      width: 246px;
      padding: 26px 12px 40px;
    }

.omnis-account-nav-brand { padding: 0 14px 18px; font-size: 1.14rem; font-weight: 600; }

.omnis-account-nav-item {
      display: flex;
      align-items: center;
      gap: 13px;
      width: 100%;
      padding: 11px 14px;
      border: 0;
      border-radius: 999px;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
      text-align: left;
      font-size: .8rem;
    }

.omnis-account-nav-item:hover { background: var(--bg-glass-hov); }

.omnis-account-nav-item.is-active { background: var(--accent-bg); color: var(--accent); font-weight: 600; }

.omnis-account-nav-icon {
      display: grid;
      place-items: center;
      width: 26px;
      height: 26px;
      border-radius: 50%;
      background: var(--bg-glass);
      font-size: .74rem;
    }

.omnis-account-nav-item.is-active .omnis-account-nav-icon { background: var(--bg-primary); }

.omnis-account-main { flex: 1; min-width: 0; max-width: 780px; padding: 26px 30px 64px; }

.omnis-account-identity { display: grid; justify-items: center; margin-bottom: 30px; text-align: center; }

.omnis-account-identity strong { margin-top: 14px; font-size: 1.22rem; font-weight: 600; }

.omnis-account-identity-mail { margin-top: 3px; color: var(--t-faint); font-size: .78rem; }

.omnis-account-main h1 { margin: 0 0 8px; font-size: 1.28rem; font-weight: 600; }

.omnis-account-lede { margin: 0 0 22px; color: var(--t-dim); font-size: .82rem; line-height: 1.6; }

.omnis-account-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }

.omnis-account-chips button {
      height: 34px;
      padding: 0 15px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-glass);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .75rem;
    }

.omnis-account-chips button:hover { background: var(--bg-glass-hov); border-color: var(--accent); color: var(--accent); }

.omnis-account-main .omnis-settings-card { margin-bottom: 12px; }

.omnis-account-facts { display: grid; gap: 14px; width: 100%; }

.omnis-account-facts span { display: grid; gap: 3px; font-size: .8rem; }

.omnis-account-facts em { color: var(--t-faint); font-size: .68rem; font-style: normal; }

/* Page Extensions : fiches en grille avec identité du module, description,
       identifiant et interrupteur, sur le modèle d'une page de gestion. */
    .omnis-ext-page { max-width: 1140px; margin: 0 auto; padding: 30px 30px 60px; }

.omnis-ext-header { margin-bottom: 26px; }

.omnis-ext-header h1 { margin: 0 0 8px; font-size: 1.32rem; font-weight: 600; }

.omnis-ext-header p { max-width: 640px; margin: 0; color: var(--t-dim); font-size: .8rem; line-height: 1.6; }

.omnis-ext-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; }

.omnis-ext-card {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      min-height: 186px;
      padding: 20px;
      border: 1px solid var(--border);
      border-radius: 16px;
      background: var(--bg-secondary);
    }

.omnis-ext-head { display: flex; gap: 14px; }

.omnis-ext-icon {
      display: grid;
      flex: none;
      place-items: center;
      width: 38px;
      height: 38px;
      border-radius: 10px;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: .95rem;
      font-weight: 800;
    }

.omnis-ext-head strong { font-size: .88rem; font-weight: 600; }

.omnis-ext-head em { color: var(--t-faint); font-size: .7rem; font-style: normal; }

.omnis-ext-head p { margin: 7px 0 0; color: var(--t-dim); font-size: .74rem; line-height: 1.55; }

.omnis-ext-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 18px;
      padding-top: 14px;
      border-top: 1px solid var(--border);
    }

.omnis-ext-id { overflow: hidden; color: var(--t-faint); font-size: .66rem; text-overflow: ellipsis; white-space: nowrap; }

.omnis-ext-open {
      height: 30px;
      padding: 0 14px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: transparent;
      color: var(--accent);
      cursor: pointer;
      font-size: .72rem;
    }

.omnis-ext-open:hover { background: var(--accent-bg); }

.omnis-ext-switch { position: relative; flex: none; width: 38px; height: 20px; cursor: pointer; }

.omnis-ext-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }

.omnis-ext-switch span {
      display: block;
      width: 100%;
      height: 100%;
      border-radius: 999px;
      background: var(--border);
      transition: background-color .18s ease;
      pointer-events: none;
    }

.omnis-ext-switch span::after {
      content: "";
      position: absolute;
      top: 3px;
      left: 3px;
      width: 14px;
      height: 14px;
      border-radius: 50%;
      background: var(--bg-primary);
      transition: transform .18s ease;
    }

.omnis-ext-switch input:checked + span { background: var(--accent); }

.omnis-ext-switch input:checked + span::after { transform: translateX(18px); }

.omnis-account-readonly {
      width: 100%;
      padding: 10px 13px;
      border: 1px solid var(--border);
      border-radius: 9px;
      background: var(--bg-input);
      color: var(--t-dim);
      font-size: .78rem;
    }

.omnis-internal-actions button:disabled {
      opacity: .4;
      cursor: default;
    }

.omnis-internal-list {
      display: flex;
      flex-direction: column;
      border: 1px solid var(--border);
      border-radius: 14px;
      overflow: hidden;
      background: var(--bg-secondary);
    }

.omnis-internal-row {
      display: flex;
      align-items: center;
      gap: 18px;
      min-height: 74px;
      padding: 13px 16px;
      border-bottom: 1px solid var(--border);
    }

.omnis-internal-row:last-child { border-bottom: 0; }

.omnis-internal-row[hidden] { display: none; }

.omnis-terminal-host {
      border: 1px solid var(--border);
      border-radius: 14px;
      overflow: hidden;
      background: #14161c;
      height: calc(100vh - 220px);
      min-height: 320px;
    }

.omnis-terminal-canvas {
      width: 100%;
      height: 100%;
      padding: 8px;
      box-sizing: border-box;
    }

.omnis-terminal-canvas .xterm { height: 100%; }

.omnis-docker-network-toggle {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: .78rem;
      color: var(--t-dim);
    }

.omnis-docker-host {
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 16px;
      background: var(--bg-secondary);
    }

.omnis-docker-status { margin: 0 0 12px; color: var(--t-dim); font-size: .8rem; }

.omnis-docker-command {
      width: 100%;
      box-sizing: border-box;
      resize: vertical;
      min-height: 64px;
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-input);
      color: var(--t-primary);
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: .82rem;
    }

.omnis-docker-actions { display: flex; gap: 8px; margin: 10px 0; }

.omnis-docker-output {
      margin: 0;
      padding: 12px;
      border-radius: 10px;
      background: #14161c;
      color: #e8eaed;
      font-family: 'JetBrains Mono', ui-monospace, monospace;
      font-size: .78rem;
      min-height: 220px;
      max-height: calc(100vh - 420px);
      overflow: auto;
      white-space: pre-wrap;
      word-break: break-word;
    }

.omnis-agent-host { display: flex; flex-direction: column; gap: 12px; }

.omnis-agent-dashboard {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 14px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-secondary);
    }

.omnis-agent-live-status {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: var(--t-primary);
      font-size: .82rem;
      font-weight: 650;
    }

.omnis-agent-status-dot,
    .omnis-agent-phase-dot {
      display: inline-block;
      width: 8px;
      height: 8px;
      flex: 0 0 8px;
      border-radius: 50%;
      background: var(--t-faint);
    }

.omnis-agent-live-status[data-state="running"] .omnis-agent-status-dot,
    .omnis-agent-phase[data-state="active"] .omnis-agent-phase-dot { background: var(--accent); }

.omnis-agent-live-status[data-state="success"] .omnis-agent-status-dot,
    .omnis-agent-phase[data-state="success"] .omnis-agent-phase-dot { background: #17803d; }

.omnis-agent-live-status[data-state="error"] .omnis-agent-status-dot,
    .omnis-agent-phase[data-state="error"] .omnis-agent-phase-dot { background: #c5221f; }

.omnis-agent-live-status[data-state="cancelled"] .omnis-agent-status-dot,
    .omnis-agent-phase[data-state="cancelled"] .omnis-agent-phase-dot { background: #8a6d1d; }

.omnis-agent-phases {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 7px;
    }

.omnis-agent-phase {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      column-gap: 6px;
      row-gap: 2px;
      min-width: 0;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: 9px;
      background: var(--bg-input);
      color: var(--t-dim);
      font-size: .72rem;
    }

.omnis-agent-phase[data-state="active"] { border-color: var(--accent); color: var(--t-primary); }

.omnis-agent-phase[data-state="success"] { border-color: #17803d; color: var(--t-primary); }

.omnis-agent-phase[data-state="error"] { border-color: #c5221f; color: var(--t-primary); }

.omnis-agent-phase[data-state="cancelled"] { border-color: #8a6d1d; color: var(--t-primary); }

.omnis-agent-phase-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.omnis-agent-phase-detail {
      grid-column: 2;
      overflow: hidden;
      color: var(--t-faint);
      font-size: .66rem;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.omnis-agent-capabilities {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

.omnis-agent-capabilities span {
      padding: 4px 7px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--bg-input);
      color: var(--t-faint);
      font-size: .69rem;
    }

.omnis-agent-visual-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding-top: 2px;
    }

.omnis-agent-visual-head div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.omnis-agent-visual-head strong { color: var(--t-primary); font-size: .8rem; }

.omnis-agent-visual-head span { color: var(--t-faint); font-size: .68rem; }

.omnis-agent-visual-head button { white-space: nowrap; }

.omnis-agent-visual-frame {
      position: relative;
      min-height: 92px;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: #101216;
    }

.omnis-agent-visual-empty { margin: 0; padding: 26px 14px; color: var(--t-faint); font-size: .78rem; text-align: center; }

.omnis-agent-visual-canvas { position: relative; line-height: 0; }

.omnis-agent-visual-canvas img { display: block; width: 100%; height: auto; }

.omnis-agent-visual-target {
      position: absolute;
      z-index: 1;
      display: grid;
      place-items: center;
      width: 20px;
      height: 20px;
      margin: -10px 0 0 -10px;
      border: 2px solid #ffffff;
      border-radius: 50%;
      background: #1769aa;
      color: #ffffff;
      box-shadow: 0 0 0 2px #101216;
      cursor: pointer;
      font: 700 10px/1 'JetBrains Mono', ui-monospace, monospace;
    }

.omnis-agent-visual-target[data-risk="medium"] { background: #9a6700; }

.omnis-agent-visual-target[data-risk="high"] { background: #c5221f; }

.omnis-agent-visual-target:hover,
    .omnis-agent-visual-target:focus-visible { transform: scale(1.16); outline: 2px solid var(--accent); outline-offset: 2px; }

.omnis-agent-approval {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 10px;
      border: 1px solid #9a6700;
      border-radius: 10px;
      background: #2b2107;
      color: #fff4d6;
      font-size: .76rem;
      line-height: 1.35;
    }

.omnis-agent-approval-actions { display: flex; gap: 6px; flex: 0 0 auto; }

.omnis-agent-approval-actions button { padding: .4rem .55rem; font-size: .72rem; }

@media (max-width: 780px) {
      .omnis-agent-phases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .omnis-agent-visual-head { align-items: flex-start; flex-direction: column; }
    }

.omnis-agent-goal-form {
      display: flex;
      flex-direction: column;
      gap: 8px;
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 14px;
      background: var(--bg-secondary);
    }

.omnis-agent-goal-input {
      width: 100%;
      box-sizing: border-box;
      resize: vertical;
      min-height: 52px;
      padding: 10px 12px;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--bg-input);
      color: var(--t-primary);
      font-size: .85rem;
    }

.omnis-agent-actions { display: flex; gap: 8px; }

.omnis-agent-transcript {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-height: 160px;
      max-height: calc(100vh - 380px);
      overflow: auto;
    }

.omnis-agent-entry {
      padding: 10px 12px;
      border-radius: 10px;
      font-size: .82rem;
      line-height: 1.5;
      white-space: pre-wrap;
      word-break: break-word;
      border: 1px solid var(--border);
    }

.omnis-agent-entry-goal { background: var(--accent-bg); color: var(--accent); font-weight: 600; border-color: transparent; }

.omnis-agent-entry-thought { background: var(--bg-secondary); color: var(--t-faint); font-style: italic; }

.omnis-agent-entry-action { background: var(--bg-secondary); color: var(--t-primary); font-family: 'JetBrains Mono', ui-monospace, monospace; }

.omnis-agent-entry-result { background: #14161c; color: #e8eaed; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .76rem; }

.omnis-agent-entry-assistant { background: var(--bg-secondary); color: var(--t-dim); }

.omnis-agent-entry-error { background: color-mix(in srgb, #d93025 15%, transparent); color: #d93025; border-color: color-mix(in srgb, #d93025 35%, var(--border)); }

.omnis-agent-entry-final { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--t-primary); font-weight: 600; border-color: color-mix(in srgb, var(--accent) 35%, var(--border)); }

.omnis-internal-row.is-read { opacity: .6; }

/* Effacer les données de navigation par période (page Historique). */
    .omnis-clear-range-wrap { position: relative; }

.omnis-clear-range-btn {
      padding: .5rem .8rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .78rem;
    }

.omnis-clear-range-btn:hover { background: var(--accent-bg); }

.omnis-clear-range-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      z-index: 20;
      display: grid;
      min-width: 200px;
      padding: 6px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--bg-primary);
      box-shadow: 0 12px 34px rgba(0,0,0,.18);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-4px);
      transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
    }

.omnis-clear-range-wrap.is-open .omnis-clear-range-menu { opacity: 1; visibility: visible; transform: translateY(0); }

.omnis-clear-range-menu button {
      display: block;
      width: 100%;
      padding: .5rem .7rem;
      border: 0;
      border-radius: .45rem;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .78rem;
    }

.omnis-clear-range-menu button:hover { background: var(--bg-glass-hov); }

/* Permissions par site (Réglages > Confidentialité et sécurité). */
    .omnis-permission-list { display: grid; gap: 4px; margin-top: 8px; }

.omnis-permission-row {
      display: grid;
      grid-template-columns: 1.4fr 1fr auto auto;
      align-items: center;
      gap: 10px;
      padding: .5rem .6rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-glass);
      font-size: .78rem;
    }

.omnis-permission-origin { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }

.omnis-permission-type { color: var(--t-dim); }

.omnis-permission-decision { font-size: .72rem; font-weight: 650; }

.omnis-permission-decision.is-granted { color: #1f9d55; }

.omnis-permission-decision.is-denied { color: #dc2626; }

.omnis-permission-row button {
      padding: .35rem .6rem;
      border: 1px solid var(--border);
      border-radius: .4rem;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .72rem;
    }

.omnis-permission-row button:hover { background: var(--accent-bg); }

.omnis-permission-empty { margin: 6px 0 0; color: var(--t-faint); font-size: .76rem; }

/* Gestionnaire de mots de passe. */
    .omnis-password-add {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr auto auto;
      gap: 8px;
      align-items: center;
      margin-bottom: 16px;
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: .7rem;
      background: var(--bg-glass);
    }

.omnis-password-add input {
      padding: .5rem .7rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-input);
      color: var(--t-primary);
      font-size: .8rem;
    }

.omnis-password-add button {
      padding: .5rem .8rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .8rem;
    }

.omnis-password-add button.is-primary { background: var(--accent); border-color: var(--accent); color: #fff; }

.omnis-password-add button svg { width: 15px; height: 15px; }

.omnis-password-error { grid-column: 1 / -1; margin: 0; min-height: 1em; color: #dc2626; font-size: .72rem; }

.omnis-password-revealed { margin-left: 8px; font-family: ui-monospace, monospace; color: var(--accent); font-size: .78rem; }

/* Navigation privée : badge toujours visible + thème sombre dédié. */
    .omnis-incognito-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex: none;
      height: 28px;
      margin-right: 8px;
      padding: 0 10px;
      border-radius: 999px;
      background: #2a2a30;
      color: #e7e7ea;
      font-size: .72rem;
      font-weight: 600;
    }

.omnis-incognito-badge svg { width: 14px; height: 14px; }

/* Panneau « infos du site » (cadenas cliquable). */
    .omnis-site-info-btn.is-insecure { color: #dc2626; }

.omnis-site-info-panel {
      position: fixed;
      z-index: 70;
      width: 300px;
      padding: 14px;
      border: 1px solid var(--border);
      border-radius: .8rem;
      background: var(--bg-primary);
      box-shadow: 0 8px 24px rgba(0,0,0,.10);
    }

.omnis-site-info-head { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 12px; }

.omnis-site-info-head svg { flex: none; width: 20px; height: 20px; color: var(--t-dim); margin-top: 2px; }

.omnis-site-info-head strong { display: block; font-size: .84rem; word-break: break-all; }

.omnis-site-info-head span { display: block; margin-top: 2px; color: var(--t-faint); font-size: .72rem; }

.omnis-site-info-section h3 { margin: 0 0 8px; font-size: .74rem; font-weight: 650; color: var(--t-dim); }

.omnis-site-info-permission {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: .4rem 0;
      font-size: .76rem;
      border-top: 1px solid var(--border);
    }

.omnis-site-info-permission span:first-child { flex: 1; }

.omnis-site-info-permission button {
      border: 1px solid var(--border);
      border-radius: .4rem;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .68rem;
      padding: .25rem .5rem;
    }

.omnis-site-info-empty { margin: 0; color: var(--t-faint); font-size: .74rem; }

.omnis-site-info-theme { display: flex; align-items: center; gap: 8px; font-size: .76rem; cursor: pointer; }

/* Page d'erreur réseau/hors-ligne propre OMNIS. */
    .omnis-network-error-page {
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 40px 24px;
      text-align: center;
      background: var(--surface);
    }

.omnis-network-error-icon { color: var(--t-faint); }

.omnis-network-error-page.is-cert-error .omnis-network-error-icon { color: #dc2626; }

.omnis-network-error-page.is-crashed .omnis-network-error-icon { color: #d97706; }

.omnis-network-error-icon svg { width: 40px; height: 40px; }

.omnis-network-error-page h1 { margin: 6px 0 0; font-size: 1.25rem; font-weight: 750; }

.omnis-network-error-page p { margin: 0; max-width: 440px; color: var(--t-dim); font-size: .85rem; }

.omnis-network-error-url { color: var(--t-faint) !important; font-size: .74rem !important; word-break: break-all; }

.omnis-network-error-retry {
      margin-top: 10px;
      padding: .55rem 1.1rem;
      border: 1px solid var(--border);
      border-radius: .6rem;
      background: var(--bg-input);
      color: var(--t-primary);
      cursor: pointer;
      font-size: .8rem;
    }

.omnis-network-error-retry:hover { background: var(--accent-bg); }

.omnis-site-info-settings {
      width: 100%;
      margin-top: 12px;
      padding: .5rem;
      border: 0;
      border-top: 1px solid var(--border);
      background: none;
      color: var(--accent);
      cursor: pointer;
      font-size: .76rem;
      text-align: left;
    }

.omnis-internal-row-main {
      display: flex;
      flex: 1;
      min-width: 0;
      flex-direction: column;
      gap: 3px;
    }

.omnis-internal-row-main strong,
    .omnis-internal-row-main span {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

.omnis-internal-row-main strong { font-size: .8rem; }

.omnis-internal-row-main span { color: var(--t-dim); font-size: .7rem; }

.omnis-internal-row-main small { color: var(--t-faint); font-size: .64rem; }

.omnis-internal-actions {
      display: flex;
      flex-shrink: 0;
      gap: 6px;
    }

.omnis-internal-empty {
      padding: 54px 24px;
      color: var(--t-faint);
      text-align: center;
      font-size: .78rem;
    }

.omnis-settings-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

.omnis-settings-card {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 10px;
      padding: 18px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: var(--bg-secondary);
    }

.omnis-settings-card h2 { margin: 0; font-size: .9rem; }

.omnis-engine-status-loading { color: var(--t-faint); font-size: .78rem; }

.omnis-engine-status-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; padding: 4px 0; font-size: .78rem; }

.omnis-engine-status-row span { color: var(--t-dim); }

.omnis-engine-status-row strong { color: var(--t-primary); font-weight: 600; text-align: right; }

.omnis-help-shortcuts { display: grid; gap: 2px; margin-top: 8px; }

.omnis-help-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      padding: 8px 4px;
      border-bottom: 1px solid var(--border-dim, var(--border));
      font-size: .78rem;
    }

.omnis-help-row:last-child { border-bottom: 0; }

.omnis-help-row kbd {
      flex: none;
      padding: 3px 8px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--bg-input);
      color: var(--t-primary);
      font-family: inherit;
      font-size: .72rem;
      white-space: nowrap;
    }

.omnis-help-row span { color: var(--t-muted); text-align: right; }

.omnis-settings-hint { margin: 0; font-size: .72rem; color: var(--t-muted); }

.omnis-settings-card p { margin: 0 0 4px; color: var(--t-dim); font-size: .72rem; line-height: 1.45; }

.omnis-settings-card label { display: flex; align-items: center; gap: 8px; font-size: .76rem; }

.omnis-settings-card select { width: 100%; min-width: 0; border-radius: 8px; }

@media (max-width: 760px) {
      .omnis-internal-page { width: calc(100% - 24px); padding-top: 24px; }
      .omnis-internal-header { align-items: stretch; flex-direction: column; }
      .omnis-internal-tools { justify-content: flex-start; }
      .omnis-internal-tools input { flex: 1; min-width: 180px; }
      .omnis-settings-grid { grid-template-columns: 1fr; }
      .omnis-internal-row { align-items: flex-start; flex-direction: column; }
      .omnis-internal-actions { width: 100%; }
    }

.omnis-split-divider {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 50%;
      width: 4px;
      margin-left: -2px;
      background: var(--border);
      z-index: 5;
      pointer-events: none;
    }

.omnis-split-close {
      position: absolute;
      top: 8px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 6;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 26px;
      height: 26px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: var(--panel);
      color: var(--t-primary);
      cursor: pointer;
    }

.omnis-split-close svg { width: 12px; height: 12px; }

.omnis-split-close:hover { background: var(--accent-bg); color: var(--accent); }

.omnis-crash-banner {
      position: fixed;
      top: 38px;
      left: 0;
      right: 0;
      z-index: 30;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 16px;
      background: #fef3c7;
      color: #78350f;
      border-bottom: 1px solid #f59e0b;
      font-size: .8rem;
    }

.omnis-crash-banner-icon svg { width: 16px; height: 16px; }

.omnis-crash-banner p { flex: 1; min-width: 0; margin: 0; }

.omnis-crash-banner button {
      padding: .3rem .7rem;
      border-radius: .4rem;
      border: 1px solid #f59e0b;
      background: #fff;
      color: #78350f;
      font-size: .76rem;
      cursor: pointer;
      white-space: nowrap;
    }

.omnis-crash-banner button[data-omnis-crash-restore] { background: #f59e0b; color: #fff; border-color: #f59e0b; }

.omnis-crash-banner-close { display: flex; align-items: center; justify-content: center; padding: .3rem; }

.omnis-crash-banner-close svg { width: 12px; height: 12px; }

.omnis-search-engine-banner {
      position: fixed;
      top: 38px;
      left: 0;
      right: 0;
      z-index: 29;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 16px;
      background: var(--accent-bg);
      color: var(--t-primary);
      border-bottom: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
      font-size: .8rem;
    }

.omnis-search-engine-banner-icon { flex: none; color: var(--accent); display: flex; }

.omnis-search-engine-banner-icon svg { width: 16px; height: 16px; }

.omnis-search-engine-banner p { flex: 1; min-width: 0; margin: 0; }

.omnis-search-engine-banner button[data-omnis-search-engine-yes] {
      padding: .3rem .7rem;
      border-radius: .4rem;
      border: 1px solid var(--accent);
      background: var(--accent);
      color: #fff;
      font-size: .76rem;
      cursor: pointer;
      white-space: nowrap;
    }

.omnis-search-engine-banner-close { display: flex; align-items: center; justify-content: center; padding: .3rem; border: 0; background: none; color: var(--t-dim); cursor: pointer; }

.omnis-search-engine-banner-close svg { width: 12px; height: 12px; }

.omnis-spellcheck-langs { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }

.omnis-spellcheck-row { display: flex; align-items: center; gap: 8px; font-size: .82rem; }

.omnis-autofill-add {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      margin: 10px 0 16px;
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: .7rem;
    }

.omnis-autofill-add input,
    .omnis-autofill-add select {
      flex: 1 1 160px;
      min-width: 120px;
      padding: .5rem .7rem;
      border: 1px solid var(--border);
      border-radius: .5rem;
      background: var(--bg-input);
      color: var(--t-primary);
      font-size: .8rem;
    }

.omnis-autofill-add label { display: flex; align-items: center; gap: 6px; font-size: .78rem; color: var(--t-dim); flex: 1 1 200px; }

.omnis-autofill-add label select { flex: 1 1 70px; min-width: 60px; }

.omnis-autofill-add button {
      padding: .5rem .8rem;
      border: 1px solid var(--accent);
      border-radius: .5rem;
      background: var(--accent);
      color: #fff;
      cursor: pointer;
      font-size: .8rem;
      flex: none;
    }

.omnis-autofill-cvc-note { flex-basis: 100%; margin: 0; font-size: .68rem; color: var(--t-faint); }

.omnis-autofill-picker { display: flex; flex-direction: column; min-width: 200px; }

.omnis-menu-sep-label { padding: .3rem .6rem; font-size: .68rem; color: var(--t-faint); font-weight: 600; }

/* Autocompletion : la liste se pose SOUS le champ sans pousser la page,
       sinon les resultats sauteraient a chaque frappe. */
    .omnis-serp-suggestions { position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 40;
      background: var(--panel); border: 1px solid var(--border); border-radius: 12px; overflow: hidden;
      box-shadow: 0 8px 24px rgba(0,0,0,.12); display: flex; flex-direction: column; }

.omnis-serp-suggestions[hidden] { display: none; }

.omnis-serp-suggestion { appearance: none; border: 0; background: transparent; text-align: left;
      padding: 10px 16px; font: inherit; color: inherit; cursor: pointer; }

.omnis-serp-suggestion:hover, .omnis-serp-suggestion:focus { background: var(--surface-2, rgba(0,0,0,.06)); }

.omnis-serp-search { position: relative; }

/* Reponse directe : lisible d un coup d oeil, mais jamais au point de faire
       disparaitre les resultats — elle les accompagne. */
    .omnis-serp-direct { border: 1px solid var(--border); border-radius: 14px; padding: 18px 20px; margin: 0 0 18px; background: var(--panel); }

.omnis-serp-direct-valeur { font-size: 30px; font-weight: 650; line-height: 1.15; font-variant-numeric: tabular-nums; }

.omnis-serp-direct-detail { margin-top: 4px; font-size: 15px; opacity: .85; font-variant-numeric: tabular-nums; }

.omnis-serp-direct-source { margin-top: 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; opacity: .55; }

/* Ecriture : lisible avant tout. Une colonne etroite, un texte qui respire —
       cest un texte quon lit, pas quon survole. */
    .omnis-ecriture-page { max-width: 720px; margin: 0 auto; padding: 32px 24px 64px; }

.omnis-ecriture-tete h1 { font-size: 30px; margin: 0 0 4px; }

.omnis-ecriture-sous { margin: 0 0 28px; opacity: .7; font-size: 14px; }

.omnis-ecriture-jour { border: 1px solid var(--border); border-radius: 14px; padding: 20px 22px; margin-bottom: 28px; background: var(--panel); }

.omnis-ecriture-etiquette { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; opacity: .55; margin-bottom: 10px; }

.omnis-ecriture-texte { margin: 0; font-size: 19px; line-height: 1.6; font-style: italic; }

.omnis-ecriture-ref { margin-top: 12px; font-size: 13px; opacity: .7; }

.omnis-ecriture-recherche { display: flex; gap: 8px; margin-bottom: 24px; }

.omnis-ecriture-recherche input { flex: 1; padding: 11px 16px; border: 1px solid var(--border); border-radius: 999px; font: inherit; background: var(--panel); color: inherit; }

.omnis-ecriture-recherche button { padding: 11px 20px; border: 1px solid var(--border); border-radius: 999px; background: var(--panel); color: inherit; font: inherit; cursor: pointer; }

.omnis-ecriture-resultats { list-style: none; padding: 0; margin: 0 0 32px; display: flex; flex-direction: column; gap: 18px; }

.omnis-ecriture-resultats blockquote { margin: 0 0 6px; line-height: 1.6; }

.omnis-ecriture-lien { appearance: none; border: 0; background: transparent; padding: 0; font: inherit; font-weight: 600; color: inherit; cursor: pointer; text-decoration: underline; }

.omnis-ecriture-version { font-size: 12px; opacity: .55; }

.omnis-ecriture-vide { opacity: .7; }

.omnis-ecriture-chapitre { border-top: 1px solid var(--border); padding-top: 24px; line-height: 1.7; }

.omnis-ecriture-chapitre h2 { margin: 0 0 4px; }

.omnis-ecriture-chapitre p { margin: 0 0 10px; }

.omnis-ecriture-numero { font-size: 11px; opacity: .5; vertical-align: super; margin-right: 4px; font-variant-numeric: tabular-nums; }

/* Valeurs et filtrage : des choix, presentes comme des choix. */
    .omnis-valeurs-liste { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }

.omnis-valeurs-choix { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; cursor: pointer; }

.omnis-valeurs-choix input { margin-top: 3px; flex: none; }

.omnis-valeurs-choix span { display: flex; flex-direction: column; gap: 2px; }

.omnis-valeurs-choix em { font-style: normal; font-size: 13px; opacity: .65; }

/* Reference du jour sur laccueil : presente, jamais envahissante. Elle se
       lit, elle ne reclame pas. */
    .omnis-accueil-verset { max-width: 620px; margin: 22px auto 0; padding: 16px 20px; border: 1px solid var(--border); border-radius: 14px; background: var(--panel); }

.omnis-accueil-verset blockquote { margin: 0; font-size: 15px; line-height: 1.6; font-style: italic; }

.omnis-accueil-verset-pied { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 10px; font-size: 12px; opacity: .7; }

.omnis-accueil-verset-pied button { appearance: none; border: 0; background: transparent; padding: 0; font: inherit; color: inherit; cursor: pointer; text-decoration: underline; opacity: .8; }

/* Mode IA dans la page de resultats : une conversation, pas une page a part.
       Les onglets restent visibles au-dessus. */
    .omnis-serp-ia { max-width: 720px; display: flex; flex-direction: column; gap: 14px; }

.omnis-serp-ia-fil { display: flex; flex-direction: column; gap: 12px; }

.omnis-serp-ia-msg { padding: 12px 16px; border-radius: 14px; line-height: 1.6; max-width: 92%; }

.omnis-serp-ia-moi { align-self: flex-end; background: var(--panel); border: 1px solid var(--border); border-bottom-right-radius: 4px; }

.omnis-serp-ia-crea { background: var(--surface); border: 1px solid var(--border); border-bottom-left-radius: 4px; }

.omnis-serp-ia-vide { opacity: .7; margin: 0; }

.omnis-serp-ia-attente { font-size: 13px; opacity: .6; }

.omnis-serp-ia-form { display: flex; gap: 8px; }

.omnis-serp-ia-form input { flex: 1; padding: 12px 16px; border: 1px solid var(--border); border-radius: 999px; font: inherit; background: var(--panel); color: inherit; }

.omnis-serp-ia-form button { padding: 12px 22px; border: 1px solid var(--border); border-radius: 999px; background: var(--panel); color: inherit; font: inherit; cursor: pointer; }

.omnis-serp-ia-note { font-size: 12px; opacity: .55; margin: 0; }

/* Etat de connexion CREA : visible dun coup doeil, sans jargon. */
    .omnis-crea-etat { display: flex; align-items: center; gap: 10px; margin-top: 14px; font-size: 14px; }

.omnis-crea-pastille { width: 9px; height: 9px; border-radius: 50%; background: rgba(128,128,128,.45); flex: none; }

.omnis-crea-pastille.is-on { background: #2e9e5b; }

.omnis-valeurs-actions { display: flex; gap: 10px; margin-top: 14px; }

.omnis-valeurs-actions button { padding: 10px 18px; border: 1px solid var(--border); border-radius: 999px; background: var(--panel); color: inherit; font: inherit; cursor: pointer; }

.omnis-crea-message { margin: 12px 0 0; font-size: 13px; opacity: .75; }

/* Une ligne discrete, pas un bloc : le filet sous la barre dadresse porte
       lattente. Ceci nexiste que pour les lecteurs decran et pour ne pas
       laisser la page totalement vide. */
    .omnis-serp-attente { font-size: 13px; opacity: .5; }

/* Maison sortie de la barre dadresse, rechargement entre dedans. */
    .omnis-home-hors-barre { margin-left: 2px; }

.omnis-recharger-dans-barre { margin-left: auto; margin-right: 2px; }


/* ═══ 2. CONDITIONNÉ PAR UNE CLASSE QUE LA COUCHE POSE ELLE-MÊME ═══ */

body.omnis-html-fullscreen #preview-panel {
      position: fixed !important;
      inset: 0 !important;
      width: 100vw !important;
      min-width: 100vw !important;
      max-width: 100vw !important;
      height: 100vh !important;
      z-index: 9999;
      border: 0 !important;
    }

body.omnis-html-fullscreen .rbrowser-tabs,
    body.omnis-html-fullscreen .rbrowser-urlbar,
    body.omnis-html-fullscreen #preview-resize-handle { display: none !important; }

body.omnis-html-fullscreen #preview-web-iframe {
      width: 100vw !important;
      height: 100vh !important;
    }

/* Le theme original est conserve. Seules la hierarchie, les dimensions et
       l'ergonomie de la fenetre Electron sont affinees. */
    body.omnis-desktop .rbrowser-tabs {
      min-height: 42px;
      /* La réserve de droite est posée plus bas, et SEULEMENT quand OMNIS
         possède la fenêtre : voir .omnis-cadre-fenetre. Ici, la barre prend
         toute sa largeur. */
      padding: 5px 8px 0 8px;
      gap: 6px;
      -webkit-app-region: drag;
      user-select: none;
    }

/* 148 px pour les vrais boutons réduire/agrandir/fermer, qui flottent
       au-dessus de la barre (titleBarOverlay, voir desktop/main.cjs). Dans
       CREA, le navigateur est un panneau et non une fenêtre : ces boutons
       n'existent pas, et leur réserver la place écrasait la barre. */
    body.omnis-desktop.omnis-cadre-fenetre .rbrowser-tabs { padding-right: 148px; }

body.omnis-desktop .rbrowser-tabs-scroll {
      align-self: stretch;
      align-items: flex-end;
      gap: 2px;
    }

body.omnis-desktop .rbrowser-tab {
      min-width: 112px;
      max-width: 240px;
      height: 34px;
      padding: 0 11px;
      border: 1px solid transparent;
      border-radius: 10px 10px 0 0;
    }

body.omnis-desktop .rbrowser-tab.active {
      border-bottom-color: var(--bg-primary);
    }

/* Onglet mis en veille par l'économiseur de mémoire : atténué, comme
       Chrome le fait pour un onglet déchargé — se recharge au premier clic. */
    body.omnis-desktop .rbrowser-tab.is-suspended { opacity: .55; }

body.omnis-desktop .rbrowser-tab.is-suspended .omnis-tab-favicon { filter: grayscale(1); }

/* Glisser-déposer pour réordonner les onglets. */
    body.omnis-desktop .rbrowser-tab.is-dragging { opacity: .4; }

body.omnis-desktop .rbrowser-tab.is-drop-target { box-shadow: inset 2px 0 0 var(--accent); }

/* Épinglage : onglet compact, icône seule, pas de titre ni bouton fermer. */
    body.omnis-desktop .rbrowser-tab.is-pinned { min-width: 0; width: 44px; padding: 0 10px; flex: none; }

body.omnis-desktop .rbrowser-tab.is-pinned .rbrowser-tab-title,
    body.omnis-desktop .rbrowser-tab.is-pinned .rbrowser-tab-close { display: none; }

body.omnis-desktop .rbrowser-tab.is-pinned .omnis-tab-favicon { margin-right: 0; }

body.omnis-desktop .rbrowser-tab-close {
      width: 18px;
      height: 18px;
      opacity: .72;
    }

body.omnis-desktop .rbrowser-tab:hover .rbrowser-tab-close,
    body.omnis-desktop .rbrowser-tab.active .rbrowser-tab-close {
      opacity: 1;
    }

body.omnis-desktop .rbrowser-tab-new {
      width: 30px;
      height: 30px;
      margin: 0 2px 2px;
      border-radius: 50%;
    }

body.omnis-desktop .rbrowser-tabs-spacer {
      min-width: 24px;
    }

body.omnis-desktop .rbrowser-urlbar {
      min-height: 54px;
      gap: 5px;
      padding: 7px 10px;
    }

/* Tout agrandi d'un cran pour être plus lisible : les boutons de la barre
       d'outils passent de 32 à 38px, et leurs icônes de ~15 à 19px — une icône
       qui ne grandit pas dans un bouton plus grand paraît juste plus perdue. */
    body.omnis-desktop .rbrowser-nav-btn,
    body.omnis-desktop .rbrowser-tool-btn {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      font-size: 18px;
    }

body.omnis-desktop .rbrowser-nav-btn svg,
    body.omnis-desktop .rbrowser-tool-btn svg {
      width: 19px;
      height: 19px;
    }

body.omnis-desktop .rbrowser-url-input {
      height: 40px;
      padding: 0 38px 0 6px;
      font-size: .82rem;
    }

body.omnis-desktop .omnis-update-btn[data-omnis-update-status="idle"],
    body.omnis-desktop .omnis-update-btn[data-omnis-update-status="current"],
    body.omnis-desktop .omnis-update-btn[data-omnis-update-status="development"] {
      opacity: .72;
    }

body.omnis-desktop .omnis-update-btn[data-omnis-update-status="available"],
    body.omnis-desktop .omnis-update-btn[data-omnis-update-status="downloaded"],
    body.omnis-desktop .omnis-update-btn[data-omnis-update-status="error"] {
      color: var(--accent);
      background: var(--accent-bg);
    }

body.omnis-desktop .omnis-toolbar-dropdown {
      top: calc(100% - 1px);
      margin-top: 0;
      z-index: 40;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-control {
      position: relative;
      display: inline-flex;
      align-items: center;
      flex: 0 0 auto;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-button {
      background: var(--accent-bg);
      border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
      color: var(--accent);
      font-size: .68rem;
      font-weight: 800;
      letter-spacing: .02em;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-control.is-open .omnis-account-quick {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      pointer-events: auto;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-quick-head {
      display: grid;
      justify-items: center;
      padding: 16px 12px 14px;
      text-align: center;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-quick-avatar {
      display: grid;
      place-items: center;
      width: 56px;
      height: 56px;
      margin-bottom: 10px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: 1.15rem;
      font-weight: 800;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-quick-head strong { font-size: .88rem; font-weight: 600; }

body:is(.omnis-desktop, .omnis-web) .omnis-account-quick-mail { margin-top: 2px; color: var(--t-faint); font-size: .72rem; }

body:is(.omnis-desktop, .omnis-web) .omnis-account-row {
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      padding: 9px 12px;
      border: 0;
      border-radius: 8px;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .78rem;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-row:hover { background: var(--bg-glass-hov); }

body:is(.omnis-desktop, .omnis-web) .omnis-account-row-icon {
      width: 18px;
      color: var(--t-faint);
      font-size: .84rem;
      text-align: center;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-account-sep { height: 1px; margin: 6px 8px; background: var(--border); }

body:is(.omnis-desktop, .omnis-web) .omnis-profiles-label {
      margin: 4px 8px 2px;
      color: var(--t-faint);
      font-size: .66rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .04em;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row {
      display: flex;
      align-items: center;
      gap: 2px;
      border-radius: 8px;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row:hover,
    body:is(.omnis-desktop, .omnis-web) .omnis-profile-row.is-active { background: var(--bg-glass-hov); }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row-main {
      display: flex;
      align-items: center;
      gap: 10px;
      flex: 1;
      min-width: 0;
      padding: 8px 6px 8px 12px;
      border: 0;
      background: none;
      color: var(--t-primary);
      cursor: pointer;
      text-align: left;
      font-size: .78rem;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-check { flex: none; width: 16px; height: 16px; color: var(--accent); }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-check svg { width: 16px; height: 16px; }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row-action {
      flex: none;
      display: grid;
      place-items: center;
      width: 26px;
      height: 26px;
      margin-right: 4px;
      border: 0;
      border-radius: 6px;
      background: none;
      color: var(--t-faint);
      cursor: pointer;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row-action:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-row-action svg { width: 14px; height: 14px; }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-add {
      width: 100%;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 6px 8px 12px;
      border: 0;
      border-radius: 8px;
      background: none;
      color: var(--t-dim);
      cursor: pointer;
      font-size: .78rem;
    }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-add:hover { background: var(--bg-glass-hov); color: var(--t-primary); }

body:is(.omnis-desktop, .omnis-web) .omnis-profile-add svg { width: 15px; height: 15px; }

body.omnis-desktop .omnis-menu-sep { height: 1px; margin: 5px 6px; background: var(--border); }

body.omnis-desktop .omnis-menu-account-row { align-items: center; gap: 10px; }

body.omnis-desktop .omnis-menu-account-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

body.omnis-desktop .omnis-menu-account-state { color: var(--t-muted); font-size: .68rem; }

body.omnis-desktop .omnis-menu-section .rbrowser-dropdown-item { display: flex; align-items: center; gap: 10px; }

body.omnis-desktop .omnis-menu-section .rbrowser-dropdown-item > span:first-of-type { flex: 1; }

body.omnis-desktop .omnis-menu-section .rbrowser-dropdown-item em {
      color: var(--t-faint);
      font-size: .66rem;
      font-style: normal;
    }

body.omnis-desktop .omnis-menu-section {
      margin: 0 0 4px;
      padding: 4px 0 6px;
      border-bottom: 1px solid var(--border);
    }

body.omnis-desktop .omnis-menu-title {
      padding: 4px 10px 5px;
      color: var(--t-faint);
      font-size: .62rem;
      font-weight: 800;
      letter-spacing: .13em;
    }

body.omnis-desktop .omnis-menu-avatar {
      display: inline-grid;
      place-items: center;
      width: 20px;
      height: 20px;
      border-radius: 50%;
      background: var(--accent-bg);
      color: var(--accent);
      font-size: .6rem;
      font-weight: 800;
    }

body.omnis-desktop .rbrowser-tabs-scroll,
    body.omnis-desktop .rbrowser-tab,
    body.omnis-desktop .rbrowser-tab button,
    body.omnis-desktop .rbrowser-tab-new,
    body.omnis-desktop .rbrowser-urlbar,
    body.omnis-desktop .rbrowser-tool-btn,
    body.omnis-desktop .rbrowser-dropdown,
    body.omnis-desktop .rbrowser-dropdown * { -webkit-app-region: no-drag; }

/* DÉPLACEMENT INTELLIGENT (voir bindOmnisWindowDrag dans stabilization.js).
       Le FOND de la barre du haut est préhensible : bandes de rembourrage au-
       dessus et en dessous des boutons, espaces entre eux, et zone réservée aux
       boutons natifs. Tout élément interactif garde son clic — c'est le
       MOUVEMENT de la souris, pas la zone, qui distingue un glissement.
       Pendant le déplacement : aucune sélection de texte parasite, et le curseur
       indique l'action sur toute la fenêtre. */
    body.omnis-window-dragging,
    body.omnis-window-dragging * {
      cursor: move !important;
      user-select: none !important;
    }

/* ZÉRO TRANSPARENCE — correction à la SOURCE, sur les variables elles-mêmes,
       pas surface par surface. Toutes ces variables portaient un canal alpha :
       invisible sur un fond blanc uni, mais dès qu'une page animée passe
       derrière un panneau, le mouvement traversait. Rendues opaques ici pour
       les deux thèmes ; tout ce qui les utilise (des dizaines d'endroits)
       devient opaque d'un coup, sans double réglage.
       Le vert (--accent: #10a37f) est aussi retiré des surfaces : les fonds
       teintés accent deviennent des gris neutres. */
    :root, body.omnis-desktop {
      --bg-glass: #ffffff;
      --bg-glass-hov: #f4f4f4;
      --bg-hover: #f0f0f0;
      --accent-bg: #f2f4f3;
      --accent-glow: #e6eae9;
      --accent-dim: #6b7280;
      --border-focus: #9aa0a6;
      /* LA vraie cause de la transparence qui restait : --panel et --surface
         n'étaient définies NULLE PART. Dix règles font « background: var(--panel) »
         ou « var(--surface) » sans valeur de repli — un var() non résolu rend la
         déclaration INVALIDE, donc ces panneaux n'avaient aucun fond du tout.
         Pas semi-transparents : totalement transparents. C'est ce qu'on voyait
         en ouvrant le panneau des onglets (.omnis-tabsbtn-panel), la superposition
         actus/météo, la fiche de premier lancement, la barre de recherche dans la
         page, le mode lecture et les pages d'erreur. */
      --panel: #ffffff;
      --surface: #ffffff;
    }

html.dark, html.dark body.omnis-desktop {
      --bg-glass: #212121;
      --bg-glass-hov: #2f2f2f;
      --bg-hover: #333333;
      --accent-bg: #2a2d2c;
      --accent-glow: #333837;
      --accent-dim: #9aa0a6;
      --border-focus: #6b7280;
      --panel: #212121;
      --surface: #1b1b1f;
    }

body.omnis-visual-sober .omnis-tabsbtn-panel,
    body.omnis-visual-sober .rbrowser-dropdown,
    body.omnis-visual-sober .omnis-plus-menu,
    body.omnis-visual-sober .omnis-panneau,
    body.omnis-visual-sober .omnis-serp-menu,
    body.omnis-visual-sober .omnis-cast-panel,
    body.omnis-visual-sober .omnis-onboarding-card {
      box-shadow: 0 2px 8px rgba(0, 0, 0, .10);
    }

body.omnis-visual-rich .omnis-tabsbtn-panel,
    body.omnis-visual-rich .rbrowser-dropdown,
    body.omnis-visual-rich .omnis-plus-menu,
    body.omnis-visual-rich .omnis-panneau,
    body.omnis-visual-rich .omnis-serp-menu,
    body.omnis-visual-rich .omnis-cast-panel,
    body.omnis-visual-rich .omnis-onboarding-card {
      box-shadow: 0 16px 44px rgba(0, 0, 0, .16);
    }

/* Menu ⋮ : la liste dépassait le bas de la fenêtre et se retrouvait coupée,
       sans moyen d'atteindre les dernières entrées. Hauteur bornée + défilement
       interne, comme le menu de Chrome. */
    body.omnis-desktop .rbrowser-dropdown {
      max-height: min(70vh, 520px);
      overflow-y: auto;
      overscroll-behavior: contain;
    }

body.omnis-desktop .omnis-ai-toolbar { color: var(--accent); }

body.omnis-desktop #preview-panel .omnis-bookmarks-bar::-webkit-scrollbar { height: 0; }

/* Panneau latéral de l'assistant (Mode IA) ET panneau CREA, ancrés à
       droite comme dans le modèle — deux fonctions séparées qui partagent
       juste le même emplacement docké, jamais montrées en même temps. */
    body.omnis-assistant-open #preview-panel, body.omnis-crea-open #preview-panel { padding-right: 372px; }

/* Mode « bouton onglets » : la barre classique reste entièrement dans le
       DOM (rien de sa logique n'est touché), seulement masquée visuellement. */
    body.omnis-modern-tabbar .rbrowser-tabs { display: none; }

/* Bug réel corrigé : quand .rbrowser-tabs disparaît, .rbrowser-urlbar
       devient la première rangée de la fenêtre — mais elle n'avait jamais
       reçu la même réserve de 148px que .rbrowser-tabs pour les vrais
       boutons de fenêtre (réduire/agrandir/fermer, voir titleBarOverlay
       dans desktop/main.cjs). Ses propres contrôles de droite (cadenas,
       étoile, Mode IA, menu ⋮) se retrouvaient masqués derrière ces
       boutons, inutilisables. */
    /* LA RÉSERVE N'A DE SENS QUE S'IL Y A DES BOUTONS DE FENÊTRE.
     *
     * Ces 158 px tiennent la place des vrais réduire/agrandir/fermer, qui
     * flottent au-dessus de la barre dans la fenêtre Electron (titleBarOverlay).
     *
     * Posée dans CREA, où le navigateur est un PANNEAU et non une fenêtre, elle
     * réserve 158 px pour des boutons qui n'existent pas : la barre d'adresse
     * se retrouve écrasée et ses propres contrôles se marchent dessus. C'est
     * exactement l'inverse du défaut qu'elle corrigeait.
     *
     * `omnis-cadre-fenetre` n'est posée que quand OMNIS possède réellement la
     * fenêtre. Ailleurs, la barre reprend toute sa largeur. */
    body.omnis-modern-tabbar.omnis-cadre-fenetre .rbrowser-urlbar { padding-right: 158px; }

body.omnis-incognito-window { background: #1b1b1f; }

body.omnis-incognito-window .rbrowser-urlbar,
    body.omnis-incognito-window .rbrowser-tabs { background: #1b1b1f; border-color: #2f2f36; }

body.omnis-html-fullscreen #omnis-persistent-webviews {
      inset: 0 !important;
      width: 100vw !important;
      height: 100vh !important;
      z-index: 10000;
    }

/* ═══ 3. CANTONNÉ AU NAVIGATEUR ═══
 *
 * Ces règles étaient écrites pour une fenêtre qui N'EST QUE le navigateur.
 * Dans CREA, le navigateur est un panneau parmi d'autres : appliquées telles
 * quelles, elles auraient changé la sélection de texte, l'anneau de focus et
 * les barres de défilement de toute l'application. Chaque sélecteur est donc
 * préfixé par #preview-panel — la condition de thème est conservée, seule la
 * portée est réduite.
 */

/* Sélection de texte : le vert translucide (--accent-glow d'origine)
       devient un gris neutre opaque. */
    #preview-panel ::selection { background: #d7dbe0; color: var(--t-primary); }

html.dark #preview-panel ::selection { background: #3c4043; color: var(--t-primary); }

/* Barre de défilement : le pouce était semi-transparent (alpha .25). */
    #preview-panel *::-webkit-scrollbar-thumb { background: #c7c9cc; }

html.dark #preview-panel *::-webkit-scrollbar-thumb { background: #4a4d50; }

/* ═══ LE RESTE, SANS RISQUE ═══ */

/* Bug réel corrigé : le cadenas/maison étaient DOM-enfants du wrapper mais
       le fond/bordure/arrondi de la barre vivaient uniquement sur le <input>
       lui-même — donc visuellement, ces boutons tombaient hors de la pilule
       même s'ils étaient bien "dedans" en DOM. Le fond vit maintenant sur le
       wrapper entier, et le champ devient transparent pour s'y fondre. */
    .omnis-urlbar-wrap .rbrowser-url-input {
      width: 100%;
      border: 0;
      background: transparent;
      border-radius: 0;
    }

/* Carrés verts au clic : l'anneau de focus hérité était « outline: 2px solid
       var(--accent) » PLUS un « box-shadow: 0 0 0 2px accent » — d'où un carré
       vert autour de chaque champ cliqué. Remplacé par un liseré neutre et
       discret : le focus reste visible (accessibilité clavier), mais ce n'est
       plus un bloc vert. */
    :focus-visible {
      outline: 1px solid var(--border-focus) !important;
      outline-offset: 1px !important;
      box-shadow: none !important;
    }

@media (max-width: 900px) {
      body.omnis-desktop .rbrowser-tab {
        min-width: 96px;
      }
    }

@keyframes omnisSerpLoading {
      0% { transform: translateX(-100%); }
      100% { transform: translateX(250%); }
    }

/* Page « nouvel onglet » : marque centrée, barre de recherche en pilule,
       grille de raccourcis en tuiles rondes, carte des onglets récents et
       bouton de personnalisation en bas à droite, comme le modèle fourni. */
    /* Le conteneur d'accueil hérite d'un centrage flex : au-delà de sa hauteur,
       le contenu déborderait au-dessus de la barre d'adresse. On l'aligne en
       haut et on masque la barre de défilement, qui tomberait en plein milieu
       de la colonne centrale au lieu du bord de la fenêtre. */
    /* Le conteneur d'accueil défile seulement si la fenêtre est trop courte,
       sans jamais afficher de barre au milieu ni pousser le contenu en haut. */
    #preview-panel .rbrowser-empty:has(.omnis-newtab) {
      position: relative;
      overflow-y: auto;
      scrollbar-width: none;
    }

#preview-panel .rbrowser-empty:has(.omnis-newtab)::-webkit-scrollbar { width: 0; height: 0; }

/* Coin haut-droit de la page d'accueil OMNIS : menu écosystème + avatar,
       comme sur la vraie page d'accueil Google (pas seulement sur la SERP).
       Bug réel corrigé : position:fixed les positionnait par rapport à LA
       FENÊTRE entière, ignorant la hauteur réelle de la barre d'adresse
       au-dessus — ils se retrouvaient invisibles, cachés dessous. Ancrés
       maintenant sur .rbrowser-empty (position:relative ci-dessus), qui
       commence déjà, en flux normal, sous la barre d'adresse. */
    /* Calé sur Google.com : le groupe (grille d'applications puis rond de
       compte) est collé au coin, pas centré ni décalé vers l'intérieur. */
    .omnis-newtab-topright {
      position: absolute;
      /* Recollés légèrement vers l'intérieur : à 4px ils touchaient presque le
         bord de la fenêtre. Google laisse aussi une petite marge. */
      top: 10px;
      right: 14px;
      z-index: 20;
      display: flex;
      align-items: center;
      gap: 4px;
    }

/* [hidden] seul ne bat pas display:flex : une règle auteur l'emporte
       toujours sur la règle UA [hidden]{display:none}, d'où cette règle
       explicite — sans elle la superposition reste affichée en permanence et
       bloque les clics sur tout ce qu'il y a dessous. */
    .omnis-cast-overlay[hidden] { display: none; }

[data-omnis-terminal-shell-select] {
      background: var(--bg-secondary);
      color: var(--t-primary);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 8px 12px;
      font-size: .85rem;
    }

[data-omnis-docker-image-select] {
      background: var(--bg-secondary);
      color: var(--t-primary);
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 8px 12px;
      font-size: .85rem;
    }

#omnis-persistent-webviews {
      position: fixed;
      overflow: hidden;
      background: #fff;
      z-index: 8;
    }

/* La seule variable de thème qu'OMNIS utilise et que CREA n'avait pas. Définie
 * en repli plutôt qu'imposée : si CREA la définit un jour, la sienne gagne. */
#preview-panel {
  --bg-glass-hov: var(--bg-glass-hov, rgba(127, 127, 127, .08));
}