/* Generated by `npm run build` from tokens/ (copy of dist/css/all.css). Do not edit. */
/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --font-family-sans: 'Noto Sans', 'Noto Sans Devanagari', system-ui, sans-serif;
  --font-family-mono: 'Noto Sans Mono', ui-monospace, monospace;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.375rem;
  --font-size-2xl: 1.75rem;
  --font-size-3xl: 2.25rem;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --font-line-height-tight: 1.25;
  --font-line-height-normal: 1.5;
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --size-touch-target: 48px;
  --motion-duration-fast: 120ms;
  --motion-duration-normal: 200ms;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand="studio"][data-theme="light"], :root {
  --semantic-bg-canvas: #f6f7f9;
  --semantic-bg-surface: #ffffff;
  --semantic-bg-surface-raised: #ffffff;
  --semantic-bg-inverse: #161a22;
  --semantic-text-primary: #161a22;
  --semantic-text-secondary: #4f5666;
  --semantic-text-inverse: #ffffff;
  --semantic-text-link: #1a449f;
  --semantic-border-default: #d9dde4;
  --semantic-border-strong: #6b7385;
  --semantic-action-primary-bg: #1a449f;
  --semantic-action-primary-fg: #ffffff;
  --semantic-action-primary-hover: #1f55c9;
  --semantic-action-secondary-bg: #eceef2;
  --semantic-action-secondary-fg: #161a22;
  --semantic-focus-ring: #1f55c9;
  --semantic-status-success-bg: #d9f3e3;
  --semantic-status-success-fg: #16653a;
  --semantic-status-warning-bg: #fff1c7;
  --semantic-status-warning-fg: #7a5600;
  --semantic-status-danger-bg: #fde0df;
  --semantic-status-danger-fg: #a2231c;
  --semantic-status-info-bg: #d4f1f6;
  --semantic-status-info-fg: #0f5d6e;
  --semantic-chart-1: #1f55c9;
  --semantic-chart-2: #6d3fd1;
  --semantic-chart-3: #0f8a6a;
  --semantic-chart-4: #c2520a;
  --semantic-chart-5: #c7265a;
  --semantic-chart-6: #0b7a90;
  --semantic-chart-grid: #d9dde4;
  --semantic-chart-positive: #16653a;
  --semantic-chart-negative: #a2231c;
  --semantic-tint-1-bg: #dbe7ff;
  --semantic-tint-1-fg: #1a449f;
  --semantic-tint-2-bg: #ece4ff;
  --semantic-tint-2-fg: #4a2a99;
  --semantic-tint-3-bg: #d4f3ec;
  --semantic-tint-3-fg: #0d5c48;
  --semantic-tint-4-bg: #fdeecf;
  --semantic-tint-4-fg: #7f4f03;
  --semantic-tint-5-bg: #fde0e8;
  --semantic-tint-5-fg: #8c1a44;
  --semantic-tint-6-bg: #d4f1f6;
  --semantic-tint-6-fg: #0f5d6e;
}

/**
 * Do not edit directly, this file was auto-generated.
 */

