:root {
    --ink-50: 250 250 249;
    --ink-100: 244 244 243;
    --ink-150: 236 236 235;
    --ink-200: 228 228 226;
    --ink-300: 209 209 207;
    --ink-400: 163 163 160;
    --ink-500: 115 115 112;
    --ink-600: 82 82 80;
    --ink-700: 63 63 61;
    --ink-800: 39 39 42;
    --ink-900: 24 24 27;
    --bg-body: 250 250 249;
    --surface: 255 255 255;
    --on-surface: 255 255 255;
}

.dark {
    --ink-50: 24 24 27;
    --ink-100: 32 32 36;
    --ink-150: 44 44 48;
    --ink-200: 56 56 60;
    --ink-300: 82 82 86;
    --ink-400: 130 130 135;
    --ink-500: 163 163 165;
    --ink-600: 200 200 200;
    --ink-700: 220 220 220;
    --ink-800: 235 235 235;
    --ink-900: 245 245 245;
    --bg-body: 18 18 21;
    --surface: 34 34 38;
    --on-surface: 24 24 27;
}

html, body {
    background-color: rgb(var(--bg-body));
    color: rgb(var(--ink-900));
    font-family: 'Geist', system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.bg-white { background-color: rgb(var(--surface)) !important; }
.text-white { color: rgb(var(--on-surface)) !important; }
.border-white { border-color: rgb(var(--surface)) !important; }
.hover\:bg-white:hover { background-color: rgb(var(--surface)) !important; }

*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: rgb(var(--ink-300)); border-radius: 999px; border: 2px solid rgb(var(--bg-body)); }
*::-webkit-scrollbar-track { background: transparent; }
.dark *::-webkit-scrollbar-thumb { background: rgb(60 60 64); }

.text-balance { text-wrap: balance; }
.text-pretty { text-wrap: pretty; }
.line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.line-clamp-3 { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.tabular-nums { font-variant-numeric: tabular-nums; }

.dark .bg-accent-50 { background-color: rgb(67 56 202 / 0.18) !important; }
.dark .bg-accent-100 { background-color: rgb(67 56 202 / 0.30) !important; }
.dark .text-accent-700, .dark .text-accent-600 { color: rgb(165 180 252) !important; }
.dark .bg-emerald-50 { background-color: rgb(6 95 70 / 0.30) !important; }
.dark .bg-emerald-100 { background-color: rgb(6 95 70 / 0.55) !important; }
.dark .text-emerald-700 { color: rgb(110 231 183) !important; }
.dark .bg-amber-50 { background-color: rgb(146 64 14 / 0.28) !important; }
.dark .bg-amber-100 { background-color: rgb(146 64 14 / 0.50) !important; }
.dark .text-amber-700, .dark .text-amber-800 { color: rgb(252 211 77) !important; }
.dark .bg-red-50 { background-color: rgb(127 29 29 / 0.30) !important; }
.dark .text-red-700, .dark .text-red-600 { color: rgb(252 165 165) !important; }
.dark .border-red-200 { border-color: rgb(127 29 29) !important; }
.dark .border-red-600 { border-color: rgb(252 165 165) !important; }
.dark .bg-rose-50 { background-color: rgb(136 19 55 / 0.30) !important; }
.dark .bg-rose-100 { background-color: rgb(159 18 57 / 0.50) !important; }
.dark .text-rose-700 { color: rgb(253 164 175) !important; }
.dark .bg-sky-100 { background-color: rgb(7 89 133 / 0.50) !important; }
.dark .text-sky-700 { color: rgb(125 211 252) !important; }
.dark .bg-cyan-100 { background-color: rgb(14 116 144 / 0.45) !important; }
.dark .text-cyan-700 { color: rgb(103 232 249) !important; }
.dark .bg-violet-100 { background-color: rgb(76 29 149 / 0.50) !important; }
.dark .text-violet-700 { color: rgb(196 181 253) !important; }
.dark .bg-indigo-100 { background-color: rgb(67 56 202 / 0.30) !important; }
.dark .text-indigo-700, .dark .text-indigo-600 { color: rgb(165 180 252) !important; }

.mud-snackbar {
    min-width: 0;
    max-width: min(360px, calc(100vw - 32px));
    padding: 2px 10px;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgb(24 24 27 / 0.12);
    font-size: 12px;
}

.mud-snackbar .mud-snackbar-content-message {
    padding: 5px 0;
}

.mud-snackbar-icon {
    padding: 4px 0;
    margin-right: 8px;
    font-size: 16px;
}

.mud-snackbar.mud-alert-text-success {
    border: 1px solid rgb(167 243 208);
    background-color: rgb(236 253 245);
    color: rgb(4 120 87);
}

.mud-snackbar.mud-alert-text-info {
    border: 1px solid rgb(186 230 253);
    background-color: rgb(240 249 255);
    color: rgb(3 105 161);
}

.mud-snackbar.mud-alert-text-warning {
    border: 1px solid rgb(253 230 138);
    background-color: rgb(255 251 235);
    color: rgb(180 83 9);
}

.mud-snackbar.mud-alert-text-error {
    border: 1px solid rgb(254 202 202);
    background-color: rgb(254 242 242);
    color: rgb(185 28 28);
}

.dark .mud-snackbar.mud-alert-text-success {
    border-color: rgb(6 95 70);
    background-color: rgb(6 95 70 / 0.30);
    color: rgb(110 231 183);
}

.dark .mud-snackbar.mud-alert-text-info {
    border-color: rgb(7 89 133);
    background-color: rgb(7 89 133 / 0.30);
    color: rgb(125 211 252);
}

.dark .mud-snackbar.mud-alert-text-warning {
    border-color: rgb(146 64 14);
    background-color: rgb(146 64 14 / 0.28);
    color: rgb(252 211 77);
}

.dark .mud-snackbar.mud-alert-text-error {
    border-color: rgb(127 29 29);
    background-color: rgb(127 29 29 / 0.30);
    color: rgb(252 165 165);
}

body, .bg-white, [class*="bg-ink-"], [class*="text-ink-"], [class*="border-ink-"] {
    transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
    body, .bg-white, [class*="bg-ink-"], [class*="text-ink-"], [class*="border-ink-"] {
        transition: none;
    }
}