/* ==========================================================
FITZ — « MON PARCOURS » (dashboard.html, refonte 2026-08-30)

Le hub de l'espace étudiant : plus un tableau de bord, un VOYAGE en
six phases (profil → opportunités → dossiers → dépôt → réponse &
bourse → visa & départ). Identité « papier chaud » du reste du site.
Chargée après journey-shell.css ; ne s'applique qu'au hub (les
classes .jy-* n'existent nulle part ailleurs).
========================================================== */

/* ==========================================================
EN-TÊTE — salutation + phase du moment
========================================================== */
.jy-hello{
margin:8px 0 22px;
}

.jy-hello h1{
margin:0 0 4px;
font-family:var(--font-affirmation);
font-size:clamp(1.6rem, 3.4vw, 2.1rem);
font-weight:700;
letter-spacing:-.01em;
color:var(--journey-ink);
}

.jy-hello p{
margin:0;
font-size:.92rem;
color:var(--text-light);
}

.jy-hello p strong{ color:var(--amber-700); }

/* ==========================================================
PROCHAINE ACTION — la carte de tête, encre chaude
========================================================== */
.jy-action{
position:relative;
overflow:hidden;
border-radius:18px;
padding:26px 28px;
margin-bottom:26px;
color:#FDF9EF;
background:
radial-gradient(ellipse 70% 90% at 88% 0%, rgba(217,128,90,.34) 0%, rgba(217,128,90,.1) 45%, transparent 70%),
linear-gradient(158deg, #2A211A 0%, #1E1712 55%, #15100B 100%);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.08),
0 2px 4px rgba(21,16,11,.18),
0 24px 48px -20px rgba(21,16,11,.5);
}

.jy-action-kicker{
display:inline-flex;
align-items:center;
gap:7px;
margin-bottom:10px;
padding:5px 12px;
border-radius:999px;
font-size:.72rem;
font-weight:700;
letter-spacing:.08em;
text-transform:uppercase;
background:rgba(253,249,239,.12);
color:#F3D9C8;
}

.jy-action--critique .jy-action-kicker{ background:rgba(202,64,42,.35); color:#FFD9CE; }
.jy-action--haute .jy-action-kicker{ background:rgba(217,128,90,.3); color:#F8D8C5; }

.jy-action h2{
margin:0 0 8px;
font-family:var(--font-affirmation);
font-size:clamp(1.25rem, 2.6vw, 1.55rem);
font-weight:700;
line-height:1.25;
color:#FDF9EF;
}

.jy-action p{
margin:0 0 18px;
max-width:60ch;
font-size:.94rem;
line-height:1.6;
color:rgba(253,249,239,.85);
}

.jy-action-cta{
display:inline-flex;
align-items:center;
gap:9px;
padding:12px 22px;
border-radius:12px;
background:var(--amber-500);
color:var(--journey-ink);
font-weight:700;
font-size:.95rem;
text-decoration:none;
transition:var(--transition);
}

.jy-action-cta:hover{ background:#E08F6C; transform:translateY(-1px); }

.jy-action-cta i,
.jy-action-cta svg{ width:17px; height:17px; }

/* ==========================================================
RAIL DU VOYAGE — 6 phases
========================================================== */
.jy-rail{
display:flex;
align-items:flex-start;
gap:0;
margin-bottom:10px;
overflow-x:auto;
padding-bottom:6px;
-webkit-overflow-scrolling:touch;
}

.jy-rail-item{
position:relative;
flex:1 1 0;
min-width:96px;
display:flex;
flex-direction:column;
align-items:center;
gap:7px;
text-decoration:none;
padding:4px 6px 8px;
}

/* Le trait qui relie les nœuds. */
.jy-rail-item::before{
content:"";
position:absolute;
top:19px;
left:calc(-50% + 19px);
width:calc(100% - 38px);
height:2px;
background:var(--border-color);
}

.jy-rail-item:first-child::before{ display:none; }

.jy-rail-item.is-done::before{ background:var(--journey-done); opacity:.45; }

.jy-rail-dot{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
border-radius:50%;
background:var(--background);
border:2px solid var(--border-color);
color:var(--text-light);
transition:var(--transition);
}

.jy-rail-dot i,
.jy-rail-dot svg{ width:16px; height:16px; }

.jy-rail-item.is-done .jy-rail-dot{
background:#EAF3EC;
border-color:var(--journey-done);
color:var(--journey-done);
}

.jy-rail-item.is-current .jy-rail-dot{
background:var(--amber-600);
border-color:var(--amber-600);
color:#FDF9EF;
box-shadow:0 0 0 5px rgba(217,128,90,.18);
}

.jy-rail-label{
font-size:.72rem;
font-weight:700;
text-align:center;
color:var(--text-light);
line-height:1.25;
}

.jy-rail-item.is-current .jy-rail-label{ color:var(--amber-700); }
.jy-rail-item.is-done .jy-rail-label{ color:var(--journey-done); }

.jy-progress-line{
margin:0 0 26px;
font-size:.8rem;
color:var(--text-light);
}

.jy-progress-line strong{ color:var(--journey-ink); }

/* ==========================================================
RADAR D'ÉCHÉANCES
========================================================== */
.jy-radar{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:10px;
margin-bottom:34px;
}

.jy-radar-label{
display:inline-flex;
align-items:center;
gap:7px;
font-size:.8rem;
font-weight:700;
color:var(--text-light);
}

.jy-radar-label i,
.jy-radar-label svg{ width:15px; height:15px; color:var(--amber-700); }

.jy-radar-chip{
display:inline-flex;
align-items:baseline;
gap:7px;
padding:7px 13px;
border-radius:999px;
font-size:.8rem;
font-weight:600;
text-decoration:none;
background:var(--background);
border:1px solid var(--border-color);
color:var(--text-color);
}

.jy-radar-chip strong{ font-weight:800; }

.jy-radar-chip--haute{ border-color:rgba(190,96,50,.5); }
.jy-radar-chip--haute strong{ color:var(--amber-700); }

.jy-radar-chip--critique{ background:#FBEAE4; border-color:rgba(178,58,32,.5); }
.jy-radar-chip--critique strong{ color:#A93A20; }

/* ==========================================================
SECTIONS DE PHASE — numéro + titre Newsreader, rail vertical
========================================================== */
.jy-phase{
position:relative;
padding:30px 0 8px;
border-top:1px solid var(--border-color);
scroll-margin-top:84px;
}

.jy-phase-head{
display:flex;
align-items:baseline;
gap:14px;
margin-bottom:6px;
}

.jy-phase-num{
font-family:var(--font-affirmation);
font-size:1rem;
font-weight:700;
color:var(--amber-600);
letter-spacing:.04em;
}

.jy-phase-head h2{
margin:0;
font-family:var(--font-affirmation);
font-size:clamp(1.2rem, 2.4vw, 1.45rem);
font-weight:700;
color:var(--journey-ink);
}

.jy-phase-state{
margin-left:auto;
display:inline-flex;
align-items:center;
gap:6px;
font-size:.74rem;
font-weight:700;
letter-spacing:.05em;
text-transform:uppercase;
color:var(--text-light);
white-space:nowrap;
}

.jy-phase-state i,
.jy-phase-state svg{ width:14px; height:14px; }

.jy-phase.is-done .jy-phase-state{ color:var(--journey-done); }
.jy-phase.is-current .jy-phase-state{ color:var(--amber-700); }

.jy-phase-sub{
margin:0 0 18px;
max-width:70ch;
font-size:.9rem;
line-height:1.6;
color:var(--text-light);
}

/* Carte générique d'une phase. */
.jy-card{
background:var(--background);
border:1px solid var(--border-color);
border-radius:16px;
padding:20px 22px;
margin-bottom:14px;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.85),
0 1px 2px rgba(33,29,24,.05),
0 12px 28px -18px rgba(33,29,24,.2);
}

.jy-empty{
border-style:dashed;
text-align:center;
color:var(--text-light);
font-size:.9rem;
padding:26px 22px;
}

.jy-empty a{ color:var(--amber-700); font-weight:700; }

/* ---------- Phase 1 : profil ---------- */
.jy-profile{
display:flex;
align-items:center;
gap:20px;
flex-wrap:wrap;
}

.jy-profile-score{
display:flex;
align-items:baseline;
gap:4px;
font-family:var(--font-affirmation);
color:var(--journey-ink);
}

.jy-profile-score strong{ font-size:2.2rem; font-weight:800; line-height:1; }
.jy-profile-score span{ font-size:1rem; color:var(--text-light); }

.jy-profile-copy{ flex:1 1 260px; }

.jy-profile-copy p{
margin:0;
font-size:.9rem;
line-height:1.55;
color:var(--text-color);
}

/* ---------- Boutons ---------- */
.jy-btn{
display:inline-flex;
align-items:center;
gap:8px;
padding:10px 18px;
border-radius:11px;
border:1px solid var(--border-color);
background:var(--background);
color:var(--journey-ink);
font-weight:700;
font-size:.88rem;
text-decoration:none;
cursor:pointer;
transition:var(--transition);
white-space:nowrap;
}

.jy-btn:hover{ border-color:var(--amber-600); color:var(--amber-700); }

.jy-btn--primary{
background:var(--amber-600);
border-color:var(--amber-600);
color:#FDF9EF;
}

.jy-btn--primary:hover{ background:var(--amber-700); border-color:var(--amber-700); color:#FDF9EF; }

.jy-btn i,
.jy-btn svg{ width:15px; height:15px; }

/* ---------- Phase 2 : opportunités ---------- */
.jy-opps{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
gap:14px;
margin-bottom:14px;
}

.jy-opp h3{
margin:0 0 2px;
font-size:.98rem;
font-weight:800;
color:var(--journey-ink);
}

.jy-opp-uni{
margin:0 0 10px;
font-size:.8rem;
color:var(--text-light);
}

.jy-opp-reason{
display:flex;
align-items:flex-start;
gap:7px;
margin:0 0 12px;
font-size:.82rem;
line-height:1.5;
color:var(--text-color);
}

.jy-opp-reason i,
.jy-opp-reason svg{ flex-shrink:0; width:14px; height:14px; margin-top:2px; color:var(--journey-done); }

.jy-phase-actions{
display:flex;
flex-wrap:wrap;
gap:10px;
}

/* ---------- Phase 3 : dossiers (cartes + mini-stepper) ---------- */
.jy-app-top{
display:flex;
align-items:baseline;
gap:12px;
flex-wrap:wrap;
margin-bottom:12px;
}

.jy-app-top h3{
margin:0;
font-size:1rem;
font-weight:800;
color:var(--journey-ink);
}

.jy-app-meta{
font-size:.8rem;
color:var(--text-light);
}

.jy-app-deadline{ margin-left:auto; font-size:.8rem; font-weight:700; color:var(--text-light); white-space:nowrap; }
.jy-app-deadline.is-haute{ color:var(--amber-700); }
.jy-app-deadline.is-critique{ color:#A93A20; }

.jy-steps{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-bottom:4px;
}

.jy-step{
display:inline-flex;
align-items:center;
gap:7px;
padding:7px 12px;
border-radius:999px;
border:1px solid var(--border-color);
background:var(--background-light);
font-size:.78rem;
font-weight:700;
color:var(--text-light);
text-decoration:none;
transition:var(--transition);
}

.jy-step:hover{ border-color:var(--amber-600); color:var(--amber-700); }

.jy-step i,
.jy-step svg{ width:13px; height:13px; }

.jy-step.is-done{
background:#EAF3EC;
border-color:rgba(47,122,70,.4);
color:var(--journey-done);
}

/* Prématurée : faisable mais déconseillée — même sémantique que le
stepper historique (js/next-action.js), rendue par un pointillé. */
.jy-step.is-premature{
border-style:dashed;
opacity:.75;
}

/* ---------- Boîte à outils du dossier ---------- */
.jy-tools{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:14px;
}

.jy-tool{
display:inline-flex;
align-items:center;
gap:7px;
padding:8px 13px;
border-radius:10px;
border:1px solid var(--border-color);
background:var(--background);
font-size:.8rem;
font-weight:600;
color:var(--text-color);
text-decoration:none;
transition:var(--transition);
}

.jy-tool:hover{ border-color:var(--amber-600); color:var(--amber-700); }

.jy-tool i,
.jy-tool svg{ width:14px; height:14px; color:var(--amber-700); }

/* LOT S4 — L'OPACITÉ DE VERROUILLAGE A ÉTÉ SUPPRIMÉE.
   Elle grisait à 55 % un outil non inclus, en laissant le lien
   cliquable, tabulable, lisible par un lecteur d'écran et trouvable au
   Ctrl+F. C'était un panneau, pas une porte. applyFeatureLocks()
   (js/app-shell.js) RETIRE désormais l'élément du DOM, comme le lot S0
   l'avait fait pour la carte Diagnostic — même doctrine que le portail
   de candidature du 2026-08-31 : on ne montre pas une porte fermée, on
   fait qu'il n'y ait pas de porte. La vente se fait par les cartes
   « Choisir ma formule » des hubs, jamais par un manque affiché.

   Le cadenas reste masqué par défaut : les [data-feature] encore
   présents dans le HTML le portent, et il ne doit jamais s'afficher. */
[data-feature] .jy-lock{ display:none; }

/* ---------- Phases 4-6 : listes + guides ---------- */
.jy-list{
list-style:none;
margin:0;
padding:0;
display:flex;
flex-direction:column;
gap:10px;
}

.jy-list li{
display:flex;
align-items:flex-start;
gap:10px;
font-size:.88rem;
line-height:1.55;
color:var(--text-color);
}

.jy-list li i,
.jy-list li svg{ flex-shrink:0; width:16px; height:16px; margin-top:2px; color:var(--amber-700); }

/* Lot S3 (2026-09-13) : les cartes portent maintenant un « quand », un
« pourquoi », la variante du parcours et un dépliant. À 230px elles
étaient illisibles ; à 340px elles tiennent deux colonnes sur un
portable et trois sur un écran large. */
/* UNE COLONNE, ET NON DEUX (lot ESPACE-ÉTUDIANT).
   Deux colonnes juxtaposaient les étapes 1-2, 3-4, 5-6 : le regard lisait
   en Z une suite qui se fait dans l'ordre, et les six cartes, de hauteurs
   très inégales, laissaient des trous. Depuis que les étapes se
   dévoilent une à une, la colonne unique dit ce qu'elle est — un chemin,
   du consulat à l'avion. */
.jy-guide{
display:flex;
flex-direction:column;
gap:12px;
}

.jy-guide-step h3{
display:flex;
align-items:center;
gap:8px;
margin:0 0 6px;
font-size:.92rem;
font-weight:800;
color:var(--journey-ink);
}

.jy-guide-step h3 i,
.jy-guide-step h3 svg{ width:15px; height:15px; color:var(--amber-700); }

.jy-guide-step p{
margin:0;
font-size:.83rem;
line-height:1.55;
color:var(--text-light);
}

/* ---- Checklist visa cochable (2026-08-30) ---- */
.jy-visa-check{
display:inline-flex;
align-items:center;
gap:7px;
margin-top:10px;
padding:6px 12px;
border-radius:999px;
border:1px solid var(--border-color);
background:var(--journey-paper);
font-family:inherit;
font-size:.76rem;
font-weight:700;
color:var(--text-light);
cursor:pointer;
transition:border-color .15s ease, color .15s ease, background .15s ease;
}

.jy-visa-check:hover{ border-color:var(--amber-600); color:var(--amber-700); }

.jy-visa-check i,
.jy-visa-check svg{ width:14px; height:14px; }

.jy-guide-step.is-done .jy-visa-check{
background:#EAF3EC;
border-color:rgba(47,122,70,.4);
color:var(--journey-done);
}

.jy-guide-step.is-done h3,
.jy-guide-step.is-done p{ opacity:.62; }
.jy-guide-step.is-done h3{ text-decoration:line-through; text-decoration-thickness:1px; }

/* ---- Cartes d'issue de la phase 05 (2026-08-30) ---- */
.jy-reponse h3{
display:flex;
align-items:center;
gap:9px;
margin:0 0 12px;
font-family:"Newsreader", Georgia, serif;
font-size:1.15rem;
font-weight:700;
color:var(--journey-ink);
}

.jy-reponse h3 i,
.jy-reponse h3 svg{ width:19px; height:19px; color:var(--amber-700); }

.jy-reponse--admise{
border-color:rgba(47,122,70,.45);
background:linear-gradient(160deg, #F2F8F3 0%, var(--background) 60%);
}

.jy-reponse--admise h3 i,
.jy-reponse--admise h3 svg{ color:var(--journey-done); }

.jy-reponse .jy-tools{ margin-top:14px; }

.jy-status-pill{
display:inline-flex;
align-items:center;
gap:6px;
padding:4px 10px;
border-radius:999px;
font-size:.72rem;
font-weight:700;
background:var(--background-light);
border:1px solid var(--border-color);
color:var(--text-light);
}

.jy-status-pill.is-positive{ background:#EAF3EC; border-color:rgba(47,122,70,.4); color:var(--journey-done); }

/* ==========================================================
BANNIÈRES (bienvenue, express, e-mail, upgrade) — plus discrètes
========================================================== */
.welcome-alert{
border-radius:14px;
}

.jy-upgrade{
margin-top:36px;
display:flex;
align-items:flex-start;
gap:14px;
padding:18px 20px;
border-radius:14px;
background:var(--background-soft);
border:1px solid var(--border-color);
}

.jy-upgrade i.jy-upgrade-icon,
.jy-upgrade svg.jy-upgrade-icon{ flex-shrink:0; width:18px; height:18px; margin-top:2px; color:var(--amber-700); }

.jy-upgrade p{ margin:0 0 6px; font-size:.86rem; line-height:1.5; color:var(--text-color); }

.jy-upgrade a{ font-weight:700; color:var(--amber-700); }

@media (max-width: 640px){

.jy-action{ padding:22px 18px; }

.jy-phase-state{ display:none; }

.jy-app-deadline{ margin-left:0; width:100%; }

}

/* Passe espace étudiant 1/3 (2026-09-06) : pour une candidature liée
   au catalogue, la pastille porte `etat.ton` (ouverte / attente / close /
   inconnue) — plus un calcul local sur la date gelée. Les tons
   critique / haute / normale restent pour les candidatures hors
   catalogue. */
.jy-app-deadline.is-ouverte{ color:var(--success-700); }
.jy-app-deadline.is-attente{ color:var(--amber-700); }
.jy-app-deadline.is-close{ color:var(--text-muted); font-weight:600; }
.jy-app-deadline.is-inconnue{ color:var(--text-light); font-weight:600; }


/* ==========================================================
   GUIDE VISA & DÉPART — le contenu réel (lot S3, 2026-09-13)
   ==========================================================
   Six cartes rendues par dashboard.js depuis js/visa-depart.js, plus un
   bloc de destination alimenté par la procédure du pays. Le « quand »
   et le « pourquoi » sont visibles d'emblée ; les actions et les pièges
   vivent dans un <details>, parce qu'une carte qui affiche neuf
   paragraphes d'un coup n'est plus lue du tout. */

.jy-guide-quand{
display:flex;
align-items:center;
gap:6px;
margin:0 0 8px !important;
font-size:.78rem !important;
font-weight:700 !important;
color:var(--amber-700) !important;
}
.jy-guide-quand i,
.jy-guide-quand svg{ width:13px; height:13px; flex:none; }

.jy-guide-pourquoi{ margin:0 0 10px !important; }

/* La phrase propre au parcours de l'étudiant — boursier ou autofinancé.
   Elle est encadrée parce que c'est la seule qui change d'un espace à
   l'autre, et qu'elle porte l'information la plus actionnable. */
.jy-guide-variante{
margin:0 !important;
padding:9px 11px;
border-left:2px solid var(--amber-600);
border-radius:0 8px 8px 0;
background:var(--journey-paper);
font-size:.81rem !important;
color:var(--journey-ink) !important;
}

.jy-guide-plus{ margin-top:11px; }

.jy-guide-plus > summary{
cursor:pointer;
font-size:.79rem;
font-weight:700;
color:var(--amber-700);
list-style:none;
padding:5px 0;
}
.jy-guide-plus > summary::-webkit-details-marker{ display:none; }
.jy-guide-plus > summary::before{ content:"+ "; font-weight:800; }
.jy-guide-plus[open] > summary::before{ content:"− "; }
.jy-guide-plus > summary:hover{ text-decoration:underline; }

.jy-guide-soustitre{
margin:10px 0 5px !important;
font-size:.72rem !important;
font-weight:800 !important;
letter-spacing:.04em;
text-transform:uppercase;
color:var(--journey-ink) !important;
}
.jy-guide-soustitre--alerte{ color:var(--amber-700) !important; }

.jy-guide-actions,
.jy-guide-vigilance{
margin:0;
padding-left:17px;
font-size:.81rem;
line-height:1.55;
color:var(--text-light);
}
.jy-guide-actions li,
.jy-guide-vigilance li{ margin-bottom:6px; }
.jy-guide-vigilance li::marker{ color:var(--amber-700); }

.jy-guide-step.is-done .jy-guide-variante{ opacity:.62; }

/* ---- Le bloc de destination ---- */
.jy-destination{ margin-top:16px; }

.jy-destination h3{
display:flex;
align-items:center;
gap:8px;
margin:0 0 6px;
font-size:1rem;
font-weight:800;
color:var(--journey-ink);
}
.jy-destination h3 i,
.jy-destination h3 svg{ width:17px; height:17px; color:var(--amber-700); }

.jy-destination-sub{
margin:0 0 14px;
font-size:.83rem;
line-height:1.55;
color:var(--text-light);
}

.jy-destination-list{
margin:0;
padding-left:20px;
display:grid;
gap:14px;
}
.jy-destination-list > li::marker{ font-weight:800; color:var(--amber-700); }

.jy-destination-list h4{
margin:0 0 4px;
font-size:.88rem;
font-weight:800;
color:var(--journey-ink);
}
.jy-destination-list p{
margin:0;
font-size:.83rem;
line-height:1.6;
color:var(--text-light);
}

/* La source et la date : discrètes, mais toujours là. C'est ce qui
   sépare une consigne d'une opinion. */
.jy-destination-src{
margin-top:5px !important;
font-size:.74rem !important;
color:var(--text-light) !important;
opacity:.82;
}
.jy-destination-src a{ color:var(--amber-700); text-decoration:underline; }

@media (max-width: 560px){
.jy-destination-list{ padding-left:17px; }
}

/* ==========================================================
   LA RÉVÉLATION PROGRESSIVE (lot ESPACE-ÉTUDIANT, 2026-09-13)
   ==========================================================
   Les six phases étaient dépliées EN ENTIER, tout le temps : neuf écrans
   de texte le jour de l'inscription, dont huit ne concernaient pas
   encore l'étudiant. Ce qui compte aujourd'hui était noyé, et il ne
   restait rien à découvrir.

   Ce qui se cache, c'est le DÉTAIL. Le rail des six phases reste entier
   (voir .jy-rail plus haut) : on ne cache jamais la route à quelqu'un
   qui paie pour la parcourir. Et rien n'est verrouillé — `.is-devoilee`
   est posée par un bouton, sur décision de l'étudiant.

   Les états viennent de js/revelation.js et sont posés par
   dashboard.js : is-faite / is-ouverte / is-entrouverte / is-scellee. */

/* LE REPLI PAR DÉFAUT — avant que le JS n'ait rien peint.
   js/app-shell.js retire le loader dès que la session est résolue, mais
   dashboard.js attend encore deux allers-retours réseau (candidatures,
   puis catalogue) avant de poser le premier état de révélation. Entre
   les deux, la page est visible. Sans cette règle, l'étudiant voit les
   six phases dépliées — précisément ce que ce lot supprime — puis les
   voit s'effondrer sous ses yeux, avec un saut de défilement.
   `data-parcours-pret` est posé par dashboard.js à la fin du premier
   rafraîchissement de la carte. */
body:not([data-parcours-pret]) .jy-phase > *:not(.jy-phase-head){
display:none;
}

.jy-phase-body{
display:block;
}

/* Ces trois blocs sont pilotés par la propriété `hidden` depuis le JS et
   portent un `display` d'auteur, qui bat la feuille du navigateur. Les
   deux hubs ont bien `[hidden]{display:none !important}` dans leur
   <head> — mais c'est une ligne de HTML, facile à perdre à la prochaine
   refonte de gabarit, et le jour où elle partirait la ligne verte
   « 6 démarches sur 6 accomplies » resterait affichée au-dessus d'un
   compteur qui dirait 5. On ne dépend pas d'elle. */
.jy-phase-resume[hidden],
.jy-phase-voile[hidden],
.jy-quota[hidden],
.jy-radar[hidden]{
display:none;
}

/* Ce qui n'est pas la phase en cours est replié — jusqu'à ce que
   l'étudiant décide le contraire. */
.jy-phase.is-faite:not(.is-devoilee) > .jy-phase-body,
.jy-phase.is-entrouverte:not(.is-devoilee) > .jy-phase-body,
.jy-phase.is-scellee:not(.is-devoilee) > .jy-phase-body{
display:none;
}

.jy-phase.is-faite > .jy-phase-voile,
.jy-phase.is-ouverte > .jy-phase-voile,
.jy-phase.is-devoilee > .jy-phase-voile{
display:none;
}

/* L'ouverture : un mouvement court, jamais un rideau. Respecté par
   prefers-reduced-motion plus bas. */
.jy-phase.is-devoilee > .jy-phase-body,
.jy-phase.is-ouverte > .jy-phase-body{
animation:jy-devoile .34s cubic-bezier(.22,.61,.36,1) both;
}

@keyframes jy-devoile{
from{ opacity:0; transform:translateY(-6px); }
to{ opacity:1; transform:none; }
}

/* ---------- LE VOILE — ce qui vous attend, et ce qui l'ouvre ---------- */
.jy-phase-voile{
position:relative;
margin:4px 0 6px;
padding:20px 22px;
border:1px dashed var(--border-color);
border-radius:16px;
background:
linear-gradient(160deg, rgba(217,128,90,.05) 0%, transparent 58%),
var(--background-soft);
}

.jy-voile-attend{
margin:0 0 12px;
max-width:64ch;
font-family:var(--font-affirmation);
font-size:1rem;
line-height:1.55;
color:var(--journey-ink);
}

.jy-voile-cle{
display:flex;
align-items:flex-start;
gap:8px;
margin:0 0 14px;
font-size:.82rem;
line-height:1.5;
color:var(--text-light);
}

.jy-voile-cle i,
.jy-voile-cle svg{ flex-shrink:0; width:14px; height:14px; margin-top:2px; color:var(--amber-700); }
.jy-voile-cle strong{ color:var(--journey-ink); font-weight:700; }

.jy-voile-btn{
display:inline-flex;
align-items:center;
gap:7px;
padding:8px 15px;
border-radius:999px;
border:1px solid var(--border-color);
background:var(--background);
font-family:inherit;
font-size:.79rem;
font-weight:700;
color:var(--text-light);
cursor:pointer;
transition:var(--transition);
}

.jy-voile-btn:hover{ border-color:var(--amber-600); color:var(--amber-700); }
.jy-voile-btn i,
.jy-voile-btn svg{ width:14px; height:14px; }

/* La phase juste après la courante se distingue de celles du fond :
   c'est la prochaine, elle doit donner envie un cran plus fort. */
.jy-phase.is-entrouverte > .jy-phase-voile{
border-style:solid;
border-color:rgba(190,96,50,.34);
}

.jy-phase.is-scellee > .jy-phase-voile{ opacity:.82; }

/* ---------- LA LIGNE D'UNE PHASE FAITE ---------- */
.jy-phase-resume{
display:flex;
align-items:center;
gap:10px;
width:100%;
margin:2px 0 6px;
padding:12px 16px;
border:1px solid rgba(47,122,70,.28);
border-radius:14px;
background:#F3F8F4;
font-family:inherit;
font-size:.85rem;
font-weight:600;
text-align:left;
color:var(--journey-done);
cursor:pointer;
transition:var(--transition);
}

.jy-phase-resume:hover{ border-color:var(--journey-done); }
.jy-phase-resume > i,
.jy-phase-resume > svg{ flex-shrink:0; width:15px; height:15px; }
.jy-phase-resume span{ flex:1 1 auto; }

.jy-phase-resume-caret{ transition:transform .2s var(--ease-standard, ease); }
.jy-phase.is-devoilee .jy-phase-resume-caret{ transform:rotate(180deg); }

/* ---------- LE RAIL : estompé, jamais amputé ---------- */
.jy-rail-item.is-scellee .jy-rail-dot{ opacity:.5; }
.jy-rail-item.is-scellee .jy-rail-label{ opacity:.62; }
.jy-rail-item.is-entrouverte .jy-rail-dot{ border-style:dashed; }

/* ==========================================================
   LA LIGNE DU QUOTA — « votre formule vous donne N »
   ==========================================================
   Le nombre de candidatures était APPLIQUÉ (applications.js bloquait au
   dépassement) et jamais DIT. Un client Conseiller pouvait parcourir son
   espace entier sans lire une seule fois le chiffre six. */

.jy-quota{
display:flex;
align-items:flex-start;
gap:9px;
margin:0 0 18px;
padding:11px 14px;
border:1px solid var(--border-color);
border-left:3px solid var(--amber-600);
border-radius:0 12px 12px 0;
background:var(--journey-paper);
font-size:.85rem;
line-height:1.55;
color:var(--journey-ink);
}

.jy-quota i,
.jy-quota svg{ flex-shrink:0; width:15px; height:15px; margin-top:2px; color:var(--amber-700); }
.jy-quota.is-complet{ border-left-color:var(--journey-done); }
.jy-quota.is-complet i,
.jy-quota.is-complet svg{ color:var(--journey-done); }

/* Le conteneur portait .jy-card ET chaque étape a maintenant son propre
   cadre : deux boîtes emboîtées. Le conteneur redevient un simple
   empilement — la carte, désormais, c'est l'étape. (La classe reste dans
   les deux HTML, qui sont identiques au caractère près et qu'un test
   compare : on la neutralise ici plutôt que de les modifier deux fois.) */
#jyVisaGuide.jy-card{
padding:0;
border:none;
background:transparent;
box-shadow:none;
}

/* ==========================================================
   LE GUIDE VISA, RÉVÉLÉ LUI AUSSI (phase 06)
   ==========================================================
   Six cartes ouvertes d'un coup, c'est neuf paragraphes avant la
   première action. On n'en montre qu'une — celle en cours. Le contenu
   des autres est écrit dans le DOM : dévoiler est instantané. */

.jy-guide-step{
position:relative;
padding:16px 18px;
border:1px solid var(--border-color);
border-radius:14px;
background:var(--background);
transition:border-color .2s ease, background .2s ease;
}

/* Le numéro quitte le titre pour une pastille : à six cartes, « 1 · »
   collé au texte se lisait comme une puce, pas comme un rang. */
.jy-guide-rang{
display:inline-flex;
align-items:center;
justify-content:center;
flex:none;
width:20px;
height:20px;
margin-right:2px;
border-radius:50%;
background:var(--background-soft);
font-family:var(--font-affirmation);
font-size:.72rem;
font-weight:800;
color:var(--amber-700);
}

.jy-guide-step.is-ouverte{
border-color:rgba(190,96,50,.4);
box-shadow:0 1px 2px rgba(33,29,24,.05), 0 12px 28px -20px rgba(33,29,24,.28);
}

.jy-guide-step.is-ouverte .jy-guide-rang{ background:var(--amber-600); color:#FDF9EF; }

.jy-guide-step.is-faite .jy-guide-rang{ background:#EAF3EC; color:var(--journey-done); }

/* Repliées ou scellées : le titre, le « quand », et rien d'autre. */
.jy-guide-step.is-entrouverte:not(.is-devoilee) .jy-guide-corps,
.jy-guide-step.is-scellee:not(.is-devoilee) .jy-guide-corps{
display:none;
}

/* Une étape encore scellée ne montre même pas son calendrier : le
   « quand » d'une démarche qu'on ne peut pas entamer n'est qu'une
   inquiétude de plus. */
.jy-guide-step.is-scellee .jy-guide-quand{ display:none; }

.jy-guide-devoiler{
display:none;
align-items:center;
gap:7px;
margin-top:10px;
padding:6px 12px;
border-radius:999px;
border:1px dashed var(--border-color);
background:transparent;
font-family:inherit;
font-size:.75rem;
font-weight:700;
color:var(--text-light);
cursor:pointer;
transition:var(--transition);
}

.jy-guide-devoiler:hover{ border-color:var(--amber-600); color:var(--amber-700); }
.jy-guide-devoiler i,
.jy-guide-devoiler svg{ width:13px; height:13px; }

.jy-guide-step.is-entrouverte:not(.is-devoilee) .jy-guide-devoiler,
.jy-guide-step.is-scellee:not(.is-devoilee) .jy-guide-devoiler{ display:inline-flex; }

/* Une étape faite garde son bouton « Fait » — c'est par lui qu'on la
   décoche. Elle perd seulement ce qu'on a déjà lu : pas de second bouton
   pour la même carte. */
.jy-guide-step.is-faite:not(.is-devoilee) .jy-guide-pourquoi,
.jy-guide-step.is-faite:not(.is-devoilee) .jy-guide-variante,
.jy-guide-step.is-faite:not(.is-devoilee) .jy-guide-plus{ display:none; }

.jy-guide-step.is-scellee{ background:var(--background-soft); }
.jy-guide-step.is-scellee h3{ color:var(--text-light); }

@media (prefers-reduced-motion: reduce){
.jy-phase.is-devoilee > .jy-phase-body,
.jy-phase.is-ouverte > .jy-phase-body{ animation:none; }
.jy-phase-resume-caret{ transition:none; }
}

/* ==========================================================
   LES TROIS PORTES D'UNE OPPORTUNITÉ (lot PORTAILS, 2026-09-14)
   ==========================================================
   Le site de l'établissement, le portail d'admission, le portail du
   bailleur. Les deux derniers sont une donnée payante servie par la
   Cloud Function `portails` : sur un compte sans abonnement actif, ils
   ne sont pas dans le DOM — pas grisés, pas cadenassés, absents
   (doctrine du verrou abonné, 2026-08-31).

   Le hub n'en affichait AUCUN avant ce lot : les 147 portails
   d'université déjà renseignés étaient invisibles pour l'étudiant qui
   les avait payés. */

.jy-opp-orientation{
display:flex;
align-items:flex-start;
gap:7px;
margin:0 0 10px;
font-size:.79rem;
line-height:1.5;
color:var(--journey-ink);
}

.jy-opp-orientation i,
.jy-opp-orientation svg{ flex-shrink:0; width:13px; height:13px; margin-top:3px; color:var(--amber-700); }

.jy-portes{
display:flex;
flex-direction:column;
gap:6px;
margin:0 0 14px;
}

.jy-porte{
display:flex;
align-items:center;
gap:8px;
padding:8px 11px;
border:1px solid var(--border-color);
border-radius:10px;
font-size:.79rem;
font-weight:600;
color:var(--text-color);
text-decoration:none;
transition:var(--transition);
}

.jy-porte:hover{ border-color:var(--amber-600); color:var(--amber-700); }

.jy-porte i,
.jy-porte svg{ flex-shrink:0; width:14px; height:14px; color:var(--amber-700); }

.jy-porte span{
flex:1 1 auto;
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}

/* L'icône de sortie dit « ce lien quitte FitzUniverse » — discrète, et
   la seule du lot qui ne prend pas la couleur d'accent. */
.jy-porte .jy-porte-sortie,
.jy-porte svg.jy-porte-sortie{ width:12px; height:12px; color:var(--text-muted); }

/* LA PORTE OÙ L'ON DÉPOSE SE DISTINGUE DES DEUX AUTRES.
   Sans ce repère, trois liens identiques laissent l'étudiant choisir au
   hasard la porte par laquelle il dépose — et c'est précisément ce
   qu'on lui vend.

   DEUX CORRECTIONS DU 2026-09-14, toutes deux trouvées en relecture :

   1. La règle visait `:first-child`, c'est-à-dire qu'elle DÉDUISAIT le
      sens de la position. Faux deux fois : sur les 8 universités sans
      portail d'admission, la première porte devient celle de la bourse
      alors que l'orientation dit de déposer à l'université ; et pour un
      NON-abonné, le seul lien restant — le site de l'université —
      héritait du repère, alors que 71 bourses sur 156 se déposent chez
      le bailleur. C'est `liensDOpportunite` qui sait laquelle c'est, et
      qui pose maintenant `.jy-porte--depot`.

   2. Le fond valait `var(--background)` et les portes
      `var(--journey-paper)` — or css/journey-shell.css redéfinit les
      DEUX à #FDF9EF, comme `.jy-card`. La déclaration était donc sans
      aucun effet, et les portes n'avaient même pas de contraste avec la
      carte qui les contient. On prend un fond réellement distinct. */
.jy-porte{
background:var(--background-soft);
}

.jy-porte--depot{
border-color:rgba(190,96,50,.55);
background:var(--background);
box-shadow:inset 2px 0 0 var(--amber-600);
font-weight:700;
}