/* =========================================================================
   LA COQUILLE « TUILES » · nouvelle charte (24/10/2026), à l'essai
   Chargée par templates/base_tuiles.html et par lui seul. Jetons, police,
   en-tête (onglets des espaces, recherche, Mail, Messagerie, « + », profil),
   panneaux, recherche, « Tout l'intranet ». Maquettes : toile « Intranet ·
   nouvelles chartes », rangée C3.
   ========================================================================= */

/* Inter, la police de l'intranet (mêmes fichiers que app.css, qui n'est pas
   chargée par cette coquille). Inter Tight a été essayée puis écartée par
   Romain le 24/10/2026. */
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("fonts/rg/Inter-latin-ext.01ba6c2a184b.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
  src:url("fonts/rg/Inter-latin.65850a373e25.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ---- Jetons · sombre par défaut, comme la coquille d'origine ------------ */
.tu{
  --tu-fond:#0E0F12; --tu-carte:#181A1F; --tu-encre:#EEF0F3; --tu-doux:#A0A6B2;
  --tu-trait:#282B32; --tu-ombre:0 0 0 1px #22252B; --tu-ombre-haute:0 0 0 1px #2C3038,0 18px 48px rgba(0,0,0,.45);
  --tu-p-vif:#B94A22; --tu-y-vif:#2F52CC; --tu-a-vif:#12786A; --tu-m-vif:#7546A8; --tu-n-vif:#4A5266;
  --tu-y-doux:#19223F; --tu-m-doux:#251B36; --tu-n-doux:#22252C;
  --tu-y-texte:#A9BCFF; --tu-m-texte:#CDB4F5; --tu-n-texte:#C3C9D4;
  --tu-al-fond:#2A1F0E; --tu-al-trait:#5C4317; --tu-al-texte:#F6CD86; --tu-al-vif:#A86400;
  --tu-retard:#F6CD86;
  /* Les teintes des fournisseurs d'IA (core.conso.COULEURS), reprises d'app.css. */
  --tu-terracotta:#ff8a5c; --tu-sable:#b6a4ff; --tu-sauge:#4ad6a0; --tu-teal:#5ec8ff; --tu-gold:#ffcf5c;
}
html[data-theme="clair"] .tu{
  --tu-fond:#F1F2F4; --tu-carte:#FFFFFF; --tu-encre:#14161B; --tu-doux:#5A6070;
  --tu-trait:#E2E4E9; --tu-ombre:0 1px 2px rgba(20,22,27,.05),0 4px 16px rgba(20,22,27,.05);
  --tu-ombre-haute:0 0 0 1px #E2E4E9,0 18px 48px rgba(20,22,27,.16);
  --tu-p-vif:#B5441B; --tu-y-vif:#2343B8; --tu-a-vif:#0E6B5A; --tu-m-vif:#6A3D9A; --tu-n-vif:#3A4152;
  --tu-y-doux:#E4EAFB; --tu-m-doux:#ECE4F6; --tu-n-doux:#E6E8EC;
  --tu-y-texte:#2343B8; --tu-m-texte:#5E3590; --tu-n-texte:#3A4152;
  --tu-al-fond:#FFF3DC; --tu-al-trait:#F0C77A; --tu-al-texte:#6B4100; --tu-al-vif:#9A5A00;
  --tu-retard:#9A5A00;
  --tu-terracotta:#8f5750; --tu-gold:#8a6a42; --tu-sauge:#4f7059; --tu-sable:#665a72; --tu-teal:#4a6076;
}
/* LES JETONS D'APP.CSS QUE LES SCRIPTS PARTAGÉS EMPLOIENT (avis du navigateur
   VPN, _nav_vpn.html) : app.css n'est pas chargée ici, on les rebranche sur
   ceux de la coquille. */
.tu{--panel-2:var(--tu-carte); --solid:var(--tu-carte); --hair:var(--tu-trait); --line:var(--tu-trait);
  --ink:var(--tu-encre); --dim:var(--tu-doux); --teal-fg:var(--tu-a-vif); --gold-fg:var(--tu-al-vif); --radius-sm:12px}
/* Une famille par espace, posée sur l'élément qui la porte. */
.tu .ton-p{--s-vif:var(--tu-p-vif)}
.tu .ton-y{--s-vif:var(--tu-y-vif)}
.tu .ton-a{--s-vif:var(--tu-a-vif)}
.tu .ton-m{--s-vif:var(--tu-m-vif)}
.tu .ton-n{--s-vif:var(--tu-n-vif)}

/* ---- Socle --------------------------------------------------------------- */
html body.tu{margin:0;min-height:calc(100vh / var(--echelle, 1));background:var(--tu-fond);color:var(--tu-encre);
  font-family:"Inter",system-ui,sans-serif;font-size:15px;line-height:1.45}
/* Remises à zéro de SPÉCIFICITÉ NULLE (`:where`) : n'importe quelle règle de
   composant, même d'une seule classe, passe devant. */
:where(.tu) *,:where(.tu) *::before,:where(.tu) *::after{box-sizing:border-box}
:where(.tu) a{color:inherit}
:where(.tu) button,:where(.tu) input{font:inherit;color:inherit}
/* LES PICTOGRAMMES AU TRAIT, et eux seuls (25/10/2026) · la règle visait tout
   <svg> : les schémas et graphiques des pages (Consommation IA, Énergie…) en
   héritaient un contour, et leurs libellés devenaient illisibles. Les
   pictogrammes de la charte ont tous la grille 24 × 24 ; `:where` garde la
   spécificité d'origine. */
.tu svg:where([viewBox="0 0 24 24"]){fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Les pictogrammes du jeu commun (static/icons.svg), comme dans app.css. */
.tu .icon{width:1em;height:1em;display:inline-block;vertical-align:-.13em;flex:none;
  fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tu-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* QUASI PLEINE LARGEUR (Romain, 24/10/2026 : « si j'ai un grand écran,
   j'aimerais autant en profiter ») · ni la page ni l'en-tête n'ont de plafond ;
   seule la marge grandit avec la fenêtre. Les grilles (auto-fill) gagnent des
   colonnes au lieu d'étirer leurs cartes. */
.tu{--tu-gouttiere:clamp(16px,calc(2.2vw / var(--echelle, 1)),48px)}
.tu-page{margin:0 auto;box-sizing:border-box;
  padding:4px max(var(--tu-gouttiere),env(safe-area-inset-right,0px)) 48px max(var(--tu-gouttiere),env(safe-area-inset-left,0px))}
.tu-messages{display:flex;flex-direction:column;gap:8px;margin:0 0 16px}
.tu-message{margin:0;padding:10px 14px;border-radius:14px;background:var(--tu-carte);box-shadow:var(--tu-ombre);font-size:14px}
.tu-message.erreur{background:var(--tu-al-fond);color:var(--tu-al-texte);box-shadow:inset 0 0 0 1px var(--tu-al-trait)}
.tu-message a{color:inherit;font-weight:600}

/* ---- En-tête ------------------------------------------------------------- */
.tu-entete{position:relative;z-index:40;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:10px 14px;margin:0 auto;box-sizing:border-box;
  /* LA BARRE D'ÉTAT DE L'iPHONE · l'application posée sur l'écran d'accueil
     s'affiche en plein écran (viewport-fit=cover, barre « black-translucent ») :
     sans cette réserve, l'en-tête passait SOUS l'heure et la batterie (signalé
     par Romain le 24/10/2026, capture à l'appui). Les côtés réservent l'encoche
     quand l'appareil est couché. Hors application, env() vaut zéro. */
  padding:calc(14px + env(safe-area-inset-top,0px)) max(var(--tu-gouttiere),env(safe-area-inset-right,0px))
    14px max(var(--tu-gouttiere),env(safe-area-inset-left,0px))}
.tu .tu-marque{display:flex;align-items:center;gap:11px;color:var(--tu-encre);text-decoration:none}
/* LE LOGO DE LA CHARTE RG, LES DEUX VERSIONS TELLES QUELLES (Romain, 25/10/2026 ;
   « identité arrêtée », ne pas passer en jetons, voir `.logo` dans app.css) :
   en sombre, la marque blanche sur le carré au dégradé #2e2c27 → #403d36 ; en
   clair, la marque foncée sur carré blanc bordé d'un filet. Rayon 26 %, marque
   à 78 %, ni ombre ni recoloriage. Le thème choisit l'image. */
.tu-logo{width:38px;height:38px;border-radius:26%;flex:none;display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(150deg,#2e2c27,#403d36)}
html[data-theme="clair"] .tu-logo{background:#fff;box-shadow:inset 0 0 0 1px #e4e6e9}
.tu-logo img{width:78%;height:78%;object-fit:contain;display:block;grid-area:1 / 1}
.tu-logo .logo-clair{display:none}
html[data-theme="clair"] .tu-logo .logo-sombre{display:none}
html[data-theme="clair"] .tu-logo .logo-clair{display:block}
.tu-marque-txt{display:flex;flex-direction:column;line-height:1.15}
.tu-marque-txt b{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.tu-marque-txt span{font-size:12px;color:var(--tu-doux)}
.tu-onglets{display:flex;gap:2px;padding:4px;border-radius:999px;background:var(--tu-carte);box-shadow:var(--tu-ombre);
  overflow-x:auto;max-width:100%;scrollbar-width:none}
.tu-onglets::-webkit-scrollbar{display:none}
.tu .tu-onglet{flex:none;display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border:0;border-radius:999px;
  background:transparent;color:var(--tu-encre);font:inherit;font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;white-space:nowrap}
.tu .tu-onglet:hover{background:var(--tu-fond)}
.tu-puce{width:8px;height:8px;border-radius:50%;background:var(--s-vif,var(--tu-n-vif))}
.tu-chevron{width:14px;height:14px;opacity:.6;margin-left:-2px}
.tu .tu-onglet.actif{background:var(--tu-encre);color:var(--tu-fond);font-weight:700}
.tu .tu-onglet.actif .tu-puce{background:currentColor}
.tu .tu-onglet[aria-expanded="true"]{background:var(--tu-fond);box-shadow:inset 0 0 0 1px var(--tu-trait)}
/* L'onglet actif dont le panneau est ouvert garde son aplat (25/10/2026) : la
   règle « ouvert » lui donnait le fond de page sous un texte couleur de fond,
   et « Documents » disparaissait une fois choisi. */
.tu .tu-onglet.actif[aria-expanded="true"]{background:var(--tu-encre);color:var(--tu-fond);box-shadow:none}
.tu-actions{display:flex;align-items:center;gap:8px}
.tu-chercher{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px;border:0;border-radius:999px;
  background:var(--tu-carte);box-shadow:var(--tu-ombre);color:var(--tu-doux);font:inherit;font-size:14px;cursor:pointer}
.tu-chercher svg{width:17px;height:17px}
.tu kbd{font-family:inherit;font-size:11px;padding:1px 6px;border-radius:6px;border:1px solid var(--tu-trait);color:var(--tu-doux);background:transparent}
.tu .tu-rond{position:relative;width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:50%;
  background:var(--tu-carte);box-shadow:var(--tu-ombre);color:var(--tu-encre);text-decoration:none;cursor:pointer;font:inherit}
.tu-rond svg{width:18px;height:18px}
.tu .tu-avatar{font-size:12px;font-weight:700}
.tu .tu-avatar[aria-expanded="true"]{background:var(--tu-encre);color:var(--tu-fond)}
/* L'horloge, comme dans l'ancienne barre du haut (.clockbox d'app.css). */
.tu-horloge{display:flex;flex-direction:column;align-items:flex-end;line-height:1;padding:0 4px;flex:none}
.tu-horloge-h{font-size:15px;font-weight:650;font-variant-numeric:tabular-nums}
.tu-horloge-d{margin-top:3px;font-size:10.5px;color:var(--tu-doux)}
/* Les indicateurs de l'ancienne barre du haut (_jauges_tuiles.html), en UNE
   capsule : séparés, ils poussaient l'en-tête sur deux lignes dès 1440 px. */
.tu-jauges{display:flex;align-items:center;height:40px;padding:0 4px;border-radius:999px;background:var(--tu-carte);box-shadow:var(--tu-ombre)}
.tu-jauges:empty{display:none}
.tu .tu-jauge{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 8px;border-radius:999px;
  color:var(--tu-doux);text-decoration:none;font-size:11px;font-weight:700;letter-spacing:.03em}
.tu .tu-jauge:hover{background:var(--tu-fond);color:var(--tu-encre)}
.tu .tu-jauge .icon{width:15px;height:15px}
.tu .tu-jauge.alerte{color:var(--tu-al-texte);background:var(--tu-al-fond)}
.tu .tu-jauge-ok{color:var(--tu-a-vif)}
.tu-jauge-n{font-variant-numeric:tabular-nums}
.tu-jauge-barre{width:32px;height:5px;border-radius:3px;background:var(--tu-trait);overflow:hidden;display:flex}
.tu-jauge-barre > span{height:100%;background:var(--tu-doux);border-radius:0}
.tu-jauge.alerte .tu-jauge-barre > span{background:var(--tu-al-vif)}
.tu-jauge-mix > span{min-width:2px}
.tu-jauge-mix > span.vide{background:transparent}
.tu-jauge-point{width:7px;height:7px;border-radius:50%;flex:none}
.tu-jauge-point.marche{background:#5fbf8a;box-shadow:0 0 6px #5fbf8a}
.tu-jauge-point.attente{background:#e0a546;box-shadow:0 0 6px #e0a546}
/* Au large, dans l'en-tête ; quand la place manque, dans le menu du profil. */
.tu-jauges-profil{display:none;width:max-content;max-width:100%;flex-wrap:wrap;height:auto;min-height:40px;margin:-4px 0 16px}
.tu-pastille{min-width:17px;height:17px;padding:0 5px;margin-left:6px;box-sizing:border-box;border-radius:999px;
  background:var(--tu-p-vif);color:#FFFFFF;font-size:10.5px;font-weight:700;display:inline-grid;place-items:center;vertical-align:1px}
.tu-badge{position:absolute;top:-3px;right:-3px;min-width:17px;height:17px;padding:0 5px;box-sizing:border-box;border-radius:999px;
  background:var(--tu-p-vif);color:#FFFFFF;font-size:10.5px;font-weight:700;display:grid;place-items:center}

/* ---- Panneaux des espaces et du profil ---------------------------------- */
.tu-panneau{position:absolute;top:calc(100% - 4px);left:var(--tu-gouttiere);right:var(--tu-gouttiere);z-index:45;box-sizing:border-box;padding:18px 22px 20px;
  border-radius:22px;background:var(--tu-carte);box-shadow:var(--tu-ombre-haute)}
.tu-panneau[hidden]{display:none}
.tu-panneau-profil{left:auto;width:min(560px,calc(100% - 2 * var(--tu-gouttiere)))}
.tu-panneau-tete{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px;font-size:16px}
.tu-panneau-tete a{font-size:14px;font-weight:600;color:var(--tu-y-texte);text-decoration:none}
.tu-colonnes{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px 22px}
.tu-col-titre{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--tu-doux)}
.tu-col-titre a{color:inherit;text-decoration:none}
.tu-col ul{list-style:none;margin:0;padding:0}
.tu .tu-col a{display:block;padding:5px 8px;margin:0 -8px;border-radius:9px;color:var(--tu-encre);text-decoration:none;font-size:14px}
.tu .tu-col .tu-col-titre a{display:inline;padding:0;margin:0;font-size:12px;color:var(--tu-doux)}
.tu .tu-col a:hover{background:var(--tu-fond)}
.tu .tu-col a[aria-current="page"]{font-weight:700}
/* UN OUTIL À PART (04/11/2026) · le symbole « sortie » des applications hors de l'intranet (_autonome.html) :
   discret, à la couleur du texte, il ne change ni la ligne ni la hauteur du lien. */
.tu .tu-autonome{display:inline-block;width:.78em;height:.78em;margin-left:.35em;vertical-align:-.02em;fill:none;stroke:currentColor;
  stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.55}
.tu a:hover .tu-autonome{opacity:.9}
/* Les réglages du menu du profil en deux piles : Monitoring puis Utilisateurs
   à gauche, Admin à droite (core.tuiles.REGLAGES_DROITE). */
.tu-piles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 22px}
.tu-pile{display:flex;flex-direction:column;gap:14px}
.tu-profil-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.tu-profil-groupes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}
.tu-profil-groupe .tu-col-titre{margin:0 0 8px}
@media (max-width:640px){.tu-profil-groupes{grid-template-columns:minmax(0,1fr)}}
.tu-teinte{width:12px;height:12px;border-radius:50%;background:var(--tu-y-vif);margin-right:7px;flex:none}
@media (max-width:899px){.tu .tu-village{display:none}}
.tu-profil-actions form{margin:0}
.tu .tu-action{display:inline-flex;align-items:center;height:34px;padding:0 12px;border:1px solid var(--tu-trait);border-radius:999px;
  background:transparent;color:var(--tu-encre);font:inherit;font-size:13.5px;text-decoration:none;cursor:pointer}
.tu .tu-action:hover{background:var(--tu-fond)}
.tu .tu-action.on{background:var(--tu-y-doux);border-color:transparent;color:var(--tu-y-texte);font-weight:700}

/* ---- Le bouton « + » ----------------------------------------------------- */
.tu .tu-plus{width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;cursor:pointer;
  background:var(--tu-encre);color:var(--tu-fond);box-shadow:0 4px 14px rgba(0,0,0,.18);transition:transform .15s}
.tu .tu-plus svg{width:22px;height:22px;stroke-width:2.2;transition:transform .2s}
.tu .tu-plus:hover{transform:scale(1.06)}
.tu .tu-plus[aria-expanded="true"] svg{transform:rotate(45deg)}
.tu-panneau-creer{left:auto;width:min(540px,calc(100% - 2 * var(--tu-gouttiere)))}
.tu-rappel{display:flex;align-items:center;gap:10px;height:48px;padding:0 6px 0 8px;border-radius:15px;background:var(--tu-fond)}
.tu .tu-rappel input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--tu-encre);font-size:14.5px;padding:0;outline:none}
.tu .tu-rappel input::placeholder{color:var(--tu-doux)}
.tu .tu-rappel button{height:36px;padding:0 14px;border:0;border-radius:11px;background:var(--tu-encre);color:var(--tu-fond);
  font-size:13.5px;font-weight:600;cursor:pointer}
.tu-rappel-etat{margin:6px 4px 10px;min-height:18px;font-size:13px;color:var(--tu-doux)}
.tu-rappel-etat.ok{color:var(--tu-encre)}
.tu-tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.tu .tu-tuile{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:var(--tu-fond);
  color:var(--tu-encre);text-decoration:none;font-size:14px;font-weight:600}
.tu .tu-tuile:hover{box-shadow:inset 0 0 0 1px var(--tu-trait)}
.tu-tuile-ico{width:30px;height:30px;border-radius:9px;background:var(--s-vif,var(--tu-n-vif));color:#FFFFFF;display:grid;place-items:center;flex:none}
.tu-tuile-ico svg{width:16px;height:16px}
.tu-creer-sous{margin-top:16px}

/* ---- Recherche et « Tout l'intranet » ----------------------------------- */
.tu-voile{position:fixed;inset:0;z-index:80;background:rgba(8,9,12,.45);display:flex;justify-content:center;align-items:flex-start;padding:calc(10vh / var(--echelle, 1)) 16px 16px}
.tu-voile[hidden]{display:none}
.tu-palette{width:min(640px,100%);max-height:calc(72vh / var(--echelle, 1));display:flex;flex-direction:column;border-radius:22px;background:var(--tu-carte);
  box-shadow:var(--tu-ombre-haute);overflow:hidden}
.tu-palette-ligne{display:flex;align-items:center;gap:10px;height:56px;padding:0 16px;border-bottom:1px solid var(--tu-trait)}
.tu-palette-ligne svg{width:19px;height:19px;color:var(--tu-doux);flex:none}
.tu .tu-palette-ligne input,.tu .tu-tiroir-filtre{flex:1;min-width:0;height:100%;border:0;border-radius:0;background:transparent;
  color:var(--tu-encre);font:inherit;font-size:16px;padding:0;box-shadow:none;outline:none}
/* PAS DE CADRE BLEU DU NAVIGATEUR autour des champs (Romain, 24/10/2026 :
   « c'est moche ») : la palette est déjà toute entière le champ ; le filtre
   du tiroir marque la main par un liseré de la charte. */
.tu .tu-tiroir-filtre:focus{box-shadow:inset 0 0 0 1.5px var(--tu-y-vif)}
.tu-resultats{overflow-y:auto;padding:8px}
.tu-resultats:empty{display:none}
.tu-res-groupe{margin:6px 8px 2px;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--tu-doux)}
.tu .tu-res{display:flex;justify-content:space-between;gap:12px;padding:9px 10px;border-radius:12px;color:var(--tu-encre);text-decoration:none;font-size:14.5px}
.tu .tu-res span{color:var(--tu-doux);font-size:13px}
.tu .tu-res:hover,.tu .tu-res:focus{background:var(--tu-fond);outline:none}
.tu-res-vide{padding:12px;color:var(--tu-doux);font-size:14px}
#tu-tout{justify-content:flex-end;align-items:stretch;padding:0}
.tu-tiroir{width:min(420px,100%);height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;padding:16px 18px;
  padding-top:calc(16px + env(safe-area-inset-top,0px));padding-bottom:calc(16px + env(safe-area-inset-bottom,0px));
  background:var(--tu-carte);box-shadow:var(--tu-ombre-haute)}
.tu-tiroir-tete{display:flex;align-items:center;justify-content:space-between;font-size:17px}
.tu .tu-tiroir-filtre{flex:none;height:40px;padding:0 12px;border-radius:12px;background:var(--tu-fond);font-size:15px}
.tu-arbre{overflow-y:auto;padding-right:4px}
.tu-arbre section{margin-bottom:14px}
.tu-arbre h3{margin:0 0 4px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--tu-doux);font-family:inherit}
.tu-arbre h3 a{color:inherit;text-decoration:none}
.tu-arbre-grp{margin:8px 0 2px;font-size:13px;font-weight:700}
.tu-arbre-grp a{color:inherit;text-decoration:none}
.tu-arbre ul{list-style:none;margin:0;padding:0}
.tu .tu-arbre li a{display:block;padding:4px 8px;margin:0 -8px;border-radius:8px;color:var(--tu-encre);text-decoration:none;font-size:14px}
.tu .tu-arbre li.sous a{padding-left:20px;color:var(--tu-doux)}
.tu .tu-arbre li a:hover{background:var(--tu-fond)}
.tu-arbre [hidden]{display:none}

/* L'EN-TÊTE TIENT SUR UNE LIGNE · largeurs mesurées sur le banc le 24/10/2026
   (marque 177 px, onglets 693, actions 643 dont jauges 199, horloge 81 et
   « Chercher » 69).
   Quand la place manque, cèdent dans l'ordre : le mot « Chercher » et la
   mention « intranet », puis le nom (le logo reste), puis les jauges, qui
   passent dans le menu du profil ; enfin les onglets prennent leur ligne. */
@media (max-width:1629px){
  .tu-chercher-txt,.tu-marque-txt span{display:none}
}
@media (max-width:1559px){
  .tu-marque-txt{display:none}
}
@media (max-width:1419px){
  .tu-jauges-entete{display:none}
  .tu-jauges-profil{display:flex}
}
@media (max-width:1199px){
  .tu-onglets{order:3;width:100%}
}
/* DANS UN CADRE (les onglets de Mail et de Documents chargent des pages
   entières) · la page affiche son contenu seul, sans en-tête ni onglets du bas,
   comme l'ancienne coquille (html.embarque d'app.css). */
html.embarque .tu-entete,html.embarque .tu-bas{display:none!important}
html.embarque .tu .tu-page{padding-bottom:14px}

/* LES ONGLETS DU BAS (téléphone) · repris de l'ancienne coquille (.onglets
   d'app.css) : fond voilé, marge du repère d'accueil, pastille sur l'icône. */
.tu-bas{display:none}
@media (max-width:860px){
  .tu-bas{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:38;
    background:color-mix(in srgb,var(--tu-carte) 86%,transparent);
    backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);
    border-top:1px solid var(--tu-trait);
    padding-bottom:max(env(safe-area-inset-bottom),8px);
    padding-left:max(env(safe-area-inset-left),4px);padding-right:max(env(safe-area-inset-right),4px)}
  .tu .tu-bas-ong{flex:1 1 0;min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;
    padding:8px 2px 6px;border:0;background:none;color:var(--tu-doux);font:inherit;font-size:10px;font-weight:600;
    text-decoration:none;cursor:pointer}
  .tu .tu-bas-ong .icon{width:20px;height:20px}
  .tu-bas-ong > span:not(.tu-bas-n){max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tu .tu-bas-ong.actif{color:var(--tu-encre)}
  .tu-bas-ong.actif::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:22px;height:3px;border-radius:0 0 3px 3px;background:var(--tu-encre)}
  .tu-bas-n{position:absolute;top:4px;right:calc(50% - 19px);min-width:16px;height:16px;padding:0 4px;box-sizing:border-box;
    border-radius:999px;background:var(--tu-p-vif);color:#FFFFFF;font-size:9.5px;font-weight:700;display:grid;place-items:center}
  .tu-horloge{display:none}
  /* La page rend la place que prennent les onglets. */
  .tu .tu-page{padding-bottom:calc(84px + max(env(safe-area-inset-bottom),8px))}
}
@media (max-width:900px){
  /* Vingt pixels d'air de plus sous la barre d'état, et seulement quand il y
     en a une (application plein écran) : réglé sur l'iPhone de Romain le
     24/10/2026. Dans un navigateur, env() vaut zéro et le min() aussi. */
  .tu-entete{padding:calc(10px + env(safe-area-inset-top,0px) + min(20px, env(safe-area-inset-top,0px)))
    max(14px,env(safe-area-inset-right,0px)) 10px max(14px,env(safe-area-inset-left,0px))}
  .tu-onglets{order:3;width:100%}
  .tu-chercher-txt,.tu-chercher kbd{display:none}
  .tu-page{padding:4px max(14px,env(safe-area-inset-right,0px)) 40px max(14px,env(safe-area-inset-left,0px))}
  .tu-panneau{left:14px;right:14px}
  .tu-panneau-profil{width:auto}
}

/* À L'IMPRESSION, la page seule : ni en-tête, ni fenêtres, ni onglets du bas. */
@media print{
  .tu-entete,.tu-voile,.tu-bas{display:none!important}
  .tu .tu-page{padding:0}
}