/* Shared site navigation — one source of truth across every page.
   Relies on the CSS custom properties each page already defines
   (--bg, --panel, --panel2, --border, --text, --muted, --faint, --accent, --mono). */
.sn-bar{position:sticky;top:0;z-index:1200;display:flex;align-items:center;gap:12px;height:56px;padding:0 16px;
  background:color-mix(in srgb,var(--bg,#0b0d12) 88%,transparent);border-bottom:1px solid var(--border,#2b3243);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-family:var(--sans,system-ui,sans-serif)}
.sn-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text,#edf0f5);min-width:0}
.sn-mark{width:34px;height:34px;border-radius:8px;overflow:hidden;flex:0 0 auto;border:1px solid color-mix(in srgb,var(--accent,#f97316) 40%,var(--border,#2b3243));background:var(--panel2,var(--surface2,#1b202b))}
.sn-mark img{width:100%;height:100%;object-fit:cover;display:block}
.sn-titles{display:flex;flex-direction:column;min-width:0;line-height:1.1}
.sn-name{font-family:var(--mono,ui-monospace,monospace);font-size:.85rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sn-sub{font-size:.64rem;color:var(--faint,var(--text-faint,#687385));font-family:var(--mono,ui-monospace,monospace);text-transform:uppercase;letter-spacing:.05em}
.sn-links{margin-left:auto;display:flex;align-items:center;gap:6px}
.sn-links a{height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:7px;text-decoration:none;
  font-size:.82rem;font-weight:700;color:var(--muted,var(--text-dim,#98a2b3));border:1px solid transparent;white-space:nowrap}
.sn-links a:hover{color:var(--text,#edf0f5);background:color-mix(in srgb,var(--accent,#f97316) 12%,transparent)}
.sn-links a.sn-active{color:var(--text,#edf0f5);border-color:color-mix(in srgb,var(--accent,#f97316) 55%,var(--border,#2b3243));
  background:color-mix(in srgb,var(--accent,#f97316) 16%,transparent)}
.sn-theme{width:36px;height:34px;border:1px solid var(--border,#2b3243);background:var(--panel2,var(--surface2,#1b202b));color:var(--text,#edf0f5);
  border-radius:7px;cursor:pointer;line-height:1;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}
.sn-theme:hover{border-color:var(--accent,#f97316)}
.sn-icon{width:36px;height:34px;border:1px solid var(--border,#2b3243);background:var(--panel2,var(--surface2,#1b202b));color:var(--muted,var(--text-dim,#98a2b3));border-radius:7px;cursor:pointer;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.sn-icon:hover{border-color:var(--accent,#f97316);color:var(--text,#edf0f5)}
.sn-tools{display:flex;align-items:center;gap:6px}
.sn-burger{display:none;margin-left:auto;width:38px;height:34px;border:1px solid var(--border,#2b3243);background:var(--panel2,var(--surface2,#1b202b));
  color:var(--text,#edf0f5);border-radius:7px;cursor:pointer;font-size:1rem}
@media(max-width:760px){
  .sn-burger{display:inline-flex;align-items:center;justify-content:center;margin-left:0}
  .sn-tools{margin-left:auto}
  .sn-links{position:absolute;top:56px;right:8px;left:8px;margin:0;flex-direction:column;align-items:stretch;gap:4px;
    padding:8px;background:var(--panel,var(--surface,#141821));border:1px solid var(--border,#2b3243);border-radius:10px;
    box-shadow:0 16px 42px rgba(0,0,0,.38);display:none;z-index:1300}
  .sn-links.sn-open{display:flex}
  .sn-links a{height:40px}
}
