@import url("./checkboxes.11ed71194ac1.css");

@font-face {
    font-family: "Geist";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("fonts/geist/Geist-Variable.a369fcf5628e.woff2") format("woff2");
}

:root {
    color-scheme: light;
    font-family: "Geist", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-synthesis: none;
    --background: #fafafa;
    --surface: #ffffff;
    --surface-soft: var(--background);
    --control-background: var(--surface);
    --control-border: #d9dfe6;
    --control-hover: #f7faff;
    --control-border-hover: #aebdd0;
    --header: #ffffff;
    --foreground: #111111;
    --reading: #1f1f1f;
    --muted: #444444;
    --subtle: #555555;
    --border: #c9c9c9;
    --border-soft: #dedede;
    --border-strong: #949494;
    --accent: #2455f5;
    --accent-hover: #1746de;
    --accent-soft: #edf1ff;
    --aqua: #0e7490;
    --aqua-soft: #edf8fa;
    --information-background: #edf8fa;
    --information-foreground: #0e7490;
    --information-border: #b7dce5;
    --success-background: #ecfdf5;
    --success-foreground: #166534;
    --success-border: #bbdfca;
    --warning-border: #e5d2ab;
    --danger-background: #fff1f2;
    --danger-foreground: #991b1b;
    --danger-border: #e9c6ca;
    --danger-action: #b91c1c;
    --danger-action-hover: #991b1b;
    --danger-action-foreground: #ffffff;
    --warning: #854d0e;
    --warning-soft: #fff7e8;
    --focus: #0e7490;
    --button-primary: #171717;
    --button-primary-hover: #303030;
    --button-primary-foreground: #fafafa;
    --code-background: #171717;
    --code-foreground: #f2f2f2;
    --code-border: #404040;
    --code-scrollbar: #737373;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.035);
    --shadow-floating: 0 8px 28px rgb(0 0 0 / 10%);
}

:root.dark {
    color-scheme: dark;
    --background: #0a0a0a;
    --surface: #141414;
    --surface-soft: #1c1c1c;
    --header: #101010;
    --foreground: #fafafa;
    --reading: #ededed;
    --muted: #c7c7c7;
    --subtle: #b0b0b0;
    --border: #424242;
    --border-soft: #2c2c2c;
    --border-strong: #686868;
    --accent: #8ba4ff;
    --accent-hover: #a8baff;
    --accent-soft: #151b30;
    --aqua: #67c6d4;
    --aqua-soft: #102427;
    --information-background: #102427;
    --information-foreground: #67c6d4;
    --information-border: #285155;
    --success-background: #11251a;
    --success-foreground: #86efac;
    --success-border: #315342;
    --warning-border: #654b24;
    --danger-background: #2b1417;
    --danger-foreground: #fca5a5;
    --danger-border: #6d333b;
    --danger-action: #fca5a5;
    --danger-action-hover: #fecaca;
    --danger-action-foreground: #450a0a;
    --warning: #f0c57a;
    --warning-soft: #291f12;
    --focus: #67c6d4;
    --button-primary: #f4f4f4;
    --button-primary-hover: #dedede;
    --button-primary-foreground: #111111;
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 8px 24px rgba(0, 0, 0, 0.06);
    --shadow-floating: 0 14px 36px rgb(0 0 0 / 38%);
}

