/* SortFlow — admin theme. Unified with the public Mod Hub / gallery / account
   design language: same palette, rounded shapes, pill nav, badges and buttons —
   but kept dense so admin tables stay scannable. Class names are unchanged so
   every admin page inherits the new look with no markup rewrites. */

:root {
  --bg-0:#0F0F12; --bg-1:#1A1A1E; --bg-2:#26262C; --bg-3:#2F2F35; --bg-hover:#2F2F35;
  --text-hi:#E8E8E8; --text-mid:#B4B4B8; --text-dim:#8A8A8E;
  --accent:#D4A843; --accent-2:#D4A843; --accent-hot:#C2453C; --accent-cool:#5AA9E6;
  --ok:#46C46A; --warn:#D4A843; --danger:#C2453C; --purple:#9B8BD0;
  /* aliases shared with the consumer shell */
  --bg0:#0F0F12; --bg1:#1A1A1E; --bg2:#26262C; --line:#000000; --line2:#2A2A30;
  --hi:#E8E8E8; --mid:#B4B4B8; --dim:#8A8A8E;
  --radius:4px; --radius-sm:3px; --radius-pill:4px;
  --mono:'JetBrains Mono', ui-monospace, Consolas, monospace;
  --sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --stripe:rgba(255,255,255,0.015);
}

* { box-sizing:border-box; }
html, body { margin:0; padding:0; background:var(--bg-0); color:var(--text-hi);
  font-family:var(--sans); font-size:15px; line-height:1.6; min-height:100%; -webkit-font-smoothing:antialiased; }
.mono, code, pre, .num { font-family:var(--mono); }
h1, h2, h3, h4 { margin:0 0 .5rem; letter-spacing:-.01em; font-weight:700; line-height:1.25; }
h1 { font-size:1.7rem; letter-spacing:-.02em; }
h2 { font-size:1.15rem; }
h3 { font-size:1rem; }
/* small mono section label, matches the consumer '.kicker'/'.insp-h' */
.kicker { font-family:var(--mono); text-transform:uppercase; letter-spacing:.12em;
  font-size:.72rem; color:var(--text-mid); font-weight:700; }
/* .title is used on admin page headings (audit/settings/users) — keep it a heading */
.title { color:var(--text-hi); font-weight:700; letter-spacing:-.01em; line-height:1.25; }
a { color:var(--accent-cool); text-decoration:none; }
a:hover { color:var(--accent); }
hr { border:none; border-top:1px solid var(--line); margin:1rem 0; }
small, .muted { color:var(--text-mid); }
.dim { color:var(--text-dim); }
img, svg { display:block; }

/* =============================== ADMIN SHELL =============================== */
:root { --sb-w:244px; }

/* Left sidebar — grouped, scrollable, fixed */
.sidebar { position:fixed; inset:0 auto 0 0; width:var(--sb-w); z-index:50;
  background:var(--bg-1); border-right:1px solid var(--line); display:flex; flex-direction:column; overflow-y:auto; }
.sidebar .sb-brand { display:flex; align-items:center; gap:9px; padding:16px 18px 14px; }
.sidebar .sb-nav { padding:4px 12px 16px; flex:1; }
.sidebar .sb-group { margin:2px 0 12px; }
.sidebar .sb-label { font-family:var(--mono); font-size:.6rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--text-dim); padding:8px 10px 4px; }
.sidebar a.sb-link { display:flex; align-items:center; gap:11px; padding:9px 11px; border-radius:var(--radius-sm);
  color:var(--text-mid); font-size:.9rem; font-weight:500; margin:1px 0; }
.sidebar a.sb-link:hover { background:var(--bg-2); color:var(--text-hi); }
.sidebar a.sb-link.active { background:color-mix(in srgb, var(--accent) 13%, transparent); color:var(--accent); }
.sidebar a.sb-link .ic { width:18px; height:18px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:2; opacity:.92; }
.sidebar a.sb-link .cbadge { margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:4px;
  font-family:var(--mono); font-size:11px; font-weight:700; line-height:20px; text-align:center; }
.sidebar a.sb-link .cbadge.amber { background:var(--accent); color:#0F0F12; }
.sidebar a.sb-link .cbadge.red { background:var(--danger); color:#fff; }
.sidebar .sb-foot { padding:12px; border-top:1px solid var(--line); }

/* Main column */
.admin-main { margin-left:var(--sb-w); min-height:100vh; display:flex; flex-direction:column; }

/* Slim top bar inside the main column */
.topbar { position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:12px;
  padding:0 22px; height:60px; backdrop-filter:blur(10px);
  background:color-mix(in srgb, var(--bg-0) 82%, transparent); border-bottom:1px solid var(--line); }
.topbar .pgtitle { font-weight:700; font-size:1.05rem; letter-spacing:-.01em; }
.topbar .sp { margin-left:auto; display:flex; align-items:center; gap:10px; }
.topbar .viewsite { display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:var(--radius-sm);
  border:1px solid var(--accent); color:var(--accent); background:color-mix(in srgb,var(--accent) 8%,transparent);
  font-family:var(--mono); font-weight:700; font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; }
.topbar .viewsite:hover { background:var(--accent); color:#0F0F12; }
.topbar .viewsite svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; }
.topbar .user { display:flex; align-items:center; gap:.55rem; padding:5px 12px 5px 6px;
  background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius-pill); font-size:.82rem; }
.topbar .user .av { width:28px; height:28px; border-radius:50%; object-fit:cover; background:var(--bg-2);
  display:grid; place-items:center; font-family:var(--mono); font-weight:700; color:var(--accent); font-size:.8rem; }
.topbar .user b { color:var(--text-hi); font-weight:600; }
.topbar .user .u-links { display:flex; gap:8px; }
.topbar .user a { color:var(--text-mid); font-family:var(--mono); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; }
.topbar .user a:hover { color:var(--accent); }
.sb-toggle { display:none; background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius-sm);
  width:38px; height:38px; align-items:center; justify-content:center; cursor:pointer; color:var(--text-hi); }
