/* ===== ARRIANE zen — essai du 11/09/2026 =====
   Un seul fichier, chargé APRÈS le <style> de la page : il ne touche pas à
   la mise en page, seulement à la peau (papier chaud, une police, une
   couleur vive, celle du logo). Pour revenir en arrière : retirer la ligne
   <link> dans la page. Maquette : /maquette-zen.html */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;600&display=swap');

/* Luminosité : le curseur du bandeau va de 0 (blanc) à 1 (pleine nuit). Le
   papier beige de la maquette est à 0,35, c'est le réglage de départ ; en
   dessous, le papier s'éclaircit jusqu'au blanc (classe clair).
   Jusqu'à la moitié, c'est le jour qui baisse : le papier s'assombrit, le
   texte reste sombre. Passé la moitié, c'est la nuit qui s'éclaircit : fond
   sombre, texte clair. Le script pose --dim (0 → 1 vers le milieu) et la
   classe nuit sur <html>. Mélanger directement jour et nuit donnerait du
   gris sur gris à mi-course : illisible. */
:root{ --dim:0; }
html, :root{
  --a-bg:#F6F4EF; --b-bg:#B9B5AD;
  --a-card:#FBFAF7; --b-card:#C0BCB4;
  --a-mute:#787D86; --b-mute:#4E525A;
  --a-faint:#ADB0B6; --b-faint:#6C7078;
  --a-border:#E6E2DA; --b-border:#A19D95;
  --a-soft:#EEEBE4; --b-soft:#ABA79F;
  --a-tint:#EFEAE0; --b-tint:#B0ABA1;
  --text:#2B2F36; --navy:#1E3A5F; --accent:#C2643B; --logo-fond:var(--bg);
}
html.clair{
  --b-bg:#FFFFFF; --b-card:#FFFFFF; --b-tint:#F3EFE7; --b-border:#ECE8E0; --b-soft:#F2EFE9;
  --b-mute:#787D86; --b-faint:#ADB0B6;
}
html.nuit{
  /* La nuit de DEDALE : un bleu profond, pas un gris. */
  --a-bg:#0A1F45; --b-bg:#1E4C80;
  --a-card:#12295A; --b-card:#2A5A90;
  --a-mute:#94a3b8; --b-mute:#b6c2d4;
  --a-faint:#64748b; --b-faint:#8a98ad;
  --a-border:rgba(255,255,255,.15); --b-border:rgba(255,255,255,.28);
  --a-soft:rgba(255,255,255,.10); --b-soft:rgba(255,255,255,.2);
  --a-tint:rgba(255,255,255,.10); --b-tint:rgba(255,255,255,.18);
  --text:#e0e7ff; --navy:#e0e7ff; --accent:#22d3ee; --logo-fond:transparent;
}
/* ===== La nuit de DEDALE, telle quelle =====
   Le ciel qui respire, l'aurore qui passe, 80 étoiles qui scintillent, 15
   particules qui montent, le fluo violet-cyan. Les étoiles et l'aurore sont
   posées par ariane-zen.js ; le jour, elles sont éteintes. */
