:root {
	--color-white: oklch(1 0 0);
	--color-black: oklch(0 0 0);
	--color-slate-50: oklch(98.4% 0.003 247.858);
	--color-slate-100: oklch(96.8% 0.007 247.896);
	--color-slate-200: oklch(92.9% 0.013 255.508);
	--color-slate-300: oklch(86.9% 0.022 252.894);
	--color-slate-400: oklch(70.4% 0.04 256.788);
	--color-slate-500: oklch(55.4% 0.046 257.417);
	--color-slate-600: oklch(44.6% 0.043 257.281);
	--color-slate-700: oklch(37.2% 0.044 257.287);
	--color-slate-800: oklch(27.9% 0.041 260.031);
	--color-slate-900: oklch(20.8% 0.042 265.755);
	--color-slate-950: oklch(12.9% 0.042 264.695);
	--color-red-50: oklch(97.1% 0.013 17.38);
	--color-red-100: oklch(93.6% 0.032 17.717);
	--color-red-200: oklch(88.5% 0.062 18.334);
	--color-red-300: oklch(80.8% 0.114 19.571);
	--color-red-400: oklch(70.4% 0.191 22.216);
	--color-red-500: oklch(63.7% 0.237 25.331);
	--color-red-600: oklch(57.7% 0.245 27.325);
	--color-red-700: oklch(50.5% 0.213 27.518);
	--color-red-800: oklch(44.4% 0.177 26.899);
	--color-red-900: oklch(39.6% 0.141 25.723);
	--color-red-950: oklch(25.8% 0.092 26.042);
	--color-emerald-50: oklch(97.9% 0.021 166.113);
	--color-emerald-100: oklch(95% 0.052 163.051);
	--color-emerald-200: oklch(90.5% 0.093 164.15);
	--color-emerald-300: oklch(84.5% 0.143 164.978);
	--color-emerald-400: oklch(76.5% 0.177 163.223);
	--color-emerald-500: oklch(69.6% 0.17 162.48);
	--color-emerald-600: oklch(59.6% 0.145 163.225);
	--color-emerald-700: oklch(50.8% 0.118 165.612);
	--color-emerald-800: oklch(43.2% 0.095 166.913);
	--color-emerald-900: oklch(37.8% 0.077 168.94);
	--color-emerald-950: oklch(26.2% 0.051 172.552);
	--color-amber-50: oklch(98.7% 0.022 95.277);
	--color-amber-100: oklch(96.2% 0.059 95.617);
	--color-amber-200: oklch(92.4% 0.12 95.746);
	--color-amber-300: oklch(87.9% 0.169 91.605);
	--color-amber-400: oklch(82.8% 0.189 84.429);
	--color-amber-500: oklch(76.9% 0.188 70.08);
	--color-amber-600: oklch(66.6% 0.179 58.318);
	--color-amber-700: oklch(55.5% 0.163 48.998);
	--color-amber-800: oklch(47.3% 0.137 46.201);
	--color-amber-900: oklch(41.4% 0.112 45.904);
	--color-amber-950: oklch(27.9% 0.077 45.635);
	--color-blue-50: oklch(97% 0.014 254.604);
	--color-blue-100: oklch(93.2% 0.032 255.585);
	--color-blue-200: oklch(88.2% 0.059 254.128);
	--color-blue-300: oklch(80.9% 0.105 251.813);
	--color-blue-400: oklch(70.7% 0.165 254.624);
	--color-blue-500: oklch(62.3% 0.214 259.815);
	--color-blue-600: oklch(54.6% 0.245 262.881);
	--color-blue-700: oklch(48.8% 0.243 264.376);
	--color-blue-800: oklch(42.4% 0.199 265.638);
	--color-blue-900: oklch(37.9% 0.146 265.522);
	--color-blue-950: oklch(28.2% 0.091 267.935);
	--color-indigo-50: oklch(96.2% 0.018 272.314);
	--color-indigo-100: oklch(93% 0.034 272.788);
	--color-indigo-200: oklch(87% 0.065 274.039);
	--color-indigo-300: oklch(78.5% 0.115 274.713);
	--color-indigo-400: oklch(67.3% 0.182 276.935);
	--color-indigo-500: oklch(58.5% 0.233 277.117);
	--color-indigo-600: oklch(51.1% 0.262 276.966);
	--color-indigo-700: oklch(45.7% 0.24 277.023);
	--color-indigo-800: oklch(39.8% 0.195 277.366);
	--color-indigo-900: oklch(35.9% 0.144 278.697);
	--color-indigo-950: oklch(25.7% 0.09 281.288);
	--color-sky-50: oklch(97.7% 0.013 236.62);
	--color-sky-100: oklch(95.1% 0.026 236.824);
	--color-sky-200: oklch(90.1% 0.058 230.902);
	--color-sky-300: oklch(82.8% 0.111 230.318);
	--color-sky-400: oklch(74.6% 0.16 232.661);
	--color-sky-500: oklch(68.5% 0.169 237.323);
	--color-sky-600: oklch(58.8% 0.158 241.966);
	--color-sky-700: oklch(50% 0.134 242.749);
	--color-sky-800: oklch(44.3% 0.11 240.79);
	--color-sky-900: oklch(39.1% 0.09 240.876);
	--color-sky-950: oklch(29.3% 0.066 243.157);
	--color-fuchsia-50: oklch(97.7% 0.017 320.058);
	--color-fuchsia-100: oklch(95.2% 0.037 318.852);
	--color-fuchsia-200: oklch(90.3% 0.076 319.62);
	--color-fuchsia-300: oklch(83.3% 0.145 321.434);
	--color-fuchsia-400: oklch(74% 0.238 322.16);
	--color-fuchsia-500: oklch(66.7% 0.295 322.15);
	--color-fuchsia-600: oklch(59.1% 0.293 322.896);
	--color-fuchsia-700: oklch(51.8% 0.253 323.949);
	--color-fuchsia-800: oklch(45.2% 0.211 324.591);
	--color-fuchsia-900: oklch(40.1% 0.17 325.612);
	--color-fuchsia-950: oklch(29.3% 0.136 325.661);
}