[data-brand="studio"][data-theme="dark"] {
  --semantic-bg-canvas: #0d1016;
  --semantic-bg-surface: #161a22;
  --semantic-bg-surface-raised: #232833;
  --semantic-bg-inverse: #f6f7f9;
  --semantic-text-primary: #f6f7f9;
  --semantic-text-secondary: #b9c0cc;
  --semantic-text-inverse: #161a22;
  --semantic-text-link: #8db2ff;
  --semantic-border-default: #363c49;
  --semantic-border-strong: #6b7385;
  --semantic-action-primary-bg: #8db2ff;
  --semantic-action-primary-fg: #0d1016;
  --semantic-action-primary-hover: #dbe7ff;
  --semantic-action-secondary-bg: #232833;
  --semantic-action-secondary-fg: #f6f7f9;
  --semantic-focus-ring: #8db2ff;
  --semantic-status-success-bg: #16653a;
  --semantic-status-success-fg: #d9f3e3;
  --semantic-status-warning-bg: #7a5600;
  --semantic-status-warning-fg: #fff1c7;
  --semantic-status-danger-bg: #a2231c;
  --semantic-status-danger-fg: #fde0df;
  --semantic-status-info-bg: #0f5d6e;
  --semantic-status-info-fg: #d4f1f6;
  --semantic-chart-1: #8db2ff;
  --semantic-chart-2: #c2a8ff;
  --semantic-chart-3: #5fd3b3;
  --semantic-chart-4: #ffb070;
  --semantic-chart-5: #ff9fbb;
  --semantic-chart-6: #7dd0e0;
  --semantic-chart-grid: #363c49;
  --semantic-chart-positive: #7fd3a0;
  --semantic-chart-negative: #f59a95;
  --semantic-tint-1-bg: #1a449f;
  --semantic-tint-1-fg: #dbe7ff;
  --semantic-tint-2-bg: #4a2a99;
  --semantic-tint-2-fg: #ece4ff;
  --semantic-tint-3-bg: #0d5c48;
  --semantic-tint-3-fg: #d4f3ec;
  --semantic-tint-4-bg: #7f4f03;
  --semantic-tint-4-fg: #fdeecf;
  --semantic-tint-5-bg: #8c1a44;
  --semantic-tint-5-fg: #fde0e8;
  --semantic-tint-6-bg: #0f5d6e;
  --semantic-tint-6-fg: #d4f1f6;
}

