/* Fetspace Design System v32
   Centralized design tokens. Change these variables to restyle the whole site. */
:root{
  --fs-scale:1;
  --font-body:"Segoe UI Variable","Segoe UI",Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  --font-display:"Segoe UI Variable Display","Segoe UI Variable","Segoe UI",Inter,system-ui,sans-serif;

  --bg:#0b0910;
  --bg-deep:#07060a;
  --surface:#151118;
  --surface-2:#1b151f;
  --surface-soft:rgba(255,255,255,.035);
  --text:#fff;
  --muted:#c9c1cc;
  --muted-2:#a99faa;
  --pink:#ff397c;
  --pink2:#ff268d;
  --accent:#ff397c;
  --accent-2:#ff268d;
  --line:rgba(255,255,255,.11);
  --line-accent:rgba(255,57,124,.35);

  --radius-xs:8px;
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:20px;
  --radius-xl:24px;
  --radius-pill:999px;

  --shadow-card:0 18px 55px rgba(0,0,0,.22);
  --shadow-accent:0 0 26px rgba(255,38,141,.20);

  --container:1180px;
  --container-wide:1260px;
  --space-1:6px;
  --space-2:10px;
  --space-3:14px;
  --space-4:18px;
  --space-5:24px;
  --space-6:32px;
  --space-7:44px;
  --space-8:64px;

  --text-xs:12px;
  --text-sm:13px;
  --text-md:15px;
  --text-lg:18px;
  --title-sm:24px;
  --title-md:36px;
  --title-lg:52px;
  --button-h:42px;
  --nav-h:76px;
}

html{font-size:calc(16px * var(--fs-scale));}
html,body{font-family:var(--font-body)!important;background:var(--bg);color:var(--text);}
body{font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;}
button,input,textarea,select{font:inherit;}
h1,h2,h3,.display-title{font-family:var(--font-display);letter-spacing:-.025em;}

/* Unified controls */
button,.btn,.register,.links a,.links button,.nav a:not(:first-child){transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease,opacity .16s ease;}
button:hover,.btn:hover,.register:hover{transform:translateY(-1px)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
input,textarea,select{background:var(--surface);color:var(--text);border-color:var(--line)!important;border-radius:var(--radius-sm);}

/* Shared card language */
.card,.post,.result,.box,.hero,.stats,.mediaItem{box-shadow:var(--shadow-card);}
.card,.post,.result,.box,.mediaItem{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018))!important;border-color:var(--line)!important;}
.chip{border-color:var(--line-accent)!important;background:rgba(255,57,124,.09)!important;}

/* Brand accent aliases keep old pages compatible */
:root{--p:var(--accent);--panel:rgba(48,20,58,.62);}

/* Common navigation behavior */
.fs-mobile-toggle{display:none;margin-left:auto;border:1px solid var(--line);background:rgba(255,255,255,.035);color:#fff;border-radius:var(--radius-pill);min-width:44px;height:40px;align-items:center;justify-content:center;font-size:22px;cursor:pointer;}
.fs-mobile-panel{display:none;}

/* Subtle branded pattern: intentionally low contrast */
.fs-pattern{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 15% 20%,rgba(255,57,124,.06) 0 2px,transparent 2.2px),
    radial-gradient(circle at 78% 35%,rgba(255,255,255,.035) 0 2px,transparent 2.2px),
    radial-gradient(circle at 35% 82%,rgba(255,57,124,.035) 0 2px,transparent 2.2px);
  background-size:88px 88px,116px 116px,142px 142px;
}

/* Responsive scale system */
@media(max-width:900px){
  :root{--nav-h:66px;--title-lg:44px;--space-8:48px;}
  .fs-mobile-toggle{display:inline-flex;}
  .fs-mobile-panel{position:fixed;left:12px;right:12px;top:72px;z-index:1000;padding:14px;border:1px solid var(--line);border-radius:18px;background:rgba(10,8,12,.98);backdrop-filter:blur(14px);box-shadow:0 24px 80px rgba(0,0,0,.45);}
  .fs-mobile-panel.open{display:grid;gap:8px;}
  .fs-mobile-panel a,.fs-mobile-panel button{display:flex;align-items:center;min-height:42px;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025);color:#fff;text-decoration:none;font-weight:700;}
}
@media(max-width:620px){
  :root{--title-lg:38px;--title-md:31px;--space-7:34px;--space-8:40px;}
  body{font-size:15px;}
}

/* Theme editor helper */
.fs-dev-badge{position:fixed;right:12px;bottom:12px;z-index:9999;padding:7px 10px;border-radius:999px;background:rgba(11,9,16,.82);border:1px solid var(--line);color:var(--muted);font-size:11px;backdrop-filter:blur(8px);}

/* v32 compatibility aliases and compact mobile navigation */
:root{--pink:var(--accent);--pink2:var(--accent-2);--p:var(--accent);}
@media(max-width:900px){
  header .nav > .navlinks,
  header .nav > .actions,
  header .nav > .links,
  .top .nav > .links,
  .top .nav > a:not(:first-child){display:none!important;}
  .fs-mobile-toggle{display:inline-flex!important;}
  header .nav,.top .nav{min-height:var(--nav-h)!important;height:auto!important;}
}