Something went wrong. Try again.
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403@import "tailwindcss";@source ".";
@theme { --color-gray-1: var(--slate-1); --color-gray-2: var(--slate-2); --color-gray-3: var(--slate-3); --color-gray-4: var(--slate-4); --color-gray-5: var(--slate-5); --color-gray-6: var(--slate-6); --color-gray-7: var(--slate-7); --color-gray-8: var(--slate-8); --color-gray-9: var(--slate-9); --color-gray-10: var(--slate-10); --color-gray-11: var(--slate-11); --color-gray-12: var(--slate-12);
--color-blue-1: var(--blue-1); --color-blue-2: var(--blue-2); --color-blue-3: var(--blue-3); --color-blue-4: var(--blue-4); --color-blue-5: var(--blue-5); --color-blue-6: var(--blue-6); --color-blue-7: var(--blue-7); --color-blue-8: var(--blue-8); --color-blue-9: var(--blue-9); --color-blue-10: var(--blue-10); --color-blue-11: var(--blue-11); --color-blue-12: var(--blue-12); --color-blue-surface: var(--blue-surface); --color-blue-contrast: var(--blue-contrast);
--color-surface: var(--surface); --color-surface-muted: var(--surface-muted); --color-surface-raised: var(--surface-raised); --color-surface-overlay: var(--surface-overlay); --color-surface-inverse: var(--surface-inverse);
--color-ink: var(--ink); --color-ink-muted: var(--ink-muted); --color-ink-subtle: var(--ink-subtle); --color-ink-disabled: var(--ink-disabled); --color-ink-inverse: var(--ink-inverse);
--color-line: var(--line); --color-line-muted: var(--line-muted); --color-line-strong: var(--line-strong);
--color-accent: var(--accent); --color-accent-hover: var(--accent-hover); --color-accent-active: var(--accent-active); --color-accent-foreground: var(--accent-foreground);
--color-success: var(--success); --color-success-hover: var(--success-hover);
--color-warning: var(--warning); --color-warning-hover: var(--warning-hover);
--color-danger: var(--danger); --color-danger-hover: var(--danger-hover);
--color-info: var(--info); --color-info-hover: var(--info-hover);
--color-focus-ring: var(--focus-ring);
--font-serif: "Iowan Old Style", "Palatino", "Georgia", serif; --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--shadow-sm: var(--shadow-elevation-sm); --shadow-soft: var(--shadow-elevation-soft); --shadow-xl: var(--shadow-elevation-xl); --shadow-button: var(--shadow-elevation-button); --shadow-kbd: var(--shadow-elevation-kbd);
--animate-dialog-overlay-in: dialog-overlay-in 160ms ease-out; --animate-dialog-overlay-out: dialog-overlay-out 120ms ease-in; --animate-dialog-content-in: dialog-content-in 180ms cubic-bezier(0.16, 1, 0.3, 1); --animate-dialog-content-out: dialog-content-out 120ms ease-in; --animate-dropdown-in: dropdown-in 140ms cubic-bezier(0.16, 1, 0.3, 1); --animate-dropdown-out: dropdown-out 100ms ease-in;
@keyframes dialog-overlay-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dialog-overlay-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes dialog-content-in { from { opacity: 0; scale: 0.96; } to { opacity: 1; scale: 1; } }
@keyframes dialog-content-out { from { opacity: 1; scale: 1; } to { opacity: 0; scale: 0.96; } }
@keyframes dropdown-in { from { opacity: 0; scale: 0.98; translate: 0 -2px; } to { opacity: 1; scale: 1; translate: 0 0; } }
@keyframes dropdown-out { from { opacity: 1; scale: 1; translate: 0 0; } to { opacity: 0; scale: 0.98; translate: 0 -2px; } }}
@layer base { :root { --slate-1: #fcfcfd; --slate-2: #f9f9fb; --slate-3: #f0f0f3; --slate-4: #e8e8ec; --slate-5: #e0e1e6; --slate-6: #d9d9e0; --slate-7: #cdced6; --slate-8: #b9bbc6; --slate-9: #8b8d98; --slate-10: #80838d; --slate-11: #60646c; --slate-12: #1c2024;
--gray-a5: #00000014;
--blue-1: #fbfdff; --blue-2: #f4faff; --blue-3: #e6f4fe; --blue-4: #d5efff; --blue-5: #c2e5ff; --blue-6: #acd8fc; --blue-7: #8ec8f6; --blue-8: #5eb1ef; --blue-9: #0090ff; --blue-10: #0588f0; --blue-11: #0d74ce; --blue-12: #113264;
--blue-a1: #0080ff04; --blue-a2: #008cff0b; --blue-a3: #008ff519; --blue-a4: #009eff2a; --blue-a5: #0093ff3d; --blue-a6: #0088f653; --blue-a7: #0083eb71; --blue-a8: #0084e6a1; --blue-a9: #0090ff; --blue-a10: #0086f0fa; --blue-a11: #006dcbf2; --blue-a12: #002359ee;
--blue-contrast: #fff; --blue-surface: #f1f9ffcc; --blue-indicator: #0090ff; --blue-track: #0090ff;
/* surfaces */ --surface: var(--slate-1); --surface-muted: var(--slate-3); --surface-raised: var(--slate-2); --surface-overlay: var(--slate-2); --surface-inverse: var(--slate-12);
/* text */ --ink: var(--slate-12); --ink-muted: var(--slate-11); --ink-subtle: var(--slate-9); --ink-disabled: var(--slate-8); --ink-inverse: var(--slate-1);
/* borders */ --line: var(--slate-6); --line-muted: var(--slate-5); --line-strong: var(--slate-8);
/* actions */ --accent: var(--blue-indicator); --accent-hover: var(--blue-10); --accent-active: var(--blue-11); --accent-foreground: var(--blue-contrast);
/* feedback */ --success: var(--color-emerald-600); --success-hover: var(--color-emerald-700);
--warning: var(--color-amber-500); --warning-hover: var(--color-amber-600);
--danger: var(--color-red-600); --danger-hover: var(--color-red-700);
--info: var(--color-sky-600); --info-hover: var(--color-sky-700);
/* states */ --focus-ring: var(--blue-9);
/* shadows */ --shadow-elevation-sm: 0 1px 2px rgba(15, 23, 42, 0.08), 0 1px 1px rgba(15, 23, 42, 0.04); --shadow-elevation-button: 0 3px 0 var(--color-gray-4); --shadow-elevation-soft: 0 16px 40px -20px rgba(15, 23, 42, 0.24), 0 6px 18px -12px rgba(15, 23, 42, 0.16); --shadow-elevation-xl: 0 24px 64px -28px rgba(15, 23, 42, 0.34), 0 12px 28px -18px rgba(15, 23, 42, 0.2); --shadow-elevation-kbd: inset 0 -1px 0 color-mix(in srgb, var(--ink) 16%, transparent), 0 2px 0 var(--line-strong); }
@media (prefers-color-scheme: dark) { :root { --slate-1: #111113; --slate-2: #18191b; --slate-3: #212225; --slate-4: #272a2d; --slate-5: #2e3135; --slate-6: #363a3f; --slate-7: #43484e; --slate-8: #5a6169; --slate-9: #696e77; --slate-10: #777b84; --slate-11: #b0b4ba; --slate-12: #edeef0;
--gray-a5: #ffffff1f;
--blue-1: #09111d; --blue-2: #0e1927; --blue-3: #0b274a; --blue-4: #013067; --blue-5: #073c7a; --blue-6: #144a8c; --blue-7: #1f59a2; --blue-8: #256bc2; --blue-9: #0080ff; --blue-10: #0072f0; --blue-11: #76b6ff; --blue-12: #cbe3ff;
--blue-a1: #0012fd0d; --blue-a2: #0066fb18; --blue-a3: #006cfc3e; --blue-a4: #0066fd5d; --blue-a5: #0073fe71; --blue-a6: #1780ff84; --blue-a7: #2886fe9c; --blue-a8: #2c8affbe; --blue-a9: #0080ff; --blue-a10: #0079ffef; --blue-a11: #76b6ff; --blue-a12: #cbe3ff;
--blue-contrast: #fff; --blue-surface: #0c213d80; --blue-indicator: #0080ff; --blue-track: #0080ff;
--success: var(--color-emerald-500); --success-hover: var(--color-emerald-400);
--warning: var(--color-amber-400); --warning-hover: var(--color-amber-300);
--danger: var(--color-red-400); --danger-hover: var(--color-red-500);
--info: var(--color-sky-500); --info-hover: var(--color-sky-400);
--shadow-elevation-sm: 0 1px 2px rgba(0, 0, 0, 0.42); --shadow-elevation-button: 0 3px 0 var(--color-gray-4); --shadow-elevation-soft: 0 18px 44px -24px rgba(0, 0, 0, 0.78), 0 8px 18px -14px rgba(0, 0, 0, 0.62); --shadow-elevation-xl: 0 28px 72px -28px rgba(0, 0, 0, 0.84), 0 14px 34px -20px rgba(0, 0, 0, 0.68); --shadow-elevation-kbd: inset 0 -1px 0 color-mix(in srgb, var(--ink-inverse) 32%, transparent), 0 2px 0 var(--line-strong); } }
@supports (color: color(display-p3 1 1 1)) { @media (color-gamut: p3) and (prefers-color-scheme: dark) { :root { --blue-1: oklch(17.8% 0.0278 256.1); --blue-2: oklch(20.9% 0.0325 256.1); --blue-3: oklch(27.2% 0.074 256.1); --blue-4: oklch(31.7% 0.1073 256.1); --blue-5: oklch(36.4% 0.1173 256.1); --blue-6: oklch(41.3% 0.1224 256.1); --blue-7: oklch(46.8% 0.1323 256.1); --blue-8: oklch(53.1% 0.1522 256.1); --blue-9: oklch(61.5% 0.2108 256.1); --blue-10: oklch(57.3% 0.2108 256.1); --blue-11: oklch(77% 0.1427 256.1); --blue-12: oklch(90.8% 0.0525 256.1);
--blue-a1: color(display-p3 0 0.0667 0.9882 / 0.047); --blue-a2: color(display-p3 0.0235 0.4196 0.9922 / 0.089); --blue-a3: color(display-p3 0.102 0.4314 1 / 0.227); --blue-a4: color(display-p3 0.0706 0.4078 1 / 0.345); --blue-a5: color(display-p3 0.1412 0.4549 1 / 0.425); --blue-a6: color(display-p3 0.2157 0.5098 1 / 0.496); --blue-a7: color(display-p3 0.2745 0.5412 1 / 0.589); --blue-a8: color(display-p3 0.2863 0.5529 1 / 0.719); --blue-a9: color(display-p3 0.2196 0.5059 0.9961 / 0.967); --blue-a10: color(display-p3 0.2 0.4784 0.9961 / 0.904); --blue-a11: color(display-p3 0.5294 0.7255 1 / 0.975); --blue-a12: color(display-p3 0.8275 0.898 1 / 0.988);
--blue-contrast: #fff; --blue-surface: color(display-p3 0.0588 0.1176 0.2275 / 0.5); --blue-indicator: oklch(61.5% 0.2108 256.1); --blue-track: oklch(61.5% 0.2108 256.1); } } }
html { color-scheme: light dark; scrollbar-gutter: stable; }
body { margin: 0; background: var(--surface); }
body[data-scroll-locked] { margin-right: 0 !important; }}
@layer utilities { .focus-ring { @apply outline-none transition-shadow duration-150 ease-out; box-shadow: 0 0 0 0 var(--surface), 0 0 0 0 color-mix(in srgb, var(--focus-ring) 0%, transparent); }
[data-focus-source="tab"] .focus-ring:focus { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--focus-ring); }
.focus-ring-field { @apply outline-none transition-shadow duration-150 ease-out; box-shadow: 0 0 0 0 var(--surface), 0 0 0 0 color-mix(in srgb, var(--focus-ring) 0%, transparent); }
.focus-ring-field:focus { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--focus-ring); }
.focus-ring-search { @apply outline-none transition-colors duration-150 ease-out; }
.focus-ring-search:focus { border-color: var(--focus-ring); }}