:root {
  --background: #ffffff;
  --foreground: #202020;
  --card: #ffffff;
  --card-foreground: #202020;
  --primary: #202020;
  --primary-foreground: #ffffff;
  --secondary: oklch(0.48 0.12 255);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: #f0f0f0;
  --muted-foreground: #646464;
  --accent: #e8e8e8;
  --accent-foreground: var(--primary);
  --destructive: oklch(0.577 0.245 27.325);
  --border: #d9d9d9;
  --input: #cecece;
  --ring: oklch(0.48 0.12 255);
  --sidebar: #f0f0f0;
  --sidebar-foreground: #202020;
  --sidebar-accent: #e0e0e0;
  --sidebar-accent-foreground: var(--primary);
  --agent-panel: #f6f8fa;
  --agent-panel-block: #eaeef2;
  --popover: #ffffff;
  --popover-foreground: #202020;
  --destructive-foreground: #ffffff;
  --surface: #f9f9f9;
  --surface-foreground: var(--foreground);
  --code: var(--surface);
  --code-foreground: var(--surface-foreground);
  --code-highlight: #f0f0f0;
  --code-number: #646464;
  --selection: #202020;
  --selection-foreground: #ffffff;
  --chart-1: oklch(0.80 0.08 245);
  --chart-2: oklch(0.68 0.12 245);
  --chart-3: oklch(0.58 0.12 245);
  --chart-4: oklch(0.48 0.11 245);
  --chart-5: oklch(0.38 0.09 245);
  --sidebar-primary: var(--primary);
  --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-border: var(--border);
  --sidebar-ring: var(--ring);
  --shadow-pop: 0 8px 24px oklch(0 0 0 / 8%);
  --radius: 1px;
  --radius-sm: calc(var(--radius) * 0.6);
  --radius-md: calc(var(--radius) * 0.8);
  --radius-lg: var(--radius);
  --radius-xl: calc(var(--radius) * 1.4);
  --radius-2xl: calc(var(--radius) * 1.8);
  --radius-3xl: calc(var(--radius) * 2.2);
  --radius-4xl: calc(var(--radius) * 2.6);
  --shadow-2xs: 0 1px rgb(0 0 0 / 0.05);
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --spacing: 0.25rem;
  --gutter: clamp(24px, 14vw, 220px);
  --container-sm: 28rem;
  --container-md: 48rem;
  --container-lg: 72rem;
  --font-sans: 'FK Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'FK Grotesk Mono', ui-monospace, SFMono-Regular, monospace;
  --font-mono-reading: 'JetBrains Mono', 'SF Mono', Menlo, Consolas, ui-monospace, monospace;
  --text-2xs: 0.6875rem;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-xs--line-height: calc(1 / 0.75);
  --text-sm--line-height: calc(1.25 / 0.875);
  --text-base--line-height: calc(1.5 / 1);
  --text-lg--line-height: calc(1.75 / 1.125);
  --text-xl--line-height: calc(1.75 / 1.25);
  --text-2xl--line-height: calc(2 / 1.5);
  --font-heading: var(--font-sans);
  --leading-tight: 1.05;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 600;
  --tracking-tight: -0.03em;
  --tracking-snug: -0.01em;
  --status-to-triage: oklch(0.60 0.16 25);
  --status-backlog: oklch(0.58 0.02 260);
  --status-ready: oklch(0.58 0.12 245);
  --status-in-progress: oklch(0.68 0.13 75);
  --status-in-review: oklch(0.55 0.13 300);
  --status-done: oklch(0.58 0.11 155);
  --badge-ok: oklch(0.58 0.11 155);
  --badge-warn: oklch(0.62 0.10 75);
  --overdue: oklch(0.52 0.19 27);
  --default-transition-duration: 150ms;
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
html.dark {
  color-scheme: dark;
  --background: #111113;
  --foreground: #edeef0;
  --card: #18191b;
  --card-foreground: #edeef0;
  --primary: #edeef0;
  --primary-foreground: #111113;
  --secondary: oklch(0.72 0.12 255);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: #212225;
  --muted-foreground: #b0b4ba;
  --accent: #272a2d;
  --accent-foreground: #edeef0;
  --destructive: oklch(0.704 0.191 22.216);
  --border: #363a3f;
  --input: #43484e;
  --ring: oklch(0.72 0.12 255);
  --sidebar: #18191b;
  --sidebar-foreground: #edeef0;
  --sidebar-accent: #272a2d;
  --sidebar-accent-foreground: #edeef0;
  --agent-panel: #18191b;
  --agent-panel-block: #272a2d;
  --popover: #18191b;
  --popover-foreground: #edeef0;
  --destructive-foreground: #111113;
  --surface: #18191b;
  --code-highlight: #212225;
  --code-number: #b0b4ba;
  --selection: #edeef0;
  --selection-foreground: #111113;
  --chart-1: oklch(0.50 0.10 245);
  --chart-2: oklch(0.60 0.12 245);
  --chart-3: oklch(0.70 0.12 245);
  --chart-4: oklch(0.78 0.10 245);
  --chart-5: oklch(0.86 0.07 245);
  --shadow-pop: 0 8px 24px oklch(0 0 0 / 45%);
  --status-to-triage: oklch(0.70 0.17 25);
  --status-backlog: oklch(0.70 0.02 260);
  --status-ready: oklch(0.70 0.12 245);
  --status-in-progress: oklch(0.78 0.13 75);
  --status-in-review: oklch(0.68 0.14 300);
  --status-done: oklch(0.70 0.12 155);
  --badge-ok: oklch(0.70 0.12 155);
  --badge-warn: oklch(0.76 0.11 75);
  --overdue: oklch(0.72 0.19 27);
}

:root{
    color-scheme: light;
}

html{
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    tab-size: 4;
    -webkit-tap-highlight-color: transparent;
}
[data-slot="button"]{
    box-sizing: border-box;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    margin: 0;
    padding: 0;
    border: 0 solid var(--border);
    border-radius: var(--radius-md);
    background-color: transparent;
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    -moz-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="button"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="button"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="button"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="button"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="button"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="button"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="button"][data-variant="default"]{
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="button"][data-variant="destructive"]{
    background-color: var(--destructive);
    color: #fff;
}

[data-slot="button"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="button"][data-variant="destructive"]{
    background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
}

html.dark [data-slot="button"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="button"][data-variant="outline"]{
    border-width: 1px;
    background-color: var(--background);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
}

[data-slot="button"][data-variant="outline"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
}

html.dark [data-slot="button"][data-variant="outline"]{
    border-color: var(--input);
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

[data-slot="button"][data-variant="secondary"]{
    background-color: var(--secondary);
    color: var(--secondary-foreground);
}

[data-slot="button"][data-variant="link"]{
    color: var(--primary);
    text-underline-offset: 4px;
}

@media (hover: hover){
    [data-slot="button"][data-variant="default"]:hover{
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
    [data-slot="button"][data-variant="destructive"]:hover{
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
    [data-slot="button"][data-variant="outline"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="button"][data-variant="outline"]:hover{
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
    }
    [data-slot="button"][data-variant="secondary"]:hover{
        background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
    }
    [data-slot="button"][data-variant="ghost"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="button"][data-variant="ghost"]:hover{
        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
    }
    [data-slot="button"][data-variant="link"]:hover{
        text-decoration-line: underline;
    }
}

[data-slot="button"][data-size="default"]{
    height: calc(var(--spacing) * 9);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
}

[data-slot="button"][data-size="default"]:has(> svg){
    padding-inline: calc(var(--spacing) * 3);
}

[data-slot="button"][data-size="xs"]{
    height: calc(var(--spacing) * 6);
    gap: calc(var(--spacing) * 1);
    padding-inline: calc(var(--spacing) * 2);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="button"][data-size="xs"]:has(> svg){
    padding-inline: calc(var(--spacing) * 1.5);
}

[data-slot="button"][data-size="sm"]{
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
    border-radius: var(--radius-md);
}

[data-slot="button"][data-size="sm"]:has(> svg){
    padding-inline: calc(var(--spacing) * 2.5);
}

[data-slot="button"][data-size="lg"]{
    height: calc(var(--spacing) * 10);
    padding-inline: calc(var(--spacing) * 6);
    border-radius: var(--radius-md);
}

[data-slot="button"][data-size="lg"]:has(> svg){
    padding-inline: calc(var(--spacing) * 4);
}

[data-slot="button"][data-size="icon"]{
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
}

[data-slot="button"][data-size="icon-xs"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="button"][data-size="icon-sm"]{
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
}

[data-slot="button"][data-size="icon-lg"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}

[data-slot="button"][data-size="icon-xs"]{
    border-radius: var(--radius-md);
}

[data-slot="button"][data-size="xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="button"][data-size="icon-xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}
[data-slot="table-container"]{
    position: relative;
    width: 100%;
    overflow-x: auto;
}

[data-slot="table"]{
    width: 100%;
    caption-side: bottom;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    border-collapse: collapse;
}

[data-slot="table-header"] tr{
    border-bottom: 1px solid var(--border);
}

[data-slot="table-body"] tr:last-child{
    border: 0;
}

[data-slot="table-footer"]{
    border-top: 1px solid var(--border);
    background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    font-weight: var(--font-weight-medium);
}

[data-slot="table-footer"] > tr:last-child{
    border-bottom-width: 0;
}

[data-slot="table-row"]{
    border-bottom: 1px solid var(--border);
    -moz-transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    -o-transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    -webkit-transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    -ms-transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke;
    -moz-transition-duration: var(--default-transition-duration);
    -o-transition-duration: var(--default-transition-duration);
    -webkit-transition-duration: var(--default-transition-duration);
    -ms-transition-duration: var(--default-transition-duration);
    transition-duration: var(--default-transition-duration);
    -moz-transition-timing-function: var(--default-transition-timing-function);
    -o-transition-timing-function: var(--default-transition-timing-function);
    -webkit-transition-timing-function: var(--default-transition-timing-function);
    -ms-transition-timing-function: var(--default-transition-timing-function);
    transition-timing-function: var(--default-transition-timing-function);
}

[data-slot="table-row"]:has([aria-expanded="true"]){
    background-color: color-mix(in oklab, var(--muted) 50%, transparent);
}

[data-slot="table-row"][data-state="selected"]{
    background-color: var(--muted);
}

@media (hover: hover){
    [data-slot="table-row"]:hover{
        background-color: color-mix(in oklab, var(--muted) 50%, transparent);
    }
}

[data-slot="table-head"]{
    height: calc(var(--spacing) * 10);
    padding-inline: calc(var(--spacing) * 2);
    text-align: left;
    vertical-align: middle;
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
}

[data-slot="table-head"]:has([role="checkbox"]){
    padding-right: 0;
}

[data-slot="table-head"] > [role="checkbox"]{
    translate: 0 2px;
}

[data-slot="table-cell"]{
    padding: calc(var(--spacing) * 2);
    vertical-align: middle;
    white-space: nowrap;
}

[data-slot="table-cell"]:has([role="checkbox"]){
    padding-right: 0;
}

[data-slot="table-cell"] > [role="checkbox"]{
    translate: 0 2px;
}

[data-slot="table-caption"]{
    margin-top: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}
[data-slot="input"]{
    box-sizing: border-box;
    height: calc(var(--spacing) * 9);
    width: 100%;
    min-width: 0;
    margin: 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--input);
    background-color: transparent;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1);
    font: inherit;
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
    color: inherit;
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="input"]::selection{
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="input"]::file-selector-button{
    display: inline-flex;
    height: calc(var(--spacing) * 7);
    border: 0;
    background-color: transparent;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
}

[data-slot="input"]::placeholder{
    color: var(--muted-foreground);
}

[data-slot="input"]:disabled{
    pointer-events: none;
    cursor: not-allowed;
    opacity: 50%;
}

@media (min-width: 768px){
    [data-slot="input"]{
        font-size: var(--text-sm);
        line-height: var(--text-sm--line-height);
    }
}

html.dark [data-slot="input"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

[data-slot="input"]:focus-visible{
    border-color: var(--muted-foreground);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
}

[data-slot="input"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent), var(--shadow-xs);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent), var(--shadow-xs);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent), var(--shadow-xs);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent), var(--shadow-xs);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent), var(--shadow-xs);
}

html.dark [data-slot="input"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent), var(--shadow-xs);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent), var(--shadow-xs);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent), var(--shadow-xs);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent), var(--shadow-xs);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent), var(--shadow-xs);
}
[data-slot="separator"]{
    flex-shrink: 0;
    background-color: var(--border);
}

[data-slot="separator"][data-orientation="horizontal"]{
    height: 1px;
    width: 100%;
}

[data-slot="separator"][data-orientation="vertical"]{
    height: 100%;
    width: 1px;
}
@keyframes shadcn-pulse{
    50%{
        opacity: 0.5;
    }
}

[data-slot="skeleton"]{
    animation: shadcn-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    border-radius: var(--radius-md);
    background-color: var(--accent);
}
[data-slot="badge"]{
    box-sizing: border-box;
    display: inline-flex;
    width: fit-content;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 1);
    overflow: hidden;
    border-radius: 9999px;
    border: 1px solid transparent;
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 0.5);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    text-decoration: none;
    outline: none;
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="badge"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="badge"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="badge"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="badge"] > svg{
    pointer-events: none;
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="badge"][data-variant="default"]{
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="badge"][data-variant="secondary"]{
    background-color: var(--secondary);
    color: var(--secondary-foreground);
}

[data-slot="badge"][data-variant="destructive"]{
    background-color: var(--destructive);
    color: #fff;
}

[data-slot="badge"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="badge"][data-variant="destructive"]{
    background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
}

html.dark [data-slot="badge"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="badge"][data-variant="outline"]{
    border-color: var(--border);
    color: var(--foreground);
}

[data-slot="badge"][data-variant="ghost"]{
    background-color: transparent;
}

[data-slot="badge"][data-variant="link"]{
    color: var(--primary);
    text-underline-offset: 4px;
}

