/* ─────────── commun aux pages de rien ───────────
   Barre du haut, boutons, connexion et vues en liste. Partagé par
   historique.html, parametres.html et monde.html — l'accueil (index.html)
   et frise.html gardent leur propre feuille, elles ont trop de style à elles.
   Une seule règle ici : ne rien écrire qui dépende d'une page en particulier. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#080706; --bg2:#100e0c; --line:rgba(255,255,255,.10);
  --line2:rgba(255,255,255,.18); --txt:rgba(255,255,255,.80);
  --txt2:rgba(255,255,255,.62); --txt3:rgba(255,255,255,.50);
  --hi:#f0ece5; --bar:46px;
}
html,body{height:100%}
body{background:var(--bg);font-family:'IBM Plex Mono',monospace;color:var(--txt);
  -webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit;color:inherit}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.10);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.20)}
::-webkit-scrollbar-track{background:transparent}

/* ── barre du haut ── */
#bar{position:fixed;top:0;left:0;right:0;height:var(--bar);display:flex;align-items:center;
  gap:10px;padding:0 14px;background:rgba(255,255,255,.045);
  backdrop-filter:blur(6px) saturate(1.4);-webkit-backdrop-filter:blur(6px) saturate(1.4);
  border-bottom:1px solid var(--line2);z-index:100}
#bar a.back{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--txt2);
  text-decoration:none;flex-shrink:0;transition:color .15s}
#bar a.back:hover{color:var(--txt)}
.sp{width:1px;height:20px;background:var(--line);flex-shrink:0}
#brand{font-family:'Fraunces',serif;font-size:16px;letter-spacing:.22em;color:var(--hi);flex-shrink:0}
#brandSub{font-size:9px;letter-spacing:.09em;text-transform:uppercase;color:var(--txt3);
  flex-shrink:0;margin-left:-4px}
.tb{background:rgba(255,255,255,.07);border:1px solid var(--line2);color:var(--txt);
  font-size:10.5px;padding:5px 11px;border-radius:7px;cursor:pointer;letter-spacing:.04em;
  transition:all .16s;white-space:nowrap;text-decoration:none;display:inline-flex;
  align-items:center;gap:6px;flex-shrink:0}
.tb:hover{background:rgba(255,255,255,.13);color:#fff}
.tb.on{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.34)}
.tb.red{background:rgba(255,90,90,.14);border-color:rgba(255,120,120,.45);color:#ffb3b3}
.tb.red:hover{background:rgba(255,90,90,.28)}
.tb:disabled{opacity:.4;cursor:default}
#etat{margin-left:auto;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--txt3);flex-shrink:0;transition:color .2s;text-align:right}
#etat.ok{color:rgba(150,220,170,.75)}
#etat.err{color:rgba(240,150,140,.9);text-transform:none;letter-spacing:0}
#uInfo{font-size:10px;color:var(--txt3);flex-shrink:0}

/* ── corps de page ── */
#wrap{padding:calc(var(--bar) + 20px) 20px 60px;max-width:1000px;margin:0 auto}
.secH{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--txt3);
  margin:20px 0 9px;display:flex;align-items:center;gap:10px}
.secH:first-child{margin-top:0}
.secH:after{content:'';flex:1;height:1px;background:var(--line)}
.vide{color:var(--txt3);font-size:12px;padding:30px 0;text-align:center}
.chargement{color:var(--txt3);font-size:11px;letter-spacing:.14em;padding:40px 0;text-align:center}

/* ── connexion (injectée par commun.js) ── */
#authOv{position:fixed;inset:0;z-index:760;background:rgba(4,4,3,.72);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  display:none;align-items:flex-start;justify-content:center;overflow:auto;padding:60px 16px}
#authOv.on{display:flex}
#authBx{background:var(--bg2);border:1px solid var(--line2);border-radius:14px;
  width:100%;max-width:340px;padding:20px 22px 18px;height:max-content}
#authBx{position:relative;max-width:360px !important;padding:22px 22px 18px !important;
  background:#0a0a09 !important;border:1px solid rgba(255,255,255,.14) !important;border-radius:0 !important;
  font-family:'IBM Plex Mono',ui-monospace,monospace}