html.nuit{background:#000428;}
html.nuit body{background:transparent;}
html.nuit::before{content:''; position:fixed; inset:0; z-index:-3; pointer-events:none;
  background:linear-gradient(to bottom, #000428 0%, #004e92 30%, #009ffd 70%, #004e92 100%);
  animation:zen-nightSky 30s ease-in-out infinite;}
/* Le ciel respire entre .35 et .5 (et plus .4 → .6) : à .6, le bas de la page
   montait à rgb(0,95,152) et l'encre secondaire y tombait sous 4,5:1, la
   règle AA du contraste (16/09, mesuré écran par écran). À .5 il plafonne à
   rgb(0,80,127), et tout ce qui est écrit repasse la barre. */
@keyframes zen-nightSky{0%,100%{filter:brightness(.24) hue-rotate(0deg);} 50%{filter:brightness(.34) hue-rotate(20deg);}}
.zen-aurora{position:fixed; top:-20%; left:-10%; width:120%; height:40%; opacity:0; filter:blur(120px); z-index:-2; pointer-events:none; transition:opacity 1s ease;}
html.nuit .zen-aurora{opacity:.2; animation:zen-auroraSubtle 25s ease-in-out infinite;}
.zen-aurora::before{content:''; position:absolute; width:200%; height:200%;
  background:linear-gradient(60deg, transparent 0%, rgba(0,255,136,.3) 20%, rgba(0,255,255,.3) 35%, rgba(139,92,246,.3) 50%, rgba(236,72,153,.3) 65%, rgba(6,182,212,.3) 80%, transparent 100%);
  transform:rotate(-60deg) translateY(-50%); animation:zen-auroraFlow 20s linear infinite;}
@keyframes zen-auroraSubtle{0%,100%{transform:translateY(0) scaleX(1);} 50%{transform:translateY(-50px) scaleX(1.1);}}
@keyframes zen-auroraFlow{0%{transform:rotate(-60deg) translateY(-50%) translateX(-30%);} 100%{transform:rotate(-60deg) translateY(-50%) translateX(30%);}}
.zen-star{position:fixed; width:2px; height:2px; background:#fff; border-radius:50%; opacity:0; pointer-events:none; z-index:-1; transition:opacity 1s ease;}
html.nuit .zen-star{opacity:.7; animation:zen-twinkle 3s ease-in-out infinite;}
@keyframes zen-twinkle{0%,100%{opacity:.3; transform:scale(1);} 50%{opacity:1; transform:scale(1.5);}}
.zen-particle{position:fixed; width:3px; height:3px; background:rgba(255,255,255,.8); border-radius:50%; pointer-events:none; opacity:0; z-index:-1;}
html.nuit .zen-particle{animation:zen-floatUp 15s linear infinite;}
@keyframes zen-floatUp{0%{transform:translateY(100vh) translateX(0); opacity:0;} 10%{opacity:1;} 90%{opacity:1;} 100%{transform:translateY(-100vh) translateX(20px); opacity:0;}}

/* Aucun bloc la nuit : tout se pose sur le ciel, comme la page Appels d'offre. */
html.nuit .card, html.nuit .chantier-card, html.nuit .card-plat, html.nuit .rounded-2xl, html.nuit .at-wrap, html.nuit .wday, html.nuit .marche-carte{
  background:transparent !important; border-color:rgba(255,255,255,.14) !important; box-shadow:none !important;}
html.nuit .card{border:none !important;}
html.nuit .topnav, html.nuit .topbar{border-color:rgba(255,255,255,.1);}
/* Le fluo : le nom en dégradé violet → cyan, le menu souligné violet, le
   bouton plein en dégradé, les champs sur du noir translucide. */
html.nuit .brand-name{color:#fff;}
html.nuit .topnav a.active{border-bottom-color:#22d3ee; color:#e0e7ff;}
html.nuit .topnav a:hover{border-bottom-color:#22d3ee;}
html.nuit .a-btn-primaire, html.nuit .btn-primary{background:linear-gradient(135deg, #0891b2, #16a34a) !important; border-color:transparent !important; color:#fff !important; box-shadow:0 4px 15px rgba(34,211,238,.35);}
html.nuit .a-champ, html.nuit .a-select, html.nuit .a-zone, html.nuit input:not([type=range]):not([type=checkbox]):not([type=radio]), html.nuit select, html.nuit textarea{
  background:rgba(0,0,0,.3) !important; border:1px solid rgba(255,255,255,.2) !important; color:#e0e7ff !important;}
html.nuit .a-champ:focus, html.nuit input:focus, html.nuit select:focus, html.nuit textarea:focus{border-color:rgba(139,92,246,.5) !important; box-shadow:0 0 0 3px rgba(139,92,246,.2) !important;}
html.nuit .a-vert, html.nuit .text-green-700{color:#4ade80 !important;} html.nuit .a-rouge{color:#f472b6 !important;} html.nuit .a-ambre{color:#facc15 !important;}
html.nuit .lumiere::-webkit-slider-thumb{background:#fff; border-color:#22d3ee;}
:root{
  --pn:calc(var(--dim) * 100%);
  --bg:color-mix(in oklab, var(--b-bg) var(--pn), var(--a-bg));
  --card:color-mix(in oklab, var(--b-card) var(--pn), var(--a-card));
  --paper:var(--card);
  --text-mute:color-mix(in oklab, var(--b-mute) var(--pn), var(--a-mute));
  --text-faint:color-mix(in oklab, var(--b-faint) var(--pn), var(--a-faint));
  --border:color-mix(in oklab, var(--b-border) var(--pn), var(--a-border));
  --border-soft:color-mix(in oklab, var(--b-soft) var(--pn), var(--a-soft));
  --tint:color-mix(in oklab, var(--b-tint) var(--pn), var(--a-tint));
  --navy-light:var(--navy); --blue-accent:var(--accent);
}
html, body, body.ariane{
  font-family:'Source Sans 3','Helvetica Neue',Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--text);
}
body.ariane{font-size:16px; line-height:1.45; padding:36px 56px 72px;}

/* Bandeau et menu */
.topbar{padding-bottom:22px; margin-bottom:0; border-bottom:none;}
.brand img{background:var(--logo-fond); border-radius:8px; padding:3px 6px; box-sizing:content-box;}
.brand-name{font-size:22px; font-weight:600; letter-spacing:.06em;}
/* L'escalier du logo a son poids en bas : le nom descend pour tomber sur son
   milieu, pas sur celui de la boite de l'image (demande du 15/09). Pas sur la
   page de connexion, ou le nom est sous le logo. */
.topbar .brand-name, .brand-mark + .brand-name{padding-top:12px;}
.topbar-right{gap:26px;}
.prenom{font-size:16px; color:var(--text-mute); letter-spacing:.02em;}
.topbar-gear{color:var(--text-mute);} .topbar-gear:hover{color:var(--text);}
.logout:hover{color:var(--accent);}
.topnav{gap:30px; margin-bottom:44px;}
.topnav a{padding:10px 0 14px; font-size:19px; font-weight:400; color:var(--text-mute);}
.topnav a:hover{color:var(--text);}
.topnav a.active{color:var(--text); border-bottom-color:var(--accent);}

/* Blocs : un titre discret en capitales, un filet entre deux */
.card{padding:0 0 40px; margin-bottom:40px; border-bottom:1px solid var(--border);}
.card + .card{border-top:none;}
.card:last-of-type{border-bottom:none;}
.stack{margin-bottom:40px;}
.section-label{margin:0 0 20px;}
.section-label svg{display:none;}
.section-label h2, .agenda-header, .wn-side-head{
  font-size:14px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--text-mute);
}
.wn-side-head{border-bottom:none; padding-bottom:0; margin-bottom:14px;}

/* Météo */
.weather-strip{gap:14px;}
.wday{border:none; border-radius:10px; padding:14px 10px 16px;}
.wday.today{background:var(--tint); border:none;}
/* Le contenu des cases est grossi (15/09), le cadre garde sa largeur. */
.wday .name{font-size:16px; font-weight:400; letter-spacing:.08em;}
.wday .num{font-size:22px; font-weight:600; color:var(--text); margin-bottom:6px;}
.wday svg{width:44px; height:44px; color:var(--text-mute); stroke-width:1.5;}
.wday .temps{font-size:17px; font-weight:400; font-variant-numeric:tabular-nums;}
.wday .temps .min{font-weight:400;}
.wday .flag{font-weight:400;}

/* Semainier */
.agenda-header button{color:var(--text-faint) !important; font-weight:400 !important;}
.agenda-table{border:none; border-top:1px solid var(--border); border-left:1px solid var(--border-soft); border-radius:0;}
.agenda-table thead th{font-size:13px; font-weight:400; letter-spacing:.06em; color:var(--text-mute); padding:10px 4px; border-bottom:1px solid var(--border-soft);}
.agenda-table thead th .d{font-size:18px; font-weight:600; color:var(--text);}
.agenda-table td.time, #agendaBody td.time{color:var(--text-faint); font-weight:400; border-right:1px solid var(--border-soft);}
.agenda-table tr:nth-child(odd) td.slot, .agenda-table tr:nth-child(even) td.slot{background:none;}
td.slot:hover{background:var(--tint) !important;}
td.slot.slot-sel{background:var(--tint) !important; box-shadow:inset 0 0 0 1px var(--accent);}
#agendaBody tr.hour-full td{border-top:1px solid var(--border-soft);}
#agendaBody tr.hour-half td{border-top:1px dashed transparent;}
/* La couleur du chantier vient des données, telle quelle : le voile à 55 %
   qui la fondait dans la page est tombé le 15/09 (« un brin fadasse »). Pas
   de filet au bord : essayé le même jour, refusé. */
.block{border-left:none; border-radius:6px; padding:6px 10px; font-weight:400; color:var(--text);}
#agendaBody .block{font-size:16px; line-height:1.3;}
.block .del{color:var(--text); font-weight:400;}
.block .resize-h::after{background:var(--text-mute);}
.agenda-flex{gap:36px; padding:0;}
.wn-side{width:320px; border-left:none; padding-left:0;}
.wn-day-row{border-bottom:none; border-top:1px solid var(--border-soft); padding:10px 0 8px; margin:0;}
.wn-day-label{font-size:14px; font-weight:400; letter-spacing:0; text-transform:none; color:var(--text-faint);}
.wn-inputs textarea.wn-note{border:none; padding:2px 0; font-size:17px; line-height:1.4; color:var(--text);}
.wn-inputs textarea.wn-note:focus{border:none; background:var(--tint); border-radius:4px; padding:2px 6px;}
.wn-expand{color:var(--text-faint);}

/* Champs de saisie : pas de cadre, juste une ligne discrète */
.todo-input-row input, .todo-input-row select, .chantier-add input, .chantier-task-add input{
  background:none; border:none; border-bottom:1px solid var(--border-soft); border-radius:0;
  padding:10px 0; font-size:16px; color:var(--text);
}
.todo-input-row input:focus, .chantier-add input:focus, .chantier-task-add input:focus{border-color:var(--text-mute); box-shadow:none;}
.todo-input-row input::placeholder, .chantier-add input::placeholder, .chantier-task-add input::placeholder{color:var(--text-faint);}
.todo-input-row select{color:var(--text-mute);}
.todo-input-row button, .chantier-add button, .chantier-task-add button{
  background:none; color:var(--text-mute); border:none; font-weight:400;
}
.todo-input-row button:hover, .chantier-add button:hover, .chantier-task-add button:hover{color:var(--accent);}
.chantier-suggest{background:var(--card); border-color:var(--border); box-shadow:0 8px 24px rgba(0,0,0,.12);}

/* Cases à cocher rondes, texte tranquille */
.todo-list input[type=checkbox], .chantier-tasks input[type=checkbox]{
  appearance:none; -webkit-appearance:none; width:18px; height:18px; border-radius:50%;
  border:1.5px solid var(--text-faint); background:none; margin:0; flex-shrink:0;
}
.chantier-tasks input[type=checkbox]{width:15px; height:15px;}
.todo-list input[type=checkbox]:checked, .chantier-tasks input[type=checkbox]:checked{background:var(--text-faint); border-color:var(--text-faint);}
.todo-list{max-width:760px;}
.todo-list li{gap:14px; padding:12px 0; border-bottom:none; border-top:1px solid var(--border-soft);}
.todo-list li:first-child{border-top:none;}
.todo-list .label{font-size:16px;}
.prio-dot{display:none;} .prio-dot.haute{display:block; background:var(--accent);}
.todo-list .ech{border:none; padding:0; font-size:14px; font-weight:400; color:var(--text-mute); font-variant-numeric:tabular-nums;}
.todo-list .ech.retard{color:var(--accent);}
.todo-list .rm, .chantier-tasks .rm, .chantier-close{color:transparent;}
.todo-list li:hover .rm, .chantier-tasks li:hover .rm, .chantier-card:hover .chantier-close{color:var(--text-faint);}
.todo-list .rm:hover, .chantier-tasks .rm:hover, .chantier-close:hover{color:var(--accent);}
.empty-row, .muted-load{font-size:15px; color:var(--text-faint);}

/* Préparation de chantier */
.chantier-grid{gap:36px; grid-template-columns:repeat(auto-fill, minmax(300px,1fr));}
.chantier-card{background:var(--card); border:1px solid var(--border-soft); border-radius:10px; padding:18px 20px 16px;}
.chantier-name{font-size:16px; font-weight:600;}
.chantier-count{font-size:14px; font-weight:400; color:var(--text-mute);}
.chantier-tasks li{gap:10px; padding:8px 0; border-bottom:none; border-top:1px solid var(--border-soft); font-size:15px;}
.chantier-task-add input{font-size:15px; padding:8px 0;}

@media (max-width:768px){
  body.ariane{padding:16px 14px 48px;}
  .topnav{gap:18px;}
  .chantier-grid{gap:18px;}
}

/* Le curseur de luminosité : un trait, un point. Pas d'étiquette. */
.lumiere{-webkit-appearance:none; appearance:none; width:110px; height:18px; margin:0; background:none; cursor:pointer;}
.lumiere::-webkit-slider-runnable-track{height:2px; border-radius:2px; background:linear-gradient(90deg, #ADB0B6, #1C2027);}
.lumiere::-webkit-slider-thumb{-webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:var(--card); border:1.5px solid var(--text-mute); margin-top:-6px;}
.lumiere::-moz-range-track{height:2px; border-radius:2px; background:linear-gradient(90deg, #ADB0B6, #1C2027);}
.lumiere::-moz-range-thumb{width:14px; height:14px; border-radius:50%; background:var(--card); border:1.5px solid var(--text-mute);}
.lumiere:focus{outline:none;}

/* ===== Les pages en Tailwind =====
   Elles écrivent leurs couleurs en classes (bg-white, text-gray-800...).
   On les ramène aux jetons pour qu'elles suivent le curseur comme les autres. */
.bg-white, .bg-gray-50{background-color:var(--card) !important;}
.bg-gray-100, .bg-gray-200{background-color:var(--bg) !important;}
.bg-\[\#eef2f7\], .bg-blue-50{background-color:var(--tint) !important;}
.bg-green-50, .bg-red-50, .bg-orange-50, .bg-yellow-50, .bg-amber-50, .bg-green-100{background-color:var(--tint) !important;}
.text-gray-900, .text-gray-800, .text-gray-700, .text-black{color:var(--text) !important;}
.text-gray-600, .text-gray-500{color:var(--text-mute) !important;}
.text-gray-400, .text-gray-300{color:var(--text-faint) !important;}
.text-blue-800, .text-blue-700{color:var(--navy) !important;}
.text-red-400, .text-red-500, .text-red-600, .text-amber-700{color:var(--accent) !important;}
.border-gray-50, .border-gray-100, .border-gray-200, .border-gray-300, .border-blue-200{border-color:var(--border) !important;}
.shadow, .shadow-md, .shadow-lg, .shadow-sm, .shadow-xl{box-shadow:none !important;}
.rounded-2xl{border:1px solid var(--border-soft);}
input, select, textarea{color:var(--text); background-color:var(--card);}
.at-code{background:var(--tint) !important; border-color:var(--border) !important;}
.at-btn.b{background:var(--tint) !important;}
.at-btn.n{background:var(--bg) !important;}

/* ===== L'échelle des tailles : 12 · 13 · 15 · 22, rien d'autre =====
   Les pages ont été ramenées à cette échelle le 11/09 ; ici, les composants
   communs (ariane-shell, ariane-ui) et les classes Tailwind. */
.a-btn, .a-champ, .a-select, .a-zone, .at-table, .at-table td, .a-table, .a-titre, .a-btn-primaire, .marche-carte h3{font-size:16px;}
.a-sous-titre, .logout{font-size:14px;}
.a-etiquette, .a-label, .a-table th, .at-table th, .at-sub, .at-code, .at-tag, .at-btn{font-size:13px;}
.brand-name{font-size:22px;}
.text-xs{font-size:13px !important; line-height:1.45 !important;}
.text-sm, .text-base, .text-lg{font-size:16px !important; line-height:1.45 !important;}
/* Les sous-onglets (Entrées/Sorties, Infos/Surveillance/Prépa, Contre-étude/KPF…)
   à 17 px, un cran sous le menu du haut à 19 (15/09). */
.tabs .tab, .tab-btn, .stab, .sous-onglet{font-size:17px !important; font-weight:400;}
.text-xl, .text-2xl, .text-3xl{font-size:22px !important; line-height:1.3 !important;}

/* ===== Les pages qui ont leurs propres jetons (Appels d'offre et cousines) =====
   Elles écrivent --text-title, --gray-200, --navy-900... : on les fait pointer
   sur les jetons communs, et elles suivent la police, le papier et le curseur. */
:root{
  --font:'Source Sans 3','Helvetica Neue',Helvetica,Arial,sans-serif;
  --text-title:var(--text); --text-sub:var(--text-mute);
  --gray-950:var(--text); --gray-900:var(--text); --gray-700:var(--text); --gray-500:var(--text-mute);
  --gray-400:var(--text-faint); --gray-200:var(--border); --gray-100:var(--border-soft); --gray-50:var(--tint);
  --white:var(--card); --card-white:var(--card); --card-border:var(--border-soft); --bg-page:var(--bg);
  --navy-900:var(--navy); --navy-700:var(--navy); --navy-600:var(--navy); --navy-100:var(--tint); --navy-50:var(--tint);
  --accent-purple:var(--accent); --accent-purple-100:var(--tint); --accent-blue:var(--accent);
  --green-100:var(--tint); --amber-100:var(--tint); --red-100:var(--tint);
  --gray-pill-text:var(--text-mute); --gray-pill-bg:var(--tint);
  --shadow-card:none; --shadow-hover:none;
}
.aoapp .btn{font-weight:400;}

/* ===== Les lignes en « bandeaux » (Équipement, Factures) =====
   Chaque ligne était une petite carte à coins arrondis ; à la charte, une
   ligne est une ligne : un filet dessous, rien autour. */
table.bandeaux{border-collapse:collapse; border-spacing:0;}
table.bandeaux tbody td, table.bandeaux tbody td:first-child, table.bandeaux tbody td:last-child{
  border:none; border-bottom:1px solid var(--border-soft); border-radius:0; padding:12px 12px;
}
table.bandeaux tbody tr:hover td{background:var(--tint);}
.carte-registre{border:none; border-bottom:1px solid var(--border-soft); border-radius:0; padding:14px 4px;}
.carte-registre:hover{background:var(--tint);}
th{color:var(--text-mute); border-bottom-color:var(--border);}
td{color:var(--text); border-bottom-color:var(--border-soft);}
.tab-btn{color:var(--text-mute);} .tab-btn.active{color:var(--text); border-bottom-color:var(--accent);}
.modal-card{background:var(--card); color:var(--text);}

/* ===== Le haut à droite : trois pictos =====
   Le point d'interrogation (Support), la disquette (Stockage), l'engrenage
   (Paramètres) — demandés le 16/09 à la place des trois mots. Le mot reste
   dans le titre du bouton, pour la souris. */
.topbar-gear{display:inline-flex; align-items:center; padding:4px; border-radius:6px;}
.topbar-gear svg{display:block; width:20px; height:20px;}
.topbar-gear #pastille-support{transform:translate(9px,-9px);}
.logout{color:var(--text-mute); font-size:15px; font-weight:400;}
.topbar-right{gap:26px;}
.prenom{font-size:16px; color:var(--text-mute); letter-spacing:.02em;}
/* Déconnexion : juste le picto (la porte et la flèche), pas le mot. */
.logout{font-size:0; width:20px; height:20px; color:var(--text-mute); background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") center/contain no-repeat;}
.logout:hover{color:var(--accent);}

/* ===== Le déboursé du devis : son fond est celui de la page =====
   Le tableau était posé sur un blanc franc ; il prend le papier. Les lignes
   de couleur (titre, ouvrage, ressource) restent ce qu'elles sont. */
.dbt-wrap, tr.dbt-remplissage td, tr.dbt-vide td, .dbt-semer:focus, .dbt-in{background:var(--bg) !important;}
.dbt-wrap{border-color:var(--border-soft);}
table.dbt-table thead th{background:var(--tint) !important;}
table.dbt-table td{border-right-color:var(--border-soft);}
.db-btn, .dbt-menu, .bible-panel, .bp-search input{background:var(--card) !important; color:var(--text);}
/* La ligne choisie : un pastel et un filet, pas un aplat marine. */
tr.dbt-sel td{background:var(--tint) !important; color:var(--text) !important; box-shadow:inset 0 1px 0 var(--accent), inset 0 -1px 0 var(--accent);}
tr.dbt-sel .dbt-num, tr.dbt-sel .dbt-code-txt, tr.dbt-sel .dbt-calc{color:var(--text-mute) !important;}
tr.dbt-sel .dbt-ico svg{fill:var(--text); color:var(--text);}
tr.dbt-sel .dbt-boite{background:var(--card); color:var(--text); border-color:var(--border);}
tr.dbt-sel .dbt-g::before, tr.dbt-sel .dbt-g::after, tr.dbt-sel .dbt-coude::before, tr.dbt-sel .dbt-coude::after{background:var(--text-faint);}
/* Les ressources : le vert sauge de la maquette, à la place du vert menthe. */
tr.dbt-ressource td{background:#DDE6DA !important; color:#3B5A42 !important;}
/* Les ouvrages : le bleu ciel de la maquette. */
tr.dbt-ouvrage td{background:#DBE4EC !important; color:#2F4A66 !important;}

/* Le texte posé sur du marine (boutons pleins) : blanc le jour ; la nuit le
   marine est devenu clair, alors le texte devient sombre. */
:root{--sur-navy:#FFFFFF;}
html.nuit{--sur-navy:#ffffff;}

/* ===== La nuit : un ciel uni, des couleurs vives =====
   Les blocs pleins (var(--card), var(--bg)) faisaient des bandeaux bleus sur
   le ciel : la nuit ils deviennent transparents ou en verre, et seuls les
   menus et fenêtres qui flottent gardent un fond plein. */
html.nuit{--card:rgba(255,255,255,.06); --paper:rgba(255,255,255,.04);}
html.nuit .bg-white, html.nuit .bg-gray-50, html.nuit .bg-gray-100, html.nuit .bg-gray-200{background-color:transparent !important;}
html.nuit .dbt-wrap, html.nuit tr.dbt-remplissage td, html.nuit tr.dbt-vide td{background:transparent !important;}
html.nuit table.dbt-table thead th{background:rgba(0,4,40,.55) !important; color:#e0e7ff;}
html.nuit .chantier-suggest, html.nuit .dbt-menu, html.nuit .doc-menu, html.nuit .modal-card, html.nuit .card-plat-xl, html.nuit .bible-panel,
html.nuit .a-menu, html.nuit [role=menu], html.nuit .popover, html.nuit .dc-modal{
  background:#0B1E44 !important; color:#e0e7ff; border:1px solid rgba(255,255,255,.18) !important; backdrop-filter:none;}
html.nuit select option{background:#0B1E44; color:#e0e7ff;}
/* Les cases du planning : vives, comme DEDALE. Le déboursé, lui, est plus bas : la nuit y est un plan lumineux. */
html.nuit table.dbt-table input, html.nuit .dbt-in, html.nuit .dbt-semer{background:rgba(0,0,0,.25) !important; color:#fff !important; border-color:rgba(255,255,255,.35) !important;}
html.nuit .block{box-shadow:none; color:#fff; font-weight:600;}
html.nuit .todo-list li, html.nuit .chantier-tasks li, html.nuit table.bandeaux tbody td, html.nuit .carte-registre, html.nuit td, html.nuit .dc-item{border-color:rgba(255,255,255,.12) !important;}

/* ===== Les six couleurs : pastel le jour, fluo la nuit =====
   La couleur d'un chantier est écrite en base en pastel (les six pastilles
   de l'agenda). La nuit, chaque pastel devient son fluo, sans rien changer en
   base : on reconnaît la couleur posée dans le style de la case. Le style
   s'écrit tantôt en hex (planning), tantôt en rgb() (agenda) : les deux. */
html.nuit .block, html.nuit .creneau-cell, html.nuit .eq-pastille, html.nuit i[data-bg]{color:#fff !important;}
html.nuit :is([style*="#DCE9F5" i],[style*="#D6ECD9" i],[style*="#FAF3CE" i],[style*="#FBE0C9" i],[style*="#F6D3D0" i],[style*="#E4DAF3" i],[style*="rgb(220, 233, 245)"],[style*="rgb(214, 236, 217)"],[style*="rgb(250, 243, 206)"],[style*="rgb(251, 224, 201)"],[style*="rgb(246, 211, 208)"],[style*="rgb(228, 218, 243)"]){color:#fff !important;}
html.nuit :is([style*="#DCE9F5" i], [style*="rgb(220, 233, 245)"]){background:#22d3ee !important;}
html.nuit :is([style*="#D6ECD9" i], [style*="rgb(214, 236, 217)"]){background:#4ade80 !important;}
html.nuit :is([style*="#FAF3CE" i], [style*="rgb(250, 243, 206)"]){background:#facc15 !important; color:#1a1a1a !important;}
html.nuit :is([style*="#FBE0C9" i], [style*="rgb(251, 224, 201)"]){background:#fb923c !important;}
html.nuit :is([style*="#F6D3D0" i], [style*="rgb(246, 211, 208)"]){background:#f472b6 !important;}
html.nuit :is([style*="#E4DAF3" i], [style*="rgb(228, 218, 243)"]){background:#c084fc !important;}
/* Sans couleur choisie : le bleu de DEDALE. */
html.nuit .block:not([style*="background"]), html.nuit .block[style*="var(--tint)"]{background:#667eea !important;}
html.nuit .creneau-cell[style*="var(--tint)"]{background:#667eea !important;}
html.nuit .creneau-cell[style*="#fef3c7" i]{background:#facc15 !important; color:#1a1a1a !important;}
html.nuit .creneau-cell[style*="#fee2e2" i]{background:#f472b6 !important;}

/* ── L'échelle : une seule taille de texte pour tous les écrans (16/09).
   Trois feuilles et Tailwind en posaient chacune une (15, 14, 13.5, 13,
   12.5, 12…) : Ludo ne voyait « rien à la même taille », et trop petit.
   Trois crans, partout : courant 16, secondaire 14, étiquette 13. Les
   titres gardent les leurs. `body .x` passe devant Tailwind, chargé après. */
body, body.ariane{font-size:16px;}
body .text-sm, body .text-base, body .a-table, body .at-table, body .a-champ,
body input, body select, body textarea, body button{font-size:16px; line-height:1.45;}
body .text-xs, body .a-sous-titre, body .at-sub, body .at-code, body .at-tag{font-size:14px; line-height:1.4;}
body .a-label, body .a-etiquette, body .at-table th{font-size:13px;}
body .text-lg{font-size:18px;}

/* ── La nuit, passée au peigne (16/09). Ludo : « certains endroits pas blancs
   mais transparents, certains fonds blancs sur le noir ». Deux causes : le
   bleu marine sert de fond à quelques boutons et onglets, et la nuit en fait
   la couleur du texte — blanc sur blanc ; et des fonds pâles posés en dur
   (pastels de tableaux, tuiles, puces) restent clairs sur le bleu profond. */
html.nuit{color-scheme:dark;}
/* Ce qui avait le bleu marine en fond prend le dégradé de DEDALE, comme le bouton principal. */
html.nuit .h-btn.plein, html.nuit .b.plein, html.nuit .bouton.plus, html.nuit .onglet.actif,
html.nuit table.mois .day-header.aujourdhui .jh, html.nuit thead tr[style*="var(--navy)"]{
  background:linear-gradient(135deg, #0891b2, #16a34a) !important; border-color:transparent !important; color:#fff !important;}
/* Les fonds pâles posés en dur s'effacent : un voile blanc léger, ou rien. */
html.nuit table.mois .jh, html.nuit table.mois .day-header.weekend .jh,
html.nuit .puce.chantier, html.nuit .bandeau.info, html.nuit .tot.fort,
html.nuit .instrument{background:rgba(255,255,255,.08) !important; color:#e0e7ff !important;}
html.nuit table.fh tr.we td{background:rgba(255,255,255,.05) !important;}
html.nuit table.fh tr.passe td{background:transparent !important; color:#94a3b8 !important;}
html.nuit table.fh tr.auj td{background:rgba(34,211,238,.18) !important;}
/* Le menu en tête de colonne (Devis, AO, Chantiers) reste du texte, pas un champ. */
html.nuit select.a-tete{background:none !important; border:none !important; color:#e0e7ff !important;}
/* Les règles des jauges : un trait discret, pas une barre blanche. */
html.nuit .jauge{background:rgba(255,255,255,.12) !important; box-shadow:none !important;}
html.nuit .lc-barre{background:rgba(255,255,255,.12) !important;}
/* La carte : les tuiles du jour retournées, elle se fond dans la nuit. */
html.nuit iframe[src*="maps.google.com"]{filter:invert(.9) hue-rotate(180deg) saturate(.6);}
/* Les bandeaux collants (fiche chantier, paramètres) : un voile sur le ciel, pas une plaque opaque. */
html.nuit .sticky[style*="var(--bg)"]{background:rgba(0,4,40,.55) !important; backdrop-filter:blur(10px); border-color:rgba(255,255,255,.1) !important;}

/* ══ Le déboursé, la nuit : un plan lumineux (16/09) ══
   Les trois natures ne sont plus des dalles fluo à texte blanc, illisibles :
   la couleur devient une lumière. Un trait de lumière au bord gauche de la
   ligne, le numéro qui l'emprunte, et un voile de cette teinte d'autant plus
   présent qu'on est haut dans l'arbre — violet pour les titres, cyan pour
   les ouvrages, rien pour les ressources, qui sont le papier. La ligne
   choisie s'allume en blanc. Le reste est de l'encre claire sur la nuit. */
html.nuit .dbt-wrap{background:rgba(0,4,40,.35) !important; border-color:rgba(255,255,255,.12) !important;}
html.nuit table.dbt-table thead th{background:rgba(6,14,50,.94) !important; color:#b6c2d4; border-color:rgba(255,255,255,.12) !important;}
html.nuit body.tab-debourse #dbThCode, html.nuit #dbThCode{color:#e0e7ff;}
html.nuit table.dbt-table td{border-right-color:rgba(255,255,255,.05); border-bottom:1px solid rgba(255,255,255,.035);}
html.nuit tr.dbt-remplissage td, html.nuit tr.dbt-vide td{background:transparent !important;}
html.nuit tr.dbt-titre td{background:rgba(192,132,252,.13) !important; color:#ede9fe !important; font-weight:600;}
html.nuit tr.dbt-titre td:first-child{box-shadow:inset 3px 0 0 #c084fc;}
html.nuit tr.dbt-titre .dbt-num{color:#d8b4fe; text-shadow:0 0 12px rgba(192,132,252,.7);}
html.nuit tr.dbt-ouvrage td{background:rgba(34,211,238,.07) !important; color:#e0f7fb !important;}
html.nuit tr.dbt-ouvrage td:first-child{box-shadow:inset 3px 0 0 #22d3ee;}
html.nuit tr.dbt-ouvrage .dbt-num, html.nuit tr.dbt-ouvrage .dbt-code-txt{color:#67e8f9 !important;}
html.nuit tr.dbt-ressource td{background:transparent !important; color:#c7d2e0 !important;}
html.nuit tr.dbt-ressource td:first-child{box-shadow:inset 3px 0 0 rgba(74,222,128,.45);}
html.nuit tr.dbt-ressource .dbt-code-txt{color:#86efac !important; opacity:.8;}
html.nuit tr.dbt-l:hover td{filter:none; background:rgba(255,255,255,.055) !important;}
html.nuit tr.dbt-sel td{background:rgba(167,139,250,.24) !important; color:#fff !important;
  box-shadow:inset 0 1px 0 rgba(196,181,253,.7), inset 0 -1px 0 rgba(196,181,253,.7);}
html.nuit tr.dbt-sel td:first-child{box-shadow:inset 3px 0 0 #fff, inset 0 1px 0 rgba(196,181,253,.7), inset 0 -1px 0 rgba(196,181,253,.7);}
html.nuit tr.dbt-sel .dbt-num, html.nuit tr.dbt-sel .dbt-code-txt, html.nuit tr.dbt-sel .dbt-calc{color:#fff !important; opacity:1;}
html.nuit .dbt-calc{color:#94a3b8;}
html.nuit .dbt-code-txt{color:#8a98ad;}
html.nuit .dbt-g.filet::before, html.nuit .dbt-coude::before, html.nuit .dbt-coude::after{background:rgba(255,255,255,.22);}
html.nuit tr.dbt-sel .dbt-g::before, html.nuit tr.dbt-sel .dbt-g::after, html.nuit tr.dbt-sel .dbt-coude::before, html.nuit tr.dbt-sel .dbt-coude::after{background:rgba(255,255,255,.5);}
html.nuit .dbt-boite{background:transparent; border-color:rgba(255,255,255,.45); color:#e0e7ff;}
html.nuit .dbt-boite:hover{border-color:#fff; color:#fff;}
html.nuit tr.dbt-sel .dbt-boite{background:transparent; border-color:#fff; color:#fff;}
html.nuit .dbt-ico-titre svg{fill:#c084fc; color:#c084fc;}
html.nuit .dbt-ico-ouvrage svg{fill:#22d3ee; color:#22d3ee;}
html.nuit .dbt-ico-ressource svg{fill:#8a98ad; color:#8a98ad;}
html.nuit tr.dbt-cat-mo .dbt-ico-ressource svg{fill:#fb923c; color:#fb923c;}
html.nuit tr.dbt-cat-fou .dbt-ico-ressource svg{fill:#60a5fa; color:#60a5fa;}
html.nuit tr.dbt-cat-st .dbt-ico-ressource svg{fill:#4ade80; color:#4ade80;}
html.nuit tr.dbt-sel .dbt-ico svg{fill:#fff; color:#fff;}
html.nuit .dbt-etq:hover{outline-color:rgba(255,255,255,.4);}
html.nuit .dbt-poignee::after{background:rgba(255,255,255,.15);}
html.nuit .dbt-retour{background:transparent; border-color:rgba(255,255,255,.3); color:#e0e7ff;}

/* ══ L'analytique et les objectifs, la nuit ══
   Ce qui porte un sens reste lisible : les mots à gauche en encre claire,
   les mois à venir seulement en retrait, le mois en cours qui s'allume. Les
   barres sont la lumière de la page — la règle s'efface, ce qui est atteint
   brille, violet vers cyan ; vert quand l'objectif est passé. Le survol
   éclaire la ligne, il ne l'éteint plus. */
html.nuit table.objectifs thead th, html.nuit table.objectifs thead th.groupe,
html.nuit table.analytique tr.partie td, html.nuit table.objectifs tr.groupe td{color:#8a98ad; border-color:rgba(255,255,255,.14);}
html.nuit table.objectifs tbody td, html.nuit table.analytique tbody td{border-color:rgba(255,255,255,.07) !important; color:#e0e7ff;}
html.nuit table.objectifs tbody td:first-child, html.nuit table.analytique tbody td:first-child{color:#e0e7ff;}
html.nuit tr.mois:hover td{background:rgba(255,255,255,.05);}
html.nuit tr.mois.encours td{background:rgba(34,211,238,.10);}
html.nuit tr.mois.encours td:first-child{color:#fff; text-shadow:0 0 14px rgba(34,211,238,.9);}
html.nuit tr.mois.avenir td, html.nuit tr.mois.avenir td:first-child{color:#64748b;}
html.nuit td.cumul{color:#c7d2e0;}
html.nuit tr.detail td{background:rgba(0,0,0,.16); color:#94a3b8;}
html.nuit tr.detail td:first-child{color:#94a3b8;}
html.nuit tr.detail + tr.mois td{border-top-color:rgba(255,255,255,.07);}
html.nuit tr.total td, html.nuit tr.total td:first-child, html.nuit table.analytique tr.total td{color:#fff; border-top-color:rgba(255,255,255,.22); border-bottom-color:rgba(255,255,255,.07);}
html.nuit table.analytique tr.bleu td{color:#67e8f9;}
html.nuit table.analytique tr.total td.pale, html.nuit table.objectifs td.pale, html.nuit table.objectifs tr.total td.pale, html.nuit .pct{color:#8a98ad;}
html.nuit .sep{border-left-color:rgba(255,255,255,.1);}
html.nuit .barre{background:rgba(255,255,255,.08);}
html.nuit .barre div{background:linear-gradient(90deg, #22d3ee, #4ade80); box-shadow:0 0 10px rgba(74,222,128,.6);}
html.nuit .barre div.plein{background:linear-gradient(90deg, #22d3ee, #4ade80); box-shadow:0 0 10px rgba(74,222,128,.6);}
html.nuit .choix-mois .liste{background:#0B1E44; border-color:rgba(255,255,255,.15); box-shadow:0 8px 24px rgba(0,0,0,.5);}
html.nuit .choix-mois .liste label:hover{background:rgba(255,255,255,.06);}
html.nuit .choix-mois.on > button{color:#e0e7ff;}
/* Ce qu'on dépense est violet ; ce qu'on garde, le bénéfice, s'allume en vert. */
html.nuit table.analytique tr.bleu .barre div{background:linear-gradient(90deg, #22d3ee, #4ade80); box-shadow:0 0 12px rgba(74,222,128,.65);}

/* ══ La lumière, partout (16/09) ══
   Ludo devant le déboursé et le bénéfice : « j'aime tellement l'univers de
   ces deux choses ». Le reste de la nuit se lisait mal. La même règle passe
   sur tout : la nuit, la couleur n'est plus de la peinture, c'est de la
   lumière. Une case du planning n'est plus une dalle fluo à texte blanc :
   un voile de sa teinte, un trait de lumière en bas, le mot dans la teinte.
   Les barres brillent. Et l'encre monte d'un cran : ce qui était gris sur
   le bleu redevient lisible. */
html.nuit{
  --a-mute:#b6c2d4; --b-mute:#cbd5e1;
  --a-faint:#8a98ad; --b-faint:#a5b4c8;
  --text:#eef2ff; --navy:#eef2ff;
}
html.nuit a:not(.topnav a):not(.btn):not(.a-btn){color:#67e8f9;}
/* Les cases du planning et de l'agenda : la teinte devient une lumière. */
html.nuit .block, html.nuit .creneau-cell{font-weight:600 !important; box-shadow:none;}
html.nuit :is([style*="#DCE9F5" i], [style*="rgb(220, 233, 245)"]).block, html.nuit :is([style*="#DCE9F5" i]).creneau-cell{background:rgba(34,211,238,.55) !important; color:#ecfeff !important; box-shadow:inset 0 -4px 0 #22d3ee, 0 0 10px rgba(34,211,238,.55);}
html.nuit :is([style*="#D6ECD9" i], [style*="rgb(214, 236, 217)"]).block, html.nuit :is([style*="#D6ECD9" i]).creneau-cell{background:rgba(74,222,128,.55) !important; color:#f0fdf4 !important; box-shadow:inset 0 -4px 0 #4ade80, 0 0 10px rgba(74,222,128,.55);}
html.nuit :is([style*="#FAF3CE" i], [style*="rgb(250, 243, 206)"]).block, html.nuit :is([style*="#FAF3CE" i]).creneau-cell{background:rgba(250,204,21,.55) !important; color:#fefce8 !important; box-shadow:inset 0 -4px 0 #facc15, 0 0 10px rgba(250,204,21,.55);}
html.nuit :is([style*="#FBE0C9" i], [style*="rgb(251, 224, 201)"]).block, html.nuit :is([style*="#FBE0C9" i]).creneau-cell{background:rgba(251,146,60,.55) !important; color:#fff7ed !important; box-shadow:inset 0 -4px 0 #fb923c, 0 0 10px rgba(251,146,60,.55);}
html.nuit :is([style*="#F6D3D0" i], [style*="rgb(246, 211, 208)"]).block, html.nuit :is([style*="#F6D3D0" i]).creneau-cell{background:rgba(244,114,182,.55) !important; color:#fdf2f8 !important; box-shadow:inset 0 -4px 0 #f472b6, 0 0 10px rgba(244,114,182,.55);}
html.nuit :is([style*="#E4DAF3" i], [style*="rgb(228, 218, 243)"]).block, html.nuit :is([style*="#E4DAF3" i]).creneau-cell{background:rgba(192,132,252,.55) !important; color:#faf5ff !important; box-shadow:inset 0 -4px 0 #c084fc, 0 0 10px rgba(192,132,252,.55);}
html.nuit .block:not([style*="background"]), html.nuit .block[style*="var(--tint)"], html.nuit .creneau-cell[style*="var(--tint)"]{background:rgba(102,126,234,.58) !important; color:#eef2ff !important; box-shadow:inset 0 -4px 0 #818cf8, 0 0 10px rgba(129,140,248,.55);}
html.nuit .creneau-cell[style*="#fef3c7" i]{background:rgba(250,204,21,.55) !important; color:#fefce8 !important; box-shadow:inset 0 -4px 0 #facc15;}
html.nuit .creneau-cell[style*="#fee2e2" i]{background:rgba(244,114,182,.55) !important; color:#fdf2f8 !important; box-shadow:inset 0 -4px 0 #f472b6;}
/* Les barres des listes et des jauges : ce qui avance brille. */
html.nuit .lc-barre > div, html.nuit .av-barre span, html.nuit .jauge > i.fait, html.nuit div[style*="background:#8CBF9A"]{
  background:linear-gradient(90deg, #22d3ee, #4ade80) !important; box-shadow:0 0 10px rgba(74,222,128,.6);}
html.nuit .jauge > i.fait.plein, html.nuit div[style*="background:#D9908A"]{
  background:linear-gradient(90deg, #f472b6, #fb7185) !important; box-shadow:0 0 10px rgba(244,114,182,.6);}
html.nuit .jauge > i.pose, html.nuit .jauge > i.marge, html.nuit div[style*="background:#9C8CC3"]{
  background:linear-gradient(90deg, #22d3ee, #4ade80) !important; box-shadow:0 0 10px rgba(74,222,128,.6);}
html.nuit .av-barre{background:rgba(255,255,255,.08) !important; border-color:transparent !important;}
/* Les entêtes de tableau et les étiquettes : lisibles, pas effacées. */
html.nuit th, html.nuit td.time, html.nuit .a-label, html.nuit .a-etiquette{color:#d4dce6 !important;}
/* Les nombres qui comptent : blancs, avec un souffle de lumière. */
html.nuit .postes .eur.marge{color:#d9f99d; text-shadow:0 0 12px rgba(74,222,128,.7);}
html.nuit .postes .eur.marge.creuse{color:#fbcfe8; text-shadow:0 0 12px rgba(244,114,182,.7);}

/* ── La règle du contraste : AA, 4,5:1 pour tout ce qui s'écrit (16/09).
   Mesuré au pixel sur test, au moment le plus clair du ciel. Ce qui tombait :
   l'encre « faint » (pourcentages, sous-titres, minima de météo), les rôles
   des contacts et le vert « Réglée » posés en dur pour le jour. */
html.nuit{--a-faint:#c7d2e0; --b-faint:#d4dce6; --a-mute:#e2e8f0; --b-mute:#eef2f7; --text:#ffffff; --navy:#ffffff;}
html.nuit td.pale, html.nuit .pct, html.nuit .at-sub, html.nuit .min, html.nuit .a-sous-titre{color:#d4dce6 !important;}
html.nuit [style*="color:#4A7CA8" i]{color:#7dd3fc !important;}   /* client */
html.nuit [style*="color:#4E8B62" i]{color:#86efac !important;}   /* fournisseur */
html.nuit [style*="color:#6A5FA0" i]{color:#c4b5fd !important;}   /* sous-traitant */
html.nuit [style*="color:#A07A3C" i]{color:#fcd34d !important;}   /* autre */
html.nuit [style*="color:#6B7685" i]{color:#b6c2d4 !important;}
html.nuit [style*="color:#15803d" i], html.nuit .text-green-700, html.nuit .a-vert{color:#4ade80 !important;}
html.nuit [style*="color:#b91c1c" i], html.nuit [style*="color:#dc2626" i], html.nuit .text-red-700{color:#fb7185 !important;}
html.nuit [style*="color:#b45309" i], html.nuit [style*="color:#d97706" i], html.nuit .text-amber-700{color:#fcd34d !important;}
html.nuit [style*="color:#B5730A" i], html.nuit [style*="color:#b45309" i]{color:#fcd34d !important;}
/* Le survol des listes (Devis, AO, Chantiers…) est posé en ligne, en bleu pâle
   de jour : la nuit, une plaque claire sous du texte blanc. Un voile, à la place. */
html.nuit tr[style*="eef4fa" i], html.nuit tr[style*="rgb(238, 244, 250)"]{background:rgba(255,255,255,.09) !important;}
/* Le logo : la nuit, ses traits bleu marine deviennent l'encre claire, la
   terre cuite reste. Plus de pavé beige pour le porter. */
html.nuit img[src="/logo-arriane.png"]{content:url(/logo-arriane-nuit.png);}
html.nuit img[src="/logo-arriane-complet.png"]{content:url(/logo-arriane-complet-nuit.png);}
html.nuit .brand img{background:none; padding:0;}
/* Le survol des tableaux à la charte (contacts, équipement…) était un bleu
   pâle fixe : la nuit, une plaque. Le même voile et le même trait que les listes. */
html.nuit{--at-hover:rgba(255,255,255,.09);}
