/* Universal site menu (see assets/sitenav.js). Default = for dark backgrounds.
   Add class "sn-ink" to the parent (or data-sitenav's container) for light backgrounds. */
.sitenav { margin-left:auto; display:flex; align-items:center; gap:8px; font-family:'DM Mono', ui-monospace, monospace; font-size:14px; line-height:1; --sn-fg:#F1ECE2; --sn-bd:rgba(241,236,226,.55); --sn-bg:rgba(20,15,11,.3); }
.sn-ink .sitenav, .sitenav.sn-ink { --sn-fg:#2B2620; --sn-bd:rgba(43,38,32,.55); --sn-bg:rgba(239,227,200,.45); }
.sitenav .sn-pill { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 18px; border-radius:999px; border:1.5px solid var(--sn-bd); background:var(--sn-bg); color:var(--sn-fg); font:inherit; text-decoration:none; cursor:pointer; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); white-space:nowrap; text-transform:none; letter-spacing:0; font-weight:400; }
.sitenav .sn-pill:hover, .sitenav .sn-btn[aria-expanded="true"] { background:var(--sn-fg); color:#151515; border-color:var(--sn-fg); }
.sn-ink .sitenav .sn-pill:hover, .sn-ink .sitenav .sn-btn[aria-expanded="true"], .sitenav.sn-ink .sn-pill:hover { color:#EFE3C8; }
.sitenav .sn-tapin, .sitenav .sn-tapin:hover { background:#F3D36B; border-color:#F3D36B; color:#151515; font-weight:500; }
.sitenav .sn-tapin:hover { filter:brightness(1.06); }
.sitenav .sn-chev { display:inline-block; transition:transform .2s; }
.sitenav .sn-btn[aria-expanded="true"] .sn-chev { transform:rotate(180deg); }
.sitenav .sn-drop { position:relative; }
.sitenav .sn-list { position:absolute; right:0; top:calc(100% + 8px); z-index:1000; min-width:240px; padding:8px; border-radius:18px; background:#F4EBDB; box-shadow:0 20px 50px rgba(0,0,0,.45); display:grid; gap:2px; }
.sitenav .sn-list.sn-left { right:auto; left:0; }
.sitenav .sn-list[hidden] { display:none; }
.sitenav .sn-item { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:46px; padding:0 14px; border-radius:12px; color:#1A1714; text-decoration:none; font-family:'Bricolage Grotesque', system-ui, sans-serif; font-weight:800; font-size:17px; letter-spacing:-.01em; text-transform:none; white-space:nowrap; border:0; background:none; }
.sitenav .sn-item:hover, .sitenav .sn-item:focus-visible { background:#1A1714; color:#F4EBDB; outline:none; }
.sitenav .sn-item span { font-family:'DM Mono', monospace; font-weight:400; font-size:11px; opacity:.6; }
.sitenav .sn-cur { background:rgba(26,23,20,.07); }