@media (hover: hover){
    a[data-slot="badge"][data-variant="default"]:hover{
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
    a[data-slot="badge"][data-variant="secondary"]:hover{
        background-color: color-mix(in oklab, var(--secondary) 90%, transparent);
    }
    a[data-slot="badge"][data-variant="destructive"]:hover{
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
    a[data-slot="badge"][data-variant="outline"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    a[data-slot="badge"][data-variant="ghost"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    a[data-slot="badge"][data-variant="link"]:hover{
        text-decoration-line: underline;
    }
}
[data-slot="avatar"]{
    position: relative;
    display: flex;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 9999px;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-slot="avatar"][data-size="default"]{
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
}

[data-slot="avatar"][data-size="sm"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="avatar"][data-size="lg"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}

[data-slot="avatar-image"]{
    aspect-ratio: 1 / 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

[data-slot="avatar-image"]:not([data-state="loaded"]){
    display: none;
}

[data-slot="avatar-fallback"]{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background-color: var(--muted);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}

[data-slot="avatar"]:has([data-slot="avatar-image"][data-state="loaded"]) [data-slot="avatar-fallback"]{
    display: none;
}

[data-slot="avatar"][data-size="sm"] [data-slot="avatar-fallback"]{
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="avatar-badge"]{
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 10;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background-color: var(--primary);
    color: var(--primary-foreground);
    -moz-box-shadow: 0 0 0 2px var(--background);
    -o-box-shadow: 0 0 0 2px var(--background);
    -webkit-box-shadow: 0 0 0 2px var(--background);
    -ms-box-shadow: 0 0 0 2px var(--background);
    box-shadow: 0 0 0 2px var(--background);
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-slot="avatar"][data-size="sm"] [data-slot="avatar-badge"]{
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
}

[data-slot="avatar"][data-size="default"] [data-slot="avatar-badge"]{
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
}

[data-slot="avatar"][data-size="lg"] [data-slot="avatar-badge"]{
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="avatar"][data-size="sm"] [data-slot="avatar-badge"] > svg{
    display: none;
}

[data-slot="avatar"][data-size="default"] [data-slot="avatar-badge"] > svg{
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
}

[data-slot="avatar"][data-size="lg"] [data-slot="avatar-badge"] > svg{
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
}

[data-slot="avatar-group"]{
    display: flex;
}

[data-slot="avatar-group"] > :not(:last-child){
    margin-inline-end: calc(var(--spacing) * -2);
}

[data-slot="avatar-group"] > [data-slot="avatar"]{
    -moz-box-shadow: 0 0 0 2px var(--background);
    -o-box-shadow: 0 0 0 2px var(--background);
    -webkit-box-shadow: 0 0 0 2px var(--background);
    -ms-box-shadow: 0 0 0 2px var(--background);
    box-shadow: 0 0 0 2px var(--background);
}

[data-slot="avatar-group-count"]{
    position: relative;
    display: flex;
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background-color: var(--muted);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
    -moz-box-shadow: 0 0 0 2px var(--background);
    -o-box-shadow: 0 0 0 2px var(--background);
    -webkit-box-shadow: 0 0 0 2px var(--background);
    -ms-box-shadow: 0 0 0 2px var(--background);
    box-shadow: 0 0 0 2px var(--background);
}

[data-slot="avatar-group-count"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="avatar-group"]:has([data-size="lg"]) [data-slot="avatar-group-count"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}

[data-slot="avatar-group"]:has([data-size="lg"]) [data-slot="avatar-group-count"] > svg{
    width: calc(var(--spacing) * 5);
    height: calc(var(--spacing) * 5);
}

[data-slot="avatar-group"]:has([data-size="sm"]) [data-slot="avatar-group-count"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="avatar-group"]:has([data-size="sm"]) [data-slot="avatar-group-count"] > svg{
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}
[data-slot="empty"]{
    box-sizing: border-box;
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 6);
    border-radius: var(--radius-lg);
    border-style: dashed;
    padding: calc(var(--spacing) * 6);
    text-align: center;
    text-wrap: balance;
}

@media (min-width: 768px){
    [data-slot="empty"]{
        padding: calc(var(--spacing) * 12);
    }
}

[data-slot="empty-header"]{
    display: flex;
    max-width: var(--container-sm);
    flex-direction: column;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    text-align: center;
}

[data-slot="empty-icon"]{
    margin-bottom: calc(var(--spacing) * 2);
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
}

[data-slot="empty-icon"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="empty-icon"][data-variant="default"]{
    background-color: transparent;
}

[data-slot="empty-icon"][data-variant="icon"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
    border-radius: var(--radius-lg);
    background-color: var(--muted);
    color: var(--foreground);
}

[data-slot="empty-icon"][data-variant="icon"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="empty-title"]{
    font-size: var(--text-lg);
    line-height: var(--text-lg--line-height);
    font-weight: var(--font-weight-medium);
    letter-spacing: var(--tracking-tight);
}

[data-slot="empty-description"]{
    font-size: var(--text-sm);
    line-height: 1.625;
    color: var(--muted-foreground);
}

[data-slot="empty-description"] > a{
    text-decoration-line: underline;
    text-underline-offset: 4px;
}

[data-slot="empty-description"] > a:hover{
    color: var(--primary);
}

[data-slot="empty-content"]{
    display: flex;
    width: 100%;
    max-width: var(--container-sm);
    min-width: 0;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    text-wrap: balance;
}
[data-slot="checkbox"]{
    box-sizing: border-box;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    border-radius: 4px;
    border: 1px solid var(--input);
    background-color: transparent;
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    font: inherit;
    color: inherit;
    cursor: pointer;
    -moz-transition: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="checkbox"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="checkbox"]:disabled{
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="checkbox"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="checkbox"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="checkbox"][data-state="checked"]{
    border-color: var(--primary);
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="checkbox"][data-state="indeterminate"]{
    border-color: var(--primary);
    background-color: var(--primary);
    color: var(--primary-foreground);
}

html.dark [data-slot="checkbox"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

html.dark [data-slot="checkbox"][data-state="checked"]{
    background-color: var(--primary);
}

[data-slot="checkbox"] + input[type="checkbox"]{
    position: absolute;
    pointer-events: none;
    opacity: 0;
    margin: 0;
    width: 1px;
    height: 1px;
    -moz-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
}

[data-slot="checkbox-indicator"]{
    display: grid;
    place-content: center;
    color: currentcolor;
    -moz-transition: none;
    -o-transition: none;
    -webkit-transition: none;
    -ms-transition: none;
    transition: none;
}

[data-slot="checkbox"][data-state="unchecked"] [data-slot="checkbox-indicator"]{
    display: none;
}

[data-slot="checkbox-indicator"] svg{
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
}
[data-slot="radio-group"]{
    display: grid;
    gap: calc(var(--spacing) * 3);
}

[data-slot="radio-group-item"]{
    box-sizing: border-box;
    position: relative;
    aspect-ratio: 1 / 1;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    border-radius: calc(infinity * 1px);
    border: 1px solid var(--input);
    background-color: transparent;
    color: var(--primary);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    font: inherit;
    cursor: pointer;
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="radio-group-item"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="radio-group-item"]:disabled{
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="radio-group-item"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="radio-group-item"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

html.dark [data-slot="radio-group-item"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="radio-group-item"] + input[type="radio"]{
    position: absolute;
    pointer-events: none;
    opacity: 0;
    margin: 0;
    width: 1px;
    height: 1px;
    -moz-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
}

[data-slot="radio-group-indicator"]{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-slot="radio-group-item"][data-state="unchecked"] [data-slot="radio-group-indicator"]{
    display: none;
}

[data-slot="radio-group-indicator"] svg{
    position: absolute;
    top: 50%;
    left: 50%;
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    fill: var(--primary);
}
[data-slot="field-set"]{
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 6);
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

[data-slot="field-set"]:has(> [data-slot="checkbox-group"]){
    gap: calc(var(--spacing) * 3);
}

[data-slot="field-set"]:has(> [data-slot="radio-group"]){
    gap: calc(var(--spacing) * 3);
}

[data-slot="field-legend"]{
    margin-bottom: calc(var(--spacing) * 3);
    padding: 0;
    font-weight: var(--font-weight-medium);
}

[data-slot="field-legend"][data-variant="legend"]{
    font-size: var(--text-base);
    line-height: var(--text-base--line-height);
}

[data-slot="field-legend"][data-variant="label"]{
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="field-group"]{
    container: field-group / inline-size;
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: calc(var(--spacing) * 7);
}

[data-slot="field-group"] > [data-slot="field-group"]{
    gap: calc(var(--spacing) * 4);
}

[data-slot="field"]{
    display: flex;
    width: 100%;
    gap: calc(var(--spacing) * 3);
}

[data-slot="field"][data-invalid="true"]{
    color: var(--destructive);
}

[data-slot="field"][data-orientation="vertical"]{
    flex-direction: column;
}

[data-slot="field"][data-orientation="vertical"] > *{
    width: 100%;
}

[data-slot="field"][data-orientation="vertical"] > .sr-only{
    width: auto;
}

[data-slot="field"][data-orientation="horizontal"]{
    flex-direction: row;
    align-items: center;
}

[data-slot="field"][data-orientation="horizontal"] > [data-slot="field-label"]{
    flex: auto;
}

[data-slot="field"][data-orientation="horizontal"]:has(> [data-slot="field-content"]){
    align-items: flex-start;
}

[data-slot="field"][data-orientation="horizontal"]:has(> [data-slot="field-content"]) > [role="checkbox"]{
    margin-top: 1px;
}

[data-slot="field"][data-orientation="horizontal"]:has(> [data-slot="field-content"]) [role="radio"]{
    margin-top: 1px;
}

[data-slot="field"][data-orientation="responsive"]{
    flex-direction: column;
}

[data-slot="field"][data-orientation="responsive"] > *{
    width: 100%;
}

[data-slot="field"][data-orientation="responsive"] > .sr-only{
    width: auto;
}

@container field-group (min-width: 28rem){
    [data-slot="field"][data-orientation="responsive"]{
        flex-direction: row;
        align-items: center;
    }
    [data-slot="field"][data-orientation="responsive"] > *{
        width: auto;
    }
    [data-slot="field"][data-orientation="responsive"] > [data-slot="field-label"]{
        flex: auto;
    }
    [data-slot="field"][data-orientation="responsive"]:has(> [data-slot="field-content"]){
        align-items: flex-start;
    }
    [data-slot="field"][data-orientation="responsive"]:has(> [data-slot="field-content"]) > [role="checkbox"]{
        margin-top: 1px;
    }
    [data-slot="field"][data-orientation="responsive"]:has(> [data-slot="field-content"]) [role="radio"]{
        margin-top: 1px;
    }
}

[data-slot="field-content"]{
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: calc(var(--spacing) * 1.5);
    line-height: var(--leading-snug);
}

[data-slot="field-label"]{
    display: flex;
    width: fit-content;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--leading-snug);
    font-weight: var(--font-weight-medium);
    -webkit-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-disabled="true"] [data-slot="field-label"]{
    pointer-events: none;
    opacity: 50%;
}

:disabled ~ [data-slot="field-label"]{
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="field"][data-disabled="true"] [data-slot="field-label"]{
    opacity: 50%;
}

[data-slot="field-label"]:has(> [data-slot="field"]){
    width: 100%;
    flex-direction: column;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
}

[data-slot="field-label"] > [data-slot="field"]{
    padding: calc(var(--spacing) * 4);
}

[data-slot="field-label"]:has([data-state="checked"]){
    border-color: var(--primary);
    background-color: color-mix(in oklab, var(--primary) 5%, transparent);
}

html.dark [data-slot="field-label"]:has([data-state="checked"]){
    background-color: color-mix(in oklab, var(--primary) 10%, transparent);
}

[data-slot="field-description"]{
    margin: 0;
    font-size: var(--text-sm);
    line-height: var(--leading-normal);
    font-weight: var(--font-weight-normal);
    color: var(--muted-foreground);
}

[data-slot="field"]:has([data-orientation="horizontal"]) [data-slot="field-description"]{
    text-wrap: balance;
}

[data-slot="field-description"]:last-child{
    margin-top: 0;
}

[data-slot="field-description"]:nth-last-child(2){
    margin-top: calc(var(--spacing) * -1);
}

[data-variant="legend"] + [data-slot="field-description"]{
    margin-top: calc(var(--spacing) * -1.5);
}

[data-slot="field-description"] > a{
    text-decoration-line: underline;
    text-underline-offset: 4px;
}

[data-slot="field-description"] > a:hover{
    color: var(--primary);
}

[data-slot="field-separator"]{
    position: relative;
    margin-block: calc(var(--spacing) * -2);
    height: calc(var(--spacing) * 5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="field-group"][data-variant="outline"] [data-slot="field-separator"]{
    margin-bottom: calc(var(--spacing) * -2);
}

[data-slot="field-separator"] > [data-slot="separator"]{
    position: absolute;
    inset: 0;
    top: 50%;
}

[data-slot="field-separator-content"]{
    position: relative;
    display: block;
    width: fit-content;
    margin-inline: auto;
    padding-inline: calc(var(--spacing) * 2);
    background-color: var(--background);
    color: var(--muted-foreground);
}

[data-slot="field-error"]{
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-normal);
    color: var(--destructive);
}

[data-slot="field-error"] > ul{
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 1);
    margin: 0;
    margin-left: calc(var(--spacing) * 4);
    padding: 0;
    list-style-type: disc;
}
[data-slot="form"]{
    display: flex;
    margin: 0;
}

[data-slot="form"][data-layout="stack"]{
    flex-direction: column;
    gap: .5rem;
}

[data-slot="form"][data-layout="stack-wide"]{
    flex-direction: column;
    gap: 1rem;
}

[data-slot="form"][data-layout="row"]{
    gap: .5rem;
}

[data-slot="form"][data-layout="row-baseline"]{
    align-items: flex-end;
    gap: .5rem;
}

[data-slot="form-row"]{
    display: flex;
    gap: .5rem;
}

[data-slot="form-row"] > [data-slot="kit-field"], [data-slot="form"][data-layout="row"] > [data-slot="kit-field"], [data-slot="form"][data-layout="row-baseline"] > [data-slot="kit-field"]{
    flex: 1;
    min-width: 0;
}

[data-slot="form-actions"]{
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
}
@keyframes shadcn-backdrop-in{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

@keyframes shadcn-dialog-in{
    from{
        opacity: 0;
        -moz-transform: scale(0.95);
        -o-transform: scale(0.95);
        -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
    }
    to{
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes shadcn-dialog-out{
    from{
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
    to{
        opacity: 0;
        -moz-transform: scale(0.95);
        -o-transform: scale(0.95);
        -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
    }
}

[data-slot="dialog-overlay"]{
    display: none;
}

[data-slot="dialog-content"]::backdrop{
    background-color: rgb(0 0 0 / 0.5);
}

[data-slot="dialog-content"][open]::backdrop{
    animation: shadcn-backdrop-in 150ms ease;
}

[data-slot="dialog-content"]{
    white-space: normal;
    text-align: start;
    font-size: var(--text-base);
    font-weight: var(--font-weight-normal);
    font-style: normal;
    line-height: var(--leading-normal);
    letter-spacing: normal;
    text-transform: none;
    cursor: auto;
}

[data-slot="dialog-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    z-index: 50;
    width: 100%;
    max-width: calc(100% - 2rem);
    max-height: calc(100% - 2rem);
    margin: auto;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    background-color: var(--background);
    padding: calc(var(--spacing) * 6);
    color: var(--foreground);
    -moz-box-shadow: var(--shadow-lg);
    -o-box-shadow: var(--shadow-lg);
    -webkit-box-shadow: var(--shadow-lg);
    -ms-box-shadow: var(--shadow-lg);
    box-shadow: var(--shadow-lg);
    outline: none;
}

[data-slot="dialog-content"][open]{
    display: grid;
}

[data-slot="dialog-content"][data-state="open"]{
    animation: shadcn-dialog-in 200ms ease;
}

[data-slot="dialog-content"][data-state="closed"]{
    animation: shadcn-dialog-out 200ms ease;
}

@media (min-width: 640px){
    [data-slot="dialog-content"]{
        max-width: 32rem;
    }
}

[data-slot="dialog-content"] > [data-slot="dialog-close"]{
    box-sizing: border-box;
    position: absolute;
    top: calc(var(--spacing) * 4);
    right: calc(var(--spacing) * 4);
    display: inline-flex;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background-color: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
    opacity: 0.7;
    -moz-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="dialog-content"] > [data-slot="dialog-close"]:focus{
    outline: none;
    -moz-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -o-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -webkit-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -ms-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
}

[data-slot="dialog-content"] > [data-slot="dialog-close"]:disabled{
    pointer-events: none;
}

[data-slot="dialog-content"] > [data-slot="dialog-close"][data-state="open"]{
    background-color: var(--accent);
    color: var(--muted-foreground);
}

[data-slot="dialog-content"] > [data-slot="dialog-close"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="dialog-content"] > [data-slot="dialog-close"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dialog-content"] > [data-slot="dialog-close"] .sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

@media (hover: hover){
    [data-slot="dialog-content"] > [data-slot="dialog-close"]:hover{
        opacity: 1;
    }
}

[data-slot="dialog-header"]{
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    text-align: center;
}

[data-slot="dialog-footer"]{
    display: flex;
    flex-direction: column-reverse;
    gap: calc(var(--spacing) * 2);
}

@media (min-width: 640px){
    [data-slot="dialog-header"]{
        text-align: left;
    }
    [data-slot="dialog-footer"]{
        flex-direction: row;
        justify-content: flex-end;
    }
}

[data-slot="dialog-title"]{
    margin: 0;
    font-size: var(--text-lg);
    line-height: 1;
    font-weight: var(--font-weight-semibold);
}

[data-slot="dialog-description"]{
    margin: 0;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}
[data-slot="alert-dialog-overlay"]{
    display: none;
}

[data-slot="alert-dialog-content"]::backdrop{
    background-color: rgb(0 0 0 / 0.5);
}

[data-slot="alert-dialog-content"][open]::backdrop{
    animation: shadcn-backdrop-in 150ms ease;
}

[data-slot="alert-dialog-content"]{
    white-space: normal;
    text-align: start;
    font-size: var(--text-base);
    font-weight: var(--font-weight-normal);
    font-style: normal;
    line-height: var(--leading-normal);
    letter-spacing: normal;
    text-transform: none;
    cursor: auto;
}

[data-slot="alert-dialog-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: 0;
    z-index: 50;
    width: 100%;
    max-width: calc(100% - 2rem);
    max-height: calc(100% - 2rem);
    margin: auto;
    gap: calc(var(--spacing) * 4);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    background-color: var(--background);
    padding: calc(var(--spacing) * 6);
    color: var(--foreground);
    -moz-box-shadow: var(--shadow-lg);
    -o-box-shadow: var(--shadow-lg);
    -webkit-box-shadow: var(--shadow-lg);
    -ms-box-shadow: var(--shadow-lg);
    box-shadow: var(--shadow-lg);
    outline: none;
}

[data-slot="alert-dialog-content"][open]{
    display: grid;
}

[data-slot="alert-dialog-content"][data-state="open"]{
    animation: shadcn-dialog-in 200ms ease;
}

[data-slot="alert-dialog-content"][data-state="closed"]{
    animation: shadcn-dialog-out 200ms ease;
}

[data-slot="alert-dialog-content"][data-size="sm"]{
    max-width: 20rem;
}

@media (min-width: 640px){
    [data-slot="alert-dialog-content"][data-size="default"]{
        max-width: 32rem;
    }
}

[data-slot="alert-dialog-header"]{
    display: grid;
    grid-template-rows: auto 1fr;
    place-items: center;
    gap: calc(var(--spacing) * 1.5);
    text-align: center;
}

[data-slot="alert-dialog-header"]:has([data-slot="alert-dialog-media"]){
    grid-template-rows: auto auto 1fr;
    column-gap: calc(var(--spacing) * 6);
}

[data-slot="alert-dialog-footer"]{
    display: flex;
    flex-direction: column-reverse;
    gap: calc(var(--spacing) * 2);
}

[data-slot="alert-dialog-content"][data-size="sm"] [data-slot="alert-dialog-footer"]{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

[data-slot="alert-dialog-title"]{
    margin: 0;
    font-size: var(--text-lg);
    line-height: var(--text-lg--line-height);
    font-weight: var(--font-weight-semibold);
}

[data-slot="alert-dialog-description"]{
    margin: 0;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}

[data-slot="alert-dialog-media"]{
    box-sizing: border-box;
    margin-bottom: calc(var(--spacing) * 2);
    display: inline-flex;
    width: calc(var(--spacing) * 16);
    height: calc(var(--spacing) * 16);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    background-color: var(--muted);
}

[data-slot="alert-dialog-media"] > svg:not([class*='size-']){
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
}

@media (min-width: 640px){
    [data-slot="alert-dialog-content"][data-size="default"] [data-slot="alert-dialog-header"]{
        place-items: start;
        text-align: left;
    }
    [data-slot="alert-dialog-content"][data-size="default"] [data-slot="alert-dialog-header"]:has([data-slot="alert-dialog-media"]){
        grid-template-rows: auto 1fr;
    }
    [data-slot="alert-dialog-footer"]{
        flex-direction: row;
        justify-content: flex-end;
    }
    [data-slot="alert-dialog-content"][data-size="default"]:has([data-slot="alert-dialog-media"]) [data-slot="alert-dialog-title"]{
        grid-column-start: 2;
    }
    [data-slot="alert-dialog-content"][data-size="default"] [data-slot="alert-dialog-media"]{
        grid-row: span 2 / span 2;
    }
}

[data-slot="alert-dialog-action"]{
    box-sizing: border-box;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    margin: 0;
    padding: 0;
    border: 0 solid var(--border);
    border-radius: var(--radius-md);
    background-color: transparent;
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    -moz-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="alert-dialog-action"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="alert-dialog-action"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="alert-dialog-action"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="alert-dialog-action"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="alert-dialog-action"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="alert-dialog-action"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="alert-dialog-action"][data-variant="default"]{
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="alert-dialog-action"][data-variant="destructive"]{
    background-color: var(--destructive);
    color: #fff;
}

[data-slot="alert-dialog-action"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="alert-dialog-action"][data-variant="destructive"]{
    background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
}

html.dark [data-slot="alert-dialog-action"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="alert-dialog-action"][data-variant="outline"]{
    border-width: 1px;
    background-color: var(--background);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
}

[data-slot="alert-dialog-action"][data-variant="outline"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
}

html.dark [data-slot="alert-dialog-action"][data-variant="outline"]{
    border-color: var(--input);
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

[data-slot="alert-dialog-action"][data-variant="secondary"]{
    background-color: var(--secondary);
    color: var(--secondary-foreground);
}

[data-slot="alert-dialog-action"][data-variant="link"]{
    color: var(--primary);
    text-underline-offset: 4px;
}

@media (hover: hover){
    [data-slot="alert-dialog-action"][data-variant="default"]:hover{
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
    [data-slot="alert-dialog-action"][data-variant="destructive"]:hover{
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
    [data-slot="alert-dialog-action"][data-variant="outline"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="alert-dialog-action"][data-variant="outline"]:hover{
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
    }
    [data-slot="alert-dialog-action"][data-variant="secondary"]:hover{
        background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
    }
    [data-slot="alert-dialog-action"][data-variant="ghost"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="alert-dialog-action"][data-variant="ghost"]:hover{
        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
    }
    [data-slot="alert-dialog-action"][data-variant="link"]:hover{
        text-decoration-line: underline;
    }
}

[data-slot="alert-dialog-action"][data-size="default"]{
    height: calc(var(--spacing) * 9);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
}

[data-slot="alert-dialog-action"][data-size="default"]:has(> svg){
    padding-inline: calc(var(--spacing) * 3);
}

[data-slot="alert-dialog-action"][data-size="xs"]{
    height: calc(var(--spacing) * 6);
    gap: calc(var(--spacing) * 1);
    padding-inline: calc(var(--spacing) * 2);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="alert-dialog-action"][data-size="xs"]:has(> svg){
    padding-inline: calc(var(--spacing) * 1.5);
}

[data-slot="alert-dialog-action"][data-size="sm"]{
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-action"][data-size="sm"]:has(> svg){
    padding-inline: calc(var(--spacing) * 2.5);
}

[data-slot="alert-dialog-action"][data-size="lg"]{
    height: calc(var(--spacing) * 10);
    padding-inline: calc(var(--spacing) * 6);
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-action"][data-size="lg"]:has(> svg){
    padding-inline: calc(var(--spacing) * 4);
}

[data-slot="alert-dialog-action"][data-size="icon"]{
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
}

[data-slot="alert-dialog-action"][data-size="icon-xs"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="alert-dialog-action"][data-size="icon-sm"]{
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
}

[data-slot="alert-dialog-action"][data-size="icon-lg"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}

[data-slot="alert-dialog-action"][data-size="icon-xs"]{
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-action"][data-size="xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="alert-dialog-action"][data-size="icon-xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="alert-dialog-cancel"]{
    box-sizing: border-box;
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    margin: 0;
    padding: 0;
    border: 0 solid var(--border);
    border-radius: var(--radius-md);
    background-color: transparent;
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    -moz-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    transition: all var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="alert-dialog-cancel"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="alert-dialog-cancel"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="alert-dialog-cancel"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="alert-dialog-cancel"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="alert-dialog-cancel"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="alert-dialog-cancel"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="alert-dialog-cancel"][data-variant="default"]{
    background-color: var(--primary);
    color: var(--primary-foreground);
}

[data-slot="alert-dialog-cancel"][data-variant="destructive"]{
    background-color: var(--destructive);
    color: #fff;
}

[data-slot="alert-dialog-cancel"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="alert-dialog-cancel"][data-variant="destructive"]{
    background-color: color-mix(in oklab, var(--destructive) 60%, transparent);
}

html.dark [data-slot="alert-dialog-cancel"][data-variant="destructive"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="alert-dialog-cancel"][data-variant="outline"]{
    border-width: 1px;
    background-color: var(--background);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
}

[data-slot="alert-dialog-cancel"][data-variant="outline"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent), var(--shadow-xs);
}

html.dark [data-slot="alert-dialog-cancel"][data-variant="outline"]{
    border-color: var(--input);
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

[data-slot="alert-dialog-cancel"][data-variant="secondary"]{
    background-color: var(--secondary);
    color: var(--secondary-foreground);
}

[data-slot="alert-dialog-cancel"][data-variant="link"]{
    color: var(--primary);
    text-underline-offset: 4px;
}

@media (hover: hover){
    [data-slot="alert-dialog-cancel"][data-variant="default"]:hover{
        background-color: color-mix(in oklab, var(--primary) 90%, transparent);
    }
    [data-slot="alert-dialog-cancel"][data-variant="destructive"]:hover{
        background-color: color-mix(in oklab, var(--destructive) 90%, transparent);
    }
    [data-slot="alert-dialog-cancel"][data-variant="outline"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="alert-dialog-cancel"][data-variant="outline"]:hover{
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
    }
    [data-slot="alert-dialog-cancel"][data-variant="secondary"]:hover{
        background-color: color-mix(in oklab, var(--secondary) 80%, transparent);
    }
    [data-slot="alert-dialog-cancel"][data-variant="ghost"]:hover{
        background-color: var(--accent);
        color: var(--accent-foreground);
    }
    html.dark [data-slot="alert-dialog-cancel"][data-variant="ghost"]:hover{
        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
    }
    [data-slot="alert-dialog-cancel"][data-variant="link"]:hover{
        text-decoration-line: underline;
    }
}

[data-slot="alert-dialog-cancel"][data-size="default"]{
    height: calc(var(--spacing) * 9);
    padding-inline: calc(var(--spacing) * 4);
    padding-block: calc(var(--spacing) * 2);
}

[data-slot="alert-dialog-cancel"][data-size="default"]:has(> svg){
    padding-inline: calc(var(--spacing) * 3);
}

[data-slot="alert-dialog-cancel"][data-size="xs"]{
    height: calc(var(--spacing) * 6);
    gap: calc(var(--spacing) * 1);
    padding-inline: calc(var(--spacing) * 2);
    border-radius: var(--radius-md);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="alert-dialog-cancel"][data-size="xs"]:has(> svg){
    padding-inline: calc(var(--spacing) * 1.5);
}

[data-slot="alert-dialog-cancel"][data-size="sm"]{
    height: calc(var(--spacing) * 8);
    gap: calc(var(--spacing) * 1.5);
    padding-inline: calc(var(--spacing) * 3);
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-cancel"][data-size="sm"]:has(> svg){
    padding-inline: calc(var(--spacing) * 2.5);
}

[data-slot="alert-dialog-cancel"][data-size="lg"]{
    height: calc(var(--spacing) * 10);
    padding-inline: calc(var(--spacing) * 6);
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-cancel"][data-size="lg"]:has(> svg){
    padding-inline: calc(var(--spacing) * 4);
}

[data-slot="alert-dialog-cancel"][data-size="icon"]{
    width: calc(var(--spacing) * 9);
    height: calc(var(--spacing) * 9);
}

[data-slot="alert-dialog-cancel"][data-size="icon-xs"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="alert-dialog-cancel"][data-size="icon-sm"]{
    width: calc(var(--spacing) * 8);
    height: calc(var(--spacing) * 8);
}

[data-slot="alert-dialog-cancel"][data-size="icon-lg"]{
    width: calc(var(--spacing) * 10);
    height: calc(var(--spacing) * 10);
}

[data-slot="alert-dialog-cancel"][data-size="icon-xs"]{
    border-radius: var(--radius-md);
}

[data-slot="alert-dialog-cancel"][data-size="xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

[data-slot="alert-dialog-cancel"][data-size="icon-xs"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}
@keyframes shadcn-sheet-in-from-right{
    from{
        -moz-transform: translateX(100%);
        -o-transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
    }
    to{
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes shadcn-sheet-out-to-right{
    from{
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
    to{
        -moz-transform: translateX(100%);
        -o-transform: translateX(100%);
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
    }
}

@keyframes shadcn-sheet-in-from-left{
    from{
        -moz-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
    }
    to{
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes shadcn-sheet-out-to-left{
    from{
        -moz-transform: translateX(0);
        -o-transform: translateX(0);
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
    to{
        -moz-transform: translateX(-100%);
        -o-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
    }
}

@keyframes shadcn-sheet-in-from-top{
    from{
        -moz-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    to{
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes shadcn-sheet-out-to-top{
    from{
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    to{
        -moz-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        transform: translateY(-100%);
    }
}

@keyframes shadcn-sheet-in-from-bottom{
    from{
        -moz-transform: translateY(100%);
        -o-transform: translateY(100%);
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
    }
    to{
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes shadcn-sheet-out-to-bottom{
    from{
        -moz-transform: translateY(0);
        -o-transform: translateY(0);
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
    to{
        -moz-transform: translateY(100%);
        -o-transform: translateY(100%);
        -webkit-transform: translateY(100%);
        -ms-transform: translateY(100%);
        transform: translateY(100%);
    }
}

[data-slot="sheet-content"]::backdrop{
    background-color: rgb(0 0 0 / 0.5);
}

[data-slot="sheet-content"][open]::backdrop{
    animation: shadcn-backdrop-in 150ms ease;
}

[data-slot="sheet-content"]{
    white-space: normal;
    text-align: start;
    font-size: var(--text-base);
    font-weight: var(--font-weight-normal);
    font-style: normal;
    line-height: var(--leading-normal);
    letter-spacing: normal;
    text-transform: none;
    cursor: auto;
}

[data-slot="sheet-overlay"]{
    display: none;
}

[data-slot="sheet-content"]{
    box-sizing: border-box;
    position: fixed;
    z-index: 50;
    margin: 0;
    padding: 0;
    border: 0;
    max-width: none;
    max-height: none;
    flex-direction: column;
    gap: calc(var(--spacing) * 4);
    background-color: var(--background);
    color: var(--foreground);
    -moz-box-shadow: var(--shadow-lg);
    -o-box-shadow: var(--shadow-lg);
    -webkit-box-shadow: var(--shadow-lg);
    -ms-box-shadow: var(--shadow-lg);
    box-shadow: var(--shadow-lg);
    -moz-transition: all var(--default-transition-duration) ease-in-out;
    -o-transition: all var(--default-transition-duration) ease-in-out;
    -webkit-transition: all var(--default-transition-duration) ease-in-out;
    -ms-transition: all var(--default-transition-duration) ease-in-out;
    transition: all var(--default-transition-duration) ease-in-out;
    outline: none;
}

[data-slot="sheet-content"][open]{
    display: flex;
}

[data-slot="sheet-content"][data-state="open"][data-side="right"]{
    animation: shadcn-sheet-in-from-right 500ms ease-in-out;
}

[data-slot="sheet-content"][data-state="closed"][data-side="right"]{
    animation: shadcn-sheet-out-to-right 300ms ease-in-out;
}

[data-slot="sheet-content"][data-state="open"][data-side="left"]{
    animation: shadcn-sheet-in-from-left 500ms ease-in-out;
}

[data-slot="sheet-content"][data-state="closed"][data-side="left"]{
    animation: shadcn-sheet-out-to-left 300ms ease-in-out;
}

[data-slot="sheet-content"][data-state="open"][data-side="top"]{
    animation: shadcn-sheet-in-from-top 500ms ease-in-out;
}

[data-slot="sheet-content"][data-state="closed"][data-side="top"]{
    animation: shadcn-sheet-out-to-top 300ms ease-in-out;
}

[data-slot="sheet-content"][data-state="open"][data-side="bottom"]{
    animation: shadcn-sheet-in-from-bottom 500ms ease-in-out;
}

[data-slot="sheet-content"][data-state="closed"][data-side="bottom"]{
    animation: shadcn-sheet-out-to-bottom 300ms ease-in-out;
}

[data-slot="sheet-content"][data-side="right"]{
    inset: 0 0 0 auto;
    height: 100%;
    width: 75%;
    border-left: 1px solid var(--border);
}

[data-slot="sheet-content"][data-side="left"]{
    inset: 0 auto 0 0;
    height: 100%;
    width: 75%;
    border-right: 1px solid var(--border);
}

[data-slot="sheet-content"][data-side="top"]{
    inset: 0 0 auto 0;
    width: 100%;
    height: auto;
    border-bottom: 1px solid var(--border);
}

[data-slot="sheet-content"][data-side="bottom"]{
    inset: auto 0 0 0;
    width: 100%;
    height: auto;
    border-top: 1px solid var(--border);
}

@media (min-width: 640px){
    [data-slot="sheet-content"][data-side="right"]{
        max-width: 24rem;
    }
    [data-slot="sheet-content"][data-side="left"]{
        max-width: 24rem;
    }
}

[data-slot="sheet-content"] > [data-slot="sheet-close"]{
    box-sizing: border-box;
    position: absolute;
    top: calc(var(--spacing) * 4);
    right: calc(var(--spacing) * 4);
    display: inline-flex;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: var(--radius-sm);
    background-color: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
    opacity: 0.7;
    -moz-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="sheet-content"] > [data-slot="sheet-close"]:focus{
    outline: none;
    -moz-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -o-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -webkit-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    -ms-box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
    box-shadow: 0 0 0 2px var(--background), 0 0 0 4px var(--ring);
}

[data-slot="sheet-content"] > [data-slot="sheet-close"]:disabled{
    pointer-events: none;
}

[data-slot="sheet-content"] > [data-slot="sheet-close"][data-state="open"]{
    background-color: var(--secondary);
}

[data-slot="sheet-content"] > [data-slot="sheet-close"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="sheet-content"] > [data-slot="sheet-close"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="sheet-content"] > [data-slot="sheet-close"] .sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

@media (hover: hover){
    [data-slot="sheet-content"] > [data-slot="sheet-close"]:hover{
        opacity: 1;
    }
}

[data-slot="sheet-header"]{
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 1.5);
    padding: calc(var(--spacing) * 4);
}

[data-slot="sheet-footer"]{
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 4);
}

[data-slot="sheet-title"]{
    margin: 0;
    font-weight: var(--font-weight-semibold);
    color: var(--foreground);
}

[data-slot="sheet-description"]{
    margin: 0;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}
@keyframes shadcn-floating-enter-from-top{
    from{
        opacity: 0;
        -moz-transform: translateY(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -o-transform: translateY(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -webkit-transform: translateY(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -ms-transform: translateY(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        transform: translateY(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
    }
    to{
        opacity: 1;
        -moz-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
}

@keyframes shadcn-floating-enter-from-bottom{
    from{
        opacity: 0;
        -moz-transform: translateY(calc(var(--spacing) * 2)) scale(0.95);
        -o-transform: translateY(calc(var(--spacing) * 2)) scale(0.95);
        -webkit-transform: translateY(calc(var(--spacing) * 2)) scale(0.95);
        -ms-transform: translateY(calc(var(--spacing) * 2)) scale(0.95);
        transform: translateY(calc(var(--spacing) * 2)) scale(0.95);
    }
    to{
        opacity: 1;
        -moz-transform: translateY(0) scale(1);
        -o-transform: translateY(0) scale(1);
        -webkit-transform: translateY(0) scale(1);
        -ms-transform: translateY(0) scale(1);
        transform: translateY(0) scale(1);
    }
}

@keyframes shadcn-floating-enter-from-left{
    from{
        opacity: 0;
        -moz-transform: translateX(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -o-transform: translateX(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -webkit-transform: translateX(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        -ms-transform: translateX(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
        transform: translateX(calc(-1 * calc(var(--spacing) * 2))) scale(0.95);
    }
    to{
        opacity: 1;
        -moz-transform: translateX(0) scale(1);
        -o-transform: translateX(0) scale(1);
        -webkit-transform: translateX(0) scale(1);
        -ms-transform: translateX(0) scale(1);
        transform: translateX(0) scale(1);
    }
}

@keyframes shadcn-floating-enter-from-right{
    from{
        opacity: 0;
        -moz-transform: translateX(calc(var(--spacing) * 2)) scale(0.95);
        -o-transform: translateX(calc(var(--spacing) * 2)) scale(0.95);
        -webkit-transform: translateX(calc(var(--spacing) * 2)) scale(0.95);
        -ms-transform: translateX(calc(var(--spacing) * 2)) scale(0.95);
        transform: translateX(calc(var(--spacing) * 2)) scale(0.95);
    }
    to{
        opacity: 1;
        -moz-transform: translateX(0) scale(1);
        -o-transform: translateX(0) scale(1);
        -webkit-transform: translateX(0) scale(1);
        -ms-transform: translateX(0) scale(1);
        transform: translateX(0) scale(1);
    }
}

@keyframes shadcn-floating-exit{
    from{
        opacity: 1;
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
    to{
        opacity: 0;
        -moz-transform: scale(0.95);
        -o-transform: scale(0.95);
        -webkit-transform: scale(0.95);
        -ms-transform: scale(0.95);
        transform: scale(0.95);
    }
}

[data-slot="popover-content"]{
    box-sizing: border-box;
    z-index: 50;
    width: calc(var(--spacing) * 72);
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 4);
    color: var(--popover-foreground);
    -moz-box-shadow: var(--shadow-md);
    -o-box-shadow: var(--shadow-md);
    -webkit-box-shadow: var(--shadow-md);
    -ms-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
    outline: none;
}

[data-slot="popover-content"][data-state="open"][data-side="bottom"]{
    animation: shadcn-floating-enter-from-top 150ms ease;
}

[data-slot="popover-content"][data-state="open"][data-side="top"]{
    animation: shadcn-floating-enter-from-bottom 150ms ease;
}

[data-slot="popover-content"][data-state="open"][data-side="right"]{
    animation: shadcn-floating-enter-from-left 150ms ease;
}

[data-slot="popover-content"][data-state="open"][data-side="left"]{
    animation: shadcn-floating-enter-from-right 150ms ease;
}

[data-slot="popover-content"][data-state="closed"]{
    animation: shadcn-floating-exit 150ms ease;
}

[data-slot="popover-anchor"]{
    display: contents;
}

[data-slot="popover-header"]{
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 1);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="popover-title"]{
    font-weight: var(--font-weight-medium);
}

[data-slot="popover-description"]{
    margin: 0;
    color: var(--muted-foreground);
}
[data-slot="tooltip-provider"]{
    display: contents;
}

[data-slot="tooltip"]{
    display: contents;
}

[data-slot="tooltip-content"]{
    box-sizing: border-box;
    z-index: 50;
    width: fit-content;
    border: 0;
    border-radius: var(--radius-md);
    background-color: var(--foreground);
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    text-wrap: balance;
    color: var(--background);
    overflow: visible;
}

[data-slot="tooltip-content"][data-state="delayed-open"][data-side="bottom"]{
    animation: shadcn-floating-enter-from-top 150ms ease;
}

[data-slot="tooltip-content"][data-state="delayed-open"][data-side="top"]{
    animation: shadcn-floating-enter-from-bottom 150ms ease;
}

[data-slot="tooltip-content"][data-state="delayed-open"][data-side="right"]{
    animation: shadcn-floating-enter-from-left 150ms ease;
}

[data-slot="tooltip-content"][data-state="delayed-open"][data-side="left"]{
    animation: shadcn-floating-enter-from-right 150ms ease;
}

[data-slot="tooltip-content"][data-state="instant-open"][data-side="bottom"]{
    animation: shadcn-floating-enter-from-top 150ms ease;
}

[data-slot="tooltip-content"][data-state="instant-open"][data-side="top"]{
    animation: shadcn-floating-enter-from-bottom 150ms ease;
}

[data-slot="tooltip-content"][data-state="instant-open"][data-side="right"]{
    animation: shadcn-floating-enter-from-left 150ms ease;
}

[data-slot="tooltip-content"][data-state="instant-open"][data-side="left"]{
    animation: shadcn-floating-enter-from-right 150ms ease;
}

[data-slot="tooltip-content"][data-state="closed"]{
    animation: shadcn-floating-exit 150ms ease;
}

[data-slot="tooltip-arrow"]{
    position: absolute;
    z-index: 50;
    width: calc(var(--spacing) * 2.5);
    height: calc(var(--spacing) * 2.5);
    border-radius: 2px;
    background-color: var(--foreground);
    fill: var(--foreground);
}

[data-slot="tooltip-content"][data-side="top"] > [data-slot="tooltip-arrow"]{
    bottom: 0;
    left: 50%;
    -moz-transform: translate(-50%, calc(50% - 2px)) rotate(45deg);
    -o-transform: translate(-50%, calc(50% - 2px)) rotate(45deg);
    -webkit-transform: translate(-50%, calc(50% - 2px)) rotate(45deg);
    -ms-transform: translate(-50%, calc(50% - 2px)) rotate(45deg);
    transform: translate(-50%, calc(50% - 2px)) rotate(45deg);
}

[data-slot="tooltip-content"][data-side="bottom"] > [data-slot="tooltip-arrow"]{
    top: 0;
    left: 50%;
    -moz-transform: translate(-50%, calc(-50% + 2px)) rotate(45deg);
    -o-transform: translate(-50%, calc(-50% + 2px)) rotate(45deg);
    -webkit-transform: translate(-50%, calc(-50% + 2px)) rotate(45deg);
    -ms-transform: translate(-50%, calc(-50% + 2px)) rotate(45deg);
    transform: translate(-50%, calc(-50% + 2px)) rotate(45deg);
}

[data-slot="tooltip-content"][data-side="left"] > [data-slot="tooltip-arrow"]{
    right: 0;
    top: 50%;
    -moz-transform: translate(calc(50% - 2px), -50%) rotate(45deg);
    -o-transform: translate(calc(50% - 2px), -50%) rotate(45deg);
    -webkit-transform: translate(calc(50% - 2px), -50%) rotate(45deg);
    -ms-transform: translate(calc(50% - 2px), -50%) rotate(45deg);
    transform: translate(calc(50% - 2px), -50%) rotate(45deg);
}

[data-slot="tooltip-content"][data-side="right"] > [data-slot="tooltip-arrow"]{
    left: 0;
    top: 50%;
    -moz-transform: translate(calc(-50% + 2px), -50%) rotate(45deg);
    -o-transform: translate(calc(-50% + 2px), -50%) rotate(45deg);
    -webkit-transform: translate(calc(-50% + 2px), -50%) rotate(45deg);
    -ms-transform: translate(calc(-50% + 2px), -50%) rotate(45deg);
    transform: translate(calc(-50% + 2px), -50%) rotate(45deg);
}
[data-slot="dropdown-menu-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: auto;
    margin: 0;
    z-index: 50;
    min-width: 8rem;
    max-height: calc(100vh - calc(var(--spacing) * 4));
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 1);
    color: var(--popover-foreground);
    -moz-box-shadow: var(--shadow-md);
    -o-box-shadow: var(--shadow-md);
    -webkit-box-shadow: var(--shadow-md);
    -ms-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
    outline: none;
}

[data-slot="dropdown-menu-content"][data-side="bottom"][data-align="start"]{
    -moz-transform-origin: top left;
    -o-transform-origin: top left;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
}

[data-slot="dropdown-menu-content"][data-side="bottom"][data-align="center"]{
    -moz-transform-origin: top center;
    -o-transform-origin: top center;
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
}

[data-slot="dropdown-menu-content"][data-side="bottom"][data-align="end"]{
    -moz-transform-origin: top right;
    -o-transform-origin: top right;
    -webkit-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
}

[data-slot="dropdown-menu-content"][data-side="top"][data-align="start"]{
    -moz-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -webkit-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    transform-origin: bottom left;
}

[data-slot="dropdown-menu-content"][data-side="top"][data-align="center"]{
    -moz-transform-origin: bottom center;
    -o-transform-origin: bottom center;
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
}

[data-slot="dropdown-menu-content"][data-side="top"][data-align="end"]{
    -moz-transform-origin: bottom right;
    -o-transform-origin: bottom right;
    -webkit-transform-origin: bottom right;
    -ms-transform-origin: bottom right;
    transform-origin: bottom right;
}

[data-slot="dropdown-menu-content"][data-side="left"][data-align="start"]{
    -moz-transform-origin: right top;
    -o-transform-origin: right top;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
}

[data-slot="dropdown-menu-content"][data-side="left"][data-align="center"]{
    -moz-transform-origin: right center;
    -o-transform-origin: right center;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
}

[data-slot="dropdown-menu-content"][data-side="left"][data-align="end"]{
    -moz-transform-origin: right bottom;
    -o-transform-origin: right bottom;
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
}

[data-slot="dropdown-menu-content"][data-side="right"][data-align="start"]{
    -moz-transform-origin: left top;
    -o-transform-origin: left top;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

[data-slot="dropdown-menu-content"][data-side="right"][data-align="center"]{
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
}

[data-slot="dropdown-menu-content"][data-side="right"][data-align="end"]{
    -moz-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
}

[data-slot="dropdown-menu-content"][data-state="open"][data-side="bottom"]{
    animation: shadcn-floating-enter-from-top 150ms ease both;
}

[data-slot="dropdown-menu-content"][data-state="open"][data-side="top"]{
    animation: shadcn-floating-enter-from-bottom 150ms ease both;
}

[data-slot="dropdown-menu-content"][data-state="open"][data-side="left"]{
    animation: shadcn-floating-enter-from-right 150ms ease both;
}

[data-slot="dropdown-menu-content"][data-state="open"][data-side="right"]{
    animation: shadcn-floating-enter-from-left 150ms ease both;
}

[data-slot="dropdown-menu-content"][data-state="closed"]{
    animation: shadcn-floating-exit 150ms ease both;
}

[data-slot="dropdown-menu-sub-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: auto;
    margin: 0;
    z-index: 50;
    min-width: 8rem;
    max-height: none;
    overflow-x: hidden;
    overflow-y: hidden;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background-color: var(--popover);
    padding: calc(var(--spacing) * 1);
    color: var(--popover-foreground);
    -moz-box-shadow: var(--shadow-lg);
    -o-box-shadow: var(--shadow-lg);
    -webkit-box-shadow: var(--shadow-lg);
    -ms-box-shadow: var(--shadow-lg);
    box-shadow: var(--shadow-lg);
    outline: none;
}

[data-slot="dropdown-menu-sub-content"][data-side="bottom"][data-align="start"]{
    -moz-transform-origin: top left;
    -o-transform-origin: top left;
    -webkit-transform-origin: top left;
    -ms-transform-origin: top left;
    transform-origin: top left;
}

[data-slot="dropdown-menu-sub-content"][data-side="bottom"][data-align="center"]{
    -moz-transform-origin: top center;
    -o-transform-origin: top center;
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
}

[data-slot="dropdown-menu-sub-content"][data-side="bottom"][data-align="end"]{
    -moz-transform-origin: top right;
    -o-transform-origin: top right;
    -webkit-transform-origin: top right;
    -ms-transform-origin: top right;
    transform-origin: top right;
}

[data-slot="dropdown-menu-sub-content"][data-side="top"][data-align="start"]{
    -moz-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    -webkit-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    transform-origin: bottom left;
}

[data-slot="dropdown-menu-sub-content"][data-side="top"][data-align="center"]{
    -moz-transform-origin: bottom center;
    -o-transform-origin: bottom center;
    -webkit-transform-origin: bottom center;
    -ms-transform-origin: bottom center;
    transform-origin: bottom center;
}

[data-slot="dropdown-menu-sub-content"][data-side="top"][data-align="end"]{
    -moz-transform-origin: bottom right;
    -o-transform-origin: bottom right;
    -webkit-transform-origin: bottom right;
    -ms-transform-origin: bottom right;
    transform-origin: bottom right;
}

[data-slot="dropdown-menu-sub-content"][data-side="left"][data-align="start"]{
    -moz-transform-origin: right top;
    -o-transform-origin: right top;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
}

[data-slot="dropdown-menu-sub-content"][data-side="left"][data-align="center"]{
    -moz-transform-origin: right center;
    -o-transform-origin: right center;
    -webkit-transform-origin: right center;
    -ms-transform-origin: right center;
    transform-origin: right center;
}

[data-slot="dropdown-menu-sub-content"][data-side="left"][data-align="end"]{
    -moz-transform-origin: right bottom;
    -o-transform-origin: right bottom;
    -webkit-transform-origin: right bottom;
    -ms-transform-origin: right bottom;
    transform-origin: right bottom;
}

[data-slot="dropdown-menu-sub-content"][data-side="right"][data-align="start"]{
    -moz-transform-origin: left top;
    -o-transform-origin: left top;
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

[data-slot="dropdown-menu-sub-content"][data-side="right"][data-align="center"]{
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    -webkit-transform-origin: left center;
    -ms-transform-origin: left center;
    transform-origin: left center;
}

[data-slot="dropdown-menu-sub-content"][data-side="right"][data-align="end"]{
    -moz-transform-origin: left bottom;
    -o-transform-origin: left bottom;
    -webkit-transform-origin: left bottom;
    -ms-transform-origin: left bottom;
    transform-origin: left bottom;
}

[data-slot="dropdown-menu-sub-content"][data-state="open"][data-side="bottom"]{
    animation: shadcn-floating-enter-from-top 150ms ease both;
}

[data-slot="dropdown-menu-sub-content"][data-state="open"][data-side="top"]{
    animation: shadcn-floating-enter-from-bottom 150ms ease both;
}

[data-slot="dropdown-menu-sub-content"][data-state="open"][data-side="left"]{
    animation: shadcn-floating-enter-from-right 150ms ease both;
}

[data-slot="dropdown-menu-sub-content"][data-state="open"][data-side="right"]{
    animation: shadcn-floating-enter-from-left 150ms ease both;
}

[data-slot="dropdown-menu-sub-content"][data-state="closed"]{
    animation: shadcn-floating-exit 150ms ease both;
}

[data-slot="dropdown-menu-item"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: inherit;
    text-decoration: none;
}

[data-slot="dropdown-menu-item"]:focus, [data-slot="dropdown-menu-item"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="dropdown-menu-item"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="dropdown-menu-item"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-item"] svg:not([class*='text-']){
    color: var(--muted-foreground);
}

[data-slot="dropdown-menu-item"][data-disabled]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="dropdown-menu-item"][data-inset]{
    padding-left: calc(var(--spacing) * 8);
}

[data-slot="dropdown-menu-item"][data-variant="default"]{
    color: inherit;
}

[data-slot="dropdown-menu-item"][data-variant="destructive"]{
    color: var(--destructive);
}

[data-slot="dropdown-menu-item"][data-variant="destructive"]:focus, [data-slot="dropdown-menu-item"][data-variant="destructive"][data-highlighted]{
    background-color: color-mix(in oklab, var(--destructive) 10%, transparent);
    color: var(--destructive);
}

html.dark [data-slot="dropdown-menu-item"][data-variant="destructive"]:focus, html.dark [data-slot="dropdown-menu-item"][data-variant="destructive"][data-highlighted]{
    background-color: color-mix(in oklab, var(--destructive) 20%, transparent);
}

[data-slot="dropdown-menu-item"][data-variant="destructive"] > svg{
    color: var(--destructive) !important;
}

[data-slot="dropdown-menu-checkbox-item"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: inherit;
    text-decoration: none;
}

[data-slot="dropdown-menu-checkbox-item"]:focus, [data-slot="dropdown-menu-checkbox-item"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="dropdown-menu-checkbox-item"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="dropdown-menu-checkbox-item"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-checkbox-item"]{
    border-radius: var(--radius-sm);
    padding-right: calc(var(--spacing) * 2);
    padding-left: calc(var(--spacing) * 8);
}

[data-slot="dropdown-menu-checkbox-item"][data-disabled]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="dropdown-menu-checkbox-item"] > span:first-child{
    pointer-events: none;
    position: absolute;
    left: calc(var(--spacing) * 2);
    display: flex;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    align-items: center;
    justify-content: center;
}

[data-slot="dropdown-menu-checkbox-item"] > span:first-child > span[data-state="unchecked"]{
    display: none;
}

[data-slot="dropdown-menu-checkbox-item"] > span:first-child svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-radio-item"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: inherit;
    text-decoration: none;
}

[data-slot="dropdown-menu-radio-item"]:focus, [data-slot="dropdown-menu-radio-item"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="dropdown-menu-radio-item"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="dropdown-menu-radio-item"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-radio-item"]{
    border-radius: var(--radius-sm);
    padding-right: calc(var(--spacing) * 2);
    padding-left: calc(var(--spacing) * 8);
}

[data-slot="dropdown-menu-radio-item"][data-disabled]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="dropdown-menu-radio-item"] > span:first-child{
    pointer-events: none;
    position: absolute;
    left: calc(var(--spacing) * 2);
    display: flex;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    align-items: center;
    justify-content: center;
}

[data-slot="dropdown-menu-radio-item"] > span:first-child > span[data-state="unchecked"]{
    display: none;
}

[data-slot="dropdown-menu-radio-item"] > span:first-child svg{
    width: calc(var(--spacing) * 2);
    height: calc(var(--spacing) * 2);
    fill: currentColor;
}

[data-slot="dropdown-menu-sub-trigger"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: inherit;
    text-decoration: none;
}

[data-slot="dropdown-menu-sub-trigger"]:focus, [data-slot="dropdown-menu-sub-trigger"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="dropdown-menu-sub-trigger"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="dropdown-menu-sub-trigger"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-sub-trigger"][data-inset]{
    padding-left: calc(var(--spacing) * 8);
}

[data-slot="dropdown-menu-sub-trigger"][data-state="open"]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="dropdown-menu-sub-trigger"] > svg:last-child{
    margin-left: auto;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="dropdown-menu-sub-trigger"] svg:not([class*='text-']){
    color: var(--muted-foreground);
}

[data-slot="dropdown-menu-label"]{
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    font-weight: var(--font-weight-medium);
}

[data-slot="dropdown-menu-label"][data-inset]{
    padding-left: calc(var(--spacing) * 8);
}

[data-slot="dropdown-menu-separator"]{
    margin-inline: calc(var(--spacing) * -1);
    margin-block: calc(var(--spacing) * 1);
    height: 1px;
    background-color: var(--border);
}

[data-slot="dropdown-menu-shortcut"]{
    margin-left: auto;
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    letter-spacing: 0.1em;
    color: var(--muted-foreground);
}

[data-slot="dropdown-menu-portal"], [data-slot="dropdown-menu-sub"], [data-slot="dropdown-menu"]{
    display: contents;
}
[data-slot="select-trigger"]{
    box-sizing: border-box;
    display: flex;
    width: fit-content;
    align-items: center;
    justify-content: space-between;
    gap: calc(var(--spacing) * 2);
    margin: 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--input);
    background-color: transparent;
    padding-inline: calc(var(--spacing) * 3);
    padding-block: calc(var(--spacing) * 2);
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    white-space: nowrap;
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
    cursor: default;
}

[data-slot="select-trigger"]:focus-visible{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="select-trigger"]:disabled{
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="select-trigger"][aria-invalid="true"]{
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

html.dark [data-slot="select-trigger"][aria-invalid="true"]{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="select-trigger"][data-placeholder]{
    color: var(--muted-foreground);
}

[data-slot="select-trigger"][data-size="default"]{
    height: calc(var(--spacing) * 9);
}

[data-slot="select-trigger"][data-size="sm"]{
    height: calc(var(--spacing) * 8);
}

[data-slot="select-trigger"] > [data-slot="select-value"]{
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

html.dark [data-slot="select-trigger"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

@media (hover: hover){
    html.dark [data-slot="select-trigger"]:hover{
        background-color: color-mix(in oklab, var(--input) 50%, transparent);
    }
}

[data-slot="select-trigger"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="select-trigger"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="select-trigger"] svg:not([class*='text-']){
    color: var(--muted-foreground);
}

[data-slot="select-trigger"] > svg:last-child{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    opacity: 50%;
}

@keyframes shadcn-select-in{
    0%{
        opacity: 0;
        -moz-transform: scale(0.95) translate(var(--shadcn-select-slide-x, 0), var(--shadcn-select-slide-y, 0));
        -o-transform: scale(0.95) translate(var(--shadcn-select-slide-x, 0), var(--shadcn-select-slide-y, 0));
        -webkit-transform: scale(0.95) translate(var(--shadcn-select-slide-x, 0), var(--shadcn-select-slide-y, 0));
        -ms-transform: scale(0.95) translate(var(--shadcn-select-slide-x, 0), var(--shadcn-select-slide-y, 0));
        transform: scale(0.95) translate(var(--shadcn-select-slide-x, 0), var(--shadcn-select-slide-y, 0));
    }
    100%{
        opacity: 1;
        -moz-transform: scale(1) translate(0, 0);
        -o-transform: scale(1) translate(0, 0);
        -webkit-transform: scale(1) translate(0, 0);
        -ms-transform: scale(1) translate(0, 0);
        transform: scale(1) translate(0, 0);
    }
}

[data-slot="select-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: auto;
    margin: 0;
    z-index: 50;
    max-height: var(--shadcn-select-available-height);
    min-width: 8rem;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    background-color: var(--popover);
    color: var(--popover-foreground);
    -moz-box-shadow: var(--shadow-md);
    -o-box-shadow: var(--shadow-md);
    -webkit-box-shadow: var(--shadow-md);
    -ms-box-shadow: var(--shadow-md);
    box-shadow: var(--shadow-md);
    padding: 0;
    --shadcn-select-trigger-width: 0;
    --shadcn-select-available-height: 24rem;
    --shadcn-select-slide-x: 0;
    --shadcn-select-slide-y: 0;
}

[data-slot="select-content"][data-side="bottom"]{
    --shadcn-select-slide-y: calc(calc(var(--spacing) * 2) * -1);
}

[data-slot="select-content"][data-side="top"]{
    --shadcn-select-slide-y: calc(var(--spacing) * 2);
}

[data-slot="select-content"][data-side="left"]{
    --shadcn-select-slide-x: calc(var(--spacing) * 2);
}

[data-slot="select-content"][data-side="right"]{
    --shadcn-select-slide-x: calc(calc(var(--spacing) * 2) * -1);
}

[data-slot="select-content"][data-state="open"]{
    animation: shadcn-select-in var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="select-content"][data-position="popper"][data-side="bottom"]{
    translate: 0 calc(var(--spacing) * 1);
}

[data-slot="select-content"][data-position="popper"][data-side="top"]{
    translate: 0 calc(calc(var(--spacing) * 1) * -1);
}

[data-slot="select-content"][data-position="popper"][data-side="left"]{
    translate: calc(calc(var(--spacing) * 1) * -1) 0;
}

[data-slot="select-content"][data-position="popper"][data-side="right"]{
    translate: calc(var(--spacing) * 1) 0;
}

[data-slot="select-content"][data-position="item-aligned"]{
    translate: 0 0;
}

[data-slot="select-viewport"]{
    padding: calc(var(--spacing) * 1);
}

[data-slot="select-content"][data-position="popper"] > [data-slot="select-viewport"]{
    width: 100%;
    min-width: var(--shadcn-select-trigger-width);
    scroll-margin-block: calc(var(--spacing) * 1);
}

[data-slot="select-label"]{
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    color: var(--muted-foreground);
}

[data-slot="select-item"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    width: 100%;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-block: calc(var(--spacing) * 1.5);
    padding-right: calc(var(--spacing) * 8);
    padding-left: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-slot="select-item"]:focus{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="select-item"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="select-item"][data-disabled]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="select-item"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="select-item"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="select-item"] svg:not([class*='text-']){
    color: var(--muted-foreground);
}

[data-slot="select-item"] > span:last-child{
    display: flex;
    align-items: center;
    gap: calc(var(--spacing) * 2);
}

[data-slot="select-item-indicator"]{
    position: absolute;
    right: calc(var(--spacing) * 2);
    display: flex;
    width: calc(var(--spacing) * 3.5);
    height: calc(var(--spacing) * 3.5);
    align-items: center;
    justify-content: center;
}

[data-slot="select-item"][data-state="unchecked"] > [data-slot="select-item-indicator"] > svg{
    display: none;
}

[data-slot="select-separator"]{
    pointer-events: none;
    margin-inline: calc(calc(var(--spacing) * 1) * -1);
    margin-block: calc(var(--spacing) * 1);
    height: 1px;
    background-color: var(--border);
}

[data-slot="select-scroll-up-button"]{
    display: flex;
    cursor: default;
    align-items: center;
    justify-content: center;
    padding-block: calc(var(--spacing) * 1);
}

[data-slot="select-scroll-down-button"]{
    display: flex;
    cursor: default;
    align-items: center;
    justify-content: center;
    padding-block: calc(var(--spacing) * 1);
}

[data-slot="select-scroll-up-button"][hidden]{
    display: none;
}

[data-slot="select-scroll-down-button"][hidden]{
    display: none;
}

[data-slot="select-scroll-up-button"] svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="select-scroll-down-button"] svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}
@keyframes shadcn-combobox-in{
    0%{
        opacity: 0;
        -moz-transform: scale(0.95) translate(var(--shadcn-combobox-slide-x, 0), var(--shadcn-combobox-slide-y, 0));
        -o-transform: scale(0.95) translate(var(--shadcn-combobox-slide-x, 0), var(--shadcn-combobox-slide-y, 0));
        -webkit-transform: scale(0.95) translate(var(--shadcn-combobox-slide-x, 0), var(--shadcn-combobox-slide-y, 0));
        -ms-transform: scale(0.95) translate(var(--shadcn-combobox-slide-x, 0), var(--shadcn-combobox-slide-y, 0));
        transform: scale(0.95) translate(var(--shadcn-combobox-slide-x, 0), var(--shadcn-combobox-slide-y, 0));
    }
    100%{
        opacity: 1;
        -moz-transform: scale(1) translate(0, 0);
        -o-transform: scale(1) translate(0, 0);
        -webkit-transform: scale(1) translate(0, 0);
        -ms-transform: scale(1) translate(0, 0);
        transform: scale(1) translate(0, 0);
    }
}

[data-slot="combobox"]{
    display: inline-block;
}

[data-slot="combobox"] [data-slot="input-group"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    width: auto;
    min-width: 0;
    height: calc(var(--spacing) * 9);
    align-items: center;
    border-radius: var(--radius-md);
    border: 1px solid var(--input);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    outline: none;
}

[data-slot="combobox"] [data-slot="input-group"]:focus-within{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

html.dark [data-slot="combobox"] [data-slot="input-group"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

[data-slot="combobox"] [data-slot="input-group-input"]{
    box-sizing: border-box;
    flex: 1;
    min-width: 0;
    height: 100%;
    margin: 0;
    border: 0;
    background-color: transparent;
    padding-inline: calc(var(--spacing) * 3);
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="combobox"] [data-slot="input-group-input"]::placeholder{
    color: var(--muted-foreground);
}

[data-slot="combobox"] [data-slot="input-group-input"]:disabled{
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="combobox"] [data-slot="input-group-addon"]{
    display: flex;
    height: auto;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    padding-right: calc(var(--spacing) * 1.5);
    color: var(--muted-foreground);
}

[data-slot="combobox"] [data-slot="input-group"]:has([data-slot="combobox-clear"]) [data-slot="input-group-button"]{
    display: none;
}

[data-slot="combobox-trigger"]{
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 2);
    margin: 0;
    border: 0;
    border-radius: var(--radius-md);
    background-color: transparent;
    padding: 0;
    -moz-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    -ms-appearance: button;
    appearance: button;
    color: inherit;
    font: inherit;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    cursor: pointer;
    outline: none;
}

[data-slot="input-group-addon"] > [data-slot="combobox-trigger"]{
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
}

[data-slot="combobox-trigger"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="combobox-trigger"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="combobox-trigger-icon"]{
    display: inline-flex;
    pointer-events: none;
    color: var(--muted-foreground);
}

[data-slot="combobox-trigger-icon"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="combobox-clear"]{
    display: inline-flex;
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    align-items: center;
    justify-content: center;
    margin: 0;
    border: 0;
    border-radius: var(--radius-md);
    background-color: transparent;
    padding: 0;
    color: inherit;
    cursor: pointer;
}

[data-slot="combobox-clear"] svg{
    pointer-events: none;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="combobox-value"]{
    flex: 1;
    text-align: left;
}

[data-slot="combobox-value"][data-placeholder]{
    color: var(--muted-foreground);
}

[data-slot="combobox-content"]{
    box-sizing: border-box;
    position: fixed;
    inset: auto;
    margin: 0;
    z-index: 50;
    max-height: calc(var(--spacing) * 96);
    width: var(--shadcn-combobox-anchor-width);
    max-width: calc(100vw - 16px);
    min-width: calc(var(--shadcn-combobox-anchor-width) + calc(var(--spacing) * 7));
    overflow: hidden;
    border: 0;
    border-radius: var(--radius-md);
    background-color: var(--popover);
    color: var(--popover-foreground);
    -moz-box-shadow: var(--shadow-md), 0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);
    -o-box-shadow: var(--shadow-md), 0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);
    -webkit-box-shadow: var(--shadow-md), 0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);
    -ms-box-shadow: var(--shadow-md), 0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);
    box-shadow: var(--shadow-md), 0 0 0 1px color-mix(in oklab, var(--foreground) 10%, transparent);
    padding: 0;
    --shadcn-combobox-anchor-width: auto;
    --shadcn-available-height: 100vh;
    --shadcn-combobox-slide-x: 0;
    --shadcn-combobox-slide-y: 0;
}

[data-slot="combobox-content"][data-chips="true"]{
    min-width: var(--shadcn-combobox-anchor-width);
}

[data-slot="combobox-content"][data-side="bottom"]{
    --shadcn-combobox-slide-y: calc(calc(var(--spacing) * 2) * -1);
}

[data-slot="combobox-content"][data-side="top"]{
    --shadcn-combobox-slide-y: calc(var(--spacing) * 2);
}

[data-slot="combobox-content"][data-side="left"]{
    --shadcn-combobox-slide-x: calc(var(--spacing) * 2);
}

[data-slot="combobox-content"][data-side="right"]{
    --shadcn-combobox-slide-x: calc(calc(var(--spacing) * 2) * -1);
}

[data-slot="combobox-content"][data-state="open"]{
    animation: shadcn-combobox-in 100ms var(--default-transition-timing-function);
}

[data-slot="combobox-content"] > [data-slot="input-group"]{
    margin: calc(var(--spacing) * 1);
    margin-bottom: 0;
    height: calc(var(--spacing) * 8);
    border-color: color-mix(in oklab, var(--input) 30%, transparent);
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="combobox-list"]{
    max-height: min(calc(calc(var(--spacing) * 96) - calc(var(--spacing) * 9)), calc(var(--shadcn-available-height, 100vh) - calc(var(--spacing) * 9)));
    scroll-padding-block: calc(var(--spacing) * 1);
    overflow-y: auto;
    padding: calc(var(--spacing) * 1);
}

[data-slot="combobox-list"][data-empty]{
    padding: 0;
}

[data-slot="combobox-item"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    width: 100%;
    cursor: default;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-sm);
    padding-block: calc(var(--spacing) * 1.5);
    padding-right: calc(var(--spacing) * 8);
    padding-left: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-slot="combobox-item"][hidden]{
    display: none;
}

[data-slot="combobox-item"][data-highlighted]{
    background-color: var(--accent);
    color: var(--accent-foreground);
}

[data-slot="combobox-item"][data-disabled]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="combobox-item"] svg{
    pointer-events: none;
    flex-shrink: 0;
}

[data-slot="combobox-item"] svg:not([class*='size-']){
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
}

[data-slot="combobox-item-indicator"]{
    pointer-events: none;
    position: absolute;
    right: calc(var(--spacing) * 2);
    display: flex;
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    align-items: center;
    justify-content: center;
}

[data-slot="combobox-item"]:not([data-selected]) > [data-slot="combobox-item-indicator"]{
    display: none;
}

[data-slot="combobox-group"][hidden]{
    display: none;
}

[data-slot="combobox-label"]{
    padding-inline: calc(var(--spacing) * 2);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    color: var(--muted-foreground);
}

[data-slot="combobox-empty"]{
    display: none;
    width: 100%;
    justify-content: center;
    padding-block: calc(var(--spacing) * 2);
    text-align: center;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    color: var(--muted-foreground);
}

[data-slot="combobox-content"][data-empty] [data-slot="combobox-empty"]{
    display: flex;
}

[data-slot="combobox-separator"]{
    margin-inline: calc(calc(var(--spacing) * 1) * -1);
    margin-block: calc(var(--spacing) * 1);
    height: 1px;
    background-color: var(--border);
}

@media (pointer: coarse){
    [data-slot="combobox-item-indicator"] > svg{
        width: calc(var(--spacing) * 5);
        height: calc(var(--spacing) * 5);
    }
    [data-slot="combobox-label"]{
        padding-inline: calc(var(--spacing) * 3);
        padding-block: calc(var(--spacing) * 2);
        font-size: var(--text-sm);
        line-height: var(--text-sm--line-height);
    }
}

[data-slot="combobox-chips"]{
    box-sizing: border-box;
    display: flex;
    min-height: calc(var(--spacing) * 9);
    flex-wrap: wrap;
    align-items: center;
    gap: calc(var(--spacing) * 1.5);
    border-radius: var(--radius-md);
    border: 1px solid var(--input);
    background-color: transparent;
    background-clip: padding-box;
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 1.5);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    -moz-box-shadow: var(--shadow-xs);
    -o-box-shadow: var(--shadow-xs);
    -webkit-box-shadow: var(--shadow-xs);
    -ms-box-shadow: var(--shadow-xs);
    box-shadow: var(--shadow-xs);
    -moz-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
    transition: color var(--default-transition-duration) var(--default-transition-timing-function), box-shadow var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="combobox-chips"]:focus-within{
    border-color: var(--ring);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="combobox-chips"]:has([aria-invalid="true"]){
    border-color: var(--destructive);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 20%, transparent);
}

[data-slot="combobox-chips"]:has([data-slot="combobox-chip"]){
    padding-inline: calc(var(--spacing) * 1.5);
}

html.dark [data-slot="combobox-chips"]{
    background-color: color-mix(in oklab, var(--input) 30%, transparent);
}

html.dark [data-slot="combobox-chips"]:has([aria-invalid="true"]){
    border-color: color-mix(in oklab, var(--destructive) 50%, transparent);
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--destructive) 40%, transparent);
}

[data-slot="combobox-chip"]{
    box-sizing: border-box;
    display: flex;
    height: calc(var(--spacing) * 5.5);
    width: fit-content;
    align-items: center;
    justify-content: center;
    gap: calc(var(--spacing) * 1);
    border-radius: var(--radius-sm);
    background-color: var(--muted);
    padding-inline: calc(var(--spacing) * 1.5);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
    color: var(--foreground);
}

[data-slot="combobox-chip"]:has(:disabled){
    pointer-events: none;
    cursor: not-allowed;
    opacity: 50%;
}

[data-slot="combobox-chip"]:has([data-slot="combobox-chip-remove"]){
    padding-right: 0;
}

[data-slot="combobox-chip-remove"]{
    display: inline-flex;
    width: calc(var(--spacing) * 6);
    height: calc(var(--spacing) * 6);
    align-items: center;
    justify-content: center;
    margin: 0;
    margin-left: calc(calc(var(--spacing) * 1) * -1);
    border: 0;
    border-radius: var(--radius-md);
    background-color: transparent;
    padding: 0;
    color: inherit;
    opacity: 70%;
    cursor: pointer;
    -moz-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
    transition: opacity var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="combobox-chip-remove"] svg{
    pointer-events: none;
    width: calc(var(--spacing) * 3);
    height: calc(var(--spacing) * 3);
}

@media (hover: hover){
    [data-slot="combobox-chip-remove"]:hover{
        opacity: 100%;
    }
}

[data-slot="combobox-chip-input"]{
    box-sizing: border-box;
    min-width: calc(var(--spacing) * 16);
    flex: 1;
    margin: 0;
    border: 0;
    background-color: transparent;
    padding: 0;
    color: inherit;
    font: inherit;
    outline: none;
}
[data-slot="sidebar-wrapper"]{
    --sidebar-width: 16rem;
    --sidebar-width-icon: 3rem;
    --sidebar-width-mobile: 18rem;
    display: flex;
    min-height: 100svh;
    width: 100%;
}

[data-slot="sidebar-wrapper"]:has([data-variant="inset"]){
    background-color: var(--sidebar);
}

[data-slot="sidebar"][data-collapsible="none"]{
    display: flex;
    height: 100%;
    width: var(--sidebar-width);
    flex-direction: column;
    background-color: var(--sidebar);
    color: var(--sidebar-foreground);
}

[data-slot="sidebar"][data-variant]{
    display: none;
    color: var(--sidebar-foreground);
}

[data-slot="sidebar-gap"]{
    position: relative;
    width: var(--sidebar-width);
    background-color: transparent;
    -moz-transition: width 200ms linear;
    -o-transition: width 200ms linear;
    -webkit-transition: width 200ms linear;
    -ms-transition: width 200ms linear;
    transition: width 200ms linear;
}

[data-slot="sidebar"][data-collapsible="offcanvas"] [data-slot="sidebar-gap"]{
    width: 0;
}

[data-slot="sidebar"][data-side="right"] [data-slot="sidebar-gap"]{
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-gap"]{
    width: var(--sidebar-width-icon);
}

[data-slot="sidebar"][data-collapsible="icon"][data-variant="floating"] [data-slot="sidebar-gap"]{
    width: calc(var(--sidebar-width-icon) + calc(var(--spacing) * 4));
}

[data-slot="sidebar"][data-collapsible="icon"][data-variant="inset"] [data-slot="sidebar-gap"]{
    width: calc(var(--sidebar-width-icon) + calc(var(--spacing) * 4));
}

[data-slot="sidebar-container"]{
    box-sizing: border-box;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 10;
    display: none;
    height: 100svh;
    width: var(--sidebar-width);
    -moz-transition: left 200ms linear, right 200ms linear, width 200ms linear;
    -o-transition: left 200ms linear, right 200ms linear, width 200ms linear;
    -webkit-transition: left 200ms linear, right 200ms linear, width 200ms linear;
    -ms-transition: left 200ms linear, right 200ms linear, width 200ms linear;
    transition: left 200ms linear, right 200ms linear, width 200ms linear;
}

[data-slot="sidebar"][data-side="left"] [data-slot="sidebar-container"]{
    left: 0;
}

[data-slot="sidebar"][data-side="left"][data-collapsible="offcanvas"] [data-slot="sidebar-container"]{
    left: calc(var(--sidebar-width) * -1);
}

[data-slot="sidebar"][data-side="right"] [data-slot="sidebar-container"]{
    right: 0;
}

[data-slot="sidebar"][data-side="right"][data-collapsible="offcanvas"] [data-slot="sidebar-container"]{
    right: calc(var(--sidebar-width) * -1);
}

[data-slot="sidebar"][data-variant="floating"] [data-slot="sidebar-container"]{
    padding: calc(var(--spacing) * 2);
}

[data-slot="sidebar"][data-variant="floating"][data-collapsible="icon"] [data-slot="sidebar-container"]{
    width: calc(var(--sidebar-width-icon) + calc(var(--spacing) * 4) + 2px);
}

[data-slot="sidebar"][data-variant="inset"] [data-slot="sidebar-container"]{
    padding: calc(var(--spacing) * 2);
}

[data-slot="sidebar"][data-variant="inset"][data-collapsible="icon"] [data-slot="sidebar-container"]{
    width: calc(var(--sidebar-width-icon) + calc(var(--spacing) * 4) + 2px);
}

[data-slot="sidebar"][data-variant="sidebar"][data-collapsible="icon"] [data-slot="sidebar-container"]{
    width: var(--sidebar-width-icon);
}

[data-slot="sidebar"][data-variant="sidebar"][data-side="left"] [data-slot="sidebar-container"]{
    border-right: 1px solid var(--border);
}

[data-slot="sidebar"][data-variant="sidebar"][data-side="right"] [data-slot="sidebar-container"]{
    border-left: 1px solid var(--border);
}

[data-slot="sidebar-inner"]{
    box-sizing: border-box;
    display: flex;
    height: 100%;
    width: 100%;
    flex-direction: column;
    background-color: var(--sidebar);
}

[data-slot="sidebar"][data-variant="floating"] [data-slot="sidebar-inner"]{
    border-radius: var(--radius-lg);
    border: 1px solid var(--sidebar-border);
    -moz-box-shadow: var(--shadow-sm);
    -o-box-shadow: var(--shadow-sm);
    -webkit-box-shadow: var(--shadow-sm);
    -ms-box-shadow: var(--shadow-sm);
    box-shadow: var(--shadow-sm);
}

[data-slot="sidebar"]::backdrop{
    background-color: rgb(0 0 0 / 0.5);
}

[data-slot="sidebar"][open]::backdrop{
    animation: shadcn-backdrop-in 150ms ease;
}

[data-slot="sidebar"][data-mobile="true"]{
    --sidebar-width: var(--sidebar-width-mobile);
    box-sizing: border-box;
    position: fixed;
    z-index: 50;
    margin: 0;
    padding: 0;
    border: 0;
    max-width: none;
    max-height: none;
    height: 100%;
    width: var(--sidebar-width);
    flex-direction: column;
    background-color: var(--sidebar);
    color: var(--sidebar-foreground);
    -moz-box-shadow: var(--shadow-lg);
    -o-box-shadow: var(--shadow-lg);
    -webkit-box-shadow: var(--shadow-lg);
    -ms-box-shadow: var(--shadow-lg);
    box-shadow: var(--shadow-lg);
    outline: none;
}

[data-slot="sidebar"][data-mobile="true"][open]{
    display: flex;
}

[data-slot="sidebar"][data-mobile="true"] > button{
    display: none;
}

[data-slot="sidebar"][data-mobile="true"][data-side="left"]{
    inset: 0 auto 0 0;
}

[data-slot="sidebar"][data-mobile="true"][data-side="right"]{
    inset: 0 0 0 auto;
}

[data-slot="sidebar"][data-mobile="true"][data-state="open"][data-side="left"]{
    animation: shadcn-sheet-in-from-left 500ms ease-in-out;
}

[data-slot="sidebar"][data-mobile="true"][data-state="closed"][data-side="left"]{
    animation: shadcn-sheet-out-to-left 300ms ease-in-out;
}

[data-slot="sidebar"][data-mobile="true"][data-state="open"][data-side="right"]{
    animation: shadcn-sheet-in-from-right 500ms ease-in-out;
}

[data-slot="sidebar"][data-mobile="true"][data-state="closed"][data-side="right"]{
    animation: shadcn-sheet-out-to-right 300ms ease-in-out;
}

[data-slot="sidebar"][data-mobile="true"] > [data-slot="sheet-header"]{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

[data-slot="sidebar"][data-mobile="true"] [data-sidebar="menu-tooltip"]{
    display: none;
}

@media (min-width: 768px){
    [data-slot="sidebar"][data-variant]{
        display: block;
    }
    [data-slot="sidebar-container"]{
        display: flex;
    }
    [data-slot="sidebar"][data-mobile="true"]{
        display: none;
    }
}

[data-slot="button"][data-sidebar="trigger"]{
    width: calc(var(--spacing) * 7);
    height: calc(var(--spacing) * 7);
}

[data-slot="button"][data-sidebar="trigger"] > .sr-only{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

[data-slot="sidebar-rail"]{
    box-sizing: border-box;
    margin: 0;
    border: 0;
    background-color: transparent;
    color: inherit;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    padding: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 20;
    display: none;
    width: calc(var(--spacing) * 4);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    -moz-transition: all var(--default-transition-duration) linear;
    -o-transition: all var(--default-transition-duration) linear;
    -webkit-transition: all var(--default-transition-duration) linear;
    -ms-transition: all var(--default-transition-duration) linear;
    transition: all var(--default-transition-duration) linear;
}

[data-slot="sidebar-rail"]::after{
    content: "\"\"";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 2px;
}

[data-slot="sidebar"][data-side="left"] [data-slot="sidebar-rail"]{
    right: calc(var(--spacing) * -4);
    cursor: w-resize;
}

[data-slot="sidebar"][data-side="right"] [data-slot="sidebar-rail"]{
    left: 0;
    cursor: e-resize;
}

[data-slot="sidebar"][data-side="left"][data-state="collapsed"] [data-slot="sidebar-rail"]{
    cursor: e-resize;
}

[data-slot="sidebar"][data-side="right"][data-state="collapsed"] [data-slot="sidebar-rail"]{
    cursor: w-resize;
}

[data-slot="sidebar"][data-collapsible="offcanvas"] [data-slot="sidebar-rail"]{
    -moz-transform: translateX(0);
    -o-transform: translateX(0);
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

[data-slot="sidebar"][data-collapsible="offcanvas"] [data-slot="sidebar-rail"]::after{
    left: 100%;
}

[data-slot="sidebar"][data-side="left"][data-collapsible="offcanvas"] [data-slot="sidebar-rail"]{
    right: calc(var(--spacing) * -2);
}

[data-slot="sidebar"][data-side="right"][data-collapsible="offcanvas"] [data-slot="sidebar-rail"]{
    left: calc(var(--spacing) * -2);
}

@media (min-width: 640px){
    [data-slot="sidebar-rail"]{
        display: flex;
    }
}

[data-slot="sidebar-inset"]{
    position: relative;
    display: flex;
    width: 100%;
    flex: 1 1 0%;
    flex-direction: column;
    background-color: var(--background);
}

@media (min-width: 768px){
    [data-slot="sidebar"][data-variant="inset"] ~ [data-slot="sidebar-inset"]{
        margin: calc(var(--spacing) * 2);
        margin-left: 0;
        border-radius: var(--radius-xl);
        -moz-box-shadow: var(--shadow-sm);
        -o-box-shadow: var(--shadow-sm);
        -webkit-box-shadow: var(--shadow-sm);
        -ms-box-shadow: var(--shadow-sm);
        box-shadow: var(--shadow-sm);
    }
    [data-slot="sidebar"][data-variant="inset"][data-state="collapsed"] ~ [data-slot="sidebar-inset"]{
        margin-left: calc(var(--spacing) * 2);
    }
}

[data-slot="input"][data-sidebar="input"]{
    height: calc(var(--spacing) * 8);
    width: 100%;
    background-color: var(--background);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="input"][data-sidebar="input"]:focus-visible{
    -moz-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -o-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -webkit-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    -ms-box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
    box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}

[data-slot="sidebar-header"]{
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 2);
}

[data-slot="sidebar-footer"]{
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    padding: calc(var(--spacing) * 2);
}

[data-slot="separator"][data-sidebar="separator"]{
    margin-inline: calc(var(--spacing) * 2);
    width: auto;
    background-color: var(--sidebar-border);
}

[data-slot="sidebar-content"]{
    display: flex;
    min-height: 0;
    flex: 1 1 0%;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    overflow: auto;
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-content"]{
    overflow: hidden;
}

[data-slot="sidebar-group"]{
    box-sizing: border-box;
    position: relative;
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    padding: calc(var(--spacing) * 2);
}

[data-slot="sidebar-group-label"]{
    box-sizing: border-box;
    display: flex;
    height: calc(var(--spacing) * 8);
    flex-shrink: 0;
    align-items: center;
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing) * 2);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    font-weight: var(--font-weight-medium);
    color: color-mix(in oklab, var(--sidebar-foreground) 70%, transparent);
    outline: none;
    -moz-transition: margin 200ms linear, opacity 200ms linear;
    -o-transition: margin 200ms linear, opacity 200ms linear;
    -webkit-transition: margin 200ms linear, opacity 200ms linear;
    -ms-transition: margin 200ms linear, opacity 200ms linear;
    transition: margin 200ms linear, opacity 200ms linear;
}

[data-slot="sidebar-group-label"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring);
    box-shadow: 0 0 0 2px var(--sidebar-ring);
}

[data-slot="sidebar-group-label"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-group-label"]{
    margin-top: calc(var(--spacing) * -8);
    opacity: 0;
}

[data-slot="sidebar-group-action"]{
    box-sizing: border-box;
    margin: 0;
    border: 0;
    background-color: transparent;
    color: inherit;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    position: absolute;
    top: calc(var(--spacing) * 3.5);
    right: calc(var(--spacing) * 3);
    display: flex;
    aspect-ratio: 1 / 1;
    width: calc(var(--spacing) * 5);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    padding: 0;
    color: var(--sidebar-foreground);
    outline: none;
    -moz-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="sidebar-group-action"]::after{
    content: "\"\"";
    position: absolute;
    inset: calc(var(--spacing) * -2);
}

[data-slot="sidebar-group-action"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring);
    box-shadow: 0 0 0 2px var(--sidebar-ring);
}

[data-slot="sidebar-group-action"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-group-action"]{
    display: none;
}

[data-slot="sidebar-group-content"]{
    width: 100%;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="sidebar-menu"]{
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    gap: calc(var(--spacing) * 1);
}

[data-slot="sidebar-menu-item"]{
    position: relative;
    list-style: none;
}

[data-slot="sidebar-menu-button"]{
    box-sizing: border-box;
    margin: 0;
    border: 0;
    background-color: transparent;
    color: inherit;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    display: flex;
    width: 100%;
    align-items: center;
    gap: calc(var(--spacing) * 2);
    overflow: hidden;
    border-radius: var(--radius-md);
    padding: calc(var(--spacing) * 2);
    text-align: left;
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
    outline: none;
    -moz-transition: width var(--default-transition-duration) var(--default-transition-timing-function), height var(--default-transition-duration) var(--default-transition-timing-function), padding var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: width var(--default-transition-duration) var(--default-transition-timing-function), height var(--default-transition-duration) var(--default-transition-timing-function), padding var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: width var(--default-transition-duration) var(--default-transition-timing-function), height var(--default-transition-duration) var(--default-transition-timing-function), padding var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: width var(--default-transition-duration) var(--default-transition-timing-function), height var(--default-transition-duration) var(--default-transition-timing-function), padding var(--default-transition-duration) var(--default-transition-timing-function);
    transition: width var(--default-transition-duration) var(--default-transition-timing-function), height var(--default-transition-duration) var(--default-transition-timing-function), padding var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="sidebar-menu-item"]:has([data-sidebar="menu-action"]) [data-slot="sidebar-menu-button"]{
    padding-right: calc(var(--spacing) * 8);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-button"]{
    width: calc(var(--spacing) * 8) !important;
    height: calc(var(--spacing) * 8) !important;
    padding: calc(var(--spacing) * 2) !important;
}

[data-slot="sidebar-menu-button"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring);
    box-shadow: 0 0 0 2px var(--sidebar-ring);
}

[data-slot="sidebar-menu-button"]:active{
    background-color: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-button"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="sidebar-menu-button"][aria-disabled="true"]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="sidebar-menu-button"][data-active="true"]{
    background-color: var(--sidebar-accent);
    font-weight: var(--font-weight-medium);
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-button"] > span:last-child{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-slot="sidebar-menu-button"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
}

[data-slot="sidebar-menu-button"][data-variant="default"]{
    background-color: transparent;
}

[data-slot="sidebar-menu-button"][data-variant="outline"]{
    background-color: var(--background);
    -moz-box-shadow: 0 0 0 1px var(--sidebar-border);
    -o-box-shadow: 0 0 0 1px var(--sidebar-border);
    -webkit-box-shadow: 0 0 0 1px var(--sidebar-border);
    -ms-box-shadow: 0 0 0 1px var(--sidebar-border);
    box-shadow: 0 0 0 1px var(--sidebar-border);
}

[data-slot="sidebar-menu-button"][data-variant="outline"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring), 0 0 0 1px var(--sidebar-border);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring), 0 0 0 1px var(--sidebar-border);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring), 0 0 0 1px var(--sidebar-border);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring), 0 0 0 1px var(--sidebar-border);
    box-shadow: 0 0 0 2px var(--sidebar-ring), 0 0 0 1px var(--sidebar-border);
}

[data-slot="sidebar-menu-button"][data-size="default"]{
    height: calc(var(--spacing) * 8);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="sidebar-menu-button"][data-size="sm"]{
    height: calc(var(--spacing) * 7);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="sidebar-menu-button"][data-size="lg"]{
    height: calc(var(--spacing) * 12);
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-button"][data-size="lg"]{
    padding: 0 !important;
}

[data-slot="sidebar"]:not([data-collapsible="icon"]) [data-sidebar="menu-tooltip"]{
    display: none;
}

[data-slot="sidebar-menu-action"]{
    box-sizing: border-box;
    margin: 0;
    border: 0;
    background-color: transparent;
    color: inherit;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    position: absolute;
    top: calc(var(--spacing) * 1.5);
    right: calc(var(--spacing) * 1);
    display: flex;
    aspect-ratio: 1 / 1;
    width: calc(var(--spacing) * 5);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    padding: 0;
    color: var(--sidebar-foreground);
    outline: none;
    -moz-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -o-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -webkit-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    -ms-transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
    transition: transform var(--default-transition-duration) var(--default-transition-timing-function);
}

[data-slot="sidebar-menu-action"]::after{
    content: "\"\"";
    position: absolute;
    inset: calc(var(--spacing) * -2);
}

[data-slot="sidebar-menu-action"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring);
    box-shadow: 0 0 0 2px var(--sidebar-ring);
}

[data-slot="sidebar-menu-action"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
}

[data-slot="sidebar-menu-button"][data-size="sm"] ~ [data-slot="sidebar-menu-action"]{
    top: calc(var(--spacing) * 1);
}

[data-slot="sidebar-menu-button"][data-size="sm"] ~ [data-slot="sidebar-menu-badge"]{
    top: calc(var(--spacing) * 1);
}

[data-slot="sidebar-menu-button"][data-size="default"] ~ [data-slot="sidebar-menu-action"]{
    top: calc(var(--spacing) * 1.5);
}

[data-slot="sidebar-menu-button"][data-size="default"] ~ [data-slot="sidebar-menu-badge"]{
    top: calc(var(--spacing) * 1.5);
}

[data-slot="sidebar-menu-button"][data-size="lg"] ~ [data-slot="sidebar-menu-action"]{
    top: calc(var(--spacing) * 2.5);
}

[data-slot="sidebar-menu-button"][data-size="lg"] ~ [data-slot="sidebar-menu-badge"]{
    top: calc(var(--spacing) * 2.5);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-action"]{
    display: none;
}

[data-slot="sidebar-menu-button"][data-active="true"] ~ [data-slot="sidebar-menu-action"][data-show-on-hover="true"]{
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-action"][data-show-on-hover="true"][data-state="open"]{
    opacity: 1;
}

[data-slot="sidebar-menu-item"]:focus-within [data-slot="sidebar-menu-action"][data-show-on-hover="true"]{
    opacity: 1;
}

[data-slot="sidebar-menu-badge"]{
    box-sizing: border-box;
    pointer-events: none;
    position: absolute;
    right: calc(var(--spacing) * 1);
    display: flex;
    height: calc(var(--spacing) * 5);
    min-width: calc(var(--spacing) * 5);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing) * 1);
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
    font-weight: var(--font-weight-medium);
    color: var(--sidebar-foreground);
    font-variant-numeric: tabular-nums;
    -moz-user-select: none;
    -o-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[data-slot="sidebar-menu-button"][data-active="true"] ~ [data-slot="sidebar-menu-badge"]{
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-badge"]{
    display: none;
}

[data-slot="sidebar-menu-skeleton"]{
    box-sizing: border-box;
    display: flex;
    height: calc(var(--spacing) * 8);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing) * 2);
}

[data-slot="sidebar-menu-skeleton"] > [data-sidebar="menu-skeleton-icon"]{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    border-radius: var(--radius-md);
}

[data-slot="sidebar-menu-skeleton"] > [data-sidebar="menu-skeleton-text"]{
    --skeleton-width: 70%;
    height: calc(var(--spacing) * 4);
    max-width: var(--skeleton-width);
    flex: 1 1 0%;
}

[data-slot="sidebar-menu-sub"]{
    box-sizing: border-box;
    margin-block: 0;
    margin-inline: calc(var(--spacing) * 3.5);
    display: flex;
    min-width: 0;
    -moz-transform: translateX(1px);
    -o-transform: translateX(1px);
    -webkit-transform: translateX(1px);
    -ms-transform: translateX(1px);
    transform: translateX(1px);
    flex-direction: column;
    gap: calc(var(--spacing) * 1);
    border-left: 1px solid var(--sidebar-border);
    padding-inline: calc(var(--spacing) * 2.5);
    padding-block: calc(var(--spacing) * 0.5);
    list-style: none;
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-sub"]{
    display: none;
}

[data-slot="sidebar-menu-sub-item"]{
    position: relative;
    list-style: none;
}

[data-slot="sidebar-menu-sub-button"]{
    box-sizing: border-box;
    margin: 0;
    border: 0;
    background-color: transparent;
    color: inherit;
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    display: flex;
    height: calc(var(--spacing) * 7);
    min-width: 0;
    -moz-transform: translateX(-1px);
    -o-transform: translateX(-1px);
    -webkit-transform: translateX(-1px);
    -ms-transform: translateX(-1px);
    transform: translateX(-1px);
    align-items: center;
    gap: calc(var(--spacing) * 2);
    overflow: hidden;
    border-radius: var(--radius-md);
    padding-inline: calc(var(--spacing) * 2);
    color: var(--sidebar-foreground);
    outline: none;
}

[data-slot="sidebar-menu-sub-button"]:focus-visible{
    -moz-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -o-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -webkit-box-shadow: 0 0 0 2px var(--sidebar-ring);
    -ms-box-shadow: 0 0 0 2px var(--sidebar-ring);
    box-shadow: 0 0 0 2px var(--sidebar-ring);
}

[data-slot="sidebar-menu-sub-button"]:active{
    background-color: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-sub-button"]:disabled{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="sidebar-menu-sub-button"][aria-disabled="true"]{
    pointer-events: none;
    opacity: 50%;
}

[data-slot="sidebar-menu-sub-button"] > span:last-child{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-slot="sidebar-menu-sub-button"] > svg{
    width: calc(var(--spacing) * 4);
    height: calc(var(--spacing) * 4);
    flex-shrink: 0;
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-sub-button"][data-active="true"]{
    background-color: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
}

[data-slot="sidebar-menu-sub-button"][data-size="sm"]{
    font-size: var(--text-xs);
    line-height: var(--text-xs--line-height);
}

[data-slot="sidebar-menu-sub-button"][data-size="md"]{
    font-size: var(--text-sm);
    line-height: var(--text-sm--line-height);
}

[data-slot="sidebar"][data-collapsible="icon"] [data-slot="sidebar-menu-sub-button"]{
    display: none;
}

@media (min-width: 768px){
    [data-slot="sidebar-group-action"]::after{
        display: none;
    }
    [data-slot="sidebar-menu-action"]::after{
        display: none;
    }
    [data-slot="sidebar-menu-action"][data-show-on-hover="true"]{
        opacity: 0;
    }
}

@media (hover: hover){
    [data-slot="sidebar-rail"]:hover::after{
        background-color: var(--sidebar-border);
    }
    [data-slot="sidebar"][data-collapsible="offcanvas"] [data-slot="sidebar-rail"]:hover{
        background-color: var(--sidebar);
    }
    [data-slot="sidebar-group-action"]:hover{
        background-color: var(--sidebar-accent);
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-button"]:hover{
        background-color: var(--sidebar-accent);
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-button"][data-state="open"]:hover{
        background-color: var(--sidebar-accent);
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-button"][data-variant="outline"]:hover{
        -moz-box-shadow: 0 0 0 1px var(--sidebar-accent);
        -o-box-shadow: 0 0 0 1px var(--sidebar-accent);
        -webkit-box-shadow: 0 0 0 1px var(--sidebar-accent);
        -ms-box-shadow: 0 0 0 1px var(--sidebar-accent);
        box-shadow: 0 0 0 1px var(--sidebar-accent);
    }
    [data-slot="sidebar-menu-button"]:hover ~ [data-slot="sidebar-menu-action"]{
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-button"]:hover ~ [data-slot="sidebar-menu-badge"]{
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-action"]:hover{
        background-color: var(--sidebar-accent);
        color: var(--sidebar-accent-foreground);
    }
    [data-slot="sidebar-menu-item"]:hover [data-slot="sidebar-menu-action"][data-show-on-hover="true"]{
        opacity: 1;
    }
    [data-slot="sidebar-menu-sub-button"]:hover{
        background-color: var(--sidebar-accent);
        color: var(--sidebar-accent-foreground);
    }
}
[data-slot="container"]{
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    margin-inline: auto;
}

[data-slot="container"][data-size="sm"]{
    max-width: var(--container-sm);
}

[data-slot="container"][data-size="md"]{
    max-width: var(--container-md);
}

[data-slot="container"][data-size="lg"]{
    max-width: var(--container-lg);
}

[data-slot="container"][data-size="full"]{
    max-width: none;
}
[data-slot="stack"]{
    display: flex;
    flex-direction: column;
    min-width: 0;
}

[data-slot="stack"][data-gap="none"]{
    gap: 0;
}

[data-slot="stack"][data-gap="xs"]{
    gap: calc(var(--spacing) * 1);
}

[data-slot="stack"][data-gap="sm"]{
    gap: calc(var(--spacing) * 2);
}

[data-slot="stack"][data-gap="md"]{
    gap: calc(var(--spacing) * 4);
}

[data-slot="stack"][data-gap="lg"]{
    gap: calc(var(--spacing) * 8);
}

[data-slot="stack"][data-align="stretch"]{
    align-items: stretch;
}

[data-slot="stack"][data-align="start"]{
    align-items: flex-start;
}

[data-slot="stack"][data-align="center"]{
    align-items: center;
}

[data-slot="stack"][data-align="end"]{
    align-items: flex-end;
}
[data-slot="text-input"]{
    -moz-appearance: none;
    -o-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    font-size: var(--text-sm);
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    color: var(--foreground);
    background: var(--background);
    border: 1px solid var(--input);
    border-radius: var(--radius);
}

[data-slot="text-input"]::-webkit-search-decoration{
    -webkit-appearance: none;
}

[data-slot="text-input"]::-webkit-search-cancel-button{
    -webkit-appearance: none;
}

[data-slot="text-input"]::placeholder{
    color: var(--muted-foreground);
}

[data-slot="text-input"]:focus-visible{
    outline: none;
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="text-input"][data-size="sm"]{
    height: 1.75rem;
    padding: 0 .375rem;
}

[data-slot="text-input"][data-size="md"]{
    height: 2.25rem;
    padding: 0 .5rem;
}
[data-slot="kit-badge"]{
    display: inline-flex;
    align-items: center;
    height: 1.25rem;
    padding: 0 .5rem;
    border-radius: var(--radius);
    font-size: var(--text-xs);
    font-weight: var(--font-weight-medium);
    white-space: nowrap;
}

[data-slot="kit-badge"][data-variant="default"]{
    background: var(--secondary);
    color: var(--secondary-foreground);
}

[data-slot="kit-badge"][data-variant="muted"]{
    background: transparent;
    color: var(--muted-foreground);
    -moz-box-shadow: inset 0 0 0 1px var(--border);
    -o-box-shadow: inset 0 0 0 1px var(--border);
    -webkit-box-shadow: inset 0 0 0 1px var(--border);
    -ms-box-shadow: inset 0 0 0 1px var(--border);
    box-shadow: inset 0 0 0 1px var(--border);
}

[data-slot="kit-badge"][data-variant="destructive"]{
    background: color-mix(in oklch, var(--destructive) 12%, transparent);
    color: var(--destructive);
}

[data-slot="kit-badge"][data-variant="ok"]{
    background: color-mix(in oklch, var(--badge-ok) 12%, transparent);
    color: var(--badge-ok);
}

[data-slot="kit-badge"][data-variant="warn"]{
    background: color-mix(in oklch, var(--badge-warn) 12%, transparent);
    color: var(--badge-warn);
}

[data-slot="kit-badge"][data-variant="authority"]{
    background: color-mix(in oklch, var(--status-ready) 16%, transparent);
    color: var(--status-ready);
}

[data-slot="kit-badge"][data-variant="qa"]{
    background: color-mix(in oklch, var(--status-in-review) 16%, transparent);
    color: var(--status-in-review);
}

[data-slot="kit-badge"][data-status]::before{
    content: "";
    width: .5rem;
    height: .5rem;
    margin-right: .375rem;
    border-radius: 50%;
    flex: none;
    border: 1.5px solid currentColor;
}

[data-slot="kit-badge"][data-status="to_triage"]::before{
    color: var(--status-to-triage);
}

[data-slot="kit-badge"][data-status="backlog"]::before{
    color: var(--status-backlog);
}

[data-slot="kit-badge"][data-status="ready"]::before{
    color: var(--status-ready);
}

[data-slot="kit-badge"][data-status="in_progress"]::before{
    color: var(--status-in-progress);
}

[data-slot="kit-badge"][data-status="in_review"]::before{
    color: var(--status-in-review);
}

[data-slot="kit-badge"][data-status="done"]::before{
    color: var(--status-done);
}
[data-slot="chip"]{
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    border-radius: 9999px;
    padding: .125rem .625rem;
    font-size: var(--text-xs);
    border: 1px solid;
}

[data-slot="chip"][data-tone="amber"]{
    --amber: oklch(0.75 0.15 80);
    border-color: color-mix(in oklch, var(--amber) 45%, transparent);
    background: color-mix(in oklch, var(--amber) 12%, var(--background));
    color: color-mix(in oklch, var(--amber) 70%, var(--foreground));
}

[data-slot="chip"] svg{
    width: .75rem;
    height: .75rem;
}
[data-slot="page-head"]{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

[data-slot="page-head"]:not(.detail-head) h1{
    margin: 0;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-semibold);
}

[data-slot="page-head"].detail-head h1{
    margin: 0;
    font-weight: var(--font-weight-semibold);
}

[data-slot="page-head"] p{
    margin: 0;
    font-size: var(--text-xs);
    color: var(--muted-foreground);
}

[data-slot="page-head-actions"]{
    display: flex;
    align-items: center;
    gap: .25rem;
    flex-shrink: 0;
}
[data-slot="back-link"]{
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin: 0 0 .75rem;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
    color: var(--foreground);
    text-decoration: none;
}

[data-slot="back-link"]:hover{
    text-decoration: underline;
    text-underline-offset: 3px;
}

[data-slot="back-link"] svg{
    width: 1rem;
    height: 1rem;
    flex-shrink: 0;
}
[data-slot="muted"]{
    color: var(--muted-foreground);
    font-size: var(--text-sm);
}

[data-slot="kit-empty"]{
    color: var(--muted-foreground);
}
[data-slot="code-block"]{
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.5;
    margin: .5rem 0 0;
    padding: .6rem .7rem;
    background: var(--muted);
    border-radius: var(--radius);
    overflow-x: auto;
    overflow-y: auto;
    white-space: pre;
    max-height: 22rem;
}

[data-slot="code-block"][data-truncated]::after{
    content: "\"… truncated\"";
    display: block;
    margin-top: .5rem;
    color: var(--muted-foreground);
    font-style: italic;
}
[data-slot="disclosure"] > summary{
    list-style: none;
    cursor: pointer;
}

[data-slot="disclosure"] > summary::-webkit-details-marker{
    display: none;
}

[data-slot="disclosure"][data-variant="button"] > summary{
    display: inline-block;
}

[data-slot="disclosure"][data-variant="quiet"] > summary{
    color: var(--muted-foreground);
    font-size: var(--text-xs);
    margin-top: .35rem;
}

[data-slot="disclosure"][data-variant="quiet"] > summary:hover{
    color: var(--foreground);
}
[data-slot="kit-field"]{
    display: flex;
    flex-direction: column;
    gap: .375rem;
    min-width: 0;
}

[data-slot="kit-field"] > label{
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
}

[data-slot="kit-field"] > :where(input, textarea, select){
    font: inherit;
    font-size: var(--text-sm);
    padding: .375rem .5rem;
    border: 1px solid var(--input);
    border-radius: var(--radius);
    background: var(--background);
    color: var(--foreground);
}

[data-slot="kit-field"] > :where(input, textarea, select):focus-visible{
    outline: none;
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="kit-field"] > select{
    box-sizing: border-box;
    height: calc(var(--text-sm--line-height) + .75rem + 2px);
    padding-block: 0;
    align-content: center;
}

[data-slot="kit-field"] > [data-slot="select"]{
    width: 100%;
}

[data-slot="kit-field"] > [data-slot="select"] > [data-slot="select-trigger"]{
    width: 100%;
    height: calc(var(--text-sm--line-height) + .75rem + 2px);
    padding: .375rem .5rem;
    border-radius: var(--radius);
    background: var(--background);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="kit-field"] > [data-slot="select"] > [data-slot="select-trigger"]:focus-visible{
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="kit-field"] > [data-slot="combobox"]{
    display: block;
    width: 100%;
}

[data-slot="kit-field"] > [data-slot="combobox"] [data-slot="input-group"]{
    width: 100%;
    height: calc(var(--text-sm--line-height) + .75rem + 2px);
    border-radius: var(--radius);
    background: var(--background);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="kit-field"] > [data-slot="combobox"] [data-slot="input-group"]:focus-within{
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="kit-field"] > [data-slot="combobox"] [data-slot="input-group-input"]{
    padding-inline: .5rem;
    font-size: var(--text-sm);
}

[data-slot="kit-select"]{
    font: inherit;
    font-size: var(--text-sm);
    line-height: 1.25;
    height: 1.75rem;
    box-sizing: border-box;
    padding: 0 .375rem;
    align-content: center;
    border: 1px solid var(--input);
    border-radius: var(--radius);
    background: var(--background);
    color: var(--foreground);
}
[data-slot="settings-group"]{
    display: flex;
    flex-direction: column;
}

[data-slot="settings-row"]{
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .75rem 0;
    border-bottom: 1px solid var(--border);
}

[data-slot="settings-row-label"]{
    display: flex;
    flex-direction: column;
    gap: .125rem;
    min-width: 0;
}

[data-slot="settings-row-label"] > label{
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
}

[data-slot="settings-row-note"]{
    font-size: var(--text-xs);
    color: var(--muted-foreground);
}

[data-slot="settings-row-control"]{
    margin-left: auto;
    flex-shrink: 0;
}

[data-slot="settings-input"]{
    width: 14rem;
    font: inherit;
    font-size: var(--text-sm);
    padding: .375rem .5rem;
    border: 1px solid var(--input);
    border-radius: var(--radius);
    background: var(--background);
    color: var(--foreground);
}

[data-slot="settings-input"]::placeholder{
    color: var(--muted-foreground);
}

[data-slot="settings-input"]:focus-visible{
    outline: none;
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="settings-input"][data-wide]{
    width: 22rem;
}

@media (max-width: 640px){
    [data-slot="settings-row"]{
        flex-direction: column;
        align-items: stretch;
        gap: .5rem;
    }
    [data-slot="settings-row-control"]{
        margin-left: 0;
    }
    [data-slot="settings-input"], [data-slot="settings-input"][data-wide]{
        width: 100%;
    }
}

[data-slot="settings-form"]{
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

[data-slot="settings-actions"]{
    display: flex;
    gap: .5rem;
}

[data-slot="settings-block"]{
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

[data-slot="settings-block"] > h3{
    margin: 0;
    font-size: 1rem;
    font-weight: var(--font-weight-medium);
}

[data-slot="settings-block-note"]{
    margin: 0 0 .5rem;
    font-size: var(--text-sm);
    color: var(--muted-foreground);
}

[data-slot="settings-textarea"]{
    width: 100%;
    min-height: 7rem;
    font: inherit;
    font-size: var(--text-sm);
    padding: .5rem;
    border: 1px solid var(--input);
    border-radius: var(--radius);
    background: var(--background);
    color: var(--foreground);
    line-height: var(--leading-normal);
    resize: vertical;
}

[data-slot="settings-textarea"]::placeholder{
    color: var(--muted-foreground);
}

[data-slot="settings-textarea"]:focus-visible{
    outline: none;
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}
[data-slot="status-line"]{
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .6rem .75rem;
    margin-bottom: 1rem;
    border-radius: var(--radius);
    font-size: var(--text-sm);
}

[data-slot="status-line"][data-state="working"]{
    background: var(--muted);
    color: var(--foreground);
}

[data-slot="status-line"][data-state="waiting"]{
    background: color-mix(in oklch, var(--primary) 10%, transparent);
    color: var(--foreground);
    -moz-box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--primary) 35%, transparent);
    -o-box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--primary) 35%, transparent);
    -webkit-box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--primary) 35%, transparent);
    -ms-box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--primary) 35%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--primary) 35%, transparent);
}

[data-slot="status-line"][data-state="failed"]{
    background: color-mix(in oklch, var(--destructive) 10%, transparent);
    color: var(--destructive);
}

[data-slot="pulse"]{
    width: .5rem;
    height: .5rem;
    border-radius: 50%;
    background: currentcolor;
    animation: ui-pulse 1.4s ease-in-out infinite;
}

@keyframes ui-pulse{
    0%, 100%{
        opacity: 1;
    }
    50%{
        opacity: 0.25;
    }
}

[data-slot="chat-log"]{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}

[data-slot="chat-log"] + [data-slot="status-line"]{
    margin: .75rem 0 0;
}

[data-slot="chat-turn"]{
    padding: .6rem .75rem;
    border-radius: var(--radius);
    font-size: var(--text-sm);
}

[data-slot="chat-turn"][data-from="user"]{
    background: var(--muted);
    margin-left: 1.5rem;
}

[data-slot="chat-turn"][data-from="assistant"]{
    border: 1px solid var(--border);
    margin-right: 1.5rem;
}

[data-slot="chat-who"]{
    font-size: var(--text-xs);
    color: var(--muted-foreground);
    margin-bottom: .15rem;
}

[data-slot="chat-line"]:empty{
    height: .7em;
}

[data-slot="chat-live-text"]{
    white-space: pre-wrap;
}

[data-slot="chat-live-text"]{
    display: inline;
}

[data-slot="chat-caret"]{
    display: inline-block;
    width: .45em;
    height: 1em;
    margin-left: 2px;
    vertical-align: text-bottom;
    background: currentcolor;
    animation: ui-pulse 1s steps(2, start) infinite;
}

[data-slot="chat-tool"]{
    margin-right: 1.5rem;
    font-size: var(--text-sm);
}

[data-slot="chat-tool"] > [data-slot="approval-card"]{
    margin-bottom: 0;
}

[data-slot="chat-tool"] > [data-slot="disclosure"] > summary{
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: 0;
}

[data-slot="chat-tool"] > [data-slot="disclosure"] > summary > [data-slot="tool-name"]{
    color: var(--foreground);
}

[data-slot="chat-tool"] [data-slot="code-block"]{
    max-height: 14rem;
}
[data-slot="titled-section"] + [data-slot="titled-section"]{
    margin-top: 1.5rem;
}

[data-slot="titled-section"] > h2{
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
    margin: 0 0 .5rem;
}

[data-slot="approval-card"]{
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: .875rem;
    margin-bottom: .75rem;
    background: var(--background);
}

[data-slot="approval-head"]{
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .5rem;
}

[data-slot="tool-name"]{
    font-family: var(--font-mono);
    font-size: var(--text-sm);
}

[data-slot="approval-head"] > [data-slot="tool-name"]{
    font-weight: var(--font-weight-medium);
}

[data-slot="approval-actions"]{
    display: flex;
    gap: .5rem;
    margin-top: .75rem;
}

[data-slot="feed"]{
    list-style: none;
    margin: 0;
    padding: 0;
}

[data-slot="feed"] > li{
    padding: .6rem 0;
    border-bottom: 1px solid var(--border);
}

[data-slot="feed"] > li:last-child{
    border-bottom: 0;
}

[data-slot="feed-head"]{
    display: flex;
    align-items: center;
    gap: .5rem;
}

[data-slot="feed-head"] > time{
    margin-left: auto;
    color: var(--muted-foreground);
    font-size: var(--text-xs);
    font-family: var(--font-mono);
}

[data-slot="feed-note"]{
    color: var(--muted-foreground);
    font-size: var(--text-sm);
    margin-top: .25rem;
}

[data-slot="feed-note"][data-tone="plain"]{
    color: var(--muted-foreground);
}

[data-slot="feed-note"][data-tone="error"]{
    color: var(--destructive);
}

[data-slot="preview"]{
    display: flex;
    flex-direction: column;
    gap: .6rem;
    margin: .25rem 0 .75rem;
}

[data-slot="preview-label"]{
    font-size: var(--text-xs);
    color: var(--muted-foreground);
    margin-bottom: .1rem;
}

[data-slot="preview-sentence"]{
    font-size: var(--text-sm);
    color: var(--foreground);
}

[data-slot="preview"] + [data-slot="disclosure"] > summary{
    margin-top: 0;
}

[data-slot="proposal-aside"]{
    display: none;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .6rem .75rem;
    border: 1px dashed var(--border);
    border-radius: var(--radius);
    color: var(--muted-foreground);
    font-size: var(--text-sm);
}

[data-slot="agent-bar"] [data-slot="proposal-aside"]{
    display: flex;
    background: var(--background);
}

[data-slot="agent-bar"] [data-slot="chat-tool"][data-proposed] > [data-slot="approval-card"]{
    display: none;
}
[data-slot="workbench"]{
    display: flex;
    height: 100svh;
    overflow: hidden;
    background: var(--background);
    --rail-ink: color-mix(in oklch, var(--muted-foreground) 65%, var(--sidebar-foreground));
    --sidebar-width: 11.5rem;
}

html.sidebar-collapsed [data-slot="workbench"]{
    --sidebar-width: 48px;
}

[data-slot="kit-sidebar"]{
    background: var(--sidebar);
    width: var(--sidebar-width);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-right: 1px solid var(--border);
    -moz-transition: width 200ms ease;
    -o-transition: width 200ms ease;
    -webkit-transition: width 200ms ease;
    -ms-transition: width 200ms ease;
    transition: width 200ms ease;
}

[data-slot="sidebar-head"]{
    height: 3rem;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    padding: 0 12px;
}

[data-slot="brand"]{
    display: flex;
    align-items: center;
    gap: 6px;
    height: 28px;
    padding: 0 6px 0 4px;
    border-radius: var(--radius);
    font-size: var(--text-sm);
    font-weight: 550;
    letter-spacing: -.1px;
    color: var(--sidebar-foreground);
    text-decoration: none;
    min-width: 0;
}

[data-slot="brand"]:hover{
    background: var(--sidebar-accent);
}

[data-slot="brand-name"]{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-slot="kit-avatar"]{
    --avatar-hue: 250;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: var(--radius);
    font-size: 10px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
    letter-spacing: 0;
    color: oklch(.98 0 0);
    background: oklch(.62 .13 var(--avatar-hue, 250));
}

[data-slot="kit-avatar"][data-variant="workspace"]{
    width: 20px;
    height: 20px;
}

[data-slot="kit-avatar"][data-variant="team"]{
    width: 16px;
    height: 16px;
    font-size: 8px;
    background: var(--foreground);
    color: var(--background);
}

[data-slot="sidebar-nav"]{
    display: flex;
    flex-direction: column;
    padding: 4px 0;
    overflow-y: auto;
    min-height: 0;
    flex: 1;
}

[data-slot="nav-rows"]{
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 0 12px;
}

[data-slot="nav-rows"][data-variant="section"]{
    padding: 0 12px;
}

[data-slot="nav-rows"][data-variant="subgroup"]{
    padding: 0 0 0 8px;
}

[data-slot="nav-section"]{
    display: flex;
    flex-direction: column;
    margin-top: 18px;
}

[data-slot="nav-section-header"]{
    display: flex;
    align-items: center;
    margin: 0 12px;
}

[data-slot="nav-section-head"]{
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 2px;
    height: 28px;
    padding: 0 5px;
    border: 0;
    background: none;
    border-radius: var(--radius);
    font: inherit;
    font-size: var(--text-xs);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
    cursor: pointer;
    text-align: left;
}

[data-slot="nav-section-head"]:hover{
    background: var(--sidebar-accent);
}

[data-slot="nav-section-header"] .nav-section-add{
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    background: none;
    border-radius: var(--radius);
    color: var(--muted-foreground);
    cursor: pointer;
    text-decoration: none;
    opacity: 0;
    -moz-transition: opacity 120ms ease;
    -o-transition: opacity 120ms ease;
    -webkit-transition: opacity 120ms ease;
    -ms-transition: opacity 120ms ease;
    transition: opacity 120ms ease;
}

[data-slot="nav-section-header"] .nav-section-add svg{
    width: 14px;
    height: 14px;
}

[data-slot="nav-section-header"] .nav-section-add:hover{
    background: var(--sidebar-accent);
    color: var(--sidebar-foreground);
}

[data-slot="nav-section-header"]:hover .nav-section-add, [data-slot="nav-section-header"] .nav-section-add:focus-visible{
    opacity: 1;
}

[data-slot="nav-section-body"]{
    display: grid;
    grid-template-rows: 1fr;
    min-height: 0;
    -moz-transition: grid-template-rows 160ms ease, opacity 160ms ease;
    -o-transition: grid-template-rows 160ms ease, opacity 160ms ease;
    -webkit-transition: grid-template-rows 160ms ease, opacity 160ms ease;
    -ms-transition: grid-template-rows 160ms ease, opacity 160ms ease;
    transition: grid-template-rows 160ms ease, opacity 160ms ease;
}

[data-slot="nav-section-body"] > *{
    overflow: hidden;
}

[data-open="0"] > [data-slot="nav-section-body"]{
    grid-template-rows: 0fr;
    opacity: 0;
}

[data-slot="nav-chevron"]{
    display: inline-flex;
    width: 12px;
    height: 12px;
    color: var(--muted-foreground);
    -moz-transition: transform 160ms ease, opacity 120ms ease;
    -o-transition: transform 160ms ease, opacity 120ms ease;
    -webkit-transition: transform 160ms ease, opacity 120ms ease;
    -ms-transition: transform 160ms ease, opacity 120ms ease;
    transition: transform 160ms ease, opacity 120ms ease;
}

[data-slot="nav-chevron"] svg{
    width: 12px;
    height: 12px;
    stroke-width: 2.5;
}

[data-open="1"] > [data-slot="nav-section-header"] > [data-slot="nav-section-head"] [data-slot="nav-chevron"], [data-open="1"] > [data-slot="nav-section-head"][data-level="subgroup"] [data-slot="nav-chevron"], [data-open="1"] > [data-slot="nav-team-row"] [data-slot="nav-disclosure"] [data-slot="nav-chevron"]{
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

[data-slot="nav-section-head"] [data-slot="nav-chevron"]{
    opacity: 0;
}

[data-slot="nav-section-head"]:hover [data-slot="nav-chevron"], [data-slot="nav-section-head"]:focus-visible [data-slot="nav-chevron"]{
    opacity: 1;
}

[data-slot="nav-subgroup"]{
    margin-top: 10px;
}

[data-slot="nav-rows"] > [data-slot="nav-subgroup"]:first-child{
    margin-top: 2px;
}

[data-slot="nav-section-head"][data-level="subgroup"]{
    width: 100%;
    height: 24px;
}

[data-slot="nav-section-head"][data-level="section"]{
    height: 28px;
}

[data-slot="nav-team-row"]{
    display: flex;
    align-items: center;
    border-radius: var(--radius);
}

[data-slot="nav-team-row"]:hover, [data-slot="nav-team-row"].active{
    background: var(--sidebar-accent);
}

[data-slot="nav-team-row"] > [data-slot="nav-tab"]{
    flex: 1;
    min-width: 0;
    margin: 0;
    padding-left: 5px;
    padding-right: 2px;
    background: none;
}

[data-slot="nav-team-row"] > [data-slot="nav-tab"].active, [data-slot="nav-team-row"] > [data-slot="nav-tab"]:hover{
    background: none;
}

[data-slot="nav-disclosure"]{
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 20px;
    height: 28px;
    margin-right: 4px;
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
    opacity: 0;
    -moz-transition: opacity 120ms ease;
    -o-transition: opacity 120ms ease;
    -webkit-transition: opacity 120ms ease;
    -ms-transition: opacity 120ms ease;
    transition: opacity 120ms ease;
}

[data-slot="nav-team-row"]:hover [data-slot="nav-disclosure"], [data-slot="nav-disclosure"]:focus-visible, [data-open="1"] > [data-slot="nav-team-row"] [data-slot="nav-disclosure"]{
    opacity: 1;
}

[data-slot="nav-team"] [data-slot="nav-rows"]{
    padding-left: 12px;
    padding-right: 0;
}

[data-slot="nav-tab"]{
    display: flex;
    gap: 8px;
    align-items: center;
    height: 28px;
    padding: 0 9px 0 5px;
    border: 0;
    border-radius: var(--radius);
    background: none;
    font: inherit;
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
    color: var(--rail-ink);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    text-align: left;
}

[data-slot="nav-tab"][data-place="row"]{
    padding: 0 9px 0 5px;
}

[data-slot="nav-tab"][data-place="team-link"]{
    background: none;
}

[data-slot="nav-tab"]:hover{
    background: var(--sidebar-accent);
    color: var(--sidebar-foreground);
}

[data-slot="nav-tab"].active{
    background: var(--sidebar-accent);
    color: var(--sidebar-accent-foreground);
}

[data-slot="nav-tab"] svg{
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

[data-slot="tab-label"]{
    overflow: hidden;
    text-overflow: ellipsis;
}

[data-slot="nav-count"]{
    margin-left: auto;
    padding: 0 .375rem;
    border-radius: 999px;
    background: var(--sidebar-accent);
    color: var(--sidebar-foreground);
    font-size: var(--text-2xs);
    line-height: 1.4;
}

[data-slot="sidebar-foot"]{
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 8px 12px;
    margin-top: auto;
}

html.sidebar-collapsed [data-slot="tab-label"], html.sidebar-collapsed [data-slot="brand-name"], html.sidebar-collapsed [data-slot="nav-section-head"], html.sidebar-collapsed [data-slot="nav-disclosure"], html.sidebar-collapsed [data-slot="nav-count"], html.sidebar-collapsed [data-slot="nav-team"] [data-slot="nav-section-body"], html.sidebar-collapsed [data-slot="nav-tab"][data-place="child"]{
    display: none;
}

html.sidebar-collapsed [data-slot="nav-subgroup"]{
    margin-top: 0;
}

html.sidebar-collapsed [data-slot="nav-rows"][data-variant="subgroup"]{
    padding-left: 0;
}

html.sidebar-collapsed [data-slot="nav-subgroup"][data-open="0"] > [data-slot="nav-section-body"]{
    grid-template-rows: 1fr;
    opacity: 1;
}

[data-slot="frame"]{
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    --search-width: 26rem;
}

[data-slot="topbar"]{
    position: sticky;
    top: 0;
    z-index: 10;
    height: 3rem;
    flex-shrink: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: 0 1rem;
    background: color-mix(in oklch, var(--sidebar) 95%, transparent);
    backdrop-filter: blur(8px);
}

[data-slot="topbar-right"]{
    justify-self: end;
    display: flex;
    align-items: center;
    gap: .75rem;
}

[data-role="sidebar-trigger"]{
    justify-self: start;
    margin-left: -.25rem;
    padding: 0 .375rem;
}

[data-role="sidebar-trigger"] svg{
    width: 1rem;
    height: 1rem;
}

[data-role="theme-toggle"]{
    padding: 0 .375rem;
    color: var(--rail-ink);
}

[data-role="theme-toggle"] svg{
    width: 1rem;
    height: 1rem;
}

[data-slot="theme-glyph"]{
    display: none;
}

[data-slot="theme-glyph"][data-to="dark"]{
    display: inline-flex;
}

html.dark [data-slot="theme-glyph"][data-to="dark"]{
    display: none;
}

html.dark [data-slot="theme-glyph"][data-to="light"]{
    display: inline-flex;
}

[data-slot="plane-wrap"]{
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 0 .5rem .5rem;
    min-width: 0;
    min-height: 0;
}

[data-slot="plane"]{
    flex: 1;
    min-width: 0;
    background: var(--background);
    border-radius: var(--radius);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

[data-slot="plane"][data-layout="default"]{
    padding: 1.5rem;
}

[data-slot="plane"][data-layout="flush"]{
    padding: 0;
}

[data-slot="plane"][data-layout="split"]{
    background: none;
    padding: 0;
    overflow: hidden;
    flex-direction: row;
    gap: .5rem;
}

[data-slot="plane-pane"]{
    flex: 1;
    min-width: 0;
    min-height: 0;
    background: var(--background);
    border-radius: var(--radius);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

[data-slot="plane-pane"][data-size="even"]{
    flex: 1;
}

[data-slot="plane-pane"][data-size="wide"]{
    flex: 2;
}

[data-slot="plane-pane"][data-size="narrow"]{
    flex: 1;
}

[data-slot="plane-pane"][data-size="rail"]{
    flex: none;
    width: 14rem;
    padding: 1rem 0;
}

[data-slot="plane-pane"][data-size="board"]{
    padding: 0;
    overflow: hidden;
}

@media (max-width: 60rem){
    [data-slot="plane"][data-layout="split"]{
        flex-direction: column;
    }
    [data-slot="plane-pane"][data-size="wide"], [data-slot="plane-pane"][data-size="narrow"]{
        flex: 1;
    }
    [data-slot="plane-pane"][data-size="narrow"]{
        order: -1;
    }
    [data-slot="plane-pane"][data-size="rail"]{
        width: auto;
    }
}
[data-slot="search-form"]{
    position: relative;
    justify-self: end;
    width: 100%;
    max-width: var(--search-width);
    display: flex;
    align-items: center;
    gap: .5rem;
    height: 2rem;
    margin: 0;
    padding: 0 .625rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--background);
}

[data-slot="search-form"]:focus-within{
    border-color: var(--muted-foreground);
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -webkit-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

[data-slot="search-form"] > svg{
    width: .875rem;
    height: .875rem;
    flex-shrink: 0;
    color: var(--muted-foreground);
}

[data-slot="search-form"] > input{
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    font: inherit;
    font-size: var(--text-sm);
    color: var(--foreground);
}

[data-slot="search-key"]{
    font-family: var(--font-mono);
    font-size: var(--text-2xs);
    color: var(--muted-foreground);
    border: 1px solid var(--border);
    border-radius: calc(var(--radius) / 2);
    padding: 0 .25rem;
}

[data-slot="search-form"]:focus-within [data-slot="search-key"]{
    display: none;
}

[data-slot="search-pop"]{
    position: absolute;
    top: 2.375rem;
    left: 0;
    right: 0;
    z-index: 30;
    display: flex;
    flex-direction: column;
    padding: .375rem;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    -moz-box-shadow: var(--shadow-pop);
    -o-box-shadow: var(--shadow-pop);
    -webkit-box-shadow: var(--shadow-pop);
    -ms-box-shadow: var(--shadow-pop);
    box-shadow: var(--shadow-pop);
    max-height: 60svh;
    overflow-y: auto;
}

[data-slot="search-pop"]:empty, [data-slot="search-form"]:not(:focus-within) [data-slot="search-pop"]{
    display: none;
}

[data-slot="search-group-title"]{
    padding: .375rem .5rem .125rem;
    font-size: var(--text-2xs);
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--muted-foreground);
}

[data-slot="search-hit"]{
    display: flex;
    align-items: baseline;
    gap: .5rem;
    padding: .375rem .5rem;
    border-radius: var(--radius);
    font-size: var(--text-sm);
    color: inherit;
    text-decoration: none;
}

[data-slot="search-hit"]:hover{
    background: var(--muted);
}

[data-slot="search-hit-title"]{
    flex-shrink: 0;
    font-weight: var(--font-weight-medium);
}

[data-slot="search-hit-desc"]{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-xs);
    color: var(--muted-foreground);
}

[data-slot="search-empty"]{
    margin: 0;
    padding: .5rem;
    font-size: var(--text-sm);
    color: var(--muted-foreground);
}

[data-slot="search-results"]{
    display: flex;
    flex-direction: column;
}
[data-slot="plane-wrap"]:has(> [data-slot="agent-bar"]){
    padding-bottom: 0;
}

[data-slot="agent-bar"]{
    margin: 0 -.5rem;
}

[data-slot="plane-wrap"] > [data-slot="plane"]:has(+ [data-slot="agent-bar"]){
    margin-bottom: .5rem;
}

[data-slot="agent-bar"]{
    --agent-tray-height: 2.5rem;
    --agent-row-height: 2.75rem;
    --agent-split: 60%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    --muted: var(--agent-panel-block);
    background: var(--agent-panel);
    border-top: 1px solid var(--input);
    border-radius: 0;
    overflow: hidden;
    color: var(--foreground);
    font-family: var(--font-mono-reading);
    font-size: var(--text-sm);
    letter-spacing: -0.02em;
}

[data-slot="agent-tray"]{
    height: var(--agent-tray-height);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 1rem 0 1.25rem;
    color: var(--muted-foreground);
    font-size: var(--text-xs);
}

[data-slot="agent-tray-open"]{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: auto;
    margin-left: -6px;
    padding: 4px 6px;
    border: 0;
    border-radius: var(--radius);
    background: none;
    color: var(--foreground);
    font: inherit;
    font-size: var(--text-sm);
    cursor: pointer;
}

[data-slot="agent-tray-open"]:hover, html.agent-open [data-slot="agent-tray-open"]{
    background: var(--muted);
}

[data-slot="agent-tray-open"] svg{
    width: 16px;
    height: 16px;
}

[data-slot="agent-tool"]{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 6px;
    border: 0;
    border-radius: var(--radius);
    background: none;
    color: inherit;
    cursor: pointer;
}

[data-slot="agent-tool"]:hover{
    background: var(--muted);
    color: var(--foreground);
}

[data-slot="agent-tool"] svg{
    width: 16px;
    height: 16px;
}

[data-slot="agent-panel"]{
    display: none;
    flex-direction: row;
    flex-shrink: 0;
    position: relative;
    height: 44vh;
    min-height: 0;
    overflow: hidden;
    border-bottom: 1px solid var(--border);
}

html.agent-open [data-slot="agent-panel"]{
    display: flex;
}

html.agent-full [data-slot="plane-wrap"] > [data-slot="plane"]{
    display: none;
}

html.agent-full [data-slot="agent-bar"]{
    flex: 1;
}

html.agent-full [data-slot="agent-panel"]{
    flex: 1;
    height: auto !important;
}

[data-slot="agent-grip"]{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 8px;
    cursor: ns-resize;
    z-index: 1;
}

html.agent-full [data-slot="agent-grip"]{
    display: none;
}

[data-slot="agent-column"]{
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

[data-slot="agent-column"][data-column="conversation"]{
    flex: 0 0 var(--agent-split);
}

[data-slot="agent-column"][data-column="activity"]{
    flex: 1 1 0;
    border-left: 1px solid var(--input);
}

[data-slot="agent-column-head"]{
    display: flex;
    align-items: center;
    gap: 8px;
    height: var(--agent-row-height);
    flex-shrink: 0;
    padding: 0 1rem 0 1.25rem;
    border-bottom: 1px solid var(--border);
}

[data-slot="agent-column-title"]{
    flex: 1;
    margin: 0;
    font-size: var(--text-xs);
    font-weight: var(--font-weight-medium);
    color: var(--muted-foreground);
}

[data-slot="agent-head-tools"]{
    display: flex;
    align-items: center;
    gap: 2px;
    margin-right: -6px;
    color: var(--muted-foreground);
}

.agent-conversation-switch{
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    margin-left: -6px;
    padding: 4px 6px;
    border: 0;
    border-radius: var(--radius);
    background: none;
    color: var(--foreground);
    font: inherit;
    cursor: pointer;
}

.agent-conversation-switch:hover{
    background: var(--muted);
}

[data-slot="agent-conversation-switch-face"]{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

[data-slot="agent-conversation-switch-face"] svg{
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--muted-foreground);
}

[data-slot="agent-conversation-title"]{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: var(--font-weight-medium);
}

[data-slot="agent-column-body"]{
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1.25rem 1.25rem 1.5rem;
}

[data-slot="agent-column-body"] [data-slot="chat-turn"][data-from="assistant"]{
    margin-right: 0;
    padding: .25rem 0 .5rem;
    border: 0;
}

[data-slot="agent-column-body"] [data-slot="chat-turn"][data-from="user"]{
    margin-left: 0;
    margin-right: 20%;
}

[data-slot="agent-column-body"] [data-slot="chat-tool"]{
    margin-right: 0;
}

[data-slot="agent-column-body"] [data-slot="chat-log"]{
    gap: .75rem;
}

[data-slot="agent-prompt-line"]{
    display: flex;
    align-items: center;
    gap: 8px;
    height: var(--agent-row-height);
    flex-shrink: 0;
    margin: 0;
    padding: 0 1.25rem;
    border-top: 1px solid var(--border);
    font-size: var(--text-sm);
}

[data-slot="agent-prompt"]{
    color: var(--muted-foreground);
}

[data-slot="agent-prompt-line"] > input{
    flex: 1;
    min-width: 0;
    padding: 0;
    border: 0;
    outline: none;
    background: none;
    color: var(--foreground);
    font: inherit;
}

[data-slot="agent-prompt-line"] > input::placeholder{
    color: var(--muted-foreground);
}

[data-slot="agent-prompt-note"]{
    flex-shrink: 0;
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-xs);
    color: var(--muted-foreground);
}

[data-slot="agent-prompt-note"]:empty{
    display: none;
}

.agent-conversations-panel[popover]{
    width: 24rem;
    max-height: 60vh;
    overflow-y: auto;
    padding: .25rem;
    font-family: var(--font-mono-reading);
    font-size: var(--text-sm);
    letter-spacing: -0.02em;
}

[data-slot="agent-conversations"] > form + form{
    margin-top: 1px;
}

[data-slot="agent-conversations"] > form:first-child{
    margin-bottom: .25rem;
    padding-bottom: .25rem;
    border-bottom: 1px solid var(--border);
}

[data-slot="conversation-row"]{
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .45rem .5rem;
    border: 0;
    border-radius: var(--radius);
    background: none;
    color: var(--foreground);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

[data-slot="conversation-row"]:hover{
    background: var(--muted);
}

[data-slot="conversation-row"][data-current]{
    background: var(--muted);
    cursor: default;
}

[data-slot="conversation-row"] svg{
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--muted-foreground);
}

[data-slot="conversation-row"] > span{
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-slot="conversation-row"] > time{
    flex-shrink: 0;
    font-size: var(--text-xs);
    color: var(--muted-foreground);
}
@layer lims {
/* The application's own stylesheet.
 *
 * A .css file rather than a string inside a .lisp file: editing CSS in a
 * Lisp string literal means no highlighting, no brace matching, no
 * linter, and a stray double quote silently ends the string and breaks
 * the build. Read at compile time by src/html/style.lisp, exactly as the
 * component sheets under ui/ are.
 *
 * The design tokens are NOT here — they are Lisp data in
 * src/html/tokens.lisp, emitted once by the PAGE shell, because they
 * used to be declared in both this sheet and ui/tokens.css and the
 * duplicate silently won.
 */
/* ---- FK Grotesk, vendored (same faces the Next.js root layout declares) */
@font-face { font-family: 'FK Grotesk'; src: url('/static/fonts/FKGroteskTrial-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'FK Grotesk'; src: url('/static/fonts/FKGroteskTrial-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'FK Grotesk'; src: url('/static/fonts/FKGroteskTrial-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'FK Grotesk'; src: url('/static/fonts/FKGroteskTrial-MediumItalic.woff2') format('woff2'); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: 'FK Grotesk'; src: url('/static/fonts/FKGroteskTrial-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'FK Grotesk Mono'; src: url('/static/fonts/FKGroteskMonoTrial-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'FK Grotesk Mono'; src: url('/static/fonts/FKGroteskMonoTrial-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
/* JetBrains Mono (OFL, static/fonts/JetBrainsMono-OFL.txt): the reading
   face of the agent panel — a transcript is read the way an editor is. */
@font-face { font-family: 'JetBrains Mono'; src: url('/static/fonts/JetBrainsMono-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('/static/fonts/JetBrainsMono-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('/static/fonts/JetBrainsMono-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url('/static/fonts/JetBrainsMono-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

/* The dark palette is not here. It used to be — a .dark block ported
   verbatim from the Next.js app and never applied — and it could not
   have worked where it sat: this sheet is served inside @layer lims and
   the tokens are emitted unlayered, so :root beat .dark whatever the
   markup said. It lives beside the light palette in tokens.lisp now,
   and the topbar's toggle puts .dark on <html>. */

/* ---- Base ---- */
* { box-sizing: border-box; border-color: var(--border); }
html { font-family: var(--font-sans); touch-action: manipulation; }
body {
  margin: 0; background: var(--background); color: var(--foreground);
  display: flex; flex-direction: column; min-height: 100svh;
  font-size: var(--text-base); line-height: var(--leading-normal);
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
/* Identifiers wear a quiet pill in the UI face, not a terminal font:
   this software is read by scientists all day, and mono everywhere
   made records read like logs. .mono remains for the few places a
   fixed-width column genuinely helps (ZPL, the barcode's own text). */
code { font-family: inherit; font-size: .92em;
  background: var(--muted, var(--sidebar-accent));
  padding: .05rem .3rem; border-radius: calc(var(--radius) / 2); }
.mono { font-family: var(--font-mono); }

/* Scrollbars are hidden everywhere — the page scrollbar and every inner
   pane. Only the bar is gone: wheel, trackpad, touch, keyboard, and
   scroll-into-view all behave exactly as before, and the scroll
   containers keep their overflow.

   The three declarations are three engines, none of which honours the
   others: scrollbar-width is the standard (Firefox), ::-webkit-scrollbar
   is Chrome and Safari, -ms-overflow-style is legacy Edge.

   The cost is that a long page no longer shows how long it is or where
   you are in it, so anything that scrolls needs some other cue that
   there is more below it. */
* { scrollbar-width: none; -ms-overflow-style: none; }
*::-webkit-scrollbar { width: 0; height: 0; display: none; }

/* ---- Cards ---- */
.card {
  background: var(--card); color: var(--card-foreground);
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 1.5rem; width: 100%; max-width: 28rem;
  display: flex; flex-direction: column; gap: .75rem;
}
.card h1 { margin: 0; font-size: var(--text-base); font-weight: var(--font-weight-semibold); letter-spacing: var(--tracking-snug); }
.card p { margin: 0; font-size: var(--text-sm); color: var(--muted-foreground); }
.card .actions { display: flex; gap: .5rem; margin-top: .5rem; }
main.center { display: flex; flex: 1; align-items: center; justify-content: center; padding: 1.5rem var(--gutter); }

/* A reference to another record: boxed so it reads as an object, lit
   under the pointer so it reads as openable. */
.record-chip { display: inline-flex; align-items: center; gap: .25rem;
  padding: .1rem .45rem; border: 1px solid var(--border);
  border-radius: calc(var(--radius) / 1.5);
  background: var(--muted, var(--sidebar-accent));
  font-size: var(--text-sm); color: var(--foreground);
  text-decoration: none; cursor: pointer;
  transition: background 100ms ease, border-color 100ms ease; }
/* The hover has to visibly lighten, in either palette: mix the
   foreground into the resting background rather than swapping to a
   token that may barely differ. */
.record-chip:hover { background: color-mix(in oklab,
    var(--foreground) 16%, var(--muted, var(--sidebar-accent)));
  border-color: var(--muted-foreground); }

/* ---- The overview layout (components/overview.lisp) ----
   Linear's team overview, measured off its app: a 688px main column, a
   212px rail, 60px between them, 24px between sections. Used flush —
   the crumb bar draws its own inset, so a page built from these passes
   :flush and the bar sits against the plane's top edge as Linear's
   does. */
/* The three bands of an overview page — crumb, tabs, body — are
   siblings in the plane rather than one wrapper, so they each carry the
   same cap and auto margins. That is what keeps their left edges on one
   line and puts the whole page in the middle of the plane instead of
   pinned against the sidebar. */
.crumb-bar, .pill-tabs, .overview {
  width: 100%; max-width: 62rem; margin-inline: auto;
}
.crumb-bar { display: flex; align-items: center; gap: 8px; height: 48px;
             flex-shrink: 0; padding: 0 16px;
             font-size: var(--text-sm); color: var(--foreground); }
.crumb-icon { display: inline-flex; }
.crumb-icon svg { width: 16px; height: 16px; }
.crumb-label { font-weight: var(--font-weight-medium); }
.crumb-back { font-size: var(--text-sm); color: var(--muted-foreground); }
.crumb-back::after { content: "/"; margin-left: 8px; opacity: .5; }
.crumb-actions { margin-left: auto; display: flex; align-items: center; gap: 4px; }

/* Pill tabs. Fully rounded and 28px tall, so the strip reads as
   controls rather than as a second heading row. */
/* 6px on the left, not 16: a pill carries 10px of its own padding, so
   the strip pays the difference and the first tab's *text* lands on
   16px — the same line as the crumb above it and the title tile below.
   Its highlight still bleeds the 10px left of the text, which is what
   makes a pill a pill. */
.pill-tabs { display: flex; align-items: center; gap: 4px;
             padding: 0 16px 16px 6px; flex-shrink: 0;
             overflow-x: auto; scrollbar-width: none; }
.pill-tabs::-webkit-scrollbar { display: none; }
.pill-tab { flex-shrink: 0; display: inline-flex; align-items: center;
            height: 28px; padding: 0 10px; border-radius: var(--radius);
            font-size: var(--text-xs); font-weight: var(--font-weight-medium);
            color: var(--muted-foreground); white-space: nowrap; }
.pill-tab:hover { background: var(--accent); color: var(--foreground); }
.pill-tab.active { background: var(--accent); color: var(--accent-foreground); }

/* The two columns. `align-items: start` keeps the rail at the top
   instead of stretching it the height of the main column, which is
   what makes a short rail beside a long page look deliberate. */
/* No scroller of its own — the plane above is the one that scrolls, and
   two nested scrollers means a wheel event over the rail moves the
   wrong thing. */
.overview { display: flex; align-items: start; gap: 60px;
            padding: 8px 16px 48px; }
.overview-main { flex: 1; min-width: 0; max-width: 688px;
                 display: flex; flex-direction: column; gap: 24px; }
.overview-rail { flex-shrink: 0; width: 212px;
                 display: flex; flex-direction: column; gap: 24px; }
/* Below the two-column width the rail goes under the main column
   rather than getting narrower — a squeezed rail of quick links is
   worse than one further down. */
@media (max-width: 1100px) {
  .overview { flex-direction: column; gap: 32px; }
  .overview-rail { width: 100%; }
}

.overview-title { display: flex; align-items: center; gap: 12px; }
.overview-title h1 { margin: 0; font-size: 24px;
                     font-weight: var(--font-weight-semibold);
                     letter-spacing: -.16px; }
/* Neutral, like the sidebar's team chip — the tinted version made every
   page open with a coloured square that read as a status light. */
.overview-title-tile { flex-shrink: 0; display: grid; place-items: center;
                       width: 2.25rem; height: 2.25rem;
                       border-radius: var(--radius);
                       color: var(--muted-foreground); background: var(--muted); }
.overview-title-tile svg { width: 1.25rem; height: 1.25rem; }

/* The description. Empty and filled are the same line in two moods —
   same size, same position, only the colour differs — so adding one
   does not shift the page. */
.overview-desc { margin-top: -12px; }
.overview-desc-text, .overview-desc-empty {
  display: block; margin: 0; font-size: 15px; line-height: 1.5; }
.overview-desc-text { color: var(--foreground); }
.overview-desc-empty { color: var(--muted-foreground); }
a.overview-desc-text:hover, a.overview-desc-empty:hover {
  color: var(--foreground); text-decoration: underline;
  text-underline-offset: 3px; }

/* The type-in-place field (INLINE-TEXT; the overview description is
   one). It is the sentence, not a field: no border, no background, no
   fixed height, and no change of colour when you write in it — writing
   in a document does not tint the paper. The only affordance is that
   the pointer becomes a caret. */
.inline-edit {
  cursor: text;
  white-space: pre-wrap; overflow-wrap: anywhere;
}
.inline-edit:focus { outline: none; }
/* The placeholder, done the way tiptap does it (their placeholder
   extension's CSS — packages/extensions/src/placeholder, MIT):
   `.is-empty::before { content: attr(data-placeholder); float: left;
   height: 0; pointer-events: none }`.

   All three properties earn their place. FLOAT plus HEIGHT 0 take the
   pseudo-element out of flow so an empty field is exactly one line
   tall and the caret sits at its start — in normal flow it stacks
   above the caret and doubles the field's height. POINTER-EVENTS NONE
   is why clicking the placeholder puts the caret in the editor instead
   of the click landing on the pseudo-element and focusing nothing.

   :empty is no help here — an emptied contenteditable keeps a <br> —
   so the class is maintained by the script, as tiptap's is by its
   decoration plugin. */
.inline-edit.is-empty::before {
  content: attr(data-placeholder);
  float: left;
  height: 0;
  pointer-events: none;
  color: var(--muted-foreground);
}
/* A hint is for the box you have not reached yet. The moment the caret
   is in a field the example text goes, on every input, textarea and
   typed-in-place line in the app: what is left is the field, empty,
   waiting for what you type. The element selectors are what give these
   rules the specificity to beat each component's own ::placeholder. */
input:focus::placeholder,
textarea:focus::placeholder { color: transparent; }
.inline-edit.is-empty:focus::before { color: transparent; }
.inline-edit-status {
  display: block; margin-top: .25rem; min-height: 1rem;
  font-size: var(--text-xs); color: var(--muted-foreground);
  transition: opacity .15s;
}
.inline-edit-status[data-inline-status="bad"] { color: var(--destructive); }

.overview-section { display: flex; flex-direction: column; gap: 8px; }
.overview-section-head { display: flex; align-items: center; gap: 8px;
                         min-height: 28px; }
.overview-section-head h2 { margin: 0; font-size: 18px;
                            font-weight: var(--font-weight-medium);
                            letter-spacing: -.1px; }
.overview-section-actions { margin-left: auto; display: flex;
                            align-items: center; gap: 4px; }
.overview-section-empty { margin: 0; font-size: 15px;
                          color: var(--muted-foreground); }

/* The hue an avatar drawn outside the rail falls back to; the rail's
   own is declared in ui/shell.lisp. */
.overview-title-tile, .stack-avatar { --avatar-hue: 250; }

/* ---- The rail ---- */
.rail-section { display: flex; flex-direction: column; gap: 12px; }
.rail-label { margin: 0; font-size: var(--text-xs);
              font-weight: var(--font-weight-medium);
              color: var(--muted-foreground); }
.rail-body { display: flex; flex-direction: column; gap: 2px; }
.rail-empty { font-size: var(--text-sm); color: var(--muted-foreground); }
.rail-link { display: flex; align-items: center; gap: 8px;
             height: 28px; margin: 0 -8px; padding: 0 8px;
             border-radius: var(--radius);
             font-size: var(--text-sm); font-weight: var(--font-weight-medium);
             color: var(--foreground); }
.rail-link:hover { background: var(--accent); }
.rail-link-icon { display: inline-flex; color: var(--muted-foreground); }
.rail-link-icon svg { width: 16px; height: 16px; }
.rail-facts { display: grid; grid-template-columns: auto 1fr;
              gap: 4px 12px; margin: 0; font-size: var(--text-sm); }
.rail-facts dt { color: var(--muted-foreground); }
.rail-facts dd { margin: 0; }

/* The member stack. The ring is the page background, so the discs read
   as separate even where they overlap. */
.avatar-stack { display: flex; align-items: center; }
.avatar-stack-link { display: flex; }
.stack-avatar { display: grid; place-items: center;
                width: 18px; height: 18px; border-radius: var(--radius);
                margin-right: -5px;
                font-size: 8px; font-weight: var(--font-weight-medium);
                line-height: 1; color: oklch(.98 0 0);
                background: oklch(.62 .13 var(--avatar-hue, 250));
                box-shadow: 0 0 0 2px var(--background); }
.stack-more { color: var(--muted-foreground); background: var(--accent); }
.avatar-stack-link:hover .stack-avatar { box-shadow: 0 0 0 2px var(--accent); }

/* The caller's organization, quiet in the topbar's right corner. */
.topbar-org { font-size: var(--text-sm); color: var(--muted-foreground);
              white-space: nowrap; }

/* ---- Workbench content ---- */
/* 64rem, not 48: a record table is five or six columns wide and the old
   cap cut the last one off inside its scroll container. Prose still
   reads at a sane measure because the paragraphs that live here — the
   page blurb, an empty-state line — are short by construction. */
.content-narrow { width: 100%; max-width: 64rem; margin: 0 auto;
                  display: flex; flex-direction: column; gap: 1rem; }
/* Record tables (components/records.lisp). The look is the shadcn port
   in ui/table.lisp; these are the three things a *record* table adds.

   The row link: one anchor, in the first cell, stretched over the whole
   row by an absolutely-positioned ::after. That is what keeps a row one
   click target now that it is cells rather than a single <a> — and why
   the row is the positioning context. A button inside a later cell sits
   above the sheet and stays clickable. */
tr:has(.row-link) { position: relative; }
.row-link { color: inherit; text-decoration: none;
            font-weight: var(--font-weight-medium); }
.row-link::after { content: ""; position: absolute; inset: 0; }
tr:has(.row-link) [data-slot="button"],
tr:has(.row-link) a:not(.row-link) { position: relative; z-index: 1; }

/* The first column is the record's name: it holds the link, so it never
   wraps and never gets clipped. */
td.row-name, th.row-name { white-space: nowrap; }

/* Whichever column says so takes the width the names, badges and
   timestamps do not. It ellipsises past a cap rather than pushing the
   table into its scroll container — a title is worth reading, but not
   worth a horizontal scrollbar on every row. The cap is a real length
   on purpose: in an auto-layout table max-width:0 collapses the column
   to its minimum instead of letting it grow. */
td.row-wide, th.row-wide { width: 100%; max-width: 22rem;
                           overflow: hidden; text-overflow: ellipsis; }

/* Timestamps: mono, quiet, hard against the right edge. */
td.row-time, th.row-time { text-align: right; font-family: var(--font-mono);
                           font-size: var(--text-2xs);
                           color: var(--muted-foreground); }

/* Dialog: <details> standing in for the shadcn dialog. */
details.dialog { position: relative; }
details.dialog > summary { list-style: none; cursor: pointer; }
details.dialog > summary::-webkit-details-marker { display: none; }
details.dialog[open] > .dialog-panel {
  position: absolute; right: 0; top: 2.25rem; z-index: 30; width: 24rem;
  background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 1.25rem;
  display: flex; flex-direction: column; gap: .75rem;
  box-shadow: var(--shadow-pop);
}
/* A section heading — one rule instead of the same inline style on
   every page. */
.section-title { margin: 0; font-size: 1rem; font-weight: var(--font-weight-medium); }
/* An inline element nudged off the one before it — a badge after a
   title, a note after a name. */
.trailing { margin-left: .5rem; }
.trailing-tight { margin-left: .35rem; }
/* A row title's second half — the human name after the code. */
.row-subtitle { margin-left: .5rem; font-weight: 400; }

/* ---- Detail views ---- */
.facts { display: grid; grid-template-columns: auto 1fr; column-gap: 1rem;
  row-gap: .25rem; margin: 0; font-size: var(--text-xs); }
.facts dt { color: var(--muted-foreground); }
.facts dd { margin: 0; min-width: 0; }
/* ---- Popovers (components/popover.lisp) ----
   A panel anchored to the button that opens it. The UA puts a popover
   in the top layer with `position: fixed` and centres it; the placement
   script writes the offsets that put it back against its button, so the
   margin and inset reset here is what stops the default centring from
   fighting them. Top layer is also the point: no ancestor's overflow
   can clip one, which a sidebar with its own scroller otherwise would. */
.popover { display: contents; }
.popover-panel[popover] { position: fixed; margin: 0; inset: auto;
  width: 14rem; background: var(--card); color: var(--card-foreground);
  border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow-pop); padding: .25rem; }
/* Transparent rather than absent: a light-dismiss popover still paints
   a backdrop, and the dimmed sheet a dialog wants is exactly what these
   are not. */
.popover-panel[popover]::backdrop { background: transparent; }

.popover-button { background: none; border: none; cursor: pointer;
  padding: .125rem; border-radius: var(--radius);
  color: var(--muted-foreground); display: inline-flex; }
.popover-button:hover { background: var(--muted); color: var(--foreground); }

.popover-menu-link { display: flex; align-items: center; gap: .5rem;
  padding: .375rem .5rem; border-radius: var(--radius);
  font-size: var(--text-sm); color: var(--foreground);
  text-decoration: none; }
.popover-menu-link:hover { background: var(--accent);
                           color: var(--accent-foreground); }
.popover-menu-link svg { width: .875rem; height: .875rem; flex: none;
                         color: var(--muted-foreground); }
.popover-menu-link:hover svg { color: inherit; }
.popover-menu-heading { padding: .375rem .5rem .25rem;
  font-size: var(--text-xs); color: var(--muted-foreground); }
/* The one division the create menu has. Full-bleed past the panel's
   padding, so it reads as a line across the menu rather than a dash
   floating in it. */
.popover-menu-rule { height: 1px; background: var(--border);
                     margin: .25rem -.25rem; }

/* ---- Tables ---- */
table { border-collapse: collapse; width: 100%; font-size: var(--text-sm); }
th { text-align: left; font-weight: var(--font-weight-medium); color: var(--muted-foreground);
     padding: .5rem .75rem; border-bottom: 1px solid var(--border); }
td { padding: .5rem .75rem; border-bottom: 1px solid var(--border); }
tr.revoked td { color: var(--muted-foreground); text-decoration: line-through; }
tr.revoked td:last-child { text-decoration: none; }

/* ---- Small bits ---- */
.row { display: flex; gap: 1rem; align-items: center; }
/* A role: what someone is here, on a team or in the organization. Read
   far more often than it is changed, so the resting state is a badge
   and the control only appears for the people who may use one — the
   select IS the control, with no Save beside it, because a two-step
   commit for one word is a step people forget to take. */
.member-role { display: inline-flex; }
.member-role select { font-size: var(--text-xs); padding: .1rem 1.25rem .1rem .4rem;
                      border: 1px solid var(--border); border-radius: var(--radius);
                      background: var(--background); color: var(--foreground); }
.member-role select:hover { background: var(--muted); }
/* Overdue: a window that has closed on work still open. Not a status
   and not a column — it can be true of a card anywhere on the board —
   so it colours the line it is part of rather than wearing a chip of
   its own, and it is the one place a worklist row shouts. */
.overdue { color: var(--overdue); font-weight: var(--font-weight-medium); }

.filter-row { display: flex; gap: .5rem; flex-wrap: wrap; }

.spread { margin-left: auto; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

/* The one banner unaudited data must wear. Loud on purpose. */
.portal-preliminary-banner { display: flex; flex-direction: column;
    gap: .25rem; border: 2px solid var(--destructive);
    border-radius: var(--radius); background: var(--muted);
    padding: .75rem 1rem; margin: 0 0 1rem; }
.portal-preliminary-banner strong { letter-spacing: .05em; }

/* The chrome-free notice card — signed out, no access. */
.portal-notice { min-height: 100vh; display: flex; align-items: center;
                 justify-content: center; background: var(--background);
                 padding: 1.5rem; }
.portal-notice-card { max-width: 26rem; border: 1px solid var(--border);
                      border-radius: var(--radius); background: var(--card);
                      padding: 2rem; display: flex; flex-direction: column;
                      gap: .75rem; }
.portal-notice-card h1 { margin: 0; font-size: 1.25rem; }
.portal-notice-card p { margin: 0; color: var(--muted-foreground); }

/* ---- A record's heading (chrome/workbench.lisp, DETAIL-PAGE) ----
   The code is the heading, the status sits beside it as a badge with
   air on both sides, and the record's title is the line beneath. The
   generic page-head sets its h1 at text-sm for list pages; a record's
   page is about one thing and says so at a size that reads as a title. */
.detail-head { align-items: flex-start; gap: 1.5rem; margin-bottom: .5rem; }
.detail-head > div { min-width: 0; }
.detail-head h1 { display: flex; flex-wrap: wrap; align-items: center; gap: .625rem;
                  font-size: 1.375rem; line-height: 1.25; letter-spacing: var(--tracking-snug);
                  text-wrap: balance; }
.detail-head h1 [data-slot="kit-badge"] { font-size: var(--text-xs); flex: none;
                                      position: relative; top: .05em; }
.detail-head p { font-size: var(--text-sm); color: var(--muted-foreground);
                 margin-top: .375rem; max-width: 60ch; line-height: 1.45; }
/* Outranks the component's own page-head h1 rule, which sets text-sm
   for list pages and lands later in the cascade. */
[data-slot="page-head"].detail-head h1 { font-size: 1.375rem; line-height: 1.25; }

/* ---- Tool glyphs and result cards in the transcript (pages/control.lisp) ----
   A tool that reaches another system wears that system's mark before
   its name; a write that made a record hands back a card with the way
   to it, so the reader is never left copying a path out of prose. */
.tool-icon { display: inline-flex; vertical-align: -0.2em; margin-right: .4em; }
.tool-icon svg { width: 1.1em; height: 1.1em; }
.result-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
               margin: .5rem 0 .25rem; padding: .7rem .9rem;
               border: 1px solid var(--border); border-radius: var(--radius);
               background: var(--card); }
.result-card-text { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.result-card-kind { font-size: var(--text-2xs); letter-spacing: .06em; text-transform: uppercase;
                    color: var(--muted-foreground); }
.result-card-title { font-size: var(--text-sm); font-weight: var(--font-weight-medium);
                     overflow: hidden; text-overflow: ellipsis; }
.result-card-subtitle { font-size: var(--text-xs); color: var(--muted-foreground); }
.result-card [data-slot="button"] { flex: none; }


}
/* portal */

/* The page is a white card on the sidebar's grey: the topbar and the
   plane together, with the same gap to the window's top, right and
   bottom edges. The card's left edge meets the sidebar, which is the
   same grey, so no line is drawn between them. The kit's workbench is
   white, which hid the gap it leaves around the plane. */
[data-slot="kit-sidebar"] { border-right: 0; }
[data-slot="workbench"] { background: var(--sidebar); }
[data-slot="frame"] { margin: .5rem .5rem .5rem 0; background: var(--background);
  border-radius: var(--radius); overflow: hidden; }
[data-slot="topbar"] { background: var(--background); backdrop-filter: none; }
[data-slot="plane-wrap"] { padding: 0; }
[data-slot="plane"] { border-radius: 0; }
/* In dark the palette's page is darker than its sidebar, which sank
   the card into the ground. Inside the shell the two swap: the darker
   grey is the ground and the sidebar, the lighter one the card and
   everything drawn on it. The pair is copied on <html> first, where
   the dark tokens are set, so the swap does not read itself. */
html.dark { --shell-card: var(--sidebar); --shell-ground: var(--background); }
html.dark [data-slot="workbench"] { --background: var(--shell-card); --sidebar: var(--shell-ground); }
/* The window never scrolls: the shell is exactly its height and only
   the plane scrolls. But a trackpad at the end of the plane hands the
   scroll on to the window, and macOS bounces the whole window, showing
   the body behind it. The body was white, so the grey shell slid away
   over white on every page. The bounce is turned off, and the body is
   the ground's grey in case a browser bounces anyway. */
html, body { overscroll-behavior: none; }
body:has(> [data-slot="workbench"]) { background: var(--shell-ground, var(--sidebar)); }
[data-slot="plane"] { overscroll-behavior: contain; }
.portal-facts { margin: 0 0 .5rem; }
/* The lines you type into: standard UI text, boxed where the page
   says so, never the caption size. */
.inline-edit { font-size: var(--text-sm); line-height: var(--text-sm--line-height); color: var(--foreground); }
.inline-edit.portal-name { font-size: 20px; line-height: 1.3; font-weight: var(--font-weight-semibold);
  border: 1px solid transparent; border-radius: var(--radius); margin: -3px -6px; padding: 2px 5px; }
.inline-edit.portal-name:hover { border-color: var(--border); }
.inline-edit.portal-name:focus { border-color: var(--ring); outline: none; }
.inline-field .inline-edit-status:empty { display: none; }

/* A run of fields under one subline (html/components/, FIELD-SECTION):
   the fields one under the other, runs parted by a rule. */
.field-section { display: flex; flex-direction: column; gap: 1rem; }
.field-section + .field-section { padding-top: 1.5rem; border-top: 1px solid var(--border); }
.profile-heading { margin: 0; font-size: var(--text-sm); font-weight: var(--font-weight-medium); line-height: var(--text-sm--line-height); }
.section-subline { margin: 0; font-size: var(--text-sm); color: var(--muted-foreground); }
.profile-identity { display: flex; align-items: center; gap: 1.5rem; padding: .25rem 0 .5rem; }
.profile-identity-text { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.logo-form { margin: 0; display: flex; align-items: center; font-size: var(--text-sm); color: var(--foreground); }
.logo-link { color: var(--foreground); cursor: pointer; border: 0; background: none; padding: 0; font: inherit; text-decoration: underline; text-underline-offset: 3px; }
.logo-link:hover { text-decoration-thickness: 2px; }
.logo-input { display: none; }
.logo-wrap { position: relative; flex-shrink: 0; }
.logo-remove-form { margin: 0; position: absolute; top: -6px; right: -6px; }
.logo-remove-x { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid var(--border);
  border-radius: 999px; background: var(--background); color: var(--foreground); padding: 0; cursor: pointer;
  opacity: 0; transition: opacity .12s; }
.logo-wrap:hover .logo-remove-x, .logo-remove-x:focus-visible { opacity: 1; }
.logo-remove-x svg { width: .6rem; height: .6rem; }

/* A field: label above, the box below, full width; an icon at the
   box's start and the typed line filling the rest. */
.field-line { display: flex; flex-direction: column; gap: .4rem; }
.field-label { font-size: var(--text-sm); color: var(--foreground); }
.field-box { display: flex; align-items: center; gap: .6rem; min-height: 2.5rem; padding: 0 .75rem;
  border: 1px solid var(--border); border-radius: var(--radius); background: var(--background); }
.field-box:hover { border-color: var(--muted-foreground); }
.field-box:focus-within { border-color: var(--ring); outline: 2px solid var(--ring); outline-offset: -1px; }
.field-box-icon { display: inline-grid; place-items: center; width: 1rem; height: 1rem; color: var(--foreground); flex-shrink: 0; }
.field-box-icon svg { width: 1rem; height: 1rem; }
.field-box .inline-field { flex: 1; min-width: 0; }
/* The About box: a paragraph, so it wraps and grows with what is typed. */
.field-box.is-paragraph { align-items: flex-start; padding: .55rem .75rem; }
.field-box.is-paragraph .inline-edit { white-space: pre-wrap; overflow: visible; text-overflow: clip; padding: 0; min-height: 3.2rem; line-height: 1.55; }
.about-text { margin: .35rem 0 0; font-size: var(--text-sm); line-height: 1.55; max-width: 46rem; white-space: pre-wrap; }
/* One line, always: these are addresses. */
.field-box .inline-edit { padding: .55rem 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.field-box .inline-edit:focus { outline: none; }
/* A unit at the box's start — the currency before an amount — read
   as part of the value, so in the text colour, not faint. */
.field-box-unit { flex-shrink: 0; font-size: var(--text-sm); color: var(--foreground); font-variant-numeric: tabular-nums; }
.field-box-unit + .inline-field .inline-edit { font-variant-numeric: tabular-nums; }
/* A refused line: the box the server would not take, or the one Send
   says is still missing. The border says which; the status line beside
   it says why. Hover and focus keep the mark until the text changes. */
.field-box.is-refused, .field-box.is-refused:hover, .field-box.is-refused:focus-within,
.field-line:has(> [data-inline-status="bad"]) > .field-box, .field-line:has(> [data-inline-status="bad"]) > .field-box:hover,
.choice-box.is-refused select { border-color: var(--destructive); outline-color: var(--destructive); }
.field-line [data-inline-status="bad"] { color: var(--destructive); }
/* What a lab computer said when it could not do what a field asked of
   it (pages/organisations/workstations.lisp): the refusal's colour,
   under the fields, since it arrives seconds after the save. */
.field-refusal { margin: 0; color: var(--destructive); font-size: var(--text-sm); }
/* The same line while the computer has not answered yet. */
.field-standing { margin: 0; color: var(--muted-foreground); font-size: var(--text-sm); }
/* A field sent to another machine, saved with a button that names the
   act: label above, the box taking the width, the button at its end. */
.folder-form { display: flex; flex-direction: column; gap: .375rem; margin: 0 0 1rem; }
.folder-form-row { display: flex; align-items: center; gap: .5rem; }
.folder-input { flex: 1; min-width: 0; }
/* Under a computer's name: whether it is connected, and what it is. */
.workstation-standing { display: flex; align-items: center; gap: .625rem; margin: 0 0 1.5rem; color: var(--muted-foreground); font-size: var(--text-sm); }
/* The line under a field (html/components/): right below its box, and there
   only while it has something to say, so the box is one line tall and
   the page does not shift until a refusal needs the room. */
.field-line > .inline-edit-status { margin-top: 0; }
.field-line > .inline-edit-status:empty { display: none; }
/* A kit form's field a refusal names (html/components/actions.lisp, %CHECKED-SEND-SCRIPT):
   its box in red, the sentence right under it; and a refusal about no
   field, under the button. */
[data-slot=kit-field].is-refused > input,
[data-slot=kit-field].is-refused > textarea,
[data-slot=kit-field].is-refused > select,
[data-slot=kit-field].is-refused [data-slot=select-trigger],
input.is-refused, textarea.is-refused, select.is-refused,
fieldset.is-refused, .check-grid.is-refused { border-color: var(--destructive); }
input.is-refused:focus-visible, textarea.is-refused:focus-visible, select.is-refused:focus-visible { border-color: var(--destructive); }
[data-slot=kit-field] > [data-inline-status="bad"], .form-status[data-inline-status="bad"],
[data-slot=form] > [data-inline-status="bad"], .inline-form > [data-inline-status="bad"] { color: var(--destructive); }
/* A bare control in a row form has no wrapper: its sentence is the
   span after it, on a line of its own under the row. */
[data-slot=form][data-layout=row] > .inline-edit-status, .inline-form > .inline-edit-status { flex-basis: 100%; margin: 0; font-size: var(--text-sm); }
[data-slot=form][data-layout=row] > .inline-edit-status:empty, .inline-form > .inline-edit-status:empty { display: none; }
[data-slot=kit-field] > .inline-edit-status { margin-top: 0; }
[data-slot=kit-field] > .inline-edit-status:empty, .form-status:empty { display: none; }
.form-status { margin: .25rem 0 0; font-size: var(--text-sm); }
/* A choice picked in place (html/components/, CHOICE-PICKED-IN-PLACE): the
   kit's select squared to the app's corners and sized like the boxes
   above it. Focus is the darker border, never a glow. */
/* What throws something away reads as such: red type, a red wash under the pointer. */
[data-slot=button].is-destructive { color: var(--destructive); }
[data-slot=button].is-destructive:hover, [data-slot=button].is-destructive:focus-visible { color: var(--destructive); background: color-mix(in oklab, var(--destructive) 12%, transparent); border-color: var(--destructive); }
.logo-remove-x { color: var(--destructive); border-color: var(--destructive); }
/* The staff page's inline invite: one address and a button, in a row's cell. */
.staff-invite-into { margin: 0; display: inline-flex; gap: .4rem; align-items: center; }
.staff-invite-into input { font: inherit; font-size: var(--text-sm); padding: .3rem .5rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--background); color: var(--foreground); width: 14rem; }
/* A dialog opened from a table row would inherit the row's one-line text; it wraps and sits in its box. */
.throw-away { margin: 0; display: inline; }
/* Wrapping is the kit's now: a dialog resets the text it inherits from
   wherever it was opened (shadcn/dialog.lisp, %MODAL-TEXT-RESET-BLOCKS),
   so a row's one-line text no longer reaches it. What stays here is
   this dialog's own size. */
.throw-away [data-slot=alert-dialog-content] { font-size: var(--text-sm); }
.throw-away [data-slot=alert-dialog-footer] { min-width: 0; }
/* Every field that saves itself says so in one place: a line at the foot of the page. */
.save-toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 50; padding: .4rem .75rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); color: var(--foreground); font-size: var(--text-sm); box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.save-toast.is-bad { color: var(--destructive); border-color: var(--destructive); }
/* A date picked in place: the browser's control, in the typed line's box. */
.date-input { flex: 1; min-width: 0; background: transparent; border: 0; color: var(--foreground); font: inherit; padding: .55rem 0; outline: none; }
.date-input::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .7; }
.choice-box { display: block; width: 100%; }
/* The browser's own select, as wide and as tall as the typed line
   beside it. The open list is the browser's to draw. */
.choice-box select { display: block; width: 100%; height: auto; min-height: 2.5rem; padding: 0 .75rem; border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: none; background: var(--background); color: var(--foreground); font-size: var(--text-sm); }
.choice-box select:hover { border-color: var(--muted-foreground); }
.choice-box select:focus-visible { border-color: var(--ring); outline: 2px solid var(--ring); outline-offset: -1px; box-shadow: none; }
.choice-box .inline-edit-status:empty { display: none; }

/* Pill fields — locations, study types: the kit's combobox, squared
   to the app's corners and sized like the boxes above them. */
.pill-box { display: block; width: 100%; }
.pill-box [data-slot=combobox-chips] { border-radius: var(--radius); border-color: var(--border); box-shadow: none;
  background: var(--background); min-height: 2.5rem; padding: .3rem .6rem; gap: .4rem; }
/* The kit tints the box in the dark palette; here it stays the same
   surface as the fields above it, in both palettes. */
html.dark .pill-box [data-slot=combobox-chips] { background: var(--background); }
/* The chips are the only filled thing in the box: grey squares. */
.pill-box [data-slot=combobox-chip] { background: var(--muted); border: 0; }
.pill-box [data-slot=combobox-chips]:hover { border-color: var(--muted-foreground); }
.pill-box [data-slot=combobox-chips]:focus-within { border-color: var(--ring); box-shadow: none; outline: 2px solid var(--ring); outline-offset: -1px; }
.pill-box [data-slot=combobox-chip] { border-radius: var(--radius); height: auto; padding: .3rem .4rem .3rem .6rem;
  font-size: var(--text-sm); line-height: var(--text-sm--line-height); }
.pill-box [data-slot=combobox-chip-input] { font-size: var(--text-sm); }
.pill-content { border-radius: var(--radius); }
.pill-content [data-slot=combobox-item] { border-radius: var(--radius); font-size: var(--text-sm); }
.field-hint { margin: 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.field-hint a { color: inherit; }

/* The logo tile: the image, or the initials while there is none. */
.logo-tile { display: grid; place-items: center; flex-shrink: 0; overflow: hidden;
  border-radius: var(--radius); background: var(--muted);
  color: var(--foreground); font-weight: var(--font-weight-semibold); }
.logo-tile.is-nav { width: 20px; height: 20px; font-size: 9px; border-radius: var(--radius); }
.logo-tile.is-md { width: 40px; height: 40px; font-size: 14px; }
.logo-tile.is-lg { width: 64px; height: 64px; font-size: 22px; }
.logo-tile.is-xl { width: 84px; height: 84px; font-size: 28px; }
.logo-image { width: 100%; height: 100%; object-fit: contain; display: block; }
.details-line { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: .35rem 0 0; font-size: var(--text-sm); color: var(--foreground); }
.details-line a { color: var(--foreground); }
.section-head form { margin: 0; }
/* A row that is a link to its own page: the text colour, underlined on hover. */
.row-link { color: var(--foreground); text-decoration: none; font-weight: var(--font-weight-medium); }
.row-link:hover { text-decoration: underline; text-underline-offset: 3px; }
/* The sidebar rail: a strip along the sidebar's edge. Hovered, the
   divider appears and the cursor turns to the resize arrows; clicked,
   the sidebar collapses or opens. The strip sits inside the edge
   because the sidebar clips its overflow. */
[data-slot="kit-sidebar"] { position: relative; }
.sidebar-rail { position: absolute; top: 0; bottom: 0; right: 0; width: 12px; z-index: 20;
  border: 0; padding: 0; background: none; cursor: w-resize; }
.sidebar-rail::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 2px;
  background: var(--border); opacity: 0; transition: opacity .15s; }
.sidebar-rail:hover::after, .sidebar-rail:focus-visible::after { opacity: 1; }
html.sidebar-collapsed .sidebar-rail { cursor: e-resize; }
/* The page's name at the bar's start. */
.topbar-title { font-size: var(--text-sm); font-weight: var(--font-weight-medium); color: var(--foreground); white-space: nowrap; }
/* The ? at the top bar's end: a round ghost button. */
.help-trigger { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-left: .25rem;
  border: 0; border-radius: 999px; background: none; color: var(--foreground); cursor: pointer; }
.help-trigger:hover, .help-trigger[data-state="open"] { background: var(--muted); }
.help-trigger svg { width: 1rem; height: 1rem; }
/* The search box: centred in the bar's middle column, as wide as the
   column allows up to a comfortable line. */
[data-slot="topbar"] > [data-slot="search-form"] { justify-self: center; width: 100%; max-width: 28rem; }
/* A hit is one line: the title gives way with an ellipsis before it
   can push past the box, and the description after it. */
[data-slot="search-hit"] { min-width: 0; }
[data-slot="search-hit-title"] { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
[data-slot="search-hit-desc"] { flex: 1 1 auto; }
/* The clear (x) in the box: drawn here in the text colour, since the
   browser's own takes the accent blue. */
[data-slot="search-form"] > input { accent-color: var(--foreground); }
[data-slot="search-form"] > input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none;
  width: .75rem; height: .75rem; margin-left: .25rem; cursor: pointer; background: var(--foreground);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / contain no-repeat; }
/* Appearance, in Settings: two choices, the current one filled. The
   class on <html> is the whole state, as it is for the toggle the
   framework draws, so which button reads as chosen is CSS. */
.theme-choices { display: flex; gap: .5rem; }
html:not(.dark) .theme-choice[data-choice="light"],
html.dark .theme-choice[data-choice="dark"] { background: var(--foreground); color: var(--background); border-color: var(--foreground); }
/* The People tab's one control: an address and a button, on one line. */
.invite-form { display: flex; align-items: center; gap: .5rem; }
.invite-input { font: inherit; font-size: var(--text-sm); padding: .3rem .5rem; border: 1px solid var(--input); border-radius: var(--radius); background: var(--background); color: var(--foreground); min-width: 14rem; }
.invite-input:focus-visible { outline: none; border-color: var(--muted-foreground); }
/* The two layouts a checkbox is drawn in (html/components/choices.lisp).
   The box itself is SHADCN:CHECKBOX in both, and its look — the border,
   the tick, the focus ring — is the component's, never written again
   here. CHECK-LINE is a box and its words inside a form; CHECK-TILE the
   same box in a bordered tile, which a CHECK-GRID lays out in columns.
   POSITION RELATIVE on the tile is load-bearing: the real input the
   component hides is absolutely placed, and an absolutely placed
   element whose ancestors are all static is measured against the page,
   not the plane — so every box sat outside the plane's scroll and the
   whole document grew by the height of the grid. */
.check-line, .check-tile { display: flex; align-items: center; font-size: var(--text-sm); line-height: var(--text-sm--line-height); }
.check-line { gap: .5rem; }
.check-tile { position: relative; gap: .75rem; padding: .65rem .9rem; border: 1px solid var(--border);
  border-radius: var(--radius); }
.check-tile:hover { border-color: var(--foreground); }
.check-tile:has(input:checked) { border-color: var(--foreground); background: color-mix(in oklab, var(--muted) 60%, transparent); }
.check-words { color: var(--foreground); cursor: pointer; }
/* A run of choices under one heading (html/components/choices.lisp, CHOICE-SET). */
.choice-set { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.choice-set legend { padding: 0; margin: 0 0 .4rem; font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
/* What one choice brings with it — the CRO picker under the choice to
   name one — indented under its radio, gone when the other is chosen. */
.choice-detail { margin: .35rem 0 0 1.4rem; max-width: 28rem; }
.check-ring { display: flex; flex-direction: column; gap: .35rem; }
.check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .6rem .9rem; }
.check-grid .inline-edit-status { grid-column: 1 / -1; margin: 0; }
.check-grid .inline-edit-status:empty { display: none; }
/* A tag line (html/components/, TAG-LINE): short words as tags, wrapping. */
.tag-line { display: flex; flex-wrap: wrap; gap: .35rem; margin: 0; }
/* A fact list (html/components/, FACT-LIST): a small label over each value,
   flowing into columns; what a record says, read at a glance. */
.fact-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 1rem 1.5rem; margin: 0; }
.fact-list div { min-width: 0; }
.fact-list dt { font-size: var(--text-xs); color: var(--muted-foreground); margin: 0 0 .15rem; }
.fact-list dd { margin: 0; font-size: var(--text-sm); line-height: 1.5; }
.fact-list dd .tag-line { margin-top: .15rem; }
.milestone-overdue td { color: var(--destructive); }
.update-list { display: flex; flex-direction: column; gap: .75rem; margin: 0; padding: 0; list-style: none; }
.update-card { border: 1px solid var(--border); border-radius: var(--radius); }
.deliverable-card { margin: 0 0 1rem; }
.deliverable-card h2 { font-size: var(--text-base); margin: 0; }
.upload-status { margin: 0; font-size: var(--text-sm); color: var(--muted-foreground); }
.upload-status:empty { display: none; }
.update-standing { margin: 0 0 .75rem; font-size: var(--text-sm); color: var(--muted-foreground); }
.update-standing.update-due { color: var(--destructive); font-weight: var(--font-weight-medium); }
/* A check line that sits at the foot of a form row, level with the
   buttons beside it rather than with the labels above them. */
.check-line.is-foot { align-self: end; }
.subject-removed td { color: var(--muted-foreground); }
.inline-form { display: flex; gap: .5rem; align-items: center; margin: 0; }
.gate-list { margin: .35rem 0 0; padding: 0; list-style: none; font-size: var(--text-xs); color: var(--muted-foreground); display: flex; flex-direction: column; gap: .2rem; }

/* The study page: a line of who and what, then what needs attention,
   then four numbers, then the timeline. Cards keep each part to itself. */
.brief-text { max-width: 46rem; display: flex; flex-direction: column; gap: .6rem; }
.brief-text p { margin: 0; font-size: var(--text-sm); line-height: 1.55; }
.study-meta { margin: .25rem 0 1rem; font-size: var(--text-sm); color: var(--muted-foreground); line-height: 1.6; }
.study-meta strong { color: var(--foreground); font-weight: var(--font-weight-medium); }
.study-meta a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
.parties-disclosure { margin: -.5rem 0 1rem; }
.parties-disclosure > summary { margin-left: -.5rem; }
.parties-table { margin-top: .5rem; }
.study-section { margin: 0; }
.attention { display: flex; gap: .75rem; align-items: flex-start; border: 1px solid var(--destructive); border-left-width: 4px; border-radius: var(--radius); padding: .7rem 1rem; background: var(--card); font-size: var(--text-sm); margin: 0 0 .75rem; }
.attention.is-ask { border-color: var(--secondary); }
.attention p { margin: 0; }
.attention strong { font-weight: var(--font-weight-medium); }
.attention a { font-weight: var(--font-weight-medium); text-decoration: underline; text-underline-offset: .15em; }
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: .75rem; margin: 0 0 1rem; }
.stat { border: 1px solid var(--border); border-radius: var(--radius); background: var(--card); padding: .7rem .9rem; min-width: 0; }
.stat-label { margin: 0 0 .2rem; font-size: var(--text-xs); color: var(--muted-foreground); }
.stat-value { margin: 0; font-size: var(--text-base); font-weight: var(--font-weight-medium); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stat-note { margin: .15rem 0 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .9rem; }
.section-head .section-title { margin: 0; }

/* The catalog's filters: the search line, then the lists and the
   button on one row that wraps on a narrow page. */
.catalog-filters { display: grid; gap: .6rem; margin: 0 0 1rem; }
.catalog-filter-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.attention ul { margin: .4rem 0 0; padding-left: 1.1rem; }

/* A CRO's materials: one small heading per kind of file, the files of
   that kind under it. */
.material-kind + .material-kind { margin-top: 1.4rem; }
.material-kind-title { margin: 0 0 .4rem; font-size: var(--text-sm); font-weight: var(--font-weight-medium); color: var(--foreground); }

/* The timeline: one track of phases, the milestones nested under theirs. */
.phase { position: relative; display: grid; grid-template-columns: 1.5rem 1fr; column-gap: .8rem; align-items: start; padding: 0 0 1.1rem; }
.phase::before { content: ""; position: absolute; left: .7rem; top: 1.2rem; bottom: -.1rem; width: 2px; background: var(--border); }
.phase.is-done::before { background: var(--badge-ok); }
.phase:last-child::before { display: none; }
.phase:last-child { padding-bottom: 0; }
.phase-node { position: relative; z-index: 1; width: 1.45rem; height: 1.45rem; border-radius: 50%; border: 2px solid var(--border); background: var(--card); box-sizing: border-box; }
.phase.is-done .phase-node { background: var(--badge-ok); border-color: var(--badge-ok); }
.phase.is-current .phase-node { border-color: var(--secondary); background: var(--secondary); box-shadow: 0 0 0 4px color-mix(in oklab, var(--secondary) 25%, transparent); }
.phase-body { min-width: 0; padding-top: .15rem; }
.phase-title { margin: 0; font-size: var(--text-sm); font-weight: var(--font-weight-medium); display: flex; align-items: center; gap: .5rem; }
.phase.is-done .phase-title { color: var(--muted-foreground); font-weight: var(--font-weight-normal); }
.phase.is-upcoming .phase-title { color: var(--muted-foreground); }
.phase-now { font-size: var(--text-xs); font-weight: var(--font-weight-medium); color: var(--secondary); border: 1px solid var(--secondary); border-radius: 999px; padding: 0 .45rem; line-height: 1.4; }
.milestones { list-style: none; margin: .6rem 0 0; padding: 0; }
.timeline-item { position: relative; display: grid; grid-template-columns: 1.1rem 1fr auto; column-gap: .7rem; align-items: start; padding: 0 0 .7rem; }
.timeline-item:last-child { padding-bottom: .1rem; }
.timeline-node { position: relative; z-index: 1; width: 1.1rem; height: 1.1rem; border-radius: 50%; border: 2px solid var(--border); background: var(--card); display: flex; align-items: center; justify-content: center; font-size: .6rem; line-height: 1; color: var(--foreground); box-sizing: border-box; margin-top: .1rem; }
.timeline-body { min-width: 0; }
.timeline-title { margin: 0; font-size: var(--text-sm); }
.timeline-meta { margin: .05rem 0 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.timeline-action { margin: -.3rem 0 0; }
.is-done .timeline-node { background: var(--badge-ok); border-color: transparent; }
.is-done .timeline-title { color: var(--muted-foreground); }
.is-next .timeline-node { border-color: var(--secondary); }
.is-next .timeline-title { font-weight: var(--font-weight-medium); }
.is-overdue .timeline-node { border-color: var(--destructive); }
.is-overdue .timeline-title, .is-overdue .timeline-meta { color: var(--destructive); }
.timeline { list-style: none; margin: 0; padding: 0; }
.timeline + [data-slot="disclosure"] { margin-top: 1rem; }
[data-slot="disclosure"] > [data-slot="form"], [data-slot="disclosure"] > form { margin-top: .75rem; }

/* The gate: sign-up and welcome, read before there is a rail. */
.gate { max-width: 32rem; margin: 3rem auto; padding: 0 1rem; display: flex; flex-direction: column; gap: 1rem; }
.gate h1 { margin: 0; font-size: 1.25rem; font-weight: var(--font-weight-medium); }
.gate p { margin: 0; color: var(--foreground); font-size: var(--text-sm); line-height: 1.55; }
.gate a { color: var(--foreground); text-decoration: underline; text-underline-offset: .15em; }
/* A gate set in the middle of the window, its lines centred
   (GATE-PAGE's CENTRED): one short act, like a sign-in screen. */
.gate.is-centred { max-width: 24rem; min-height: 100svh; margin: 0 auto; padding: 2rem 1rem; box-sizing: border-box; justify-content: center; text-align: center; }
.gate.is-centred .gate-lockup { align-self: center; margin: 0 0 1.5rem; }
/* The ways through a gate, one under the other, each the width of
   the column: the buttons on an invitation's page. */
.gate-ways { display: flex; flex-direction: column; gap: .5rem; }
.gate .gate-ways a { text-decoration: none; }
.gate .gate-ways a[data-variant="default"] { color: var(--primary-foreground); }
/* A gate with a picture beside it (GATE-PAGE's ASIDE): the form down
   the left half, the picture filling the right. On a wide screen the
   page is exactly the window: it never scrolls, the picture stands
   still, and only the form's half scrolls when a step runs long. The
   half is the scroller, not the column in it, so the scrollbar sits at
   the half's edge; the padding centres the column. On a narrow screen
   only the form, and the page scrolls as any page does. */
.gate-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); height: 100svh; overflow: hidden; }
.gate-split > .gate { max-width: none; height: 100svh; margin: 0; padding: 1.5rem max(1.5rem, calc((100% - 29rem) / 2)) 0; box-sizing: border-box; overflow-y: auto; }
/* The lockup at the head of the form's column, at its left edge, with
   room under it before the heading. */
.gate-lockup { display: block; align-self: flex-start; width: auto; height: 1.5rem; margin: 0 0 3rem; }
.gate-aside { height: 100svh; overflow: hidden; }
.gate-aside img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 80% 45%; }
@media (max-width: 48rem) {
  .gate-split { grid-template-columns: 1fr; height: auto; overflow: visible; }
  .gate-split > .gate { height: auto; overflow: visible; }
  .gate-aside { display: none; }
}
/* The welcome questionnaire in steps: which step of how many, small,
   over the step's heading; the buttons held at the foot of the column. */
.welcome-form [hidden] { display: none; }
.welcome-step { display: flex; flex-direction: column; gap: 1rem; }
.welcome-step + .welcome-step { padding-top: 1.5rem; border-top: 1px solid var(--border); }
.welcome-form.is-stepped .welcome-step + .welcome-step { padding-top: 0; border-top: 0; }
/* On the welcome page the runs are short and the column is wide: two
   abreast rather than one long list to scroll. */
.welcome-form .check-ring { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem 1rem; }
.welcome-step h2 { margin: 0; font-size: 1.0625rem; font-weight: var(--font-weight-medium); }
.gate p.welcome-step-count { margin: 0 0 -.75rem; font-size: var(--text-xs); color: var(--muted-foreground); }
.welcome-foot { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: 1rem 0 1.5rem; background: var(--background); }
.welcome-foot .welcome-skip { order: -1; margin-right: auto; }
.welcome-form:not(.is-stepped) [data-step-back], .welcome-form:not(.is-stepped) [data-step-next] { display: none; }

/* The requests page: one table at a time, a row of tabs above it. */
.view-tabs { display: flex; gap: 1.25rem; margin: 0 0 1rem; }
.view-tab { padding: .35rem 0 .45rem; font-size: var(--text-sm); color: var(--foreground); text-decoration: none; border-bottom: 2px solid transparent; }
.view-tab:hover { border-bottom-color: var(--border); }
.view-tab[aria-current="page"] { color: var(--foreground); font-weight: var(--font-weight-medium); border-bottom-color: var(--foreground); }

/* A side-titled section (html/components/, SIDE-TITLED-SECTION): the heading
   down the left margin, the content beside it, a rule above each. */
.side-titled { display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: 1.5rem; padding: 1.5rem 0 1.75rem; border-top: 1px solid var(--border); }
.side-titled-head { min-width: 0; }
.side-titled-title { margin: 0; font-size: 1.125rem; line-height: 1.3; font-weight: var(--font-weight-semibold); }
.side-titled-note { margin: .35rem 0 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.side-titled-body { min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
.side-titled-body > .section-subline { margin: 0; }
@media (max-width: 40rem) { .side-titled { grid-template-columns: 1fr; gap: .75rem; } }
/* The brief's head: the title large, the sponsor under it, then the
   line of what it is and when it is due; the one button at the right. */
.brief-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; margin: .5rem 0 1.5rem; }
.brief-head > div { min-width: 0; }
.brief-title { margin: 0; font-size: 1.75rem; line-height: 1.2; font-weight: var(--font-weight-semibold); letter-spacing: -.01em; }
.brief-sponsor { margin: .25rem 0 0; font-size: 1.0625rem; color: var(--foreground); }
.brief-meta { margin: .75rem 0 0; font-size: var(--text-sm); color: var(--muted-foreground); }
.brief-meta strong { color: var(--foreground); font-weight: var(--font-weight-medium); }
.brief-meta .dotted-words-dot { margin: 0 .5rem; }
.brief-head [data-slot="kit-button"] { flex: none; }
/* Two actions at a head's right end: the profile beside the award. */
.head-actions { display: flex; align-items: center; gap: .5rem; }
.head-actions form { margin: 0; }
/* A sent proposal reads back as it stands: the lines no longer take the caret. */
.brief.is-sent .inline-edit, .brief.is-sent .check-tile, .brief.is-sent [data-slot=combobox], .brief.is-sent .choice-box { pointer-events: none; }
.brief.is-sent .field-box:hover { border-color: var(--border); }
/* Words parted by dots (html/components/, WORDS-PARTED-BY-DOTS). */
.dotted-words { margin: 0; font-size: var(--text-sm); line-height: 1.7; }
.dotted-words-dot { margin: 0 .55rem; color: var(--muted-foreground); }
/* The large fact list: three wide columns, the values a size up. */
.fact-list.is-large { grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.fact-list.is-large dd { font-size: var(--text-base); }
.fact-list.is-large dd .fact-list-plain { font-size: var(--text-sm); }
.brief { display: flex; flex-direction: column; margin-top: .5rem; }
/* Two columns of short items (html/components/, TWO-COLUMN-LIST). */
.two-column-list { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: 2rem; font-size: var(--text-sm); line-height: 1.7; }
.two-column-list li { break-inside: avoid; }
/* File rows (html/components/, FILE-ROWS): a glyph, the name, the size, the download. */
.file-rows { margin: 0; padding: 0; list-style: none; }
.file-row { display: flex; align-items: center; gap: .75rem; padding: .7rem .25rem; border-bottom: 1px solid var(--border); font-size: var(--text-sm); }
.file-row:first-child { border-top: 1px solid var(--border); }
.file-row-icon, .file-row-download { display: inline-grid; place-items: center; width: 1rem; height: 1rem; color: var(--foreground); flex: none; }
.file-row-icon svg, .file-row-download svg { width: 1rem; height: 1rem; }
.file-row-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-row-size { color: var(--muted-foreground); font-variant-numeric: tabular-nums; }
a.file-row-download:hover { color: var(--foreground); }

/* The confidentiality agreement, read before the brief. */
.cda-text { margin: .75rem 0 0; display: flex; flex-direction: column; gap: .6rem; max-width: 46rem; }
.cda-text p { margin: 0; font-size: var(--text-sm); line-height: 1.55; }
.cda-text .cda-heading { margin: 1rem 0 0; font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
.cda-text .cda-attribution { color: var(--muted-foreground); }
.cda-text dd p { margin: 0; }
.cda-text dd p + p { margin-top: .4rem; }
.cda-clause { display: flex; gap: .5rem; }
.cda-clause .cda-label { flex: 0 0 2rem; }
.cda-clause.depth-0 { margin-top: .6rem; font-weight: var(--font-weight-medium); }
.cda-clause.depth-1 { padding-left: 2.5rem; }
.cda-clause.depth-2 { padding-left: 5rem; }
#cda form { margin: 1rem 0 0; max-width: 46rem; }
/* The one box ticked to accept: a check-grid item alone, reading as a sentence. */
.cda-authority { align-items: flex-start; }
.cda-authority [data-slot=checkbox] { margin-top: .15rem; }
/* The record an agreement's page shows, and its fingerprint. */
.cda-record { margin: 1.5rem 0 0; }
.cda-fingerprint { font-size: var(--text-xs); word-break: break-all; }

/* Questions on a brief (question.lisp): one under the other, parted
   by a rule; the answer set in from the question, the way an update's
   answer is. */
.question-list { margin: 0; padding: 0; list-style: none; max-width: 46rem; }
.question { padding: .9rem 0; border-top: 1px solid var(--border); }
.question:first-child { border-top: 0; padding-top: 0; }
.question-text { margin: 0; font-size: var(--text-sm); line-height: 1.55; white-space: pre-wrap; }
.question-meta { margin: .3rem 0 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.question-meta strong { color: var(--foreground); font-weight: var(--font-weight-medium); }
.question-answer { margin: .7rem 0 0; padding: .55rem .8rem; border-left: 3px solid var(--foreground); }
.question-answer-head { margin: 0 0 .25rem; font-size: var(--text-xs); color: var(--muted-foreground); }
.question-answer-head strong { color: var(--foreground); font-weight: var(--font-weight-medium); }
.question-answer-text { margin: 0; font-size: var(--text-sm); line-height: 1.55; white-space: pre-wrap; }
.question-waiting { margin: .5rem 0 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.question-answer-form { margin: .6rem 0 0; }
/* The ask box: the field and its button, above the thread. */
.question-ask { max-width: 46rem; margin: 0 0 1.25rem; }
.question-ask textarea { width: 100%; box-sizing: border-box; }
.question-list .question:first-child { border-top: 0; }
.question-ask + .question-list { border-top: 1px solid var(--border); padding-top: .9rem; }

/* Deliverables: the due column says how late in red. */
.row-subtitle.overdue { color: var(--destructive); }
/* A line under a cell that names several things, such as the price
   lines a proposal leaves out: it wraps under the cell's words rather
   than running the row off the page. */
.row-subtitle.is-wrapping { white-space: normal; max-width: 20rem; line-height: 1.4; }
/* A sentence in a table cell, not a word or a number: what came of a
   price list the portal read. It wraps inside its cell as the subtitle
   above does, in the cell's own colour. */
.cell-sentence { display: inline-block; white-space: normal; max-width: 26rem; line-height: 1.4; }
/* Words about work going on now, as a price list being read: a band of
   light crosses them, slowly. No dot, no spinner, nothing added to the
   row. The words hold still for a reader who asked for less motion. */
.is-being-read { color: transparent; background: linear-gradient(90deg, var(--muted-foreground) 0%, var(--muted-foreground) 35%, var(--foreground) 50%, var(--muted-foreground) 65%, var(--muted-foreground) 100%); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; animation: being-read-sweep 2.4s linear infinite; }
@keyframes being-read-sweep { from { background-position: 100% 0; } to { background-position: -50% 0; } }
@media (prefers-reduced-motion: reduce) { .is-being-read { animation: none; background: none; color: var(--foreground); } }
/* A section whose rows were drawn in a moment ago, without a reload:
   one soft wash that fades, so the eye finds what is new. */
.has-just-arrived { animation: just-arrived-wash 1.6s ease-out 1; }
@keyframes just-arrived-wash { from { background: var(--muted); } to { background: transparent; } }
@media (prefers-reduced-motion: reduce) { .has-just-arrived { animation: none; } }
/* The tables inside a document two parties sign: the price lines, the
   design, the deliverables. Plain rules and the document's own measure,
   so the words that were signed read as a document and not as a page. */
.work-order-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); margin: .25rem 0 .5rem; }
.work-order-table th { text-align: left; font-weight: var(--font-weight-medium); padding: .35rem .6rem .35rem 0; border-bottom: 1px solid var(--border); }
.work-order-table td { padding: .35rem .6rem .35rem 0; border-bottom: 1px solid var(--border); vertical-align: top; }

/* The admin overview: a number, its name, and the list it opens. A
   card rather than a field, because each one is a record of its own —
   a count that stands on its own and leads somewhere. Laid out so a
   row of them wraps on a narrow window instead of squeezing. */
.admin-tiles { display: flex; flex-wrap: wrap; gap: .75rem; }
.admin-tile { flex: 1 1 10rem; min-width: 10rem; display: flex; flex-direction: column; gap: .15rem;
              padding: .9rem 1rem 1rem; border: 1px solid var(--border); border-radius: var(--radius);
              background: var(--card); color: var(--foreground); text-decoration: none; }
.admin-tile:hover { border-color: var(--foreground); }
.admin-tile-number { font-size: 1.6rem; line-height: 1.1; font-weight: var(--font-weight-semibold);
                     font-variant-numeric: tabular-nums; }
.admin-tile-heading { font-size: var(--text-sm); font-weight: var(--font-weight-medium); }
/* The only faint text here, and it is a hint under a heading. */
.admin-tile-subline { font-size: var(--text-xs); color: var(--muted-foreground); }
/* Something is waiting: a heavier left edge, not a colour. Nothing on
   this page is an error, and red would say it was. */
.admin-tile.is-waiting { border-left-width: 3px; border-left-color: var(--foreground); }
/* A standing badge with the one act that moves the organisation on beside it. */
.standing-with-act { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.standing-with-act form { display: inline-flex; align-items: center; gap: .35rem; margin: 0; }

/* The admin rail's tile, where a customer's logo sits in the portal:
   there is no organisation whose page this is, and the difference is
   the one cue that you are not in the product. */
.logo-tile.is-admin { background: var(--foreground); color: var(--background);
                      font-weight: var(--font-weight-semibold); }

/* Updates: a conversation, not a form's echo. */
.update-list { gap: 1rem; }
.update-card { padding: 1rem 1.25rem 1.1rem; border-left-width: 3px; }
.update-card.is-asking { border-left-color: var(--badge-warn); }
.update-card.is-unscheduled { border-left-color: var(--destructive); }
.update-head { display: flex; align-items: center; gap: .75rem; margin: 0 0 .75rem; font-size: var(--text-sm); }
.avatar-dot { flex: none; width: 2rem; height: 2rem; border-radius: 50%; background: var(--secondary); color: var(--secondary-foreground); display: flex; align-items: center; justify-content: center; font-size: var(--text-xs); font-weight: var(--font-weight-semibold); letter-spacing: .02em; }
.update-who { min-width: 0; flex: 1; }
.update-author { margin: 0; font-weight: var(--font-weight-medium); color: var(--foreground); }
.update-org { margin-left: .5rem; font-weight: var(--font-weight-normal); color: var(--muted-foreground); }
.update-when { margin: 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.update-flags { display: flex; gap: .4rem; flex-wrap: wrap; justify-content: flex-end; }
.update-progress { margin: 0 0 .75rem; font-size: var(--text-base); line-height: 1.55; white-space: pre-wrap; }
.update-none { margin: 0; font-size: var(--text-xs); color: var(--muted-foreground); }
.update-callout { border-left: 3px solid var(--border); padding: .35rem .8rem; margin: 0 0 .6rem; background: color-mix(in oklab, var(--muted) 60%, transparent); border-radius: 0 var(--radius) var(--radius) 0; }
.update-callout.is-blockers { border-left-color: var(--badge-warn); }
.update-callout.is-deviations { border-left-color: var(--destructive); }
.update-callout-label { margin: 0 0 .15rem; font-size: var(--text-xs); font-weight: var(--font-weight-medium); color: var(--muted-foreground); text-transform: uppercase; letter-spacing: .04em; }
.update-callout-text { margin: 0; font-size: var(--text-sm); white-space: pre-wrap; }
.update-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .5rem 1.5rem; margin: .5rem 0 0; font-size: var(--text-sm); }
.update-plan div { min-width: 0; }
.update-plan dt { font-size: var(--text-xs); color: var(--muted-foreground); margin: 0 0 .1rem; }
.update-plan dd { margin: 0; white-space: pre-wrap; }
.update-answer { margin: .9rem 0 0; padding: .7rem .9rem; border-radius: var(--radius); background: color-mix(in oklab, var(--badge-ok) 22%, transparent); border: 1px solid color-mix(in oklab, var(--badge-ok) 60%, transparent); }
.update-answer-head { margin: 0 0 .25rem; font-size: var(--text-xs); color: var(--muted-foreground); }
.update-answer-head strong { color: var(--foreground); font-weight: var(--font-weight-medium); }
.update-answer-text { margin: 0; font-size: var(--text-sm); white-space: pre-wrap; }
.update-link { display: block; color: inherit; text-decoration: none; }
.update-link:hover .update-author { text-decoration: underline; text-underline-offset: .15em; }
.update-foot { display: flex; align-items: center; gap: 1rem; margin: .8rem 0 0; font-size: var(--text-sm); }
.update-foot a { color: var(--foreground); text-decoration: underline; text-underline-offset: .15em; }
.update-foot [data-slot="button"] { text-decoration: none; }
/* An update's own page: what it says, read at a measure; the answer composed under it. */
.update-reading { max-width: 46rem; }
.update-reading .update-progress { font-size: 1.05rem; }
.update-compose, .answer-compose { max-width: 46rem; }
/* The emails table: the subject is the row, the sentence under it is what the mail said. */
#notices td.row-wide { max-width: none; white-space: normal; overflow: visible; }
.notice-subject { display: block; font-weight: var(--font-weight-medium); overflow-wrap: anywhere; }
.notice-body { display: block; margin-top: .15rem; font-size: var(--text-xs); color: var(--muted-foreground); }

/* The contract: a numbered specification, read first, edited from a button. */
.spec { max-width: 58rem; }
.spec-section { padding: 1.25rem 0 1.5rem; border-top: 1px solid var(--border); }
.spec-section:first-child { border-top: 0; padding-top: .5rem; }
.spec-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 .75rem; }
.spec-title { margin: 0; font-size: var(--text-base); font-weight: var(--font-weight-semibold); display: flex; align-items: baseline; gap: .6rem; }
.spec-number { font-size: var(--text-xs); color: var(--muted-foreground); font-weight: var(--font-weight-normal); font-variant-numeric: tabular-nums; }
.spec-lead { margin: 0 0 .9rem; font-size: var(--text-base); line-height: 1.55; }
.spec-summary { margin: .9rem 0 0; font-size: var(--text-sm); color: var(--muted-foreground); line-height: 1.55; }
.spec-subtle { color: var(--muted-foreground); }
.spec-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .6rem 1.5rem; margin: 0; }
.spec-facts div { min-width: 0; }
.spec-facts dt { font-size: var(--text-xs); color: var(--muted-foreground); margin: 0 0 .1rem; }
.spec-facts dd { margin: 0; font-size: var(--text-sm); }
.spec-rules { margin: 0; padding-left: 1.2rem; font-size: var(--text-sm); line-height: 1.55; display: flex; flex-direction: column; gap: .5rem; }
.spec-list { font-weight: var(--font-weight-medium); }
.spec-aside { margin: .9rem 0 0; }
.spec-edit > [data-slot="form"], .spec-edit > form { margin-top: .75rem; }
.spec-actions { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; margin: .5rem 0 0; }
/* The first-time showing: one banner on the page each step is about. */

/* The staff page: a join link is read and copied, so it wraps rather than clips. */
.invitation-link { font-family: var(--font-mono); font-size: var(--text-xs); overflow-wrap: anywhere; user-select: all; }
#staff-invitations td.row-wide { max-width: none; white-space: normal; }