@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&display=swap');

/* =====================================================================
   THÈMES : trois directions graphiques complètes (couleurs, polices,
   arrondis, style des cartes), choisies dans Paramètres › Personnalisation.
   - nuit       : sombre bleu nuit, accent orange (identité d'origine, épurée)
   - calme      : clair et aéré, cartes blanches sans bordure, accent bleu
   - chaleureux : sombre brun chaud, grands arrondis, accent sauge
   Les statuts ont leurs propres couleurs (--info, --warn, --success,
   --danger), indépendantes de l'accent, pour ne jamais se confondre.
   ===================================================================== */
:root, :root[data-theme="nuit"]{
  --bg:#10131a;
  --panel:#1d212a;
  --panel-2:#242a37;
  --border:#333948;
  --border-soft:#2a2f3c;
  --text:#eceef2;
  --text-dim:#a3aabb;
  --text-faint:#838a9c;
  --accent:#f2a93b;
  --accent-soft:rgba(242,169,59,0.14);
  --accent-contrast:#1a1305;
  --success:#4fbf9f;
  --success-soft:rgba(79,191,159,0.14);
  --danger:#e2604f;
  --danger-soft:rgba(226,96,79,0.14);
  --info:#5b8def;
  --info-soft:rgba(91,141,239,0.14);
  --warn:#f2a93b;
  --warn-soft:rgba(242,169,59,0.14);
  --tint-danger-text:#f3a99d;
  --tint-accent-text:#f2c07f;
  --tint-info-text:#a9c3f7;
  --link-color:#a9c3f7;
  --scrollbar-thumb:#2b3140;
  --sidebar-bg:#0d0f15;
  --nav-active-bg:#1f2533;
  /* Police et arrondis communs à tous les thèmes (ceux du thème Pro) :
     changer de thème ne change que les couleurs, rien ne bouge. */
  --font-display:'Geist', system-ui, sans-serif;
  --font-body:'Geist', system-ui, sans-serif;
  /* arrondis : contrôles / cartes et panneaux / fenêtres */
  --r-sm:8px;
  --r-md:10px;
  --r-lg:14px;
  --radius:var(--r-md);
  /* cartes de liste */
  --card-bg:var(--panel);
  --card-line:var(--border-soft);
  --card-shadow:none;
  --card-hover-shadow:0 6px 16px -10px rgba(0,0,0,.5);
  --mono-bg:#272c39;
  --mono-fg:#c9cfdb;
  --mono-radius:9px;
  color-scheme:dark;
}

:root[data-theme="calme"]{
  --bg:#f0f1f3;
  --panel:#ffffff;
  --panel-2:#eceef2;
  --border:#d4d6db;
  --border-soft:#e3e5e9;
  --text:#16181d;
  --text-dim:#4c515a;
  --text-faint:#686d76;
  --accent:#3049c4;
  --accent-soft:rgba(48,73,196,0.09);
  --accent-contrast:#ffffff;
  --success:#2f9a65;
  --success-soft:rgba(47,154,101,0.12);
  --danger:#d0473a;
  --danger-soft:rgba(208,71,58,0.10);
  --info:#4a68e0;
  --info-soft:rgba(74,104,224,0.11);
  --warn:#d98a1f;
  --warn-soft:rgba(217,138,31,0.13);
  --tint-danger-text:#a8332a;
  --tint-accent-text:#2a3fa6;
  --tint-info-text:#2a43a8;
  --link-color:#2a43a8;
  --scrollbar-thumb:#d3d6dd;
  --sidebar-bg:#ffffff;
  --nav-active-bg:#eceef3;
  --font-display:'Geist', system-ui, sans-serif;
  --font-body:'Geist', system-ui, sans-serif;
  --r-sm:8px;
  --r-md:10px;
  --r-lg:14px;
  --card-bg:#ffffff;
  --card-line:#e6e8ec;
  --card-shadow:0 1px 3px rgba(20,24,40,.08), 0 1px 2px rgba(20,24,40,.04);
  --card-hover-shadow:0 6px 18px -8px rgba(20,24,40,.18);
  --mono-bg:#eef0f4;
  --mono-fg:#4a4f59;
  --mono-radius:9px;
  color-scheme:light;
}

:root[data-theme="chaleureux"]{
  --bg:#1d1b19;
  --panel:#2b2824;
  --panel-2:#34302a;
  --border:#454039;
  --border-soft:#38332d;
  --text:#efe8dc;
  --text-dim:#b0a695;
  --text-faint:#9c9387;
  --accent:#a9c4a0;
  --accent-soft:rgba(169,196,160,0.14);
  --accent-contrast:#1b231a;
  --success:#a9c4a0;
  --success-soft:rgba(169,196,160,0.15);
  --danger:#cf7a63;
  --danger-soft:rgba(207,122,99,0.15);
  --info:#8ea3d4;
  --info-soft:rgba(142,163,212,0.15);
  --warn:#d9a85c;
  --warn-soft:rgba(217,168,92,0.15);
  --tint-danger-text:#e8a28f;
  --tint-accent-text:#c3d9bb;
  --tint-info-text:#b6c3e0;
  --link-color:#c3d9bb;
  --scrollbar-thumb:#3d3730;
  --sidebar-bg:#171513;
  --nav-active-bg:#2e2a25;
  --card-bg:#2b2824;
  --card-line:transparent;
  --card-shadow:none;
  --card-hover-shadow:0 8px 20px -12px rgba(0,0,0,.6);
  --mono-bg:#3a352f;
  --mono-fg:#e6dccb;
  color-scheme:dark;
}

/* ---------- jetons dérivés ----------
   Calculés à partir des couleurs de chaque thème : survols, bordures
   teintées et ombres restent cohérents quel que soit le thème choisi. */
:root{
  --border-hover:color-mix(in srgb, var(--border), var(--text) 22%);
  --accent-hover:color-mix(in srgb, var(--accent), #fff 16%);
  --accent-border:color-mix(in srgb, var(--accent) 40%, transparent);
  --danger-border:color-mix(in srgb, var(--danger) 40%, transparent);
  --info-border:color-mix(in srgb, var(--info) 40%, transparent);
  --success-border:color-mix(in srgb, var(--success) 40%, transparent);
  --overlay:rgba(6,7,10,.6);
  --shadow-lg:0 18px 44px rgba(0,0,0,.28);
  --focus-ring:0 0 0 2px var(--bg), 0 0 0 4px var(--accent);

  /* échelle typographique : 5 tailles de texte + 4 tailles de titres */
  --fs-2xs:calc(10px * var(--fs-scale, 1));
  --fs-xs:calc(11px * var(--fs-scale, 1));
  --fs-sm:calc(12px * var(--fs-scale, 1));
  --fs-md:calc(13px * var(--fs-scale, 1));
  --fs-lg:calc(14px * var(--fs-scale, 1));
  --fs-h3:calc(16px * var(--fs-scale, 1));
  --fs-h2:calc(20px * var(--fs-scale, 1));
  --fs-stat:calc(26px * var(--fs-scale, 1));
  --fs-h1:calc(28px * var(--fs-scale, 1));
}

*{box-sizing:border-box;}
html, body{margin:0;padding:0;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:var(--fs-md);
  min-height:100vh;
  display:flex;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent-soft); color:var(--text);}
h1, h2, h3, h4{font-family:var(--font-display); margin:0; font-weight:600; letter-spacing:-0.01em;}
p{margin:0;}
button{font-family:var(--font-body); cursor:pointer;}
input, select, textarea{font-family:var(--font-body);}
a{color:inherit;}
code{font-family:ui-monospace, 'Cascadia Code', Consolas, monospace; font-size:var(--fs-xs); background:var(--panel-2); border:1px solid var(--border-soft); padding:1px 5px; border-radius:4px;}
kbd{font-family:var(--font-body); font-size:var(--fs-2xs); font-weight:600; color:var(--text-dim); background:var(--panel-2); border:1px solid var(--border); border-bottom-width:2px; border-radius:5px; padding:2px 6px; white-space:nowrap;}
::-webkit-scrollbar{width:9px; height:9px;}
::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb); border-radius:6px;}
::-webkit-scrollbar-track{background:transparent;}
.text-dim{color:var(--text-dim); font-size:var(--fs-sm);}

/* focus clavier visible partout (mais pas au clic souris) */
:focus{outline:none;}
:focus-visible{outline:none; box-shadow:var(--focus-ring); border-radius:var(--r-sm);}
.form-group input:focus-visible, .form-group textarea:focus-visible, .filters-row input:focus-visible{box-shadow:none;}

@media (prefers-reduced-motion: reduce){ *{transition:none !important; animation:none !important;} }
.a11y-reduce-motion *{transition:none !important; animation:none !important; scroll-behavior:auto !important;}

/* ---------- layout ---------- */
.sidebar{
  width:calc(230px * max(1, var(--fs-scale, 1))); flex-shrink:0; background:var(--sidebar-bg); border-right:1px solid var(--border);
  padding:24px 16px; display:flex; flex-direction:column; gap:22px; position:sticky; top:0; height:100vh;
}
.brand{display:flex; align-items:center; gap:10px; padding:2px 8px 4px 8px;}
.brand-mark{height:22px; aspect-ratio:1.64; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--accent);}

/* ---------- logo (logo.js) ----------
   Trait + points en currentColor. « draw » : le trait se trace, chaque point
   apparaît avec un rebond au moment où le trait l'atteint. Au survol de la
   marque, les points sautent l'un après l'autre. */
.logo{display:block; width:100%; height:100%; overflow:visible;}
.logo-line{fill:none; stroke:currentColor; stroke-width:5.5; stroke-linejoin:round; stroke-linecap:round;}
.logo-dot{fill:currentColor; transform-box:fill-box; transform-origin:center;}
.logo.draw .logo-line{stroke-dasharray:1; animation:logoLine 1s cubic-bezier(.65,0,.35,1) both .15s;}
.logo.draw .logo-dot{animation:logoDot .55s cubic-bezier(.34,1.56,.64,1) both; animation-delay:calc(.08s + var(--t) * 1s);}
@keyframes logoLine{from{stroke-dashoffset:1;} to{stroke-dashoffset:0;}}
@keyframes logoDot{from{transform:scale(0);} to{transform:none;}}
.brand:hover .logo-dot, .land-brand:hover .logo-dot, .login-brand:hover .logo-dot{animation:logoHop .55s cubic-bezier(.34,1.56,.64,1) both; animation-delay:calc(var(--k) * 70ms);}
@keyframes logoHop{0%{transform:none;} 45%{transform:translateY(-22%) scale(1.08);} 100%{transform:none;}}
.land .rv:not(.on) .logo.draw *{animation-play-state:paused;}
@media (prefers-reduced-motion: reduce){
  .logo .logo-line, .logo .logo-dot{animation:none !important; stroke-dashoffset:0;}
}
.brand-text{font-family:var(--font-display); font-size:var(--fs-lg); font-weight:700; line-height:1.15;}
.brand-text span{display:block; font-family:var(--font-body); font-weight:500; font-size:var(--fs-2xs); color:var(--text-faint); letter-spacing:0.03em; margin-top:1px;}

.search-trigger{
  display:flex; align-items:center; gap:9px; width:100%; padding:9px 11px; border-radius:var(--r-sm);
  background:var(--panel); border:1px solid var(--border); color:var(--text-faint); font-size:var(--fs-sm); text-align:left;
  transition:border-color .12s, color .12s;
}
.search-trigger svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; flex-shrink:0;}
.search-trigger span{flex:1;}
.search-trigger:hover{border-color:var(--border-hover); color:var(--text-dim);}

.navlist{display:flex; flex-direction:column; gap:4px;}
.navitem{
  position:relative; display:flex; align-items:center; gap:11px; padding:10px 13px; border-radius:var(--r-sm); width:100%;
  color:var(--text-dim); font-size:var(--fs-md); font-weight:500; border:1px solid transparent; background:none; text-align:left;
  transition:background .12s, color .12s;
}
.navitem svg{width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.8; flex-shrink:0;}
.navicon{display:flex;}
.navitem:hover{background:var(--panel); color:var(--text);}
.navitem.active{background:var(--nav-active-bg); color:var(--text); border-color:transparent;}
.navitem.active .navicon{color:var(--accent);}
.nav-short{display:none;}

.main{flex:1; min-width:0; padding:26px 34px 60px 34px; max-width:1600px;}
#topbar{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:30px; flex-wrap:wrap;}
.page-title{font-size:var(--fs-h1); font-weight:700; letter-spacing:-0.02em;}
.topbar-actions{display:flex; gap:12px; flex-wrap:wrap;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:8px; border-radius:var(--r-sm); border:1px solid var(--border);
  background:var(--panel); color:var(--text); font-size:var(--fs-md); font-weight:500; padding:11px 18px;
  white-space:nowrap; line-height:1.3;
  transition:background .12s, border-color .12s, color .12s;
}
.btn svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; flex-shrink:0;}
.btn:hover{background:var(--panel-2); border-color:var(--border-hover);}
a.btn, a.icon-btn{text-decoration:none;}
.btn-primary{background:var(--accent); border-color:var(--accent); color:var(--accent-contrast); font-weight:600;}
.btn-primary:hover{background:var(--accent-hover); border-color:var(--accent-hover);}
.btn-ghost{background:transparent; border-color:transparent; color:var(--text-dim);}
.btn-ghost:hover{background:var(--panel-2); border-color:transparent; color:var(--text);}
.btn-danger{color:var(--danger);}
.btn-danger:hover{border-color:var(--danger-border); background:var(--danger-soft);}
.btn-danger-solid{background:var(--danger); border-color:var(--danger); color:#fff; font-weight:600;}
.btn-danger-solid:hover{background:color-mix(in srgb, var(--danger), #000 12%);}
.btn-sm{padding:7px 11px; font-size:var(--fs-sm);}
.icon-btn{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:var(--r-sm); border:1px solid var(--border); background:var(--panel); color:var(--text-dim); flex-shrink:0;}
.icon-btn:hover{color:var(--text); border-color:var(--border-hover);}
.icon-btn svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:1.9;}
.icon-btn-sm{width:26px; height:26px; border-color:transparent; background:transparent;}
.icon-btn-sm svg{width:12px; height:12px;}
.btn-row{display:flex; gap:12px; flex-wrap:wrap;}

/* ---------- panels / cards ---------- */
.panel{background:var(--card-bg); border:1px solid var(--card-line); box-shadow:var(--card-shadow); border-radius:var(--r-md); padding:24px;}
.panel-title{font-size:var(--fs-lg); font-weight:600; margin-bottom:18px; display:flex; align-items:center; justify-content:space-between; gap:10px;}
.panel-title small{color:var(--text-faint); font-weight:500; font-size:var(--fs-xs);}
.panel-desc{font-size:var(--fs-sm); color:var(--text-dim); margin-bottom:16px; line-height:1.6;}
.panel-foot{font-size:var(--fs-xs); color:var(--text-faint); margin-top:12px; line-height:1.6;}
.panel-foot svg{width:12px; height:12px; stroke:var(--success); fill:none; stroke-width:2.4; vertical-align:-1px;}
.panel-danger{border-color:var(--danger-border);}

.clickable{cursor:pointer;}

.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:22px;}
.stat-card{background:var(--card-bg); border:1px solid var(--card-line); box-shadow:var(--card-shadow); border-radius:var(--r-md); padding:22px;}
.stat-num{font-family:var(--font-display); font-size:var(--fs-stat); font-weight:700; line-height:1;}
.stat-label{color:var(--text-dim); font-size:var(--fs-sm); margin-top:10px;}
.stat-card.accent .stat-num{color:var(--accent);}
.stat-card.success .stat-num{color:var(--success);}

.alert-row{display:flex; flex-direction:column; gap:12px; margin-bottom:22px;}
.alert{
  display:flex; align-items:center; gap:13px; padding:15px 18px; border-radius:var(--r-sm); font-size:var(--fs-md);
  border:1px solid; cursor:pointer; transition:filter .12s;
}
.alert:hover{filter:brightness(1.08);}
.alert.warn{background:var(--danger-soft); border-color:var(--danger-border); color:var(--tint-danger-text);}
.alert.info{background:var(--accent-soft); border-color:var(--accent-border); color:var(--tint-accent-text);}
.alert b{color:var(--text); font-weight:600;}
.alert svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; flex-shrink:0;}

.grid-2{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; margin-bottom:22px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-bottom:22px;}

/* bar chart */
.bar-row{display:flex; align-items:center; gap:12px; margin-bottom:16px;}
.bar-row:last-child{margin-bottom:0;}
.bar-label{width:112px; font-size:var(--fs-sm); color:var(--text-dim); flex-shrink:0;}
.bar-track{flex:1; height:9px; background:var(--panel-2); border-radius:5px; overflow:hidden;}
.bar-fill{height:100%; border-radius:5px;}
.bar-count{width:22px; text-align:right; font-size:var(--fs-sm); color:var(--text-dim); flex-shrink:0;}

.donut-wrap{display:flex; align-items:center; gap:20px;}
.legend{display:flex; flex-direction:column; gap:11px; font-size:var(--fs-sm);}
.legend-item{display:flex; align-items:center; gap:8px; color:var(--text-dim);}
.legend-dot{width:8px; height:8px; border-radius:50%; flex-shrink:0;}
.legend-item b{color:var(--text); font-weight:600;}

.upcoming-list{display:flex; flex-direction:column; gap:0;}
.upcoming-item{display:flex; align-items:center; gap:12px; padding:13px 10px; margin:0 -10px; border-radius:var(--r-sm); border-bottom:1px solid var(--border-soft); font-size:var(--fs-md); transition:background .12s;}
.upcoming-item:last-child{border-bottom:none;}
.upcoming-item.clickable:hover{background:var(--panel-2);}
.upcoming-date{width:44px; flex-shrink:0; text-align:center; background:var(--panel-2); border-radius:6px; padding:6px 2px; font-size:var(--fs-xs); font-weight:600; line-height:1.2;}
.upcoming-date small{display:block; font-weight:500; color:var(--text-faint); font-size:var(--fs-2xs); text-transform:uppercase;}
.upcoming-mid{flex:1; min-width:0;}
.upcoming-mid .co{font-weight:600; font-size:var(--fs-md);}
.upcoming-mid .ty{color:var(--text-dim); font-size:var(--fs-xs); margin-top:2px;}

