/* ============================================================
       VASTILIA · TOKENS · consolidé le 13 mai 2026
       Palette préservée (vert forêt + or, Lora + Inter).
       Modifs : --border adouci, tokens cards/ombres ajoutés.
       Backup intégral : styles.css.bak-20260513
       ============================================================ */
    :root{
      /* --- Marque : vert forêt --- */
      --deep:#2e5d4b;             /* vert profond — primaire */
      --mid:#4a8c6e;              /* vert moyen */
      --accent:#357a5d;           /* vert accent */
      --light:#e8f5ee;            /* vert très clair */
      --primary:#2e5d4b;          /* doublon historique de --deep (à remplacer par --deep à terme) */

      /* --- Or et chaleur --- */
      --gold:#96693f;
      --gold-light:#b5835a;
      --gold-soft:#f4d58d;

      /* --- Fonds et surfaces --- */
      --bg:#f7f7f5;               /* fond principal */
      --warm:#fafaf8;             /* fond chaud (blanc cassé) */
      --white:#fff;

      /* --- Encre / texte --- */
      --text:#222222;
      --muted:#5f6b66;

      /* --- Bordures et filets (adouci 13 mai 2026 ; ancienne valeur #8a8a8a) --- */
      --border:rgba(46,93,75,.12);          /* filet calme aligné sur la marque */
      --border-soft:rgba(46,93,75,.06);     /* encore plus discret (pattern de .dash-card) */
      --border-input:rgba(46,93,75,.15);    /* champs de formulaire (légèrement plus marqué) */
      --border-gold-soft:rgba(150,105,63,.18); /* filet décoratif or (pied de page-header) */
      --border-warm:var(--border-warm);                /* filet beige chaud (cartes Transmission/Volontés, ajouté 15 mai 2026) */

      /* --- États --- */
      --success:#38a169;
      --success-bold:#2e7d32;
      --success-bg:#e8f5e9;
      --success-bg-light:#f0fff4;       /* variante très claire (messages d'inscription) */
      --success-border-light:#c6f6d5;   /* bordure assortie au success-bg-light */
      --danger:#e53e3e;
      --danger-bg:#fff5f5;
      --danger-border:#fecaca;
      --warn-bg:#fff3e0;
      --warn-fg:#e65100;
      --info:#1565c0;
      --premium:#7b1fa2;

      /* --- Typographie : tailles --- */
      --text-xs:.75rem;
      --text-sm:.82rem;
      --text-base:.9rem;
      --text-md:1rem;
      --text-lg:1.15rem;
      --text-xl:1.4rem;
      --text-2xl:1.8rem;

      /* --- Rayons --- */
      --radius-sm:8px;
      --radius-md:12px;
      --radius-lg:16px;
      --radius-full:50px;
      --radius-card:12px;         /* unifie les cards (auparavant 10/12/14/16) */
      --radius-modal:20px;        /* modales — préservation du visuel actuel */

      /* --- Ombres (ajouté 13 mai 2026 — unifie les ombres existantes) --- */
      --shadow-1:0 1px 3px rgba(46,93,75,.06);                          /* card discrète, alignée marque */
      --shadow-2:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);  /* card prononcée (héritage) */
      --shadow-3:0 20px 60px rgba(0,0,0,.3);                            /* modale, objet posé */

      /* --- Layout --- */
      --sidebar-w:304px;

      /* --- Z-index --- */
      --z-dropdown:50;
      --z-sidebar:100;
      --z-tabbar:200;
      --z-modal:300;
      --z-toast:400;
      --z-video:500;
    }
    *{margin:0;padding:0;box-sizing:border-box;}
    html{overflow-x:hidden;overflow-x:clip;width:100%;max-width:100%;overscroll-behavior-x:none;
      /* Lisibilité Vastilia (14 mai 2026 — calé à 17px après itération).
         Bumpe 6,25% le texte global (acceptable) sans gonfler les hauteurs
         d'écran. Cible : grands-parents lisant sur téléphone, sans scroll
         vertical introduit. Aussi : body bumpé à 1.08rem (=18.36px) pour
         le texte hérité qui n'a pas de font-size explicite. */
      font-size:17px;
    }
    body{overflow-x:hidden;overflow-x:clip;width:100%;max-width:100%;position:relative;overscroll-behavior-x:none;}
    html,body{height:100%;font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);line-height:1.45;}
    /* Texte hérité (paragraphes sans classe) bumpé à 18.36px pour confort
       de lecture, sans toucher aux selectors explicitement dimensionnés. */
    body{font-size:1.08rem;}
    /* ── Utilitaire typographique : titres et accents serif (ajouté 13 mai 2026, Phase 2b) ── */
    .serif{font-family:'Lora',serif;}
    /* ── Utilitaire screen-reader-only (label visible uniquement par lecteurs d'écran) ── */
    .u-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
    /* ── Splash de boot (12 mai 2026) ── */
    #boot-splash{position:fixed;inset:0;z-index:9999;background:linear-gradient(160deg,#f7f7f5 0%,#e8efe9 100%);display:flex;align-items:center;justify-content:center;transition:opacity .35s ease,visibility .35s ease;}
    #boot-splash.boot-splash-hidden{opacity:0;visibility:hidden;pointer-events:none;}
    .boot-splash-inner{display:flex;flex-direction:column;align-items:center;gap:.8rem;max-width:320px;padding:1.5rem;text-align:center;}
    .boot-splash-logo{width:96px;height:96px;display:flex;align-items:center;justify-content:center;}
    .boot-splash-logo svg{width:100%;height:100%;}
    .boot-splash-title{font-family:'Lora',serif;font-size:1.8rem;font-weight:600;color:var(--deep);letter-spacing:.01em;}
    .boot-splash-msg{font-family:'Inter',sans-serif;font-size:.9rem;color:#5f6b66;margin-top:-.2rem;}
    .boot-splash-progress{width:160px;height:3px;background:rgba(46,93,75,.12);border-radius:50px;overflow:hidden;margin-top:.5rem;}
    .boot-splash-progress-fill{height:100%;width:30%;background:linear-gradient(90deg,#a8d4bc,var(--accent),var(--deep));border-radius:50px;animation:boot-splash-slide 1.4s ease-in-out infinite;}
    @keyframes boot-splash-slide{
      0%{margin-left:-30%;width:30%;}
      50%{margin-left:35%;width:50%;}
      100%{margin-left:100%;width:30%;}
    }
    @media (prefers-reduced-motion: reduce){
      .boot-splash-progress-fill{animation:none;width:60%;}
    }
    /* ── Focus visible (accessibilité clavier) ── */
    :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px;}
    input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:0;}
    button:focus:not(:focus-visible),.nav-item:focus:not(:focus-visible){outline:none;}
    /* ── Réduction des animations pour les utilisateurs sensibles au mouvement (12 mai 2026) ── */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
      }
    }
    /* ── Touch targets minimum 44px ── */
    button,.nav-item,.tab-btn,.vt-btn,.fam-tab,.mt-item,.qa-btn,.coll-card,.item-card,.story-item,.trigger-card{min-height:44px;}
    .coll-delete-btn,.coll-rename-btn,.coll-eye-btn{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;}
    /* ── Mode compact ── */
    body.compact-mode .main-content{padding:1rem 1.5rem;}
    body.compact-mode .card{padding:.8rem 1rem;}
    body.compact-mode .stat-card{padding:.8rem;}
    body.compact-mode .page-header{margin-bottom:1.2rem;}
    body.compact-mode .dash-card{padding:.8rem 1rem;margin-bottom:.6rem;}
    body.compact-mode .item-card .item-body{padding:.6rem .8rem;}
    body.compact-mode .items-grid{gap:.7rem;}
    body.compact-mode .collections-grid{gap:.8rem;}
    /* ── Skeleton loading ── */
    @keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
    .skeleton{background:linear-gradient(90deg,var(--bg) 25%,rgba(255,255,255,.6) 50%,var(--bg) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md);}
    .skeleton-card{height:180px;border-radius:var(--radius-lg);}
    .skeleton-line{height:14px;border-radius:4px;margin-bottom:.5rem;}
    .skeleton-line.short{width:60%;}
    .proto-banner{display:none;}
    .screen{display:none;min-height:100vh;overflow-x:hidden;overflow-x:clip;max-width:100%;}
    .screen.active{display:flex;overflow-x:hidden;overflow-x:clip;}
    #s-login{align-items:center;justify-content:center;background:linear-gradient(150deg,#1a3d2e 0%,var(--deep) 50%,#3a6e55 100%);flex-direction:column;}

    /* ── LOGIN ── */
    /* Login/Signup compactés 29 mai 2026 : tout doit tenir dans un viewport
       standard (iPhone ~667-844 px) sans scroll. Gains : logo 180→90 px,
       paddings réduits, espacements resserrés. Lisibilité préservée :
       inputs à .93 rem, labels à .85 rem. */
    .login-box{background:var(--white);border-radius:22px;padding:1.8rem 2rem 1.4rem;width:100%;max-width:460px;box-shadow:0 20px 60px rgba(0,0,0,.3);}
    .llogo{text-align:center;margin-bottom:.9rem;}
    .llogo img,.llogo svg{max-width:90px;height:auto;display:block;margin:0 auto;}
    .llogo .ls{font-size:.78rem;color:var(--muted);margin-top:.15rem;letter-spacing:.02em;}
    .login-box h2{font-family:'Lora',serif;font-size:1.2rem;color:var(--deep);margin-bottom:1rem;text-align:center;}
    .fg{margin-bottom:.6rem;}
    .fg label{display:block;font-size:.83rem;font-weight:600;color:var(--deep);margin-bottom:.3rem;}
    .fg input,.fg textarea,.fg select{width:100%;padding:.6rem .85rem;border:1.5px solid var(--border);border-radius:10px;font-family:'Inter',sans-serif;font-size:.92rem;outline:none;transition:border-color .2s;color:var(--text);background:var(--white);box-sizing:border-box;line-height:1.2;}
    .fg input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="file"]),.fg select{height:42px;padding:.45rem .85rem;box-sizing:border-box;-webkit-appearance:none;}
    .fg input:focus,.fg textarea:focus,.fg select:focus{border-color:var(--accent);}
    .fg textarea{resize:vertical;}
    /* Pattern rituel volontés sensibles (26 mai 2026 — reco #20) — sur Obsèques
       et Directives anticipées médicales. Le textarea n'apparaît qu'après clic
       sur le bouton "Je suis prêt à écrire", pour donner une respiration entre
       lire et écrire. Si la valeur existe déjà en BDD, le rituel est sauté
       (cf. loadTransmission) — pas d'obstruction sur revisite/modification. */
    .vol-ritual-wrapper{display:flex;flex-direction:column;align-items:center;padding:.8rem 0 .3rem;gap:.4rem;}
    .vol-ritual-hint{font-size:.78rem;color:var(--muted);font-style:italic;text-align:center;}
    .vol-ready-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.4rem;background:transparent;border:1.5px solid var(--gold);color:var(--gold);border-radius:50px;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;cursor:pointer;transition:background .15s,color .15s,transform .1s;}
    .vol-ready-btn:hover{background:var(--gold);color:var(--white);transform:translateY(-1px);}
    .vol-ready-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
    /* Toggle "afficher le mot de passe" (25 mai 2026 — reco #8) */
    .fg-password{position:relative;}
    .fg-password input{padding-right:2.6rem;}
    .fg-password-toggle{position:absolute;right:.3rem;top:50%;transform:translateY(-50%);background:transparent;border:0;cursor:pointer;color:var(--muted);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:color .15s,background .15s;font-size:1.05rem;line-height:1;padding:0;}
    .fg-password-toggle:hover{color:var(--deep);background:rgba(46,93,75,.08);}
    .fg-password-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
    .btn-main{width:100%;background:var(--deep);color:white;border:none;padding:1rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;transition:background .2s,transform .1s;margin-top:.5rem;}
    .btn-main:hover{background:var(--mid);transform:translateY(-1px);}
    .login-switch{text-align:center;margin-top:1.2rem;font-size:.88rem;color:var(--muted);}
    .login-switch a{color:var(--accent);cursor:pointer;font-weight:600;}
    .beta-badge{display:inline-block;background:var(--gold);color:white;font-size:.7rem;font-weight:700;padding:.2rem .6rem;border-radius:50px;letter-spacing:.04em;vertical-align:middle;margin-left:.5rem;}

    /* ── APP SHELL ── */
    .app-shell{flex-direction:row;width:100%;max-width:100%;min-height:100vh;overflow-x:hidden;overflow-x:clip;}
    .sidebar{width:var(--sidebar-w);background:var(--deep);color:rgba(255,255,255,.9);flex-shrink:0;display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:var(--z-sidebar);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;border-right:none;}
    .sidebar::-webkit-scrollbar{display:none;}
    /* .sb-logo : refonte 13 mai 2026 — bouteille déplacée APRÈS le texte (inline). */
    .sb-logo{padding:.8rem 1.2rem .5rem 1.6rem;display:flex;align-items:center;gap:.5rem;}
    .sb-logo-img{margin-bottom:0;flex-shrink:0;order:2;}  /* order:2 → la bouteille s'affiche après .ls */
    .sb-logo-img svg{width:28px;height:28px;display:block;overflow:hidden;filter:drop-shadow(0 1px 2px rgba(0,0,0,.25));}
    .sb-logo-img svg g{fill:#f4d58d !important;}
    .sb-logo .ls{font-family:'Lora',serif;font-weight:700;font-size:1.05rem;color:rgba(255,255,255,.85);margin:0;padding-left:.2rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .sb-user{display:flex;align-items:center;gap:.6rem;padding:.6rem 1.2rem;margin:0 .5rem .3rem;border-radius:10px;background:transparent;transition:background .15s;}
    .sb-user:hover{background:rgba(255,255,255,.05);}
    .sb-user.active{background:rgba(244,213,141,.12);box-shadow:inset 0 0 0 1px rgba(244,213,141,.25);}
    .u-av{width:36px;height:36px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;flex-shrink:0;color:white;}
    .u-name{font-size:.85rem;font-weight:600;color:white;}
    .u-status{font-size:.75rem;color:rgba(255,255,255,.55);}
    /* Pied de sidebar (13 mai 2026) — bloc compte poussé en bas par .sb-nav (flex:1), + icône déconnexion discrète */
    .sb-foot{margin-top:auto;display:flex;align-items:center;gap:.25rem;padding:.4rem .3rem .6rem;}
    .sb-foot .sb-user{flex:1;margin:0;}
    .sb-logout{background:transparent;border:0;color:rgba(255,255,255,.45);width:36px;height:36px;border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s;flex-shrink:0;}
    .sb-logout:hover{color:var(--gold-soft);background:rgba(255,255,255,.06);}
    .sb-logout i{font-size:1.1rem;}
    .sb-nav{padding:.15rem 0;display:flex;flex-direction:column;gap:.15rem;flex:1;}
    .sb-section{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#f4d58d;padding:.55rem .7rem .2rem;margin-left:1rem;}
    .sb-dropdown{margin-top:.25rem;}
    .sb-dropdown-header{display:flex;align-items:center;gap:.55rem;padding:.42rem .7rem;cursor:pointer;font-size:.78rem;font-weight:700;color:#f4d58d;text-transform:uppercase;letter-spacing:.05em;border-radius:8px;margin:0 .5rem .05rem .9rem;transition:all .15s;}
    .sb-dropdown-header:hover{color:#ffe4a8;}
    .sb-dropdown.has-active>.sb-dropdown-header{color:#ffe4a8;background:rgba(244,213,141,.12);}
    .sb-dropdown.has-active>.sb-dropdown-header .nav-icon{color:#ffe4a8;}
    .sb-dd-chevron{margin-left:auto;font-size:.7rem;transition:transform .25s;color:rgba(255,255,255,.3);}
    .sb-dropdown.open .sb-dd-chevron{transform:rotate(180deg);}
    .sb-dropdown-items{max-height:0;overflow:hidden;transition:max-height .3s ease;}
    .sb-dropdown.open .sb-dropdown-items{max-height:200px;}
    .sb-dropdown-items .nav-item{margin-left:1.4rem;font-size:.83rem;padding:.38rem .7rem;}
    .nav-item{display:flex;align-items:center;gap:.55rem;padding:.42rem .7rem;cursor:pointer;font-size:.85rem;color:rgba(255,255,255,.75);transition:all .15s;border-radius:8px;margin:0 .5rem .1rem .9rem;border-left:none;}
    .nav-item:hover{color:white;background:rgba(255,255,255,.1);}
    .nav-item.active{color:white;background:rgba(255,255,255,.15);font-weight:600;}
    .nav-icon{font-size:1.05rem;width:1.3rem;text-align:center;display:inline-flex;align-items:center;justify-content:center;}
    .fiche-dropdown-body.open{max-height:500px!important;padding:.4rem 0!important;}
    .sb-bottom{padding:.4rem 0;border-top:1px solid rgba(255,255,255,.1);margin-top:auto;}
    .sb-reset{font-size:.78rem;color:rgba(255,255,255,.4);padding:1rem 1.5rem;text-align:center;border-top:1px solid rgba(255,255,255,.08);cursor:pointer;transition:all .2s;}
    .sb-reset:hover{color:white;background:rgba(255,255,255,.08);}
    .main-content{margin-left:var(--sidebar-w);padding:1.1rem 1.8rem;min-height:100vh;min-width:0;overflow-x:hidden;width:calc(100% - var(--sidebar-w));box-sizing:border-box;}
    #s-compte .main-content{overflow-x:hidden;padding-top:1rem;padding-bottom:2rem;}
    .main-content>*{max-width:780px;margin-left:auto;margin-right:auto;}
    /* Mes Souvenirs : zone élargie + paddings allégés pour faire tenir 8 onglets */
    #s-souvenirs .main-content{padding:1.1rem 1.4rem;}
    #s-souvenirs .main-content>*{max-width:920px;}
    #s-souvenirs .page-header{margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(150,105,63,.18);}
    /* Tableau de bord — layout 2 colonnes pour équilibrer la page (2 mai 2026) */
    #s-dashboard .main-content>*{max-width:1000px;}
    /* 30 mai 2026 — refonte dashboard one-column (option 1 validée par Pierre).
       Avant : .dash-main-grid 2 colonnes (action gauche / FAQ droite) avec gros
       déséquilibre visuel sur grand écran (FAQ dominait, gauche vide). Maintenant
       .dash-content-narrow : pile unique max 720px centrée, regard descend
       naturellement, FAQ en bas repliée. Classes .dash-main-* conservées (compat). */
    .dash-content-narrow{max-width:720px;margin:0 auto;}
    .dash-main-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start;margin-top:.4rem;}
    .dash-main-grid>*{min-width:0;}
    .dash-main-left,.dash-main-right{display:flex;flex-direction:column;gap:0;}
    /* Décalage de la colonne droite (FAQ) pour aligner son haut avec le premier
       bloc de suggestion de la colonne gauche, plutôt qu'avec la carte de
       progression « Votre capsule prend racine ». Desktop uniquement. */
    @media(min-width:881px){.dash-main-right{margin-top:5rem;}}
    @media(max-width:880px){.dash-main-grid{grid-template-columns:1fr;gap:.6rem;}}

    /* ============================================================
       DASHBOARD DIRECTION B (30 mai 2026 — refonte refonte)
       "Une question, quelques minutes" rendue visible.
       Carte Aujourd'hui = héros, le reste est du contexte discret.
       ============================================================ */

    /* CARTE AUJOURD'HUI — le héros visuel de la page */
    .dash-today-card{
      background:var(--white);
      border:1px solid rgba(150,105,63,.18);
      border-radius:18px;
      padding:2.6rem 2.4rem 1.9rem;
      box-shadow:0 2px 14px rgba(46,93,75,.07);
      margin-bottom:0;
    }
    .dash-today-label{
      font-family:'Inter',sans-serif;
      font-size:.72rem;
      font-weight:700;
      color:var(--gold);
      letter-spacing:.13em;
      text-transform:uppercase;
      margin-bottom:1.1rem;
    }
    .dash-today-question{
      font-family:'Lora',serif;
      font-style:italic;
      font-size:1.4rem;
      font-weight:500;
      color:var(--deep);
      line-height:1.55;
      margin-bottom:1.8rem;
    }
    .dash-today-cta{
      width:100%;
      background:var(--gold);
      color:var(--white);
      border:none;
      border-radius:50px;
      padding:.9rem 1.4rem;
      font-family:'Inter',sans-serif;
      font-size:.95rem;
      font-weight:600;
      cursor:pointer;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      transition:opacity .15s,transform .1s;
    }
    .dash-today-cta:hover{opacity:.92;}
    .dash-today-cta:active{transform:scale(.98);}
    .dash-today-escapes{
      display:flex;
      justify-content:center;
      gap:1.8rem;
      margin-top:1.15rem;
      font-family:'Inter',sans-serif;
      font-size:.82rem;
      flex-wrap:wrap;
    }
    .dash-today-escapes a{
      color:var(--muted);
      text-decoration:underline;
      text-decoration-color:rgba(46,93,75,.25);
      text-underline-offset:3px;
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      cursor:pointer;
    }
    .dash-today-escapes a:hover{color:var(--deep);text-decoration-color:var(--gold);}

    /* STRIP ÉTAT — italique gris, état des lieux sobre */
    .dash-state-strip{
      padding:2rem .25rem 1.4rem;
      text-align:center;
      font-family:'Lora',serif;
      font-style:italic;
      color:var(--muted);
      font-size:.95rem;
      line-height:1.7;
    }
    .dash-state-strip a{
      color:var(--muted);
      text-decoration:none;
      transition:color .15s;
    }
    .dash-state-strip a:hover{color:var(--deep);}
    .dash-state-strip .strip-sep{
      margin:0 .6rem;
      color:rgba(150,105,63,.4);
    }

    /* AUTRE CHOSE EN TÊTE — échappées discrètes, centrées */
    .dash-quick-row{
      padding:1.4rem .25rem .8rem;
      font-family:'Inter',sans-serif;
      text-align:center;
    }
    .dash-quick-label{
      font-size:.82rem;
      color:var(--muted);
      margin-bottom:.9rem;
    }
    .dash-quick-items{
      display:flex;
      gap:1.8rem;
      flex-wrap:wrap;
      font-size:.88rem;
      justify-content:center;
    }
    .dash-quick-items a{
      color:var(--deep);
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      cursor:pointer;
      padding:.25rem 0;
    }
    .dash-quick-items a i{color:var(--gold);font-size:.95rem;}
    .dash-quick-items a:hover{color:var(--gold);}

    /* LIEN FAQ — très discret, en pied */
    .dash-faq-link{
      padding:2rem .25rem .5rem;
      text-align:center;
      font-family:'Inter',sans-serif;
      font-size:.82rem;
    }
    .dash-faq-link a{
      color:var(--muted);
      text-decoration:none;
      display:inline-flex;
      align-items:center;
      gap:.4rem;
    }
    .dash-faq-link a:hover{color:var(--deep);}

    /* Responsive (mobile / petit tablet) — carte respire moins, strip wrap.
       Audit 30 mai 2026 : ajout d'un breakpoint < 420 (iPhone SE / 375 px) pour
       que le strip 6 catégories n'ait pas l'air pressé, et que les échappées
       sous le CTA passent en pile plutôt qu'en ligne. */
    @media(max-width:600px){
      .dash-today-card{padding:1.9rem 1.4rem 1.4rem;}
      .dash-today-question{font-size:1.2rem;}
      .dash-state-strip{font-size:.88rem;line-height:1.9;}
      .dash-state-strip .strip-sep{margin:0 .4rem;}
      .dash-quick-items{gap:1.1rem;}
    }
    @media(max-width:420px){
      .dash-today-card{padding:1.6rem 1.1rem 1.2rem;border-radius:14px;}
      .dash-today-question{font-size:1.1rem;line-height:1.5;}
      .dash-today-escapes{gap:.7rem;flex-direction:column;align-items:center;}
      .dash-state-strip{font-size:.85rem;line-height:2;padding:1.5rem .25rem 1rem;}
      .dash-state-strip .strip-sep{margin:0 .3rem;}
      .dash-quick-items{gap:.8rem;font-size:.85rem;}
      .dash-faq-link{padding:1.5rem .25rem .4rem;}
    }
    /* Aperçu de votre capsule (compteurs visuels, visible si ≥ 3 éléments) */
    /* V (12 mai 2026 — itération 4) — Aperçu sticky en bas du viewport.
       Quel que soit la hauteur de la page au-dessus, la barre reste collée au bas
       et toujours visible. Plus jamais besoin de scroller pour voir les chiffres clés.
       Le z-index garde l'Aperçu au-dessus de l'inspiration et des autres blocs. */
    .dash-overview{position:sticky;bottom:.5rem;z-index:5;margin-top:.7rem;padding:.35rem .5rem;background:var(--white);border:1px solid var(--border);border-radius:10px;box-shadow:0 4px 16px rgba(46,93,75,.12);}
    .dash-overview-title{display:none;}
    .dash-overview-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:.3rem;}
    .dash-overview-tile{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.3rem;padding:.25rem .35rem;border:1px solid rgba(150,105,63,.12);border-radius:6px;background:transparent;text-decoration:none;cursor:pointer;transition:border-color .15s,background .15s;min-height:auto;}
    .dash-overview-tile:hover{border-color:var(--gold);background:rgba(150,105,63,.04);}
    .dash-overview-tile i{font-size:.78rem;color:var(--gold);margin:0;}
    .dash-overview-num{font-family:'Lora',serif;font-size:.88rem;font-weight:700;color:var(--deep);line-height:1;margin:0;}
    .dash-overview-lbl{font-size:.66rem;color:var(--muted);margin:0;}
    @media(max-width:760px){.dash-overview-grid{grid-template-columns:repeat(3,1fr);}}
    @media(max-width:420px){.dash-overview-grid{grid-template-columns:repeat(2,1fr);}}
    /* Inspiration du jour (citation discrète) */
    /* Citation Vastilia (refondue 15 mai 2026) — moment éditorial pleine largeur, centré, généreux.
       Avant : encart discret border-left, gris, 0.95rem. Après : vrai moment de marque. */
    .dash-inspiration{margin-top:1.5rem;padding:1.8rem 2rem;display:flex;flex-direction:column;align-items:center;text-align:center;gap:.7rem;background:linear-gradient(180deg,rgba(244,213,141,.06),rgba(244,213,141,.02));border:1px solid var(--border-gold-soft);border-radius:var(--radius-card);font-family:'Lora',serif;font-style:italic;font-size:1.2rem;color:var(--deep);line-height:1.55;max-width:760px;margin-left:auto;margin-right:auto;}
    .dash-inspiration i{color:var(--gold);font-size:1.7rem;flex-shrink:0;opacity:.8;}
    .page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.9rem;}
    .page-header h1{font-family:'Lora',serif;font-size:1.6rem;color:var(--deep);}
    .page-header p{color:var(--muted);font-size:.9rem;margin-top:.3rem;}
    /* Fallback image (15 mai 2026, Lot sécurité) — utilisé par window._imgFallback quand
       une <img> échoue à charger. Évite le pattern onerror="...innerHTML=..." faillible. */
    .img-fallback-icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:1.2rem;}
    .img-fallback-text{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:600;color:var(--deep);}
    .btn-add{background:var(--accent);color:white;border:none;padding:.7rem 1.4rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:background .2s,transform .1s;flex-shrink:0;min-height:40px;}
    .btn-add:hover{background:var(--mid);transform:translateY(-1px);}
    /* Variante outlined (15 mai 2026) — pour hiérarchiser les CTA secondaires sur l'Accueil
       (3 cards Suggestion/Explorer/Pourquoi pas : 1 vert plein + 2 outlined). */
    .btn-add.btn-outline{background:transparent;color:var(--accent);border:1.5px solid var(--accent);}
    .btn-add.btn-outline:hover{background:var(--light);color:var(--deep);border-color:var(--deep);}
    .card{background:var(--white);border-radius:var(--radius-card);padding:1rem 1.2rem;box-shadow:var(--shadow-2);border:1px solid var(--border);}
    .card h3{font-family:'Lora',serif;font-size:1.05rem;color:var(--deep);margin-bottom:.7rem;}
    .btn-save{background:var(--deep);color:white;border:none;padding:.55rem 1.4rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:700;cursor:pointer;transition:background .2s,transform .1s;}
    .btn-save:hover{background:var(--mid);transform:translateY(-1px);}
    .btn-cancel{background:transparent;color:var(--muted);border:1.5px solid var(--border);padding:.55rem 1.2rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.82rem;cursor:pointer;transition:all .2s;}
    .btn-cancel:hover{border-color:var(--muted);color:var(--text);}

    /* ── DASHBOARD ── */
    .stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-bottom:1rem;}
    .stat-card{background:var(--white);border-radius:var(--radius-card);padding:1rem;box-shadow:var(--shadow-2);border:1px solid var(--border);}
    .stat-card-link{cursor:pointer;transition:transform .15s,box-shadow .15s;}
    .stat-card-link:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(46,93,75,.13);}
    .entry-points{min-width:0;width:100%;}
    /* ── DASHBOARD CARDS ── */
    .dash-card{background:var(--white);border-radius:var(--radius-card);padding:1.2rem 1.5rem;margin-bottom:1rem;border:1px solid var(--border-soft);box-shadow:var(--shadow-1);box-sizing:border-box;}
    .dash-card.warm{background:linear-gradient(135deg,rgba(181,131,90,.04),rgba(181,131,90,.01));border-color:rgba(181,131,90,.12);}
    .dash-card.soft{background:linear-gradient(135deg,#f8faf9,#fdf8f3);border-color:rgba(46,93,75,.1);}
    /* ── ONBOARDING ── */
    /* ── FAQ ── */
    /* FAQ — harmonisation avec suggestion-card (15 mai 2026) : radius unifié, padding plus généreux,
       textes plus lisibles (passe à .9rem question / .88rem réponse). */
    .faq-section{background:var(--white);border-radius:var(--radius-card);padding:1rem 1.3rem;margin-bottom:1rem;border:1px solid var(--border-soft);box-shadow:var(--shadow-1);box-sizing:border-box;margin-top:0;}
    .faq-title{font-family:'Lora',serif;font-size:1rem;font-weight:600;color:var(--deep);margin-bottom:.75rem;display:flex;align-items:center;gap:.45rem;}
    .faq-item{background:var(--bg);border:1px solid var(--border);border-radius:10px;margin-bottom:.4rem;overflow:hidden;}
    .faq-q{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;cursor:pointer;font-size:.9rem;font-weight:600;color:var(--deep);transition:background .15s;}
    .faq-q:hover{background:var(--light);}
    .faq-q i{color:var(--accent);font-size:.9rem;flex-shrink:0;transition:transform .2s;}
    .faq-q.open i.ph-caret-right{transform:rotate(90deg);}
    .faq-a{display:none;padding:0 1rem .8rem 2.3rem;font-size:.88rem;color:var(--text);line-height:1.6;}
    .faq-q.open + .faq-a{display:block;}
    .stat-row{display:flex;align-items:center;gap:.6rem;}
    .stat-icon{font-size:1.4rem;}
    .stat-number{font-family:'Lora',serif;font-size:1.8rem;font-weight:700;color:var(--deep);}
    .stat-label{font-size:.82rem;color:var(--muted);margin-top:.4rem;}
    .dash-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:1rem;}
    .quick-actions{display:flex;flex-direction:column;gap:.5rem;}
    .qa-btn{display:flex;align-items:center;gap:.8rem;padding:.6rem 1rem;border:2px solid var(--border);border-radius:10px;cursor:pointer;transition:all .2s;background:transparent;font-family:'Inter',sans-serif;text-align:left;width:100%;min-height:40px;}
    .qa-btn:hover{border-color:var(--accent);background:rgba(64,145,108,.05);}
    .qa-icon{font-size:1.2rem;width:26px;text-align:center;}
    .icon-circle{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:var(--white);flex-shrink:0;}
    .icon-circle.sm{width:28px;height:28px;font-size:1rem;}
    .icon-circle.md{width:44px;height:44px;font-size:1.3rem;}
    .icon-circle.lg{width:44px;height:44px;font-size:1.4rem;}
    .icon-circle.accent{background:var(--accent);}
    .icon-circle.gold{background:var(--gold);}
    .icon-circle.deep{background:var(--deep);}
    .icon-circle.mid{background:var(--mid);}
    .icon-circle.muted{background:var(--muted);}

    .qa-text{font-size:.88rem;font-weight:600;color:var(--deep);}
    .qa-sub{font-size:.8rem;color:var(--muted);}
    .recent-list{display:flex;flex-direction:column;gap:.4rem;}
    .recent-item{display:flex;align-items:center;gap:.7rem;padding:.5rem;border-radius:10px;cursor:pointer;transition:background .2s;}
    .recent-item:hover{background:var(--bg);}
    .ri-thumb{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;}
    .ri-thumb.photo{background:#dff0e8;} .ri-thumb.doc{background:#fef9e7;} .ri-thumb.key{background:#dff0e8;} .ri-thumb.story{background:#fdf6ee;}
    .ri-info{flex:1;}
    .ri-title{font-size:.88rem;font-weight:600;color:var(--deep);}
    .ri-meta{font-size:.8rem;color:var(--muted);margin-top:.15rem;}
    .ri-date{font-size:.8rem;color:var(--muted);}

    /* ── PHOTOS (Ma capsule) ── */
    /* View-toggle harmonisé en pills (15 mai 2026) — même système que .tab-btn pour éviter
       deux paradigmes côte-à-côte sur l'écran. Hiérarchie : .vt-btn = niveau 1 (font-size .88rem,
       fond vert plein quand actif), .tab-btn = niveau 2 (plus petit, plus discret cf. plus bas). */
    .view-toggle{display:flex;gap:.5rem;margin-bottom:1rem;}
    .vt-btn{padding:.5rem 1.2rem;border-radius:50px;border:1.5px solid var(--border);background:white;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;cursor:pointer;transition:all .2s;color:var(--muted);display:inline-flex;align-items:center;gap:.4rem;}
    .vt-btn:hover:not(.active){border-color:var(--accent);color:var(--accent);}
    .vt-btn.active{background:var(--deep);color:white;border-color:var(--deep);}
    .collections-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1.2rem;}
    .coll-card{background:var(--white);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-2);border:1px solid var(--border);cursor:pointer;transition:transform .2s,box-shadow .2s;}
    .coll-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,52,41,.13);}
    .coll-cover{height:110px;display:flex;align-items:center;justify-content:center;font-size:2.8rem;position:relative;overflow:hidden;background:var(--bg);}
    .coll-cover-img{width:100%;height:100%;object-fit:cover;display:block;}
    /* Carte album vide (29 mai 2026) — cadre pointillés + invite */
    .coll-card-empty{box-shadow:none;border:none;background:transparent;}
    .coll-card-empty .coll-cover{background:transparent;border:2px dashed rgba(150,105,63,.35);border-radius:var(--radius-card) var(--radius-card) 0 0;border-bottom:none;}
    .coll-card-empty .coll-info{border:2px dashed rgba(150,105,63,.35);border-top:none;border-radius:0 0 var(--radius-card) var(--radius-card);background:transparent;}
    .coll-card-empty:hover .coll-cover,.coll-card-empty:hover .coll-info{border-color:var(--accent);}
    .coll-cover-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;color:var(--muted);text-align:center;padding:.5rem;width:100%;height:100%;}
    .coll-cover-empty i{font-size:2rem;color:var(--gold);opacity:.6;margin-bottom:.2rem;}
    .coll-cover-empty span{font-size:.78rem;line-height:1.2;}
    .coll-cover-empty-cta{color:var(--gold);font-style:italic;font-size:.72rem !important;}
    .coll-count{position:absolute;top:.6rem;right:.6rem;background:rgba(0,0,0,.4);color:white;font-size:.75rem;font-weight:700;padding:.2rem .55rem;border-radius:50px;}
    .coll-info{padding:1rem 1.2rem;display:flex;align-items:center;gap:10px;}
    .coll-info-text{flex:1;min-width:0;}
    .coll-name{font-size:.9rem;font-weight:700;color:var(--deep);}
    .coll-meta{font-size:.8rem;color:var(--muted);margin-top:.2rem;}
    .coll-add{background:var(--bg);border:2px dashed #c8d5cc;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;min-height:170px;}
    .coll-add:hover{border-color:var(--accent);background:rgba(64,145,108,.05);}
    .coll-delete-btn,.coll-rename-btn,.coll-eye-btn{position:absolute;bottom:.55rem;background:rgba(0,0,0,.55);border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:white;cursor:pointer;opacity:0;transition:opacity .2s,background .15s;font-size:.85rem;line-height:1;padding:0;}
    .coll-delete-btn{right:.55rem;}
    .coll-rename-btn{right:2.6rem;}
    .coll-eye-btn{right:4.65rem;}
    .coll-card:hover .coll-delete-btn,.coll-card:hover .coll-rename-btn,.coll-card:hover .coll-eye-btn{opacity:1;}
    .coll-delete-btn:hover{background:rgba(220,38,38,.85);}
    .coll-rename-btn:hover{background:rgba(46,93,75,.9);}
    .coll-eye-btn:hover{background:rgba(104,168,138,.9);}
    /* Bouton de partage d'album (6 juin 2026) — haut-gauche, toujours visible */
    /* Bouton de partage dans le bandeau inférieur de la carte album (6 juin 2026) */
    .coll-share-btn{flex:0 0 auto;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:var(--white);color:var(--deep);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.05rem;line-height:1;padding:0;transition:background .15s,color .15s,border-color .15s;}
    .coll-share-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent);}
    /* Filter-tabs (sous-filtres niveau 2) — passés en pills plus discrets le 15 mai 2026
       pour ne pas concurrencer visuellement le tabset principal .vt-btn juste au-dessus.
       Actif : fond vert clair + texte deep, plutôt que fond plein. */
    .filter-tabs{display:flex;gap:.4rem;margin-bottom:1rem;flex-wrap:wrap;}
    .tab-btn{padding:.35rem .95rem;border-radius:50px;border:1px solid var(--border);background:transparent;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s;color:var(--muted);}
    .tab-btn.active{background:var(--light);color:var(--deep);border-color:rgba(46,93,75,.25);font-weight:600;}
    .tab-btn:hover:not(.active){border-color:var(--accent);color:var(--accent);}
    .filter-select{padding:.45rem 2.4rem .45rem 1.1rem;border-radius:50px;border:1.5px solid var(--border);background-color:white;font-family:'Inter',sans-serif;font-size:.83rem;font-weight:500;cursor:pointer;color:var(--deep);min-height:44px;min-width:220px;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232e5d4b'%3e%3cpath d='M4.5 6l3.5 3.5L11.5 6z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .75rem center;background-size:14px;transition:border-color .2s;}
    .filter-select:hover{border-color:var(--accent);}
    .filter-select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px rgba(104,168,138,.2);}
    .items-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;}
    .item-card{background:var(--white);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-2);border:1px solid var(--border);cursor:pointer;transition:transform .2s,box-shadow .2s;}
    .item-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,52,41,.13);}
    .item-prev{height:130px;display:flex;align-items:center;justify-content:center;font-size:2.8rem;position:relative;overflow:hidden;}
    .item-prev img{width:100%;height:100%;object-fit:cover;}
    .item-prev.pb{background:linear-gradient(135deg,#d4ebe0,#a8d8be);}
    .item-prev.db{background:linear-gradient(135deg,#fef3cd,#fde08a);}
    .item-prev.kb{background:linear-gradient(135deg,#d4edda,#a8d4bc);}
    .item-prev.mb{background:linear-gradient(135deg,#e8f4ef,#c5e0d4);}
    .item-badge{position:absolute;bottom:.4rem;left:.4rem;background:rgba(255,255,255,.9);font-size:.75rem;font-weight:700;color:var(--deep);padding:.18rem .55rem;border-radius:50px;}
    .item-body{padding:.9rem 1.1rem;}
    .ib-title{font-size:.88rem;font-weight:600;color:var(--deep);}
    /* Hiérarchie carte photo inversée (15 mai 2026) : caption (description) en lecture principale,
       kicker album en filigrane discret. Italique retiré sur caption (lisibilité) ; placeholder
       moins fantôme — couleur muted plutôt que gris fantomatique #c0cfc8. */
    .ib-coll{font-size:.68rem;color:var(--gold);font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-top:.15rem;opacity:.85;}
    .ib-precious{font-size:.85rem;color:var(--muted);margin-top:.35rem;line-height:1.5;}
    .ib-caption{font-size:.92rem;color:var(--deep);margin-top:.35rem;line-height:1.5;}
    .ib-caption-ph{color:var(--muted);font-weight:400;}
    .photo-eye{color:var(--accent);cursor:pointer;font-size:1rem;opacity:.5;transition:opacity .15s,transform .15s;line-height:1;flex-shrink:0;}
    .photo-eye:hover{opacity:1;transform:scale(1.15);}
    /* Corbeille directe sur la carte photo (2 juin 2026) : supprimer sans passer par
       la fiche/édition. Discrète par défaut, rougit au survol. */
    .photo-trash{color:#c3c0b8;cursor:pointer;font-size:1rem;opacity:.7;transition:color .15s,opacity .15s,transform .15s;line-height:1;flex-shrink:0;}
    .photo-trash:hover{color:var(--danger);opacity:1;transform:scale(1.15);}
    /* Repli quand une vignette ne charge pas (fichier manquant) : icône au lieu du « ? ». */
    .item-prev-broken{color:rgba(46,93,75,.5);font-size:2.2rem;}

    /* ── DOCUMENTS ── */
    .doc-progress{background:var(--white);border-top:1px solid var(--border);padding:.9rem 2rem;box-shadow:0 -2px 16px rgba(0,0,0,.07);display:none;gap:3rem;align-items:center;position:fixed;bottom:0;left:var(--sidebar-w);right:0;z-index:90;}
    .main-content{padding-bottom:2rem;}
    /* L'écran Transmission affiche en plus le bandeau `.doc-progress` fixé en bas.
       On réserve de l'espace pour que le bouton "Enregistrer mes volontés" ne soit
       pas masqué par ce bandeau. Valeur calibrée pour couvrir la hauteur du bandeau
       (~110-130px) + respiration. Sur mobile, on ajoute un marge de sécu supplémentaire
       car le bandeau peut se wrapper sur 2 lignes. */
    #s-transmission .main-content{padding-bottom:160px;}
    .dp-item{text-align:center;}
    .dp-number{font-family:'Lora',serif;font-size:1.8rem;font-weight:700;}
    .dp-number.ok{color:var(--success);}
    .dp-number.warn{color:var(--gold);}
    .dp-number.miss{color:#9ab0a3;}
    .dp-label{font-size:.82rem;color:var(--muted);margin-top:.2rem;}
    .dp-bar{flex:1;}
    .dp-bar-label{display:flex;justify-content:space-between;font-size:.8rem;color:var(--muted);margin-bottom:.5rem;}
    .dp-bar-bg{height:10px;background:var(--border);border-radius:50px;overflow:hidden;}
    .dp-bar-fill{height:100%;background:linear-gradient(90deg,var(--success),var(--accent));border-radius:50px;transition:width .6s;}

    /* ── FAMILLE ── */
    .fam-tabs{display:flex;gap:.4rem;margin-top:0;}
    .proches-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;}
    .proche-card{box-shadow:0 2px 8px rgba(0,0,0,.05);}
    .fam-tab{padding:.4rem 1rem;border-radius:50px;border:1.5px solid var(--border);background:white;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;color:var(--muted);cursor:pointer;transition:all .15s;}
    .fam-tab.active{background:var(--deep);color:white;border-color:var(--deep);}
    .fam-card{background:var(--white);border-radius:16px;padding:1.3rem 1.4rem;border:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.05);cursor:pointer;transition:box-shadow .2s,transform .15s;overflow:hidden;word-break:break-word;overflow-wrap:anywhere;min-width:0;}
    .fam-card:hover{box-shadow:0 6px 20px rgba(46,93,75,.12);transform:translateY(-2px);}
    .fam-avatar{width:40px;height:40px;border-radius:50%;background:var(--deep);color:white;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;flex-shrink:0;}
    .fam-avatar.self{background:var(--gold);}
    .fam-name{font-weight:700;color:var(--text);font-size:.95rem;word-break:break-word;overflow-wrap:anywhere;}
    /* Retrait text-transform:capitalize (15 mai 2026) — produisait "Conjoint(E)" parce que
       le CSS considérait le "e" après "(" comme début de mot. Les labels viennent de
       RELATION_LABEL déjà en sentence case (Père, Mère, Cousin(e), Conjoint(e)…). */
    .fam-relation{font-size:.85rem;color:var(--muted);margin-top:.1rem;}
    .fam-detail{font-size:.85rem;color:var(--muted);margin-top:.25rem;word-break:break-word;overflow-wrap:anywhere;}
    .fam-actions{margin-top:.9rem;display:flex;gap:.4rem;}
    .fam-btn-edit{flex:1;padding:.4rem;border:1px solid var(--border);border-radius:8px;background:none;cursor:pointer;font-size:.8rem;color:var(--deep);transition:background .15s;}
    .fam-btn-edit:hover{background:var(--light);}
    .fam-btn-del{padding:.4rem .65rem;border:1px solid #fecaca;border-radius:8px;background:none;cursor:pointer;font-size:.8rem;color:var(--danger);}
    /* Arbre généalogique */
    .tree-wrap{display:flex;flex-direction:column;align-items:center;gap:0;padding-bottom:2rem;}
    .tree-gen{display:flex;flex-direction:column;align-items:center;width:100%;}
    .tree-gen-label{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem;margin-top:1.4rem;}
    .tree-gen-row{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;}
    .tree-node{background:var(--white);border:1.5px solid var(--border);border-radius:14px;padding:.9rem 1.1rem;text-align:center;min-width:124px;max-width:170px;cursor:pointer;transition:all .18s;position:relative;}
    .tree-node:hover{border-color:var(--accent);box-shadow:0 4px 16px rgba(46,93,75,.12);transform:translateY(-2px);}
    .tree-node.self-node{border-color:var(--gold);background:#fdf6ee;}
    .tree-node.parent-direct{border-color:#90b8d4;background:#eef5fa;}
    .tree-node.deceased{border-color:var(--gold);border-width:1.5px;}
    .tree-node-av{width:60px;height:60px;border-radius:50%;background:var(--deep);color:white;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;margin:0 auto .55rem;overflow:hidden;border:1.5px solid var(--border);}
    .tree-node-av.self{background:var(--gold);border-color:var(--gold);}
    .tree-node.deceased .tree-node-av{border-color:var(--gold);}
    .tree-node-av img{width:100%;height:100%;object-fit:cover;display:block;}
    .tree-node-name{font-family:'Lora',serif;font-size:.98rem;font-weight:700;color:var(--text);line-height:1.25;}
    /* Retrait text-transform:capitalize (15 mai 2026, lot 2) — même bug que .fam-relation :
       CSS capitalize considère le "e" après "(" comme début de mot → "Conjoint(E)". Les
       labels viennent de RELATION_LABEL déjà en sentence case. */
    .tree-node-rel{font-size:.78rem;color:var(--muted);margin-top:.15rem;}
    .tree-node-flower{position:absolute;top:6px;right:8px;color:var(--gold);font-size:.95rem;line-height:1;pointer-events:none;}
    .tree-connector{width:2px;height:32px;background:var(--border);margin:0 auto;}

    /* ── HISTOIRES ── */
    .story-existing{margin-bottom:2rem;}
    .story-existing h3{font-family:'Lora',serif;font-size:1.05rem;color:var(--deep);margin-bottom:1.2rem;}
    .sd-item{padding:.75rem 1.1rem;font-size:.9rem;font-weight:500;color:var(--deep);cursor:pointer;transition:background .15s;border-bottom:1px solid rgba(46,93,75,.07);}
    .sd-item:last-child{border-bottom:none;}
    .sd-item:hover{background:var(--light);}
    .sd-disabled{opacity:.55;}
    .docsimportants-items{display:flex;flex-direction:column;gap:.15rem;}
    .docimp-row{display:flex;align-items:center;gap:.5rem;padding:.45rem .6rem;border-radius:8px;transition:background .15s;font-size:.88rem;color:var(--text);line-height:1.5;}
    .docimp-row:hover{background:var(--bg);}
    /* Checkbox passée à 22px (15 mai 2026, Lot 2 a11y) — la zone tactile native du
       checkbox est très petite par défaut, problématique pour les seniors sur tablette. */
    .docimp-row input[type="checkbox"]{accent-color:var(--accent);width:22px;height:22px;min-width:22px;cursor:pointer;}
    .docimp-row input:checked~.docimp-label{text-decoration:line-through;color:var(--muted);}
    .docimp-label{flex:1;cursor:pointer;}
    /* Bouton paperclip "joindre" — passé de 26x26 à 32x32 (desktop) / 44x44 (mobile) le
       15 mai 2026 pour faciliter le ciblage tactile sur l'écran « Ce que la famille cherchera » (ex-check-list succession). */
    .docimp-add{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1.5px dashed var(--border);background:none;color:var(--muted);font-size:1rem;cursor:pointer;transition:all .15s;flex-shrink:0;}
    .docimp-add:hover{border-color:var(--accent);color:var(--accent);background:rgba(104,168,138,.06);}
    @media(max-width:768px){
      .docimp-add{width:44px;height:44px;font-size:1.1rem;}
      .coll-delete-btn,.coll-rename-btn,.coll-eye-btn{width:44px;height:44px;font-size:1rem;opacity:1;background:rgba(0,0,0,.65);}
      .coll-rename-btn{right:3.5rem;}
      .coll-eye-btn{right:6.4rem;}
    }
    .docimp-files{display:flex;flex-wrap:wrap;gap:.3rem;margin-left:2.6rem;margin-bottom:.2rem;}
    .docimp-file-tag{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;color:var(--mid);background:rgba(104,168,138,.08);padding:.2rem .6rem;border-radius:50px;}
    .docimp-file-tag i{cursor:pointer;font-size:.7rem;color:var(--muted);}
    .docimp-file-tag i:hover{color:#c05050;}

    /* V0 Biographe — Mosaïque souvenirs : 2 col desktop / 1 col mobile (≤768px) */
    .stories-list{display:grid;grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));gap:.7rem;align-items:start;}
    @media(max-width:768px){.stories-list{grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:.6rem;}}
    @media(max-width:480px){.stories-list{grid-template-columns:1fr;gap:.5rem;}}
    /* Onglets carnets — compactés 2 mai 2026 pour faire tenir 8 entrées sur une ligne */
    .souvenirs-tabs{display:flex;gap:.15rem;margin-bottom:.6rem;flex-wrap:nowrap;border-bottom:1px solid var(--border);padding-bottom:.15rem;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch;}
    .souvenirs-tabs::-webkit-scrollbar{height:3px;}
    .souvenirs-tabs::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px;}
    .souvenirs-tab{background:none;border:none;cursor:pointer;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:500;color:var(--muted);padding:.4rem .55rem;border-radius:8px 8px 0 0;transition:color .15s, background .15s;display:inline-flex;align-items:center;gap:.25rem;position:relative;flex-shrink:0;white-space:nowrap;}
    .souvenirs-tab:hover{color:var(--deep);background:var(--bg);}
    .souvenirs-tab.active{color:var(--deep);font-weight:600;}
    .souvenirs-tab.active::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);border-radius:2px;}
    .souvenirs-tab i{font-size:.9rem;}
    .souvenirs-tab-count{font-size:.7rem;font-weight:500;color:var(--muted);margin-left:.1rem;}
    .souvenirs-tab.active .souvenirs-tab-count{color:var(--accent);}
    /* Tuiles-carnets (Par personne / Par objet) */
    .carnets-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:.8rem;}
    @media(max-width:480px){.carnets-grid{grid-template-columns:1fr;gap:.6rem;}}
    .carnet-tile{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:1rem;cursor:pointer;transition:border-color .2s, box-shadow .2s, transform .2s;display:flex;flex-direction:column;gap:.55rem;min-width:0;}
    .carnet-tile:hover{border-color:var(--accent);box-shadow:0 6px 20px rgba(26,52,41,.10);transform:translateY(-1px);}
    .carnet-tile-head{display:flex;align-items:center;gap:.7rem;min-width:0;}
    .carnet-tile-avatar{width:44px;height:44px;border-radius:50%;background:var(--deep);color:white;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700;flex-shrink:0;overflow:hidden;}
    .carnet-tile-avatar img{width:100%;height:100%;object-fit:cover;}
    .carnet-tile-avatar.obj{background:var(--light);color:var(--accent);font-size:1.3rem;}
    .carnet-tile-body{flex:1;min-width:0;}
    .carnet-tile-name{font-family:'Lora',serif;font-size:.98rem;font-weight:600;color:var(--deep);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .carnet-tile-sub{font-size:.78rem;color:var(--muted);margin-top:.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .carnet-tile-count{font-size:.75rem;color:var(--accent);font-weight:600;margin-top:.15rem;}
    .carnet-tile-preview{font-size:.85rem;color:var(--muted);line-height:1.5;border-top:1px dashed var(--border);padding-top:.5rem;margin-top:.1rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
    /* En-tête d'un carnet ouvert */
    .carnet-open-header{display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;padding:.7rem .9rem;background:var(--bg);border-radius:12px;border-left:3px solid var(--accent);}
    .carnet-open-back{background:none;border:none;cursor:pointer;color:var(--muted);padding:.3rem .55rem;border-radius:8px;font-family:inherit;font-size:.85rem;display:inline-flex;align-items:center;gap:.25rem;}
    .carnet-open-back:hover{color:var(--deep);background:var(--white);}
    .carnet-open-title{font-family:'Lora',serif;font-size:1rem;font-weight:600;color:var(--deep);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .carnet-open-count{font-size:.8rem;color:var(--muted);flex-shrink:0;}
    /* Card souvenir — hauteur uniforme (10 mai 2026)
       Toutes les cards ont la même silhouette : photo (ou placeholder) 160px,
       titre clamp 2 lignes, extrait clamp 2 lignes, crayon poussé en bas par
       margin-top:auto. Les souvenirs sans photo affichent un placeholder
       pastel avec l'icône type en grand → grille parfaitement alignée. */
    .souvenir-card{background:var(--white);border-radius:10px;padding:.5rem .7rem .55rem;border:1px solid var(--border);cursor:pointer;transition:border-color .2s, box-shadow .2s, transform .2s;display:flex;flex-direction:column;gap:.3rem;min-width:0;overflow:hidden;height:172px;}
    /* 31 mai 2026 — rééquilibrage esthétique (demande Pierre) : vignette amincie
       (80→52px) pour rendre la hiérarchie au titre, icône-type plus petite et
       plus discrète. Une seule icône-type (le doublon devant le titre est retiré
       côté JS), et la plume remplace le crayon pour ne pas confondre avec "modifier". */
    .souvenir-card-thumb{margin:-.5rem -.7rem .4rem;height:52px;background:#f0efe9 center/cover no-repeat;flex-shrink:0;}
    .souvenir-card-thumb-placeholder{display:flex;align-items:center;justify-content:center;font-size:1.15rem;line-height:1;background:linear-gradient(135deg,#f7f3ec 0%,#ede4cf 100%);}
    .souvenir-card-thumb-placeholder i{opacity:.5;}
    .souvenir-card:hover{border-color:var(--accent);box-shadow:0 4px 14px rgba(26,52,41,.08);transform:translateY(-1px);}
    .souvenir-card-header{display:flex;align-items:flex-start;gap:.5rem;}
    .souvenir-card-badge{font-size:1.1rem;flex-shrink:0;line-height:1;margin-top:.05rem;}
    .souvenir-card-title{flex:1;min-width:0;font-family:'Lora',serif;font-size:.92rem;font-weight:600;color:var(--deep);line-height:1.25;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
    .souvenir-card-excerpt{font-size:.85rem;color:var(--muted);line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
    .souvenir-card-ctx{font-size:.78rem;color:var(--accent);font-weight:600;display:inline-flex;align-items:center;gap:.3rem;line-height:1.3;background:rgba(104,168,138,.08);border:1px solid rgba(104,168,138,.25);padding:.2rem .55rem;border-radius:999px;cursor:pointer;transition:background .15s, border-color .15s;align-self:flex-start;max-width:100%;}
    .souvenir-card-ctx:hover{background:rgba(104,168,138,.18);border-color:rgba(104,168,138,.45);}
    .souvenir-card-ctx i{font-size:.95rem;flex-shrink:0;}
    .souvenir-card-ctx span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .souvenir-card-footer{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding-top:.3rem;border-top:1px solid var(--bg);margin-top:auto;}
    .souvenir-card-date{font-size:.78rem;color:var(--muted);}
    .souvenir-card-actions{display:flex;gap:.1rem;}
    .souvenir-card-actions button{background:none;border:none;cursor:pointer;color:#ccc;font-size:.95rem;padding:.3rem;border-radius:6px;transition:color .15s, background .15s;}
    .souvenir-card-actions button:hover{color:var(--accent);background:var(--bg);}
    .souvenir-card-actions button[aria-label="Supprimer"]:hover{color:var(--danger);}
    /* Mobile (2 juin 2026, demande Pierre) : on RETIRE la vignette photo des cartes
       de souvenirs sur téléphone (une bande de 52px ne montrait qu'un bout de la photo).
       Cartes titre + texte, hauteur libre (grille 1 colonne sur mobile → pas d'alignement à tenir).
       Desktop conserve la vignette fine (choix du 31 mai). */
    @media(max-width:480px){.souvenir-card{padding:.7rem .85rem;height:auto;}.souvenir-card-thumb{display:none;}.souvenir-card-title{font-size:.95rem;}.souvenir-card-excerpt{font-size:.82rem;-webkit-line-clamp:2;}}

    /* ==================== LE CLASSEUR ==================== */
    .classeur-header-progress{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:1rem 1.2rem;margin-bottom:1.2rem;display:flex;align-items:center;gap:1rem;}
    .classeur-header-progress-label{font-size:.85rem;color:var(--deep);font-weight:500;flex-shrink:0;}
    .classeur-header-progress-bar{flex:1;height:8px;background:var(--bg);border-radius:4px;overflow:hidden;}
    .classeur-header-progress-fill{height:100%;background:linear-gradient(90deg, var(--accent), var(--deep));border-radius:4px;transition:width .4s ease;}
    .classeur-header-progress-count{font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0;}

    /* V2 — Wrapper grid commun aux tiles + bandeau export, pour que le bouton
       d'export se place sur la cellule libre à côté de la dernière carte
       quand le nombre de cartes est impair (ex: 7 dossiers en 2 colonnes). */
    .classeur-grid-wrap{display:grid;grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));gap:.6rem;margin-bottom:1rem;align-items:stretch;}
    /* 31 mai 2026 — un peu d'air entre l'entête du Carnet et les cartes (demande Pierre). */
    #classeur-accueil .page-header{margin-bottom:1.7rem;}
    .classeur-tiles{display:contents;}
    .classeur-tile{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:.7rem .85rem;cursor:pointer;transition:border-color .2s, transform .15s, box-shadow .2s;display:flex;flex-direction:column;gap:.35rem;min-height:92px;font:inherit;color:inherit;text-align:left;width:100%;font-family:'Inter',sans-serif;}
    .classeur-tile:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 3px 12px rgba(0,0,0,.05);}
    .classeur-tile-head{display:flex;align-items:center;gap:.55rem;}
    .classeur-tile-icon{width:28px;height:28px;border-radius:8px;background:rgba(104,168,138,.12);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
    .classeur-tile-title{font-family:'Lora',serif;font-size:.95rem;color:var(--deep);font-weight:600;line-height:1.15;}
    /* Intro carte Classeur (15 mai 2026) — clamp passé de 1 à 2 lignes pour limiter les
       troncatures au milieu d'une phrase, taille remontée pour lisibilité (.75 → .85rem). */
    .classeur-tile-intro{font-size:.85rem;color:var(--muted);line-height:1.45;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
    .classeur-tile-foot{display:flex;align-items:center;gap:.5rem;}
    .classeur-tile-progress{flex:1;height:4px;background:var(--bg);border-radius:3px;overflow:hidden;}
    .classeur-tile-progress-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .3s ease;}
    .classeur-tile-count{font-size:.7rem;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:500;}
    /* Variante "dossier libre" (Autres documents) — pas de progression à atteindre,
       on signale différemment (couleur or, weight 600). */
    .classeur-tile-count-free{color:var(--gold);font-weight:600;}

    /* Bandeau export bas (legacy, conservé pour autres pages) */
    .classeur-export-bar{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;padding:.4rem;}
    .classeur-export-hint{font-size:.7rem;color:var(--muted);text-align:center;margin:0;line-height:1.3;}

    /* V3 — bouton export en haut à droite, discret */
    .classeur-export-btn-top{
      display:inline-flex;align-items:center;gap:.4rem;
      padding:.45rem .9rem;border:1px solid rgba(150,105,63,.3);
      background:transparent;color:var(--gold);
      border-radius:50px;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:500;
      cursor:pointer;transition:all .2s;flex-shrink:0;
    }
    .classeur-export-btn-top:hover:not(:disabled){background:rgba(150,105,63,.08);border-color:var(--gold);}
    .classeur-export-btn-top:active:not(:disabled){transform:scale(.98);}
    .classeur-export-btn-top:disabled{opacity:.45;cursor:not-allowed;}
    .classeur-export-btn-top i{font-size:.95rem;}
    @media (max-width:520px){.classeur-export-btn-top span{display:none;}}

    /* V2 (1er mai 2026) — 3 cartes visibles + toggle pour les autres */
    .classeur-tile-hidden{display:none !important;}
    .classeur-more-expanded .classeur-tile-hidden{display:flex !important;}
    .classeur-more-toggle{background:rgba(104,168,138,.05) !important;border-style:dashed !important;}
    .classeur-more-toggle:hover{background:rgba(104,168,138,.1) !important;}
    .classeur-more-expanded .classeur-more-toggle{background:rgba(104,168,138,.08) !important;border-style:solid !important;}
    .classeur-export-btn{background:var(--gold);color:white;border:none;padding:.7rem 1.4rem;border-radius:10px;cursor:pointer;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:600;display:inline-flex;align-items:center;gap:.5rem;transition:background .15s, transform .1s;}
    .classeur-export-btn:hover:not(:disabled){background:#a07350;}
    .classeur-export-btn:active:not(:disabled){transform:scale(.98);}
    .classeur-export-btn:disabled{background:#d4d4d4;color:#555;cursor:not-allowed;opacity:1;}
    .classeur-export-hint{font-size:.85rem;color:var(--muted);text-align:center;}

    /* Vue dossier ouvert */
    .classeur-dossier-header{display:flex;align-items:center;gap:.8rem;margin-bottom:.8rem;padding:.8rem 1rem;background:var(--white);border-radius:12px;border:1px solid var(--border);border-left:3px solid var(--accent);}
    .classeur-dossier-back{background:none;border:1px solid var(--border);color:var(--deep);font-size:.82rem;font-weight:500;padding:.35rem .7rem;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;font-family:'Inter',sans-serif;flex-shrink:0;}
    .classeur-dossier-back:hover{background:var(--bg);}
    .classeur-dossier-title{font-family:'Lora',serif;font-size:1.15rem;color:var(--deep);font-weight:600;flex:1;}
    .classeur-dossier-count{font-size:.78rem;color:var(--muted);flex-shrink:0;}
    .classeur-dossier-bulk{background:none;border:1px solid var(--border);color:var(--deep);font-size:.82rem;font-weight:500;padding:.35rem .65rem;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;font-family:'Inter',sans-serif;flex-shrink:0;}
    .classeur-dossier-bulk:hover{background:var(--bg);border-color:var(--accent);color:var(--accent);}
    .classeur-dossier-bulk i{font-size:1.05rem;}
    .classeur-dossier-intro{background:linear-gradient(135deg, rgba(104,168,138,.06), rgba(46,93,75,.04));border-radius:12px;padding:1rem 1.2rem;font-size:.88rem;color:var(--deep);line-height:1.55;font-family:'Lora',serif;font-style:italic;margin-bottom:1rem;}

    .classeur-items{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;}
    .classeur-item{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:.85rem 1rem;cursor:pointer;transition:border-color .15s, background .15s;display:flex;align-items:center;gap:.8rem;font:inherit;color:inherit;text-align:left;width:100%;font-family:'Inter',sans-serif;}
    .classeur-item:hover{border-color:var(--accent);background:rgba(104,168,138,.02);}
    .classeur-item-state{width:22px;height:22px;border-radius:50%;border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--white);}
    .classeur-item-state.done{background:var(--accent);border-color:var(--accent);color:white;}
    .classeur-item-state.todo{background:var(--white);border-color:var(--border);}
    .classeur-item-state.na{background:#e5e5e5;border-color:#8a8a8a;color:#6b6b6b;}
    .classeur-item-state i{font-size:.75rem;}
    .classeur-item-body{flex:1;min-width:0;}
    .classeur-item-title{font-size:.92rem;color:var(--deep);font-weight:500;line-height:1.3;}
    .classeur-item-title.na{color:#6b6b6b;text-decoration:line-through;}
    .classeur-item-meta{font-size:.75rem;color:var(--muted);margin-top:.15rem;line-height:1.3;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
    .classeur-item-meta .doc-badge{display:inline-flex;align-items:center;gap:.25rem;background:rgba(181,131,90,.1);color:var(--gold);padding:.12rem .45rem;border-radius:6px;font-size:.7rem;font-weight:600;}
    .classeur-item-meta .note-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
    .classeur-item-chevron{color:var(--muted);font-size:1rem;flex-shrink:0;opacity:.5;}
    .classeur-item-custom-badge{background:rgba(181,131,90,.1);color:var(--gold);font-size:.65rem;font-weight:700;padding:.1rem .4rem;border-radius:5px;margin-left:.4rem;vertical-align:middle;}

    .classeur-add-custom{width:100%;background:none;border:2px dashed var(--border);color:var(--muted);padding:.8rem;border-radius:12px;cursor:pointer;font-family:'Inter',sans-serif;font-size:.88rem;font-weight:500;display:flex;align-items:center;justify-content:center;gap:.4rem;transition:border-color .2s, color .2s;}
    .classeur-add-custom:hover{border-color:var(--accent);color:var(--accent);}
    .classeur-disclosure-btn{width:100%;background:rgba(104,168,138,.05);border:1px solid var(--border);border-radius:12px;padding:.7rem 1rem;cursor:pointer;font-family:'Inter',sans-serif;font-size:.85rem;font-weight:500;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:.4rem;transition:border-color .15s, color .15s, background .15s;min-height:44px;}
    .classeur-disclosure-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(104,168,138,.08);}
    .classeur-disclosure-chevron{transition:transform .2s ease;font-size:.9rem;}
    .classeur-disclosure-btn.open .classeur-disclosure-chevron{transform:rotate(180deg);}
    .classeur-disclosure-panel{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;}
    .classeur-disclosure-panel[hidden]{display:none;}

    /* Modal édition d'item */
    .classeur-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:9998;display:flex;align-items:flex-start;justify-content:center;padding:3rem 1rem 1rem;overflow-y:auto;}
    .classeur-modal{background:var(--white);border-radius:16px;max-width:620px;width:100%;padding:1.6rem;box-shadow:0 20px 60px rgba(0,0,0,.3);display:flex;flex-direction:column;gap:1rem;}
    .classeur-modal h3{font-family:'Lora',serif;font-size:1.2rem;color:var(--deep);margin:0;}
    .classeur-modal .explanation{font-size:.88rem;color:var(--muted);line-height:1.55;padding:.7rem .9rem;background:var(--bg);border-radius:8px;border-left:2px solid var(--accent);}
    .classeur-modal label, .classeur-modal .classeur-group-label{font-size:.8rem;font-weight:600;color:var(--deep);display:block;margin-bottom:.3rem;}
    .classeur-modal input[type=text], .classeur-modal textarea{width:100%;border:1px solid var(--border);border-radius:8px;padding:.55rem .7rem;font-family:'Inter',sans-serif;font-size:.88rem;color:var(--deep);box-sizing:border-box;transition:border-color .15s;}
    .classeur-modal input[type=text]:focus, .classeur-modal textarea:focus{outline:none;border-color:var(--accent);}
    .classeur-modal select{width:100%;border:1px solid var(--border);border-radius:8px;padding:.55rem .7rem;font-family:'Inter',sans-serif;font-size:.88rem;color:var(--deep);background-color:white;box-sizing:border-box;cursor:pointer;transition:border-color .15s;}
    .classeur-modal select:focus{outline:none;border-color:var(--accent);}
    .classeur-modal textarea{resize:vertical;min-height:70px;font-family:'Inter',sans-serif;}
    .classeur-state-segmented{display:flex;gap:.4rem;}
    .classeur-state-segmented button{flex:1;background:var(--white);border:1.5px solid var(--border);border-radius:8px;padding:.5rem;font-family:'Inter',sans-serif;font-size:.82rem;color:var(--muted);cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:.3rem;}
    .classeur-state-segmented button:hover{border-color:var(--accent);color:var(--deep);}
    .classeur-state-segmented button.active{background:rgba(104,168,138,.1);border-color:var(--accent);color:var(--accent);font-weight:600;}
    .classeur-state-segmented button.active.state-na{background:#e8e8e8;border-color:#6b6b6b;color:#5a5a5a;}
    .classeur-state-segmented button.active.state-todo{background:rgba(181,131,90,.1);border-color:var(--gold);color:var(--gold);}
    .classeur-doc-zone{display:flex;flex-direction:column;gap:.5rem;}
    .classeur-doc-attached{background:var(--bg);border-radius:8px;padding:.6rem .8rem;display:flex;align-items:center;gap:.6rem;}
    .classeur-doc-attached i{font-size:1.2rem;color:var(--gold);}
    .classeur-doc-attached-name{flex:1;font-size:.82rem;color:var(--deep);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .classeur-doc-attached button{background:none;border:none;color:var(--danger);cursor:pointer;padding:.2rem .4rem;font-size:.9rem;}
    .classeur-doc-upload{border:2px dashed var(--border);border-radius:8px;padding:.8rem;text-align:center;color:var(--muted);font-size:.82rem;cursor:pointer;transition:border-color .15s, color .15s;}
    .classeur-doc-upload:hover{border-color:var(--accent);color:var(--accent);}
    .classeur-modal-actions{display:flex;gap:.5rem;justify-content:flex-end;padding-top:.5rem;border-top:1px solid var(--border);}
    .classeur-modal-actions button{padding:.55rem 1.1rem;border-radius:8px;font-family:'Inter',sans-serif;font-size:.85rem;font-weight:500;cursor:pointer;border:none;transition:background .15s;}
    .classeur-modal-actions .btn-cancel{background:var(--white);border:1px solid var(--border);color:var(--deep);}
    .classeur-modal-actions .btn-cancel:hover{background:var(--bg);}
    .classeur-modal-actions .btn-save{background:var(--accent);color:white;}
    .classeur-modal-actions .btn-save:hover{background:var(--deep);}
    .classeur-modal-actions .btn-delete{background:var(--white);border:1px solid var(--danger);color:var(--danger);margin-right:auto;}
    .classeur-modal-actions .btn-delete:hover{background:rgba(220,53,69,.08);}

    @media(max-width:480px){
      .classeur-tiles{grid-template-columns:1fr;gap:.8rem;}
      .classeur-tile{min-height:auto;}
      .classeur-modal{padding:1.2rem;margin-top:1rem;}
      .classeur-state-segmented{flex-direction:column;}
    }

    .guide-section{margin-bottom:1.5rem;}
    .guide-intro{background:linear-gradient(135deg,rgba(46,93,75,.06),rgba(104,168,138,.06));border:1px solid rgba(46,93,75,.1);border-radius:16px;padding:1.4rem 1.6rem;margin-bottom:0;}
    .guide-intro-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem;}
    .guide-intro-header h2{font-family:'Lora',serif;font-size:1.1rem;color:var(--deep);display:flex;align-items:center;gap:.5rem;}
    .guide-toggle{background:none;border:none;cursor:pointer;color:var(--muted);font-size:.8rem;display:flex;align-items:center;gap:.3rem;font-family:'Inter',sans-serif;}
    .guide-toggle:hover{color:var(--deep);}
    .guide-quote{font-family:'Lora',serif;font-style:italic;color:var(--muted);font-size:.88rem;line-height:1.6;margin-bottom:1rem;}
    .three-keys{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1rem;}
    .key-card{background:var(--white);border-radius:12px;padding:1rem;border:1px solid var(--border);text-align:center;}
    .key-num{width:28px;height:28px;border-radius:50%;background:var(--accent);color:white;font-size:.8rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;margin-bottom:.5rem;}
    .key-card h3{font-size:.82rem;color:var(--deep);margin-bottom:.3rem;}
    .key-card p{font-size:.75rem;color:var(--muted);line-height:1.5;}
    .portes{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem;}
    .porte{display:flex;align-items:center;gap:.4rem;background:var(--white);border:1px solid var(--border);border-radius:10px;padding:.45rem .8rem;font-size:.78rem;color:var(--deep);font-weight:500;}
    .porte i{color:var(--accent);font-size:.9rem;}
    .guide-pdf-link{display:inline-flex;align-items:center;gap:.4rem;color:var(--gold);font-size:.82rem;font-weight:600;text-decoration:none;padding:.4rem .8rem;border:1.5px solid var(--gold);border-radius:8px;transition:all .2s;}
    .guide-pdf-link:hover{background:rgba(181,131,90,.08);}
    .tips-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1.2rem;}
    .tip-card{background:var(--white);border-radius:12px;padding:1rem 1.1rem;border:1px solid var(--border);cursor:pointer;transition:all .2s;}
    .tip-card:hover{border-color:var(--accent);}
    .tip-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;}
    .tip-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}
    .tip-header h4{font-size:.82rem;color:var(--deep);line-height:1.3;}
    .tip-body{font-size:.75rem;color:var(--muted);line-height:1.6;}
    .tip-body.collapsed{display:none;}
    .story-item{background:var(--white);border-radius:var(--radius-card);padding:.8rem 1rem;box-shadow:var(--shadow-1);border:1px solid var(--border);cursor:pointer;transition:all .2s;display:flex;gap:.8rem;align-items:center;}
    .story-item:hover{box-shadow:0 6px 20px rgba(26,52,41,.12);}
    .si-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;}
    .si-icon.libre{background:linear-gradient(135deg,#e2f0ea,#b8ddc8);}
    .si-icon.guided{background:linear-gradient(135deg,#fef9e7,#fdeeba);}
    .si-icon.chrono{background:linear-gradient(135deg,#d8ede2,#a8d4bc);}
    .si-icon.lettre{background:linear-gradient(135deg,#fdf6f0,#f3dfc6);}
    .si-title{font-size:.92rem;font-weight:700;color:var(--deep);}
    .si-type{font-size:.75rem;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.05em;margin-top:.15rem;}
    .si-excerpt{font-size:.9rem;color:var(--muted);margin-top:.4rem;line-height:1.55;}
    .si-date{font-size:.78rem;color:var(--muted);margin-top:.5rem;}

    /* Story creation form */
    .story-form{background:var(--white);border-radius:20px;padding:2.5rem;box-shadow:0 2px 12px rgba(26,52,41,.08);max-width:800px;}
    .story-form h3{font-family:'Lora',serif;font-size:1.15rem;color:var(--deep);margin-bottom:1.5rem;}

    /* ── Album narratif ── */
    .album-tool-btn{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .65rem;border:1.5px solid var(--border);border-radius:8px;background:var(--white);font-family:'Inter',sans-serif;font-size:.78rem;font-weight:500;color:var(--deep);cursor:pointer;transition:all .15s;}
    .album-tool-btn:hover{border-color:var(--accent);color:var(--accent);background:rgba(64,145,108,.05);}
    .album-tool-btn i{font-size:.9rem;}
    .album-block{position:relative;border:1.5px solid var(--border);border-radius:10px;padding:.8rem 1rem;background:var(--white);transition:border-color .15s;}
    .album-block:hover{border-color:var(--accent);}
    .album-block:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(64,145,108,.08);}
    .album-block-header{display:flex;align-items:center;gap:.4rem;margin-bottom:.5rem;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);}
    .album-block-header i{font-size:.85rem;}
    .album-block-remove{position:absolute;top:.5rem;right:.5rem;background:none;border:none;cursor:pointer;color:#ccc;font-size:.9rem;padding:.2rem;border-radius:4px;transition:color .15s;}
    .album-block-remove:hover{color:var(--danger);}
    .album-block textarea,.album-block input[type="text"]{width:100%;border:none;outline:none;font-family:'Inter',sans-serif;font-size:.9rem;color:var(--text);background:transparent;resize:none;}
    .album-block textarea{min-height:60px;line-height:1.6;}
    .album-block textarea::placeholder,.album-block input::placeholder{color:var(--muted);}
    .album-block-meta{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;}
    .album-block-meta input{flex:1;min-width:120px;}
    .album-block.type-date{border-left:3px solid var(--gold);}
    .album-block.type-place{border-left:3px solid var(--accent);}
    .album-block.type-person{border-left:3px solid var(--deep);}
    .album-block.type-quote{border-left:3px solid var(--mid);background:rgba(181,131,90,.03);}
    .album-block.type-photo{border-left:3px solid var(--accent);background:rgba(64,145,108,.02);}
    .album-block-drag{cursor:grab;color:#ccc;font-size:.9rem;padding:.2rem;margin-right:.2rem;}
    .album-block-drag:active{cursor:grabbing;}

    /* Questions guidées */
    .guided-questions{display:flex;flex-direction:column;gap:1.5rem;}
    .gq-item{}
    .gq-question{font-size:.95rem;font-weight:700;color:var(--deep);margin-bottom:.6rem;display:flex;gap:.6rem;align-items:flex-start;}
    .gq-num{width:24px;height:24px;background:var(--deep);color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;flex-shrink:0;margin-top:.05rem;}
    .gq-item textarea{width:100%;padding:.8rem 1rem;border:1.5px solid var(--border);border-radius:10px;font-family:'Inter',sans-serif;font-size:.9rem;color:var(--text);outline:none;resize:vertical;height:80px;transition:border-color .2s;}
    .gq-item textarea:focus{border-color:var(--accent);}


    /* Heir select */
    .heir-select{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.4rem;}
    .heir-toggle{display:flex;align-items:center;gap:.4rem;padding:.35rem .85rem;border:1.5px solid var(--border);border-radius:50px;cursor:pointer;font-size:.8rem;transition:all .2s;background:white;font-family:'Inter',sans-serif;}
    .heir-toggle.on{border-color:var(--success);background:rgba(56,161,105,.08);color:var(--success);font-weight:600;}
    .form-actions{display:flex;gap:.8rem;margin-top:1rem;}

    /* ── HÉRITIERS ── */
    .heirs-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem;margin-bottom:1.2rem;}
    .heir-card{background:var(--white);border-radius:16px;padding:1.1rem 1.2rem;box-shadow:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);border:1px solid var(--border);display:flex;gap:.9rem;align-items:flex-start;}
    .h-av{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:700;color:white;flex-shrink:0;}
    .heir-info h3{font-size:1rem;font-weight:700;color:var(--deep);}
    .heir-info p{font-size:.82rem;color:var(--muted);margin-top:.15rem;}
    .heir-perms{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.7rem;}
    .perm-tag{font-size:.75rem;padding:.22rem .7rem;border-radius:50px;font-weight:600;}
    .perm-tag.full{background:rgba(44,82,130,.1);color:var(--mid);}
    .perm-tag.photo{background:rgba(64,145,108,.1);color:var(--accent);}
    .perm-tag.doc{background:rgba(200,151,74,.1);color:var(--gold);}
    .perm-tag.story{background:rgba(56,161,105,.1);color:var(--success);}
    .heir-actions{display:flex;gap:.5rem;margin-top:.9rem;}
    .btn-sm{padding:.4rem .95rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s;min-height:36px;display:inline-flex;align-items:center;}
    .btn-sm.edit{background:var(--bg);border:none;color:var(--text);}
    .btn-sm.edit:hover{background:var(--border);}
    .btn-sm.danger{background:transparent;border:1px solid #fed7d7;color:var(--danger);}
    .add-heir-card{background:var(--white);border-radius:16px;padding:1.8rem;box-shadow:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);border:1px solid var(--border);}
    .add-heir-card h3{font-family:'Lora',serif;font-size:1.05rem;color:var(--deep);margin-bottom:1.2rem;}
    .heir-form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem;}
    .heir-form-row input{width:100%;padding:.75rem 1rem;border:1.5px solid var(--border);border-radius:10px;font-family:'Inter',sans-serif;font-size:.88rem;outline:none;transition:border-color .2s;}
    .heir-form-row input:focus{border-color:var(--accent);}
    .coll-selector{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.4rem;}
    .coll-chip{padding:.35rem .9rem;border-radius:50px;border:1.5px solid var(--border);font-family:'Inter',sans-serif;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s;background:white;color:var(--muted);}
    .coll-chip:hover{border-color:var(--accent);}
    .coll-chip.on{background:var(--deep);color:white;border-color:var(--deep);}

    /* ── TRANSMISSION ── */
    .transmission-grid{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;}
    .trigger-cards{display:flex;flex-direction:column;gap:.9rem;}
    .trigger-card{background:var(--white);border:2px solid var(--border);border-radius:14px;padding:1.3rem;cursor:pointer;transition:all .2s;}
    .trigger-card:hover{border-color:var(--accent);}
    .trigger-card.selected{border-color:var(--deep);}
    .tc-head{display:flex;align-items:center;gap:.9rem;margin-bottom:.6rem;}
    .tc-icon{font-size:1.4rem;}
    .trigger-card h3{font-size:.92rem;font-weight:700;color:var(--deep);}
    .trigger-card p{font-size:.82rem;color:var(--muted);}
    .radio-dot{width:16px;height:16px;border:2px solid #c8d5cc;border-radius:50%;margin-left:auto;flex-shrink:0;transition:all .2s;}
    .trigger-card.selected .radio-dot{border-color:var(--deep);background:var(--deep);box-shadow:inset 0 0 0 3px white;}
    .preview-card{background:var(--white);border-radius:16px;padding:1.8rem;box-shadow:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);border:1px solid var(--border);}
    .preview-card h3{font-family:'Lora',serif;font-size:1.05rem;color:var(--deep);margin-bottom:1.2rem;}
    .preview-capsule{background:linear-gradient(135deg,var(--deep),var(--mid));border-radius:14px;padding:1.5rem;color:white;text-align:center;margin-bottom:1.2rem;}
    .pc-icon{font-size:2.2rem;margin-bottom:.6rem;}
    .preview-capsule h4{font-family:'Lora',serif;font-size:.95rem;margin-bottom:.4rem;}
    .preview-capsule p{font-size:.8rem;opacity:.7;}
    .preview-recipients{font-size:.85rem;color:var(--muted);}

    /* ── MODAL ── */
    .modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:var(--z-modal);display:none;align-items:center;justify-content:center;}
    .modal-overlay.open{display:flex;}
    .modal{background:var(--white);border-radius:var(--radius-modal);padding:1.5rem;max-width:600px;width:90%;box-shadow:var(--shadow-3);max-height:92vh;max-height:92dvh;overflow-y:auto;}
    .modal.wide{max-width:900px;}
    .modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;}
    .modal-header h3{font-family:'Lora',serif;font-size:1.2rem;color:var(--deep);}
    .modal-close{background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted);}
    .modal-preview{height:140px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:3.5rem;margin-bottom:1rem;background:#f5f5f5;overflow:hidden;}
    .modal-preview img{width:100%;height:100%;object-fit:cover;}
    .modal-meta{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:.8rem;}
    .meta-item{background:var(--bg);border-radius:8px;padding:.5rem .8rem;}
    .mi-label{font-size:.75rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em;}
    .mi-value{font-size:.88rem;color:var(--deep);font-weight:600;margin-top:.15rem;}
    .modal-precious{background:linear-gradient(135deg,rgba(200,151,74,.08),rgba(200,151,74,.03));border:1px solid rgba(200,151,74,.25);border-radius:10px;padding:1rem 1.2rem;margin-bottom:1.2rem;}
    .mp-label{font-size:.75rem;font-weight:700;color:var(--gold);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.05em;}
    .mp-text{font-size:.95rem;color:var(--text);line-height:1.55;}
    .modal-footer{display:flex;gap:.8rem;}

    /* ── FICHE DRAWER (panneau latéral droit, A — unification Arbre+Fiches) ── */
    .fiche-drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:var(--z-modal);opacity:0;pointer-events:none;transition:opacity .22s ease;}
    .fiche-drawer-backdrop.open{opacity:1;pointer-events:auto;}
    .fiche-drawer{position:fixed;top:0;right:0;height:100%;width:400px;max-width:100%;background:var(--white);box-shadow:-12px 0 32px rgba(0,0,0,.18);z-index:calc(var(--z-modal) + 1);transform:translateX(100%);visibility:hidden;transition:transform .25s cubic-bezier(.4,0,.2,1),visibility 0s linear .25s;display:flex;flex-direction:column;overflow:hidden;}
    .fiche-drawer.open{transform:translateX(0);visibility:visible;transition:transform .25s cubic-bezier(.4,0,.2,1),visibility 0s linear 0s;}
    .fiche-drawer-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;border-bottom:1px solid rgba(46,93,75,.08);flex-shrink:0;}
    .fiche-drawer-header h3{font-family:'Lora',serif;font-size:1.15rem;color:var(--deep);margin:0;line-height:1.3;}
    .fiche-drawer-close{background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted);padding:.2rem .4rem;line-height:1;}
    .fiche-drawer-close:hover{color:var(--deep);}
    #fiche-drawer-content{flex:1;overflow-y:auto;padding:1.2rem 1.5rem 1.5rem;}
    @media (max-width:600px){
      .fiche-drawer{width:100%;}
    }
    @media (max-width:767px){
      #famille-toggle-view{display:none;}
    }

    /* ── PARENT TREE MODAL ── */
    #parent-tree-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:var(--z-modal);display:none;align-items:center;justify-content:center;}
    #parent-tree-modal.open{display:flex;}
    .ptm-box{background:var(--white);border-radius:20px;max-width:680px;width:92%;max-height:88vh;max-height:88dvh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:ptmFadeIn .25s ease;}
    @keyframes ptmFadeIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
    @keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
    .ptm-header{display:flex;align-items:center;gap:1rem;padding:1.8rem 2rem 1.2rem;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--white);border-radius:20px 20px 0 0;z-index:1;}
    .ptm-header-av{width:48px;height:48px;border-radius:50%;background:var(--deep);color:white;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.15rem;flex-shrink:0;}
    .ptm-header-info{flex:1;}
    .ptm-header-info h2{font-family:'Lora',serif;font-size:1.15rem;color:var(--deep);margin:0;}
    .ptm-header-info p{font-size:.82rem;color:var(--muted);margin:.15rem 0 0;}
    .ptm-close{background:none;border:none;font-size:1.3rem;cursor:pointer;color:var(--muted);padding:.4rem;border-radius:8px;transition:background .15s;}
    .ptm-close:hover{background:var(--bg);}
    .ptm-body{padding:1.5rem 2rem 2rem;}
    .ptm-parent-card{background:var(--bg);border-radius:14px;padding:.9rem 1.1rem;margin-bottom:1rem;display:grid;gap:.4rem;}
    .ptm-parent-card-item{font-size:.88rem;color:var(--text);line-height:1.5;}
    .ptm-parent-card-item strong{color:var(--deep);margin-right:.4rem;}
    .ptm-section-title{font-size:.88rem;font-weight:700;color:var(--deep);margin-bottom:1rem;}
    .ptm-empty{text-align:center;padding:2.5rem 1rem;color:var(--muted);}
    .ptm-empty-icon{font-size:2.5rem;margin-bottom:.8rem;}
    .ptm-empty p{font-size:.9rem;line-height:1.6;}
    .ptm-schema-alert{background:#fef3cd;border:1px solid #ffc107;border-radius:12px;padding:1.2rem;font-size:.85rem;line-height:1.6;color:#856404;}
    .ptm-schema-alert code{display:block;margin-top:.6rem;background:rgba(0,0,0,.06);padding:.6rem;border-radius:6px;font-size:.78rem;word-break:break-all;}
    .ptm-actions{display:flex;gap:.6rem;margin-top:1.5rem;justify-content:flex-end;}
    .ptm-add-btn-outline{padding:.55rem 1.2rem;border:1.5px solid var(--border);border-radius:10px;background:none;cursor:pointer;font-family:'Inter',sans-serif;font-size:.85rem;font-weight:600;color:var(--muted);transition:all .15s;}
    .ptm-add-btn-outline:hover{border-color:var(--deep);color:var(--deep);}
    .ptm-add-btn{padding:.55rem 1.2rem;border:none;border-radius:10px;background:var(--deep);color:white;cursor:pointer;font-family:'Inter',sans-serif;font-size:.85rem;font-weight:600;transition:background .15s;}
    .ptm-add-btn:hover{background:var(--accent);}
    .ptm-tree-wrap{display:flex;flex-direction:column;align-items:center;gap:0;}
    .ptm-tree-connector{width:2px;height:24px;background:var(--border);margin:0 auto;}
    .ptm-tree-gen{text-align:center;}
    .ptm-tree-gen-label{font-size:.78rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem;}
    .ptm-tree-gen-row{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;}
    .ptm-tree-node{background:var(--white);border:1.5px solid var(--border);border-radius:14px;padding:.8rem 1rem;text-align:center;min-width:100px;max-width:140px;cursor:pointer;transition:all .18s;position:relative;}
    .ptm-tree-node:hover{border-color:var(--accent);box-shadow:0 4px 16px rgba(46,93,75,.12);transform:translateY(-2px);}
    .ptm-tree-node.parent-self{border-color:var(--gold);background:#fdf6ee;}
    .ptm-tree-node.deceased{border-color:var(--gold);}
    .ptm-tree-node-av{width:60px;height:60px;border-radius:50%;background:var(--deep);color:white;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;margin:0 auto .55rem;overflow:hidden;border:1.5px solid var(--border);}
    .ptm-tree-node-av.parent-self{background:var(--gold);border-color:var(--gold);}
    .ptm-tree-node.deceased .ptm-tree-node-av{border-color:var(--gold);}
    .ptm-tree-node-av img{width:100%;height:100%;object-fit:cover;display:block;}
    .ptm-tree-node-name{font-family:'Lora',serif;font-size:.95rem;font-weight:700;color:var(--text);line-height:1.25;}
    .ptm-tree-node-rel{font-size:.75rem;color:var(--muted);margin-top:.15rem;}

    /* ── TOAST ── */
    .toast{position:fixed;bottom:2rem;right:2rem;background:var(--deep);color:white;padding:.9rem 1.4rem;border-radius:12px;font-size:.88rem;font-weight:600;box-shadow:0 8px 24px rgba(0,0,0,.2);transform:translateY(100px);opacity:0;transition:all .3s ease;z-index:var(--z-toast);}
    .toast.show{transform:translateY(0);opacity:1;}
    .toast.success{border-left:4px solid var(--success);}

    /* Mode démo B1 supprimé le 11 mai 2026 (cleanup). Remplacé par un vrai
       compte démo Supabase pour les ateliers (cf. dette tech #8). */
    .upload-zone{border:2px dashed #c8d5cc;border-radius:12px;padding:1.8rem;text-align:center;cursor:pointer;transition:all .2s;margin-bottom:1.2rem;background:var(--bg);}
    .upload-zone:hover{border-color:var(--accent);}
    .uz-icon{font-size:1.8rem;margin-bottom:.5rem;}
    .uz-text{font-size:.9rem;color:var(--muted);}
    .uz-quality{display:inline-flex;align-items:center;gap:.3rem;background:rgba(56,161,105,.1);color:var(--success);font-size:.75rem;font-weight:600;padding:.25rem .7rem;border-radius:50px;margin-top:.6rem;}
    .precious-prompt{background:linear-gradient(135deg,rgba(200,151,74,.08),rgba(200,151,74,.03));border:1.5px solid rgba(200,151,74,.3);border-radius:12px;padding:1.1rem 1.3rem;margin-bottom:1.2rem;}
    .pp-label{font-size:.82rem;font-weight:700;color:var(--gold);margin-bottom:.4rem;}
    .pp-input{width:100%;border:none;background:transparent;font-family:'Inter',sans-serif;font-size:.9rem;color:var(--text);outline:none;resize:none;height:65px;line-height:1.5;}
    .pp-input::placeholder{color:var(--muted);}
    .heirs-mini{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem;}
    .chip-av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;color:white;margin-right:.3rem;}
    .heir-chip{display:flex;align-items:center;font-size:.8rem;background:var(--bg);padding:.35rem .8rem;border-radius:50px;}

    /* ── DRAG & DROP ── */
    .drop-zone-wrap{position:relative;}
    .drop-overlay{position:absolute;inset:0;background:rgba(46,93,75,.12);border:3px dashed var(--accent);border-radius:16px;display:none;align-items:center;justify-content:center;z-index:50;pointer-events:none;transition:all .2s;}
    .drop-overlay.active{display:flex;}
    .drop-overlay-inner{text-align:center;color:var(--deep);}
    .drop-overlay-inner i{font-size:3rem;color:var(--accent);display:block;margin-bottom:.6rem;}
    .drop-overlay-inner span{font-size:1rem;font-weight:700;}
    .drop-overlay-inner small{display:block;font-size:.8rem;color:var(--muted);margin-top:.3rem;}
    #photos-gallery.drag-active .drop-overlay{display:flex;}
    #doc-sections.drag-active .drop-overlay{display:flex;}
    #videos-gallery.drag-active .drop-overlay{display:flex;}
    /* ── Vidéos & Créations ── */
    .tree-chev{transition:transform .2s;}.tree-chev.open{transform:rotate(90deg);}
    /* Card vidéo — hauteur uniforme (10 mai 2026, alignée sur cards souvenir/inventaire).
       Thumb 160px en haut (placeholder dégradé vert + icône si pas de miniature),
       body flex 1 avec clamp 2 lignes sur la légende. */
    .video-card{background:var(--white);border-radius:16px;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);border:1px solid var(--border);cursor:pointer;transition:transform .2s,box-shadow .2s;}
    .video-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(26,52,41,.13);}
    .video-thumb{height:110px;position:relative;overflow:hidden;background:linear-gradient(135deg,#1a3429,var(--deep));display:flex;align-items:center;justify-content:center;}
    .video-thumb img{width:100%;height:100%;object-fit:cover;}
    .video-thumb .play-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.08);transition:background .2s;}
    .video-card:hover .play-overlay{background:rgba(0,0,0,.25);}
    .play-overlay .play-btn{width:22px;height:22px;background:rgba(255,255,255,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.1);transition:transform .2s,background .2s;}
    .video-card:hover .play-btn{transform:scale(1.18);background:rgba(255,255,255,.92);box-shadow:0 3px 10px rgba(0,0,0,.2);}
    .play-btn i{font-size:.7rem;color:var(--deep);margin-left:1px;}
    .video-thumb .vid-duration{position:absolute;bottom:.5rem;right:.5rem;background:rgba(0,0,0,.7);color:white;font-size:.72rem;font-weight:700;padding:.15rem .5rem;border-radius:4px;}
    .video-thumb .vid-size{position:absolute;top:.5rem;right:.5rem;background:rgba(0,0,0,.45);color:white;font-size:.68rem;font-weight:600;padding:.12rem .45rem;border-radius:4px;}
    .video-body{padding:.85rem 1.1rem;display:flex;flex-direction:column;gap:.2rem;}
    .video-title{font-size:.88rem;font-weight:600;color:var(--deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .video-coll{font-size:.75rem;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-top:.15rem;}
    .video-caption{font-size:.88rem;color:var(--text);margin-top:.3rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
    @media(max-width:480px){.video-thumb{height:100px;}}
    .video-player-modal{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:var(--z-video);display:flex;align-items:center;justify-content:center;flex-direction:column;cursor:default;}
    .video-player-modal video{max-width:90vw;max-height:75vh;max-height:75dvh;border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,.6);}
    .video-player-close{position:absolute;top:1.2rem;right:1.5rem;color:rgba(255,255,255,.7);font-size:1.8rem;cursor:pointer;transition:color .2s;}
    .video-player-close:hover{color:white;}
    .video-player-info{color:rgba(255,255,255,.65);margin-top:1rem;text-align:center;max-width:60vw;}
    .video-player-info h3{color:white;font-size:1.1rem;font-weight:600;margin-bottom:.3rem;}
    .video-player-info p{font-size:.92rem;}
    .video-upload-progress{position:fixed;bottom:2rem;right:2rem;background:var(--white);border-radius:14px;box-shadow:0 8px 32px rgba(0,0,0,.15);padding:1.2rem 1.5rem;z-index:2500;min-width:240px;max-width:calc(100% - 2rem);border:1px solid var(--border);}
    .video-upload-progress .bar{height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-top:.6rem;}
    .video-upload-progress .bar-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .3s;}

    /* MODAL Pour saisir collection + photos */
    .collection-modal{background:var(--white);border-radius:20px;padding:2rem;max-width:500px;width:90%;}
    .collection-modal h3{font-family:'Lora',serif;font-size:1.15rem;color:var(--deep);margin-bottom:1.2rem;}
    #hidden-file-input,#hidden-folder-input,#hidden-camera-input{display:none;}

    /* ── RESPONSIVE ── */
    @media(max-width:1200px){
      .stats-row{grid-template-columns:repeat(3,1fr);}
      .dash-grid{grid-template-columns:1fr;}
      .entry-points{grid-template-columns:repeat(2,1fr) !important;}
      .collections-grid{grid-template-columns:repeat(2,1fr);}
      .items-grid{grid-template-columns:repeat(2,1fr);}
      .heirs-grid{grid-template-columns:1fr;}
      /* stories-list already flex-column */
      .transmission-grid{grid-template-columns:1fr;}
      .heir-form-row{grid-template-columns:1fr;}
    }
    @media(max-width:900px){
      .sidebar{width:244px;}
      :root{--sidebar-w:244px;}
      .main-content{padding:1.8rem 2rem;}
      .stats-row{grid-template-columns:repeat(3,1fr);gap:.8rem;}
      .stat-card{padding:1rem;}
      .stat-number{font-size:1.5rem;}
    }
    /* --- Barre de navigation mobile (tab bar) --- */
    .mob-tabbar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:var(--z-tabbar);background:var(--white);border-top:1px solid var(--border);padding:8px calc(.6rem + env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,8px) calc(.6rem + env(safe-area-inset-left,0px));justify-content:space-around;}
    .mob-tabbar .mt-item{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.72rem;color:var(--muted);cursor:pointer;padding:8px 10px;border-radius:var(--radius-sm);transition:color .2s;min-height:48px;justify-content:center;}
    .mob-tabbar .mt-item.active,.mob-tabbar .mt-item:active{color:var(--accent);}
    .mob-tabbar .mt-item i{font-size:1.4rem;}
    @media(max-width:768px){
      :root{--sidebar-w:0px;}
      .sidebar{display:none !important;width:0 !important;}
      .mob-tabbar{display:flex !important;}
      /* 31 mai 2026 — Écran d'auth sur mobile (iPhone) : on est déconnecté, donc on
         masque la tab bar (sinon elle recouvre le bouton « Créer mon compte »), et on
         aligne en haut + défilement pour que le formulaire d'inscription (5 champs)
         tienne entièrement. #s-login et #mob-tabbar sont frères dans #app-root. */
      #s-login.active ~ #mob-tabbar{display:none !important;}
      #s-login{justify-content:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1.4rem 1rem calc(1.4rem + env(safe-area-inset-bottom,8px));}
      .main-content{margin-left:0 !important;width:100% !important;max-width:100% !important;padding:1.2rem .8rem 5rem .8rem !important;overflow-x:hidden;overflow-x:clip;box-sizing:border-box !important;}
      .main-content>*{max-width:100% !important;box-sizing:border-box !important;}
      /* ── Forcer tous les enfants de grille à ne pas déborder ── */
      .main-content *{min-width:0 !important;max-width:100%;box-sizing:border-box;}
      .screen{max-width:100% !important;overflow-x:hidden !important;overflow-x:clip !important;width:100% !important;}
      .app-shell{max-width:100% !important;overflow-x:hidden !important;overflow-x:clip !important;}
      .main-content img,.main-content video,.main-content canvas{max-width:100%;height:auto;}
      /* ── Override global : toutes les grilles inline 1fr 1fr → 1fr sur mobile ── */
      [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important;}
      [style*="grid-template-columns: 1fr 1fr"]{grid-template-columns:1fr !important;}
      /* ── Override global : grilles inline avec minmax > 160px → 1fr ── */
      [style*="minmax(200px"]{grid-template-columns:1fr !important;}
      [style*="minmax(240px"]{grid-template-columns:1fr !important;}
      [style*="minmax(280px"]{grid-template-columns:1fr !important;}
      .stats-row{grid-template-columns:repeat(2,1fr) !important;gap:.7rem;}
      .collections-grid{grid-template-columns:1fr 1fr !important;}
      .items-grid{grid-template-columns:1fr 1fr !important;}
      .modal{padding:1.5rem;width:95% !important;max-width:95vw !important;}
      .page-header{flex-direction:column !important;gap:1rem;}
      .page-header h1{font-size:1.3rem;}
      .doc-progress{left:0;}
      /* Mobile : le bandeau .doc-progress est plus haut (flex-wrap possible) ET
         la tabbar mobile est collée en bas au-dessus — on réserve davantage
         d'espace pour garantir que "Enregistrer mes volontés" reste cliquable. */
      #s-transmission .main-content{padding-bottom:220px;}
      /* V (12 mai 2026) — réserve générique pour la tab bar mobile (~70 px) sur
         tous les écrans, sinon les boutons d'actions de bas de page sont coupés
         (ex. Ajouter un proche, Sauvegarder un objet, Envoyer un souvenir...). */
      .main-content{padding-bottom:90px !important;}
      #s-transmission .main-content{padding-bottom:220px !important;}
      .three-keys{grid-template-columns:1fr !important;}
      .tips-row{grid-template-columns:1fr !important;}
      .pricing-cards{grid-template-columns:1fr !important;}
      .dash-grid{grid-template-columns:1fr !important;}
      .famille-grid{grid-template-columns:1fr 1fr !important;}
      .proches-grid{grid-template-columns:1fr !important;}
      .story-actions-grid{grid-template-columns:1fr !important;}
      .suggestion-card{flex-direction:column !important;align-items:flex-start !important;}
      #compte-info-grid{grid-template-columns:1fr !important;}
      /* Masque le bouton boussole flottant : redondant avec la tabbar et chevauche l'icône Compte */
      #home-compass-btn{display:none !important;}
      /* ── Vue Famille mobile unifiée : liste par génération avec fiches complètes ── */
      .fam-tabs{display:none !important;}
      #famille-arbre{display:none !important;}
      .famille-mobile-list{display:flex;flex-direction:column;gap:.6rem;margin-top:.4rem;}
      .famille-mobile-cards{display:none;flex-direction:column;gap:.6rem;padding-top:.5rem;}
      .arbre-gen-section.open .famille-mobile-cards{display:flex;}
      .arbre-gen-chevron{margin-left:auto;transition:transform .2s ease;color:var(--muted);font-size:1rem;}
      .arbre-gen-section.open .arbre-gen-chevron{transform:rotate(180deg);}
      /* Classes résiduelles pour la vue arbre mobile (gardées pour compat si écran desktop rétréci) */
      .arbre-mobile-list{display:flex;flex-direction:column;gap:1.1rem;margin-top:.4rem;}
      .arbre-gen-section{display:flex;flex-direction:column;gap:.5rem;}
      .arbre-gen-header{position:sticky;top:0;background:var(--bg);padding:.6rem .3rem;z-index:10;display:flex;align-items:center;gap:.5rem;border-bottom:1px solid var(--border);cursor:pointer;user-select:none;}
      .arbre-gen-title{font-family:'Lora',serif;font-size:1rem;font-weight:700;color:var(--deep);}
      .arbre-gen-count{font-size:.78rem;color:var(--muted);}
      .arbre-gen-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;}
      /* Couples : encadrement bleu clair pour montrer visuellement que les deux nœuds vont ensemble */
      .couple-frame{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.4rem;background:#e8f1f5;border:1px solid #c8dde7;border-radius:14px;padding:.5rem;}
      .couple-frame .tree-node{background:white;}
      .couple-heart{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:white;color:var(--gold-light);border:1.5px solid var(--gold-light);font-size:.85rem;flex-shrink:0;}
      .arbre-mobile-list .tree-node{min-width:0 !important;max-width:none !important;padding:.7rem .5rem;}
      .arbre-mobile-date{font-size:.7rem;color:var(--muted);margin-top:.2rem;}
      .arbre-mobile-nom{font-weight:500;font-size:.78rem;color:var(--muted);line-height:1.2;}
    }
    @media(max-width:360px){
      .arbre-gen-grid{grid-template-columns:1fr !important;}
    }
    @media(max-width:480px){
      .stats-row{grid-template-columns:1fr 1fr;}
      .collections-grid{grid-template-columns:1fr;}
      .items-grid{grid-template-columns:1fr;}
      .tree-gen-row{flex-direction:column;align-items:center;}
      .login-box{padding:2rem 1.5rem;max-width:95vw;}
      #btn-camera{display:inline-flex !important;}
      .btn-add{font-size:.82rem !important;padding:.6rem 1rem !important;min-height:44px;}
      .modal{max-height:90vh;max-height:90dvh;margin:5vh auto;max-width:95vw;padding:1.2rem;}
      .contact-confiance-card div[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr !important;}
      .drop-overlay{display:none !important;}
      .heirs-grid{grid-template-columns:1fr;}
      .transmission-grid{grid-template-columns:1fr;}
      .heir-form-row{grid-template-columns:1fr;}
      .fam-tabs{flex-wrap:wrap;}
      .filter-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;}
      .view-toggle{overflow-x:auto;flex-wrap:nowrap;}
      .famille-grid{grid-template-columns:1fr !important;}
    }


    /* ── FREEMIUM ── */
    .plan-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.65rem;font-weight:700;padding:.15rem .5rem;border-radius:50px;letter-spacing:.03em;text-transform:uppercase;}
    .plan-badge.gratuit{background:rgba(255,255,255,.15);color:rgba(255,255,255,.7);}
    .plan-badge.premium{background:var(--gold);color:white;}
    .upgrade-banner{background:linear-gradient(135deg,rgba(181,131,90,.06),rgba(181,131,90,.02));border:1px solid rgba(181,131,90,.15);border-radius:12px;padding:.8rem 1.2rem;display:flex;align-items:center;gap:.8rem;margin-bottom:1rem;cursor:pointer;transition:all .2s;}
    .upgrade-banner:hover{border-color:var(--gold);background:rgba(181,131,90,.08);}
    .btn-upgrade{background:var(--gold);color:white;border:none;padding:.55rem 1.4rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.85rem;font-weight:700;cursor:pointer;transition:all .2s;white-space:nowrap;}
    .btn-upgrade:hover{background:#a0733f;transform:translateY(-1px);}
    .quota-bar{height:4px;background:var(--bg);border-radius:50px;overflow:hidden;margin-top:.3rem;}
    .quota-bar-fill{height:100%;border-radius:50px;transition:width .5s ease;}
    .quota-bar-fill.ok{background:var(--accent);}
    .quota-bar-fill.warn{background:var(--gold);}
    .quota-bar-fill.full{background:var(--danger);}
    #upgrade-modal,#checkout-modal,#gift-redeem-modal,#biographe-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:10000;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s;}
    #upgrade-modal.visible,#checkout-modal.visible,#gift-redeem-modal.visible,#biographe-modal.visible{opacity:1;pointer-events:auto;}
    #upgrade-modal .modal-box,#checkout-modal .modal-box,#gift-redeem-modal .modal-box{background:white;border-radius:20px;padding:2rem;max-width:440px;width:90%;max-height:90vh;max-height:90dvh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.2);transform:scale(.95);transition:transform .25s;}
    #upgrade-modal.visible .modal-box,#checkout-modal.visible .modal-box,#gift-redeem-modal.visible .modal-box{transform:scale(1);}

    /* ── BIOGRAPHE V0 WIZARD (Lot C4) ── */
    #biographe-modal .biographe-box{background:white;border-radius:20px;padding:2rem;max-width:620px;width:92%;max-height:90vh;max-height:90dvh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.2);transform:scale(.95);transition:transform .25s;position:relative;}
    #biographe-modal.visible .biographe-box{transform:scale(1);}
    #biographe-modal .modal-close{position:absolute;top:1rem;right:1rem;background:none;border:none;font-size:1.3rem;color:var(--muted);cursor:pointer;padding:.3rem .5rem;border-radius:6px;line-height:1;}
    #biographe-modal .modal-close:hover{background:var(--bg);color:var(--deep);}
    .biographe-titre{font-family:'Lora',serif;font-size:1.25rem;color:var(--deep);text-align:center;margin:.5rem 0 1.5rem;line-height:1.4;}
    .biographe-cta-hasard{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;padding:1.1rem 1.5rem;background:linear-gradient(135deg,#f4d58d,#c4a574);color:#2e1f0a;border:none;border-radius:14px;font-family:'Inter',sans-serif;font-size:1.05rem;font-weight:700;cursor:pointer;transition:all .2s;box-shadow:0 4px 14px rgba(196,165,116,.3);}
    .biographe-cta-hasard:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(196,165,116,.4);}
    /* 30 mai 2026 — sparkle et arrow passés en Phosphor (ph-sparkle, ph-arrow-right)
       au lieu d'emoji ✨ et caractère →. Taille alignée sur le label gras. */
    .biographe-cta-sparkle{font-size:1.15rem;color:#7d5733;}
    .biographe-cta-arrow{margin-left:.3rem;font-size:1.05rem;}
    .biographe-ou{text-align:center;color:var(--muted);font-size:.85rem;margin:1.3rem 0 .7rem;}
    .biographe-portes{display:grid;grid-template-columns:repeat(5, 1fr);gap:.5rem;}
    .biographe-porte{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;padding:.7rem .4rem;background:var(--white);border:1.5px solid var(--border);border-radius:10px;font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;color:var(--deep);cursor:pointer;transition:all .2s;text-align:center;line-height:1.2;min-height:78px;}
    .biographe-porte:hover{border-color:var(--accent);color:var(--accent);}
    .biographe-porte i{font-size:1.2rem;color:var(--accent);}
    .biographe-porte span{display:block;}
    /* Refonte 29 mai 2026 — porte "J'ai mon idée" en grand format horizontal, 2 portes principales */
    .biographe-porte-large{flex-direction:row;width:100%;padding:1rem 1.4rem;gap:.7rem;justify-content:flex-start;font-size:1rem;min-height:64px;}
    .biographe-porte-large i{font-size:1.35rem;}
    .biographe-porte-large span{flex:1;text-align:left;}
    .biographe-porte-arrow{font-size:1.1rem !important;color:var(--muted) !important;transition:color .15s,transform .15s;}
    .biographe-porte-large:hover .biographe-porte-arrow{color:var(--accent) !important;transform:translateX(3px);}
    /* Toggle "+ Autres façons d'entrer" */
    /* 30 mai 2026 (Direction B, 2e passe) — Pierre : "remettre les icones en
       choix, dont j'ai mon idée". J'ai mon idée rejoint la grille → 6 cartes.
       Grille 3×2 sur desktop (cartes confortables ~190 px), 2×3 sur mobile.
       Avant : repeat(5, 1fr) + bouton "J'ai mon idée" pleine largeur au-dessus. */
    .biographe-portes-extra{grid-template-columns:repeat(3, 1fr);margin-top:1.4rem;}
    @media(max-width:560px){
      .biographe-portes-extra{grid-template-columns:repeat(2, 1fr);}
    }
    /* Listes Objet / Personne dans le wizard Biographe (2026-04-19) */
    .biographe-entity-list{display:flex;flex-direction:column;gap:.5rem;max-height:50vh;overflow-y:auto;padding:.2rem;}
    .biographe-entity-item{display:flex;align-items:center;gap:.8rem;padding:.75rem .9rem;background:var(--white);border:1.5px solid var(--border);border-radius:12px;font-family:'Inter',sans-serif;text-align:left;cursor:pointer;transition:all .2s;width:100%;}
    .biographe-entity-item:hover{border-color:var(--accent);background:var(--light);}
    .biographe-entity-item > i{font-size:1.3rem;color:var(--accent);flex-shrink:0;}
    .biographe-entity-item-body{flex:1;min-width:0;}
    .biographe-entity-item-name{font-weight:600;font-size:.92rem;color:var(--deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .biographe-entity-item-sub{font-size:.78rem;color:var(--muted);margin-top:.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    /* Contexte Objet / Personne en haut de la rédaction */
    .biographe-entity-ctx{display:flex;align-items:center;gap:.9rem;padding:.8rem 1rem;background:var(--light);border-radius:12px;margin-bottom:.8rem;}
    .biographe-entity-icon{width:44px;height:44px;border-radius:50%;background:rgba(181,131,90,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
    .biographe-entity-icon i{font-size:1.3rem;color:var(--accent);}
    .biographe-entity-body{flex:1;min-width:0;}
    .biographe-entity-name{font-family:'Lora',serif;font-size:1rem;font-weight:600;color:var(--deep);}
    .biographe-entity-sub{font-size:.82rem;color:var(--muted);margin-top:.1rem;}
    .biographe-top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;}
    .biographe-back,.biographe-reroll{background:none;border:none;color:var(--muted);font-family:'Inter',sans-serif;font-size:.82rem;cursor:pointer;padding:.4rem .6rem;border-radius:6px;}
    .biographe-back:hover,.biographe-reroll:hover{background:var(--bg);color:var(--deep);}
    /* 30 mai 2026 — Pierre : "en plus petit, au dessus du titre". Le contexte
       passe en format discret : pas de fond ni de bordure colorée, juste un
       petit liseré gauche et un texte italique gris en bandeau d'intro. */
    .biographe-contexte{margin:0 0 .55rem;padding:.15rem 0 .15rem .9rem;border-left:2px solid rgba(150,105,63,.35);}
    .biographe-invitation-text{font-family:'Lora',serif;font-size:.88rem;color:var(--muted);line-height:1.5;font-style:italic;}
    /* Badge "Suggéré pour vous" — invitations pondérées pour grands-parents (2026-04-21) */
    .biographe-suggested-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:600;color:#8a6a1a;background:rgba(244,213,141,.35);border:1px solid rgba(196,165,116,.4);padding:.2rem .55rem;border-radius:50px;margin-bottom:.35rem;letter-spacing:.02em;font-family:'Inter',sans-serif;font-style:normal;}
    .biographe-suggested-why{font-family:'Inter',sans-serif;font-size:.78rem;color:var(--muted);margin-bottom:.55rem;line-height:1.45;}
    .biographe-titre-input{width:100%;padding:.55rem .8rem;border:1.5px solid var(--border);border-radius:10px;font-family:'Lora',serif;font-size:.98rem;font-weight:600;color:var(--deep);outline:none;margin-bottom:.4rem;background:var(--white);}
    .biographe-titre-input:focus{border-color:var(--accent);}
    /* 30 mai 2026 — Pierre : "plus de place pour le texte". min-height 100 → 180. */
    .biographe-contenu-input{width:100%;min-height:180px;padding:.7rem .95rem;border:1.5px solid var(--border);border-radius:10px;font-family:'Inter',sans-serif;font-size:.95rem;line-height:1.6;color:var(--text);outline:none;resize:vertical;background:var(--white);}
    .biographe-contenu-input:focus{border-color:var(--accent);}
    .biographe-relance{margin-top:.4rem;}
    /* Étoiles d'inspiration — boussole douce sous le textarea Biographe (wrap doux, jamais tronqué) */
    .biographe-etoiles{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem;margin:.45rem 0 .55rem;padding:.4rem .7rem;background:rgba(181,131,90,.06);border:1px solid rgba(181,131,90,.15);border-radius:10px;font-family:'Lora',serif;font-size:.78rem;font-style:italic;color:var(--gold);line-height:1.45;}
    .biographe-etoiles i{font-size:.88rem;flex-shrink:0;}
    .biographe-etoiles .sep{color:rgba(150,105,63,.4);user-select:none;}
    /* 30 mai 2026 — Pierre : "bouton enregistrer trop grand". width:100% →
       auto, padding réduit, gap resserré. Le bouton se cale à son contenu
       et la ligne d'actions est alignée à droite (cf. inline style HTML). */
    .biographe-save{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.55rem 1.3rem;background:var(--deep);color:white;border:none;border-radius:50px;font-family:'Inter',sans-serif;font-size:.92rem;font-weight:600;cursor:pointer;transition:all .2s;}
    .biographe-save:hover{background:#245a42;}
    .biographe-save:disabled{opacity:.6;cursor:not-allowed;}
    /* Porte Vocal */
    .bio-voc-area{display:flex;flex-direction:column;align-items:center;padding:1rem 0;}
    .bio-voc-helptext{font-family:'Lora',serif;font-style:italic;color:var(--muted);text-align:center;margin-bottom:1.2rem;font-size:.95rem;}
    .bio-voc-timer{font-family:'Inter',sans-serif;font-size:2.2rem;font-weight:700;color:var(--deep);margin-bottom:1.5rem;letter-spacing:.04em;}
    .bio-voc-rec-btn,.bio-voc-stop-btn{width:96px;height:96px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:2.4rem;color:white;transition:all .2s;box-shadow:0 4px 18px rgba(0,0,0,.15);}
    .bio-voc-rec-btn{background:#d32f2f;}
    .bio-voc-rec-btn:hover{transform:scale(1.05);box-shadow:0 6px 22px rgba(211,47,47,.4);}
    .bio-voc-stop-btn{background:#333;animation:bioVocPulse 1.3s ease-in-out infinite;}
    .bio-voc-stop-btn:hover{transform:scale(1.05);}
    @keyframes bioVocPulse{0%,100%{box-shadow:0 0 0 0 rgba(211,47,47,.5);}50%{box-shadow:0 0 0 14px rgba(211,47,47,0);}}
    .bio-voc-actions{width:100%;}
    /* Porte Photo (Lot C6) */
    .biographe-photo-titre{font-family:'Lora',serif;font-size:1.05rem;color:var(--deep);margin-bottom:.3rem;line-height:1.4;}
    .biographe-photo-hint{font-size:.9rem;color:var(--muted);margin-bottom:1rem;line-height:1.55;}
    .biographe-photo-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:.5rem;max-height:55vh;overflow-y:auto;padding:.2rem;}
    .biographe-photo-item{padding:0;border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer;background:none;transition:border-color .15s, transform .15s;aspect-ratio:1/1;}
    .biographe-photo-item:hover{border-color:var(--accent);transform:scale(1.02);}
    .biographe-photo-item img{width:100%;height:100%;object-fit:cover;display:block;}
    .biographe-photo-empty{text-align:center;padding:2rem 1rem;color:var(--muted);}
    .biographe-photo-empty p{font-size:.88rem;line-height:1.5;margin-top:.6rem;}
    /* Contexte photo dans l'étape rédaction */
    .biographe-photo-ctx{display:flex;flex-direction:column;align-items:center;gap:.35rem;margin-bottom:.4rem;}
    .biographe-photo-ctx-img{max-width:100%;max-height:130px;border-radius:10px;object-fit:cover;box-shadow:0 2px 8px rgba(0,0,0,.1);}
    .biographe-photo-ctx-caption{font-family:'Lora',serif;font-style:italic;font-size:.85rem;color:var(--muted);text-align:center;}
    .biographe-relance-text{font-size:.88rem;color:var(--gold);font-style:italic;line-height:1.5;padding:.5rem .7rem;background:rgba(181,131,90,.06);border-left:2px solid var(--gold);border-radius:6px;}
    /* Lot D — Section souvenirs liés dans la modal photo */
    .photo-souvenirs-section{margin-top:.5rem;padding-top:.55rem;border-top:1px solid var(--border);}
    .photo-souvenirs-header{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.4rem;}
    .photo-souvenirs-add{display:inline-flex;align-items:center;gap:.3rem;background:var(--white);border:1.5px solid var(--accent);color:var(--accent);padding:.35rem .75rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap;}
    .photo-souvenirs-add:hover{background:var(--accent);color:white;}
    .photo-souvenirs-list{display:flex;flex-direction:column;gap:.4rem;}
    .photo-souvenir-link{display:flex;align-items:flex-start;gap:.6rem;padding:.55rem .7rem;background:var(--bg);border-radius:8px;border:1px solid var(--border);font-size:.82rem;}
    .photo-souvenir-link-body{flex:1;min-width:0;}
    .photo-souvenir-link-title{font-weight:600;color:var(--deep);line-height:1.3;}
    .photo-souvenir-link-excerpt{color:var(--muted);font-size:.78rem;margin-top:.15rem;line-height:1.4;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
    .photo-souvenir-link-date{font-size:.78rem;color:var(--muted);flex-shrink:0;}
    /* Responsive mobile */
    @media (max-width: 767px) {
      #biographe-modal .biographe-box{width:100%;max-width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;border-radius:0;padding:1.5rem 1.1rem 1.1rem;}
      .biographe-titre{font-size:1.1rem;}
      .biographe-cta-hasard{padding:1rem 1.1rem;font-size:.98rem;}
      .biographe-portes{grid-template-columns:1fr;}
      .biographe-invitation-text{font-size:.95rem;}
      .biographe-contenu-input{min-height:120px;}
      .bio-voc-timer{font-size:1.9rem;}
      .bio-voc-rec-btn,.bio-voc-stop-btn{width:84px;height:84px;font-size:2rem;}
      .biographe-photo-grid{grid-template-columns:repeat(3, 1fr);max-height:50vh;}
      .biographe-photo-ctx-img{max-height:110px;}
    }
    /* .pillar-cards supprimé 2026-04-20 — doublon avec checklist Action 9 + sidebar */
    /* Padding et gap resserrés (15 mai 2026 fin de journée) pour compenser le bump des
       tailles de texte et éviter le scroll sur Accueil. Tailles texte inchangées. */
    .suggestion-card{background:linear-gradient(135deg,rgba(104,168,138,.06),rgba(104,168,138,.02));border:1px solid rgba(104,168,138,.12);border-radius:10px;padding:.45rem .9rem;display:flex;align-items:center;gap:.7rem;margin-bottom:.3rem;}
    .btn-sugg{padding:.4rem .9rem !important;font-size:.78rem !important;min-height:30px !important;}
    /* Kickers bumpés (15 mai 2026) de .66rem à .8rem pour passer WCAG AA — l'or sur fond crème
       est à ratio 4.4 (limite), ce qui exige ≥14px bold pour rester conforme. Cohérent avec la
       règle "lisibilité généreuse". sug-text aussi remonté pour rester lisible. */
    .suggestion-card .sug-label{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--gold);margin-bottom:.2rem;}
    .suggestion-card .sug-text{font-size:.95rem;color:var(--deep);line-height:1.5;}
    /* ── COMPTE DROPDOWNS ── */
    .compte-dropdown-header:hover{background:rgba(46,93,75,.02);}
    .compte-dropdown-header.open .compte-chevron{transform:rotate(180deg);}
    .compte-dropdown-body.open{padding:0 1.3rem!important;}

    /* ── PRICING ── */
    .pricing-toggle{display:flex;align-items:center;gap:.5rem;justify-content:center;margin-bottom:1.5rem;}
    .pricing-toggle label{font-size:.88rem;color:var(--muted);}
    .pricing-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;max-width:680px;margin:0 auto;}
    .pricing-card{background:var(--white);border-radius:16px;padding:1.8rem;border:2px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.04);position:relative;}
    .pricing-card.featured{border-color:var(--gold);box-shadow:0 4px 20px rgba(181,131,90,.15);}
    .pricing-card .plan-name{font-family:'Lora',serif;font-size:1.15rem;font-weight:600;color:var(--deep);margin-bottom:.3rem;}
    .pricing-card .plan-price{font-size:2rem;font-weight:700;color:var(--deep);margin-bottom:.5rem;}
    .pricing-card .plan-price span{font-size:.9rem;font-weight:400;color:var(--muted);}
    .pricing-card .plan-features{list-style:none;padding:0;margin:1rem 0;}
    .pricing-card .plan-features li{font-size:.85rem;color:var(--text);padding:.35rem 0;display:flex;align-items:flex-start;gap:.5rem;}
    .pricing-card .plan-features li i{color:var(--accent);font-size:.9rem;margin-top:.1rem;flex-shrink:0;}
    .pricing-card .plan-features li.locked i{color:var(--muted);}
    .pricing-card .plan-features li.locked{color:var(--muted);}
    .featured-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--gold);color:white;font-size:.7rem;font-weight:700;padding:.25rem .8rem;border-radius:50px;letter-spacing:.04em;text-transform:uppercase;}
    .locked-overlay{position:relative;}
    .locked-overlay::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.6);border-radius:12px;z-index:1;}
    .lock-message{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:1.8rem;text-align:center;margin:2rem auto;max-width:420px;box-shadow:0 2px 12px rgba(0,0,0,.06);}
    .lock-message h3{font-family:'Lora',serif;font-size:1.1rem;color:var(--deep);margin-bottom:.5rem;}
    .lock-message p{font-size:.88rem;color:var(--muted);line-height:1.5;margin-bottom:1rem;}
    /* ── Onboarding ── */
    .quota-badge{display:inline-flex;align-items:center;font-size:.7rem;font-weight:600;font-family:'Inter',sans-serif;padding:.15rem .55rem;border-radius:20px;vertical-align:middle;margin-left:.3rem;letter-spacing:.02em;white-space:nowrap;}
    .quota-badge:empty{display:none;}
    .quota-badge.quota-ok{background:rgba(104,168,138,.12);color:var(--accent);}
    .quota-badge.quota-warn{background:rgba(218,165,32,.12);color:#b8860b;}
    .quota-badge.quota-full{background:rgba(197,85,85,.1);color:#c55;}
    .quota-badge.quota-premium{display:none;}
    .onboarding-overlay{position:fixed;inset:0;z-index:9999;background:linear-gradient(160deg,#f8f6f1 0%,#eae6dc 100%);display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity .5s ease;}
    .onboarding-overlay.fade-out{opacity:0;pointer-events:none;}
    .onboarding-card{background:var(--white);border-radius:24px;box-shadow:0 12px 48px rgba(46,93,75,.12);max-width:520px;width:90%;padding:2.5rem 2.2rem 2rem;text-align:center;position:relative;overflow:hidden;}
    .onboarding-card::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--accent),var(--gold),var(--deep));}
    .ob-icon{width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;font-size:1.8rem;}
    .ob-title{font-family:'Lora',serif;font-size:1.35rem;font-weight:600;color:var(--deep);margin-bottom:.5rem;}
    .ob-text{font-size:.88rem;color:var(--muted);line-height:1.5;margin-bottom:1rem;max-width:380px;margin-left:auto;margin-right:auto;}
    .ob-actions{display:flex;flex-direction:column;gap:.35rem;margin-bottom:1rem;}
    /* .ob-action est un <button> depuis le 15 mai 2026 (a11y clavier) — reset pour que le
       button hérite de la typo et reste pleine largeur comme avant en <div>. */
    .ob-action{display:flex;align-items:center;gap:.65rem;padding:.55rem .85rem;border-radius:10px;border:1px solid var(--border);cursor:pointer;transition:all .2s;text-align:left;background:var(--white);font-family:inherit;width:100%;}
    .ob-action:hover{border-color:var(--accent);background:rgba(104,168,138,.04);}
    .ob-action i{font-size:1rem;color:var(--accent);flex-shrink:0;}
    .ob-action-text{font-size:.82rem;color:var(--deep);font-weight:500;}
    .ob-action-sub{font-size:.72rem;color:var(--muted);margin-top:.05rem;}
    .ob-dots{display:flex;gap:.5rem;justify-content:center;margin-bottom:1.2rem;}
    .ob-dot{width:8px;height:8px;border-radius:50%;background:var(--border);transition:all .3s;}
    .ob-dot.active{background:var(--accent);width:24px;border-radius:4px;}
    .ob-btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--accent);color:var(--white);border:none;padding:.7rem 1.8rem;border-radius:50px;font-size:.92rem;font-weight:600;cursor:pointer;transition:all .2s;}
    .ob-btn:hover{background:var(--deep);transform:translateY(-1px);}
    /* .ob-skip est un <button> depuis le 15 mai 2026 — reset background/border. */
    .ob-skip{font-size:.82rem;color:var(--muted);cursor:pointer;margin-top:.8rem;display:inline-block;background:none;border:none;font-family:inherit;padding:.2rem .4rem;}
    .ob-skip:hover{color:var(--deep);}
    .ob-step{display:none;}
    .ob-step.active{display:block;animation:obFadeIn .4s ease;}
    @keyframes obFadeIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
    /* ===== UTILITY CLASSES ===== */
    .u-flex{display:flex;align-items:center;}
    .u-flex-c{display:flex;align-items:center;justify-content:center;}
    .u-flex-b{display:flex;align-items:center;justify-content:space-between;}
    .u-flex-col{display:flex;flex-direction:column;}
    .u-gap-3{gap:.3rem;} .u-gap-4{gap:.4rem;} .u-gap-5{gap:.5rem;} .u-gap-6{gap:.6rem;} .u-gap-8{gap:.8rem;} .u-gap-10{gap:1rem;}
    .u-muted{color:var(--muted);} .u-deep{color:var(--deep);} .u-accent{color:var(--accent);} .u-gold{color:var(--gold);} .u-white{color:var(--white);}
    .u-bg-white{background:var(--white);} .u-bg-bg{background:var(--bg);}
    .u-bold{font-weight:600;} .u-semi{font-weight:500;}
    .u-fs-75{font-size:.75rem;} .u-fs-78{font-size:.78rem;} .u-fs-80{font-size:.8rem;} .u-fs-82{font-size:.82rem;} .u-fs-85{font-size:.85rem;} .u-fs-88{font-size:.88rem;} .u-fs-90{font-size:.9rem;} .u-fs-95{font-size:.95rem;} .u-fs-100{font-size:1rem;} .u-fs-110{font-size:1.1rem;}
    .u-r8{border-radius:8px;} .u-r10{border-radius:10px;} .u-r14{border-radius:14px;} .u-r50{border-radius:50px;}
    .u-ptr{cursor:pointer;}
    .u-w100{width:100%;} .u-flex1{flex:1;}
    .u-m0{margin:0;} .u-mb-0{margin-bottom:0;} .u-mb-4{margin-bottom:.4rem;} .u-mb-8{margin-bottom:.8rem;} .u-mb-10{margin-bottom:1rem;} .u-mb-15{margin-bottom:1.5rem;}
    .u-ta-c{text-align:center;}
    .u-hidden{display:none;}
    .u-cover{width:100%;height:100%;object-fit:cover;}
    .u-cover-block{width:100%;height:100%;object-fit:cover;display:block;}
    /* ── Vague F-light (2026-05-03) — classes utilitaires pour styles inline répétés ── */
    /* ── Étendues 15 mai 2026 (Phase 4C) : t-gold, t-accent-sm/lg, t-deep-sm ── */
    .t-accent{color:var(--accent);}
    .t-accent-sm{color:var(--accent);font-size:.85rem;}
    .t-accent-lg{font-size:1.3rem;color:var(--accent);}
    .t-gold{color:var(--gold);}
    .t-muted{color:var(--muted);}
    .t-muted-xs{font-size:.78rem;color:var(--muted);}
    .t-deep-sm{font-size:.85rem;font-weight:500;color:var(--deep);}
    .mb-0{margin-bottom:0;}
    .label-mini{font-size:.7rem;color:var(--muted);font-weight:500;margin-bottom:.25rem;}
    .btn-pill-primary{font-size:.88rem;padding:.5rem 1.2rem;border-radius:8px;cursor:pointer;background:var(--accent);color:var(--white);border:none;font-weight:600;}
    .flex-grow-min0{flex:1;min-width:0;}
    .label-section{color:var(--muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;}
    .tile-light{background:var(--light);border-radius:10px;padding:.8rem;text-align:center;}
    .spin-anim{animation:spin 1s linear infinite;}
    .u-input{width:100%;padding:.55rem .7rem;border:1px solid var(--border-input);border-radius:8px;font-size:.88rem;box-sizing:border-box;font-family:'Inter',sans-serif;}
    .u-label{font-size:.78rem;color:var(--muted);display:block;margin-bottom:.2rem;}
    .u-card{background:var(--white);border-radius:14px;border:1px solid rgba(46,93,75,.06);box-shadow:0 1px 3px rgba(46,93,75,.04);}
    .u-pill{display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;background:var(--white);padding:.35rem .7rem;border-radius:50px;border:1px solid var(--border-input);cursor:pointer;}
    .u-btn-accent{font-size:.88rem;padding:.5rem 1.2rem;border-radius:8px;cursor:pointer;background:var(--accent);color:var(--white);border:none;font-weight:600;font-family:'Inter',sans-serif;}
    .u-btn-accent:hover{opacity:.85;}
    .u-td-row td,.u-td-row th{padding:.45rem .6rem;border-bottom:1px solid rgba(46,93,75,.06);}
  
    /* Recits toolbar */
    .recit-filter-pill{background:var(--bg);border:1.5px solid var(--border);border-radius:50px;padding:.3rem .8rem;font-size:.78rem;font-family:'Inter',sans-serif;color:var(--muted);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.3rem;}
    .recit-filter-pill:hover{border-color:var(--accent);color:var(--accent);}
    .recit-filter-pill.active{background:var(--accent);border-color:var(--accent);color:white;}
    .recit-view-btn{background:var(--bg);border:1.5px solid var(--border);border-radius:8px;padding:.4rem .5rem;font-size:.95rem;color:var(--muted);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;}
    .recit-view-btn:hover{border-color:var(--accent);color:var(--accent);}
    .recit-view-btn.active{background:var(--accent);border-color:var(--accent);color:white;}
    .recit-group-header{display:flex;align-items:center;gap:.7rem;padding:.7rem 1rem;margin-bottom:.4rem;cursor:pointer;border-radius:10px;transition:background .15s;user-select:none;}
    .recit-group-header:hover{background:var(--bg);}
    .recit-group-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;}
    .recit-group-count{font-size:.72rem;background:var(--light);color:var(--muted);padding:.15rem .5rem;border-radius:50px;margin-left:auto;}
    .recit-no-results{text-align:center;padding:2rem;color:var(--muted);font-size:.9rem;}
    .recit-tag-btn{background:var(--bg);border:1.5px solid var(--border);border-radius:50px;padding:.3rem .7rem;font-size:.76rem;font-family:'Inter',sans-serif;color:var(--muted);cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;gap:.25rem;}
    .recit-tag-btn:hover{border-color:var(--accent);color:var(--accent);}
    .recit-tag-btn.active{background:var(--accent);border-color:var(--accent);color:white;}

    /* -- PARTAGE PHOTOS -- */
    .spinner-share{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--deep);border-radius:50%;animation:spin-share .7s linear infinite;margin:0 auto;}
    @keyframes spin-share{to{transform:rotate(360deg);}}
    #guest-root img{-webkit-user-drag:none;user-select:none;-webkit-touch-callout:none;}

    /* ═══════════════════════════════════════════════════════════
       ONBOARDING "PAR OÙ COMMENCER" — Action 9 (2026-04-20)
       ═══════════════════════════════════════════════════════════ */
    /* Bandeau "Par où commencer" compressé (15 mai 2026) — fold Accueil. */
    .ob-start-card{padding:.65rem 1rem;margin-bottom:.5rem;}
    .ob-start-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem;}
    .ob-start-title{font-family:'Lora',serif;font-size:.98rem;font-weight:600;color:var(--deep);}
    .ob-start-count{margin-left:auto;font-size:.75rem;color:var(--accent);font-weight:600;background:var(--light);padding:.1rem .5rem;border-radius:50px;}
    .ob-start-sub{font-size:.82rem;color:var(--muted);line-height:1.45;margin-bottom:.65rem;}
    /* Micro-question grands-parents (2026-04-21) — carte dismissible dashboard */
    .gp-card{padding:.75rem 1.1rem;margin-bottom:.65rem;position:relative;}
    .gp-card-title{font-family:'Lora',serif;font-size:.95rem;font-weight:600;color:var(--deep);margin-bottom:.15rem;padding-right:1.5rem;}
    .gp-card-sub{font-size:.78rem;color:var(--muted);line-height:1.4;margin-bottom:.55rem;}
    .gp-pills{display:flex;flex-wrap:wrap;gap:.45rem;}
    .gp-pill{background:var(--white);color:var(--deep);border:1px solid var(--border);padding:.45rem 1rem;border-radius:50px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit;}
    .gp-pill:hover{border-color:var(--accent);background:rgba(104,168,138,.04);}
    .gp-pill.active{background:var(--accent);color:var(--white);border-color:var(--accent);}
    .gp-dismiss{position:absolute;top:.5rem;right:.6rem;background:none;border:none;color:var(--muted);cursor:pointer;font-size:1rem;padding:.3rem;line-height:1;border-radius:50%;}
    .gp-dismiss:hover{color:var(--deep);background:var(--bg);}
    .gp-count-row{display:none;align-items:center;gap:.55rem;margin-top:.7rem;font-size:.85rem;color:var(--deep);}
    .gp-count-row.active{display:flex;}
    .gp-count-row input{width:70px;padding:.4rem .6rem;border:1px solid var(--border);border-radius:8px;font-size:.85rem;font-family:inherit;}
    .ob-step-card{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem;background:var(--bg);border-radius:var(--radius-md);margin-bottom:.5rem;transition:background .3s;}
    .ob-step-card:last-child{margin-bottom:0;}
    .ob-step-card.done{background:var(--light);}
    .ob-step-ico{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:rgba(53,122,93,.08);display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:1.15rem;}
    .ob-step-card.done .ob-step-ico{background:rgba(53,122,93,.18);}
    .ob-step-body{flex:1;min-width:0;}
    .ob-step-title{font-family:'Inter',sans-serif;font-size:.92rem;font-weight:600;color:var(--deep);margin-bottom:.15rem;line-height:1.3;}
    .ob-step-meta{font-size:.75rem;color:var(--muted);}
    .ob-step-btn{flex-shrink:0;background:var(--accent);color:white;border:none;padding:.55rem 1rem;border-radius:50px;font-family:'Inter',sans-serif;font-size:.8rem;font-weight:600;cursor:pointer;min-height:40px;transition:background .2s;}
    .ob-step-btn:hover{background:var(--deep);}
    .ob-step-done-mark{flex-shrink:0;color:var(--accent);font-weight:600;font-size:.95rem;display:flex;align-items:center;}
    @media(max-width:640px){
      .ob-step-card{flex-wrap:wrap;}
      .ob-step-btn{width:100%;margin-top:.3rem;}
    }

    /* ═══════════════════════════════════════════════════════════
       BANDEAUX ANTI-ANGOISSE — Action 10 (2026-04-20)
       ═══════════════════════════════════════════════════════════ */
    .empty-nudge{display:flex;align-items:flex-start;gap:.6rem;padding:.75rem .9rem;margin:0 0 1.2rem 0;background:#eef4f0;background:color-mix(in srgb, var(--accent) 8%, var(--bg));border-left:3px solid var(--accent);border-radius:var(--radius-md);font-size:.92rem;line-height:1.45;color:var(--deep);}
    .empty-nudge > i{color:var(--accent);font-size:1.1rem;flex-shrink:0;margin-top:2px;}
    .empty-nudge p{margin:0;}
    .empty-nudge strong{color:var(--deep);}
    @media (max-width:600px){
      .empty-nudge{padding:.65rem .75rem;font-size:.88rem;}
    }

    /* ═══════════════════════════════════════════════════════════
       MOBILE PATCH — 2026-04-20 — fixes iOS zoom, touch targets, images
       ═══════════════════════════════════════════════════════════ */
    img{max-width:100%;height:auto}
    @media(max-width:768px){
      /* Fix iOS auto-zoom on input focus : minimum 16px requis,
         on monte à 17px pour rester aligné sur la base 18px html. */
      input[type=text],input[type=email],input[type=password],input[type=number],
      input[type=tel],input[type=url],input[type=search],input[type=date],
      input[type=datetime-local],input[type=month],input[type=time],input[type=week],
      input:not([type]),textarea,select{font-size:17px !important}
      /* Touch targets minimum 40px pour boutons critiques */
      .coll-delete-btn,.coll-rename-btn,.coll-eye-btn{width:40px !important;height:40px !important;font-size:1rem !important}
      .btn-add,.qa-btn{min-height:44px;height:auto}
      .btn-sm{min-height:40px;height:auto}
    }

    /* Contacts de confiance (s-transmission) — compactage 1er mai 2026.
       Les cards ont des styles inline (background:var(--white); border-radius:14px; …),
       on les override ici pour réduire la hauteur globale sans réécrire le HTML. */
    #s-transmission > main > div[style*="border-radius:14px"][style*="margin-bottom:1.5rem"]{
      margin-bottom:.55rem !important;
    }
    #s-transmission > main > div[style*="border-radius:14px"] > div[onclick^="toggleTransDD"]{
      padding:.75rem 1.1rem !important;
    }
    #s-transmission > main > div[style*="border-radius:14px"] > div[onclick^="toggleTransDD"] > div > span:last-child{
      font-size:.95rem !important;
    }

    /* Mon Compte (Votre espace) — compactage 1er mai 2026 pour tenir sans scroll
       sur tout écran ≥ 700px de hauteur. Override les styles inline existants. */
    #s-compte .compte-section{margin-bottom:.4rem !important;}
    #s-compte .compte-dropdown-header{padding:.65rem 1.1rem !important;}
    #s-compte .compte-dropdown-header h2{font-size:1rem !important;gap:.45rem !important;}
    #s-compte .compte-dropdown-header h2 i{font-size:.95rem !important;}
    #s-compte .page-header{margin-bottom:1rem !important;padding-bottom:.5rem !important;}
    #s-compte .page-header h1{font-size:1.25rem !important;margin:0 0 .25rem !important;}
    #s-compte .page-header p{font-size:.82rem !important;line-height:1.4 !important;}
    /* Card "Besoin d'aide" plus serrée */
    #s-compte .compte-section[style*="padding:1.1rem 1.3rem"]{padding:.75rem 1.1rem !important;}

    /* Mon Compte — phrase explicative à droite de chaque accordéon */
    /* Hint section accordéon (Contacts confiance / Votre Espace) — italique retiré
       le 15 mai 2026, taille bumpée .8 → .85rem pour lisibilité. */
    .compte-section-hint{
      font-size:.85rem;
      color:var(--muted);
      margin-left:1.5rem;
      flex:1;
      text-align:right;
      padding-right:1rem;
      line-height:1.4;
    }
    @media (max-width:720px){.compte-section-hint{display:none}}