html, body, #app { min-height: 100%; }
body { margin: 0; background: var(--background); color: var(--foreground); }
input::placeholder, textarea::placeholder { color: var(--subtle); opacity: 1; }
.cui-logo { display: block; width: 2.25rem; height: 1.5rem; object-fit: contain; flex-shrink: 0; }
.cui-bg-primary { background-color: var(--background); }
.cui-bg-secondary { background-color: var(--surface); }
.cui-bg-soft { background-color: var(--surface-soft); }
.cui-bg-header { background-color: var(--header); }
.cui-bg-accent { background-color: var(--button-primary); }
.cui-bg-selection { background-color: var(--accent-soft); }
.cui-bg-line { background-color: var(--border); }
.cui-bg-line-soft { background-color: var(--border-soft); }
.cui-text-primary { color: var(--foreground); }
.cui-text-secondary { color: var(--reading); }
.cui-text-muted { color: var(--muted); }
.cui-text-subtle { color: var(--subtle); }
.cui-text-on-accent { color: var(--button-primary-foreground); }
.cui-text-link { color: var(--accent); }
.cui-border-primary { border-color: var(--border); }
.cui-border-secondary { border-color: var(--border-strong); }
.cui-border-soft { border-color: var(--border-soft); }
.cui-border-accent { border-color: var(--button-primary); }
.cui-border-link { border-color: var(--accent); }
.cui-bg-information { background-color: var(--information-background); }
.cui-text-information { color: var(--information-foreground); }
.cui-border-information { border-color: var(--information-border); }
.cui-bg-success { background-color: var(--success-background); }
.cui-text-success { color: var(--success-foreground); }
.cui-border-success { border-color: var(--success-border); }
.cui-bg-warning { background-color: var(--warning-soft); }
.cui-text-warning { color: var(--warning); }
.cui-border-warning { border-color: var(--warning-border); }
.cui-bg-danger { background-color: var(--danger-background); }
.cui-text-danger { color: var(--danger-foreground); }
.cui-border-danger { border-color: var(--danger-border); }
.cui-bg-hover:hover { background-color: var(--surface-soft); }
.cui-bg-accent-hover:hover { background-color: var(--button-primary-hover); }
.cui-border-hover:hover { border-color: var(--focus); }
.cui-focus { transition: color 200ms ease-out, background-color 200ms ease-out, border-color 200ms ease-out, box-shadow 200ms ease-out; }
.cui-focus:focus-visible { outline: none; box-shadow: 0 0 0 1px var(--focus); }
.cui-placeholder::placeholder { color: var(--subtle); opacity: 1; }
.cui-button-primary { background: var(--button-primary); border-color: var(--button-primary); color: var(--button-primary-foreground); }
.cui-button-primary:hover:not(:disabled) { background: var(--button-primary-hover); border-color: var(--button-primary-hover); color: var(--button-primary-foreground); }
.cui-button-danger { background: var(--danger-action); border-color: var(--danger-action); color: var(--danger-action-foreground); }
.cui-button-danger:hover:not(:disabled) { background: var(--danger-action-hover); border-color: var(--danger-action-hover); }
.cui-icon-primary { fill: color-mix(in srgb, var(--accent) 20%, transparent); stroke: var(--accent); }
.cui-icon-secondary { fill: color-mix(in srgb, var(--aqua) 25%, transparent); stroke: var(--aqua); }
.cui-stroke-primary { stroke: var(--accent); }
.cui-stroke-secondary { stroke: var(--aqua); }
.cui-sr-only { border: 0; clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; }

.cui-loading-shell, .cui-loading-shell * { box-sizing: border-box; }
.cui-loading-shell { display: flex; align-items: center; justify-content: center; min-height: 100vh; min-height: 100dvh; padding: 1.5rem; background: var(--background); color: var(--muted); }
.cui-loader { display: grid; place-items: center; gap: 1rem; color: var(--muted); font-size: 0.8rem; }
.cui-loader-spinner { display: block; width: 4.5rem; height: 4.5rem; overflow: visible; }
.cui-loader-accent, .cui-loader-ring { fill: none; stroke-linecap: round; stroke-width: 3; transform-box: view-box; transform-origin: center; }
.cui-loader-accent { stroke: #67c6d4; stroke-dasharray: 34 35; stroke-dashoffset: 8; animation: cui-loader-spin 900ms linear infinite; }
.cui-loader-ring { stroke: var(--accent); stroke-dasharray: 96 20; animation: cui-loader-spin 1.25s linear infinite reverse; }
@keyframes cui-loader-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .cui-focus { transition: none; }
    .cui-loader-accent, .cui-loader-ring { animation: none; }
}

