/* Header v3: one calm row + a slim category strip. Reference: degacsid.com (few items, bold uppercase links, ▶ marker on the
   current / hovered item, nothing boxed). Loaded last; it only styles the existing markup, so every control keeps working. */
:root{--hd-h:64px;--hd-bg:rgba(255,255,255,.9);--hd-line:#e8ecf2;--hd-ink:#0f172a;--hd-mute:#5b677a;--hd-chip:#f4f6f9}
html[data-theme="dark"]{--hd-bg:rgba(9,15,28,.88);--hd-line:#1f2a3d;--hd-ink:#eef2f8;--hd-mute:#9aa7bb;--hd-chip:#141f33}

.topbar{display:none!important}
.site-header{position:sticky;top:0;z-index:50;background:var(--hd-bg)!important;backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);border-bottom:1px solid var(--hd-line);box-shadow:none!important}
.site-header>.wrap{max-width:1320px!important;padding-left:24px!important;padding-right:24px!important}
.site-header .hb{min-height:var(--hd-h)!important;gap:14px!important;align-items:center}

/* brand */
.site-header .brand{gap:9px!important;flex:none}
.site-header .brand-mark{width:40px!important;height:40px!important;border-radius:11px}
.site-header .brand-wordmark b{font-size:20px;letter-spacing:-.04em}

/* city: a quiet pill, full name, tooltip when it has to shorten */
.site-header .cbtn{height:40px!important;min-height:40px!important;width:auto!important;max-width:210px!important;padding:0 12px 0 10px!important;border:1px solid var(--hd-line)!important;border-radius:99px!important;background:var(--hd-chip)!important;gap:7px!important;color:var(--hd-ink)!important;flex:none;transition:border-color var(--rh-t1,.12s),background var(--rh-t1,.12s)}
.site-header .cbtn:hover,.site-header .cbtn[aria-expanded=true]{border-color:var(--or)!important}
.site-header .cbtn .cbl small{display:none!important}
.site-header .cbtn .cbl b{font-size:14px!important;font-weight:750;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.site-header .cbtn>.ti-map-pin{color:var(--or);font-size:17px}

/* main links (desktop) */
@media(min-width:1001px){
  .site-header .mnav{gap:2px!important;margin-left:6px;flex:1;min-width:0}
  .site-header .mnav .nl{position:relative;min-height:40px!important;padding:0 11px!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;color:var(--hd-mute)!important;font-size:12px!important;font-weight:800!important;letter-spacing:.09em;text-transform:uppercase;display:inline-flex;align-items:center;transform:none!important;white-space:nowrap;transition:color var(--rh-t1,.12s) ease}
  .site-header .mnav .nl i{display:none!important}
  .site-header .mnav .nl:after{display:none!important}
  .site-header .mnav .nl:before{content:"\25B6\FE0E";display:inline-block;width:0;overflow:hidden;opacity:0;transform:translateX(-5px);font-size:8px;color:var(--or);transition:width var(--rh-t1,.12s) var(--rh-out,ease),opacity var(--rh-t1,.12s),transform var(--rh-t1,.12s) var(--rh-out,ease),margin var(--rh-t1,.12s)}
  .site-header .mnav .nl:hover,.site-header .mnav .nl:focus-visible,.site-header .mnav .nl.on{color:var(--hd-ink)!important}
  .site-header .mnav .nl:hover:before,.site-header .mnav .nl:focus-visible:before,.site-header .mnav .nl.on:before{width:10px;margin-right:6px;opacity:1;transform:none}
  .site-header .mnav .nl-mg{margin-left:0!important}
  .site-header .mnav .sr,.site-header .mnav .mlang{display:none!important}
}

/* right-hand actions */
.site-header .hactions{gap:8px!important;margin-left:auto;align-items:center}
.site-header .ic,.site-header .theme-toggle,.site-header .acct-btn{width:40px!important;height:40px!important;min-width:40px;display:inline-flex!important;align-items:center;justify-content:center;border:1px solid var(--hd-line)!important;border-radius:12px!important;background:transparent!important;color:var(--hd-ink)!important;transition:border-color var(--rh-t1,.12s),background var(--rh-t1,.12s)}
.site-header .ic:hover,.site-header .theme-toggle:hover,.site-header .acct-btn:hover,.site-header .hsrch-btn[aria-expanded=true]{border-color:var(--or)!important;background:var(--hd-chip)!important}
.site-header .ic i,.site-header .theme-toggle i{font-size:18px}
.site-header .acct-btn .chev{display:none!important}
.site-header .hlang .langsw{display:inline-flex;height:40px;align-items:center;padding:3px;border:1px solid var(--hd-line);border-radius:12px;gap:2px}
.site-header .hlang .langsw a{display:inline-flex;align-items:center;height:32px;padding:0 9px;border-radius:9px;font-size:12px;font-weight:800;color:var(--hd-mute)}
.site-header .hlang .langsw a.on{background:var(--hd-ink);color:var(--hd-bg)}
html[data-theme="dark"] .site-header .hlang .langsw a.on{background:#eef2f8;color:#0b1220}
.site-header .postbtn{height:40px!important;padding:0 16px!important;border-radius:99px!important;font-size:13.5px!important;font-weight:800;box-shadow:0 8px 18px -12px rgba(238,127,18,.9)!important;flex:none}
.site-header .postbtn .freetag{top:-8px!important;right:10px}

/* search panel (opened by the search button) */
.hsrch-panel{padding:0 0 12px}
.hsrch-panel[hidden]{display:none}
.hsrch-panel form{display:flex;align-items:center;gap:10px;max-width:720px;margin:0 auto;padding:6px 6px 6px 16px;border:1.5px solid var(--hd-line);border-radius:16px;background:var(--hd-chip)}
.hsrch-panel form:focus-within{border-color:var(--or)}
.hsrch-panel i{color:var(--hd-mute);font-size:18px}
.hsrch-panel input{flex:1;min-width:0;border:0!important;outline:0;background:transparent!important;box-shadow:none!important;padding:10px 0!important;font:600 15px 'Plus Jakarta Sans',sans-serif;color:var(--hd-ink)}
.hsrch-panel .cta{padding:10px 18px;border-radius:12px}
.hsrch-panel:not([hidden]){animation:hdDrop var(--rh-t2,.22s) var(--rh-out,ease) both}
@keyframes hdDrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* category strip: slim, quiet, scrolls sideways */
.site-header .cats{min-height:40px!important;gap:2px!important;padding:0!important;border-top:1px solid var(--hd-line);align-items:center;overflow-x:auto;scrollbar-width:none}
.site-header .cats::-webkit-scrollbar{display:none}
.site-header .cats>a{flex:none;gap:6px!important;padding:6px 10px!important;border-radius:9px!important;font-size:12.5px!important;font-weight:600;color:var(--hd-mute)!important;background:none!important;transition:color var(--rh-t1,.12s),background var(--rh-t1,.12s)}
.site-header .cats>a i{font-size:15px!important;color:inherit;opacity:.8}
.site-header .cats>a:hover,.site-header .cats>a:focus-visible{color:var(--hd-ink)!important;background:var(--hd-chip)!important}

/* sizes */
@media(min-width:1001px) and (max-width:1240px){
  .site-header .mnav .nl{padding:0 8px!important;letter-spacing:.06em}
  .site-header .brand-wordmark small{display:none}
}
@media(min-width:1001px) and (max-width:1120px){.site-header .ic[href="/scan"]{display:none!important}.site-header .cbtn{max-width:160px!important}.site-header .cbtn .cbl b{max-width:100px}}
@media(max-width:1000px){
  .site-header .hlang{display:none}
  .site-header .hamb{width:40px;height:40px;border-radius:12px;border:1px solid var(--hd-line)}
}
@media(max-width:560px){
  :root{--hd-h:58px}
  .site-header>.wrap{padding-left:14px!important;padding-right:14px!important}
  .site-header .hb{gap:8px!important}
  .site-header .brand-mark{width:36px!important;height:36px!important}
  .site-header .hactions{gap:6px!important}
  .site-header .theme-toggle{display:none!important}
  .site-header .postbtn{padding:0 12px!important;font-size:12.5px!important}
  .site-header .ic,.site-header .acct-btn{width:38px!important;height:38px!important;min-width:38px}
}
@media(max-width:380px){.site-header .hsrch-btn{display:none!important}}
@media(prefers-reduced-motion:reduce){.hsrch-panel:not([hidden]){animation:none}.site-header .mnav .nl:before{transition:none}}

/* keep the row from ever overlapping: give space back in steps */
@media(min-width:1001px){.site-header .mnav{flex:0 1 auto}.site-header .mnav .nl{padding:0 9px!important;letter-spacing:.07em}}
@media(min-width:1001px) and (max-width:1499px){.site-header .hlang .langsw{padding:0;border:0}.site-header .hlang .langsw a.on{display:none}.site-header .hlang .langsw a{width:40px;height:40px;justify-content:center;padding:0;border:1px solid var(--hd-line);border-radius:12px;color:var(--hd-ink)}.site-header .hlang .langsw a:hover{border-color:var(--or)}}
@media(min-width:1001px) and (max-width:1399px){.site-header .ic[href="/scan"]{display:none!important}}
@media(min-width:1001px) and (max-width:1180px){.site-header .mnav .nl{padding:0 7px!important;font-size:11.5px!important;letter-spacing:.05em}.site-header .brand-wordmark{display:none}.site-header .theme-toggle{display:none!important}}
@media(min-width:1001px){.site-header .mnav{flex:none!important;max-width:none!important;overflow:visible!important}}
@media(min-width:1001px) and (max-width:1180px){.site-header .postbtn .ptl{display:none!important}.site-header .postbtn .pts{display:inline!important}.site-header .postbtn{padding:0 13px!important}.site-header .cbtn{max-width:140px!important}.site-header .cbtn .cbl b{max-width:84px}}
@media(max-width:560px){.site-header .ic[href="/scan"]{display:none!important}}

/* admin tables / panels in dark mode (the table wrapper stayed white while text turned light) */
html[data-theme="dark"] .tblw{background:#111b2b!important;border-color:#243248!important}
html[data-theme="dark"] .tbl th{background:#0d1626!important;color:#cbd5e1!important;border-color:#243248!important}
html[data-theme="dark"] .tbl td{border-color:#1f2a3d!important;color:#e2e8f0}
html[data-theme="dark"] .tbl tr:hover td{background:#152238}
html[data-theme="dark"] details.acat{background:#111b2b;border-color:#243248;color:#e2e8f0}
html[data-theme="dark"] .admnav{background:#0b1220;border-color:#1f2a3d}
html[data-theme="dark"] .admnav a{color:#cbd5e1}
