/* Generated by @allie/tokens from Skaler Labs 1791725174-b15e + Allie layer v1 (0.1.0). Do not edit. */

:root {
  color-scheme: light;
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Menlo, monospace;
  --font-serif: ui-serif, "New York", "Iowan Old Style", Georgia, serif;
  --sk-radius-xs: 6px;
  --sk-radius-check: 5px;
  --sk-radius-sm: 8px;
  --sk-radius-md: 10px;
  --sk-radius-menu: 12px;
  --sk-radius-lg: 16px;
  --sk-radius-bubble: 18px;
  --sk-radius-composer: 24px;
  --sk-radius-pill: 999px;
  --sk-space-0: 0;
  --sk-space-1: 2px;
  --sk-space-2: 4px;
  --sk-space-3: 6px;
  --sk-space-4: 8px;
  --sk-space-5: 12px;
  --sk-space-6: 16px;
  --sk-space-7: 20px;
  --sk-space-8: 24px;
  --sk-space-9: 32px;
  --sk-space-10: 40px;
  --sk-space-11: 48px;
  --sk-space-12: 64px;
  --sk-control-sm: 28px;
  --sk-control-md: 36px;
  --sk-control-lg: 44px;
  --sk-control-xl: 52px;
  --sk-icon-sm: 16px;
  --sk-icon-md: 18px;
  --sk-icon-lg: 22px;
  --sk-hit-min: 44px;
  --sk-sidebar-w: 300px;
  --sk-rail-w: 340px;
  --sk-thread-max: 720px;
  --sk-bubble-max: 560px;
  --sk-glass-blur: 20px;
  --sk-hit-android: 48px;
  --sk-avatar-sm: 24px;
  --sk-avatar-md: 36px;
  --sk-nav-row-h: 40px;
  --sk-disabled-opacity: 0.4;
  --sk-z-base: 0;
  --sk-z-sticky: 10;
  --sk-z-popover: 20;
  --sk-z-scrim: 30;
  --sk-z-drawer: 31;
  --sk-z-modal: 40;
  --sk-z-toast: 50;
  --sk-sidebar-min: 240px;
  --sk-sidebar-max: 360px;
  --sk-sidebar-rail: 72px;
  --sk-drawer-max: 360px;
  --sk-header-h: 64px;
  --sk-header-h-mobile: 56px;
  --sk-modal-sm: 480px;
  --sk-modal-lg: 720px;
  --sk-settings-w: 960px;
  --sk-settings-h: 740px;
  --sk-settings-nav: 208px;
  --sk-toast-w: 356px;
  --sk-menu-min: 200px;
  --sk-menu-user: 240px;
  --sk-suggest-max: 360px;
  --sk-composer-min: 44px;
  --sk-composer-max: 144px;
  --sk-thread-gutter: 12px;
  --sk-bp-compact: 640px;
  --sk-bp-drawer: 700px;
  --sk-bp-wide: 1024px;
  --sk-gutter-compact: 16px;
  --sk-gutter-medium: 24px;
  --sk-gutter-wide: 32px;
  --al-radius-nav: 12px;
  --al-radius-card: 16px;
  --al-radius-card-lg: 20px;
  --al-radius-card-phone: 22px;
  --al-radius-code-box: 12px;
  --al-radius-tile: 12px;
  --al-radius-bubble-tail: 4px;
  --al-radius-watch-card: 16px;
  --al-radius-watch-field: 14px;
  --al-radius-device: 44px;
  --al-tabbar-height: 62px;
  --al-tabbar-inset: 16px;
  --al-tabbar-bottom: 28px;
  --al-ask-size: 62px;
  --al-circle-button: 44px;
  --al-message-capsule: 54px;
  --al-nav-height: 44px;
  --al-scene-phone-today: 420px;
  --al-scene-phone-intro: 440px;
  --al-scene-phone-today-inset: 276px;
  --al-scene-phone-intro-inset: 330px;
  --al-web-control: 46px;
  --al-web-card: 420px;
  --al-lede-max: 460px;
  --al-code-box: 52px;
  --al-web-page: 700px;
  --al-web-form: 760px;
  --al-web-focus: 560px;
  --al-web-action: 40px;
  --al-web-button-sm: 32px;
  --al-avatar: 44px;
  --al-avatar-lg: 64px;
  --al-member-row: 78px;
  --al-step: 22px;
  --al-outline: 1.5px;
  --al-swatch: 32px;
  --al-avatar-sm: 28px;
  --al-today-card-min: 240px;
  --al-switch-width: 44px;
  --al-switch-height: 26px;
  --al-switch-thumb-size: 20px;
  --al-avatar-xs: 20px;
  --al-assign-menu: 288px;
  --al-web-wide: 1040px;
  --al-badge: 16px;
  --al-watch-button: 44px;
  --al-watch-row: 40px;
  --al-watch-check: 20px;
  --al-watch-mark: 48px;
  --al-calendar-hour: 44px;
  --al-agenda-time: 74px;
  --al-site-gutter: 56px;
  --al-site-section: 72px;
  --al-site-hero: 880px;
  --al-site-title: 640px;
  --al-site-lede: 500px;
  --al-site-feature: 200px;
  --al-site-wide: 1328px;
  --al-scene-phone-site: 280px;
  --t-h1-size: 28px;
  --t-h1-line: 34px;
  --t-h2-size: 22px;
  --t-h2-line: 28px;
  --t-h3-size: 18px;
  --t-h3-line: 24px;
  --t-h4-size: 15px;
  --t-h4-line: 20px;
  --t-h5-size: 13px;
  --t-h5-line: 18px;
  --t-body-size: 14px;
  --t-body-line: 21px;
  --t-small-size: 13px;
  --t-small-line: 18px;
  --t-caption-size: 12px;
  --t-caption-line: 16px;
  --t-label-size: 13px;
  --t-label-line: 16px;
  --t-button-size: 14px;
  --t-button-line: 20px;
  --t-m-h1-size: 32px;
  --t-m-h1-line: 38px;
  --t-m-h2-size: 26px;
  --t-m-h2-line: 32px;
  --t-m-h3-size: 20px;
  --t-m-h3-line: 26px;
  --t-m-h4-size: 17px;
  --t-m-h4-line: 22px;
  --t-m-h5-size: 15px;
  --t-m-h5-line: 20px;
  --t-m-body-size: 17px;
  --t-m-body-line: 24px;
  --t-m-small-size: 15px;
  --t-m-small-line: 20px;
  --t-m-caption-size: 13px;
  --t-m-caption-line: 18px;
  --t-m-label-size: 15px;
  --t-m-label-line: 20px;
  --t-m-button-size: 17px;
  --t-m-button-line: 22px;
  --t-code-size: 13px;
  --t-code-line: 18px;
  --t-al-display-size: 64px;
  --t-al-display-line: 68px;
  --t-al-title-size: 40px;
  --t-al-title-line: 46px;
  --t-al-thread-title-size: 36px;
  --t-al-thread-title-line: 42px;
  --t-al-lede-size: 18px;
  --t-al-lede-line: 28px;
  --t-al-web-button-size: 15px;
  --t-al-web-button-line: 20px;
  --t-m-al-display-size: 38px;
  --t-m-al-display-line: 42px;
  --t-m-al-display-intro-size: 44px;
  --t-m-al-display-intro-line: 48px;
  --t-m-al-title-size: 38px;
  --t-m-al-title-line: 44px;
  --t-m-al-thread-title-size: 32px;
  --t-m-al-thread-title-line: 38px;
  --t-m-al-lede-size: 16px;
  --t-m-al-lede-line: 23px;
  --t-w-al-hero-size: 20px;
  --t-w-al-hero-line: 24px;
  --t-w-al-title-size: 17px;
  --t-w-al-title-line: 21px;
  --t-w-al-body-size: 15px;
  --t-w-al-body-line: 20px;
  --t-w-al-small-size: 13px;
  --t-w-al-small-line: 16px;
  --t-w-al-bubble-size: 14px;
  --t-w-al-bubble-line: 18px;
  --t-w-al-field-size: 17px;
  --t-w-al-field-line: 22px;
  --t-w-al-caption-size: 12px;
  --t-w-al-caption-line: 16px;
  --t-w-al-code-size: 28px;
  --t-w-al-code-line: 32px;
  --t-al-eyebrow-size: 12px;
  --t-al-eyebrow-line: 16px;
  --t-al-eyebrow-small-size: 11px;
  --t-al-eyebrow-small-line: 14px;
  --sk-bg-app: #fbfbfb;
  --sk-bg-sidebar: #f4f4f4;
  --sk-bg-surface: #f1f1f1;
  --sk-bg-elevated: #ffffff;
  --sk-bg-bubble: #ececec;
  --sk-bg-input: #ffffff;
  --sk-bg-subtle: #ebebeb;
  --sk-bg-hover: rgba(0,0,0,0.04);
  --sk-bg-pressed: rgba(0,0,0,0.08);
  --sk-bg-glass: rgba(255,255,255,0.78);
  --sk-scrim: rgba(0,0,0,0.28);
  --sk-text-primary: #0a0a0a;
  --sk-text-secondary: #5c5c5c;
  --sk-text-tertiary: #6e6e6e;
  --sk-text-inverse: #ffffff;
  --sk-text-on-accent: #0c0c0c;
  --sk-text-placeholder: var(--sk-text-tertiary);
  --sk-mention-text: var(--sk-text-primary);
  --sk-border: #e5e5e5;
  --sk-border-strong: #d0d0d0;
  --sk-border-dashed: #bdbdbd;
  --sk-accent: #84cc16;
  --sk-accent-hover: #74b80f;
  --sk-accent-soft: #ecf8d0;
  --sk-accent-soft-text: #3f6212;
  --sk-accent-text: #48730e;
  --sk-danger: #d92d20;
  --sk-danger-hover: #c7251c;
  --sk-danger-soft: #ffe5e3;
  --sk-danger-text: #c8190f;
  --sk-on-danger: #ffffff;
  --sk-success: #1f7a35;
  --sk-warning: #a14a00;
  --sk-success-soft: #e2f5e6;
  --sk-warning-soft: #fff0d9;
  --sk-info: #0a5fc2;
  --sk-info-soft: #e3efff;
  --sk-ink: #0a0a0a;
  --sk-ink-hover: #262626;
  --sk-ink-text: #ffffff;
  --sk-focus-ring: #5c9410;
  --sk-badge-bg: var(--sk-bg-subtle);
  --sk-badge-text: var(--sk-text-secondary);
  --sk-badge-border: var(--sk-border-strong);
  --sk-readonly-bg: var(--sk-bg-surface);
  --sk-code-bg: #f4f4f4;
  --sk-syntax-keyword: #4d6f0c;
  --sk-syntax-string: #9a4700;
  --sk-syntax-number: #0b5cb8;
  --sk-syntax-function: #6d3fc4;
  --sk-syntax-comment: #6b6b6b;
  --sk-bubble-bot-bg: #ececec;
  --sk-bubble-bot-text: #0a0a0a;
  --sk-bubble-user-bg: #84cc16;
  --sk-bubble-user-text: #0c0c0c;
  --sk-swatch-white: #ffffff;
  --sk-swatch-brown: #8e5f3a;
  --sk-swatch-red: #ff2d3f;
  --sk-swatch-orange: #ff6a00;
  --sk-swatch-amber: #ff9f0a;
  --sk-swatch-green: #1ec95f;
  --sk-swatch-teal: #00c2b0;
  --sk-swatch-blue: #0a84ff;
  --sk-swatch-purple: #9b5cf6;
  --sk-swatch-pink: #ff2d9b;
  --sk-swatch-gray: #7a7a7a;
  --al-nav-on: #ffffff;
  --al-accent-serif: var(--sk-accent-text);
  --al-mark-eye: #0c0c0c;
  --al-mark-catchlight: #ffffff;
  --al-switch-thumb: #ffffff;
  --al-scene-sunroom-wall-1: #eeefe9;
  --al-scene-sunroom-wall-2: #e3e5dd;
  --al-scene-sunroom-wall-3: #d5d8ce;
  --al-scene-sunroom-sun: #fffdf3;
  --al-scene-sunroom-leaf-shadow: #3e4a38;
  --al-scene-sunroom-stone-1: #cbcec5;
  --al-scene-sunroom-stone-2: #a3a79c;
  --al-scene-sunroom-face-1: #f0f1ec;
  --al-scene-sunroom-face-2: #cfd2c9;
  --al-scene-sunroom-fern-1: #5f7049;
  --al-scene-sunroom-fern-2: #6d7f55;
  --al-scene-sunroom-fern-3: #7c8e64;
  --al-scene-sunroom-fern-4: #859770;
  --al-scene-sunroom-fern-5: #93a47a;
  --al-scene-sunroom-moss-1: #73855a;
  --al-scene-sunroom-moss-2: #8a9a6e;
  --al-scene-sunroom-moss-3: #9fae84;
  --al-scene-sunroom-fern-stem-light: #76885f;
  --al-scene-sunroom-shaft: #ffffff;
  --al-scene-sunroom-shadow: #38402f;
  --al-scene-nightlight-wall-1: #1b1c20;
  --al-scene-nightlight-wall-2: #0e0f12;
  --al-scene-nightlight-wash: #8fa6d6;
  --al-scene-nightlight-frame-1: #202127;
  --al-scene-nightlight-frame-2: #16171b;
  --al-scene-nightlight-sky-1: #2b3f6b;
  --al-scene-nightlight-sky-2: #18264a;
  --al-scene-nightlight-sky-3: #0f1830;
  --al-scene-nightlight-star: #eef2ff;
  --al-scene-nightlight-moon: #f3ead2;
  --al-scene-nightlight-moonbeam: #a9bfe6;
  --al-scene-nightlight-silhouette: #07080c;
  --al-scene-nightlight-table-1: #1e1f24;
  --al-scene-nightlight-table-2: #111215;
  --al-scene-nightlight-table-top-1: #2a2b31;
  --al-scene-nightlight-table-top-2: #1a1b20;
  --al-scene-nightlight-table-rim: #3a3c45;
  --al-scene-nightlight-lamp-1: #fff3d6;
  --al-scene-nightlight-lamp-2: #f6c873;
  --al-scene-nightlight-lamp-3: #d38c3c;
  --al-scene-nightlight-lamp-glow: #f7c77a;
  --al-scene-nightlight-lamp-base: #0a0b0d;
  --al-scene-nightlight-window-ring: #07080a;
  --al-scene-nightlight-rim: #d6e4ff;
  --al-scene-nightlight-shadow: #000000;
  --sk-shadow-float: 0 2px 12px rgba(0,0,0,0.08);
  --sk-shadow-menu: 0 8px 28px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
  --sk-shadow-modal: 0 24px 80px rgba(0,0,0,0.18), 0 0 0 1px rgba(0,0,0,0.04);
  --al-nav-ring: 0 1px 2px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.05);
  --al-float: var(--sk-shadow-float);
  --al-card-lift: 0 2px 12px rgba(0,0,0,0.04);
  --al-switch-thumb-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --sk-bg-app: #0c0c0c;
    --sk-bg-sidebar: #161616;
    --sk-bg-surface: #1c1c1c;
    --sk-bg-elevated: #141414;
    --sk-bg-bubble: #232323;
    --sk-bg-input: #1a1a1a;
    --sk-bg-subtle: #2a2a2a;
    --sk-bg-hover: rgba(255,255,255,0.06);
    --sk-bg-pressed: rgba(255,255,255,0.10);
    --sk-bg-glass: rgba(28,28,28,0.72);
    --sk-scrim: rgba(0,0,0,0.55);
    --sk-text-primary: #f2f2f2;
    --sk-text-secondary: #a1a1a1;
    --sk-text-tertiary: #8a8a8a;
    --sk-text-inverse: #0c0c0c;
    --sk-text-on-accent: #0c0c0c;
    --sk-text-placeholder: var(--sk-text-tertiary);
    --sk-mention-text: var(--sk-text-primary);
    --sk-border: #2a2a2a;
    --sk-border-strong: #3d3d3d;
    --sk-border-dashed: #4a4a4a;
    --sk-accent: #c8f53c;
    --sk-accent-hover: #d9ff66;
    --sk-accent-soft: rgba(200,245,60,0.16);
    --sk-accent-soft-text: #d9ff66;
    --sk-accent-text: #c8f53c;
    --sk-danger: #d92d20;
    --sk-danger-hover: #c7251c;
    --sk-danger-soft: rgba(255,69,58,0.16);
    --sk-danger-text: #ff6961;
    --sk-on-danger: #ffffff;
    --sk-success: #30d158;
    --sk-warning: #ff9f0a;
    --sk-success-soft: rgba(48,209,88,0.16);
    --sk-warning-soft: rgba(255,159,10,0.16);
    --sk-info: #6cb0ff;
    --sk-info-soft: rgba(10,132,255,0.16);
    --sk-ink: #f2f2f2;
    --sk-ink-hover: #ffffff;
    --sk-ink-text: #0c0c0c;
    --sk-focus-ring: #c8f53c;
    --sk-badge-bg: var(--sk-bg-subtle);
    --sk-badge-text: var(--sk-text-secondary);
    --sk-badge-border: var(--sk-border-strong);
    --sk-readonly-bg: var(--sk-bg-surface);
    --sk-code-bg: #141414;
    --sk-syntax-keyword: #c8f53c;
    --sk-syntax-string: #ffb35c;
    --sk-syntax-number: #7cc4ff;
    --sk-syntax-function: #d4b3ff;
    --sk-syntax-comment: #8a8a8a;
    --sk-bubble-bot-bg: #232323;
    --sk-bubble-bot-text: #f2f2f2;
    --sk-bubble-user-bg: #c8f53c;
    --sk-bubble-user-text: #0c0c0c;
    --sk-swatch-white: #ffffff;
    --sk-swatch-brown: #8e5f3a;
    --sk-swatch-red: #ff2d3f;
    --sk-swatch-orange: #ff6a00;
    --sk-swatch-amber: #ff9f0a;
    --sk-swatch-green: #1ec95f;
    --sk-swatch-teal: #00c2b0;
    --sk-swatch-blue: #0a84ff;
    --sk-swatch-purple: #9b5cf6;
    --sk-swatch-pink: #ff2d9b;
    --sk-swatch-gray: #7a7a7a;
    --al-nav-on: #232323;
    --al-accent-serif: var(--sk-accent-text);
    --al-mark-eye: #0c0c0c;
    --al-mark-catchlight: #ffffff;
    --al-switch-thumb: #ffffff;
    --al-scene-sunroom-wall-1: #eeefe9;
    --al-scene-sunroom-wall-2: #e3e5dd;
    --al-scene-sunroom-wall-3: #d5d8ce;
    --al-scene-sunroom-sun: #fffdf3;
    --al-scene-sunroom-leaf-shadow: #3e4a38;
    --al-scene-sunroom-stone-1: #cbcec5;
    --al-scene-sunroom-stone-2: #a3a79c;
    --al-scene-sunroom-face-1: #f0f1ec;
    --al-scene-sunroom-face-2: #cfd2c9;
    --al-scene-sunroom-fern-1: #5f7049;
    --al-scene-sunroom-fern-2: #6d7f55;
    --al-scene-sunroom-fern-3: #7c8e64;
    --al-scene-sunroom-fern-4: #859770;
    --al-scene-sunroom-fern-5: #93a47a;
    --al-scene-sunroom-moss-1: #73855a;
    --al-scene-sunroom-moss-2: #8a9a6e;
    --al-scene-sunroom-moss-3: #9fae84;
    --al-scene-sunroom-fern-stem-light: #76885f;
    --al-scene-sunroom-shaft: #ffffff;
    --al-scene-sunroom-shadow: #38402f;
    --al-scene-nightlight-wall-1: #1b1c20;
    --al-scene-nightlight-wall-2: #0e0f12;
    --al-scene-nightlight-wash: #8fa6d6;
    --al-scene-nightlight-frame-1: #202127;
    --al-scene-nightlight-frame-2: #16171b;
    --al-scene-nightlight-sky-1: #2b3f6b;
    --al-scene-nightlight-sky-2: #18264a;
    --al-scene-nightlight-sky-3: #0f1830;
    --al-scene-nightlight-star: #eef2ff;
    --al-scene-nightlight-moon: #f3ead2;
    --al-scene-nightlight-moonbeam: #a9bfe6;
    --al-scene-nightlight-silhouette: #07080c;
    --al-scene-nightlight-table-1: #1e1f24;
    --al-scene-nightlight-table-2: #111215;
    --al-scene-nightlight-table-top-1: #2a2b31;
    --al-scene-nightlight-table-top-2: #1a1b20;
    --al-scene-nightlight-table-rim: #3a3c45;
    --al-scene-nightlight-lamp-1: #fff3d6;
    --al-scene-nightlight-lamp-2: #f6c873;
    --al-scene-nightlight-lamp-3: #d38c3c;
    --al-scene-nightlight-lamp-glow: #f7c77a;
    --al-scene-nightlight-lamp-base: #0a0b0d;
    --al-scene-nightlight-window-ring: #07080a;
    --al-scene-nightlight-rim: #d6e4ff;
    --al-scene-nightlight-shadow: #000000;
    --sk-shadow-float: 0 2px 12px rgba(0,0,0,0.40);
    --sk-shadow-menu: 0 12px 32px rgba(0,0,0,0.50), 0 0 0 1px rgba(255,255,255,0.06);
    --sk-shadow-modal: 0 24px 80px rgba(0,0,0,0.60), 0 0 0 1px rgba(255,255,255,0.06);
    --al-nav-ring: 0 0 0 1px #2f2f2f;
    --al-float: var(--sk-shadow-float);
    --al-card-lift: 0 2px 12px rgba(0,0,0,0.04);
    --al-switch-thumb-shadow: 0 1px 2px rgba(0,0,0,0.2);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --sk-bg-app: #0c0c0c;
  --sk-bg-sidebar: #161616;
  --sk-bg-surface: #1c1c1c;
  --sk-bg-elevated: #141414;
  --sk-bg-bubble: #232323;
  --sk-bg-input: #1a1a1a;
  --sk-bg-subtle: #2a2a2a;
  --sk-bg-hover: rgba(255,255,255,0.06);
  --sk-bg-pressed: rgba(255,255,255,0.10);
  --sk-bg-glass: rgba(28,28,28,0.72);
  --sk-scrim: rgba(0,0,0,0.55);
  --sk-text-primary: #f2f2f2;
  --sk-text-secondary: #a1a1a1;
  --sk-text-tertiary: #8a8a8a;
  --sk-text-inverse: #0c0c0c;
  --sk-text-on-accent: #0c0c0c;
  --sk-text-placeholder: var(--sk-text-tertiary);
  --sk-mention-text: var(--sk-text-primary);
  --sk-border: #2a2a2a;
  --sk-border-strong: #3d3d3d;
  --sk-border-dashed: #4a4a4a;
  --sk-accent: #c8f53c;
  --sk-accent-hover: #d9ff66;
  --sk-accent-soft: rgba(200,245,60,0.16);
  --sk-accent-soft-text: #d9ff66;
  --sk-accent-text: #c8f53c;
  --sk-danger: #d92d20;
  --sk-danger-hover: #c7251c;
  --sk-danger-soft: rgba(255,69,58,0.16);
  --sk-danger-text: #ff6961;
  --sk-on-danger: #ffffff;
  --sk-success: #30d158;
  --sk-warning: #ff9f0a;
  --sk-success-soft: rgba(48,209,88,0.16);
  --sk-warning-soft: rgba(255,159,10,0.16);
  --sk-info: #6cb0ff;
  --sk-info-soft: rgba(10,132,255,0.16);
  --sk-ink: #f2f2f2;
  --sk-ink-hover: #ffffff;
  --sk-ink-text: #0c0c0c;
  --sk-focus-ring: #c8f53c;
  --sk-badge-bg: var(--sk-bg-subtle);
  --sk-badge-text: var(--sk-text-secondary);
  --sk-badge-border: var(--sk-border-strong);
  --sk-readonly-bg: var(--sk-bg-surface);
  --sk-code-bg: #141414;
  --sk-syntax-keyword: #c8f53c;
  --sk-syntax-string: #ffb35c;
  --sk-syntax-number: #7cc4ff;
  --sk-syntax-function: #d4b3ff;
  --sk-syntax-comment: #8a8a8a;
  --sk-bubble-bot-bg: #232323;
  --sk-bubble-bot-text: #f2f2f2;
  --sk-bubble-user-bg: #c8f53c;
  --sk-bubble-user-text: #0c0c0c;
  --sk-swatch-white: #ffffff;
  --sk-swatch-brown: #8e5f3a;
  --sk-swatch-red: #ff2d3f;
  --sk-swatch-orange: #ff6a00;
  --sk-swatch-amber: #ff9f0a;
  --sk-swatch-green: #1ec95f;
  --sk-swatch-teal: #00c2b0;
  --sk-swatch-blue: #0a84ff;
  --sk-swatch-purple: #9b5cf6;
  --sk-swatch-pink: #ff2d9b;
  --sk-swatch-gray: #7a7a7a;
  --al-nav-on: #232323;
  --al-accent-serif: var(--sk-accent-text);
  --al-mark-eye: #0c0c0c;
  --al-mark-catchlight: #ffffff;
  --al-switch-thumb: #ffffff;
  --al-scene-sunroom-wall-1: #eeefe9;
  --al-scene-sunroom-wall-2: #e3e5dd;
  --al-scene-sunroom-wall-3: #d5d8ce;
  --al-scene-sunroom-sun: #fffdf3;
  --al-scene-sunroom-leaf-shadow: #3e4a38;
  --al-scene-sunroom-stone-1: #cbcec5;
  --al-scene-sunroom-stone-2: #a3a79c;
  --al-scene-sunroom-face-1: #f0f1ec;
  --al-scene-sunroom-face-2: #cfd2c9;
  --al-scene-sunroom-fern-1: #5f7049;
  --al-scene-sunroom-fern-2: #6d7f55;
  --al-scene-sunroom-fern-3: #7c8e64;
  --al-scene-sunroom-fern-4: #859770;
  --al-scene-sunroom-fern-5: #93a47a;
  --al-scene-sunroom-moss-1: #73855a;
  --al-scene-sunroom-moss-2: #8a9a6e;
  --al-scene-sunroom-moss-3: #9fae84;
  --al-scene-sunroom-fern-stem-light: #76885f;
  --al-scene-sunroom-shaft: #ffffff;
  --al-scene-sunroom-shadow: #38402f;
  --al-scene-nightlight-wall-1: #1b1c20;
  --al-scene-nightlight-wall-2: #0e0f12;
  --al-scene-nightlight-wash: #8fa6d6;
  --al-scene-nightlight-frame-1: #202127;
  --al-scene-nightlight-frame-2: #16171b;
  --al-scene-nightlight-sky-1: #2b3f6b;
  --al-scene-nightlight-sky-2: #18264a;
  --al-scene-nightlight-sky-3: #0f1830;
  --al-scene-nightlight-star: #eef2ff;
  --al-scene-nightlight-moon: #f3ead2;
  --al-scene-nightlight-moonbeam: #a9bfe6;
  --al-scene-nightlight-silhouette: #07080c;
  --al-scene-nightlight-table-1: #1e1f24;
  --al-scene-nightlight-table-2: #111215;
  --al-scene-nightlight-table-top-1: #2a2b31;
  --al-scene-nightlight-table-top-2: #1a1b20;
  --al-scene-nightlight-table-rim: #3a3c45;
  --al-scene-nightlight-lamp-1: #fff3d6;
  --al-scene-nightlight-lamp-2: #f6c873;
  --al-scene-nightlight-lamp-3: #d38c3c;
  --al-scene-nightlight-lamp-glow: #f7c77a;
  --al-scene-nightlight-lamp-base: #0a0b0d;
  --al-scene-nightlight-window-ring: #07080a;
  --al-scene-nightlight-rim: #d6e4ff;
  --al-scene-nightlight-shadow: #000000;
  --sk-shadow-float: 0 2px 12px rgba(0,0,0,0.40);
  --sk-shadow-menu: 0 12px 32px rgba(0,0,0,0.50), 0 0 0 1px rgba(255,255,255,0.06);
  --sk-shadow-modal: 0 24px 80px rgba(0,0,0,0.60), 0 0 0 1px rgba(255,255,255,0.06);
  --al-nav-ring: 0 0 0 1px #2f2f2f;
  --al-float: var(--sk-shadow-float);
  --al-card-lift: 0 2px 12px rgba(0,0,0,0.04);
  --al-switch-thumb-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.t-h1 {
  font-family: var(--font-sans);
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.t-h2 {
  font-family: var(--font-sans);
  font-size: 22px;
  line-height: 28px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.t-h3 {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.t-h4 {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0;
}
.t-h5 {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 600;
  letter-spacing: 0;
}
.t-body {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 21px;
  font-weight: 400;
}
.t-small {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}
.t-caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}
.t-label {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 16px;
  font-weight: 400;
}
.t-button {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
}
.t-m-h1 {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 38px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.t-m-h2 {
  font-family: var(--font-sans);
  font-size: 26px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.t-m-h3 {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.t-m-h4 {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 22px;
  font-weight: 600;
  letter-spacing: 0;
}
.t-m-h5 {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: 0;
}
.t-m-body {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 24px;
  font-weight: 400;
}
.t-m-small {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 400;
}
.t-m-caption {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}
.t-m-label {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 400;
}
.t-m-button {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 22px;
  font-weight: 500;
}
.t-code {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
}
.t-al-display {
  font-family: var(--font-sans);
  font-size: 64px;
  line-height: 68px;
  font-weight: 600;
  letter-spacing: -0.035em;
}
.t-al-title {
  font-family: var(--font-sans);
  font-size: 40px;
  line-height: 46px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.t-al-thread-title {
  font-family: var(--font-sans);
  font-size: 36px;
  line-height: 42px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.t-al-lede {
  font-family: var(--font-sans);
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
}
.t-al-web-button {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 500;
}
.t-m-al-display {
  font-family: var(--font-sans);
  font-size: 38px;
  line-height: 42px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.t-m-al-display-intro {
  font-family: var(--font-sans);
  font-size: 44px;
  line-height: 48px;
  font-weight: 600;
  letter-spacing: -0.035em;
}
.t-m-al-title {
  font-family: var(--font-sans);
  font-size: 38px;
  line-height: 44px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.t-m-al-thread-title {
  font-family: var(--font-sans);
  font-size: 32px;
  line-height: 38px;
  font-weight: 600;
  letter-spacing: -0.03em;
}
.t-m-al-lede {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 23px;
  font-weight: 400;
}
.t-w-al-hero {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.02em;
}
.t-w-al-title {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 21px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.t-w-al-body {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 20px;
  font-weight: 400;
}
.t-w-al-small {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 16px;
  font-weight: 400;
}
.t-w-al-bubble {
  font-family: var(--font-sans);
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
}
.t-w-al-field {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 22px;
  font-weight: 400;
}
.t-w-al-caption {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}
.t-w-al-code {
  font-family: var(--font-mono);
  font-size: 28px;
  line-height: 32px;
  font-weight: 600;
  letter-spacing: 0.1em;
}
.t-al-serif-accent {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.01em;
  font-style: italic;
}
.t-al-eyebrow {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.t-al-eyebrow-small {
  font-family: var(--font-sans);
  font-size: 11px;
  line-height: 14px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.al-glass {
  background: var(--sk-bg-glass);
  -webkit-backdrop-filter: blur(var(--sk-glass-blur));
  backdrop-filter: blur(var(--sk-glass-blur));
  border: 1px solid var(--sk-border);
}

/* The public site (canvas: "Slice 8 · Public site"; DESIGN.md). Every value
   is a Skaler Labs or Allie layer token; scripts/prerender.ts puts the tokens
   ahead of this file in site.css. Sunroom or Nightlight follows the system. */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  background: var(--sk-bg-app);
  color: var(--sk-text-primary);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

button,
input {
  font: inherit;
  color: inherit;
}

a {
  color: inherit;
  text-decoration: none;
}

:focus-visible {
  outline: 3px solid var(--sk-focus-ring);
  outline-offset: 2px;
}

.secondary {
  color: var(--sk-text-secondary);
}

.accent {
  color: var(--al-accent-serif);
}

.site {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.grow {
  flex: 1;
}

/* Header and footer */

.site-header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sk-space-6);
  padding: var(--sk-space-7) var(--sk-space-9) var(--sk-space-7) var(--al-site-gutter);
}
.site > .site-header:first-child {
  border-bottom: 1px solid var(--sk-border);
}
.brand {
  display: flex;
  align-items: center;
  gap: var(--sk-space-5);
}
.badge {
  padding: var(--sk-space-1) var(--sk-space-4);
  border-radius: var(--sk-radius-xs);
  border: 1px solid var(--sk-border-strong);
  color: var(--sk-text-secondary);
}
.site-nav {
  display: flex;
  align-items: center;
  gap: var(--sk-space-4);
}

.pill {
  height: var(--sk-control-md);
  padding: 0 var(--sk-space-6);
  border-radius: var(--sk-radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.pill-plain {
  color: var(--sk-text-secondary);
}
.pill-plain:hover {
  color: var(--sk-text-primary);
  background: var(--sk-bg-hover);
}
.pill-ink {
  background: var(--sk-ink);
  color: var(--sk-ink-text);
}
.pill-ink:hover {
  background: var(--sk-ink-hover);
}
.pill-subtle {
  height: var(--sk-control-lg);
  padding: 0 var(--sk-space-7);
  background: var(--sk-bg-subtle);
}
.pill-subtle:hover {
  background: var(--sk-bg-pressed);
}

.site-footer {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--sk-space-5);
  padding: var(--sk-space-7) var(--al-site-gutter);
  border-top: 1px solid var(--sk-border);
  color: var(--sk-text-secondary);
}
.site-footer nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sk-space-7);
}
.site-footer a:hover,
.site-footer a[aria-current="page"] {
  color: var(--sk-text-primary);
}

/* Fields and buttons */

.field {
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-3);
}
.field input {
  height: var(--al-web-control);
  width: 100%;
  padding: 0 var(--sk-space-6);
  border-radius: var(--al-radius-code-box);
  background: var(--sk-bg-input);
  border: 1px solid var(--sk-border);
}
.field input::placeholder {
  color: var(--sk-text-placeholder);
}
.button {
  height: var(--al-web-control);
  padding: 0 var(--sk-space-8);
  border: 0;
  border-radius: var(--sk-radius-pill);
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  cursor: pointer;
}
.button-ink {
  background: var(--sk-ink);
  color: var(--sk-ink-text);
}
.button-ink:hover {
  background: var(--sk-ink-hover);
}
/* The waitlist's trap for bots: off screen, out of the tab order, and hidden from assistive tech. */
.trap {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.form-note {
  margin: var(--sk-space-1) 0 0;
  text-align: center;
}

/* Home: the hero, with the backdrop scene behind it (its only use on the site) */

.hero {
  position: relative;
  min-height: var(--al-site-hero);
  display: flex;
  flex-direction: column;
}
.hero-scene {
  position: absolute;
  inset: 0;
}
.scene {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.scene-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.scene-nightlight {
  display: none;
}
@media (prefers-color-scheme: dark) {
  .scene-sunroom {
    display: none;
  }
  .scene-nightlight {
    display: block;
  }
}
.hero-body {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--al-site-section) var(--al-site-gutter) var(--sk-space-12);
}
.hero-title {
  margin: var(--sk-space-7) 0 var(--sk-space-6);
  max-width: var(--al-site-title);
}
.hero-lede {
  margin: 0;
  max-width: var(--al-site-lede);
}
.hero-form {
  margin-top: var(--sk-space-10);
  width: 100%;
  max-width: var(--al-lede-max);
  padding: var(--sk-space-8);
  border-radius: var(--al-radius-card-lg);
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-5);
  background: var(--sk-bg-glass);
  -webkit-backdrop-filter: blur(var(--sk-glass-blur));
  backdrop-filter: blur(var(--sk-glass-blur));
  border: 1px solid var(--sk-border);
}

.features {
  width: 100%;
  max-width: calc(var(--al-site-wide) + 2 * var(--al-site-gutter));
  margin: 0 auto;
  padding: var(--al-site-section) var(--al-site-gutter) var(--sk-space-8);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sk-space-6);
}
.feature {
  min-height: var(--al-site-feature);
  padding: var(--sk-space-8);
  border-radius: var(--al-radius-card-lg);
  background: var(--sk-bg-elevated);
  border: 1px solid var(--sk-border);
  box-shadow: var(--al-card-lift);
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-5);
}
.feature h2,
.feature p {
  margin: 0;
}
.feature p {
  text-wrap: pretty;
}
.tile {
  flex-shrink: 0;
  width: var(--al-avatar);
  height: var(--al-avatar);
  border-radius: var(--al-radius-tile);
  background: var(--sk-bg-subtle);
  display: grid;
  place-items: center;
}
.marks {
  height: var(--al-avatar);
  display: flex;
  align-items: center;
  gap: var(--sk-space-1);
}

.join {
  padding: var(--sk-space-11) var(--al-site-gutter) var(--al-site-section);
  display: flex;
  justify-content: center;
}
.join-card {
  width: 100%;
  max-width: var(--sk-thread-max);
  padding: var(--sk-space-10);
  border-radius: var(--sk-radius-composer);
  background: var(--sk-bg-elevated);
  border: 1px solid var(--sk-border);
  box-shadow: var(--al-card-lift);
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-6);
}
.join-card h2,
.join-card p {
  margin: 0;
}
.join-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--sk-space-5);
}
.join-form .field {
  flex: 1 1 300px;
}

/* Privacy, terms, and support */

.page {
  flex: 1;
  display: flex;
  justify-content: center;
  padding: var(--sk-space-12) var(--al-site-gutter);
}
.page-column {
  width: 100%;
  max-width: var(--al-web-form);
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-9);
}
.page-column h1 {
  margin: 0;
}
.page-head {
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-5);
}
.prose {
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-5);
}
.prose h2,
.prose p {
  margin: 0;
}
.placeholder {
  display: inline-block;
  padding: 0 var(--sk-space-3);
  border: 1px dashed var(--sk-border-strong);
  border-radius: var(--sk-radius-xs);
  color: var(--sk-text-secondary);
  letter-spacing: 0.02em;
}
.placeholder-block {
  padding: var(--sk-space-6) var(--sk-space-7);
  border: 1px dashed var(--sk-border-strong);
  border-radius: var(--al-radius-tile);
  color: var(--sk-text-secondary);
  letter-spacing: 0.02em;
}
.chip {
  align-self: flex-start;
  height: var(--sk-control-sm);
  padding: 0 var(--sk-space-5);
  border-radius: var(--sk-radius-pill);
  display: inline-flex;
  align-items: center;
  gap: var(--sk-space-3);
  font-weight: 500;
}
.chip-warning {
  background: var(--sk-warning-soft);
  color: var(--sk-warning);
}
.facts {
  margin: 0;
  padding: 0;
  list-style: none;
  border-radius: var(--sk-radius-lg);
  background: var(--sk-bg-elevated);
  border: 1px solid var(--sk-border);
  overflow: hidden;
}
.facts li {
  min-height: var(--sk-hit-android);
  padding: var(--sk-space-5) var(--sk-space-6);
  display: flex;
  align-items: center;
  gap: var(--sk-space-5);
  border-bottom: 1px solid var(--sk-border);
  font-size: var(--t-m-small-size);
  line-height: var(--t-m-small-line);
}
.facts li:last-child {
  border-bottom: 0;
}
.facts svg {
  color: var(--sk-text-secondary);
}
.support-title {
  margin-bottom: var(--sk-space-4);
}
.support-card {
  padding: var(--sk-space-7) var(--sk-space-8);
  border-radius: var(--al-radius-card-lg);
  background: var(--sk-bg-elevated);
  border: 1px solid var(--sk-border);
  box-shadow: var(--al-card-lift);
  display: flex;
  align-items: flex-start;
  gap: var(--sk-space-6);
}
.support-card > div {
  display: flex;
  flex-direction: column;
  gap: var(--sk-space-3);
}
.support-card h2,
.support-card p {
  margin: 0;
}
.support-card a {
  text-decoration: underline;
}

/* The waitlist's answers and the 404 */

.notice {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sk-space-6);
  padding: var(--sk-space-11) var(--sk-space-10);
  text-align: center;
}
.notice h1,
.notice p {
  margin: 0;
}
.notice-icon {
  width: var(--al-avatar-lg);
  height: var(--al-avatar-lg);
  border-radius: var(--sk-radius-pill);
  background: var(--sk-bg-subtle);
  display: grid;
  place-items: center;
}
.notice-lede {
  max-width: var(--al-web-card);
}