:root.dark {
	color-scheme: dark;
	--color-white: oklch(0.235 0.035 264);
	--color-black: oklch(1 0 0);
	--color-slate-50: oklch(12.9% 0.042 264.695);
	--color-slate-100: oklch(20.8% 0.042 265.755);
	--color-slate-200: oklch(27.9% 0.041 260.031);
	--color-slate-300: oklch(37.2% 0.044 257.287);
	--color-slate-400: oklch(44.6% 0.043 257.281);
	--color-slate-500: oklch(55.4% 0.046 257.417);
	--color-slate-600: oklch(70.4% 0.04 256.788);
	--color-slate-700: oklch(86.9% 0.022 252.894);
	--color-slate-800: oklch(92.9% 0.013 255.508);
	--color-slate-900: oklch(96.8% 0.007 247.896);
	--color-slate-950: oklch(98.4% 0.003 247.858);
	--color-red-50: oklch(25.8% 0.092 26.042);
	--color-red-100: oklch(39.6% 0.141 25.723);
	--color-red-200: oklch(44.4% 0.177 26.899);
	--color-red-300: oklch(50.5% 0.213 27.518);
	--color-red-400: oklch(57.7% 0.245 27.325);
	--color-red-500: oklch(63.7% 0.237 25.331);
	--color-red-600: oklch(70.4% 0.191 22.216);
	--color-red-700: oklch(80.8% 0.114 19.571);
	--color-red-800: oklch(88.5% 0.062 18.334);
	--color-red-900: oklch(93.6% 0.032 17.717);
	--color-red-950: oklch(97.1% 0.013 17.38);
	--color-emerald-50: oklch(26.2% 0.051 172.552);
	--color-emerald-100: oklch(37.8% 0.077 168.94);
	--color-emerald-200: oklch(43.2% 0.095 166.913);
	--color-emerald-300: oklch(50.8% 0.118 165.612);
	--color-emerald-400: oklch(59.6% 0.145 163.225);
	--color-emerald-500: oklch(69.6% 0.17 162.48);
	--color-emerald-600: oklch(76.5% 0.177 163.223);
	--color-emerald-700: oklch(84.5% 0.143 164.978);
	--color-emerald-800: oklch(90.5% 0.093 164.15);
	--color-emerald-900: oklch(95% 0.052 163.051);
	--color-emerald-950: oklch(97.9% 0.021 166.113);
	--color-amber-50: oklch(27.9% 0.077 45.635);
	--color-amber-100: oklch(41.4% 0.112 45.904);
	--color-amber-200: oklch(47.3% 0.137 46.201);
	--color-amber-300: oklch(55.5% 0.163 48.998);
	--color-amber-400: oklch(66.6% 0.179 58.318);
	--color-amber-500: oklch(76.9% 0.188 70.08);
	--color-amber-600: oklch(82.8% 0.189 84.429);
	--color-amber-700: oklch(87.9% 0.169 91.605);
	--color-amber-800: oklch(92.4% 0.12 95.746);
	--color-amber-900: oklch(96.2% 0.059 95.617);
	--color-amber-950: oklch(98.7% 0.022 95.277);
	--color-blue-50: oklch(28.2% 0.091 267.935);
	--color-blue-100: oklch(37.9% 0.146 265.522);
	--color-blue-200: oklch(42.4% 0.199 265.638);
	--color-blue-300: oklch(48.8% 0.243 264.376);
	--color-blue-400: oklch(54.6% 0.245 262.881);
	--color-blue-500: oklch(62.3% 0.214 259.815);
	--color-blue-600: oklch(70.7% 0.165 254.624);
	--color-blue-700: oklch(80.9% 0.105 251.813);
	--color-blue-800: oklch(88.2% 0.059 254.128);
	--color-blue-900: oklch(93.2% 0.032 255.585);
	--color-blue-950: oklch(97% 0.014 254.604);
	--color-indigo-50: oklch(25.7% 0.09 281.288);
	--color-indigo-100: oklch(35.9% 0.144 278.697);
	--color-indigo-200: oklch(39.8% 0.195 277.366);
	--color-indigo-300: oklch(45.7% 0.24 277.023);
	--color-indigo-400: oklch(51.1% 0.262 276.966);
	--color-indigo-500: oklch(58.5% 0.233 277.117);
	--color-indigo-600: oklch(67.3% 0.182 276.935);
	--color-indigo-700: oklch(78.5% 0.115 274.713);
	--color-indigo-800: oklch(87% 0.065 274.039);
	--color-indigo-900: oklch(93% 0.034 272.788);
	--color-indigo-950: oklch(96.2% 0.018 272.314);
	--color-sky-50: oklch(29.3% 0.066 243.157);
	--color-sky-100: oklch(39.1% 0.09 240.876);
	--color-sky-200: oklch(44.3% 0.11 240.79);
	--color-sky-300: oklch(50% 0.134 242.749);
	--color-sky-400: oklch(58.8% 0.158 241.966);
	--color-sky-500: oklch(68.5% 0.169 237.323);
	--color-sky-600: oklch(74.6% 0.16 232.661);
	--color-sky-700: oklch(82.8% 0.111 230.318);
	--color-sky-800: oklch(90.1% 0.058 230.902);
	--color-sky-900: oklch(95.1% 0.026 236.824);
	--color-sky-950: oklch(97.7% 0.013 236.62);
	--color-fuchsia-50: oklch(29.3% 0.136 325.661);
	--color-fuchsia-100: oklch(40.1% 0.17 325.612);
	--color-fuchsia-200: oklch(45.2% 0.211 324.591);
	--color-fuchsia-300: oklch(51.8% 0.253 323.949);
	--color-fuchsia-400: oklch(59.1% 0.293 322.896);
	--color-fuchsia-500: oklch(66.7% 0.295 322.15);
	--color-fuchsia-600: oklch(74% 0.238 322.16);
	--color-fuchsia-700: oklch(83.3% 0.145 321.434);
	--color-fuchsia-800: oklch(90.3% 0.076 319.62);
	--color-fuchsia-900: oklch(95.2% 0.037 318.852);
	--color-fuchsia-950: oklch(97.7% 0.017 320.058);
}

