/* written by packages/themes/build-css.ts from packages/themes/src/system.ts: edit that, not this file */
:root, .paper {
  color-scheme: light;
  --ink-1: #fafafa;
  --ink-2: #f5f5f5;
  --ink-3: #ffffff;
  --ink-4: #f1f1f2;
  --ink-5: #ececee;
  --ink-6: #e9e9eb;
  --ink-7: #e4e4e7;
  --ink-8: #c9c9cc;
  --ink-9: #8e8e91;
  --ink-10: #6b6b6e;
  --ink-11: #3f3f42;
  --ink-12: #0b0b0c;
  --you: #a8390a;
  --you-fill: #ff5a1f;
  --you-ink: #0b0b0c;
  --ok: #24653f;
  --bad: #a0153e;
  --destructive: #a0153e;
  --font-body: "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, Menlo, monospace;
  --t-display-size: clamp(40px, 5.2vw, 76px);
  --t-display-line: 0.98;
  --t-display-weight: 650;
  --t-display-track: -0.05em;
  --t-h2-size: clamp(30px, 3.4vw, 48px);
  --t-h2-line: 1;
  --t-h2-weight: 650;
  --t-h2-track: -0.045em;
  --t-h3-size: clamp(20px, 1.7vw, 24px);
  --t-h3-line: 1.1;
  --t-h3-weight: 600;
  --t-h3-track: -0.03em;
  --t-body-size: 17px;
  --t-body-line: 1.55;
  --t-body-weight: 400;
  --t-body-track: 0;
  --t-small-size: 15px;
  --t-small-line: 1.5;
  --t-small-weight: 400;
  --t-small-track: 0;
  --t-mono-size: 13px;
  --t-mono-line: 1.3;
  --t-mono-weight: 500;
  --t-mono-track: 0;
  --radius-pane: 20px;
  --radius-site: 14px;
  --radius-control: 999px;
  --radius-chip: 8px;
  --radius-tick: 1px;
  --radius-dot: 2px;
  --radius-inset: 10px;
  --radius-tile: 12px;
  --radius-card: 16px;
  --radius-piece: 22px;
  --m-instant: 120ms;
  --m-base: 240ms;
  --m-slow: 480ms;
  --m-stagger: 50ms;
  --m-loop: 1600ms;
  --m-arrive: cubic-bezier(0.2, 0.8, 0.2, 1);
  --m-leave: cubic-bezier(0.4, 0, 1, 1);
  --m-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --m-rise: 6px;
  --frame: 0 0 0 1px rgb(255 255 255 / 0.12), 0 40px 120px -20px rgb(0 0 0 / 0.8);
  --pane: #f7f7f8;
  --glass: rgb(238 238 239 / 0.74);
  --glass-hi: rgb(249 249 250 / 0.88);
  --glass-edge: rgb(255 255 255 / 0.85);
  --glass-lift: inset 0 1px 0 rgb(255 255 255 / 0.9), 0 16px 34px -24px rgb(11 11 12 / 0.24), 0 4px 10px -8px rgb(11 11 12 / 0.16);
  --hair: color-mix(in srgb, var(--ink-12) 8%, transparent);
  --white: #fff;
  --shadow-pill: 0 6px 14px -10px rgb(11 11 12 / 0.35);
  --shadow-pill-dark: 0 10px 22px -12px rgb(11 11 12 / 0.6);
  --shadow-bar: inset 0 1px 0 rgb(255 255 255 / 0.7), 0 0 0 1px var(--hair), 0 12px 28px -22px rgb(11 11 12 / 0.35);
  --shadow-seg: 0 2px 8px -3px rgb(11 11 12 / 0.35), inset 0 0 0 1px var(--ink-6);
  --shadow-still: 0 0 0 1px var(--hair), 0 12px 26px -20px rgb(11 11 12 / 0.45);
}
:root[data-appearance="dark"], .ink {
  color-scheme: dark;
  --ink-1: #0a0a0b;
  --ink-2: #0f0f10;
  --ink-3: #141416;
  --ink-4: #1a1a1c;
  --ink-5: #202023;
  --ink-6: #252528;
  --ink-7: #2a2a2d;
  --ink-8: #3e3e41;
  --ink-9: #6b6b6d;
  --ink-10: #9a9a9d;
  --ink-11: #c4c4c7;
  --ink-12: #f4f4f5;
  --you: #ff5a1f;
  --you-fill: #ff5a1f;
  --you-ink: #0a0a0b;
  --ok: #6cc490;
  --bad: #f2557a;
  --destructive: #a0153e;
}
:root[data-appearance="dark"] {
  --pane: #131315;
  --glass: rgb(20 20 22 / 0.64);
  --glass-hi: rgb(27 27 29 / 0.84);
  --glass-edge: rgb(244 244 245 / 0.07);
  --glass-lift: inset 0 1px 0 rgb(244 244 245 / 0.06), 0 16px 34px -24px rgb(0 0 0 / 0.65);
  --hair: color-mix(in srgb, var(--ink-12) 8%, transparent);
}