@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Inter:wght@400;500&display=swap");

:root {
  --c-canvas:#F4F1EA; --c-surface:#FFFFFF; --c-surface-2:#FBF8F2; --c-surface-3:#EEEAE1;
  --c-ink:#111114; --c-ink-2:#55555B; --c-ink-3:#8A8A92; --c-ink-inv:#FFFFFF;
  --c-primary:#7796F9; --c-primary-2:#5E7FEE; --c-primary-ink:#2E3B8A; --c-primary-wash:#E9EEFF;
  --c-accent-sun:#F5B841; --c-accent-sky:#9FC3F4; --c-accent-moss:#6B8B5B; --c-accent-rose:#D88473;
  --c-line:#E3DED3; --c-line-strong:#1A1A1E;
  --f-display:"Space Grotesk","Inter",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
  --r-md:16px; --r-lg:22px; --r-pill:999px;
  --sh-card:0 1px 2px rgba(18,18,24,0.04),0 8px 24px rgba(18,18,24,0.05);
  --sh-raised:0 2px 6px rgba(18,18,24,0.06),0 20px 48px rgba(18,18,24,0.08);
}

* { box-sizing:border-box; -webkit-font-smoothing:antialiased; }

html, body, #root { margin:0; padding:0; height:100%; }

body { background:var(--c-canvas); font-family:var(--f-body); color:var(--c-ink); overscroll-behavior:none; }

* { scrollbar-width:none; -ms-overflow-style:none; }

*::-webkit-scrollbar { display:none; }

.num { font-family:var(--f-mono); font-feature-settings:"tnum"; }

.btn-pri { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:54px;
  background:var(--c-primary); color:#fff; border:none; border-radius:var(--r-pill);
  font:500 15px var(--f-body); cursor:pointer; }

.btn-pri:disabled { opacity:0.45; cursor:not-allowed; }

.btn { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:48px;
  background:var(--c-surface); color:var(--c-ink); border:1px solid var(--c-line);
  border-radius:var(--r-pill); font:500 14px var(--f-body); cursor:pointer;
  box-shadow:var(--sh-card); transition: background 0.15s ease, border-color 0.15s ease; }

.btn:hover { background:var(--c-surface-3); border-color:var(--c-line-strong); }

.btn:disabled { opacity:0.45; cursor:not-allowed; }

.btn-ghost { background:transparent; color:var(--c-ink); border:1px solid var(--c-line-strong); }

input, button { font-family:inherit; }

input:focus { outline:none; }