.sb-toggle svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; }
.sb-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:45; }

/* Mobile: sidebar becomes an off-canvas drawer */
@media (max-width:980px) {
  .sidebar { left:-260px; transition:left .2s ease; box-shadow:8px 0 40px -10px rgba(0,0,0,.6); }
  body.sb-open .sidebar { left:0; }
  body.sb-open .sb-backdrop { display:block; }
  .admin-main { margin-left:0; }
  .sb-toggle { display:flex; }
}

/* Layout container */
.wrap { max-width:1240px; margin:0 auto; padding:1.5rem 1.75rem 3rem; width:100%; }
@media (max-width:640px){ .wrap { padding:1.1rem 1rem 2.5rem; } }

/* Cards */
.card { background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius);
  padding:1.15rem 1.3rem; margin-bottom:1.1rem; }
.card.hdr { display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.85rem 1.3rem; background:var(--bg-1); }
.card h2 { font-size:1.1rem; }

/* Buttons — mono uppercase pill, matching the consumer '.btn' */
.btn { display:inline-flex; align-items:center; gap:.45rem; padding:9px 14px; border-radius:var(--radius-sm);
  border:1px solid var(--line2); background:rgba(26,26,30,.4); color:var(--text-hi);
  font-family:var(--mono); font-weight:700; text-transform:uppercase; letter-spacing:.05em;
  font-size:.72rem; cursor:pointer; transition:.14s; text-decoration:none; }
.btn:hover { border-color:var(--accent); color:var(--accent); }
.btn.primary { color:#0F0F12; background:var(--accent); border-color:var(--accent); }
.btn.primary:hover { background:var(--accent-2); color:#0F0F12; transform:translateY(-1px); }
.btn.danger { color:var(--danger); border-color:color-mix(in srgb, var(--danger) 55%, var(--line2)); background:rgba(26,26,30,.4); }
.btn.danger:hover { background:var(--danger); color:#0F0F12; }
.btn.ghost { color:var(--text-hi); }
.btn.small { padding:6px 10px; font-size:.68rem; }
.btn.big { padding:12px 20px; font-size:.82rem; }
.btn[disabled] { opacity:.45; cursor:not-allowed; pointer-events:none; }
.btn-row { display:flex; gap:.55rem; flex-wrap:wrap; align-items:center; }

/* Forms */
label { display:block; margin-bottom:.7rem; font-family:var(--mono);
  text-transform:uppercase; letter-spacing:.1em; font-size:.7rem; color:var(--text-mid); }
input[type=text], input[type=password], input[type=number], input[type=email], input[type=url], textarea, select {
  width:100%; margin-top:.35rem; padding:.6rem .75rem; background:var(--bg-2);
  border:1px solid var(--line2); border-radius:var(--radius-sm); color:var(--text-hi);
  font-family:var(--sans); font-size:.95rem; }
input[type=checkbox] { accent-color:var(--accent); }
input:focus, textarea:focus, select:focus { outline:none; border-color:var(--accent);
  box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 26%, transparent); }
.grid { display:grid; gap:1rem; }
.grid-2 { grid-template-columns:repeat(2, minmax(0,1fr)); }
.grid-3 { grid-template-columns:repeat(3, minmax(0,1fr)); }
@media (max-width:740px) { .grid-2,.grid-3 { grid-template-columns:1fr; } }

/* Tables — rounded container, subtle header, compact rows (density kept) */
table.t { width:100%; border-collapse:separate; border-spacing:0; background:var(--bg-1);
  border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
table.t th, table.t td { padding:.6rem .8rem; text-align:left; border-bottom:1px solid var(--line); vertical-align:middle; }
table.t thead th { background:var(--bg-2); font-family:var(--mono); text-transform:uppercase;
  letter-spacing:.1em; font-size:.68rem; color:var(--text-dim); font-weight:700; }
table.t tbody tr:last-child td { border-bottom:0; }
table.t tbody tr:hover td { background:var(--bg-hover); }
table.t td.num { text-align:right; font-variant-numeric:tabular-nums; font-family:var(--mono); }
table.t td.actions { text-align:right; white-space:nowrap; }
.tablewrap { overflow-x:auto; }
/* Sortable headers */
th.th-sort { padding:0; }
th.th-sort a { display:flex; align-items:center; gap:6px; padding:.6rem .8rem; color:var(--text-dim);
  font-family:var(--mono); text-transform:uppercase; letter-spacing:.1em; font-size:.68rem; font-weight:700; }
th.th-sort.num a { justify-content:flex-end; }
th.th-sort a:hover { color:var(--text-hi); }
th.th-sort.on a { color:var(--accent); }
th.th-sort .tha { font-size:.7em; }

/* List page toolbar: search + filter chips */
.list-toolbar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:0 0 1rem; }
.list-toolbar .search { position:relative; flex:1; min-width:220px; max-width:420px; }
.list-toolbar .search svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--text-dim); fill:none; stroke:currentColor; stroke-width:2; }
.list-toolbar .search input { width:100%; padding:.6rem .7rem .6rem 38px; background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius-sm); color:var(--text-hi); font-size:.95rem; }
.list-toolbar .search input:focus { outline:none; border-color:var(--accent); }
.list-toolbar .filters { display:inline-flex; gap:4px; background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius-sm); padding:4px; }
.list-toolbar .filters a { padding:7px 12px; border-radius:4px; color:var(--text-mid); font-family:var(--mono); font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.68rem; }
.list-toolbar .filters a.on { background:var(--bg-2); color:var(--text-hi); }
.list-toolbar .count { margin-left:auto; font-family:var(--mono); font-size:.72rem; color:var(--text-dim); text-transform:uppercase; letter-spacing:.06em; }