.progress-bar{height:8px; background:var(--panel-2); border-radius:6px; overflow:hidden; margin:12px 0 8px 0;}
.progress-fill{height:100%; background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent), #fff 30%)); border-radius:6px; transition:width .25s;}

/* ---------- en-tête de page ---------- */

/* ---------- aujourd'hui ----------
   Grille unique : bandeau de synthèse pleine largeur, puis deux colonnes
   (2fr / 1fr, même gouttière que le bandeau) dont les titres de section
   partagent la même ligne. */

/* Lignes de liste : séparées par des filets, jamais encadrées. */

/* formulaire "ajouter" dans la fiche (préparation d'entretien) */
.add-row{display:flex; gap:8px; margin-bottom:12px;}
.add-row input{flex:1; min-width:0; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:8px 11px; font-size:var(--fs-md);}
.add-row input:focus{border-color:var(--accent);}

.check-item label{display:flex; align-items:flex-start; gap:12px; font-size:var(--fs-md); cursor:pointer; flex:1; min-width:0; line-height:1.45;}
.check-item{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 0; border-bottom:1px solid var(--border-soft);}
.check-item:last-child{border-bottom:none;}
.check-item input[type=checkbox], .check-row input{accent-color:var(--accent); width:15px; height:15px; margin:2px 0 0 0; flex-shrink:0; cursor:pointer;}

.check-item.done span{color:var(--text-faint); text-decoration:line-through;}
.check-item .icon-btn-sm{opacity:0; transition:opacity .12s;}
.check-item:hover .icon-btn-sm, .icon-btn-sm:focus-visible{opacity:1;}

.link-btn{background:none; border:none; padding:0; color:var(--link-color); font-size:var(--fs-sm); font-weight:500; display:inline-flex; align-items:center; gap:6px; cursor:pointer;}
.link-btn:hover{text-decoration:underline;}
.link-btn svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2;}

/* Un cadre dans un cadre : jamais. Les états vides à l'intérieur d'un
   panneau perdent leur bordure. */
.panel .empty-state, .modal .empty-state{border:none; background:none; padding:4px 0; text-align:left;}

/* ---------- menu profil ---------- */
.sidebar-foot{margin-top:auto; padding:12px 0 0 0; border-top:1px solid var(--border);}
.user-menu{position:relative;}
.user-btn{display:flex; align-items:center; gap:11px; width:100%; padding:8px; border-radius:var(--r-sm); background:none; border:1px solid transparent; color:var(--text); text-align:left; transition:background .12s, border-color .12s;}
.user-btn:hover, .user-btn[aria-expanded="true"]{background:var(--panel); border-color:var(--border);}
.avatar{position:relative; width:34px; height:34px; border-radius:50%; background:var(--accent-soft); color:var(--tint-accent-text); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:var(--fs-sm); flex-shrink:0;}
.avatar svg{width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2;}
.avatar .save-dot{position:absolute; right:-1px; bottom:-1px; width:10px; height:10px; margin:0; border:2px solid var(--sidebar-bg);}
.save-dot{display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--success);}
.user-name{flex:1; min-width:0; font-size:var(--fs-md); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.user-name small{display:block; font-size:var(--fs-xs); font-weight:400; color:var(--text-faint); margin-top:1px;}
.user-chev{width:14px; height:14px; stroke:var(--text-faint); fill:none; stroke-width:2; flex-shrink:0;}
.user-dropdown{position:absolute; left:0; right:0; bottom:calc(100% + 8px); background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:6px; box-shadow:var(--shadow-lg); z-index:55; animation:popIn .12s ease-out;}
.user-dropdown[hidden]{display:none;}
.user-dropdown button{display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border-radius:6px; background:none; border:none; color:var(--text-dim); font-size:var(--fs-md); text-align:left;}
.user-dropdown button:hover, .user-dropdown button:focus-visible{background:var(--panel-2); color:var(--text); box-shadow:none;}
.user-dropdown svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9; flex-shrink:0;}
.menu-sep{height:1px; background:var(--border-soft); margin:6px 4px;}

/* ---------- fenêtre paramètres ---------- */
.modal.modal-settings{max-width:840px; padding:0; display:grid; grid-template-columns:210px minmax(0,1fr); min-height:500px; overflow:hidden;}
.settings-nav{background:var(--sidebar-bg); border-right:1px solid var(--border); padding:24px 12px; display:flex; flex-direction:column; gap:2px;}
.settings-title{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:600; padding:0 10px 16px 10px;}
.settings-tab{display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:var(--r-sm); background:none; border:none; color:var(--text-dim); font-size:var(--fs-md); font-weight:500; text-align:left;}
.settings-tab svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9;}
.settings-tab:hover{background:var(--panel); color:var(--text);}
.settings-tab.active{background:var(--panel-2); color:var(--text);}
.settings-tab.active svg{stroke:var(--accent);}
.settings-body{position:relative; padding:28px 32px 32px 32px; min-width:0;}
.settings-close{position:absolute; top:20px; right:20px;}
.settings-h{font-family:var(--font-body); font-size:var(--fs-lg); font-weight:600; letter-spacing:0; margin-bottom:6px;}
.settings-p{font-size:var(--fs-sm); color:var(--text-dim); line-height:1.6; margin-bottom:18px; max-width:52ch;}
.settings-note{font-size:var(--fs-xs); color:var(--text-faint); margin-top:12px; line-height:1.6;}
.settings-note svg{width:12px; height:12px; stroke:var(--success); fill:none; stroke-width:2.4; vertical-align:-1px;}
.settings-divider{height:1px; background:var(--border-soft); margin:28px 0;}

/* ---------- édition de modèle d'email ---------- */
.label-row{display:flex; align-items:center; justify-content:space-between;}
.var-chips{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px;}
.var-chip{font-family:ui-monospace, 'Cascadia Code', Consolas, monospace; font-size:var(--fs-xs); padding:4px 8px; border-radius:6px; background:var(--panel-2); border:1px solid var(--border); color:var(--text-dim);}
.var-chip:hover{border-color:var(--accent); color:var(--text);}

.badge{font-size:var(--fs-2xs); line-height:1.3; padding:3px 8px; border-radius:20px; background:var(--panel-2); color:var(--text-dim); border:1px solid var(--border-soft); white-space:nowrap; font-weight:500;}
.badge.tag{background:var(--info-soft); color:var(--tint-info-text); border-color:transparent;}
.badge.warn{background:var(--danger-soft); color:var(--tint-danger-text); border-color:transparent;}
.badge.soon{background:var(--accent-soft); color:var(--tint-accent-text); border-color:transparent;}
.badge.ok{background:var(--success-soft); color:var(--success); border-color:transparent;}

.empty-state{border:1px dashed var(--border); border-radius:var(--r-sm); padding:30px 20px; text-align:center; color:var(--text-faint); font-size:var(--fs-sm); line-height:1.7;}
.empty-state .btn{margin-top:16px;}
.filter-empty{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:var(--fs-sm); color:var(--text-dim); background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm); padding:8px 8px 8px 14px; margin-bottom:12px;}

/* filters */
.filters-row{display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap;}
.filters-row input{
  background-color:var(--panel); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:12px 12px; font-size:var(--fs-md);
}
.filters-row input:focus{border-color:var(--accent);}
.filters-row input[type=text]{min-width:210px; width:100%;}
.filters-row .search-wrap{flex:1 1 280px; max-width:420px;}
.search-wrap{position:relative; display:flex; align-items:center;}
.search-wrap svg{position:absolute; left:10px; width:14px; height:14px; stroke:var(--text-faint); fill:none; stroke-width:2;}
.search-wrap input{padding-left:31px;}

/* ---------- contacts ----------
   Même carte que les candidatures (couleur --st = statut de la
   candidature liée), avec un avatar à initiales. */
