/* =========================================================
   Admin console — sidebar shell + readable controls.
   Loaded after style.css (tokens: --fs-*, --ink, --teal …).
   ========================================================= */
:root{
  --adm-side:#2E271D;
  --adm-side-2:#3B3327;
  --adm-side-ink:#F4EBD8;
  --adm-side-soft:#BFB39B;
  --adm-w:272px;
}
body.adm-body{ background:var(--paper); }

/* ---------- Shell ---------- */
.adm-shell{ display:grid; grid-template-columns:var(--adm-w) minmax(0,1fr); min-height:100vh; }
.adm-mobilebar, .adm-scrim{ display:none; }

.adm-side{
  position:sticky; top:0; align-self:start; height:100vh; overflow-y:auto;
  display:flex; flex-direction:column;
  background:var(--adm-side); color:var(--adm-side-ink);
  padding:22px 16px 18px;
}
.adm-brand{
  display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--adm-side-ink);
  padding:4px 8px 22px; margin-bottom:8px; border-bottom:1px solid rgba(255,255,255,0.10);
}
.adm-brand img{ width:48px; height:48px; border-radius:50%; border:3px solid var(--gold); object-fit:cover; flex:0 0 auto; }
.adm-brand span{ font-family:var(--font-display); font-size:var(--fs-h4); line-height:1.15; display:flex; flex-direction:column; }
.adm-brand small{ font-family:var(--font-body); font-size:var(--fs-caption); color:var(--adm-side-soft); letter-spacing:0.02em; margin-top:2px; }

.adm-nav{ flex:1 1 auto; padding-top:8px; }
.adm-group{
  font-size:var(--fs-caption); font-weight:700; letter-spacing:0.08em; color:var(--adm-side-soft);
  padding:18px 12px 8px;
}
.adm-side a{
  display:flex; align-items:center; gap:12px; text-decoration:none;
  font-size:var(--fs-sm); color:var(--adm-side-ink); line-height:1.3;
  padding:12px 14px; border-radius:12px; margin-bottom:2px;
  transition:background 140ms ease;
}
.adm-side a:hover{ background:var(--adm-side-2); }
.adm-side a.is-active{ background:var(--gold); color:#2E271D; font-weight:700; }
.adm-ic{ width:26px; text-align:center; font-size:var(--fs-body); flex:0 0 auto; }
.adm-side-foot{ border-top:1px solid rgba(255,255,255,0.10); padding-top:12px; margin-top:12px; }
.adm-side a:focus-visible, .adm-burger:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }

.adm-main{ min-width:0; padding:36px 44px 96px; }
.admin-wrap{ max-width:1180px; margin:0; padding:0; }

/* ---------- Page header ---------- */
.admin-topbar{
  display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
  margin-bottom:28px; padding-bottom:20px; border-bottom:2px solid var(--line);
}
.admin-topbar h1{ font-family:var(--font-display); font-size:var(--fs-h2); line-height:1.2; margin:0; }
.admin-topbar .btn{ white-space:nowrap; }

