/* ============================================================================
   PASSERELLE · Practice
   Complément de passerelle-ui.css, propre à cet espace. Aucune couleur
   nouvelle. Pas de Tailwind : la page porte un lien d'accès personnel, donc
   aucun script tiers. Les espacements nécessaires sont écrits ici.
   ============================================================================ */

[hidden]{ display:none !important; }

/* ---------- Titres --------------------------------------------------------- */
.pr-title{ font-size:var(--step-3); }
@media (min-width:640px){ .pr-title{ font-size:var(--step-4); } }
.pr-title--page{ font-size:var(--step-3); margin-top:.5rem; }
.pr-title:focus, .pr-situation:focus{ outline:none; }
.pr-lede{ margin-top:.75rem; font-size:var(--step-1); max-width:46ch; }
.pr-eyebrow{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:var(--step--1);
             letter-spacing:.1em; text-transform:uppercase; color:var(--teal-ink); margin:0; }
.pr-subtitle{ font-size:var(--step-2); margin-top:3rem; }
@media (min-width:900px){ .pt-gate__inner.pr-single{ grid-template-columns:1fr; max-width:var(--read-w); margin-left:auto; margin-right:auto; } }

/* ---------- Accueil -------------------------------------------------------- */
.pt-shell.pr-wide{ max-width:var(--page-w); }
.pr-modules{ display:grid; gap:1rem; margin-top:2.5rem; }
@media (min-width:760px){ .pr-modules{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.pr-card{ border:1px solid var(--line); border-radius:var(--r); padding:1.5rem;
          display:flex; flex-direction:column; gap:.75rem; background:var(--cream); min-width:0; }
.pr-card--soon{ background:var(--sand); }
.pr-card--soon .pr-eyebrow{ color:var(--slate); }
.pr-card__title{ font-size:var(--step-2); }
.pr-card__text{ margin:0; color:var(--slate); }
.pr-card__meta{ margin:0; font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:var(--step--1); color:var(--navy); }
.pr-actions{ display:flex; flex-wrap:wrap; gap:.75rem; margin-top:auto; padding-top:.5rem; }
#screen-end .pr-actions{ margin-top:2rem; }

.pr-tools{ list-style:none; padding:0; margin:1rem 0 .5rem; display:grid; gap:0;
           border-top:1px solid var(--line); }
.pr-tools li{ display:flex; flex-wrap:wrap; gap:.25rem 1rem; align-items:baseline;
              padding:.875rem 0; border-bottom:1px solid var(--line); }
.pr-tools a{ color:var(--navy); font-weight:600; text-underline-offset:3px; text-decoration-color:var(--teal); }
.pr-tools a:hover{ color:var(--teal-ink); }
.pr-tools span{ color:var(--slate); font-size:var(--step--1); }

.pr-privacy{ margin-top:3rem; padding:1.5rem; background:var(--sand); border-radius:var(--r); max-width:var(--read-w); }
.pr-privacy__title{ font-size:var(--step-1); font-family:Inter,system-ui,sans-serif; font-weight:600; letter-spacing:0; }
.pr-privacy p{ margin:.75rem 0 0; color:var(--slate); max-width:62ch; }
.pr-privacy a{ color:var(--teal-ink); }

/* ---------- Choix d'une série --------------------------------------------- */
.pr-back{ margin-left:-.75rem; }
.pr-picks{ display:grid; gap:.75rem; margin-top:2rem; }
.pr-pick{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:.25rem 1rem; }
.pr-pick__title{ font-weight:500; }
.pr-pick__meta{ font-family:"IBM Plex Mono",ui-monospace,monospace; font-size:var(--step--1); color:var(--slate); }

/* ---------- Exercice ------------------------------------------------------- */
#screen-play .pr-eyebrow{ margin-top:2rem; }
.pr-situation{ font-size:var(--step-2); line-height:1.3; margin-top:1rem; max-width:34ch; }
.pr-ask{ margin:1.25rem 0 0; color:var(--slate); }
.pr-choices{ display:grid; gap:.75rem; margin-top:1.25rem; }
.pr-feedback{ margin-top:1.75rem; }
.pr-model{ margin:0; font-weight:600; }
.pr-why{ margin:.5rem 0 0; color:var(--slate); max-width:60ch; }
.pr-next{ margin-top:1.5rem; }

/* ---------- Mes phrases ---------------------------------------------------- */
.pr-section{ border-bottom:1px solid var(--line); }
#phraseSections{ margin-top:2rem; border-top:1px solid var(--line); }
.pr-section__sum{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
                  padding:1rem 0; cursor:pointer; list-style:none; }
.pr-section__sum::-webkit-details-marker{ display:none; }
.pr-section__sum::before{ content:"+"; font-family:"IBM Plex Mono",monospace; color:var(--teal-ink); width:1rem; flex:none; }
.pr-section[open] > .pr-section__sum::before{ content:"\2212"; }
.pr-section__title{ flex:1; font-family:Fraunces,Georgia,serif; font-size:var(--step-1); }
.pr-section__meta{ font-family:"IBM Plex Mono",monospace; font-size:var(--step--1); color:var(--teal-ink); }
.pr-group{ font-family:Inter,system-ui,sans-serif; font-size:var(--step--1); font-weight:600; letter-spacing:.04em;
           text-transform:uppercase; color:var(--slate); margin:1rem 0 .25rem 2rem; }
.pr-list{ list-style:none; padding:0; margin:0 0 1rem; }
.pr-phrase{ display:flex; align-items:flex-start; gap:.75rem; padding:.5rem 0 .5rem 2rem; }
#ownList .pr-phrase{ padding-left:0; border-bottom:1px solid var(--line); align-items:center; }
.pr-phrase input{ width:1.25rem; height:1.25rem; margin:.15rem 0 0; flex:none; accent-color:var(--teal); cursor:pointer; }
.pr-phrase__text{ flex:1; cursor:pointer; overflow-wrap:anywhere; }
.pr-phrase__tag{ font-family:"IBM Plex Mono",monospace; font-size:var(--step--1); color:var(--teal-ink); min-width:2.5rem; text-align:right; }
.pr-del{ padding:.375rem .625rem; min-height:0; font-size:var(--step--1); }

.pr-own{ margin-top:1.25rem; max-width:var(--read-w); }
.pr-own .pt-inline{ flex-wrap:nowrap; }
.pr-own__field{ flex:1; min-width:0; }
#ownMsg{ min-height:1.5rem; }

/* ---------- Pied ----------------------------------------------------------- */
.pr-signout{ background:none; border:0; padding:0; font:inherit; color:inherit; cursor:pointer;
             text-decoration:underline; text-underline-offset:3px; }