/* ─────────────────────────────────────────────────────────────
   Ascend design tokens.
   The single source of truth for the web client, kept in step by
   hand with app/Ascend/DesignSystem/Tokens.swift. Values come from
   docs/HANDOFF.md § Design tokens. A raw hex outside this file is a bug.
   ───────────────────────────────────────────────────────────── */
:root {
  --bg:#0d0b0c; --surf:#171314; --surf2:#221b1c;
  --line:rgba(236,232,232,.10); --line2:rgba(236,232,232,.19);
  --txt:#ece8e8; --mut:#9c9091;
  --acc:#e04a3a; --acc-hi:#f6b3a6; --acc-dim:#b23a2c;
  --acc-lo:#2c1413; --acc-mid:#61241e;
  --page1:#1e1213; --page2:#080607;
  --r:4px; --r2:8px; --pill:4px;
  --up:uppercase; --tr:.11em; --hw:600;
  --glow:0 0 0 3px rgba(224,74,58,.14);
}
[data-theme="bloom"] {
  --bg:#1c1b26; --surf:#272635; --surf2:#31303f;
  --line:rgba(233,233,237,.13); --line2:rgba(233,233,237,.2);
  /* --mut is #a3a7bb, not the handoff's #9397ab: that value fails WCAG AA
     against every Bloom ground, and DesignSystem/Tokens.swift moved for the
     same reason. The two token sheets have to agree. */
  --txt:#e9e9ed; --mut:#a3a7bb;
  --acc:#b5abfc; --acc-hi:#d2cefd; --acc-dim:#796cbf;
  --acc-lo:#332f4d; --acc-mid:#4a4470;
  --page1:#221f33; --page2:#0d0c14;
  --r:16px; --r2:22px; --pill:999px;
  --up:none; --tr:.005em; --hw:500;
  --glow:0 0 0 3px rgba(181,171,252,.16);
}

/* Spacing scale: 6 / 7 / 8 / 9 / 11 / 12 / 14 / 16 / 18 */
:root {
  --s-xs:6px; --s-sm:7px; --s-md:9px; --s-lg:12px;
  --s-xl:14px; --s-2xl:16px; --s-screen:18px;
}

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0 }

body {
  background:var(--bg);
  background-image:radial-gradient(120% 80% at 12% -10%, var(--page1) 0%, var(--page2) 68%);
  background-attachment:fixed;
  color:var(--txt);
  font:400 15px/1.6 Inter,-apple-system,system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

::selection { background:var(--acc-mid); color:var(--txt) }
:focus-visible { outline:2px solid var(--acc); outline-offset:2px; border-radius:var(--r) }
button, input, textarea, select { font:inherit; color:inherit }
button { background:none; border:none; cursor:pointer }
a { color:var(--acc); text-decoration:none }
a:hover { color:var(--acc-hi) }

/* ── Primitives ─────────────────────────────────────────────── */

.eyebrow {
  font-size:9.5px; text-transform:uppercase; letter-spacing:.16em;
  color:var(--mut);
}
/* Interactive labels follow the temperament; structural eyebrows do not. */
.tlabel { text-transform:var(--up); letter-spacing:var(--tr) }

h1 { font-size:23px; font-weight:var(--hw); letter-spacing:-.01em; line-height:1.2 }
h2 { font-size:18px; font-weight:var(--hw); letter-spacing:-.005em }
h3 { font-size:13.5px; font-weight:500 }

.card {
  background:var(--surf); border:1px solid var(--line);
  border-radius:var(--r2); padding:15px;
}
.card.tinted { background:var(--acc-lo); border-color:var(--acc-mid) }

.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  padding:9px 14px; border-radius:var(--pill);
  border:1px solid var(--acc); background:var(--acc-lo); color:var(--acc);
  font-size:12px; font-weight:500;
  text-transform:var(--up); letter-spacing:var(--tr);
  transition:background .15s ease, border-color .15s ease;
}
.btn:hover { background:var(--acc-mid) }
.btn.ghost { border-color:var(--line2); background:transparent; color:var(--mut) }
.btn.ghost:hover { background:var(--surf2); color:var(--txt) }
.btn:disabled { opacity:.45; cursor:not-allowed }

.pill {
  display:inline-block; padding:4px 9px; border-radius:var(--pill);
  border:1px solid var(--line2); font-size:9.5px;
  text-transform:uppercase; letter-spacing:.14em; color:var(--mut);
}
.pill.acc { border-color:var(--acc-mid); color:var(--acc); background:var(--acc-lo) }

.meter { height:4px; background:var(--surf2); border-radius:var(--pill); overflow:hidden }
.meter i { display:block; height:100%; background:var(--acc); border-radius:var(--pill) }

.muted { color:var(--mut) }
.acc { color:var(--acc) }
.mono { font-family:ui-monospace,SFMono-Regular,Menlo,monospace }