/* Pager */
.pager { display:flex; gap:10px; align-items:center; justify-content:center; margin:1.2rem 0 .2rem; font-family:var(--mono); font-size:.8rem; }
.pager a, .pager .cur { padding:8px 14px; border-radius:var(--radius-sm); border:1px solid var(--line); color:var(--text-mid); }
.pager a:hover { border-color:var(--accent); color:var(--accent); }
.pager .cur { color:var(--text-hi); background:var(--bg-1); }

/* Flash messages */
.flash { padding:.7rem 1rem; margin-bottom:1rem; border:1px solid var(--line2);
  border-radius:var(--radius-sm); background:var(--bg-1); font-size:.9rem; }
.flash.ok, .flash.success { border-color:color-mix(in srgb, var(--ok) 55%, var(--line2)); background:color-mix(in srgb, var(--ok) 10%, var(--bg-1)); }
.flash.error { border-color:color-mix(in srgb, var(--danger) 55%, var(--line2)); background:color-mix(in srgb, var(--danger) 10%, var(--bg-1)); }
.flash.warn { border-color:color-mix(in srgb, var(--warn) 55%, var(--line2)); background:color-mix(in srgb, var(--warn) 10%, var(--bg-1)); }
.flash.info { border-color:color-mix(in srgb, var(--accent-cool) 55%, var(--line2)); background:color-mix(in srgb, var(--accent-cool) 10%, var(--bg-1)); }

/* Status badge (shared with Mod Hub) + legacy dot */
.badge { display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:.62rem; font-weight:700;
  letter-spacing:.06em; text-transform:uppercase; padding:4px 9px; border-radius:var(--radius-pill);
  border:1px solid var(--line2); color:var(--text-mid); background:var(--bg-2); }
.badge::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.badge.approved, .badge.published, .badge.ok, .badge.resolved { color:var(--ok); border-color:color-mix(in srgb, var(--ok) 45%, var(--line2)); }
.badge.pending, .badge.open { color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, var(--line2)); }
.badge.declined, .badge.closed { color:var(--danger); border-color:color-mix(in srgb, var(--danger) 45%, var(--line2)); }
.badge.needs_changes, .badge.reviewing { color:var(--accent-cool); border-color:color-mix(in srgb, var(--accent-cool) 45%, var(--line2)); }
.badge.unpublished { color:var(--text-dim); }
.dot { display:inline-block; width:.55rem; height:.55rem; border-radius:50%; vertical-align:middle; }
.dot.ok { background:var(--ok); } .dot.off { background:var(--danger); } .dot.warn { background:var(--warn); }

/* Dashboard tiles */
.tiles { display:grid; gap:.9rem; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); }
.tile { background:var(--bg-1); border:1px solid var(--line); border-radius:var(--radius); padding:1.1rem 1.2rem; transition:.14s; }
.tile:hover { border-color:var(--line2); transform:translateY(-2px); }
.tile h3 { font-size:.95rem; }
.tile .row { display:flex; justify-content:space-between; align-items:baseline; gap:.5rem; }
.tile .stat { font-family:var(--mono); font-size:1.5rem; font-weight:700; color:var(--accent); }
.tile .meta { color:var(--text-dim); font-size:.76rem; font-family:var(--mono); }

/* Tabs — pill group */
.tabs { display:inline-flex; gap:4px; background:var(--bg-1); border:1px solid var(--line);
  border-radius:var(--radius-sm); padding:4px; margin-bottom:1rem; flex-wrap:wrap; }
.tabs a { padding:8px 14px; border-radius:4px; color:var(--text-mid); font-family:var(--mono);
  font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.72rem; border-bottom:0; }
.tabs a:hover { color:var(--text-hi); }
.tabs a.active { color:var(--text-hi); background:var(--bg-2); }

/* Login */
.login-wrap { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:1rem;
  background:radial-gradient(ellipse at top, rgba(212,168,67,.05), transparent 55%), var(--bg-0); }
.login-card { width:100%; max-width:400px; background:var(--bg-1); border:1px solid var(--line);
  border-radius:var(--radius); padding:2rem 1.75rem; }
.login-card h1 { font-size:1.5rem; color:var(--text-hi); margin-bottom:1rem; }

/* Misc helpers */
.right { text-align:right; }
.nowrap { white-space:nowrap; }
.tag { display:inline-block; padding:3px 9px; background:var(--bg-2); border:1px solid var(--line2);
  border-radius:var(--radius-pill); font-family:var(--mono); font-size:.68rem; color:var(--text-mid); }
.spacer, .flex1 { flex:1; }
.fade-in { animation:fade .25s ease-out; }
@keyframes fade { from { opacity:0; transform:translateY(4px); } to { opacity:1; } }
.flash-update { animation:flashpulse .6s ease-out; }
@keyframes flashpulse { 0% { background:rgba(212,168,67,.22); } 100% { background:transparent; } }

/* ========================== SHARED WORKSHOP SYSTEM ==========================
   This layer is loaded by both the Mod Hub and admin shell.  It deliberately
   uses the existing class names so functionality stays independent of the UI. */
:root {
  --steel-0:#0F0F12; --steel-1:#151518; --steel-2:#1E1E22; --steel-3:#2A2A30;
  --workshop-amber:#D4A843; --workshop-blue:#5aa9e6; --workshop-green:#46c46a;
  --workshop-glow:rgba(212,168,67,.16);
}
body { background:
  radial-gradient(900px 500px at 12% -15%, rgba(212,168,67,.075), transparent 62%),
  linear-gradient(135deg, rgba(255,255,255,.012) 1px, transparent 1px) 0 0/24px 24px,
  var(--steel-0); }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background:linear-gradient(90deg, transparent 0, rgba(255,255,255,.012) 50%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000, transparent 45%); }