[x-cloak] {
	display: none !important;
}

body {
	font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

button, select, summary, [type="checkbox"], [type="radio"], a[href] {
	cursor: pointer;
}

button:disabled, select:disabled {
	cursor: not-allowed;
}

.field {
	width: 100%;
	border: 1px solid var(--color-slate-300);
	border-radius: 0.375rem;
	padding: 0.375rem 0.625rem;
	font-size: 0.875rem;
	background: var(--color-white);
	color: var(--color-slate-800);
}

.field::placeholder {
	color: var(--color-slate-400);
}

*:focus, *:focus-visible {
	outline: none;
}

.field:focus {
	border-color: var(--color-slate-500);
	box-shadow: 0 0 0 3px color-mix(in oklch, var(--color-slate-400) 25%, transparent);
}

.label {
	display: block;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--color-slate-600);
	margin-bottom: 0.25rem;
}

.hint {
	font-size: 0.75rem;
	color: var(--color-slate-500);
	margin-top: 0.25rem;
}

.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.375rem;
	white-space: nowrap;
	border-radius: 0.375rem;
	border: 1px solid var(--color-slate-300);
	padding: 0.375rem 0.75rem;
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--color-slate-700);
	background: var(--color-white);
}

.btn:hover {
	background: var(--color-slate-100);
}