/* 04/11/2026 v2 : connexion sobre facon terminal, lisible */
#authBx::before,#authBx::after{content:'';position:absolute;width:10px;height:10px;border:solid #e9d8a6;pointer-events:none}
#authBx::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
#authBx::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
#authBx h3{font-family:inherit;font-size:12px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;
  color:rgba(255,255,255,.8);padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid rgba(255,255,255,.08)}
#authBx h3::before{content:'// ';color:#e9d8a6}
#authBx label{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62);margin:16px 0 7px}
#authBx label.auRester{font-size:13px;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.7);
  display:flex;align-items:center;gap:10px;margin-top:16px;cursor:pointer}
#authBx label.auRester input{width:15px;height:15px;margin:0;appearance:none;-webkit-appearance:none;position:relative;
  border:1px solid rgba(255,255,255,.35);background:transparent;cursor:pointer}
#authBx label.auRester input:checked{border-color:#e9d8a6}
#authBx label.auRester input:checked::after{content:'';position:absolute;inset:3px;background:#e9d8a6}
#authBx input[type=text],#authBx input[type=password]{width:100%;box-sizing:border-box;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.16);border-radius:0;color:#f1ece0;caret-color:#e9d8a6;font-family:inherit;
  font-size:15px;padding:10px 11px;outline:none;transition:border-color .2s}
#authBx input[type=text]:focus,#authBx input[type=password]:focus{border-color:rgba(233,216,166,.7);box-shadow:none}
#authBx .auPw{position:relative}
#authBx .auPw input{padding-right:78px}
#auVoir{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:transparent;border:0;cursor:pointer;
  color:rgba(255,255,255,.5);font-family:inherit;font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:6px 8px}
#auVoir:hover,#auVoir:focus-visible{color:#e9d8a6;outline:none}
#auErr{font-size:13px;line-height:1.4;color:#ff9a8e;min-height:18px;margin-top:12px}
#auErr:not(:empty)::before{content:'! '}
#auBtns{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin-top:6px}
#auBtns .tb{font-family:inherit !important;font-size:12px !important;letter-spacing:.2em !important;text-transform:uppercase;
  padding:10px 16px !important;border-radius:0 !important;background:transparent !important}
#auCancel{border-color:transparent !important;color:rgba(255,255,255,.55) !important}
#auCancel:hover{color:rgba(255,255,255,.9) !important}
#auOk{border:1px solid rgba(233,216,166,.55) !important;color:#e9d8a6 !important}
#auOk:hover,#auOk:focus-visible{background:rgba(233,216,166,.1) !important;border-color:#e9d8a6 !important;outline:none}
#auOk:disabled{opacity:.5;cursor:wait}
/* v3 minimaliste */
#authOv{background:rgba(0,0,0,.88) !important;align-items:center !important}
#authBx{background:transparent !important;border:0 !important;padding:0 4px !important}
#authBx::before,#authBx::after,#authBx h3::before,#auErr:not(:empty)::before{content:none}
#authBx h3{border:0;padding:0;margin-bottom:12px;color:rgba(255,255,255,.55)}
#authBx label{color:rgba(255,255,255,.55);letter-spacing:.12em;margin-top:20px}
#authBx input[type=text],#authBx input[type=password]{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.22);padding:8px 0}
#authBx input[type=text]:focus,#authBx input[type=password]:focus{border-bottom-color:rgba(255,255,255,.7)}
#authBx .auPw input{padding-right:70px}
#auVoir{right:0;padding:6px 0;color:rgba(255,255,255,.58)}
#auVoir:hover,#auVoir:focus-visible{color:rgba(255,255,255,.85)}
#authBx label.auRester{color:rgba(255,255,255,.6);margin-top:20px}
#authBx label.auRester input{width:13px;height:13px;border-color:rgba(255,255,255,.3)}
#authBx label.auRester input:checked{border-color:rgba(255,255,255,.7)}
#authBx label.auRester input:checked::after{inset:2px;background:rgba(255,255,255,.8)}
#auBtns{justify-content:flex-start;gap:22px;margin-top:10px}
#auBtns .tb{padding:10px 0 !important;border:0 !important;border-bottom:1px solid transparent !important}
#auOk{order:-1;border-bottom-color:rgba(233,216,166,.5) !important}
#auOk:hover,#auOk:focus-visible{background:transparent !important;border-bottom-color:#e9d8a6 !important}
#auOk::after{content:' →'}
#auCancel{color:rgba(255,255,255,.58) !important}