h1,h2,h3,.pgtitle { font-family:'Barlow',var(--sans); letter-spacing:.025em; }
.kicker,.sb-label,label,.product-context,.admin-context { letter-spacing:.14em; }

/* Shared utility surfaces */
.card,.tile,table.t,.sidebar,.topbar { box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
.card,.tile { background:linear-gradient(145deg, rgba(36,36,39,.94), rgba(26,26,30,.96)); }
.card { border-color:var(--steel-3); }
.btn { border-radius:4px; min-height:36px; }
.sf-language-picker{position:relative;flex:0 0 auto}.sf-language-trigger{display:flex;align-items:center;gap:6px;height:34px;min-width:66px;padding:0 8px;border:1px solid #2A2A30;border-radius:4px;background:rgba(14,14,17,.74);color:var(--text-hi);font:700 .61rem var(--mono);letter-spacing:.06em;cursor:pointer}.sf-language-trigger:hover,.sf-language-picker.open .sf-language-trigger{border-color:#747474;background:#1A1A1E}.sf-language-trigger:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(212,168,67,.12)}.sf-language-flag{display:block;width:20px;height:13px;border-radius:2px;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 1px 3px rgba(0,0,0,.35)}.sf-language-chevron{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.7;opacity:.7}.sf-language-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:100;display:none;width:208px;padding:5px;border:1px solid #474747;border-radius:4px;background:#18181B;box-shadow:0 18px 42px rgba(0,0,0,.48)}.sf-language-picker.open .sf-language-menu{display:block}.sf-language-option{display:flex;align-items:center;width:100%;gap:10px;padding:8px;border:0;border-radius:4px;background:transparent;color:var(--text-mid);text-align:left;font:600 .74rem var(--sans);cursor:pointer}.sf-language-option:hover,.sf-language-option[aria-checked="true"]{background:#28282B;color:var(--text-hi)}.sf-language-option[aria-checked="true"]{box-shadow:inset 2px 0 0 var(--accent)}.sf-language-option small{margin-left:auto;color:var(--text-dim);font:700 .59rem var(--mono);letter-spacing:.08em}
/* Localization is held for editorial review. Keep markup/assets dormant so the selector can return without another header rebuild. */
.sf-language,.sf-language-picker{display:none!important}
.btn.primary,.btn.amber { background:linear-gradient(180deg, #D4A843, var(--workshop-amber)); border-color:#A08034; color:#0F0F12; }
.btn.primary:hover,.btn.amber:hover { background:linear-gradient(180deg, #D4A843, #D4A843); color:#0F0F12; }
.btn.ghost { background:rgba(15,15,18,.28); }
input[type=text],input[type=password],input[type=number],input[type=email],input[type=url],textarea,select {
  background-color:rgba(14,14,17,.72); border-color:#2A2A30; }

/* Admin retains its dense layout, but now carries the same product signature. */
.sidebar { background:linear-gradient(180deg, #1B1B1E 0%, #151518 100%); border-right-color:#2A2A30; }
.sidebar .sb-brand { min-height:66px; border-bottom:1px solid rgba(42,42,48,.7); }
.sb-console,.product-context,.admin-context { font-family:var(--mono); font-size:.58rem; font-weight:700;
  text-transform:uppercase; color:var(--accent); }
.sb-console { margin-left:auto; border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line2)); padding:2px 5px; border-radius:4px; }
.sidebar a.sb-link { border-left:2px solid transparent; border-radius:4px; }
.sidebar a.sb-link.active { border-left-color:var(--accent); background:linear-gradient(90deg,rgba(212,168,67,.18),rgba(212,168,67,.035)); }
.topbar { height:66px; background:color-mix(in srgb, var(--steel-0) 88%, transparent); }
.topbar .pgtitle { display:flex; align-items:baseline; gap:10px; font-size:1.3rem; }
.topbar .viewsite { border-radius:4px; box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
.wrap { max-width:1280px; }
.tile { position:relative; overflow:hidden; }
.tile::after { content:""; position:absolute; left:0; top:0; width:3px; height:100%; background:var(--accent); opacity:.75; }
table.t thead th { background:linear-gradient(180deg, #28282B, #1E1E22); }
.flash { border-left-width:3px; }

/* Mod Hub: same workshop components, optimized for touch-sized public controls. */
body.mod-hub { --amber:var(--workshop-amber); --amber2:#D4A843; --bg0:var(--steel-0); --bg1:var(--steel-1); --bg2:var(--steel-2); --line:#2A2A30; --line2:#3A3A40; }
body.mod-hub .nav { background:color-mix(in srgb, var(--steel-0) 89%, transparent); border-bottom-color:#2A2A30; }
body.mod-hub .nav .wrap { height:68px; }
body.mod-hub .product-context { display:inline-flex; align-items:center; gap:6px; padding-left:10px; border-left:1px solid var(--line2); }
body.mod-hub .product-context i { font-style:normal; color:var(--green); font-size:.55rem; }
body.mod-hub .nav .links { margin-left:4px; }
body.mod-hub .nav .links a { border:1px solid transparent; border-radius:4px; }
body.mod-hub .nav .links a.on { border-color:rgba(212,168,67,.35); background:rgba(212,168,67,.1); }
/* Shared public header action rail: language, account and the primary action
   remain a clean, balanced unit instead of competing with navigation. */
.nav .header-actions{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;white-space:nowrap}.nav .header-actions::before{content:"";height:24px;border-left:1px solid rgba(80,80,86,.45);margin-right:2px}.nav .header-actions .sf-language-picker{flex:0 0 auto}.topbar>.header-actions,.topbar .admin-header-actions{margin-left:auto;display:flex;align-items:center;gap:9px;min-width:0}.topbar>.header-actions .sf-language-trigger,.topbar .admin-header-actions .sf-language-trigger{height:32px}.topbar>.header-actions .user,.topbar .admin-header-actions .user{min-width:0}
body.mod-hub .nav-search { display:flex; align-items:center; width:180px; height:32px; margin-left:auto; border:1px solid #2A2A30; border-radius:4px; background:rgba(15,15,18,.65); overflow:hidden; }
body.mod-hub .nav-search input { min-width:0; margin:0; padding:6px 8px; border:0; border-radius:0; background:transparent; color:var(--hi); font:500 10px var(--mono); }
body.mod-hub .nav-search input:focus { box-shadow:none; }
body.mod-hub .nav-search button { width:32px; height:100%; border:0; border-left:1px solid #2A2A30; background:#161619; color:var(--hi); cursor:pointer; font-size:16px; }
body.mod-hub .nav-search button:hover { color:var(--amber); }
/* The catalogue owns search.  Keep its controls in one compact workspace row
   instead of duplicating a full search field in the global navigation. */
body.mod-hub .catalog-toolbar{display:grid;grid-template-columns:minmax(280px,1fr) repeat(3,minmax(128px,170px)) auto auto;align-items:center;gap:8px;margin:18px 0 8px;padding:9px 10px;background:linear-gradient(110deg,rgba(27,27,30,.98),rgba(18,18,21,.96));border:1px solid #2F2F35;border-radius:4px}
body.mod-hub .catalog-toolbar .search{position:relative;display:block;min-width:0;max-width:none;margin:0}
body.mod-hub .catalog-toolbar .search svg{position:absolute;z-index:1;left:12px;top:50%;width:16px;height:16px;transform:translateY(-50%);pointer-events:none;color:var(--text-dim);fill:none;stroke:currentColor;stroke-width:2}
body.mod-hub .catalog-toolbar .search input{display:block;box-sizing:border-box;width:100%;height:36px;padding:8px 10px 8px 38px;border-radius:4px;background:#141417}
body.mod-hub .catalog-toolbar select.sel{width:100%;height:36px;padding:7px 28px 7px 10px;border-radius:4px;background:#17171A;font-size:11px}body.mod-hub .catalog-toolbar .btn{min-height:36px;white-space:nowrap}.catalog-clear{padding:7px 4px;color:var(--text-dim);font:700 .62rem var(--mono);letter-spacing:.06em;text-transform:uppercase}.catalog-clear:hover{color:var(--accent)}
@media(max-width:960px){body.mod-hub .catalog-toolbar{grid-template-columns:minmax(240px,1fr) repeat(2,minmax(130px,1fr)) auto}body.mod-hub .catalog-toolbar .search{grid-column:1/-1}.catalog-clear{display:none}}@media(max-width:620px){body.mod-hub .catalog-toolbar{grid-template-columns:1fr 1fr}.catalog-clear{display:block;text-align:center}.catalog-toolbar .btn{justify-content:center}}
body.mod-hub .head { padding-top:46px; border-bottom:1px solid rgba(42,42,48,.55); padding-bottom:20px; }
body.mod-hub .head h1 { font-family:'Barlow',var(--sans); text-transform:uppercase; letter-spacing:.035em; }
body.mod-hub .mcard,body.mod-hub .card,body.mod-hub .empty,body.mod-hub .rate-form,body.mod-hub .vrow { border-radius:4px; box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
body.mod-hub .mcard { background:linear-gradient(145deg, rgba(38,38,44,.98), rgba(26,26,30,.98)); border-color:#2A2A30; }
body.mod-hub .mcard:hover { border-color:rgba(212,168,67,.7); box-shadow:0 12px 30px -22px rgba(0,0,0,.9), 0 0 0 1px rgba(212,168,67,.11); }
body.mod-hub .mcard .cover { border-bottom:1px solid #2A2A30; }
body.mod-hub .toolbar,.list-toolbar { padding:10px; background:rgba(26,26,30,.72); border:1px solid #2A2A30; border-radius:4px; }
body.mod-hub .chip { border-radius:4px; }
body.mod-hub .chip.on { box-shadow:0 2px 12px -4px var(--workshop-glow); }
body.mod-hub .flash { border-left:3px solid var(--amber); }
body.mod-hub .tablewrap { border-radius:4px; border-color:#2A2A30; }
body.mod-hub footer { background:linear-gradient(180deg, transparent, rgba(26,26,30,.92)); }
body.mod-hub-admin .nav { border-bottom-color:rgba(212,168,67,.48); }
body.mod-hub-admin .head { background:linear-gradient(90deg, rgba(212,168,67,.075), transparent 55%); margin-left:-24px; margin-right:-24px; padding-left:24px; padding-right:24px; }
body.mod-hub-admin .nav-search { display:none; }
.featured-picker { display:grid; grid-template-columns:minmax(210px,1fr) minmax(260px,420px) auto; align-items:end; gap:12px; margin:18px 0 8px; padding:15px 17px; border:1px solid rgba(212,168,67,.42); border-left:3px solid var(--amber); border-radius:4px; background:linear-gradient(100deg,rgba(212,168,67,.1),rgba(23,23,26,.94) 52%); }
.featured-picker__label { display:block; margin-bottom:2px; color:var(--amber); font:700 9px var(--mono); letter-spacing:.13em; text-transform:uppercase; }
.featured-picker strong { display:block; font-family:'Barlow',var(--sans); font-size:1.25rem; line-height:1; text-transform:uppercase; }
.featured-picker small { display:block; margin-top:5px; color:var(--mid); font-size:11px; }
.featured-picker select { margin:0; min-height:38px; font-size:12px; }
.featured-picker .btn { min-height:38px; white-space:nowrap; }
.featured-flag { display:inline-block; margin-left:5px; padding:2px 5px; border:1px solid rgba(212,168,67,.58); border-radius:3px; color:var(--amber); font:700 8px var(--mono); letter-spacing:.08em; text-transform:uppercase; }

/* Featured Mod Hub surface: a visual destination instead of a generic listing. */
body.mod-hub .featured-mod { position:relative; min-height:330px; isolation:isolate; overflow:hidden; margin:22px 0 24px; padding:34px 36px; border:1px solid #3A3A40; border-radius:4px; background:linear-gradient(110deg,#18181B 0%,#111114 57%,#242427 100%); box-shadow:0 24px 48px -34px #000, inset 0 1px 0 rgba(255,255,255,.05); }
body.mod-hub .featured-mod::before { content:""; position:absolute; z-index:-2; inset:0; background-image:var(--feature-cover); background-position:right center; background-size:58% 100%; background-repeat:no-repeat; opacity:.92; filter:saturate(.85) contrast(1.08); }
body.mod-hub .featured-mod::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#111114 0%,rgba(15,15,18,.96) 35%,rgba(15,15,18,.35) 67%,rgba(15,15,18,.1) 100%); }
body.mod-hub .featured-mod__content { position:relative; max-width:520px; }
body.mod-hub .featured-mod__eyebrow { display:inline-flex; padding:4px 8px; border:1px solid rgba(212,168,67,.65); border-radius:3px; color:var(--amber); font:700 9px var(--mono); letter-spacing:.11em; text-transform:uppercase; }
body.mod-hub .featured-mod__game { display:block; margin-top:14px; color:#B4B4B8; font:700 11px var(--mono); letter-spacing:.12em; text-transform:uppercase; }
body.mod-hub .featured-mod h2 { margin:5px 0 8px; color:#fff; font-family:'Barlow',var(--sans); font-size:clamp(31px,4vw,48px); line-height:.95; letter-spacing:.01em; text-transform:uppercase; }
body.mod-hub .featured-mod p { max-width:47ch; margin:0; color:#C7C7C7; font-size:14px; }
body.mod-hub .featured-mod__tags { display:flex; gap:7px; flex-wrap:wrap; margin-top:18px; }
body.mod-hub .featured-mod__tags span { padding:4px 7px; border:1px solid rgba(199,199,199,.25); border-radius:3px; background:rgba(15,15,18,.46); color:#D3D3D3; font:600 9px var(--mono); }
body.mod-hub .featured-mod__actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:22px; }
body.mod-hub .featured-mod__version { color:#B4B4B8; font:700 11px var(--mono); }
body.mod-hub .featured-mod__link { position:absolute; inset:0; z-index:0; }
body.mod-hub .featured-mod__content { z-index:1; }

/* Landing: the same live-site shell as Mod Hub, with a larger discovery story. */
body.public-landing { --amber:var(--workshop-amber); --amber2:#D4A843; --bg0:var(--steel-0); --bg1:var(--steel-1); --bg2:var(--steel-2); --line:#2A2A30; --line2:#3A3A40; }
body.public-landing .nav { background:color-mix(in srgb,var(--steel-0) 89%,transparent); border-bottom-color:#2A2A30; }
body.public-landing .nav .wrap { height:82px; gap:14px; }
body.public-landing .product-context { display:inline-flex; align-items:center; gap:6px; padding-left:10px; border-left:1px solid var(--line2); font:700 .58rem var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--amber); }
body.public-landing .product-context i { color:var(--green); font-size:.55rem; font-style:normal; }
body.public-landing .landing-links { display:flex; align-items:center; gap:3px; }
body.public-landing .landing-links a { padding:10px 12px; border:1px solid transparent; border-radius:4px; color:#B4B4B8; font:700 .71rem var(--mono); letter-spacing:.06em; text-transform:uppercase; }
body.public-landing .landing-links a:hover { color:#fff; background:#2F2F35; }
body.public-landing .landing-links a.on { color:var(--amber); border-color:rgba(212,168,67,.35); background:rgba(212,168,67,.09); }
body.public-landing .hero { margin:26px auto 0; max-width:1280px; min-height:510px; border:1px solid #3A3A40; border-radius:4px; box-shadow:0 28px 56px -36px #000, inset 0 1px 0 rgba(255,255,255,.04); }
body.public-landing .hero .shot { filter:saturate(.72) contrast(1.13) brightness(.7); }
body.public-landing .hero .veil { background:linear-gradient(90deg,#111114 2%,rgba(15,15,18,.92) 41%,rgba(15,15,18,.28) 76%,rgba(15,15,18,.08)),linear-gradient(0deg,#111114 0%,transparent 40%); }
body.public-landing .hero .wrap { max-width:1160px; padding:90px 42px; }
body.public-landing .hero h1 { font-family:'Barlow',var(--sans); font-size:clamp(48px,6vw,78px); text-transform:uppercase; letter-spacing:.01em; }
body.public-landing .hero .badge { border-radius:4px; color:var(--amber); border-color:rgba(212,168,67,.55); background:rgba(15,15,18,.68); }
body.public-landing .hero .badge .dot { background:var(--amber); box-shadow:0 0 10px var(--amber); }
body.public-landing section { border-bottom:1px solid rgba(42,42,48,.5); }
body.public-landing .card,body.public-landing .news-card,body.public-landing .update,body.public-landing .game,body.public-landing .community { border-radius:4px; border-color:#2F2F35; background:linear-gradient(145deg,#1A1A1E,#141417); box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
body.public-landing .card:hover,body.public-landing .news-card:hover { border-color:rgba(212,168,67,.62); }
body.public-landing .shots a { border-radius:4px; border-color:#2F2F35; }
body.public-landing .update.feat { border-left:3px solid var(--amber); background:linear-gradient(100deg,rgba(212,168,67,.11),#141417 62%); }
body.public-landing footer { background:linear-gradient(180deg,transparent,#141417); }

/* Dashboard becomes the Admin Console's first control-room screen. */
.dashboard-console__intro { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:0 0 1.25rem; padding:25px 28px; border:1px solid #414141; border-left:3px solid var(--accent); border-radius:4px; background:linear-gradient(105deg,rgba(212,168,67,.11),rgba(23,23,26,.98) 46%,rgba(30,30,33,.96)); box-shadow:inset 0 1px 0 rgba(255,255,255,.04); }
.dashboard-console__intro h1 { margin:5px 0 4px; color:#fff; font-size:clamp(2rem,3vw,2.65rem); text-transform:uppercase; }
.dashboard-console__intro p { max-width:66ch; margin:0; color:#B8B8B8; font-size:.9rem; }
.dashboard-console .dash-attention { gap:12px; }
.dashboard-console .att { min-height:92px; border-radius:4px; border-color:#2F2F35; background:linear-gradient(145deg,#1A1A1E,#141417); }
.dashboard-console .att.has { background:linear-gradient(105deg,color-mix(in srgb,var(--c) 14%,#1A1A1E),#141417); }
.dashboard-console .att .att-n { font-size:2.45rem; }
.dashboard-console .dash-grid { gap:12px; }
.dashboard-console .card { margin-bottom:0; }
.dashboard-console .card-h { padding-bottom:10px; border-bottom:1px solid #2A2A30; }
.dashboard-console .card-h h2 { font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }
.dashboard-console .frow { border-bottom-color:#2A2A30; }

/* Admin Console: strong horizontal command layer plus a deeper control-room rail. */
.admin-command-nav { display:flex; align-self:stretch; align-items:stretch; gap:2px; margin-left:12px; }
.admin-command-nav a { display:flex; align-items:center; padding:0 10px; border-bottom:2px solid transparent; color:#9F9F9F; font:700 .62rem var(--mono); letter-spacing:.05em; text-transform:uppercase; }
.admin-command-nav a:first-child { border-bottom-color:var(--accent); color:var(--accent); }
.admin-command-nav a:hover { color:var(--text-hi); background:rgba(255,255,255,.025); }
.sidebar { width:214px; background:linear-gradient(180deg,#161619 0%,#0F0F12 100%); }
:root { --sb-w:214px; }
.sidebar .sb-nav { padding:12px 10px 20px; }
.sidebar .sb-group { margin:4px 0 15px; }
.sidebar .sb-label { padding:9px 10px 6px; color:#7F7F7F; }
.sidebar a.sb-link { padding:8px 10px; color:#BBBBBB; font-size:.8rem; }
.sidebar a.sb-link .ic { width:15px; height:15px; }
.admin-main { background:radial-gradient(700px 360px at 76% 0,rgba(100,100,100,.09),transparent 65%); }
.topbar { height:64px; padding:0 20px; border-bottom-color:#2A2A30; }
.topbar .pgtitle { min-width:170px; font-size:1.22rem; text-transform:uppercase; }
.topbar .user { background:rgba(15,15,18,.64); border-radius:4px; }
.wrap { max-width:1420px; padding-top:2rem; }
.tiles { grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; }
.tile { min-height:104px; padding:16px; border-radius:4px; border-color:#2F2F35; background:linear-gradient(145deg,#1A1A1E,#141417); }
.tile h3 { color:#A9A9A9; font-family:var(--mono); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; }
.tile .stat { color:#F6F6F6; font-size:1.7rem; }
.card { border-radius:4px; border-color:#2F2F35; background:linear-gradient(145deg,#1A1A1E,#141417); }
.card.hdr { min-height:58px; border-left:3px solid var(--accent); }
table.t { border-radius:4px; border-color:#2F2F35; background:#141417; }
table.t th,table.t td { padding:.74rem .8rem; border-bottom-color:#2A2A30; }
table.t tbody tr:hover td { background:#202023; }

/* Command-center interaction layer shared by every Admin page. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.admin-command-nav a.on{border-bottom-color:var(--accent);color:var(--accent);background:rgba(212,168,67,.055)}
.admin-search{width:210px;margin-left:auto}.admin-search input{width:100%;height:32px;padding:0 10px;border:1px solid #414141;border-radius:4px;background:rgba(15,15,18,.7);color:var(--text-hi);font:500 .66rem var(--mono);letter-spacing:.02em}.admin-search input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(212,168,67,.1)}.admin-search input::placeholder{color:#818181}
.list-toolbar{padding:10px 12px;border:1px solid #2A2A30;border-radius:4px;background:linear-gradient(110deg,rgba(38,38,44,.96),rgba(19,19,22,.94))}.list-toolbar .filters{background:#141417;border-color:#2A2A30}.list-toolbar .filters a.on{background:rgba(212,168,67,.13);color:var(--accent)}
.tablewrap{border:1px solid #2F2F35;border-radius:4px;background:#141417}.tablewrap table.t{border:0;border-radius:0}.pager .cur{border-color:#38383E;background:#1A1A1E}.flash{border-radius:4px;border-left:3px solid var(--accent)}.flash.error{border-left-color:var(--danger)}.flash.ok,.flash.success{border-left-color:var(--ok)}
.sidebar .sb-brand{background:linear-gradient(90deg,rgba(212,168,67,.08),transparent 70%)}.sidebar .sb-group+.sb-group{padding-top:4px;border-top:1px solid rgba(42,42,48,.27)}.sidebar a.sb-link .cbadge{box-shadow:0 2px 10px rgba(0,0,0,.22)}
@media(max-width:1180px){.admin-command-nav{display:none}.admin-search{margin-left:auto}}@media(max-width:720px){.admin-search{display:none}.topbar .viewsite{padding:8px}.topbar .viewsite{font-size:0}.topbar .viewsite svg{width:16px;height:16px}.topbar .user>span:not(.av){display:none}}

/* The ticket desk is intentionally a focused, standalone admin page.  It gets
   the same workshop frame without being forced into the full admin sidebar. */
body.admin-tickets { --bg0:var(--steel-0); --bg1:var(--steel-1); --bg2:var(--steel-2); --line:#2A2A30; --line2:#3A3A40; }
body.admin-tickets .nav { background:color-mix(in srgb, var(--steel-0) 89%, transparent); border-bottom-color:#2A2A30; }
body.admin-tickets .product-context { display:inline-flex; align-items:center; gap:6px; padding-left:10px; border-left:1px solid var(--line2); font-family:var(--mono); font-size:.58rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
body.admin-tickets .product-context i { color:var(--text-mid); font-size:.55rem; font-style:normal; }
body.admin-tickets .head { padding-top:38px; padding-bottom:16px; border-bottom:1px solid rgba(42,42,48,.55); }
body.admin-tickets .head h1 { font-family:'Barlow',var(--sans); text-transform:uppercase; letter-spacing:.035em; }
body.admin-tickets .tk { border-radius:4px; border-color:#2A2A30; background:linear-gradient(145deg, rgba(38,38,44,.98),rgba(26,26,30,.98)); box-shadow:inset 0 1px 0 rgba(255,255,255,.025); }
body.admin-tickets .tk:hover { border-color:rgba(212,168,67,.55); }
body.admin-tickets .filters { padding:8px; border:1px solid #2A2A30; border-radius:4px; background:rgba(26,26,30,.72); }
body.admin-tickets .flash { border-left:3px solid var(--accent); }
body.admin-tickets .rep.admin { background:color-mix(in srgb,var(--accent) 8%,var(--bg2)); }

@media (max-width:720px) {
  body.public-landing .nav .wrap { height:62px; padding:0 14px; gap:7px; }
  body.public-landing .product-context,body.public-landing .landing-links { display:none; }
  body.public-landing .nav .header-actions { margin-left:auto; gap:6px; }
  body.public-landing .nav .header-actions::before { display:none; }
  body.public-landing .nav .header-actions .btn { min-height:34px; padding:8px 10px; font-size:10px; }
  body.public-landing .nav .header-actions .btn.ghost { display:none; }
  body.public-landing .hero { min-height:470px; margin:16px 14px 0; border-radius:4px; }
  body.public-landing .hero .veil { background:linear-gradient(180deg,rgba(15,15,18,.18),rgba(15,15,18,.94) 55%,#111114); }
  body.public-landing .hero .wrap { padding:150px 24px 34px; }
  body.public-landing .hero h1 { font-size:48px; }
  body.public-landing .hero p.lead { font-size:15px; }
  body.public-landing section { padding:42px 0; }
  .dashboard-console__intro { align-items:flex-start; flex-direction:column; padding:21px; }
  .dashboard-console__intro .btn { width:100%; justify-content:center; }
  body.mod-hub .nav .wrap { height:62px; padding:0 14px; gap:7px; }
  body.mod-hub .product-context { display:none; }
  body.mod-hub .nav-search { display:none; }
  body.mod-hub .nav .header-actions { gap:6px; }
  body.mod-hub .nav .header-actions::before { display:none; }
  body.mod-hub .nav .header-actions .btn { padding:8px 10px; min-height:34px; font-size:10px; }
  body.mod-hub .nav .header-actions .btn.ghost { display:none; }
  body.mod-hub .wrap { padding-left:14px; padding-right:14px; }
  body.mod-hub .head { padding-top:28px; padding-bottom:16px; }
  body.mod-hub .head h1 { font-size:clamp(27px,9vw,36px); }
  body.mod-hub .toolbar { position:sticky; top:70px; z-index:15; margin-left:-2px; margin-right:-2px; }
  body.mod-hub .search { min-width:100%; }
  body.mod-hub .toolbar .btn { flex:1; justify-content:center; }
  body.mod-hub .grid { grid-template-columns:1fr; gap:12px; margin-top:14px; }
  body.mod-hub .mcard { display:grid; grid-template-columns:116px minmax(0,1fr); }
  body.mod-hub .mcard .cover { aspect-ratio:auto; min-height:132px; grid-row:span 2; border-bottom:0; border-right:1px solid #2A2A30; }
  body.mod-hub .mcard .cover .open { display:none; }
  body.mod-hub .mcard .body { padding:12px 13px 4px; }
  body.mod-hub .mcard .foot { margin-top:0; padding:9px 13px 11px; font-size:10px; }
  body.mod-hub .mcard .sum { -webkit-line-clamp:2; }
  body.mod-hub .featured-mod { min-height:400px; margin:16px 0 18px; padding:24px 22px; }
  body.mod-hub .featured-mod::before { background-size:cover; background-position:center; opacity:.42; }
  body.mod-hub .featured-mod::after { background:linear-gradient(180deg,rgba(15,15,18,.35),rgba(15,15,18,.94) 48%,#111114); }
  body.mod-hub .featured-mod__content { padding-top:92px; }
  body.mod-hub .featured-mod h2 { font-size:34px; }
  body.mod-hub .featured-mod p { font-size:13px; }
  .featured-picker { grid-template-columns:1fr; align-items:stretch; }
  .featured-picker .btn { width:100%; justify-content:center; }
  body.mod-hub .row2,body.mod-hub .detail { grid-template-columns:1fr; }
  body.mod-hub .btn { min-height:42px; justify-content:center; }
  body.mod-hub .chips { flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; }
  body.mod-hub .chip { white-space:nowrap; }
}
