@font-face {
  font-family: "Manrope";
  src: url("assets/manrope-variable.woff2?v=manrope-1") format("woff2"), url("assets/manrope-variable.ttf?v=manrope-1") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --bg: #141116; --surface: #1c181e; --raised: #262128; --hover: #2f2932;
  --line: rgba(247, 239, 242, 0.09); --line-strong: rgba(247, 239, 242, 0.16);
  --text: #f7eff2; --text-2: #cdc0c7; --text-3: #a89aa2;
  --accent: #ff6aa8; --accent-hover: #ff8dbd; --accent-ink: #1d0b14; --accent-tint: rgba(255, 106, 168, 0.14);
  --info: #7cc4ff; --danger: #ff8a9b; --success: #6fd3a3; --warn: #f5c26b;
  --scrim: rgba(10, 8, 12, 0.82);
  --focus: 0 0 0 2px var(--bg), 0 0 0 4px var(--accent);
  --shadow-1: 0 1px 2px rgba(0,0,0,.3), 0 4px 12px rgba(0,0,0,.18);
  --shadow-2: 0 12px 40px rgba(0,0,0,.45);
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-pill: 999px;
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 17px; --fs-xl: 20px; --fs-2xl: 24px; --fs-3xl: 32px;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px; --s14: 56px;
  --ease: cubic-bezier(.2,.7,.2,1);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #fbf6f8; --surface: #ffffff; --raised: #f3e8ed; --hover: #ecdfe5;
  --line: #e6d9df; --line-strong: #d6c6cd;
  --text: #221b20; --text-2: #564b53; --text-3: #6b5f67;
  --accent: #b4235f; --accent-hover: #951a4e; --accent-ink: #ffffff; --accent-tint: rgba(180, 35, 95, 0.10);
  --info: #1b649c; --danger: #b3263e; --success: #1a6c49; --warn: #8a5a00;
  --shadow-1: 0 1px 2px rgba(60,30,45,.08), 0 4px 12px rgba(60,30,45,.06);
  --shadow-2: 0 12px 40px rgba(60,30,45,.16);
}


/* Temporary aliases while each legacy layout is replaced in phase order. */
:root {
  --panel: var(--surface); --panel-2: var(--raised); --bg-soft: var(--surface);
  --panel-glass: color-mix(in srgb, var(--surface) 94%, transparent);
  --surface-raised: var(--raised); --surface-hover: var(--hover);
  --sidebar-bg: var(--surface); --topbar-bg: color-mix(in srgb, var(--bg) 94%, transparent);
  --muted: var(--text-3); --dim: var(--text-3); --text-secondary: var(--text-2);
  --accent-strong: var(--accent); --accent-alt: var(--info); --accent-soft: var(--accent-tint);
  --wine: var(--danger); --radius: var(--r-md); --shadow: var(--shadow-1);
}

:root[data-discreet="true"] {
 --bg:#121212; --surface:#1a1a1a; --raised:#242424; --hover:#2c2c2c;
 --text:#f5f5f5; --text-2:#cccccc; --text-3:#aaaaaa;
 --accent:#d1d1d1; --accent-hover:#f2f2f2; --accent-ink:#121212; --accent-tint:rgba(209,209,209,.14);
 --info:#cccccc; --danger:#cccccc; --success:#cccccc; --warn:#cccccc;
}
:root[data-theme="light"][data-discreet="true"] {
 --bg:#f5f5f5; --surface:#ffffff; --raised:#eeeeee; --hover:#dedede;
 --text:#171717; --text-2:#444444; --text-3:#626262;
 --accent:#444444; --accent-hover:#333333; --accent-ink:#ffffff; --accent-tint:rgba(0,0,0,.08);
 --info:#444444; --danger:#444444; --success:#444444; --warn:#444444;
}