.btn:disabled {
	opacity: 0.5;
}

.btn-primary {
	background: var(--color-slate-900);
	border-color: var(--color-slate-900);
	color: var(--color-white);
}

.btn-primary:hover {
	background: var(--color-slate-800);
}

.btn-danger {
	color: var(--color-red-700);
	border-color: var(--color-red-300);
}

.btn-danger:hover {
	background: var(--color-red-50);
}

.btn-sm {
	padding: 0.125rem 0.5rem;
	font-size: 0.75rem;
}

.card {
	background: var(--color-white);
	border: 1px solid var(--color-slate-200);
	border-radius: 0.5rem;
}

.table {
	width: 100%;
	font-size: 0.875rem;
}

.table th {
	text-align: left;
	font-weight: 600;
	color: var(--color-slate-600);
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid var(--color-slate-200);
	white-space: nowrap;
}

.table td {
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid var(--color-slate-100);
	vertical-align: top;
}

.table tr:last-child td {
	border-bottom: 0;
}

.amount {
	font-weight: 600;
	white-space: nowrap;
}

.badge {
	display: inline-block;
	border-radius: 9999px;
	padding: 0.125rem 0.5rem;
	font-size: 0.75rem;
	font-weight: 600;
	white-space: nowrap;
	background: var(--color-slate-100);
	color: var(--color-slate-700);
}

.badge-success {
	background: var(--color-emerald-100);
	color: var(--color-emerald-800);
}

.badge-warning {
	background: var(--color-amber-100);
	color: var(--color-amber-800);
}

.badge-danger {
	background: var(--color-red-100);
	color: var(--color-red-800);
}

.badge-info {
	background: var(--color-blue-100);
	color: var(--color-blue-800);
}

.badge-accent {
	background: var(--color-indigo-100);
	color: var(--color-indigo-800);
}

.alert-error {
	background: var(--color-red-50);
	border: 1px solid var(--color-red-200);
	color: var(--color-red-800);
	border-radius: 0.375rem;
	padding: 0.5rem 0.75rem;
	font-size: 0.875rem;
}

.alert-info {
	background: var(--color-slate-50);
	border: 1px solid var(--color-slate-200);
	color: var(--color-slate-600);
	border-radius: 0.375rem;
	padding: 0.5rem 0.75rem;
	font-size: 0.875rem;
}

.mono {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.page-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}

.filter-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.5rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--color-slate-200);
}

.filter-bar > .field {
	width: auto;
	min-width: 12rem;
}

.spinner {
	width: 0.875rem;
	height: 0.875rem;
	border-radius: 9999px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	animation: spin 0.7s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

.skeleton {
	border-radius: 0.375rem;
	background: linear-gradient(90deg, var(--color-slate-100) 25%, var(--color-slate-200) 50%, var(--color-slate-100) 75%);
	background-size: 200% 100%;
	animation: shimmer 1.4s ease-in-out infinite;
}

.skeleton-line {
	height: 0.875rem;
}

@keyframes shimmer {
	from {
		background-position: 200% 0;
	}
	to {
		background-position: -200% 0;
	}
}

.modal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 20;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 1.5rem;
	overflow-y: auto;
	background: rgb(0 0 0 / 0.45);
}

.modal {
	width: 100%;
	max-width: 56rem;
}

summary.flex {
	list-style: none;
}

summary.flex::-webkit-details-marker {
	display: none;
}

.chevron {
	display: inline-block;
	transition: transform 0.15s;
}

details[open] > summary .chevron {
	transform: rotate(90deg);
}

.btn {
	position: relative;
	--spinner-color: var(--color-slate-700);
}

.btn-primary {
	--spinner-color: var(--color-white);
}

.btn-danger {
	--spinner-color: var(--color-red-700);
}

.btn > .spinner {
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -0.4375rem 0 0 -0.4375rem;
	border-color: var(--spinner-color);
	border-right-color: transparent;
}

.btn:has(> .spinner:not([style*="display: none"])) {
	color: transparent;
}