/* ============================================================
   CHEST — Layout partagé (nav, gate, placeholders)
   ============================================================ */

/* ---------- Brand mark (reused in topbar + sidebar) ---------- */
.brand{ display:flex; align-items:center; gap:7px; text-decoration:none; color:var(--ink); }
.brand__mark{
  position:relative; width:32px; height:32px; flex-shrink:0;
  background:url("../assets/logo-chest.png") center/contain no-repeat;
  filter:
    drop-shadow(0 0 7px rgba(252,18,131,.55))
    drop-shadow(0 0 14px rgba(249,164,94,.35));
}
.brand span{ font-weight:700; letter-spacing:-.02em; font-size:16.5px; }

.icon-btn{
  display:flex; align-items:center; justify-content:center; width:38px; height:38px;
  border-radius:var(--radius-pill); border:1px solid var(--line2); background:var(--panel);
  color:var(--muted); cursor:pointer; transition:.2s; flex-shrink:0;
}
.icon-btn:hover{ color:var(--ink); border-color:var(--line2); }

/* ---------- Topbar ---------- */
.topbar{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:12px clamp(16px,4vw,28px);
  background:var(--navbg); backdrop-filter:blur(22px) saturate(1.2); -webkit-backdrop-filter:blur(22px) saturate(1.2);
  border-bottom:1px solid var(--line);
}
.topbar__left{ display:flex; align-items:center; gap:14px; }
.topbar__actions{ display:flex; align-items:center; gap:10px; }
/* Bulle profil (-> Compte) + bulle admin (-> Membres, reservee aux admins,
   masquee par defaut via [hidden] comme l'etait le lien "Membres" de la
   sidebar) - remplacent les liens "Compte"/"Membres" de la sidebar et les
   icones soleil/cadenas du bas de sidebar, desormais consolidees ici et
   dans les reglages de Compte (retour direct utilisateur du 2026-09-16). */
.topbar__profile{ text-decoration:none; font-size:16px; }
.topbar__admin{
  text-decoration:none; font-size:14px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,var(--acc),var(--acc2)); border-color:transparent;
}
.topbar__admin:hover{ color:#fff; filter:brightness(1.08); }

/* ---------- Sidebar (off-canvas drawer, opens on demand) ---------- */
.sidebar-overlay{
  position:fixed; inset:0; z-index:70; background:rgba(0,0,0,.5);
  opacity:0; pointer-events:none; transition:opacity .3s var(--ease);
}
.sidebar-overlay.is-open{ opacity:1; pointer-events:auto; }

.sidebar{
  position:fixed; top:0; left:0; bottom:0; z-index:80; width:270px; max-width:82vw;
  background:var(--panel); border-right:1px solid var(--line2);
  display:flex; flex-direction:column;
  transform:translateX(-100%); transition:transform .32s var(--ease), background .4s ease;
}
.sidebar.is-open{ transform:translateX(0); }
.sidebar__head{ display:flex; align-items:center; justify-content:space-between; padding:18px 18px 16px; border-bottom:1px solid var(--line); }
.sidebar__nav{ display:flex; flex-direction:column; padding:14px 12px; gap:2px; flex:1; overflow-y:auto; }
.sidebar__nav a{
  display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--muted);
  font-size:14px; font-weight:600; padding:12px 14px; border-radius:var(--radius-sm);
  transition:background .2s, color .2s;
}
.sidebar__nav a .ic{ font-size:16px; width:20px; text-align:center; }
.sidebar__nav a:hover{ background:var(--panel-2); color:var(--ink); }
.sidebar__nav a.is-active{ background:var(--panel-2); color:var(--ink); box-shadow:inset 3px 0 0 var(--acc); }

/* ---------- Page shell ---------- */
.page-head{ padding:clamp(40px,7vh,64px) 0 clamp(24px,4vh,32px); }
.page-head h1{ font-size:clamp(30px,4.6vw,50px); font-weight:700; letter-spacing:-.035em; margin:0 0 10px; line-height:1.05; }
.page-head p{ color:var(--muted); font-size:15px; max-width:560px; margin:0; line-height:1.6; }

.placeholder{
  border:1px dashed var(--line2); border-radius:var(--radius); padding:clamp(40px,8vh,80px) 24px;
  text-align:center; color:var(--muted); margin:0 0 clamp(50px,8vh,90px);
}
.placeholder strong{ display:block; color:var(--ink); font-size:18px; margin-bottom:8px; font-weight:700; }
.placeholder small{ display:block; margin-top:14px; font-size:12.5px; color:var(--faint); }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--line); margin-top:clamp(40px,8vh,90px); }
.site-footer__inner{ padding:28px clamp(20px,5vw,56px); text-align:center; font-size:12px; color:var(--faint); }

/* ---------- Auth gate ---------- */
.gate{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:24px; position:relative; overflow:hidden;
}
.gate__glow{
  position:absolute; left:50%; top:-10%; width:min(900px,120vw); height:520px; border-radius:50%;
  filter:blur(120px); background:radial-gradient(ellipse,rgba(252,18,131,.4),rgba(249,164,94,.2) 45%,transparent 72%);
  transform:translateX(-50%); pointer-events:none;
}
.gate__card{
  position:relative; z-index:1; width:100%; max-width:380px;
  border:1px solid var(--line2); border-radius:24px; background:var(--panel);
  padding:36px 32px; text-align:center;
}
.gate__mark{
  width:56px; height:56px; margin:0 auto 20px;
  background:url("../assets/logo-chest.png") center/contain no-repeat;
  filter:
    drop-shadow(0 0 10px rgba(252,18,131,.55))
    drop-shadow(0 0 20px rgba(249,164,94,.35));
}
.gate__card h1{ font-size:20px; font-weight:700; letter-spacing:-.02em; margin:0 0 6px; }
.gate__card p{ font-size:13.5px; color:var(--muted); margin:0 0 26px; line-height:1.55; }
.gate__code{
  width:100%; text-align:center; font-size:22px; letter-spacing:.5em; font-weight:700;
  padding:14px 16px 14px 22px; margin-bottom:16px;
}
.gate__error{ font-size:12.5px; color:var(--red); min-height:16px; margin:-6px 0 14px; }
.gate__submit{ width:100%; }
.gate__footnote{ margin-top:22px; font-size:11.5px; color:var(--faint); line-height:1.6; }

@media (max-width: 480px){
  .gate__code{ letter-spacing:.35em; font-size:19px; }
}