/* Generated by @osmanbits/design-tokens from tokens/styles/material. Do not edit. */
[data-style="material"] {
  --style-radius-sm: 0.25rem;
  --style-radius-md: 0.75rem;
  --style-radius-lg: 1rem;
  --style-radius-xl: 1.75rem;
  --style-radius-full: 999px;
  --style-shape-control: var(--style-radius-full);
  --style-shape-field: var(--style-radius-sm);
  --style-shape-container: var(--style-radius-md);
  --style-shape-dialog: var(--style-radius-xl);
  --style-shape-checkbox: 0.125rem;
  --style-shape-badge: var(--style-radius-full);
  --style-shape-switch: var(--style-radius-full);
  --style-shape-toast: var(--style-radius-sm);
  --style-shape-tab-indicator: 3px 3px 0 0;
  --style-surface-page: var(--semantic-bg-surface);
  --style-surface-container: color-mix(in srgb, var(--semantic-action-primary-bg) 5%, var(--semantic-bg-surface));
  --style-surface-container-high: color-mix(in srgb, var(--semantic-action-primary-bg) 9%, var(--semantic-bg-surface));
  --style-surface-control: color-mix(in srgb, var(--semantic-action-primary-bg) 12%, var(--semantic-bg-surface));
  --style-surface-field: var(--semantic-bg-surface);
  --style-on-surface: var(--semantic-text-primary);
  --style-on-surface-variant: var(--semantic-text-secondary);
  --style-toast-bg: var(--semantic-bg-inverse);
  --style-toast-fg: var(--semantic-text-inverse);
  --style-switch-thumb-off: var(--semantic-text-secondary);
  --style-focus-ring-width: 3px;
  --style-focus-ring-offset: 2px;
  --style-focus-ring-color: var(--semantic-focus-ring);
  --style-border-width-control: 1px;
  --style-border-width-container: 0px;
  --style-border-color-container: transparent;
  --style-border-color-divider: var(--semantic-border-default);
  --style-border-color-error: var(--semantic-status-danger-fg);
  --style-field-border-width: 1px;
  --style-field-border-width-focus: 2px;
  --style-field-indicator-width: 0px;
  --style-field-shadow: none;
  --style-state-hover-opacity: 0.08;
  --style-state-focus-opacity: 0.10;
  --style-state-pressed-opacity: 0.10;
  --style-state-disabled-content-opacity: 0.38;
  --style-state-disabled-container-opacity: 0.12;
  --style-density-control-height: 3rem;
  --style-density-touch-target: 3rem;
  --style-density-control-padding-inline: 1.5rem;
  --style-density-field-padding-inline: 1rem;
  --style-density-field-padding-block: 1rem;
  --style-density-container-padding: 1rem;
  --style-density-gap: 0.5rem;
  --style-motion-duration-short: 150ms;
  --style-motion-duration-medium: 300ms;
  --style-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --style-motion-easing-emphasized: cubic-bezier(0.05, 0.7, 0.1, 1);
  --style-font-weight-control: 500;
  --style-font-weight-heading: 500;
  --style-letter-spacing-control: 0.00625rem;
  --style-elevation-0: none;
  --style-elevation-1: 0 1px 2px 0 rgb(0 0 0 / 0.30), 0 1px 3px 1px rgb(0 0 0 / 0.15);
  --style-elevation-2: 0 1px 2px 0 rgb(0 0 0 / 0.30), 0 2px 6px 2px rgb(0 0 0 / 0.15);
  --style-elevation-3: 0 1px 3px 0 rgb(0 0 0 / 0.30), 0 4px 8px 3px rgb(0 0 0 / 0.15);
  --style-elevation-control: none;
  --style-elevation-control-hover: 0 1px 2px 0 rgb(0 0 0 / 0.30), 0 1px 3px 1px rgb(0 0 0 / 0.15);
  --style-elevation-control-pressed: none;
  --style-elevation-inset: none;
  --style-border-color-control: var(--semantic-border-strong);
  --style-field-border-color: var(--semantic-border-strong);
}
[data-style="material"][data-theme="dark"] {
  --style-elevation-0: none;
  --style-elevation-1: 0 1px 2px 0 rgb(0 0 0 / 0.60), 0 1px 3px 1px rgb(0 0 0 / 0.35);
  --style-elevation-2: 0 1px 2px 0 rgb(0 0 0 / 0.60), 0 2px 6px 2px rgb(0 0 0 / 0.35);
  --style-elevation-3: 0 1px 3px 0 rgb(0 0 0 / 0.60), 0 4px 8px 3px rgb(0 0 0 / 0.35);
  --style-elevation-control: none;
  --style-elevation-control-hover: 0 1px 2px 0 rgb(0 0 0 / 0.60), 0 1px 3px 1px rgb(0 0 0 / 0.35);
  --style-elevation-control-pressed: none;
  --style-elevation-inset: none;
  --style-border-color-control: color-mix(in srgb, var(--semantic-border-strong) 65%, var(--semantic-text-secondary));
  --style-field-border-color: color-mix(in srgb, var(--semantic-border-strong) 65%, var(--semantic-text-secondary));
}