.admin-wrap h2{ font-family:var(--font-display); font-size:var(--fs-h3); margin:0 0 14px; }
.admin-wrap .section-lede{ font-size:var(--fs-body); max-width:none; margin-bottom:22px; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  font-family:var(--font-body); font-size:var(--fs-sm); font-weight:700; line-height:1.2;
  padding:12px 20px; border-radius:12px; border:2px solid var(--line);
  background:var(--panel); color:var(--ink); text-decoration:none; cursor:pointer;
}
.btn:hover{ background:var(--paper-alt); }
.btn:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }
.btn.primary{ background:var(--teal); border-color:var(--teal-deep); color:#fff; }
.btn.primary:hover{ background:var(--teal-deep); }
.btn.danger{ background:var(--coral-soft); border-color:#E9B4A2; color:#8A2A12; }
.btn.danger:hover{ background:#FFD9CB; }
.btn.small{ padding:9px 16px; font-size:var(--fs-sm); border-radius:10px; }

/* ---------- Cards / rows ---------- */
.admin-card{
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow-sm); padding:30px 32px;
}
.ep-row{
  display:flex; justify-content:space-between; align-items:center; gap:18px; flex-wrap:wrap;
  background:var(--panel); border:1px solid var(--line); border-radius:16px;
  padding:18px 22px; margin-bottom:12px; box-shadow:var(--shadow-sm);
}
.ep-row:hover{ transform:none; box-shadow:var(--shadow-sm); border-color:#D9C9A4; }
.ep-row .info{ min-width:0; }
.ep-row .info h4{ margin:0 0 4px; font-family:var(--font-display); font-size:var(--fs-h4); line-height:1.3; }
.ep-row .info .meta{ font-family:var(--font-body); font-size:var(--fs-sm); color:var(--ink-soft); }
.ep-row .actions{ display:flex; gap:8px; flex-wrap:wrap; white-space:normal; }

/* ---------- Dashboard tiles ---------- */
.adm-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; margin-bottom:36px; }
.adm-stat{
  background:var(--panel); border:1px solid var(--line); border-radius:16px; padding:20px 22px;
  box-shadow:var(--shadow-sm);
}
.adm-stat .n{ font-family:var(--font-display); font-size:40px; line-height:1.1; color:var(--teal-deep); }
.adm-stat .l{ font-size:var(--fs-sm); color:var(--ink-soft); margin-top:6px; }
.adm-section-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.adm-section-head h2{ margin:0; }
.adm-chars{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; margin-bottom:40px; scroll-margin-top:24px; }
.adm-chars .ep-row{ margin-bottom:0; flex-wrap:nowrap; }
.adm-tag{
  display:inline-block; font-family:var(--font-body); font-size:var(--fs-caption); font-weight:700;
  background:var(--teal-soft); color:var(--teal-deep); padding:3px 10px; border-radius:999px; margin-left:8px; vertical-align:middle;
}

/* ---------- Forms ---------- */
form.admin-form{ display:flex; flex-direction:column; gap:22px; }
form.admin-form label{ font-weight:700; font-size:var(--fs-sm); display:block; margin-bottom:8px; color:var(--ink); }
form.admin-form input[type=text], form.admin-form input[type=number], form.admin-form input[type=password],
form.admin-form select, form.admin-form textarea{
  width:100%; padding:13px 15px; border:2px solid var(--line); border-radius:12px;
  font-family:var(--font-body); font-size:var(--fs-body); line-height:1.5; background:#fff; color:var(--ink);
}
form.admin-form textarea{ min-height:180px; line-height:1.7; font-family:var(--font-body); font-size:var(--fs-body); }
form.admin-form textarea.synopsis{ min-height:130px; }
form.admin-form input:focus, form.admin-form select:focus, form.admin-form textarea:focus{
  outline:none; border-color:var(--teal); box-shadow:0 0 0 4px rgba(47,125,87,0.18);
}
form.admin-form .hint, .hint{ font-size:var(--fs-sm); }
.error-msg{ color:#A5311A; font-size:var(--fs-sm); font-weight:700; margin-bottom:14px; }
.saved-msg{ color:var(--teal-deep); font-size:var(--fs-sm); font-weight:700; margin-bottom:16px;
  background:var(--teal-soft); padding:12px 16px; border-radius:12px; }

/* ---------- Login ---------- */
.login-box{ max-width:440px; padding:40px 36px; }
.login-box h1{ font-size:var(--fs-h3); margin:0 0 22px; }
.login-box input{ font-size:var(--fs-body); padding:14px 16px; border:2px solid var(--line); border-radius:12px; }
.login-box .btn{ font-size:var(--fs-body); padding:14px 20px; }

/* ---------- Narrow screens: sidebar becomes a drawer ---------- */
@media (max-width:980px){
  .adm-shell{ display:block; }
  .adm-mobilebar{
    position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:14px;
    background:var(--adm-side); color:var(--adm-side-ink); padding:10px 16px;
  }
  .adm-burger{
    font-size:var(--fs-h4); line-height:1; background:transparent; color:inherit; border:2px solid rgba(255,255,255,0.25);
    border-radius:10px; width:48px; height:48px; cursor:pointer;
  }
  .adm-mobilebar-title{ font-family:var(--font-display); font-size:var(--fs-h4); }
  .adm-side{
    position:fixed; z-index:60; left:0; top:0; bottom:0; width:min(84vw,320px); height:100dvh;
    transform:translateX(-102%); transition:transform 220ms ease;
  }
  .adm-shell.nav-open .adm-side{ transform:none; box-shadow:8px 0 30px rgba(0,0,0,0.3); }
  .adm-scrim{ position:fixed; inset:0; z-index:50; background:rgba(20,15,8,0.5); }
  .adm-shell.nav-open .adm-scrim{ display:block; }
  .adm-main{ padding:24px 18px 80px; }
  .admin-card{ padding:22px 18px; }
}
@media (max-width:560px){
  .adm-stats{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .adm-stat{ padding:16px 16px; }
  .adm-stat .n{ font-size:32px; }
  .admin-topbar .btn{ width:100%; }
}
@media (prefers-reduced-motion:reduce){ .adm-side{ transition:none; } }
