.account-page { min-height:100vh; font-size:16px; line-height:1.6; }
.auth-layout { max-width:1140px; margin:0 auto; padding:80px 32px; display:grid; grid-template-columns:1.1fr 1fr; gap:80px; align-items:center; }
.redive-logo { width:200px; height:auto; margin-bottom:40px; }
.auth-story h1 { font-size:clamp(36px,4vw,54px); line-height:1.1; margin:20px 0; letter-spacing:-1.5px; }
.auth-story p,.account-card p,.account-card small { color:var(--muted); }
.account-card { padding:32px; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
.account-card h2 { font-size:24px; }
.account-card label { display:block; margin:18px 0; font-size:14px; }
.account-card input { display:block; width:100%; margin-top:8px; background:var(--bg); border:1px solid var(--color-control-border); color:var(--ink); padding:12px; border-radius:8px; font-size:16px; }
.account-card .primary { width:100%; }
.account-card #form-error { color:var(--color-error); }
.account-card small { font-size:12px; }
.beta-credit-card { display:flex; flex-direction:column; gap:7px; padding:18px; margin:24px 0; border:1px solid #78838b; border-radius:12px; color:#c8ced2; background:#222a30; }
.beta-credit-card strong { font-size:12px; letter-spacing:1px; }.beta-credit-card span { font-size:22px; }.beta-credit-card small { font-size:12px; }
.credits:disabled { opacity:1; color:#c8ced2; background:#222a30; border-color:#78838b; cursor:default; filter:grayscale(1); }
.admin-main { max-width:1200px; margin:40px auto; padding:0 24px; }.admin-main h1 { font-size:32px; }.admin-main p { color:var(--muted); }
.admin-metrics { display:flex; flex-wrap:wrap; gap:20px; margin:28px 0; }.admin-metrics div { padding:24px; background:var(--panel); border-radius:12px; min-width:200px; }.admin-metrics strong { display:block; font-size:32px; }
/* Hauteur bornée, défilement à l'intérieur : la page reste parcourable
   même quand l'historique s'allonge. Jev 0,85. */
.admin-table { overflow:auto; max-height:420px; overscroll-behavior:contain; }
.admin-table thead th { position:sticky; top:0; z-index:1; background:#0f1a21; }.admin-table table { width:100%; border-collapse:collapse; white-space:nowrap; }.admin-table th,.admin-table td { padding:14px; border-bottom:1px solid var(--line); text-align:left; font-size:14px; }.admin-main section { margin:32px 0; }
.invite-result { overflow-wrap:anywhere; padding:20px; background:var(--panel); border:1px solid var(--color-control-border); border-radius:8px; }.invite-result code { user-select:all; }
.admin-head { display:flex; flex-wrap:wrap; align-items:center; gap:20px; justify-content:space-between; padding:20px 32px; border-bottom:1px solid var(--line); }.admin-head .redive-logo { width:150px; margin:0; }
@media(max-width:800px){.auth-layout { grid-template-columns:1fr; padding:32px 20px;gap:24px; }.redive-logo { margin-bottom:20px; }.account-card{padding:24px;}.credit-unit { display:block; font-size:10px; }.top-actions{flex-wrap:wrap;}.topbar{height:auto; min-height:80px; padding:12px;gap:10px;flex-wrap:wrap;}.admin-head{padding:20px;}}

.recovered-text { color:var(--color-coral); }

.finance-inputs { display:flex; flex-wrap:wrap; gap:24px; }.finance-inputs label { display:grid; gap:8px; font-size:14px; }.finance-inputs input { padding:10px; background:var(--bg); color:var(--ink); border:1px solid var(--color-control-border); border-radius:8px; max-width:220px; }
.admin-main section { padding:24px; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
@media(max-width:600px){
  .auth-layout{padding:24px 20px;gap:16px;}
  .auth-story .redive-logo{width:150px;margin-bottom:8px;}
  .auth-story .eyebrow{margin:8px 0;font-size:10px;}
  .auth-story h1{font-size:32px;margin:12px 0;}
  .auth-story p{margin:10px 0;}
  .beta-credit-card{padding:12px;margin:16px 0;gap:4px;}
  .beta-credit-card span{font-size:18px;}
  .account-card{padding:20px;}
}


/* Welcome: calm color hierarchy, one strong action, a readable moving backdrop. */
.welcome-page > .welcome-proof { position:fixed; z-index:0; }
/* Voile en dégradé : mesuré, le texte posé sur la vidéo tombait à 1,13 de
   contraste quand une image claire passait, pour 4,5 exigés. Dense là où le
   texte se lit, plus léger à droite pour que la plongée reste visible. */
/* Voile allégé le 21 septembre 2026 (0,93 → 0,72) pour laisser voir la plongée.
   Mesuré sur les pixels les plus clairs des deux vidéos sous la colonne de
   texte : titre corail 4,2 minimum (grand texte, seuil 3), corps blanc 9,7.
   La seule ligne qui contraignait le voile était le petit texte des formats,
   éclairci ci-dessous. */
.welcome-page > .welcome-proof::after { background:linear-gradient(97deg,rgba(4,12,18,.72) 0%,rgba(4,12,18,.68) 36%,rgba(4,12,18,.45) 58%,rgba(4,12,18,.3) 100%); }
.welcome-page .camera-support small { color:#d3dee2; }
.welcome-page .auth-layout { position:relative; z-index:1; min-height:100svh; max-width:1180px; padding:48px 40px 64px; grid-template-columns:minmax(0,1fr) minmax(360px,430px); gap:72px; pointer-events:none; }
.welcome-page .auth-story, .welcome-page .account-card { pointer-events:auto; min-width:0; }
.welcome-page .auth-story { text-shadow:0 2px 18px #051019; }
.welcome-page .auth-story .redive-logo { filter:drop-shadow(0 2px 6px #05101980); display:block; width:280px; max-width:80%; height:auto; margin:0 0 32px; }
.welcome-page .auth-story h1 { font-size:clamp(38px,4.3vw,56px); line-height:1.08; letter-spacing:-1.7px; margin:0 0 22px; }
.welcome-page .welcome-benefit { margin-bottom:28px; }
.welcome-page .auth-story .benefit-copy { margin:0 0 16px; font-size:19px; line-height:1.5; }
.welcome-page .auth-story .camera-support { margin:0; }
.welcome-page .beta-credit-card { background:#222a30ed; border-color:#65747d; max-width:390px; padding:16px 20px; margin:0; gap:4px; text-shadow:none; }
.welcome-page .beta-credit-card span { font-size:21px; font-weight:500; }
.welcome-page .beta-credit-card strong { font-size:10px; letter-spacing:1.3px; }
.welcome-page .beta-credit-card small { font-size:12px; }
.welcome-page .account-card { padding:32px; background:rgba(11,20,27,.97); border-color:#ffffff26; box-shadow:0 16px 64px #0003; }
.welcome-page .account-card h2 { margin:28px 0 24px; font-size:26px; letter-spacing:-.5px; }
.welcome-page .mode-switch button { min-height:44px; }
.welcome-page .account-card label { margin:18px 0 8px; font-size:14px; }
.welcome-page .account-card input { margin:0; min-height:48px; }
.welcome-page .account-card input[aria-invalid="true"] { border-color:var(--color-error); }
.welcome-page .account-card .primary { min-height:48px; font-weight:600; }
.welcome-page #form-error { font-size:13px; line-height:1.5; margin:14px 0; }
.welcome-page #form-error:empty { margin:24px 0 0; }
.welcome-page #register-note { font-size:12px; line-height:1.5; margin:12px 0 0; }
.welcome-page .account-help { font-size:12px; line-height:1.6; margin:20px 0 0; text-align:center; }
.welcome-page > .proof-play { position:fixed; bottom:12px; right:12px; z-index:4; min-width:44px; min-height:44px; padding:6px; background:#0b1116ee; border:1px solid #ffffff2b; color:var(--ink); }
/* Sous le formulaire, dans le flux : en position fixe, ces liens recouvraient
   la ligne des formats dès qu'une fenêtre descendait sous ~430 px de haut.
   Mesuré, pas supposé. */
.welcome-page .legal-links {
  display: flex;
  justify-content: center;
  gap: var(--space-4);
  margin: 14px 0 0;
}
.welcome-page .legal-links a { font-size: 12px; color: var(--muted); }
/* Le sélecteur se pose sur la vidéo : il lui faut son propre fond pour rester lisible. */
.welcome-page > .welcome-lang { position:fixed; top:12px; right:12px; z-index:4; min-width:52px; min-height:44px; background:#0b1116ee; border-color:#ffffff2b; color:var(--ink); }
@media(max-width:900px){
 .welcome-page .auth-layout { grid-template-columns:1fr; max-width:560px; padding:36px 24px 72px; gap:28px; }
 .welcome-page .auth-story .redive-logo { width:240px; margin-bottom:28px; }
 .welcome-page .auth-story h1 { font-size:44px; }
 .welcome-page .beta-credit-card { max-width:none; }
 .welcome-page .account-card { padding:28px; }
}
@media(max-width:420px){
 .welcome-page .auth-layout { padding:28px 20px 72px; gap:24px; }
 .welcome-page .auth-story .redive-logo { width:210px; margin-bottom:24px; }
 .welcome-page .auth-story h1 { font-size:36px; margin-bottom:18px; }
 .welcome-page .auth-story .benefit-copy { font-size:17px; }
 .welcome-page .welcome-benefit { margin-bottom:22px; }
 .welcome-page .beta-credit-card { padding:14px 16px; }
 .welcome-page .account-card { padding:22px; }
}

/* Retours de la bêta, lus dans la console. */
.feedback-list { display:flex; flex-direction:column; gap:12px; }
.feedback-item { padding:16px; border-radius:12px; border:1px solid var(--line); background:#0f1a2199; }
.feedback-item.is-bug { border-left:3px solid #ff8a80; }
.feedback-item header { display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:8px; }
.feedback-item header strong { font-size:13px; color:var(--mint); }
.feedback-item header span, .feedback-item header time { font-size:12px; color:var(--muted); }
.feedback-item p { margin:0; white-space:pre-wrap; line-height:1.6; }
.feedback-item details { margin-top:10px; font-size:12px; color:var(--muted); }
.feedback-item summary { cursor:pointer; padding:4px 0; }
.feedback-item dl { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:6px 0 0; }
.feedback-item dd { margin:0; color:var(--ink); overflow-wrap:anywhere; }

/* Ce qui tourne en ce moment, en tête de console. */
#running-section { margin-top:0; }
#running-note { font-size:13px; color:var(--muted); }
.running-list { display:flex; flex-direction:column; gap:12px; }
.running-item { padding:16px; border-radius:12px; border:1px solid #7fd4c133; background:linear-gradient(180deg,#16332e,#12262a); }
.running-item header { display:flex; flex-wrap:wrap; align-items:baseline; gap:12px; margin-bottom:10px; }
.running-item header strong { font-size:14px; }
.running-item header span, .running-item header time { font-size:12px; color:var(--muted); }
.running-item p { margin:8px 0 0; font-size:12px; color:var(--muted); }
.running-bar { height:4px; border-radius:2px; background:#ffffff14; overflow:hidden; }
.running-bar span { display:block; height:100%; background:var(--mint); transition:width .4s ease; }
.running-bar.indeterminate span { width:35% !important; animation:running-slide 1.4s ease-in-out infinite; }
@keyframes running-slide { 0%{transform:translateX(-100%);} 100%{transform:translateX(300%);} }

/* Conversions par jour. Une barre par jour, trente jours. */
.daily-chart { display:flex; align-items:flex-end; gap:3px; height:120px; padding:8px 0; border-bottom:1px solid var(--line); }
.daily-col { flex:1; height:100%; display:flex; align-items:flex-end; min-width:6px; }
.daily-col.vide .daily-bar { height:2px !important; background:#ffffff14; }
.daily-bar { width:100%; min-height:2px; border-radius:3px 3px 0 0; background:var(--mint); opacity:.85; }
.daily-legend { font-size:12px; color:var(--muted); margin-top:8px; }

/* L'historique des retours défile chez lui, comme les tableaux. */
.feedback-list { max-height:460px; overflow-y:auto; overscroll-behavior:contain; padding-right:4px; }

/* Avis sur les rendus, dans la console. */
.verdict-list { display:flex; flex-direction:column; gap:6px; max-height:260px; overflow-y:auto; }
.verdict-row { margin:0; padding:8px 12px; border-radius:8px; background:#0f1a2199; font-size:13px; border-left:3px solid #7fd4c155; }
.verdict-row .verdict-who { margin-left:10px; color:var(--muted); font-size:12px; }
.verdict-row.is-bad { border-left-color:#ff8a80; }
.admin-metrics small { display:block; margin-top:4px; font-size:11px; color:var(--muted); opacity:.85; }

/* Les pages de compte et la console n'avaient aucune règle de mouvement réduit :
   la barre indéterminée des traitements en cours glissait quand même. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after { animation:none !important; transition:none !important; }
  .running-bar.indeterminate span { width:100% !important; transform:none; opacity:.5; }
}

/* Les exemples de saisie de l'admin mesuraient 4,03 sur fond sombre : la
   couleur par défaut du navigateur, pas la nôtre. */
::placeholder { color: var(--muted); opacity: 1; }

/* Choix de la vidéo d'accueil : une carte par variante, affiche à gauche. */
.welcome-choice { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.welcome-card { display: grid; grid-template-columns: auto 128px 1fr; gap: var(--space-3); align-items: center; padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-card); cursor: pointer; }
.welcome-card.current { border-color: var(--mint); }
.welcome-card img { width: 128px; height: 72px; object-fit: cover; border-radius: var(--radius-control); display: block; }
.welcome-label { display: grid; gap: var(--space-1); font-size: 13px; }
.welcome-label span { color: var(--muted); font-size: 12px; }

/* Demande d'invitation sur l'accueil : même colonne que le formulaire, un
   sélecteur habillé comme les champs. */
.welcome-page .request-form { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px solid var(--line); }
.welcome-page .request-form h3 { margin: 0 0 var(--space-2); font-size: 18px; }
.welcome-page .account-card select { width: 100%; min-height: 48px; margin: 0; padding: 0 var(--space-3); font: inherit; color: var(--ink); background: #ffffff08; border: 1px solid var(--color-control-border); border-radius: var(--radius-control); }
.welcome-page .account-card select:focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; }
.welcome-page #request-error { font-size: 13px; line-height: 1.5; margin: 14px 0; color: var(--color-error); }
.welcome-page #request-error:empty { margin: var(--space-4) 0 0; }
.welcome-page .request-form .secondary { width: 100%; min-height: 48px; }

/* Console : une ligne par demande, actions à droite. */
.request-list { display: grid; gap: var(--space-3); }
.request-row { display: flex; justify-content: space-between; gap: var(--space-4); align-items: center; padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-card); flex-wrap: wrap; }
.request-who { display: grid; gap: var(--space-1); font-size: 13px; }
.request-who span { color: var(--muted); font-size: 12px; }
.request-who code { font-size: 14px; padding: var(--space-1) var(--space-2); background: #ffffff0f; border-radius: 6px; }
.request-actions { display: flex; gap: var(--space-2); }
