@layer base, components, utilities;

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/geist-latin-d5790661.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/geist-latin-ext-992fc5dd.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/geist-mono-latin-dcf0579d.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
    U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/geist-mono-latin-ext-79242f2a.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: light;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;

  --font-sans: "Geist", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --speed-fast: 0.14s;
  --speed: 0.22s;

  --bg-primary: #fefdfa;
  --bg-secondary: #f8f7f2;
  --bg-tertiary: #f1f0ea;
  --text-primary: #22201d;
  --text-secondary: #67635d;
  --text-tertiary: #96918b;
  --border: rgba(45, 38, 26, 0.13);
  --border-strong: rgba(45, 38, 26, 0.24);

  --accent: #443dd6;
  --accent-soft: rgba(68, 61, 214, 0.14);
  --link: #3a33c0;
  --chart-1: #443dd6;
  --chart-2: #0c9184;
  --chart-3: #e08700;
  --chart-4: #d81b7d;
  --chart-5: #65a30d;
  --chart-grid: rgba(45, 38, 26, 0.07);

  --brand-mark-bg: #2e3136;
  --brand-mark-ink: #f3f1ed;

  --up: #007b40;
  --up-bg: #d5f7e2;
  --down: #b6322d;
  --down-bg: #ffe2dd;

  --info-bg: #d6f0ff;     --info-text: #01538b;     --info-border: #9ec9f3;
  --success-bg: #d5f7e2;  --success-text: #006236;  --success-border: #a7e4c2;
  --warning-bg: #ffe9cc;  --warning-text: #734400;  --warning-border: #f0cf9c;
  --danger-bg: #ffe2dd;   --danger-text: #83312b;   --danger-border: #f1b2aa;
  --purple-bg: #ede8ff;   --purple-text: #524189;

  --shadow-sm: 0 1px 2px rgba(45, 38, 26, 0.06);
  --shadow-md: 0 6px 22px rgba(45, 38, 26, 0.10);
  --scroll-shadow: rgba(45, 38, 26, 0.25);
  --ring: 0 0 0 2px var(--bg-primary), 0 0 0 3.5px color-mix(in srgb, var(--accent) 60%, transparent);

  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2367635d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --bg-primary: #1d1b19;
    --bg-secondary: #141210;
    --bg-tertiary: #0a0907;
    --text-primary: #eae7e3;
    --text-secondary: #95918c;
    --text-tertiary: #6e6963;
    --border: rgba(240, 235, 226, 0.14);
    --border-strong: rgba(240, 235, 226, 0.24);

    --accent: #8b93ff;
    --accent-soft: rgba(139, 147, 255, 0.20);
    --link: #8b93ff;
    --chart-1: #8b93ff;
    --chart-2: #33e0c0;
    --chart-3: #ffbe3d;
    --chart-4: #f06ea9;
    --chart-5: #a4d94e;
    --chart-grid: rgba(240, 235, 226, 0.08);

    --brand-mark-bg: #383c42;

    --up: #6bcb97;        --up-bg: #123724;
    --down: #f98f84;      --down-bg: #472320;

    --info-bg: #163149;     --info-text: #8fcaff;     --info-border: #295074;
    --success-bg: #123724;  --success-text: #8bd8ab;  --success-border: #2c5a3f;
    --warning-bg: #3f2b0a;  --warning-text: #eabb79;  --warning-border: #6b4d18;
    --danger-bg: #472320;   --danger-text: #feaba1;   --danger-border: #703c36;
    --purple-bg: #302a48;   --purple-text: #c5b9ff;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30);
    --shadow-md: 0 6px 22px rgba(0, 0, 0, 0.40);
    --scroll-shadow: rgba(0, 0, 0, 0.65);

    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2395918c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --bg-primary: #1d1b19;
  --bg-secondary: #141210;
  --bg-tertiary: #0a0907;
  --text-primary: #eae7e3;
  --text-secondary: #95918c;
  --text-tertiary: #6e6963;
  --border: rgba(240, 235, 226, 0.14);
  --border-strong: rgba(240, 235, 226, 0.24);

  --accent: #8b93ff;
  --accent-soft: rgba(139, 147, 255, 0.20);
  --link: #8b93ff;
  --chart-1: #8b93ff;
  --chart-2: #33e0c0;
  --chart-3: #ffbe3d;
  --chart-4: #f06ea9;
  --chart-5: #a4d94e;
  --chart-grid: rgba(240, 235, 226, 0.08);

  --brand-mark-bg: #383c42;

  --up: #6bcb97;        --up-bg: #123724;
  --down: #f98f84;      --down-bg: #472320;

  --info-bg: #163149;     --info-text: #8fcaff;     --info-border: #295074;
  --success-bg: #123724;  --success-text: #8bd8ab;  --success-border: #2c5a3f;
  --warning-bg: #3f2b0a;  --warning-text: #eabb79;  --warning-border: #6b4d18;
  --danger-bg: #472320;   --danger-text: #feaba1;   --danger-border: #703c36;
  --purple-bg: #302a48;   --purple-text: #c5b9ff;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30);
  --shadow-md: 0 6px 22px rgba(0, 0, 0, 0.40);
  --scroll-shadow: rgba(0, 0, 0, 0.65);

  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%2395918c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