.card-list{display:flex; flex-direction:column; gap:16px; padding-bottom:8px;}
.contact-row{
  position:relative; display:flex; align-items:center; gap:18px; padding:16px 20px;
  border:1px solid var(--card-line); border-radius:var(--r-md);
  background:var(--card-bg); box-shadow:var(--card-shadow);
  cursor:pointer; transition:border-color .18s, box-shadow .18s, transform .18s;
}
.card-list.enter > .contact-row, .card-list.enter > .doc-row, .ct-grid.enter > .ct-tile{animation:rowIn .35s ease-out both; animation-delay:calc(var(--i) * 40ms);}
.contact-row:hover{border-color:var(--card-line); transform:translateY(-1px); box-shadow:var(--card-hover-shadow);}
.contact-avatar{
  width:46px; height:46px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:var(--fs-lg); letter-spacing:.02em;
  color:var(--mono-fg); background:var(--mono-bg);
}
.contact-main{flex:1; min-width:0;}
.contact-name{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:700; line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.contact-sub{display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:6px; font-size:var(--fs-sm); color:var(--text-dim);}
.contact-sub span{display:inline-flex; align-items:center; gap:6px;}
.contact-sub svg{width:13px; height:13px; stroke:var(--text-faint); fill:none; stroke-width:1.9;}
.contact-notes{margin-top:6px; font-size:var(--fs-sm); color:var(--text-faint); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:60ch;}
.contact-link{flex:0 0 280px; min-width:0; display:flex;}
.link-chip{
  display:inline-flex; align-items:center; gap:8px; max-width:100%; padding:7px 13px; border-radius:20px;
  background:color-mix(in srgb, var(--st) 14%, var(--panel)); border:1px solid color-mix(in srgb, var(--st) 45%, transparent);
  color:var(--text); font-size:var(--fs-sm); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
button.link-chip{cursor:pointer; transition:border-color .12s;}
button.link-chip:hover{border-color:var(--st);}
.link-chip b{font-weight:600;}
.link-chip-sub{color:var(--text-dim); overflow:hidden; text-overflow:ellipsis;}
.link-chip-dot{width:8px; height:8px; border-radius:50%; background:var(--st); flex-shrink:0;}
.link-chip-muted{background:var(--panel-2); border-color:var(--border); color:var(--text-dim);}
.contact-actions{display:flex; gap:6px; flex:0 0 154px; justify-content:flex-end;}
.contact-actions .icon-btn{text-decoration:none;}
.contact-actions .icon-btn{background:transparent;}
.contact-actions .icon-btn:hover{border-color:var(--border-hover); color:var(--text);}
.contact-row.is-unlinked .contact-actions .icon-btn:hover{border-color:var(--border-hover);}

/* ---------- fiche contact ----------
   Même habillage que la carte : --st = couleur du statut de la candidature liée. */
.modal.modal-contact{max-width:680px; padding:0; overflow:hidden;}
.cd-head{
  display:flex; align-items:center; gap:18px; padding:28px 28px 22px 28px;
  background:var(--panel-2);
  border-bottom:1px solid var(--border);
}
.cd-avatar{
  width:64px; height:64px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:var(--fs-h2); color:var(--text);
  background:var(--mono-bg); color:var(--mono-fg);
}
.cd-title{flex:1; min-width:0;}
.cd-title h2{font-size:var(--fs-h2); line-height:1.2;}
.cd-role{font-size:var(--fs-md); color:var(--text-dim); margin-top:5px;}
.cd-head-actions{display:flex; gap:8px; align-self:flex-start;}
.cd-app, .cd-info, .cd-notes, .cd-actions, .cd-compose{margin-left:28px; margin-right:28px;}
.cd-app{display:flex; align-items:center; gap:12px; margin-top:20px;}
.cd-info{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:1px; margin-top:20px; background:var(--border-soft); border:1px solid var(--border-soft); border-radius:10px; overflow:hidden;}
.cd-info-item{background:var(--panel); padding:14px 16px; min-width:0;}
.cd-info-lbl{font-size:var(--fs-xs); color:var(--text-faint); margin-bottom:6px;}
.cd-app .cd-info-lbl{margin:0;}
.cd-info-val{display:flex; align-items:center; gap:8px; font-size:var(--fs-md); font-weight:500; min-width:0;}
.cd-info-val a{color:var(--link-color); text-decoration:none; display:inline-flex; align-items:center; gap:6px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cd-info-val a:hover{text-decoration:underline;}
.cd-info-val a svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2;}
.cd-phone{font-size:var(--fs-lg); font-weight:600; letter-spacing:.02em;}
.cd-empty{color:var(--text-faint); font-weight:400;}
.cd-copy{opacity:.7; flex-shrink:0;}
.cd-copy:hover{opacity:1;}
.cd-notes{margin-top:16px;}
.cd-notes p{font-size:var(--fs-md); color:var(--text-dim); line-height:1.6; white-space:pre-wrap;}
.cd-actions{display:flex; gap:10px; flex-wrap:wrap; padding:22px 0 26px 0;}
.cd-chev{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; margin-left:2px;}
.cd-compose{padding:22px 0 28px 0; border-top:1px solid var(--border);}
.cd-compose[hidden]{display:none;}
.cd-compose.cd-in{animation:rowIn .22s ease-out;}
.cd-tabs{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px;}
.cd-tab{padding:7px 13px; border-radius:20px; background:var(--panel-2); border:1px solid var(--border); color:var(--text-dim); font-size:var(--fs-sm); font-weight:500; transition:border-color .12s, color .12s, background .12s;}
.cd-tab:hover{color:var(--text); border-color:var(--border-hover);}
.cd-tab.active{background:var(--accent-soft); border-color:var(--accent); color:var(--text); font-weight:600;}
.cd-compose-actions{display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-top:4px;}
.mini-contact.clickable{cursor:pointer; transition:border-color .12s;}
.mini-contact.clickable:hover{border-color:var(--border-hover);}
@media (max-width:640px){
  .cd-head{padding:22px 18px 18px 18px; gap:14px;}
  .cd-avatar{width:52px; height:52px; font-size:var(--fs-lg);}
  .cd-app, .cd-info, .cd-notes, .cd-actions, .cd-compose{margin-left:18px; margin-right:18px;}
  .cd-app{margin-top:16px; flex-wrap:wrap;}
  .cd-info{grid-template-columns:1fr; margin-top:16px;}
}

/* ---------- calendar ----------
   Les évènements sont écrits dans la case du jour (étiquette colorée). */
.cal-panel{padding:22px;}
.cal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.cal-month{font-size:var(--fs-h3); font-weight:600; font-family:var(--font-display);}
.cal-nav{display:flex; gap:8px; align-items:center;}
.cal-grid{display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px;}
.cal-dow{font-size:var(--fs-2xs); color:var(--text-faint); text-align:center; padding-bottom:6px; text-transform:uppercase; letter-spacing:.03em;}
.cal-day{
  min-height:118px; border-radius:var(--r-sm); border:1px solid transparent; padding:6px;
  background:color-mix(in srgb, var(--panel-2) 55%, var(--panel));
  display:flex; flex-direction:column; gap:4px; min-width:0;
}
.cal-day.other{opacity:.35; background:none;}
.cal-num{font-size:var(--fs-sm); color:var(--text-dim); padding:2px 4px; align-self:flex-start; border-radius:6px; line-height:1.3;}
.cal-day.today{border-color:var(--accent);}
.cal-day.today .cal-num{background:var(--accent); color:var(--accent-contrast); font-weight:700;}
.cal-events{display:flex; flex-direction:column; gap:3px; min-width:0;}
.ev-chip{
  display:flex; flex-direction:column; align-items:flex-start; gap:0; width:100%; min-width:0; text-align:left;
  padding:4px 7px 4px 8px; border-radius:6px; cursor:pointer;
  background:color-mix(in srgb, var(--ev) 16%, var(--panel)); border:none; border-left:3px solid var(--ev);
  color:var(--text); transition:background .12s;
}
.ev-chip:hover{background:color-mix(in srgb, var(--ev) 28%, var(--panel));}
.ev-type{font-size:var(--fs-2xs); font-weight:600; color:color-mix(in srgb, var(--ev) 75%, var(--text)); line-height:1.3;}
.ev-co{font-size:var(--fs-xs); font-weight:500; line-height:1.3; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ev-more{background:none; border:none; padding:2px 4px; text-align:left; font-size:var(--fs-2xs); font-weight:600; color:var(--text-dim); cursor:pointer; border-radius:4px;}
.ev-more:hover{color:var(--text); background:var(--panel-2);}
.day-events{display:flex; flex-direction:column; gap:8px;}
.day-events .ev-chip{padding:9px 12px; flex-direction:row; align-items:center; gap:10px;}
.day-events .ev-type{font-size:var(--fs-xs); min-width:84px;}
.day-events .ev-co{font-size:var(--fs-md);}

/* ---------- objectifs & stats ---------- */
.goal-input-row{display:flex; align-items:center; gap:12px;}
.goal-input-row input, .input-suffix input{width:70px; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:8px 10px; font-size:var(--fs-lg); text-align:center; font-weight:600;}
.weekbar-chart{display:flex; align-items:flex-end; gap:12px; height:130px; padding-top:10px;}
.weekbar-col{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:7px;}
.weekbar-fill{width:100%; border-radius:4px 4px 0 0; background:var(--panel-2); position:relative; min-height:2px;}
.weekbar-fill.hit{background:var(--success);}
.weekbar-fill.short{background:var(--accent);}
.weekbar-num{font-size:var(--fs-2xs); color:var(--text-faint);}
.weekbar-lbl{font-size:var(--fs-2xs); color:var(--text-faint);}

.funnel{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.funnel-num{font-family:var(--font-display); font-size:var(--fs-stat); font-weight:700; line-height:1;}
.funnel-lbl{font-size:var(--fs-sm); color:var(--text-dim); margin:6px 0 10px 0;}
.funnel-bar{height:8px; background:var(--panel-2); border-radius:5px; overflow:hidden;}
.funnel-fill{height:100%; background:var(--accent); border-radius:5px;}
.funnel-rate{font-size:var(--fs-xs); color:var(--text-faint); margin-top:6px;}

.stats-table{width:100%; border-collapse:collapse; font-size:var(--fs-sm);}
.stats-table th{text-align:right; font-weight:500; color:var(--text-faint); font-size:var(--fs-xs); padding:0 8px 10px 8px; white-space:nowrap;}
.stats-table td{text-align:right; padding:10px 8px; border-top:1px solid var(--border-soft); color:var(--text-dim);}
.stats-table td.lbl{text-align:left; color:var(--text); font-weight:500;}
.stats-table th:first-child, .stats-table td:first-child{padding-left:0;}
.stats-table th:last-child, .stats-table td:last-child{padding-right:0;}
.stats-table .w-bar{width:32%; min-width:120px; text-align:left;}
.rate-cell{display:flex; align-items:center; gap:8px;}
.stats-table tr.best td{color:var(--text);}
.mini-bar{flex:1; height:6px; background:var(--panel-2); border-radius:4px; overflow:hidden;}
.mini-bar-fill{height:100%; background:var(--success); border-radius:4px;}
.mini-bar-num{width:36px; text-align:right; font-size:var(--fs-xs); color:var(--text-dim);}

/* ---------- modal ---------- */
.modal-overlay{position:fixed; inset:0; background:var(--overlay); display:flex; align-items:flex-start; justify-content:center; padding:5vh 16px; z-index:50; overflow-y:auto; animation:fadeIn .14s ease-out;}
.modal{background:var(--panel); border:1px solid var(--border); border-radius:var(--r-md); width:100%; max-width:580px; padding:28px 30px 30px 30px; box-shadow:var(--shadow-lg); animation:popIn .16s ease-out;}
.modal-sm{max-width:420px;}
.modal-lg{max-width:820px;}
/* Fenêtre remplacée par une autre : pas de nouvelle animation (voir modal.js). */
.modal-overlay.no-anim, .modal-overlay.no-anim > .modal{animation:none;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes popIn{from{opacity:0; transform:translateY(8px) scale(.985);}to{opacity:1; transform:none;}}
.modal-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:22px; gap:12px;}
.modal-head h3{font-size:var(--fs-h3); display:flex; align-items:center; gap:9px;}
.modal-head h3 svg{width:17px; height:17px; stroke:var(--accent); fill:none; stroke-width:2;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; column-gap:16px;}
.form-group{display:flex; flex-direction:column; gap:7px; margin-bottom:16px; min-width:0;}
.form-group.full, .form-hint.full, .check-row.full{grid-column:1/-1;}
.form-group label{font-size:var(--fs-xs); color:var(--text-dim); font-weight:500;}
.form-group input, .form-group textarea{
  background-color:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:10px 12px; font-size:var(--fs-md); width:100%;
}
.form-group textarea{resize:vertical; min-height:60px; font-family:var(--font-body); line-height:1.55;}
.form-group input:focus, .form-group textarea:focus{outline:none; border-color:var(--accent);}
.field-hint{font-size:var(--fs-2xs); color:var(--text-faint);}
.form-hint{font-size:var(--fs-sm); color:var(--text-dim); background:var(--panel-2); border-radius:var(--r-sm); padding:10px 12px; margin-bottom:16px;}
.input-pair{display:flex; gap:8px;}
.input-pair input[type=date]{flex:1; min-width:0;}
.input-pair input[type=time]{width:104px; flex-shrink:0;}
.input-suffix{display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); color:var(--text-dim);}
.form-group .input-suffix input{flex:0 0 84px; width:84px; text-align:center; font-weight:600;}
.check-row{display:flex; align-items:center; gap:9px; font-size:var(--fs-md); color:var(--text-dim); margin-bottom:12px; cursor:pointer;}
.modal-actions{display:flex; justify-content:space-between; align-items:center; margin-top:18px; gap:12px; flex-wrap:wrap;}
.modal-actions-right{display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end;}
input[type=date], input[type=time]{color-scheme:light dark;}

.dialog-overlay{z-index:70; align-items:center;}
.dialog{max-width:420px;}
.dialog h3{font-size:var(--fs-h3); margin-bottom:10px;}
.dialog-msg{font-size:var(--fs-md); color:var(--text-dim); line-height:1.6; margin-bottom:22px;}
.dialog .modal-actions-right{justify-content:flex-end;}

/* ---------- notifications ---------- */
#toastRoot{position:fixed; right:20px; bottom:20px; z-index:90; display:flex; flex-direction:column; gap:10px; align-items:flex-end; pointer-events:none;}
.toast{
  pointer-events:auto; display:flex; align-items:center; gap:12px; min-width:260px; max-width:420px;
  background:var(--panel); color:var(--text); border:1px solid var(--border); border-left:3px solid var(--info);
  border-radius:var(--r-sm); padding:11px 10px 11px 14px; font-size:var(--fs-md); box-shadow:var(--shadow-lg);
  animation:toastIn .18s ease-out;
}
.toast-success{border-left-color:var(--success);}
.toast-error{border-left-color:var(--danger);}
.toast-msg{flex:1; line-height:1.45;}
.toast-action{background:none; border:none; color:var(--accent); font-weight:600; font-size:var(--fs-md); padding:4px 6px; border-radius:5px;}
.toast-action:hover{background:var(--accent-soft);}
.toast-close{background:none; border:none; color:var(--text-faint); display:flex; padding:4px; border-radius:5px;}
.toast-close:hover{color:var(--text);}
.toast-close svg{width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2;}
.toast.leaving{opacity:0; transform:translateY(6px); transition:opacity .18s, transform .18s;}
@keyframes toastIn{from{opacity:0; transform:translateY(10px);}to{opacity:1; transform:none;}}

/* ---------- palette de commandes ---------- */
.palette-overlay{z-index:80; padding-top:12vh;}
.palette{width:100%; max-width:580px; background:var(--panel); border:1px solid var(--border); border-radius:var(--r-md); box-shadow:var(--shadow-lg); overflow:hidden; animation:popIn .14s ease-out; align-self:flex-start;}
.palette-search{display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--border);}
.palette-search svg{width:16px; height:16px; stroke:var(--text-faint); fill:none; stroke-width:2; flex-shrink:0;}
.palette-search input{flex:1; background:none; border:none; color:var(--text); font-size:var(--fs-lg); outline:none; min-width:0;}
.palette-search input:focus-visible{box-shadow:none;}
.palette-list{max-height:min(420px, 60vh); overflow-y:auto; padding:6px;}
.palette-group{font-size:var(--fs-2xs); text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint); font-weight:600; padding:10px 10px 6px 10px;}
.palette-item{display:flex; align-items:center; gap:11px; padding:9px 10px; border-radius:var(--r-sm); cursor:pointer; font-size:var(--fs-md); color:var(--text-dim);}
.palette-item.active{background:var(--panel-2); color:var(--text);}
.palette-ic{display:flex; color:var(--text-faint);}
.palette-item.active .palette-ic{color:var(--accent);}
.palette-ic svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9;}
.palette-txt{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.palette-txt small{color:var(--text-faint); font-size:var(--fs-xs); margin-left:8px;}
.palette-empty{padding:24px; text-align:center; color:var(--text-faint); font-size:var(--fs-sm);}
.shortcut-list{display:flex; flex-direction:column;}
.shortcut{display:flex; justify-content:space-between; align-items:center; padding:10px 0; border-bottom:1px solid var(--border-soft); font-size:var(--fs-md); color:var(--text-dim);}
.shortcut:last-child{border-bottom:none;}

/* ---------- menu déroulant personnalisé ---------- */
.cs-select{position:relative; display:inline-flex; width:100%;}
.cs-select select{display:none;}
.cs-trigger{
  display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  background-color:var(--panel-2); border:1px solid var(--border); color:var(--text);
  border-radius:var(--r-sm); padding:11px 13px; font-size:var(--fs-md); font-family:var(--font-body); font-weight:500;
  text-align:left; transition:border-color .12s;
}
.cs-trigger:hover{border-color:var(--border-hover);}
.cs-select.open .cs-trigger{border-color:var(--accent);}
.cs-trigger-label{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.cs-chevron{width:14px; height:14px; flex-shrink:0; stroke:var(--text-faint); fill:none; stroke-width:2; transition:transform .12s;}
.cs-select.open .cs-chevron{transform:rotate(180deg);}
.cs-panel{
  position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:40;
  background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm);
  padding:6px; max-height:260px; overflow-y:auto; box-shadow:var(--shadow-lg); min-width:180px;
}
.cs-option{padding:9px 11px; border-radius:6px; font-size:var(--fs-md); color:var(--text-dim); cursor:pointer;}
.cs-option:hover, .cs-option.active{background:var(--panel-2); color:var(--text);}
.cs-option.selected{color:var(--accent); font-weight:600;}

.filters-row .cs-select{width:auto; min-width:180px;}
.filters-row .cs-trigger{padding:12px 13px; background-color:var(--panel);}
.detail-head-right .cs-select{width:auto;}
.detail-head-right .cs-trigger{padding:8px 13px;}

/* ---------- paramètres ---------- */
.settings-stack{display:flex; flex-direction:column; gap:18px; max-width:720px;}
.theme-toggle{display:flex; flex-wrap:wrap; gap:8px;}
.theme-option{
  display:inline-flex; align-items:center; gap:9px; padding:8px 14px 8px 10px; border-radius:20px; cursor:pointer;
  border:1px solid var(--border); background:var(--panel-2); color:var(--text-dim); font-size:var(--fs-md); font-weight:500;
  transition:border-color .2s ease, color .2s ease, background-color .2s ease;
}
.theme-option:hover{color:var(--text); border-color:var(--border-hover);}
.theme-option.active{border-color:var(--accent); color:var(--text); background:var(--accent-soft);}
/* Pastille : cercle du fond du thème + point de son accent. */
.theme-dot{position:relative; width:18px; height:18px; border-radius:50%; flex-shrink:0; background:var(--td-bg); box-shadow:inset 0 0 0 1px var(--td-line), 0 0 0 1px rgba(0,0,0,.08);}
.theme-dot::after{content:''; position:absolute; inset:5px; border-radius:50%; background:var(--td-accent);}

/* Passage d'un thème à l'autre en fondu (classe posée ~0,45 s par setTheme). */
.theme-anim, .theme-anim *, .theme-anim *::before, .theme-anim *::after{
  transition:background-color .35s ease, border-color .35s ease, color .35s ease, fill .35s ease, stroke .35s ease, box-shadow .35s ease !important;
}
.tpl{border-top:1px solid var(--border-soft); padding-top:18px; margin-top:18px;}
.tpl-head{display:flex; align-items:center; gap:10px; margin-bottom:14px; font-size:var(--fs-md);}

/* ---------- fiche détaillée ---------- */
.detail-head{display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:22px; padding-bottom:20px; border-bottom:1px solid var(--border);}
.detail-head-left h2{font-size:var(--fs-h2);}
.detail-head-left .role{color:var(--text-dim); font-size:var(--fs-md); margin-top:6px;}
.detail-head-right{display:flex; align-items:center; gap:12px; flex-shrink:0; flex-wrap:wrap;}
.detail-info{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:16px 22px; margin-bottom:18px;}
.detail-info-item .lbl{font-size:var(--fs-xs); color:var(--text-faint); margin-bottom:5px;}
.detail-info-item .val{font-size:var(--fs-md); font-weight:500; display:flex; flex-wrap:wrap; gap:6px; align-items:center;}
.detail-info-item .val > svg{width:13px; height:13px; stroke:var(--text-faint); fill:none; stroke-width:2;}
.detail-info-item a{color:var(--link-color); text-decoration:none; display:inline-flex; align-items:center; gap:6px;}
.detail-info-item a:hover{text-decoration:underline;}
.detail-info-item a svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2;}
.quick-actions{display:flex; gap:8px; flex-wrap:wrap; padding-bottom:22px; margin-bottom:22px; border-bottom:1px solid var(--border);}
.detail-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-bottom:24px;}
.detail-block{margin-bottom:24px;}
.detail-section-title{font-size:var(--fs-xs); font-weight:600; color:var(--text-dim); text-transform:uppercase; letter-spacing:.04em; margin-bottom:14px; display:flex; align-items:center; gap:8px;}
.detail-section-title svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2;}
.detail-subtitle{font-size:var(--fs-xs); color:var(--text-dim); font-weight:600; margin:14px 0 8px 0;}
.prep-progress{margin-left:auto; text-transform:none; letter-spacing:0; font-weight:600; color:var(--accent); background:var(--accent-soft); padding:2px 8px; border-radius:20px;}
.checklist{margin-bottom:10px;}
.mini-contact{background:var(--panel-2); border:1px solid var(--border); border-radius:var(--r-sm); padding:12px 14px; margin-bottom:10px; display:flex; justify-content:space-between; align-items:flex-start; gap:16px;}
.mini-contact:last-child{margin-bottom:0;}
.mini-contact .nm{font-size:var(--fs-md); font-weight:600;}
.mini-contact .rl{font-size:var(--fs-xs); color:var(--text-faint); margin-top:2px;}
.dtimeline{display:flex; flex-direction:column;}
.dtimeline-item{display:flex; gap:13px; position:relative; padding-bottom:20px;}
.dtimeline-item:last-child{padding-bottom:0;}
.dtimeline-item::before{content:''; position:absolute; left:4px; top:14px; bottom:-2px; width:1px; background:var(--border);}
.dtimeline-item:last-child::before{display:none;}
.dtimeline-dot{width:9px; height:9px; border-radius:50%; flex-shrink:0; margin-top:3px; position:relative; z-index:1; box-shadow:0 0 0 2px var(--panel);}
.dtimeline-mid .lbl{font-size:var(--fs-xs); color:var(--text-faint);}
.dtimeline-mid .val{font-size:var(--fs-md); font-weight:600; margin-top:2px;}
.detail-textarea{width:100%; min-height:110px; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:12px 14px; font-size:var(--fs-md); font-family:var(--font-body); resize:vertical; line-height:1.55;}
.detail-textarea:focus{border-color:var(--accent);}
.detail-history summary{cursor:pointer; list-style:none; margin-bottom:0;}
.detail-history summary::-webkit-details-marker{display:none;}
.detail-history[open] summary{margin-bottom:12px;}
.history-list{display:flex; flex-direction:column; gap:8px;}
.history-item{display:flex; align-items:center; gap:10px; font-size:var(--fs-sm); color:var(--text-dim);}
.history-dot{width:7px; height:7px; border-radius:50%; flex-shrink:0;}
.history-date{width:52px; color:var(--text-faint); font-size:var(--fs-xs); flex-shrink:0;}
.detail-actions{display:flex; justify-content:flex-end; gap:12px; flex-wrap:wrap; margin-top:4px; padding-top:18px; border-top:1px solid var(--border);}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .grid-3{grid-template-columns:1fr 1fr;}
}
@media (max-width:760px){
  .detail-grid{grid-template-columns:1fr;}
  .funnel{grid-template-columns:1fr 1fr;}
  
  
}