/* Narrower screens */

@media (max-width: 1024px) {
  .features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Phone width: the scene is a band under the header, so no text sits on it */
@media (max-width: 640px) {
  .site-header {
    padding: var(--sk-space-5) var(--sk-space-4) var(--sk-space-5) var(--sk-space-6);
  }
  .site-header .t-h1 {
    font-size: var(--t-m-h2-size);
    line-height: var(--t-m-h2-line);
  }
  .site-header .pill {
    height: var(--sk-hit-min);
    font-size: var(--t-m-small-size);
  }
  .join-link {
    display: none;
  }
  .hero {
    min-height: 0;
  }
  .hero-scene {
    position: relative;
    order: 1;
    height: var(--al-scene-phone-site);
  }
  .hero .site-header {
    order: 0;
  }
  .hero-body {
    order: 2;
    padding: var(--sk-space-8) var(--sk-space-6) 0;
  }
  .hero-title {
    margin: var(--sk-space-5) 0;
    font-size: var(--t-m-al-display-size);
    line-height: var(--t-m-al-display-line);
  }
  .hero-lede {
    font-size: var(--t-m-al-lede-size);
    line-height: var(--t-m-al-lede-line);
  }
  .hero-form {
    max-width: none;
    padding: var(--sk-space-7);
    background: var(--sk-bg-elevated);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  .field input {
    font-size: var(--t-m-body-size);
  }
  .features {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--sk-space-10) var(--sk-space-6) var(--sk-space-6);
    gap: var(--sk-space-5);
  }
  .feature {
    min-height: 0;
    padding: var(--sk-space-7);
  }
  .join {
    padding: var(--sk-space-8) var(--sk-space-6) var(--sk-space-10);
  }
  .join-card {
    padding: var(--sk-space-8) var(--sk-space-7);
  }
  .join-card h2 {
    font-size: var(--t-m-h2-size);
    line-height: var(--t-m-h2-line);
  }
  .join-form {
    flex-direction: column;
    align-items: stretch;
  }
  .join-form .field {
    flex: none;
  }
  .page {
    padding: var(--sk-space-10) var(--sk-space-6);
  }
  .site-footer {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sk-space-2);
    padding: var(--sk-space-5) var(--sk-space-6) var(--sk-space-7);
  }
  .site-footer a {
    min-height: var(--sk-hit-min);
    display: inline-flex;
    align-items: center;
  }
}