/* Generated by @osmanbits/design-tokens from tokens/styles/neumorphic. Do not edit. */
[data-style="neumorphic"] {
  --style-radius-sm: 0.375rem;
  --style-radius-md: 0.75rem;
  --style-radius-lg: 1.25rem;
  --style-radius-xl: 1.5rem;
  --style-radius-full: 999px;
  --style-shape-control: var(--style-radius-md);
  --style-shape-field: var(--style-radius-md);
  --style-shape-container: var(--style-radius-lg);
  --style-shape-dialog: var(--style-radius-xl);
  --style-shape-checkbox: var(--style-radius-sm);
  --style-shape-badge: var(--style-radius-full);
  --style-shape-switch: var(--style-radius-full);
  --style-shape-toast: var(--style-radius-md);
  --style-shape-tab-indicator: var(--style-radius-full);
  --style-surface-container: var(--style-surface-page);
  --style-surface-container-high: var(--style-surface-page);
  --style-surface-control: var(--style-surface-page);
  --style-surface-field: var(--style-surface-page);
  --style-on-surface: var(--semantic-text-primary);
  --style-on-surface-variant: var(--semantic-text-secondary);
  --style-toast-bg: var(--semantic-bg-inverse);
  --style-toast-fg: var(--semantic-text-inverse);
  --style-switch-thumb-off: var(--semantic-text-secondary);
  --style-focus-ring-width: 3px;
  --style-focus-ring-offset: 3px;
  --style-focus-ring-color: var(--semantic-focus-ring);
  --style-border-width-control: 2px;
  --style-border-width-container: 1px;
  --style-border-color-container: var(--semantic-border-default);
  --style-border-color-divider: var(--semantic-border-default);
  --style-border-color-error: var(--semantic-status-danger-fg);
  --style-field-border-width: 2px;
  --style-field-border-width-focus: 2px;
  --style-field-indicator-width: 0px;
  --style-field-shadow: var(--style-elevation-inset);
  --style-state-hover-opacity: 0.08;
  --style-state-focus-opacity: 0.12;
  --style-state-pressed-opacity: 0.16;
  --style-state-disabled-content-opacity: 0.38;
  --style-state-disabled-container-opacity: 0.12;
  --style-density-control-height: 3rem;
  --style-density-touch-target: 3rem;
  --style-density-control-padding-inline: 1.5rem;
  --style-density-field-padding-inline: 1rem;
  --style-density-field-padding-block: 0.75rem;
  --style-density-container-padding: 1.5rem;
  --style-density-gap: 1rem;
  --style-motion-duration-short: 150ms;
  --style-motion-duration-medium: 250ms;
  --style-motion-easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --style-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
  --style-font-weight-control: 600;
  --style-font-weight-heading: 700;
  --style-letter-spacing-control: 0.01rem;
  --style-surface-page: color-mix(in srgb, var(--semantic-bg-canvas) 93%, var(--semantic-text-primary));
  --style-elevation-0: none;
  --style-elevation-1: 0.25rem 0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 80%, black), -0.25rem -0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-2: 0.375rem 0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 80%, black), -0.375rem -0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-3: 0.5rem 0.5rem 1rem color-mix(in srgb, var(--style-surface-page) 80%, black), -0.5rem -0.5rem 1rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-control: 0.25rem 0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 80%, black), -0.25rem -0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-control-hover: 0.375rem 0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 80%, black), -0.375rem -0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-control-pressed: inset 0.1875rem 0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 80%, black), inset -0.1875rem -0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-elevation-inset: inset 0.1875rem 0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 80%, black), inset -0.1875rem -0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 30%, white);
  --style-border-color-control: var(--semantic-border-strong);
  --style-field-border-color: var(--semantic-border-strong);
}
[data-style="neumorphic"][data-theme="dark"] {
  --style-surface-page: color-mix(in srgb, var(--semantic-bg-surface) 92%, var(--semantic-text-primary));
  --style-elevation-0: none;
  --style-elevation-1: 0.25rem 0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 45%, black), -0.25rem -0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-2: 0.375rem 0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 45%, black), -0.375rem -0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-3: 0.5rem 0.5rem 1rem color-mix(in srgb, var(--style-surface-page) 45%, black), -0.5rem -0.5rem 1rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-control: 0.25rem 0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 45%, black), -0.25rem -0.25rem 0.5rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-control-hover: 0.375rem 0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 45%, black), -0.375rem -0.375rem 0.75rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-control-pressed: inset 0.1875rem 0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 45%, black), inset -0.1875rem -0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-elevation-inset: inset 0.1875rem 0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 45%, black), inset -0.1875rem -0.1875rem 0.375rem color-mix(in srgb, var(--style-surface-page) 88%, white);
  --style-border-color-control: color-mix(in srgb, var(--semantic-border-strong) 65%, var(--semantic-text-secondary));
  --style-field-border-color: color-mix(in srgb, var(--semantic-border-strong) 65%, var(--semantic-text-secondary));
}