/* Mobile : la barre latérale devient une barre de navigation en bas d'écran. */
@media (max-width: 860px){
  body{flex-direction:column;}
  .sidebar{
    position:fixed; left:0; right:0; bottom:0; top:auto; width:100%; height:auto; z-index:45;
    flex-direction:row; padding:6px 4px calc(6px + env(safe-area-inset-bottom)); gap:0;
    border-right:none; border-top:1px solid var(--border);
  }
  .brand, .search-trigger{display:none;}
  .sidebar-foot{margin:0; padding:0 4px; border:none; flex-shrink:0; display:flex; align-items:center;}
  .user-btn{padding:4px; width:auto;}
  .user-name, .user-chev{display:none;}
  .user-dropdown{left:auto; right:0; width:240px;}
  .modal.modal-settings{grid-template-columns:1fr; min-height:0;}
  .settings-nav{flex-direction:row; overflow-x:auto; border-right:none; border-bottom:1px solid var(--border); padding:12px;}
  .settings-title{display:none;}
  .settings-body{padding:22px 18px;}
  .navlist{flex-direction:row; flex:1; min-width:0; justify-content:space-around; gap:0;}
  .navitem{flex-direction:column; gap:3px; padding:6px 0; font-size:var(--fs-2xs); letter-spacing:-0.01em; border:none; align-items:center; text-align:center; flex:1; min-width:0;}
  .navitem.active{background:none; border:none;}
  .navitem.active .nav-short{color:var(--text);}
  .nav-label{display:none;}
  .nav-short{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;}
  .navitem svg{width:19px; height:19px;}
  .main{padding:18px 16px 96px 16px; max-width:100%;}
  #topbar{margin-bottom:20px;}
  .page-title{font-size:var(--fs-h2);}
  .topbar-actions .btn{padding:9px 13px;}
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .grid-2, .grid-3{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .cal-grid{gap:3px;}
  .cal-day{padding:3px; min-height:84px;}
  .ev-chip{padding:3px 4px 3px 5px; border-left-width:2px;}
  .ev-type{display:none;}
  .ev-co{font-size:var(--fs-2xs);}
  .contact-row{flex-wrap:wrap; padding:16px 16px 16px 20px; gap:12px;}
  .contact-main{flex:1 1 calc(100% - 64px);}
  .contact-avatar{width:40px; height:40px; font-size:var(--fs-md);}
  .contact-link{order:3; flex:1 1 auto; min-width:0;}
  .contact-actions{order:4; flex:0 0 auto;}
  .contact-notes{white-space:normal;}
  .modal{padding:22px 18px;}
  .modal-overlay{padding:3vh 10px 24px;}
  #toastRoot{left:12px; right:12px; bottom:84px; align-items:stretch;}
  .toast{max-width:none;}
  .filters-row input[type=text], .filters-row .cs-select{min-width:0; flex:1 1 160px;}
  .search-wrap{flex:1 1 100%;}
  .search-wrap input{width:100%;}
}

/* ---------- liste des candidatures ----------
   Une carte pleine largeur par candidature, habillée par la couleur de
   son statut (--st, posée sur la carte) : bordure, barre d'accent, léger
   dégradé et halo au survol. Les couleurs viennent des variables du thème,
   donc la carte suit n'importe quel thème. */
.filters-row{margin-bottom:28px;}
.app-list{display:flex; flex-direction:column; gap:16px; padding-bottom:8px;}
.app-row{
  position:relative; display:flex; align-items:center; gap:16px; padding:16px 20px;
  border:1px solid var(--card-line); border-radius:var(--r-md);
  background:var(--card-bg); box-shadow:var(--card-shadow);
  cursor:pointer;
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.app-row:hover{border-color:var(--card-line); transform:translateY(-1px); box-shadow:var(--card-hover-shadow);}
.app-row:focus-visible{box-shadow:var(--focus-ring); border-radius:var(--r-md);}
/* le menu de statut ouvert doit passer au-dessus des cartes suivantes */
.app-row:has(.cs-select.open){z-index:5;}
.app-row-main{flex:1; min-width:0;}
.app-row-name{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:650; letter-spacing:-0.01em; line-height:1.2; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.app-row-sub{margin-top:3px; font-size:var(--fs-sm); color:var(--text-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.app-row-sub span{display:inline-flex; align-items:center; gap:7px; min-width:0;}
.app-row-sub svg{width:14px; height:14px; stroke:var(--text-faint); fill:none; stroke-width:1.9; flex-shrink:0;}
.app-row-status{flex-shrink:0; width:170px; display:flex; flex-direction:column; align-items:flex-end; gap:6px;}
.app-when{font-size:var(--fs-xs); color:var(--text-faint); font-variant-numeric:tabular-nums; white-space:nowrap;}
.app-mono{width:42px; height:42px; flex-shrink:0; display:grid; place-items:center; border-radius:var(--mono-radius); background:var(--mono-bg); color:var(--mono-fg); font-weight:700; font-size:var(--fs-lg);}
.app-row-status .cs-trigger{
  background:color-mix(in srgb, var(--st) 14%, var(--card-bg)); border-color:transparent;
  color:color-mix(in srgb, var(--st) 55%, var(--text)); font-weight:600; padding:6px 12px; border-radius:20px; font-size:var(--fs-sm);
}
.app-row-status .cs-trigger::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--st); flex-shrink:0;}
.app-row-status .cs-trigger-label{flex:1;}
.app-row-status .cs-trigger:hover{border-color:var(--st);}
.app-row-status .cs-panel{left:auto; right:0; min-width:200px;}
/* candidature refusée : la carte passe au second plan */
.app-row.is-closed{opacity:.72;}
.app-row.is-closed:hover{opacity:1;}
/* apparition en cascade à l'ouverture de l'onglet (pas pendant la recherche) */
.app-list.enter .app-row{animation:rowIn .35s ease-out both; animation-delay:calc(var(--i) * 40ms);}
@keyframes rowIn{from{opacity:0; transform:translateY(8px);}to{opacity:1; transform:none;}}
.app-list.enter .app-row.is-closed{animation-name:rowInClosed;}
@keyframes rowInClosed{from{opacity:0; transform:translateY(8px);}to{opacity:.72; transform:none;}}
@media (max-width:640px){
  .app-list{gap:12px;}
  .app-row{padding:18px 18px 18px 22px; gap:14px; flex-wrap:wrap;}
  .app-row-name{font-size:var(--fs-h3);}
  .app-row-status{width:100%;}
}

/* =====================================================================
   v2 : barre latérale réductible, documents, paramètres, calendrier
   (semaine / année), contacts (tri, filtres, affichages), accessibilité
   ===================================================================== */

/* ---------- barre latérale réductible ---------- */
.brand{position:relative;}
.sidebar-toggle{
  margin-left:auto; width:28px; height:28px; border-radius:var(--r-sm); flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:none; border:1px solid transparent; color:var(--text-faint); transition:color .12s, background .12s, border-color .12s;
}
.sidebar-toggle svg{width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s;}
.sidebar-toggle:hover{color:var(--text); background:var(--panel); border-color:var(--border);}
.sidebar{transition:width .2s ease, padding .2s ease;}
.sidebar-collapsed .sidebar{width:72px; padding-left:12px; padding-right:12px;}
.sidebar-collapsed .brand{flex-direction:column; gap:12px; padding:2px 0 4px 0;}
.sidebar-collapsed .brand-text,
.sidebar-collapsed .search-trigger span,
.sidebar-collapsed .search-trigger kbd,
.sidebar-collapsed .nav-label,
.sidebar-collapsed .user-name,
.sidebar-collapsed .user-chev{display:none;}
.sidebar-collapsed .sidebar-toggle{margin:0;}
.sidebar-collapsed .sidebar-toggle svg{transform:scaleX(-1);}
.sidebar-collapsed .search-trigger{justify-content:center; padding:9px 0;}
.sidebar-collapsed .navitem{justify-content:center; padding:10px 0;}
.sidebar-collapsed .user-btn{justify-content:center; padding:6px 0;}
.sidebar-collapsed .user-dropdown{width:200px; right:auto;}

/* ---------- avatar avec photo ---------- */
.avatar img{width:100%; height:100%; border-radius:50%; object-fit:cover; display:block;}
.avatar-xl{width:84px; height:84px; font-size:var(--fs-h2);}
.avatar-xl .save-dot{display:none;}
.profile-photo{display:flex; align-items:center; gap:20px;}

/* ---------- paramètres v2 ---------- */
.modal.modal-settings{max-width:900px; grid-template-columns:240px minmax(0,1fr); height:min(640px, 88vh); min-height:0;}
.settings-nav{overflow-y:auto;}
.settings-tab span{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.settings-body{overflow-y:auto;}
.settings-block{padding-bottom:26px; margin-bottom:26px; border-bottom:1px solid var(--border-soft);}
.settings-block:last-child{border-bottom:none; margin-bottom:0; padding-bottom:0;}
.settings-note.warn{color:var(--tint-danger-text);}
/* interrupteur */
.switch-row{display:flex; align-items:center; justify-content:space-between; gap:18px; padding:12px 0; border-top:1px solid var(--border-soft); cursor:pointer;}
.settings-block .switch-row:first-of-type{border-top:none;}
.switch-row.is-disabled{opacity:.5; cursor:not-allowed;}
.switch-txt b{display:block; font-size:var(--fs-md); font-weight:500;}
.switch-txt small{display:block; font-size:var(--fs-xs); color:var(--text-faint); margin-top:3px; line-height:1.45;}
.switch{
  appearance:none; -webkit-appearance:none; flex-shrink:0; width:38px; height:22px; border-radius:22px; margin:0;
  background:var(--panel-2); border:1px solid var(--border); position:relative; cursor:pointer; transition:background .15s, border-color .15s;
}
.switch::after{content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%; background:var(--text-faint); transition:transform .15s, background .15s;}
.switch:checked{background:var(--accent); border-color:var(--accent);}
.switch:checked::after{transform:translateX(16px); background:var(--accent-contrast);}
.switch:disabled{cursor:not-allowed;}
/* choix segmentés */
.segmented{display:flex; flex-wrap:wrap; gap:8px;}
.seg{
  display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 14px; border-radius:var(--r-sm); cursor:pointer;
  background:var(--panel-2); border:1px solid var(--border); color:var(--text-dim); font-size:var(--fs-md); font-weight:500;
  transition:border-color .12s, color .12s, background .12s;
}
.seg input{position:absolute; opacity:0; pointer-events:none;}
.seg small{font-size:var(--fs-xs); color:var(--text-faint); font-weight:400;}
.seg:hover{color:var(--text); border-color:var(--border-hover);}
.seg.active{border-color:var(--accent); background:var(--accent-soft); color:var(--text);}
.segmented-inline{flex-wrap:nowrap; gap:0; background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm); padding:3px;}
.segmented-inline .seg{flex-direction:row; align-items:center; gap:6px; padding:7px 12px; border:none; background:none; border-radius:var(--r-sm); font-size:var(--fs-sm);}
.segmented-inline .seg.active{background:var(--panel-2); color:var(--text); box-shadow:inset 0 0 0 1px var(--border);}
.seg-count{font-size:var(--fs-2xs); color:var(--text-faint);}
.input-time{width:130px; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:9px 12px; font-size:var(--fs-md);}
.input-time:disabled{opacity:.5;}
/* utilisation du stockage */
.usage{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:1px; background:var(--border-soft); border:1px solid var(--border-soft); border-radius:10px; overflow:hidden;}
.usage-item{background:var(--panel); padding:14px 16px;}
.usage-item b{display:block; font-family:var(--font-display); font-size:var(--fs-h3);}
.usage-item span{font-size:var(--fs-xs); color:var(--text-faint);}
/* raccourcis modifiables */
.kbd-btn{background:none; border:none; padding:0; cursor:pointer; border-radius:6px;}
.kbd-btn kbd{min-width:28px; display:inline-block; text-align:center; transition:border-color .12s, color .12s;}
.kbd-btn:hover kbd{border-color:var(--accent); color:var(--text);}
.kbd-btn.capturing kbd{border-color:var(--accent); color:var(--accent); animation:pulse 1s ease-in-out infinite;}
@keyframes pulse{50%{opacity:.5;}}
.shortcut.is-fixed{color:var(--text-faint);}

/* ---------- bandeau discret (rappel de sauvegarde) ---------- */
.notice{display:flex; align-items:center; gap:12px; padding:10px 10px 10px 16px; border-radius:var(--r-sm); background:var(--panel); border:1px solid var(--border); font-size:var(--fs-sm); color:var(--text-dim);}
.notice > svg{width:15px; height:15px; stroke:var(--text-faint); fill:none; stroke-width:2; flex-shrink:0;}
.notice > span{flex:1;}
.notice-actions{display:flex; align-items:center; gap:6px; flex-shrink:0;}

/* ---------- documents ---------- */
.doc-drop{
  display:flex; align-items:center; gap:16px; padding:18px 22px; margin-bottom:24px; border-radius:var(--r-md);
  border:1.5px dashed var(--border); color:var(--text-dim); transition:border-color .15s, background .15s;
}
.doc-drop b{display:block; color:var(--text); font-size:var(--fs-md);}
.doc-drop span{font-size:var(--fs-sm);}
.doc-drop.drag-over{border-color:var(--accent); background:var(--accent-soft);}
.doc-drop-icon{width:26px; height:26px; stroke:var(--text-faint); fill:none; stroke-width:1.8; flex-shrink:0;}
.doc-drop.drag-over .doc-drop-icon{stroke:var(--accent);}
.doc-row{
  position:relative; display:flex; align-items:center; gap:18px; padding:16px 20px; cursor:pointer;
  border:1px solid var(--card-line); border-radius:var(--r-md);
  background:var(--card-bg); box-shadow:var(--card-shadow);
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.doc-row:hover{border-color:var(--card-line); transform:translateY(-1px); box-shadow:var(--card-hover-shadow);}
.doc-icon{
  width:42px; height:50px; border-radius:6px 12px 6px 6px; flex-shrink:0; position:relative; display:flex; align-items:flex-end; justify-content:center; padding-bottom:6px;
  background:color-mix(in srgb, var(--st) 18%, var(--panel-2)); border:1px solid color-mix(in srgb, var(--st) 50%, transparent);
}
.doc-icon span{font-size:9px; font-weight:700; letter-spacing:.04em; color:var(--text);}
.doc-main{flex:1; min-width:0;}
.doc-name{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.doc-sub{display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:6px; font-size:var(--fs-sm); color:var(--text-dim);}
.doc-kind{color:var(--text); font-weight:600;}
.doc-links{flex:0 0 280px; display:flex; flex-wrap:wrap; gap:6px; min-width:0;}
.doc-actions{display:flex; gap:6px; flex-shrink:0;}
.doc-actions .icon-btn{background:transparent;}
.doc-actions .icon-btn:hover{border-color:var(--border-hover); color:var(--text);}
.doc-file-line{display:inline-flex; align-items:center; gap:8px; font-size:var(--fs-sm); color:var(--text-dim); margin-bottom:16px;}
.btn-row .doc-file-line{margin:0;}
.doc-file-line svg{width:15px; height:15px; stroke:var(--text-faint); fill:none; stroke-width:1.9;}
.doc-file-line b{color:var(--text); font-weight:600;}
/* liste de cases (candidatures d'un document, documents d'une candidature) */
.check-list{display:flex; flex-direction:column; max-height:220px; overflow-y:auto; border:1px solid var(--border); border-radius:var(--r-sm); background:var(--panel-2);}
.check-line{display:flex; align-items:center; gap:10px; padding:9px 12px; border-top:1px solid var(--border-soft); cursor:pointer; font-size:var(--fs-md); min-width:0;}
.check-line:first-child{border-top:none;}
.check-line:hover{background:color-mix(in srgb, var(--panel-2) 60%, var(--panel));}
.check-line input{accent-color:var(--accent); width:15px; height:15px; margin:0; flex-shrink:0;}
.check-line b{font-weight:600; white-space:nowrap;}
.check-line .link-chip-dot{background:var(--st);}
.check-line-sub{color:var(--text-faint); font-size:var(--fs-sm); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.doc-kind-tag{font-size:var(--fs-2xs); font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--st); background:color-mix(in srgb, var(--st) 15%, transparent); padding:2px 6px; border-radius:4px; flex-shrink:0;}
/* documents dans la fiche d'une candidature */
.detail-docs{margin-bottom:22px;}
.doc-chips{display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.doc-chip{
  display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:var(--r-sm); cursor:pointer;
  background:color-mix(in srgb, var(--st) 10%, var(--panel-2)); border:1px solid color-mix(in srgb, var(--st) 40%, var(--border));
  color:var(--text); font-size:var(--fs-sm); transition:border-color .12s, transform .12s;
}
.doc-chip:hover{border-color:var(--st); transform:translateY(-1px);}
.doc-chip > svg{width:14px; height:14px; stroke:var(--st); fill:none; stroke-width:1.9;}
.doc-chip b{font-weight:600;}

/* ---------- calendrier : en-tête ---------- */
.cal-head{flex-wrap:wrap; gap:12px;}
.cal-num{background:none; border:none; cursor:pointer; font-family:inherit;}
.cal-num:hover{color:var(--text); background:var(--panel-2);}

/* ---------- calendrier : semaine ---------- */
.wk{border:1px solid var(--border-soft); border-radius:10px; overflow:hidden;}
.wk-head, .wk-grid{display:grid; grid-template-columns:58px repeat(7, minmax(0,1fr));}
.wk-head{background:var(--panel); border-bottom:1px solid var(--border-soft);}
.wk-dayhead{display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 4px; border-left:1px solid var(--border-soft);}
.wk-dayhead span{font-size:var(--fs-2xs); color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em;}
.wk-dayhead b{font-family:var(--font-display); font-size:var(--fs-h3); width:32px; height:32px; line-height:32px; text-align:center; border-radius:50%;}
.wk-dayhead.today b{background:var(--accent); color:var(--accent-contrast);}
.wk-dayhead.today span{color:var(--accent);}
.wk-gutter{font-size:var(--fs-2xs); color:var(--text-faint);}
.wk-col.today{background:color-mix(in srgb, var(--accent) 5%, transparent);}
.wk-scroll{max-height:min(620px, 62vh); overflow-y:auto; position:relative;}
.wk-hour{position:relative; text-align:right; padding-right:8px;}
.wk-hour span{position:relative; top:-7px;}
.wk-hour:first-child span{visibility:hidden;}
.wk-col{position:relative; border-left:1px solid var(--border-soft); min-width:0;}
.wk-slot{border-top:1px solid var(--border-soft);}
.wk-slot:first-child{border-top:none;}
.wk-event{
  position:absolute; left:4px; right:4px; z-index:2; overflow:hidden; text-align:left; cursor:pointer;
  display:flex; flex-direction:column; gap:1px; padding:5px 8px; border-radius:var(--r-sm);
  background:color-mix(in srgb, var(--ev) 22%, var(--panel)); border:none; border-left:3px solid var(--ev); color:var(--text);
  box-shadow:0 4px 12px -6px rgba(0,0,0,.4); transition:background .12s;
}
.wk-event:hover{background:color-mix(in srgb, var(--ev) 34%, var(--panel));}
/* ligne de l'heure actuelle */
.now-line{position:absolute; left:0; right:0; height:0; border-top:2px solid #e5484d; z-index:3; pointer-events:none;}
.now-line[hidden]{display:none;}
.now-line span{position:absolute; left:-6px; top:-7px; width:12px; height:12px; border-radius:50%; background:#e5484d; box-shadow:0 0 0 3px color-mix(in srgb, #e5484d 25%, transparent);}

/* ---------- calendrier : année ---------- */
.yr{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:22px 28px;}
.yr-title{background:none; border:none; padding:0; cursor:pointer; color:var(--text); font-family:var(--font-display); font-size:var(--fs-lg); font-weight:600;}
.yr-title:hover{color:var(--accent);}
.yr-sum{font-size:var(--fs-xs); color:var(--text-faint); margin:3px 0 8px 0; min-height:14px;}
.yr-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:3px;}
.yr-dow{font-size:9px; color:var(--text-faint); text-align:center; padding-bottom:2px;}
.yr-day{
  height:24px; display:flex; align-items:center; justify-content:center; border-radius:5px; border:1px solid transparent;
  font-size:10px; color:var(--text-dim); background:none; cursor:pointer; padding:0; font-family:inherit;
}
.yr-day.empty{cursor:default;}
.yr-day:not(.empty):hover{border-color:var(--border-hover);}
.yr-day.lvl1{background:color-mix(in srgb, var(--info) 30%, transparent); color:var(--text);}
.yr-day.lvl2{background:color-mix(in srgb, var(--info) 50%, transparent); color:var(--text);}
.yr-day.lvl3{background:color-mix(in srgb, var(--info) 72%, transparent); color:var(--text); font-weight:700;}
.yr-day.itw{box-shadow:inset 0 0 0 2px var(--accent);}
.yr-day.today{background:var(--accent); color:var(--accent-contrast); font-weight:700;}
.yr-legend{display:flex; align-items:center; gap:8px; margin-top:22px; font-size:var(--fs-xs); color:var(--text-faint);}
.yr-legend .yr-day{width:14px; height:14px; cursor:default; display:inline-block;}
.yr-legend .yr-day + *{margin-right:6px;}

/* ---------- contacts : outils et affichages ---------- */
.view-switch{display:flex; gap:4px; padding:3px; background:var(--panel); border:1px solid var(--border); border-radius:var(--r-sm); margin-left:auto;}
.view-switch .icon-btn{border-color:transparent; background:none; width:32px; height:32px;}
.view-switch .icon-btn.active{background:var(--panel-2); color:var(--text); border-color:var(--border);}
.result-count{font-size:var(--fs-xs); color:var(--text-faint); margin:-12px 0 14px 2px;}
/* compact */
.ct-table{border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; background:var(--panel);}
.ct-line{
  display:grid; grid-template-columns:10px minmax(140px,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr) 70px 160px;
  align-items:center; gap:14px; padding:9px 16px; border-top:1px solid var(--border-soft); font-size:var(--fs-md); cursor:pointer; transition:background .12s;
}
.ct-line:first-child{border-top:none;}
.ct-line:not(.ct-head):hover{background:var(--panel-2);}
.ct-head{cursor:default; font-size:var(--fs-xs); color:var(--text-faint); background:var(--panel-2); padding-top:8px; padding-bottom:8px;}
.ct-dot{width:8px; height:8px; border-radius:50%; background:var(--st);}
.ct-head .ct-dot{background:none;}
.ct-name{font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ct-cell{color:var(--text-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;}
.ct-date{text-align:right;}
.ct-actions{display:flex; gap:4px; justify-content:flex-end;}
.ct-actions .icon-btn{width:30px; height:30px; background:none; border-color:transparent;}
.ct-actions .icon-btn:hover{border-color:var(--border);}
/* mosaïque */
.ct-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:16px;}
.ct-tile{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:6px; padding:24px 16px 16px; cursor:pointer; min-width:0;
  border:1px solid var(--card-line); border-radius:var(--r-md);
  background:var(--card-bg); box-shadow:var(--card-shadow);
  transition:border-color .18s, box-shadow .18s, transform .18s;
}
.ct-tile:hover{border-color:var(--card-line); transform:translateY(-1px); box-shadow:var(--card-hover-shadow);}
.ct-tile .contact-avatar{width:56px; height:56px; margin-bottom:6px;}
.ct-tile-name{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:700; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ct-tile-role{font-size:var(--fs-sm); color:var(--text-dim); min-height:18px;}
.ct-tile-link{margin:6px 0 4px; max-width:100%; display:flex; justify-content:center;}
.ct-tile-actions{display:flex; gap:6px; margin-top:auto; padding-top:8px;}
.ct-tile-actions .icon-btn{background:transparent;}

/* ---------- objectifs & stats : respiration verticale ---------- */
.stats-page > * + *{margin-top:24px;}
.stats-page .grid-2, .stats-page .grid-3, .stats-page .section-gap{margin-bottom:0;}

/* ---------- accessibilité ---------- */
:root{--fs-scale:1;}
/* densité */
[data-density="compact"] .app-row{padding:14px 20px 14px 24px;}
[data-density="compact"] .contact-row, [data-density="compact"] .doc-row{padding:12px 18px 12px 22px;}
[data-density="compact"] .app-list, [data-density="compact"] .card-list{gap:10px;}
[data-density="compact"] .panel{padding:18px;}
[data-density="compact"] .main{padding-top:20px;}
[data-density="spacious"] .app-row{padding:28px 32px 28px 36px;}
[data-density="spacious"] .contact-row, [data-density="spacious"] .doc-row{padding:24px 28px 24px 32px;}
[data-density="spacious"] .app-list, [data-density="spacious"] .card-list{gap:22px;}
[data-density="spacious"] .panel{padding:32px;}
/* police très lisible */
.a11y-readable{--font-body:'Atkinson Hyperlegible', system-ui, sans-serif; --font-display:'Atkinson Hyperlegible', system-ui, sans-serif;}
/* liens soulignés */
.a11y-underline a, .a11y-underline .link-btn{text-decoration:underline !important; text-underline-offset:3px;}

/* ---------- responsive v2 ---------- */
@media (max-width:1100px){
  .yr{grid-template-columns:repeat(3, minmax(0,1fr));}
  .ct-line{grid-template-columns:10px minmax(120px,1.3fr) minmax(0,1fr) minmax(0,1fr) 150px; }
  .ct-line .ct-mail, .ct-line .ct-date{display:none;}
  .doc-links{flex-basis:200px;}
}
@media (max-width:860px){
  .sidebar-toggle{display:none;}
  .sidebar-collapsed .sidebar{width:100%; padding:6px 4px calc(6px + env(safe-area-inset-bottom));}
  .sidebar-collapsed .nav-short{display:block;}
  .modal.modal-settings{grid-template-columns:1fr; height:auto; max-height:none;}
  .settings-nav{flex-direction:row; overflow-x:auto;}
  .settings-tab span{white-space:nowrap;}
  .usage{grid-template-columns:repeat(2, minmax(0,1fr));}
  .yr{grid-template-columns:repeat(2, minmax(0,1fr));}
  .wk-head, .wk-grid{grid-template-columns:40px repeat(7, minmax(0,1fr));}
  .wk-event .ev-type{display:none;}
  .wk-event{padding:3px 4px; left:1px; right:1px;}
  .wk-dayhead b{width:26px; height:26px; line-height:26px; font-size:var(--fs-md);}
  .view-switch{margin-left:0;}
  .ct-line{grid-template-columns:10px minmax(0,1fr) auto;}
  .ct-line .ct-cell{display:none;}
  .ct-head{display:none;}
  .doc-row{flex-wrap:wrap; padding:16px 16px 16px 20px; gap:12px;}
  .doc-main{flex:1 1 calc(100% - 60px);}
  .doc-icon{width:36px; height:44px;}
  .doc-links{order:3; flex:1 1 auto;}
  .doc-actions{order:4;}
  .doc-drop{padding:14px 16px;}
  .cal-nav{flex-wrap:wrap;}
}

/* =====================================================================
   Profils locaux : écran de connexion, déconnexion
   ===================================================================== */
.menu-danger{color:var(--danger) !important;}
.menu-danger:hover{background:var(--danger-soft) !important;}
.settings-logout{margin-top:auto; color:var(--text-faint);}
.settings-logout:hover{color:var(--danger); background:var(--danger-soft);}
.settings-nav{display:flex; flex-direction:column;}
.avatar-lg{width:56px; height:56px; font-size:var(--fs-h3);}
.pin-form .form-grid{max-width:520px;}

body.login-mode{display:block;}
.login{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px 16px;}
.login-card{width:100%; max-width:460px; background:var(--panel); border:1px solid var(--border); border-radius:var(--r-lg); padding:36px 32px 28px; box-shadow:var(--shadow-lg); animation:popIn .2s ease-out;}
.login-brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:var(--fs-lg); margin-bottom:26px;}
.login h1{font-size:var(--fs-h1); letter-spacing:-.02em;}
.login-sub{color:var(--text-dim); font-size:var(--fs-md); margin:6px 0 22px;}
.login-profiles{display:flex; flex-direction:column; gap:10px;}
.login-profile{
  display:flex; align-items:center; gap:14px; width:100%; padding:12px 14px; border-radius:var(--r-md); cursor:pointer; text-align:left;
  background:var(--panel-2); border:1px solid var(--border); color:var(--text); transition:border-color .15s, background-color .15s, transform .15s;
}
.login-profile:hover{border-color:var(--border-hover); transform:translateY(-1px);}
.login-profile.active{border-color:var(--accent); background:var(--accent-soft);}
.login-profile .avatar{background:var(--accent-soft); color:var(--tint-accent-text);}
.login-name{flex:1; font-weight:600; font-size:var(--fs-lg); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.login-lock{width:16px; height:16px; stroke:var(--text-faint); fill:none; stroke-width:1.9; flex-shrink:0;}
.login-form{display:flex; flex-direction:column; gap:8px; margin-top:18px;}
.login-form[hidden]{display:none;}
.login-form label{font-size:var(--fs-xs); color:var(--text-dim); font-weight:500; margin-top:6px;}
.login-form label small{color:var(--text-faint); font-weight:400;}
.login-form input{background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-sm); padding:11px 13px; font-size:var(--fs-md); flex:1; min-width:0;}
.login-form input:focus{border-color:var(--accent); outline:none;}
.login-row{display:flex; gap:8px; margin-top:4px;}
.login-row.end{justify-content:flex-end; margin-top:12px;}
.login-error{color:var(--tint-danger-text); font-size:var(--fs-sm);}
.login-add{margin-top:14px; width:100%; padding:11px; border-radius:var(--r-md); border:1.5px dashed var(--border); background:none; color:var(--text-dim); font-size:var(--fs-md); cursor:pointer; transition:border-color .15s, color .15s;}
.login-add:hover{border-color:var(--accent); color:var(--text);}
.login-add[hidden]{display:none;}
/* compte en ligne : écran de connexion */
.login-cloud-btn{margin-top:10px; width:100%; justify-content:center;}
.login-cloud{padding-top:16px; border-top:1px solid var(--border-soft);}
.login-cloud .login-sub{margin:0 0 4px 0; text-align:left;}
/* compte en ligne : paramètres */
.cloud-status{margin:4px 0 14px 0;}
.cloud-state{display:inline-flex; align-items:center; gap:7px; font-size:var(--fs-sm); font-weight:500;}
.cloud-state svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.2; flex-shrink:0;}
.cloud-state.is-ok{color:var(--success);}
.cloud-state.is-error{color:var(--danger);}
.cloud-state.is-busy{color:var(--text-dim);}
.cloud-state.is-busy svg{animation:cloudSpin 1s linear infinite;}
@keyframes cloudSpin{to{transform:rotate(360deg);}}
.cloud-form .btn-row{margin-top:4px;}
.login-note{margin-top:22px; font-size:var(--fs-xs); color:var(--text-faint); text-align:center;}
.shake{animation:shake .35s ease;}
@keyframes shake{20%,60%{transform:translateX(-6px);}40%,80%{transform:translateX(6px);}}

/* =====================================================================
   Inscription (onboarding) et tutoriel interactif — suivent le thème
   ===================================================================== */
body.onb-mode, body.login-mode{display:block;}
.login-name small{display:block; font-size:var(--fs-xs); font-weight:500; color:var(--text-faint); margin-top:1px;}
.input-prefix{display:flex; align-items:center; background:var(--panel-2); border:1px solid var(--border); border-radius:var(--r-sm); overflow:hidden;}
.input-prefix span{padding:0 4px 0 12px; color:var(--text-faint); font-weight:600;}
.form-group .input-prefix input{border:none; background:none; padding-left:2px;}
.input-prefix:focus-within{border-color:var(--accent);}

/* Deux colonnes : à gauche l'aperçu de l'espace sur le fond de l'app,
   à droite le formulaire posé directement sur le panneau (pas d'encadré). */
.onb{--ease:cubic-bezier(.22,1,.36,1); min-height:100vh; display:grid; grid-template-columns:minmax(400px, 47%) 1fr; background:var(--card-bg); color:var(--text);}
.onb-side{
  position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:30px 44px; overflow:hidden;
  background-color:var(--bg); border-right:1px solid var(--border-soft);
  background-image:radial-gradient(color-mix(in srgb, var(--text) 10%, transparent) 1px, transparent 1.3px);
  background-size:20px 20px; background-position:-10px -10px;
}
.onb-side-center{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; padding-bottom:40px;}
.onb-side-caption{font-size:var(--fs-sm); color:var(--text-faint); text-align:center;}
.onb-brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:var(--fs-lg); letter-spacing:-.01em;}
.onb-brand .brand-mark{height:22px;}
.onb-brand-m{display:none;}

/* ---------- aperçus de l'application (preview.js) ---------- */
.pv{
  --ease:cubic-bezier(.22,1,.36,1);
  width:100%; height:100%; display:flex; flex-direction:column; overflow:hidden; text-align:left;
  background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:14px;
  font-family:var(--font-body); font-size:10px; line-height:1.3;
  box-shadow:0 1px 2px rgba(0,0,0,.06), 0 28px 60px -28px rgba(10,14,30,.35);
}
.pv-bar{height:24px; flex-shrink:0; display:flex; align-items:center; gap:5px; padding:0 11px; background:var(--panel); border-bottom:1px solid var(--border-soft);}
.pv-bar i{width:7px; height:7px; border-radius:50%; background:var(--border);}
.pv-bar span{margin-left:8px; font-size:9.5px; font-weight:600; color:var(--text-faint);}
.pv .empty{color:var(--text-faint) !important; font-weight:500;}

.pv-body{flex:1; display:grid; grid-template-columns:36% 1fr; min-height:0; transform-origin:0 100%; transition:transform .9s var(--ease);}
.pv-side{display:flex; flex-direction:column; gap:12px; padding:12px 9px 9px; background:var(--sidebar-bg); border-right:1px solid var(--border-soft); min-width:0;}
.pv-brand{display:flex; align-items:center; gap:6px; padding:0 3px;}
.pv-brand .brand-mark{height:11px;}
.pv-brand b{font-size:10.5px; font-family:var(--font-display);}
.pv-nav{display:flex; flex-direction:column; gap:2px;}
.pv-nav span{padding:5px 7px; border-radius:6px; color:var(--text-dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pv-nav span.on{background:var(--nav-active-bg); color:var(--text); font-weight:600;}
.pv-user{margin-top:auto; display:flex; align-items:center; gap:7px; padding:6px; border-radius:8px; min-width:0; transition:background-color .4s, box-shadow .4s;}
.pv-av{width:24px; height:24px; flex-shrink:0; border-radius:50%; overflow:hidden; display:grid; place-items:center; background:var(--mono-bg); color:var(--mono-fg); font-size:9px; font-weight:700;}
.pv-av img{width:100%; height:100%; object-fit:cover; animation:pvPop .45s var(--ease);}
@keyframes pvPop{from{transform:scale(.6); opacity:0;}to{transform:none; opacity:1;}}
.pv-who{min-width:0;}
.pv-who b, .pv-who small{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pv-who b{font-size:10.5px; color:var(--text);}
.pv-who small{font-size:9px; color:var(--text-faint);}
.pv-main{padding:14px 14px 10px; display:flex; flex-direction:column; gap:6px; min-width:0;}
.pv-title{font-family:var(--font-display); font-size:14px; font-weight:700; letter-spacing:-.01em; margin-bottom:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pv-row{display:flex; align-items:center; gap:8px; padding:8px; background:var(--card-bg); border:1px solid var(--card-line); border-radius:8px; box-shadow:var(--card-shadow); min-width:0;}
.pv-mono{width:20px; height:20px; flex-shrink:0; border-radius:6px; display:grid; place-items:center; background:var(--mono-bg); color:var(--mono-fg); font-size:9px; font-weight:700;}
.pv-txt{min-width:0; flex:1;}
.pv-txt b, .pv-txt small{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pv-txt b{font-size:10.5px;}
.pv-txt small{font-size:9px; color:var(--text-faint);}
.pv-pill{flex-shrink:0; padding:2px 7px; border-radius:99px; font-size:8.5px; font-weight:600;}
.pv-pill.info{background:var(--info-soft); color:var(--tint-info-text);}
.pv-pill.warn{background:var(--warn-soft); color:var(--warn);}
.pv-pill.ok{background:var(--success-soft); color:var(--success);}
.pv-pill.faint{background:var(--panel-2); color:var(--text-dim);}

/* email */
.pv-mail{flex:1; display:flex; flex-direction:column; min-height:0; background:var(--card-bg);}
.pv-mail-f{display:flex; gap:8px; padding:7px 14px; border-bottom:1px solid var(--border-soft); white-space:nowrap; overflow:hidden;}
.pv-mail-f span{width:34px; flex-shrink:0; color:var(--text-faint);}
.pv-mail-body{flex:1; display:flex; flex-direction:column; gap:7px; padding:12px 14px; font-size:9.5px; line-height:1.5; color:var(--text-dim); min-height:0; overflow:hidden;}
.pv-sign{display:flex; flex-direction:column; gap:1px; padding:6px 9px; margin:0 -9px; border-radius:8px; transition:background-color .4s, box-shadow .4s;}
.pv-sign b{font-size:10.5px; color:var(--text);}
.pv-mail-foot{display:flex; justify-content:flex-end; padding:8px 14px; border-top:1px solid var(--border-soft);}
.pv-send{background:var(--accent); color:var(--accent-contrast); padding:4px 12px; border-radius:6px; font-weight:600;}

/* écran de connexion */
.pv-login{flex:1; display:grid; place-items:center; background:var(--bg);}
.pv-lcard{width:64%; display:flex; flex-direction:column; gap:10px; padding:16px; background:var(--card-bg); border:1px solid var(--card-line); border-radius:12px; box-shadow:var(--card-shadow);}
.pv-ltitle{font-family:var(--font-display); font-size:15px; font-weight:700; letter-spacing:-.01em;}
.pv-lprof{display:flex; align-items:center; gap:8px; padding:7px; border:1px solid var(--border); border-radius:9px; min-width:0; transition:background-color .4s, box-shadow .4s, border-color .4s;}
.pv-lprof .pv-av{width:26px; height:26px;}
.pv-lock{margin-left:auto; width:12px; height:12px; flex-shrink:0; stroke:var(--text-faint); fill:none; stroke-width:2;}
.pv-lpw{display:flex; gap:6px;}
.pv-dots{flex:1; height:26px; display:flex; align-items:center; padding:0 9px; background:var(--panel-2); border:1px solid var(--border); border-radius:7px; font-size:12px; letter-spacing:1.5px; overflow:hidden; transition:border-color .4s, box-shadow .4s;}
.pv-dots.empty{font-size:9.5px; letter-spacing:0;}
.pv-lbtn{display:flex; align-items:center; padding:0 11px; border-radius:7px; background:var(--accent); color:var(--accent-contrast); font-weight:600;}

/* Scènes de l'inscription : une seule visible, la caméra zoome dans l'app. */
.pv-wrap{--ease:cubic-bezier(.22,1,.36,1); position:relative; width:100%; max-width:470px; aspect-ratio:16 / 11; animation:pvIn .9s var(--ease) both .1s;}
@keyframes pvIn{from{opacity:0; transform:translateY(16px) scale(.98);}to{opacity:1; transform:none;}}
.pv-scene{position:absolute; inset:0; opacity:0; transform:translateY(20px) scale(.96); transition:opacity .45s ease, transform .8s var(--ease); pointer-events:none;}
.pv-wrap[data-scene="app"] .pv-s-app,
.pv-wrap[data-scene="profile"] .pv-s-app,
.pv-wrap[data-scene="avatar"] .pv-s-app,
.pv-wrap[data-scene="mail"] .pv-s-mail,
.pv-wrap[data-scene="login"] .pv-s-login{opacity:1; transform:none; transition-delay:.12s;}
.pv-wrap[data-scene="profile"] .pv-body{transform:scale(1.7);}
.pv-wrap[data-scene="avatar"] .pv-body{transform:scale(2.3);}
.pv-wrap[data-focus="user"] .pv-user,
.pv-wrap[data-focus="user"] .pv-lprof,
.pv-wrap[data-focus="sign"] .pv-sign{background:var(--accent-soft); box-shadow:inset 0 0 0 1px var(--accent); border-color:transparent;}
.pv-wrap[data-focus="pw"] .pv-dots{border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
.onb-side-caption.swap{animation:capIn .5s var(--ease) both;}
@keyframes capIn{from{opacity:0; transform:translateY(6px);}to{opacity:1; transform:none;}}

/* ---------- colonne formulaire ---------- */
.onb-main{display:flex; flex-direction:column; min-height:100vh; padding:30px 48px 48px; min-width:0;}
.onb-top{width:100%; max-width:440px; margin:0 auto; display:flex; align-items:center; gap:18px; min-height:32px;}
.onb-steps{flex:1; display:flex; gap:6px;}
.onb-steps i{flex:1; height:3px; border-radius:3px; background:var(--panel-2); position:relative; overflow:hidden;}
.onb-steps i::after{content:''; position:absolute; inset:0; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .55s var(--ease);}
.onb-steps i.done::after{transform:none;}
.onb-card{width:100%; max-width:440px; margin:clamp(40px, 13vh, 130px) auto 0;}

.onb-stage{--dx:18px;}
.onb-stage.out{opacity:0; transform:translateX(var(--dx)); transition:opacity .17s ease-in, transform .17s ease-in;}
.onb-stage.in > *, .onb-stage.in .onb-body > *{animation:onbRise .6s var(--ease) both; animation-delay:calc(var(--i, 0) * 45ms);}
.onb-stage.in .onb-body{animation:none;}
@keyframes onbRise{from{opacity:0; transform:translateX(var(--dx));}to{opacity:1; transform:none;}}

.onb-step{font-size:var(--fs-xs); font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--text-faint); margin-bottom:12px;}
.onb-card h2, .onb-hero h1{font-family:var(--font-display); font-weight:700; letter-spacing:-.035em; line-height:1.08; text-wrap:balance;}
.onb-card h2{font-size:calc(34px * var(--fs-scale,1));}
.onb-hero h1{font-size:calc(42px * var(--fs-scale,1));}
.onb-sub{color:var(--text-dim); margin-top:12px; font-size:var(--fs-lg); line-height:1.6; max-width:42ch;}
.onb-hero p{color:var(--text-dim); margin-top:16px; font-size:calc(15px * var(--fs-scale,1)); line-height:1.6; max-width:40ch;}
.onb-body{margin-top:32px;}
.onb-features{list-style:none; padding:0; margin:36px 0 8px; display:flex; flex-direction:column; gap:20px;}
.onb-features li{display:flex; gap:14px; align-items:flex-start;}
.onb-features svg{width:18px; height:18px; flex-shrink:0; stroke:var(--accent); fill:none; stroke-width:2; margin-top:2px; stroke-linecap:round; stroke-linejoin:round;}
.onb-features b{display:block; font-size:var(--fs-md); font-weight:600;}
.onb-features span{font-size:var(--fs-sm); color:var(--text-dim); line-height:1.5;}

.onb-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.onb-grid.one{grid-template-columns:1fr;}
.onb-field{display:flex; flex-direction:column;}
.onb-label{display:block; font-size:var(--fs-sm); font-weight:500; color:var(--text-dim); margin:0 0 8px;}
.onb input:not([type=file]){
  width:100%; height:48px; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:var(--r-md);
  padding:0 15px; font-size:calc(15px * var(--fs-scale,1)); font-family:var(--font-body);
  transition:border-color .2s, box-shadow .2s, background-color .2s;
}
.onb input::placeholder{color:var(--text-faint);}
.onb input:hover{border-color:var(--border-hover, var(--text-faint));}
.onb input:focus{outline:none; border-color:var(--accent); background:var(--card-bg); box-shadow:0 0 0 3px var(--accent-soft);}
.onb-prefix{display:flex; align-items:center; height:48px; background:var(--panel-2); border:1px solid var(--border); border-radius:var(--r-md); transition:border-color .2s, box-shadow .2s, background-color .2s;}
.onb-prefix:focus-within{border-color:var(--accent); background:var(--card-bg); box-shadow:0 0 0 3px var(--accent-soft);}
.onb-prefix span{padding-left:15px; color:var(--text-faint); font-weight:600; font-size:calc(15px * var(--fs-scale,1));}
.onb .onb-prefix input{height:100%; border:none; background:none; box-shadow:none !important; padding-left:3px;}
.onb-status{font-size:var(--fs-sm); margin-top:10px; min-height:20px;}
.onb-status .ok{color:var(--success); display:inline-flex; align-items:center; gap:5px; animation:pvPop .3s var(--ease);}
.onb-status .ok svg{width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.6;}
.onb-status .bad{color:var(--tint-danger-text);}
.onb-pw{position:relative;}
.onb-pw + .onb-label, .onb-status + .onb-label{margin-top:20px;}
.onb .onb-pw input{padding-right:46px;}
.onb-eye{position:absolute; right:7px; top:50%; transform:translateY(-50%); width:34px; height:34px; border:none; background:none; color:var(--text-faint); border-radius:var(--r-sm); display:grid; place-items:center; cursor:pointer; transition:color .15s;}
.onb-eye:hover{color:var(--text);}
.onb-eye svg{width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:1.8;}
.onb-meter{height:3px; border-radius:3px; background:var(--panel-2); margin-top:12px; overflow:hidden;}
.onb-meter i{display:block; height:100%; width:0; border-radius:3px; background:var(--danger); transition:width .4s var(--ease), background-color .3s;}
.onb-meter i[data-level="2"]{background:var(--warn);}
.onb-meter i[data-level="3"], .onb-meter i[data-level="4"]{background:var(--success);}
.onb-note{font-size:var(--fs-xs); color:var(--text-faint); margin-top:18px; line-height:1.55;}

.onb-photo{display:flex; align-items:center; gap:24px; padding:20px; border-radius:var(--r-lg); border:1.5px dashed var(--border); transition:border-color .2s, background-color .2s;}
.onb-photo.drag{border-color:var(--accent); background:var(--accent-soft);}
.onb-avatar{width:96px; height:96px; border-radius:50%; flex-shrink:0; display:grid; place-items:center; background:var(--mono-bg); color:var(--mono-fg); font-size:32px; font-weight:700; overflow:hidden;}
.onb-avatar img{width:100%; height:100%; object-fit:cover; animation:pvPop .45s var(--ease);}
.onb-avatar svg{width:32px; height:32px; stroke:currentColor; fill:none; stroke-width:1.6;}
.onb-avatar.sm{width:52px; height:52px; font-size:var(--fs-h3);}
.onb-photo-actions{display:flex; flex-direction:column; align-items:flex-start; gap:10px;}
.onb-photo-actions .btn svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9;}
.onb-hint{font-size:var(--fs-sm); color:var(--text-faint);}

.onb-themes{display:flex; flex-direction:column; gap:8px;}
.onb-theme{display:flex; align-items:center; gap:14px; width:100%; padding:13px 15px; border-radius:var(--r-md); border:1px solid var(--border); background:transparent; color:var(--text); text-align:left; cursor:pointer; font-family:var(--font-body); transition:border-color .25s, background-color .25s, transform .15s;}
.onb-theme:hover{border-color:var(--text-faint);}
.onb-theme:active{transform:scale(.99);}
.onb-theme.active{border-color:var(--accent); background:var(--accent-soft);}
.onb-theme .theme-dot{width:26px; height:26px;}
.onb-theme .theme-dot::after{inset:8px;}
.onb-theme b{display:block; font-size:var(--fs-md); font-weight:600;}
.onb-theme small{font-size:var(--fs-sm); color:var(--text-dim);}
.onb-check{margin-left:auto; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:var(--accent); color:var(--accent-contrast); opacity:0; transform:scale(.5); transition:opacity .25s, transform .35s var(--ease);}
.onb-check svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:3;}
.onb-theme.active .onb-check{opacity:1; transform:none;}

.onb-recap{display:flex; align-items:center; gap:16px; padding-bottom:20px; border-bottom:1px solid var(--border-soft);}
.onb-recap b{display:block; font-size:var(--fs-h3);}
.onb-recap span{color:var(--text-dim); font-size:var(--fs-md);}
.onb-list{margin:4px 0 0;}
.onb-list div{display:grid; grid-template-columns:120px 1fr auto; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid var(--border-soft);}
.onb-list dt{font-size:var(--fs-sm); color:var(--text-faint);}
.onb-list dd{margin:0; font-size:var(--fs-md); overflow:hidden; text-overflow:ellipsis;}
.onb-edit{background:none; border:none; color:var(--link-color); font-size:var(--fs-sm); cursor:pointer; padding:4px; font-family:var(--font-body);}
.onb-edit:hover{text-decoration:underline;}

.onb-error{color:var(--tint-danger-text); font-size:var(--fs-sm); min-height:20px; margin-top:16px;}
.onb-actions{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:12px; flex-wrap:wrap;}
.onb-actions-right{display:flex; gap:8px; margin-left:auto; flex-wrap:wrap; justify-content:flex-end;}
.onb-actions .btn{height:44px; padding:0 18px; font-size:var(--fs-md); border-radius:var(--r-md); transition:background-color .2s, color .2s, border-color .2s, transform .12s;}
.onb-actions .btn:active{transform:scale(.98);}
.onb-actions .btn-ghost{padding:0 12px;}
.onb-actions .btn svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; transition:transform .25s var(--ease);}
.onb-actions .btn-primary{padding:0 20px; font-weight:600;}
.onb-actions .btn-primary:hover svg{transform:translateX(3px);}
.onb-actions .btn-ghost:hover svg{transform:translateX(-3px);}
.onb-card.shake{animation:shake .35s ease;}

/* ---------- fin ---------- */
.onb-done{display:flex; flex-direction:column; align-items:flex-start;}
.onb-done .logo{width:96px; height:auto; margin-bottom:30px; color:var(--accent);}
.onb-done h2, .onb-done p{animation:onbRise .6s var(--ease) both .35s; --dx:0px;}
.onb-done p{animation-delay:.45s;}
@keyframes onbDraw{to{stroke-dashoffset:0;}}

::view-transition-old(root), ::view-transition-new(root){animation-duration:.45s; animation-timing-function:ease;}

@media (min-width:1300px){ .pv-wrap{zoom:1.15;} }
@media (max-width:960px){
  .onb{grid-template-columns:1fr;}
  .onb-side{display:none;}
  .onb-brand-m{display:flex;}
  .onb-main{padding:20px 20px 36px;}
  .onb-top{max-width:none; flex-wrap:wrap; row-gap:16px;}
  .onb-top .onb-steps{order:3; flex-basis:100%;}
  .onb-top .btn{margin-left:auto;}
  .onb-card{max-width:520px; margin-top:clamp(28px, 6vh, 56px);}
}
@media (max-width:600px){
  .onb-card h2{font-size:calc(28px * var(--fs-scale,1));}
  .onb-hero h1{font-size:calc(32px * var(--fs-scale,1));}
  .onb-grid{grid-template-columns:1fr;}
  .onb-photo{flex-direction:column; text-align:center;}
  .onb-photo-actions{align-items:center;}
  .onb-list div{grid-template-columns:1fr auto;}
  .onb-list dt{grid-column:1 / -1;}
}
@media (prefers-reduced-motion: reduce){
  .onb *, .onb-stage{animation:none !important; transition:none !important;}
}

/* ---------- tutoriel ---------- */
.tour{position:fixed; inset:0; z-index:200; animation:tourFade .35s ease both;}
@keyframes tourFade{from{opacity:0;}to{opacity:1;}}
.tour-hole{
  position:fixed; border-radius:var(--r-md); pointer-events:none;
  box-shadow:0 0 0 2px var(--accent), 0 0 0 9999px rgba(6,8,12,.62);
  transition:top .5s cubic-bezier(.22,1,.36,1), left .5s cubic-bezier(.22,1,.36,1), width .5s cubic-bezier(.22,1,.36,1), height .5s cubic-bezier(.22,1,.36,1);
}
.tour-hole.none{box-shadow:0 0 0 9999px rgba(6,8,12,.62);}
.tour-tip{
  position:fixed; width:min(340px, calc(100vw - 24px)); background:var(--panel); color:var(--text);
  border:1px solid var(--border); border-radius:var(--r-lg); padding:20px 20px 16px; box-shadow:0 20px 50px -20px rgba(0,0,0,.6);
  transition:top .5s cubic-bezier(.22,1,.36,1), left .5s cubic-bezier(.22,1,.36,1);
}
.tour-tip.center{top:50% !important; left:50% !important; transform:translate(-50%,-50%); width:min(400px, calc(100vw - 24px));}
.tour-tip.in > *{animation:tourIn .45s cubic-bezier(.22,1,.36,1) both;}
.tour-tip.in > :nth-child(2){animation-delay:.03s;}
.tour-tip.in > :nth-child(3){animation-delay:.06s;}
@keyframes tourIn{from{opacity:0; transform:translateY(6px);}to{opacity:1; transform:none;}}
.tour-count{font-size:var(--fs-xs); font-weight:600; color:var(--accent); letter-spacing:.04em;}
.tour-tip h3{font-size:var(--fs-h3); margin-top:6px;}
.tour-text{font-size:var(--fs-md); color:var(--text-dim); margin-top:6px; line-height:1.55;}
.tour-dots{display:flex; gap:5px; margin-top:16px;}
.tour-dots i{width:6px; height:6px; border-radius:50%; background:var(--border); transition:width .25s, background-color .25s;}
.tour-dots i.on{background:var(--accent); width:16px; border-radius:4px;}
.tour-actions{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:16px; flex-wrap:wrap;}
.tour-actions-right{display:flex; gap:8px; margin-left:auto;}

/* =====================================================================
   Page d'accueil (landing) — suit le thème choisi dans la barre du haut
   ===================================================================== */
body.landing-mode{display:block; background:var(--land-base, var(--bg));}
.land{
  --ease:cubic-bezier(.22,1,.36,1); --sp:0;
  /* Fond de page : entre le fond de l'application et le blanc des cartes,
     pour ne plus être un aplat blanc. */
  --land-base:color-mix(in srgb, var(--bg) 70%, var(--card-bg));
  position:relative; min-height:100vh; background:var(--land-base); color:var(--text); font-family:var(--font-body);
}
.land > main, .land > footer{position:relative; z-index:1;}
.land-ambient{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;}
.land-ambient i{position:absolute; border-radius:50%; filter:blur(90px); will-change:transform;}
.land-ambient .a1{width:62vw; height:62vw; left:-18vw; top:-10vh; background:color-mix(in srgb, var(--accent) 16%, transparent);
  transform:translate(calc(var(--sp) * 46vw), calc(var(--sp) * 38vh)) scale(calc(1 - var(--sp) * .25)); opacity:calc(1 - var(--sp) * .45);}
.land-ambient .a2{width:54vw; height:54vw; right:-16vw; top:30vh; background:color-mix(in srgb, var(--info) 13%, transparent);
  transform:translate(calc(var(--sp) * -40vw), calc(var(--sp) * -22vh)) scale(calc(.9 + var(--sp) * .3));}
.land-ambient .a3{width:58vw; height:58vw; left:20vw; bottom:-40vw; background:color-mix(in srgb, var(--success) 12%, transparent);
  transform:translateY(calc(var(--sp) * -55vh)); opacity:calc(.25 + var(--sp) * .75);}
.land-wrap{max-width:1120px; margin:0 auto; padding:0 32px;}

/* Bandeau légèrement teinté (entre le fond de page et le fond de l'app) et
   souligné d'un filet : discernable sans attirer l'œil, dans chaque thème. */
.land-nav{
  --nav-tint:color-mix(in srgb, var(--bg) 60%, var(--card-bg));
  position:sticky; top:0; z-index:20; background:var(--nav-tint); border-bottom:1px solid var(--border-soft);
  transition:background-color .3s, box-shadow .3s;
}
.land-nav.scrolled{
  background:color-mix(in srgb, var(--nav-tint) 86%, transparent);
  -webkit-backdrop-filter:saturate(1.4) blur(12px); backdrop-filter:saturate(1.4) blur(12px);
  box-shadow:0 6px 20px -16px rgba(10,14,30,.35);
}
.land-nav-in{height:68px; display:flex; align-items:center; gap:32px;}
.land-nav .land-wrap{max-width:1240px;}
.land-brand{display:flex; align-items:center; gap:10px; font-family:var(--font-display); font-weight:700; font-size:16px; letter-spacing:-.01em; color:var(--text); text-decoration:none;}
.land-brand .brand-mark{height:22px;}
.land-links{display:flex; gap:26px; white-space:nowrap;}
.land-links a{color:var(--text-dim); text-decoration:none; font-size:var(--fs-md); font-weight:500; transition:color .15s;}
.land-links a:hover{color:var(--text);}
.land-actions{margin-left:auto; display:flex; align-items:center; gap:10px;}
.land-themes{display:flex; gap:8px; margin-right:8px;}
.land-theme{position:relative; width:18px; height:18px; padding:0; border:none; border-radius:50%; cursor:pointer; background:var(--c-bg); box-shadow:inset 0 0 0 1px rgba(128,128,128,.4); transition:transform .25s var(--ease), box-shadow .25s;}
.land-theme::after{content:''; position:absolute; inset:5px; border-radius:50%; background:var(--c-ac);}
.land-theme:hover{transform:scale(1.15);}
.land-theme.active{box-shadow:inset 0 0 0 1px rgba(128,128,128,.4), 0 0 0 2px var(--card-bg), 0 0 0 3.5px var(--text-faint);}
/* sélecteur de langue FR / EN : deux pastilles de texte, l'active surlignée */
.land-lang{display:flex; padding:2px; margin-right:6px; border:1px solid var(--border); border-radius:99px;}
.land-lang button{height:26px; min-width:32px; padding:0 8px; border:none; border-radius:99px; background:none; color:var(--text-faint); font-family:var(--font-body); font-size:12px; font-weight:600; letter-spacing:.03em; cursor:pointer; transition:background-color .25s, color .25s;}
.land-lang button:hover{color:var(--text);}
.land-lang button.active{background:var(--panel-2); color:var(--text);}
.land-lang button:focus-visible{outline:2px solid var(--accent); outline-offset:1px;}
.land-h1.static .ln > span{animation:none; transform:none;}

.land .btn{height:38px; padding:0 16px; border-radius:var(--r-md); font-size:var(--fs-md); font-weight:600; display:inline-flex; align-items:center; gap:8px; transition:background-color .2s, border-color .2s, color .2s, transform .12s;}
.land .btn:active{transform:scale(.98);}
.land .btn svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; transition:transform .25s var(--ease);}
.land .btn-primary:hover svg{transform:translateX(3px);}
.land .btn-lg{height:48px; padding:0 22px; font-size:var(--fs-lg);}
.land-login, .land-ghost{background:transparent; border:1px solid var(--border); color:var(--text);}
.land-login:hover, .land-ghost:hover{background:var(--panel-2); border-color:var(--border-hover);}

/* hero */
.land-hero{position:relative; padding:104px 0 0; text-align:center; overflow:hidden;}
/* Lueur douce à la couleur du thème, fixe, en haut de l'accroche. */
.land-glow{
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(1100px 560px at 50% -14%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 70%);
  -webkit-mask-image:linear-gradient(#000 60%, transparent); mask-image:linear-gradient(#000 60%, transparent);
}
/* Fond de l'accroche : un quadrillage fin estompé et deux nappes de couleur
   floues qui dérivent lentement (accent + bleu « info »). */
.land-blob{position:absolute; border-radius:50%; filter:blur(70px); pointer-events:none; opacity:.55;}
.land-blob.b1{width:520px; height:380px; left:4%; top:120px; background:color-mix(in srgb, var(--accent) 38%, transparent); animation:blobA 22s ease-in-out infinite alternate;}
.land-blob.b2{width:560px; height:400px; right:2%; top:40px; background:color-mix(in srgb, var(--info) 30%, transparent); animation:blobB 26s ease-in-out infinite alternate;}
@keyframes blobA{to{transform:translate(120px, 60px) scale(1.15);}}
@keyframes blobB{to{transform:translate(-140px, 90px) scale(.9);}}

/* Démo animée dans l'aperçu : curseur, nouvelle ligne, message de confirmation. */
.pv-hero{position:relative;}
.pv-head{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:6px;}
.pv-head .pv-title{margin-bottom:0;}
.pv-new{flex-shrink:0; padding:4px 9px; border-radius:6px; background:var(--accent); color:var(--accent-contrast); font-size:9px; font-weight:600; transition:transform .15s, filter .15s;}
.pv-new.pressed, .pv-pill.pressed{transform:scale(.92); filter:brightness(.92);}
.pv-main{overflow:hidden;}
.pv-row-new{display:grid; grid-template-columns:20px 1fr auto; max-height:0; padding-top:0; padding-bottom:0; margin-bottom:-6px; opacity:0; border-color:transparent; transition:max-height .5s var(--ease), padding .5s var(--ease), margin .5s var(--ease), opacity .4s .1s, border-color .3s;}
.pv-row-new.in{max-height:60px; padding-top:8px; padding-bottom:8px; margin-bottom:0; opacity:1; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
.pv-row-new.in .pv-pill.changed ~ *, .pv-row-new.in:has(.changed){border-color:var(--card-line); box-shadow:var(--card-shadow);}
.pv-row-new.out{max-height:0; padding-top:0; padding-bottom:0; margin-bottom:-6px; opacity:0;}
.pv-cursor{position:absolute; left:0; top:0; z-index:5; width:18px; height:18px; margin:-2px 0 0 -3px; pointer-events:none; opacity:0; transition-property:transform, opacity; transition-timing-function:cubic-bezier(.45,.05,.25,1); transition-duration:0ms;}
.pv-cursor.show{opacity:1;}
.pv-cursor svg{width:18px; height:18px; fill:var(--text); stroke:var(--card-bg); stroke-width:1.5; stroke-linejoin:round; filter:drop-shadow(0 2px 3px rgba(0,0,0,.25)); transition:transform .15s;}
.pv-cursor.down svg{transform:scale(.82);}
.pv-cursor::after{content:''; position:absolute; left:2px; top:2px; width:22px; height:22px; margin:-11px 0 0 -11px; border-radius:50%; border:1.5px solid var(--accent); opacity:0; transform:scale(.3);}
.pv-cursor.down::after{animation:clickRing .5s ease-out;}
@keyframes clickRing{0%{opacity:.9; transform:scale(.3);}100%{opacity:0; transform:scale(1.4);}}
.pv-toast{
  position:absolute; right:14px; top:62px; z-index:4; display:flex; align-items:center; gap:7px; padding:8px 12px;
  background:var(--text); color:var(--bg); border-radius:9px; font-size:9.5px; font-weight:600;
  box-shadow:0 10px 24px -10px rgba(0,0,0,.45); opacity:0; transform:translateY(-10px);
  transition:opacity .35s, transform .5s var(--ease);
}
.pv-toast.show{opacity:1; transform:none;}
.pv-toast svg{width:12px; height:12px; flex-shrink:0; fill:none; stroke:var(--success); stroke-width:3; stroke-linecap:round; stroke-linejoin:round;}
.land-hero .land-wrap{position:relative;}
.land-hero h1{margin:0; font-family:var(--font-display); font-size:clamp(38px, 6.2vw, 72px); font-weight:700; line-height:1.03; letter-spacing:-.045em; text-wrap:balance;}
.land-lead{max-width:56ch; margin:22px auto 0; color:var(--text-dim); font-size:clamp(16px, 1.5vw, 18px); line-height:1.6;}
.land-cta{display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:34px;}
.land-shot{display:flex; justify-content:center; margin-top:64px; -webkit-mask-image:linear-gradient(#000 62%, transparent 98%); mask-image:linear-gradient(#000 62%, transparent 98%);}
@keyframes pvRowIn{from{opacity:0; transform:translateY(10px);}to{opacity:1; transform:none;}}

/* sections */
.land-section{padding:112px 0;}
/* Sections alternées : le fond se fond progressivement au lieu d'une coupure nette. */
/* Sections alternées : un voile clair aux bords fondus, qui laisse voir le fond d'ambiance. */
.land-alt{background:linear-gradient(to bottom, transparent, color-mix(in srgb, var(--card-bg) 55%, transparent) 160px, color-mix(in srgb, var(--card-bg) 55%, transparent) calc(100% - 160px), transparent);}
.land-kicker{color:var(--tint-accent-text); font-size:var(--fs-sm); font-weight:600; letter-spacing:.02em;}
.land h2{margin-top:10px; max-width:20ch; font-family:var(--font-display); font-size:clamp(30px, 3.8vw, 44px); font-weight:700; line-height:1.1; letter-spacing:-.035em; text-wrap:balance;}
.land h3{font-size:17px; font-weight:600; letter-spacing:-.01em;}
.land-ic{width:36px; height:36px; border-radius:10px; display:grid; place-items:center; background:var(--accent-soft); color:var(--tint-accent-text);}
.land-ic svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;}
.land-split{display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:center;}
.land-visual{display:flex; justify-content:center; min-width:0;}
.land-checks{list-style:none; margin:36px 0 0; padding:0; display:flex; flex-direction:column; gap:18px;}
.land-checks li{display:flex; gap:12px; align-items:flex-start; color:var(--text-dim); font-size:var(--fs-lg); line-height:1.55;}
.land-checks svg{width:18px; height:18px; flex-shrink:0; margin-top:2px; stroke:var(--success); fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round;}
.land-final{position:relative; padding:120px 0; text-align:center; overflow:hidden;}
.land-final::before{content:''; position:absolute; left:50%; bottom:-260px; width:900px; height:520px; transform:translateX(-50%); border-radius:50%; pointer-events:none; background:radial-gradient(closest-side, color-mix(in srgb, var(--accent) 16%, transparent), transparent);}
.land-final .land-wrap{position:relative;}
.land-final-mark{width:84px; margin:0 auto 26px; color:var(--accent);}
.land-final-mark .logo{height:auto;}
.land-final-mark .logo.draw .logo-line{animation-duration:1.3s; animation-delay:.25s;}
.land-final-mark .logo.draw .logo-dot{animation-delay:calc(.2s + var(--t) * 1.3s);}
.land-text{margin-top:22px; max-width:48ch; color:var(--text-dim); font-size:var(--fs-lg); line-height:1.7;}
.land-team{display:flex; justify-content:center; gap:56px;}
.land-member{margin:0; display:flex; flex-direction:column; align-items:center; text-align:center;}
/* Photo : petit rebond au survol, anneau à la couleur du thème qui se dessine. */
.land-photo{position:relative; display:block; border-radius:50%;}
.land-photo::after{content:''; position:absolute; inset:-7px; border-radius:50%; border:1.5px solid var(--accent); opacity:0; transform:scale(.94); transition:opacity .35s, transform .5s var(--ease);}
.land-member img{width:160px; height:160px; border-radius:50%; object-fit:cover; display:block; box-shadow:0 0 0 1px var(--border), 0 18px 40px -22px rgba(10,14,30,.45);}
.land-member:hover .land-photo::after{opacity:1; transform:none;}
.land-member figcaption{margin-top:20px;}
.land-member b{display:block; font-family:var(--font-display); font-size:17px; font-weight:600; letter-spacing:-.01em;}
.land-member em{display:block; margin-top:4px; font-style:normal; font-size:var(--fs-md); color:var(--tint-accent-text);}
.land-member span{display:block; margin-top:2px; color:var(--text-faint); font-size:var(--fs-sm); line-height:1.5;}
.land-final h2{max-width:none; margin:0;}
.land-foot .land-brand{font-size:14px;}
.land-foot .land-brand .brand-mark{height:17px;}

/* apparition au défilement */
.land .rv{opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .9s var(--ease); transition-delay:calc(var(--d, 0) * 90ms);}
.land .rv.on{opacity:1; transform:none;}

@media (max-width:1240px){ .land-links{display:none;} }
@media (max-width:960px){
  .land-split{grid-template-columns:1fr; gap:48px;}
  .land-split-rev .land-visual{order:2;}
}
@media (max-width:640px){
  .land-wrap{padding:0 20px;}
  .land .land-nav-cta, .land-themes{display:none;}
  .land-cta .btn{flex:1 1 100%; justify-content:center;}
  .land-hero{padding-top:56px;}
  .land-section{padding:80px 0;}
  .land-final{padding:88px 0;}
  .land-team{gap:28px;}
  .land-member img{width:120px; height:120px;}
}
@media (prefers-reduced-motion: reduce){
  .land-member:hover img{animation:none;}
  .land-blob{animation:none;}
  .land .rv{opacity:1; transform:none; transition:none;}
  .land-shot.on .pv-row{animation:none;}
  .pv-scene, .pv-body{transition:none;}
}

/* ---------- accueil : titre, aperçu animé, vitrine, étapes, pied de page ---------- */
.land-h1 .ln{display:block; overflow:hidden; padding:0 .04em .12em; margin-bottom:-.12em;}
.land-h1 .ln > span{display:inline-block; transform:translateY(110%); animation:lnUp 1.1s var(--ease) forwards .05s;}
.land-h1 .ln:nth-child(2) > span{animation-delay:.17s;}
@keyframes lnUp{to{transform:none;}}

.land-shot.on .land-shot.on @keyframes floatIn{to{opacity:1; transform:none;}}
.pv-pill.changed{animation:pillPop .55s var(--ease);}
@keyframes pillPop{0%{transform:scale(.6); opacity:0;}100%{transform:none; opacity:1;}}

.land-links a{position:relative;}
.land-links a::after{content:''; position:absolute; left:0; right:0; bottom:-7px; height:2px; border-radius:2px; background:var(--accent); transform:scaleX(0); transition:transform .35s var(--ease);}
.land-links a.on{color:var(--text);}
.land-links a.on::after{transform:none;}

/* vitrine des fonctionnalités */
.land-show{display:grid; grid-template-columns:minmax(300px, 400px) 1fr; gap:64px; align-items:center; margin-top:56px;}
.land-tabs{display:flex; flex-direction:column;}
.land-tab{position:relative; display:block; width:100%; padding:16px 0 16px 24px; background:none; border:none; border-radius:0; text-align:left; color:var(--text); font-family:var(--font-body); cursor:pointer;}
.land-tab:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:8px;}
.land-tab-bar{position:absolute; left:0; top:12px; bottom:12px; width:2px; border-radius:2px; background:var(--border); overflow:hidden;}
.land-tab-bar i{position:absolute; inset:0; background:var(--accent); transform:scaleY(0); transform-origin:top; transition:transform .35s var(--ease);}
.land-tab.active .land-tab-bar i{transform:none;}
.land-tab.active.run .land-tab-bar i{transform:scaleY(0); transition:none; animation:tabRun 6s linear forwards;}
.land-tab.run.paused .land-tab-bar i{animation-play-state:paused;}
@keyframes tabRun{to{transform:none;}}
.land-tab-head{display:flex; align-items:center; gap:14px; transition:margin .45s var(--ease);}
.land-tab-head b{font-size:17px; font-weight:600; letter-spacing:-.01em; color:var(--text-dim); transition:color .3s;}
.land-tab:hover .land-tab-head b, .land-tab.active .land-tab-head b{color:var(--text);}
.land-tab .land-ic{width:34px; height:34px; background:var(--panel-2); color:var(--text-faint); transition:background-color .3s, color .3s;}
.land-tab.active .land-ic{background:var(--accent-soft); color:var(--tint-accent-text);}
.land-tab.active .land-tab-head{margin-bottom:10px;}
.land-tab-body{display:grid; grid-template-rows:0fr; transition:grid-template-rows .5s var(--ease);}
.land-tab-body > span{overflow:hidden; padding-left:48px; color:var(--text-dim); font-size:var(--fs-lg); line-height:1.6; opacity:0; transition:opacity .35s;}
.land-tab.active .land-tab-body{grid-template-rows:1fr;}
.land-tab.active .land-tab-body > span{opacity:1; transition-delay:.1s;}
.land-stage{display:flex; justify-content:center; min-width:0;}
.land-scene{position:absolute; inset:0; opacity:0; transform:translateY(14px) scale(.98); transition:opacity .45s ease, transform .7s var(--ease); pointer-events:none;}
.land-scene.on{opacity:1; transform:none; transition-delay:.08s;}
.land-scene.on .pv-row{animation:pvRowIn .6s var(--ease) both; animation-delay:calc(.15s + var(--r, 0) * 70ms);}

/* étapes en colonnes, reliées par un fil */
.land-steps{position:relative; list-style:none; margin:56px 0 0; padding:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:40px;}
.land-steps::before{content:''; position:absolute; top:20px; left:20px; right:calc((100% - 80px) / 3 - 20px); height:1px; background:var(--border);}
.land-num{position:relative; width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--bg); border:1px solid var(--border); font-family:var(--font-display); font-size:15px; font-weight:700; color:var(--tint-accent-text);}
.land-steps h3{margin-top:22px;}
.land-steps p{margin-top:8px; max-width:32ch; color:var(--text-dim); font-size:var(--fs-lg); line-height:1.6;}

/* pied de page */
.land-foot{padding:56px 0 28px; border-top:1px solid var(--border-soft); color:var(--text-faint); font-size:var(--fs-sm);}
.land-foot-in{display:flex; justify-content:space-between; align-items:flex-start; gap:40px;}
.land-foot-brand p{margin-top:12px; max-width:36ch; line-height:1.6;}
.land-foot-links{display:flex; flex-wrap:wrap; gap:12px 26px; padding-top:4px;}
.land-foot-links a{color:var(--text-dim); text-decoration:none; transition:color .15s;}
.land-foot-links a:hover{color:var(--text);}
.land-foot-legal{margin-top:44px;}
.land-foot-legal p{padding-top:20px; border-top:1px solid var(--border-soft);}

/* mini-écrans supplémentaires (preview.js) */
.pv-list{flex:1; display:flex; flex-direction:column; gap:6px; padding:14px; min-height:0; background:var(--bg);}
.pv-dot{width:8px; height:8px; margin:0 4px; flex-shrink:0; border-radius:50%;}
.pv-dot.info{background:var(--info);} .pv-dot.warn{background:var(--warn);} .pv-dot.danger{background:var(--danger);} .pv-dot.ok{background:var(--success);}
.pv-act{flex-shrink:0; padding:3px 9px; border:1px solid var(--border); border-radius:6px; font-size:9px; font-weight:600;}
.pv-list .pv-row:nth-child(2) .pv-act{background:var(--accent); border-color:transparent; color:var(--accent-contrast);}
.pv-file{width:22px; height:27px; flex-shrink:0; border-radius:4px; display:grid; place-items:center; background:var(--danger-soft); color:var(--tint-danger-text); font-size:7px; font-weight:700;}
.pv-ics{display:flex; gap:4px; flex-shrink:0;}
.pv-ics i{width:20px; height:20px; border-radius:6px; display:grid; place-items:center; background:var(--panel-2); color:var(--text-dim);}
.pv-ics svg{width:10px; height:10px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.pv-cal{flex:1; display:flex; flex-direction:column; min-height:0; padding:10px 12px 12px; background:var(--card-bg);}
.pv-cal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;}
.pv-cal-head b{font-family:var(--font-display); font-size:13px;}
.pv-seg{display:flex; padding:2px; border-radius:6px; background:var(--panel-2);}
.pv-seg span{padding:2px 7px; border-radius:4px; font-size:8.5px; color:var(--text-dim);}
.pv-seg span:first-child{background:var(--card-bg); color:var(--text); font-weight:600; box-shadow:var(--card-shadow);}
.pv-cal-dow{display:grid; grid-template-columns:repeat(7, 1fr); padding:0 3px 4px; font-size:8px; color:var(--text-faint);}
.pv-cal-grid{flex:1; display:grid; grid-template-columns:repeat(7, 1fr); grid-template-rows:repeat(5, 1fr); min-height:0; border-top:1px solid var(--border-soft); border-left:1px solid var(--border-soft);}
.pv-day{display:flex; flex-direction:column; gap:2px; min-width:0; overflow:hidden; padding:3px; border-right:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft);}
.pv-day i{font-style:normal; font-size:8px; color:var(--text-dim);}
.pv-day.out i{color:var(--text-faint); opacity:.6;}
.pv-day.today i{width:14px; height:14px; display:grid; place-items:center; border-radius:99px; background:var(--accent); color:var(--accent-contrast); font-weight:700;}
.pv-day em{padding:1px 3px; border-radius:3px; font-size:7px; line-height:1.25; font-style:normal; font-weight:600; overflow:hidden;}
.pv-day em.info{background:var(--info-soft); color:var(--tint-info-text);}
.pv-day em.warn{background:var(--warn-soft); color:var(--warn);}
.pv-day em.danger{background:var(--danger-soft); color:var(--tint-danger-text);}

@media (max-width:1400px){
    }
@media (max-width:960px){
  .land-show{grid-template-columns:1fr; gap:36px;}
  .land-stage{order:-1;}
  .land-steps{grid-template-columns:1fr; gap:28px;}
  .land-steps::before{display:none;}
  .land-steps li{position:relative;}
  .land-steps li:not(:last-child)::after{content:''; position:absolute; left:20px; top:40px; bottom:-28px; width:1px; background:var(--border);}
  .land-steps li{display:grid; grid-template-columns:40px 1fr; column-gap:18px;}
  .land-steps li .land-num{grid-row:span 2;}
  .land-steps h3{margin-top:9px;}
}
@media (max-width:760px){
    .land-foot-in{flex-direction:column; gap:24px;}
}
@media (prefers-reduced-motion: reduce){
  .land-h1 .ln > span{animation:none; transform:none;}
    .land-scene, .land-tab-body, .land-tab-head{transition:none;}
  .land-scene.on .pv-row{animation:none;}
}

/* écran de connexion : retour à l'accueil, profil vide */
.login{position:relative;}
.login-home{position:absolute; top:20px; left:20px; display:inline-flex; align-items:center; gap:6px;}
.login-home svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2;}
.login-create{width:100%; margin-top:8px; height:42px; justify-content:center;}

/* =====================================================================
   v3 : vue d'ensemble vivante, préparation d'entretien, écrans vides
   illustrés, sélecteur de langue, passe mobile
   ===================================================================== */

/* ---------- vue d'ensemble : salutation + prochaine action ---------- */
.ov-hero{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); gap:22px; align-items:stretch; margin-bottom:22px;}
.ov-greet{display:flex; flex-direction:column; justify-content:center; padding:4px 0;}
.ov-greet h2{font-family:var(--font-display); font-size:calc(26px * var(--fs-scale,1)); font-weight:700; letter-spacing:-.02em; line-height:1.15;}
.ov-greet p{margin-top:8px; color:var(--text-dim); font-size:var(--fs-lg); line-height:1.55; max-width:44ch;}
.next-action{
  display:flex; align-items:center; gap:18px; padding:20px 22px; border-radius:var(--r-md);
  background:linear-gradient(135deg, color-mix(in srgb, var(--tone) 12%, var(--card-bg)), var(--card-bg) 70%);
  border:1px solid color-mix(in srgb, var(--tone) 35%, var(--card-line)); box-shadow:var(--card-shadow);
  animation:rowIn .45s ease-out both;
}
.next-ic{width:44px; height:44px; flex-shrink:0; border-radius:12px; display:grid; place-items:center; background:color-mix(in srgb, var(--tone) 16%, transparent); color:var(--tone);}
.next-ic svg{width:21px; height:21px; stroke:currentColor;}
.next-main{flex:1; min-width:0;}
.next-kicker{display:flex; align-items:center; gap:8px; font-size:var(--fs-xs); font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint);}
.next-more{text-transform:none; letter-spacing:0; font-weight:500; padding:1px 7px; border-radius:20px; background:var(--panel-2); color:var(--text-dim);}
.next-title{margin-top:5px; font-family:var(--font-display); font-size:var(--fs-h3); font-weight:600; line-height:1.3;}
.next-sub{margin-top:3px; font-size:var(--fs-md); color:var(--text-dim); line-height:1.5;}
.next-btn{flex-shrink:0;}
.next-btn svg{transition:transform .2s;}
.next-btn:hover svg{transform:translateX(2px);}

/* ---------- parcours envoyées → réponses → entretiens → offres ---------- */
.ov-funnel{display:flex; align-items:stretch; gap:10px; margin-bottom:22px; padding:20px 22px; background:var(--card-bg); border:1px solid var(--card-line); border-radius:var(--r-md); box-shadow:var(--card-shadow);}
.fn-step{flex:1; min-width:0;}
.fn-num{font-family:var(--font-display); font-size:var(--fs-stat); font-weight:700; line-height:1;}
.fn-lbl{margin-top:6px; font-size:var(--fs-sm); color:var(--text-dim);}
.fn-bar{margin-top:12px; height:6px; border-radius:4px; background:var(--panel-2); overflow:hidden;}
.fn-bar i{display:block; height:100%; width:var(--w); border-radius:4px; background:var(--c); transform-origin:left; animation:fnGrow .8s cubic-bezier(.22,1,.36,1) both .15s;}
@keyframes fnGrow{from{transform:scaleX(0);}to{transform:none;}}
.fn-arrow{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color:var(--text-faint); padding:0 4px;}
.fn-arrow svg{width:16px; height:16px; stroke:currentColor;}
.fn-arrow small{font-size:var(--fs-2xs); font-weight:600; color:var(--text-dim); white-space:nowrap;}
.week-goal{display:flex; align-items:baseline; gap:6px; margin-bottom:4px;}
.week-goal b{font-family:var(--font-display); font-size:var(--fs-stat); line-height:1;}
.week-goal span{color:var(--text-faint); font-size:var(--fs-lg);}

/* ---------- écrans vides illustrés ---------- */
.empty-illus{
  --illus-line:color-mix(in srgb, var(--text) 22%, var(--card-bg)); --illus-fill:color-mix(in srgb, var(--text) 10%, var(--card-bg));
  display:flex; flex-direction:column; align-items:center; text-align:center; padding:44px 20px 48px;
  border:1px dashed var(--border); border-radius:var(--r-md); animation:rowIn .4s ease-out both;
}
.empty-illus .illus{width:184px; height:auto; margin-bottom:18px; overflow:visible;}
.empty-illus h3{font-family:var(--font-display); font-size:var(--fs-h3); font-weight:600;}
.empty-illus p{margin-top:8px; max-width:46ch; color:var(--text-dim); font-size:var(--fs-md); line-height:1.6;}
.empty-illus-actions{margin-top:20px; display:flex; gap:10px; flex-wrap:wrap; justify-content:center;}
.empty-illus + .doc-drop{margin-top:18px;}
.illus .il-card{fill:var(--card-bg); stroke:var(--illus-line); stroke-width:1.5;}
.illus .il-soft{fill:var(--illus-fill); opacity:.6;}
.illus .il-fill{fill:var(--illus-fill);}
.illus .il-line{fill:none; stroke:var(--illus-line); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
.illus .il-line-accent{stroke:var(--accent); stroke-width:3;}
.illus .il-dash{fill:none; stroke:var(--illus-line); stroke-width:1.5; stroke-dasharray:4 5; stroke-linecap:round;}
.illus .il-fold{fill:var(--illus-fill); stroke:var(--illus-line); stroke-width:1.5;}
.illus .il-accent{fill:var(--accent);}
.illus .il-accent-soft{fill:var(--accent-soft);}
.illus .il-plus{fill:none; stroke:var(--accent-contrast); stroke-width:2.6; stroke-linecap:round;}
.illus .il-handle{fill:none; stroke:var(--accent); stroke-width:7; stroke-linecap:round;}
.empty-illus .illus .il-accent{animation:ilPop .6s cubic-bezier(.34,1.56,.64,1) both .2s; transform-box:fill-box; transform-origin:center;}
@keyframes ilPop{from{transform:scale(0);}to{transform:none;}}

/* ---------- préparation d'entretien (fiche) ---------- */
.prep .detail-section-title{flex-wrap:wrap;}
.prep-when{display:inline-flex; align-items:center; gap:5px; text-transform:none; letter-spacing:0; font-weight:500; color:var(--warn);}
.prep-when svg{width:13px; height:13px;}
.prep-tabs{margin-bottom:16px; width:max-content; max-width:100%;}
.prep-panel{animation:rowIn .25s ease-out;}
.prep-hint{font-size:var(--fs-sm); color:var(--text-faint); line-height:1.55; margin-bottom:12px;}
.prep-company{min-height:130px;}
.prep-links{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px;}
.prep-links .btn svg{width:14px; height:14px;}
.prep-questions{display:flex; flex-direction:column; gap:8px; margin-bottom:12px;}
.prep-q{border:1px solid var(--border-soft); border-radius:var(--r-sm); background:var(--panel-2);}
.prep-q[open]{background:var(--card-bg); border-color:var(--border);}
.prep-q summary{display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; list-style:none; font-size:var(--fs-md); font-weight:500;}
.prep-q summary::-webkit-details-marker{display:none;}
.prep-q summary span:first-child{flex:1; min-width:0;}
.prep-q-ok{display:grid; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--success-soft); color:var(--success);}
.prep-q-ok svg{width:11px; height:11px; stroke:currentColor; stroke-width:3;}
.prep-q summary .icon-btn-sm{opacity:0; transition:opacity .12s;}
.prep-q summary:hover .icon-btn-sm, .prep-q summary .icon-btn-sm:focus-visible{opacity:1;}
.prep-q .detail-textarea{margin:0 12px 12px; width:calc(100% - 24px); min-height:80px;}
.prep-group + .prep-group{margin-top:8px;}
.prep-group .detail-subtitle{margin-top:4px;}

/* ---------- calendrier : points et liste « agenda » (téléphone) ---------- */
.cal-dots{display:none;}
.cal-agenda{display:none;}

/* ---------- connexion : sélecteur de langue ---------- */
.login-lang{position:absolute; top:20px; right:20px; margin:0;}

/* ---------- mobile ---------- */
@media (max-width:960px){
  .ov-hero{grid-template-columns:1fr; gap:16px;}
}
@media (max-width:640px){
  .ov-greet h2{font-size:calc(22px * var(--fs-scale,1));}
  .next-action{flex-wrap:wrap; padding:16px; gap:14px;}
  .next-ic{width:38px; height:38px;}
  .next-main{flex:1 1 calc(100% - 56px);}
  .next-btn{width:100%; justify-content:center;}
  .ov-funnel{display:grid; grid-template-columns:1fr 1fr; gap:18px 16px; padding:16px;}
  .fn-arrow{display:none;}
  .empty-illus{padding:32px 16px 36px;}
  .empty-illus .illus{width:150px;}

  /* Calendrier mois : cases compactes avec des points, liste des jours en dessous. */
  .cal-panel{padding:14px 12px;}
  .cal-head{flex-wrap:wrap; gap:10px;}
  .cal-nav{display:grid; grid-template-columns:1fr auto auto; gap:8px; width:100%;}
  .cal-nav .segmented-inline{grid-column:1 / -1;}
  .cal-nav .btn-ghost{justify-self:start;}
  .cal-nav .segmented-inline .seg{flex:1; justify-content:center; padding:7px 6px;}
  .cal-view-month .cal-day{min-height:46px; align-items:center; padding:4px 2px; gap:3px;}
  .cal-view-month .cal-num{align-self:center; font-size:var(--fs-xs);}
  .cal-view-month .cal-events{display:none;}
  .cal-view-month .cal-dots{display:flex; gap:2px; justify-content:center; flex-wrap:wrap;}
  .cal-dots i{width:5px; height:5px; border-radius:50%;}
  .cal-view-month .cal-agenda{display:flex; flex-direction:column; gap:10px; margin-top:18px; padding-top:16px; border-top:1px solid var(--border-soft);}
  .cal-agenda-empty{font-size:var(--fs-sm); color:var(--text-faint); text-align:center; padding:6px 0;}
  .ag-day{display:flex; gap:12px; align-items:flex-start;}
  .ag-date{width:40px; flex-shrink:0; text-align:center; padding-top:2px;}
  .ag-date b{display:block; font-family:var(--font-display); font-size:var(--fs-h3); line-height:1;}
  .ag-date span{font-size:var(--fs-2xs); color:var(--text-faint); text-transform:uppercase;}
  .ag-day.today .ag-date b{color:var(--accent);}
  .ag-events{flex:1; min-width:0; display:flex; flex-direction:column; gap:5px;}
  .ag-events .ev-chip{flex-direction:row; align-items:center; gap:8px; padding:8px 10px; border-left-width:3px;}
  .ag-events .ev-type{display:block; font-size:var(--fs-xs); min-width:70px;}
  .ag-events .ev-co{font-size:var(--fs-sm);}
  /* Semaine : défilement horizontal plutôt que des colonnes illisibles. */
  .cal-view-week .wk{overflow-x:auto;}

  .cal-view-year .yr{grid-template-columns:1fr 1fr; gap:14px;}

  /* Fiche candidature : plein écran, en-tête empilé. */
  .modal-overlay:has(.modal-detail){padding:0;}
  .modal.modal-detail{max-width:none; min-height:100vh; border-radius:0; border:none; padding:18px 16px 28px;}
  .detail-head{flex-direction:column; gap:14px; margin-bottom:18px; padding-bottom:16px;}
  .detail-head-left h2{font-size:var(--fs-h3);}
  .detail-head-right{width:100%; justify-content:space-between;}
  .detail-head-right .cs-select{flex:1;}
  .detail-info{grid-template-columns:1fr 1fr;}
  .quick-actions .btn{flex:1 1 auto; justify-content:center;}
  .prep-tabs{width:100%;}
  .prep-tabs .seg{flex:1; justify-content:center;}
  .check-item .icon-btn-sm, .prep-q summary .icon-btn-sm{opacity:1;}
  .detail-actions .btn{flex:1; justify-content:center;}
  .login-lang{top:16px; right:16px;}
}

/* ---------- calendrier semaine (v4) ----------
   Plus de ligne « Journée » : chaque évènement est placé à son heure.
   L'en-tête des jours vit dans la zone qui défile (collé en haut), donc
   ses colonnes ont exactement la largeur des colonnes d'heures.
   Évènements qui se chevauchent : côte à côte (--lane / --lanes). */
.wk-scroll .wk-head{position:sticky; top:0; z-index:5; background:var(--panel);}
.wk-event{left:calc(3px + (100% - 6px) * var(--lane, 0) / var(--lanes, 1)); right:auto; width:calc((100% - 6px) / var(--lanes, 1) - 2px);}
.wk-event-untimed{border-left-style:dashed;}
@media (max-width:640px){
  .cal-view-week .wk-head, .cal-view-week .wk-grid{min-width:560px;}
}

/* ---------- logos d'entreprise (logos.js) ---------- */
.app-mono{overflow:hidden;}
.app-mono.has-logo{background:#fff; box-shadow:inset 0 0 0 1px var(--border-soft);}
.app-mono img{width:72%; height:72%; object-fit:contain; display:block;}
.app-mono.logo-in img{animation:logoIn .35s ease-out;}
@keyframes logoIn{from{opacity:0; transform:scale(.8);}to{opacity:1; transform:none;}}
.app-mono-lg{width:52px; height:52px; font-size:var(--fs-h3);}
.detail-head-left{display:flex; align-items:center; gap:14px; min-width:0;}

/* ---------- accueil : aperçus = vraie application (mode démo) ----------
   Cadre « fenêtre » contenant l'application à 1280 × 800, réduite par
   landing.js (fit) à la largeur de la colonne. */
.demo-window{width:100%; border:1px solid var(--border); border-radius:14px; overflow:hidden; background:var(--bg);
  box-shadow:0 1px 2px rgba(0,0,0,.06), 0 30px 70px -30px rgba(10,14,30,.4);}
.demo-bar{height:28px; display:flex; align-items:center; gap:6px; padding:0 14px; background:var(--panel); border-bottom:1px solid var(--border-soft);}
.demo-bar i{width:9px; height:9px; border-radius:50%; background:var(--border);}
.demo-fit{position:relative; width:100%; overflow:hidden; aspect-ratio:1280 / 800;}
.demo-frame{position:absolute; top:0; left:0; width:1280px; height:800px; border:0; transform-origin:0 0; pointer-events:none; background:var(--bg);}
.land-shot .demo-window{max-width:1120px; margin:0 auto;}
.land-stage .demo-window, .land-visual .demo-window{max-width:none;}
.land-visual{display:block;}

/* Dans le cadre : pas d'interaction, pas de barres de défilement, curseur animé. */
html.demo-mode body{pointer-events:none; overflow:hidden;}
html.demo-mode *{scrollbar-width:none;}
html.demo-mode *::-webkit-scrollbar{display:none;}
.demo-cursor{position:fixed; left:0; top:0; z-index:9999; width:22px; height:22px; margin:-3px 0 0 -4px; opacity:0; pointer-events:none;
  transition-property:transform, opacity; transition-timing-function:cubic-bezier(.45,.05,.25,1);}
.demo-cursor.show{opacity:1;}
.demo-cursor svg{width:22px; height:22px; fill:var(--text); stroke:var(--card-bg); stroke-width:1.5; stroke-linejoin:round; filter:drop-shadow(0 2px 4px rgba(0,0,0,.3)); transition:transform .15s;}
.demo-cursor.down svg{transform:scale(.82);}
.demo-cursor::after{content:''; position:absolute; left:4px; top:3px; width:28px; height:28px; margin:-14px 0 0 -14px; border-radius:50%; border:2px solid var(--accent); opacity:0;}
.demo-cursor.down::after{animation:clickRing .5s ease-out;}
.demo-pressed{transform:scale(.97); transition:transform .12s;}
/* Barre latérale : logo élargi (segments parallèles) → texte sur une ligne. */
.brand .brand-mark{height:18px;}
.brand-text span{white-space:nowrap;}
/* Aperçu de l'accueil : messages en haut, pour rester dans la partie visible. */
html.demo-mode #toastRoot{top:20px; bottom:auto;}