/* Общие CSS-токены для всех страниц fenix-clan.ru — тёмная тема, шрифты альянса.
   Подключается через <link rel="stylesheet" href="/assets/theme.css"> после шрифтов Google Fonts.
   Страницы могут переопределять/добавлять переменные локально при необходимости. */
:root{
  --bg:#15120f;
  --bg-raised:#1e1916;
  --ink:#ede6da;
  --ink-dim:#9c9186;
  --ember:#e8542a;
  --ember-dim:#8c3a1e;
  --amber:#d9a441;
  --rule:#332b24;
  --black:#0a0908;
  --ok:#7ee787; --ok-bg:#123321;
  --bad:#ff8a6a; --bad-bg:#3a1712;
  --font-display:'PT Sans Narrow', 'Arial Narrow', sans-serif;
  --font-body:'PT Sans', system-ui, sans-serif;
  --font-mono:'PT Mono', ui-monospace, monospace;
}

/* Общая навигация верхних «внутренних» страниц (не главная — у неё отдельный полноэкранный стиль).
   Липкая (sticky) — поиск и разделы всегда под рукой на длинных гайдах (events.html, gear.html и т.п.).
   Внутри — две строки: .topbar-row (назад + меню + поиск) и опциональные
   .crumbs (хлебные крошки, выводятся Nav.astro автоматически по path/title —
   см. комментарий в Nav.astro, здесь только стили). */
.topbar{
  position:sticky;top:0;z-index:30;
  background:var(--bg);
  margin:0 0 18px;padding:14px 0 12px;
  border-bottom:1px solid var(--rule);
}
.topbar-row{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap}
.back{font-family:var(--font-mono);font-size:.8rem;color:var(--amber);text-decoration:none;letter-spacing:.04em}
.back:hover{color:var(--ink)}
.topbar-right{display:flex;align-items:center;gap:14px 20px;flex-wrap:wrap;flex:1 1 auto;justify-content:flex-end}
.pagenav{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;font-family:var(--font-mono);font-size:.78rem;letter-spacing:.03em}
.pagenav a{color:var(--ink-dim);text-decoration:none}
.pagenav a:hover{color:var(--amber)}
.pagenav a[aria-current="page"]{color:var(--amber)}

/* «Гайды» в .pagenav — выпадающее меню на <details> (см. Nav.astro).
   Мобильный дефолт: панель в обычном потоке, блоком на всю ширину, как
   аккордеон (.acc/.faq) — раскрывается вниз, ничего не обрезает по краю
   экрана. С min-width:641px — абсолютно спозиционированная панель под
   summary, группы в несколько колонок (места на строке уже хватает). */
.navdrop summary{cursor:pointer;list-style:none;color:var(--ink-dim)}
.navdrop summary::-webkit-details-marker{display:none}
.navdrop summary::after{content:" ▾";font-size:.85em}
.navdrop[open] summary::after{content:" ▴"}
.navdrop summary:hover,
.navdrop[open] summary,
.navdrop summary[aria-current="page"]{color:var(--amber)}
.navdrop-panel{margin-top:10px;padding:10px 4px;display:flex;flex-direction:column;gap:12px}
.navdrop-group{display:flex;flex-direction:column;gap:1px}
.navdrop-label{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim);opacity:.65;padding:4px 8px 3px}
.navdrop-panel a{padding:7px 8px;border-radius:5px;color:var(--ink-dim);text-decoration:none;font-size:.86rem}
.navdrop-panel a:hover{background:rgba(255,255,255,.05);color:var(--ink)}
.navdrop-panel a[aria-current="page"]{color:var(--amber)}
@media (min-width:641px){
  .navdrop{position:relative}
  .navdrop-panel{
    position:absolute;top:calc(100% + 10px);left:0;z-index:40;
    margin-top:0;width:max-content;max-width:min(560px,90vw);
    background:var(--bg-raised);border:1px solid var(--rule);border-radius:8px;
    padding:12px;box-shadow:0 16px 40px rgba(0,0,0,.45);
    display:grid;grid-template-columns:repeat(3,auto);gap:4px 22px;
  }
}

.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:8px;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.02em;color:var(--ink-dim)}
.crumbs a{color:var(--ink-dim);text-decoration:none}
.crumbs a:hover{color:var(--amber)}
.crumbs .sep{color:var(--rule)}
.crumbs [aria-current="page"]{color:var(--ink)}