/* Generated by @osmanbits/design-tokens from tokens/styles/studio. Do not edit. */
[data-style="studio"], :where(:root) {
  --style-radius-sm: 0.25rem;
  --style-radius-md: 0.5rem;
  --style-radius-lg: 0.75rem;
  --style-radius-xl: 1rem;
  --style-radius-full: 999px;
  --style-shape-control: var(--style-radius-md);
  --style-shape-field: var(--style-radius-md);
  --style-shape-container: var(--style-radius-lg);
  --style-shape-dialog: var(--style-radius-xl);
  --style-shape-checkbox: var(--style-radius-sm);
  --style-shape-badge: var(--style-radius-full);
  --style-shape-switch: var(--style-radius-full);
  --style-shape-toast: var(--style-radius-md);
  --style-shape-tab-indicator: 0;
  --style-surface-page: var(--semantic-bg-canvas);
  --style-surface-container: var(--semantic-bg-surface);
  --style-surface-container-high: var(--semantic-bg-surface-raised);
  --style-surface-control: var(--semantic-action-secondary-bg);
  --style-surface-field: var(--semantic-bg-surface);
  --style-on-surface: var(--semantic-text-primary);
  --style-on-surface-variant: var(--semantic-text-secondary);
  --style-toast-bg: var(--semantic-bg-inverse);
  --style-toast-fg: var(--semantic-text-inverse);
  --style-switch-thumb-off: var(--semantic-text-secondary);
  --style-focus-ring-width: 3px;
  --style-focus-ring-offset: 2px;
  --style-focus-ring-color: var(--semantic-focus-ring);
  --style-border-width-control: 1px;
  --style-border-width-container: 1px;
  --style-border-color-control: var(--semantic-border-strong);
  --style-border-color-container: var(--semantic-border-default);
  --style-border-color-divider: var(--semantic-border-default);
  --style-border-color-error: var(--semantic-status-danger-fg);
  --style-field-border-width: 1px;
  --style-field-border-width-focus: 2px;
  --style-field-indicator-width: 0px;
  --style-field-border-color: var(--semantic-border-strong);
  --style-field-shadow: none;
  --style-state-hover-opacity: 0.08;
  --style-state-focus-opacity: 0.12;
  --style-state-pressed-opacity: 0.16;
  --style-state-disabled-content-opacity: 0.38;
  --style-state-disabled-container-opacity: 0.12;
  --style-density-control-height: 3rem;
  --style-density-touch-target: 3rem;
  --style-density-control-padding-inline: 1.25rem;
  --style-density-field-padding-inline: 0.75rem;
  --style-density-field-padding-block: 0.75rem;
  --style-density-container-padding: 1.5rem;
  --style-density-gap: 0.75rem;
  --style-motion-duration-short: 120ms;
  --style-motion-duration-medium: 200ms;
  --style-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --style-motion-easing-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --style-font-weight-control: 600;
  --style-font-weight-heading: 700;
  --style-letter-spacing-control: 0;
  --style-elevation-0: none;
  --style-elevation-1: 0 1px 2px rgb(0 0 0 / 0.10), 0 1px 3px rgb(0 0 0 / 0.08);
  --style-elevation-2: 0 2px 4px rgb(0 0 0 / 0.10), 0 4px 10px rgb(0 0 0 / 0.08);
  --style-elevation-3: 0 6px 12px rgb(0 0 0 / 0.10), 0 12px 28px rgb(0 0 0 / 0.08);
  --style-elevation-control: none;
  --style-elevation-control-hover: 0 1px 2px rgb(0 0 0 / 0.10);
  --style-elevation-control-pressed: none;
  --style-elevation-inset: none;
}
[data-style="studio"][data-theme="dark"], :where(:root[data-theme="dark"]) {
  --style-elevation-0: none;
  --style-elevation-1: 0 1px 2px rgb(0 0 0 / 0.45), 0 1px 3px rgb(0 0 0 / 0.35);
  --style-elevation-2: 0 2px 4px rgb(0 0 0 / 0.45), 0 4px 10px rgb(0 0 0 / 0.35);
  --style-elevation-3: 0 6px 12px rgb(0 0 0 / 0.45), 0 12px 28px rgb(0 0 0 / 0.35);
  --style-elevation-control: none;
  --style-elevation-control-hover: 0 1px 2px rgb(0 0 0 / 0.45);
  --style-elevation-control-pressed: none;
  --style-elevation-inset: none;
}