.cui-bg-information-hover:hover { background-color: var(--information-background); }
.cui-text-danger-hover:hover { color: var(--danger-foreground); }
.cui-bg-danger-hover:hover { background-color: var(--danger-background); }
.cui-text-information-hover:hover { color: var(--information-foreground); }
.cui-text-information-focus-visible:focus-visible { color: var(--information-foreground); }
.cui-shadow-floating { box-shadow: var(--shadow-floating); }
.cui-bg-information-focus-visible:focus-visible { background-color: var(--information-background); }
.cui-border-warning-hover:hover { border-color: var(--warning-border); }
.cui-backdrop { background: rgb(0 0 0 / 35%); }
:root.dark .cui-backdrop { background: rgb(0 0 0 / 60%); }
.cui-fill-secondary-30 { fill: color-mix(in srgb, var(--aqua) 30%, transparent); }
.cui-fill-primary-18 { fill: color-mix(in srgb, var(--accent) 18%, transparent); }
.cui-fill-primary-28 { fill: color-mix(in srgb, var(--accent) 28%, transparent); }
.cui-fill-primary-20 { fill: color-mix(in srgb, var(--accent) 20%, transparent); }
.cui-fill-secondary-25 { fill: color-mix(in srgb, var(--aqua) 25%, transparent); }
.cui-fill-primary-25 { fill: color-mix(in srgb, var(--accent) 25%, transparent); }
.cui-ring-focus-hover:hover { --tw-ring-color: var(--focus); }
.cui-bg-secondary-hover:hover { background-color: var(--surface); }
.cui-bg-secondary-focus:focus { background-color: var(--surface); }
.cui-scrollbar { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
.cui-scrollbar::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; }
.cui-scrollbar::-webkit-scrollbar-corner, .cui-scrollbar::-webkit-scrollbar-track { background: transparent; }
.cui-scrollbar::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background-color: var(--border-strong); background-clip: padding-box; transition: background-color 200ms ease; }
.cui-scrollbar::-webkit-scrollbar-thumb:hover { background-color: var(--muted); }
.cui-border-information-hover:hover { border-color: var(--information-border); }
.cui-border-information-focus:focus { border-color: var(--information-border); }
.cui-border-danger-hover:hover { border-color: var(--danger-border); }
.cui-bg-soft-hover:hover { background-color: var(--surface-soft); }
.cui-text-link-hover:hover { color: var(--accent); }
.cui-bg-soft-focus-within:focus-within { background-color: var(--surface-soft); }
.cui-text-on-accent-muted { color: color-mix(in srgb, var(--button-primary-foreground) 80%, var(--button-primary)); }
.cui-border-on-accent { border-color: color-mix(in srgb, var(--button-primary-foreground) 25%, var(--button-primary)); }
.cui-divide > :not(:last-child) { border-color: var(--border-soft); }
.cui-accent-glow { background: radial-gradient(circle at top, color-mix(in srgb, var(--aqua) 12%, transparent), transparent 70%); }

/* Light controls use an outline so filled gray blocks do not dominate the page. */
:root:not(.dark) :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea, [role="combobox"]) {
    background-color: var(--control-background);
    border: 1px solid var(--control-border);
    color: var(--foreground);
    box-shadow: none;
}
:root:not(.dark) :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea, [role="combobox"]):where(:not(:disabled, [aria-disabled="true"])):hover {
    background-color: var(--control-hover);
    border-color: var(--control-border-hover);
}
:root:not(.dark) :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea, [role="combobox"]):focus-visible {
    background-color: var(--control-background);
    border-color: var(--focus);
    outline: none;
    box-shadow: 0 0 0 1px var(--focus);
}
:root:not(.dark) :is(input:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="file"], [type="hidden"], [type="button"], [type="submit"], [type="reset"], [type="image"]), select, textarea, [role="combobox"]):is(.invalid, [aria-invalid="true"]) {
    border-color: var(--danger-foreground);
}