/* [project]/apps/control/app/sans_57833dc4.module.css [app-client] (css) */
@font-face {
  font-family: sans;
  src: url("../media/InterVariable_latin-s.p.0gsaq8ukbf34m.woff2") format("woff2");
  font-display: swap;
  font-weight: 400 700;
}

@font-face {
  font-family: sans Fallback;
  src: local(Arial);
  ascent-override: 89.79%;
  descent-override: 22.36%;
  line-gap-override: 0.0%;
  size-adjust: 107.89%;
}

.sans_57833dc4-module__9yTD3G__className {
  font-family: sans, sans Fallback;
}

.sans_57833dc4-module__9yTD3G__variable {
  --px-face-sans: "sans", "sans Fallback";
}

/* [project]/packages/ui/src/tokens.css [app-client] (css) */
:root {
  --px-font-display: var(--px-face-display, "Instrument Serif"), "Iowan Old Style", "Palatino Linotype", Charter, Georgia, ui-serif, serif;
  --px-font-sans: var(--px-face-sans, "Inter"), ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --px-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --px-font-size-2xs: .6875rem;
  --px-font-size-xs: .75rem;
  --px-font-size-sm: .875rem;
  --px-font-size-md: 1rem;
  --px-font-size-lg: 1.125rem;
  --px-font-size-xl: 1.375rem;
  --px-font-size-2xl: 1.75rem;
  --px-font-size-display-sm: clamp(1.75rem, 1.5rem + 1.1vw, 2.25rem);
  --px-font-size-display-md: clamp(2.25rem, 1.85rem + 1.8vw, 3.25rem);
  --px-font-size-display-lg: clamp(2.75rem, 2.1rem + 2.9vw, 4.5rem);
  --px-font-weight-regular: 400;
  --px-font-weight-medium: 500;
  --px-font-weight-semibold: 600;
  --px-font-weight-bold: 700;
  --px-line-height-tight: 1.1;
  --px-line-height-snug: 1.25;
  --px-line-height-normal: 1.5;
  --px-line-height-relaxed: 1.65;
  --px-letter-spacing-tighter: -.03em;
  --px-letter-spacing-tight: -.015em;
  --px-letter-spacing-normal: 0;
  --px-letter-spacing-wide: .02em;
  --px-letter-spacing-caps: .08em;
  --px-space-0: 0;
  --px-space-1: .25rem;
  --px-space-2: .5rem;
  --px-space-3: .75rem;
  --px-space-4: 1rem;
  --px-space-5: 1.25rem;
  --px-space-6: 1.5rem;
  --px-space-8: 2rem;
  --px-space-10: 2.5rem;
  --px-space-12: 3rem;
  --px-space-16: 4rem;
  --px-space-20: 5rem;
  --px-space-px: 1px;
  --px-space-0-5: .125rem;
  --px-space-1-5: .375rem;
  --px-radius-xs: 6px;
  --px-radius-sm: 10px;
  --px-radius-md: 14px;
  --px-radius-lg: 20px;
  --px-radius-xl: 28px;
  --px-radius-2xl: 36px;
  --px-radius-pill: 999px;
  --px-blur-sm: 8px;
  --px-blur-md: 16px;
  --px-blur-lg: 28px;
  --px-blur-xl: 48px;
  --px-duration-instant: 0s;
  --px-duration-fast: .12s;
  --px-duration-base: .2s;
  --px-duration-slow: .32s;
  --px-duration-slower: .48s;
  --px-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --px-ease-emphasized: cubic-bezier(.3, 0, 0, 1);
  --px-ease-decelerate: cubic-bezier(0, 0, 0, 1);
  --px-ease-accelerate: cubic-bezier(.3, 0, 1, 1);
  --px-ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  --px-z-base: 0;
  --px-z-raised: 1;
  --px-z-sticky: 100;
  --px-z-header: 200;
  --px-z-overlay: 300;
  --px-z-modal: 400;
  --px-z-popover: 500;
  --px-z-toast: 600;
  --px-z-skipLink: 700;
  --px-breakpoint-sm: 480px;
  --px-breakpoint-md: 720px;
  --px-breakpoint-lg: 1024px;
  --px-breakpoint-xl: 1280px;
  --px-atmosphere-base: #e3f3fd;
  --px-atmosphere-top: #9ecef1;
  --px-atmosphere-mid: #c3e3f8;
  --px-atmosphere-glow: #ffffffd9;
  --px-surface-glass: #f5fbff94;
  --px-surface-glass-strong: #f8fcffc7;
  --px-surface-glass-hover: #f8fcffb8;
  --px-surface-solid: #f6fbfe;
  --px-surface-sunken: #e6f0f7;
  --px-surface-raised: #fff;
  --px-surface-inverse: #121417;
  --px-text-primary: #0f1621;
  --px-text-secondary: #3d4958;
  --px-text-tertiary: #505c6c;
  --px-text-inverse: #f6f9fb;
  --px-text-link: #0054a3;
  --px-text-link-hover: #003a80;
  --px-border-subtle: #202f4214;
  --px-border-default: #202f4224;
  --px-border-input: #5e6a7a;
  --px-border-glass: #ffffffb3;
  --px-border-field: #202f4233;
  --px-surface-popover: #f5fbfff7;
  --px-surface-hover-tint: #1d2f4712;
  --px-action-solid: #0d0f15;
  --px-action-solid-hover: #22272e;
  --px-action-on-solid: #fafcfe;
  --px-action-soft: #f8fcff9e;
  --px-action-soft-hover: #fcfeffe6;
  --px-brand: #0077ac;
  --px-brand-subtle: #d1ecff;
  --px-danger: #b32325;
  --px-danger-subtle: #ffe8e7;
  --px-success: #1b6c3a;
  --px-success-subtle: #dcf7e2;
  --px-warning: #8d5406;
  --px-warning-subtle: #fff0d1;
  --px-info: #0059a1;
  --px-info-subtle: #e1f1ff;
  --px-focus-ring: #076fc7;
  --px-scrim: #0d162352;
  --px-elevation-0: none;
  --px-elevation-1: 0 1px 2px #334a620f, 0 2px 8px #334a620d;
  --px-elevation-2: 0 1px 2px #334a620d, 0 8px 24px #2e4a6717;
  --px-elevation-3: 0 2px 6px #334a620f, 0 18px 48px #284a6c24;
  --px-elevation-4: 0 4px 12px #334a6214, 0 32px 80px #143c6233;
  --px-glass-highlight: inset 0 1px 0 #ffffffbf;
  --px-glass-fill: var(--px-surface-glass);
  --px-glass-fill-strong: var(--px-surface-glass-strong);
  --px-glass-border: var(--px-border-glass);
  --px-glass-blur: var(--px-blur-lg);
  --px-glass-saturate: 170%;
  --px-glass-shadow: var(--px-glass-highlight), var(--px-elevation-2);
  --px-atmosphere: radial-gradient(70% 50% at 50% 12%, var(--px-atmosphere-glow), transparent 72%), radial-gradient(60% 40% at 85% 85%, var(--px-atmosphere-mid), transparent 70%), linear-gradient(180deg, var(--px-atmosphere-top) 0%, var(--px-atmosphere-mid) 48%, var(--px-atmosphere-base) 100%);
  --px-card-radius: 18px;
  --px-card-padding: clamp(var(--px-space-5), 4vw, var(--px-space-8));
  --px-card-gap: var(--px-space-4);
  --px-button-height: 40px;
  --px-button-height-sm: 32px;
  --px-button-radius: 11px;
  --px-button-padding-x: var(--px-space-4);
  --px-button-font-size: var(--px-font-size-sm);
  --px-button-font-weight: var(--px-font-weight-semibold);
  --px-button-primary-bg: var(--px-action-solid);
  --px-button-primary-bg-hover: var(--px-action-solid-hover);
  --px-button-primary-fg: var(--px-action-on-solid);
  --px-button-secondary-bg: var(--px-action-soft);
  --px-button-secondary-bg-hover: var(--px-action-soft-hover);
  --px-button-secondary-fg: var(--px-text-primary);
  --px-button-secondary-border: var(--px-border-default);
  --px-input-height: 40px;
  --px-input-radius: 11px;
  --px-input-padding-x: var(--px-space-3);
  --px-input-bg: var(--px-surface-glass-strong);
  --px-input-border: var(--px-border-field);
  --px-input-border-hover: var(--px-border-input);
  --px-input-border-focus: var(--px-focus-ring);
  --px-input-placeholder: var(--px-text-tertiary);
  --px-input-shadow: var(--px-glass-highlight);
  --px-input-ring: 0 0 0 4px color-mix(in oklch, var(--px-focus-ring) 22%, transparent);
  --px-input-ring-invalid: 0 0 0 4px color-mix(in oklch, var(--px-danger) 18%, transparent);
  --px-textarea-radius: 12px;
  --px-popover-bg: var(--px-surface-popover);
  --px-popover-border: var(--px-border-glass);
  --px-popover-radius: 14px;
  --px-popover-blur: var(--px-blur-xl);
  --px-popover-shadow: var(--px-glass-highlight), var(--px-elevation-3);
  --px-popover-max-height: min(18rem, 50dvh);
  --px-option-height: 44px;
  --px-option-radius: 9px;
  --px-option-hover-bg: var(--px-surface-hover-tint);
  --px-avatar-size: 88px;
  --px-image-tile-size: 80px;
  --px-image-tile-radius: var(--px-radius-lg);
  --px-picker-bg: var(--px-surface-glass-strong);
  --px-picker-fg: var(--px-text-secondary);
  --px-picker-badge-size: 30px;
  --px-picker-badge-bg: var(--px-action-solid);
  --px-picker-badge-fg: var(--px-action-on-solid);
  --px-progress-height: 6px;
  --px-progress-track: var(--px-border-default);
  --px-progress-fill: var(--px-action-solid);
  --px-code-cell-size: clamp(40px, 11vw, 52px);
  --px-code-cell-radius: var(--px-radius-md);
  --px-code-gap: clamp(6px, 1.6vw, 10px);
  --px-segmented-height: 44px;
  --px-segmented-padding: var(--px-space-1);
  --px-segmented-item-padding-x: var(--px-space-4);
  --px-segmented-active-bg: var(--px-action-solid);
  --px-segmented-active-fg: var(--px-action-on-solid);
  --px-segmented-fg: var(--px-text-secondary);
  --px-focus-width: 2px;
  --px-focus-offset: 2px;
  --px-transition-colors: background-color var(--px-duration-fast) var(--px-ease-standard), border-color var(--px-duration-fast) var(--px-ease-standard), color var(--px-duration-fast) var(--px-ease-standard), box-shadow var(--px-duration-fast) var(--px-ease-standard);
  --px-transition-transform: transform var(--px-duration-base) var(--px-ease-emphasized);
  --px-color-bg: var(--px-atmosphere-base);
  --px-color-surface: var(--px-surface-glass-strong);
  --px-color-surface-muted: var(--px-surface-sunken);
  --px-color-border: var(--px-border-default);
  --px-color-border-strong: var(--px-border-input);
  --px-color-border-input: var(--px-border-input);
  --px-color-text: var(--px-text-primary);
  --px-color-text-muted: var(--px-text-secondary);
  --px-color-text-subtle: var(--px-text-tertiary);
  --px-color-primary: var(--px-text-link);
  --px-color-primary-hover: var(--px-text-link-hover);
  --px-color-primary-contrast: var(--px-action-on-solid);
  --px-color-primary-subtle: var(--px-brand-subtle);
  --px-color-danger: var(--px-danger);
  --px-color-danger-subtle: var(--px-danger-subtle);
  --px-color-success: var(--px-success);
  --px-color-success-subtle: var(--px-success-subtle);
  --px-color-warning: var(--px-warning);
  --px-color-warning-subtle: var(--px-warning-subtle);
  --px-color-info: var(--px-info);
  --px-color-info-subtle: var(--px-info-subtle);
  --px-text-xs: var(--px-font-size-xs);
  --px-text-sm: var(--px-font-size-sm);
  --px-text-md: var(--px-font-size-md);
  --px-text-lg: var(--px-font-size-lg);
  --px-text-xl: var(--px-font-size-xl);
  --px-leading-tight: var(--px-line-height-snug);
  --px-leading-normal: var(--px-line-height-normal);
  --px-weight-medium: var(--px-font-weight-medium);
  --px-weight-semibold: var(--px-font-weight-semibold);
  --px-weight-bold: var(--px-font-weight-bold);
  --px-radius-full: var(--px-radius-pill);
  --px-control-height: var(--px-button-height);
  --px-motion-fast: var(--px-duration-fast);
  --px-motion-base: var(--px-duration-base);
  --px-ease: var(--px-ease-standard);
  --px-shadow-card: var(--px-glass-shadow);
  --px-shadow-popover: var(--px-elevation-3);
}

@supports (color: lab(0% 0 0)) {
  :root {
    --px-atmosphere-base: lab(94.832% -3.97408 -6.9146);
    --px-atmosphere-top: lab(80.3211% -10.0391 -22.4757);
    --px-atmosphere-mid: lab(88.4919% -7.83065 -14.0038);
    --px-atmosphere-glow: lab(100% 0 0 / .85);
    --px-surface-glass: lab(98.2803% -1.47349 -2.52973 / .58);
    --px-surface-glass-strong: lab(98.8554% -1.10805 -1.89894 / .78);
    --px-surface-glass-hover: lab(98.8554% -1.10805 -1.89894 / .72);
    --px-surface-solid: lab(98.2754% -1.10799 -1.89893);
    --px-surface-sunken: lab(94.2211% -2.27043 -4.60727);
    --px-surface-raised: lab(100% 0 0);
    --px-surface-inverse: lab(6.17779% -.425063 -2.53521);
    --px-text-primary: lab(7.11628% -.620127 -8.86891);
    --px-text-secondary: lab(30.2996% -1.65281 -10.7803);
    --px-text-tertiary: lab(38.4253% -1.75951 -10.8197);
    --px-text-inverse: lab(97.6882% -.8232 -1.65225);
    --px-text-link: lab(35.0283% 3.79416 -51.1531);
    --px-text-link-hover: lab(24.4004% 8.17816 -48.0695);
    --px-border-subtle: lab(18.6248% -1.43409 -14.1476 / .08);
    --px-border-default: lab(18.6248% -1.43409 -14.1476 / .14);
    --px-border-input: lab(44.2285% -1.81758 -10.8424);
    --px-border-glass: lab(100% 0 0 / .7);
    --px-border-field: lab(18.6248% -1.43409 -14.1476 / .2);
    --px-surface-popover: lab(98.2803% -1.47349 -2.52973 / .97);
    --px-surface-hover-tint: lab(18.5501% -1.21942 -17.5602 / .07);
    --px-action-solid: lab(4.39976% -.173152 -3.35613);
    --px-action-solid-hover: lab(15.2477% -.402436 -5.89299);
    --px-action-on-solid: lab(98.845% -.495464 -.992262);
    --px-action-soft: lab(98.8554% -1.10805 -1.89894 / .62);
    --px-action-soft-hover: lab(99.4303% -.740558 -1.26708 / .9);
    --px-brand: lab(46.5411% -13.6057 -37.02);
    --px-brand-subtle: lab(91.9453% -6.6146 -12.7565);
    --px-danger: lab(40.1877% 56.841 37.7308);
    --px-danger-subtle: lab(93.908% 9.39834 4.40652);
    --px-success: lab(39.9184% -34.1133 20.4764);
    --px-success-subtle: lab(94.7364% -12.0788 7.08568);
    --px-warning: lab(41.6375% 20.833 48.6247);
    --px-warning-subtle: lab(95.5261% 2.02972 19.535);
    --px-info: lab(36.4394% .325844 -47.3403);
    --px-info-subtle: lab(94.2019% -3.92574 -10.2494);
    --px-focus-ring: lab(45.6305% -.260234 -53.7122);
    --px-scrim: lab(7.09577% -.827707 -10.5089 / .32);
    --px-elevation-1: 0 1px 2px lab(30.2667% -3.68746 -17.1804 / .06), 0 2px 8px lab(30.2667% -3.68746 -17.1804 / .05);
    --px-elevation-2: 0 1px 2px lab(30.2667% -3.68746 -17.1804 / .05), 0 8px 24px lab(30.2146% -3.9237 -20.4988 / .09);
    --px-elevation-3: 0 2px 6px lab(30.2667% -3.68746 -17.1804 / .06), 0 18px 48px lab(30.1532% -3.97849 -23.7956 / .14);
    --px-elevation-4: 0 4px 12px lab(30.2667% -3.68746 -17.1804 / .08), 0 32px 80px lab(24.2405% -3.02847 -26.9589 / .2);
    --px-glass-highlight: inset 0 1px 0 lab(100% 0 0 / .75);
  }
}

:root {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --px-atmosphere-base: #060d1c;
    --px-atmosphere-top: #0e2648;
    --px-atmosphere-mid: #09152c;
    --px-atmosphere-glow: #1e507b8c;
    --px-surface-glass: #232e3f80;
    --px-surface-glass-strong: #1c2738b8;
    --px-surface-glass-hover: #2d394a99;
    --px-surface-solid: #131b29;
    --px-surface-sunken: #0b111f;
    --px-surface-raised: #1e2735;
    --px-surface-inverse: #edf2f7;
    --px-text-primary: #f2f6f9;
    --px-text-secondary: #bec9d4;
    --px-text-tertiary: #a6b3c1;
    --px-text-inverse: #0e141f;
    --px-text-link: #80c7f8;
    --px-text-link-hover: #addfff;
    --px-border-subtle: #ffffff12;
    --px-border-default: #ffffff21;
    --px-border-input: #798898;
    --px-border-glass: #ffffff1f;
    --px-border-field: #ffffff2e;
    --px-surface-popover: #192231f7;
    --px-surface-hover-tint: #ffffff17;
    --px-action-solid: #f2f6f9;
    --px-action-solid-hover: #d1d8df;
    --px-action-on-solid: #0d121b;
    --px-action-soft: #323e508c;
    --px-action-soft-hover: #414e60b3;
    --px-brand: #99cff3;
    --px-brand-subtle: #142f4b;
    --px-danger: #ffafa8;
    --px-danger-subtle: #421b1b;
    --px-success: #a0d7ad;
    --px-success-subtle: #112d1a;
    --px-warning: #ecbe88;
    --px-warning-subtle: #382409;
    --px-info: #9bccff;
    --px-info-subtle: #102a45;
    --px-focus-ring: #99cff3;
    --px-scrim: #01020599;
    --px-elevation-0: none;
    --px-elevation-1: 0 1px 2px #00000059, 0 2px 8px #00000040;
    --px-elevation-2: 0 1px 2px #00000059, 0 8px 24px #00000059;
    --px-elevation-3: 0 2px 6px #0006, 0 18px 48px #00000073;
    --px-elevation-4: 0 4px 12px #00000073, 0 32px 80px #0000008c;
    --px-glass-highlight: inset 0 1px 0 #ffffff14;
  }

  @supports (color: lab(0% 0 0)) {
    :root:not([data-theme="light"]) {
      --px-atmosphere-base: lab(3.53293% .821129 -10.317);
      --px-atmosphere-top: lab(14.8027% 1.43763 -24.4402);
      --px-atmosphere-mid: lab(6.8471% 1.82898 -17.5849);
      --px-atmosphere-glow: lab(32.3915% -4.95018 -29.9985 / .55);
      --px-surface-glass: lab(18.6396% -1.04287 -12.526 / .5);
      --px-surface-glass-strong: lab(15.1337% -.483528 -12.5682 / .72);
      --px-surface-glass-hover: lab(23.2883% -1.2024 -12.5711 / .6);
      --px-surface-solid: lab(9.34171% .000409782 -10.8134);
      --px-surface-sunken: lab(5.11012% .486761 -10.0304);
      --px-surface-raised: lab(15.1707% -.600293 -10.8221);
      --px-surface-inverse: lab(95.3631% -1.09836 -2.75983);
      --px-text-primary: lab(96.5225% -.827342 -2.07183);
      --px-text-secondary: lab(80.2591% -2.1041 -7.09837);
      --px-text-tertiary: lab(72.1305% -2.56524 -8.84148);
      --px-text-inverse: lab(6.07662% -.0505075 -8.53781);
      --px-text-link: lab(76.8027% -13.1578 -31.7572);
      --px-text-link-hover: lab(86.1616% -12.2047 -25.1226);
      --px-border-subtle: lab(100% 0 0 / .07);
      --px-border-default: lab(100% 0 0 / .13);
      --px-border-input: lab(55.8625% -2.59674 -10.6707);
      --px-border-glass: lab(100% 0 0 / .12);
      --px-border-field: lab(100% 0 0 / .18);
      --px-surface-popover: lab(12.8307% -.459656 -11.4953 / .97);
      --px-surface-hover-tint: lab(100% 0 0 / .09);
      --px-action-solid: lab(96.5225% -.827342 -2.07183);
      --px-action-solid-hover: lab(86.0838% -1.63019 -4.13013);
      --px-action-on-solid: lab(5.18574% -.125743 -6.53743);
      --px-action-soft: lab(25.6119% -1.26828 -12.591 / .55);
      --px-action-soft-hover: lab(32.5806% -1.4268 -12.642 / .7);
      --px-brand: lab(80.3569% -11.5552 -23.8008);
      --px-brand-subtle: lab(18.5617% -2.88492 -20.3069);
      --px-danger: lab(79.2235% 34.4061 19.0177);
      --px-danger-subtle: lab(15.8709% 19.0389 9.44371);
      --px-success: lab(81.3581% -24.8331 14.6444);
      --px-success-subtle: lab(15.9641% -15.3823 9.16486);
      --px-warning: lab(80.2078% 12.2373 33.656);
      --px-warning-subtle: lab(16.3906% 7.8278 20.0989);
      --px-info: lab(79.9726% -6.33657 -34.5301);
      --px-info-subtle: lab(16.1918% -1.86399 -20.4995);
      --px-focus-ring: lab(80.3569% -11.5552 -23.8008);
      --px-scrim: lab(.436743% .15007 -1.55531 / .6);
      --px-elevation-1: 0 1px 2px lab(0% 0 0 / .35), 0 2px 8px lab(0% 0 0 / .25);
      --px-elevation-2: 0 1px 2px lab(0% 0 0 / .35), 0 8px 24px lab(0% 0 0 / .35);
      --px-elevation-3: 0 2px 6px lab(0% 0 0 / .4), 0 18px 48px lab(0% 0 0 / .45);
      --px-elevation-4: 0 4px 12px lab(0% 0 0 / .45), 0 32px 80px lab(0% 0 0 / .55);
      --px-glass-highlight: inset 0 1px 0 lab(100% 0 0 / .08);
    }
  }

  :root:not([data-theme="light"]) {
    --lightningcss-light: ;
    --lightningcss-dark: initial;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --px-atmosphere-base: #060d1c;
  --px-atmosphere-top: #0e2648;
  --px-atmosphere-mid: #09152c;
  --px-atmosphere-glow: #1e507b8c;
  --px-surface-glass: #232e3f80;
  --px-surface-glass-strong: #1c2738b8;
  --px-surface-glass-hover: #2d394a99;
  --px-surface-solid: #131b29;
  --px-surface-sunken: #0b111f;
  --px-surface-raised: #1e2735;
  --px-surface-inverse: #edf2f7;
  --px-text-primary: #f2f6f9;
  --px-text-secondary: #bec9d4;
  --px-text-tertiary: #a6b3c1;
  --px-text-inverse: #0e141f;
  --px-text-link: #80c7f8;
  --px-text-link-hover: #addfff;
  --px-border-subtle: #ffffff12;
  --px-border-default: #ffffff21;
  --px-border-input: #798898;
  --px-border-glass: #ffffff1f;
  --px-border-field: #ffffff2e;
  --px-surface-popover: #192231f7;
  --px-surface-hover-tint: #ffffff17;
  --px-action-solid: #f2f6f9;
  --px-action-solid-hover: #d1d8df;
  --px-action-on-solid: #0d121b;
  --px-action-soft: #323e508c;
  --px-action-soft-hover: #414e60b3;
  --px-brand: #99cff3;
  --px-brand-subtle: #142f4b;
  --px-danger: #ffafa8;
  --px-danger-subtle: #421b1b;
  --px-success: #a0d7ad;
  --px-success-subtle: #112d1a;
  --px-warning: #ecbe88;
  --px-warning-subtle: #382409;
  --px-info: #9bccff;
  --px-info-subtle: #102a45;
  --px-focus-ring: #99cff3;
  --px-scrim: #01020599;
  --px-elevation-0: none;
  --px-elevation-1: 0 1px 2px #00000059, 0 2px 8px #00000040;
  --px-elevation-2: 0 1px 2px #00000059, 0 8px 24px #00000059;
  --px-elevation-3: 0 2px 6px #0006, 0 18px 48px #00000073;
  --px-elevation-4: 0 4px 12px #00000073, 0 32px 80px #0000008c;
  --px-glass-highlight: inset 0 1px 0 #ffffff14;
}

@supports (color: lab(0% 0 0)) {
  :root[data-theme="dark"] {
    --px-atmosphere-base: lab(3.53293% .821129 -10.317);
    --px-atmosphere-top: lab(14.8027% 1.43763 -24.4402);
    --px-atmosphere-mid: lab(6.8471% 1.82898 -17.5849);
    --px-atmosphere-glow: lab(32.3915% -4.95018 -29.9985 / .55);
    --px-surface-glass: lab(18.6396% -1.04287 -12.526 / .5);
    --px-surface-glass-strong: lab(15.1337% -.483528 -12.5682 / .72);
    --px-surface-glass-hover: lab(23.2883% -1.2024 -12.5711 / .6);
    --px-surface-solid: lab(9.34171% .000409782 -10.8134);
    --px-surface-sunken: lab(5.11012% .486761 -10.0304);
    --px-surface-raised: lab(15.1707% -.600293 -10.8221);
    --px-surface-inverse: lab(95.3631% -1.09836 -2.75983);
    --px-text-primary: lab(96.5225% -.827342 -2.07183);
    --px-text-secondary: lab(80.2591% -2.1041 -7.09837);
    --px-text-tertiary: lab(72.1305% -2.56524 -8.84148);
    --px-text-inverse: lab(6.07662% -.0505075 -8.53781);
    --px-text-link: lab(76.8027% -13.1578 -31.7572);
    --px-text-link-hover: lab(86.1616% -12.2047 -25.1226);
    --px-border-subtle: lab(100% 0 0 / .07);
    --px-border-default: lab(100% 0 0 / .13);
    --px-border-input: lab(55.8625% -2.59674 -10.6707);
    --px-border-glass: lab(100% 0 0 / .12);
    --px-border-field: lab(100% 0 0 / .18);
    --px-surface-popover: lab(12.8307% -.459656 -11.4953 / .97);
    --px-surface-hover-tint: lab(100% 0 0 / .09);
    --px-action-solid: lab(96.5225% -.827342 -2.07183);
    --px-action-solid-hover: lab(86.0838% -1.63019 -4.13013);
    --px-action-on-solid: lab(5.18574% -.125743 -6.53743);
    --px-action-soft: lab(25.6119% -1.26828 -12.591 / .55);
    --px-action-soft-hover: lab(32.5806% -1.4268 -12.642 / .7);
    --px-brand: lab(80.3569% -11.5552 -23.8008);
    --px-brand-subtle: lab(18.5617% -2.88492 -20.3069);
    --px-danger: lab(79.2235% 34.4061 19.0177);
    --px-danger-subtle: lab(15.8709% 19.0389 9.44371);
    --px-success: lab(81.3581% -24.8331 14.6444);
    --px-success-subtle: lab(15.9641% -15.3823 9.16486);
    --px-warning: lab(80.2078% 12.2373 33.656);
    --px-warning-subtle: lab(16.3906% 7.8278 20.0989);
    --px-info: lab(79.9726% -6.33657 -34.5301);
    --px-info-subtle: lab(16.1918% -1.86399 -20.4995);
    --px-focus-ring: lab(80.3569% -11.5552 -23.8008);
    --px-scrim: lab(.436743% .15007 -1.55531 / .6);
    --px-elevation-1: 0 1px 2px lab(0% 0 0 / .35), 0 2px 8px lab(0% 0 0 / .25);
    --px-elevation-2: 0 1px 2px lab(0% 0 0 / .35), 0 8px 24px lab(0% 0 0 / .35);
    --px-elevation-3: 0 2px 6px lab(0% 0 0 / .4), 0 18px 48px lab(0% 0 0 / .45);
    --px-elevation-4: 0 4px 12px lab(0% 0 0 / .45), 0 32px 80px lab(0% 0 0 / .55);
    --px-glass-highlight: inset 0 1px 0 lab(100% 0 0 / .08);
  }
}

:root[data-theme="dark"] {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --px-duration-instant: 0s;
    --px-duration-fast: 0s;
    --px-duration-base: 0s;
    --px-duration-slow: 0s;
    --px-duration-slower: 0s;
  }
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --px-glass-fill: var(--px-surface-solid);
    --px-glass-fill-strong: var(--px-surface-solid);
    --px-input-bg: var(--px-surface-solid);
    --px-button-secondary-bg: var(--px-surface-solid);
    --px-popover-bg: var(--px-surface-solid);
    --px-picker-bg: var(--px-surface-solid);
    --px-popover-blur: 0px;
    --px-glass-blur: 0px;
  }
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  :root {
    --px-glass-fill: var(--px-surface-solid);
    --px-glass-fill-strong: var(--px-surface-solid);
    --px-input-bg: var(--px-surface-solid);
    --px-button-secondary-bg: var(--px-surface-solid);
    --px-popover-bg: var(--px-surface-solid);
    --px-picker-bg: var(--px-surface-solid);
    --px-popover-blur: 0px;
    --px-glass-blur: 0px;
  }
}

/* [project]/packages/ui/src/styles.css [app-client] (css) */
.px-visually-hidden {
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  position: absolute;
  overflow: hidden;
}

.px-button {
  justify-content: center;
  align-items: center;
  gap: var(--px-space-2);
  min-height: var(--px-control-height);
  padding: 0 var(--px-space-5);
  border-radius: var(--px-radius-md);
  font: inherit;
  font-size: var(--px-text-sm);
  font-weight: var(--px-weight-semibold);
  cursor: pointer;
  transition: background-color var(--px-motion-fast) var(--px-ease),
    border-color var(--px-motion-fast) var(--px-ease),
    color var(--px-motion-fast) var(--px-ease);
  border: 1px solid #0000;
  line-height: 1;
  text-decoration: none;
  display: inline-flex;
  position: relative;
}

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

.px-button[disabled], .px-button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .55;
}

.px-button--full {
  width: 100%;
}

.px-button--sm {
  min-height: var(--px-button-height-sm, 32px);
  padding: 0 var(--px-space-3);
  font-size: var(--px-text-xs);
}

.px-button--primary {
  background: var(--px-color-primary);
  color: var(--px-color-primary-contrast);
}

.px-button--primary:hover:not([disabled]) {
  background: var(--px-color-primary-hover);
}

.px-button--secondary {
  background: var(--px-color-surface);
  border-color: var(--px-color-border);
  color: var(--px-color-text);
}

.px-button--secondary:hover:not([disabled]) {
  border-color: var(--px-color-border-strong);
  background: var(--px-color-surface-muted);
}

.px-button--ghost:hover:not([disabled]) {
  background: var(--px-color-surface-muted);
  color: var(--px-color-text);
}

.px-button--danger {
  border-color: var(--px-color-border);
  color: var(--px-color-danger);
  background: none;
}

.px-button--danger:hover:not([disabled]) {
  background: var(--px-color-danger-subtle);
}

.px-button__label {
  align-items: center;
  gap: var(--px-space-2);
  display: inline-flex;
}

.px-button--loading .px-button__label {
  visibility: hidden;
}

.px-button__spinner {
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.px-spinner {
  border-radius: var(--px-radius-full);
  border: 2px solid;
  border-right-color: #0000;
  width: 1.1em;
  height: 1.1em;
  animation: .7s linear infinite px-spin;
}

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

.px-link {
  font: inherit;
  font-weight: var(--px-weight-semibold);
  color: var(--px-color-primary);
  cursor: pointer;
  border-radius: var(--px-radius-sm);
  background: none;
  border: 0;
  padding: 0;
  text-decoration: none;
}

.px-link:hover:not([disabled]) {
  text-underline-offset: 3px;
  text-decoration: underline;
}

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

.px-link[disabled] {
  color: var(--px-color-text-subtle);
  cursor: not-allowed;
}

.px-field {
  gap: var(--px-space-2);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.px-field__label {
  font-size: var(--px-text-sm);
  font-weight: var(--px-weight-semibold);
  color: var(--px-color-text);
}

.px-input {
  width: 100%;
  min-height: var(--px-control-height);
  padding: 0 var(--px-space-4);
  border: 1px solid var(--px-color-border-input);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  color: var(--px-color-text);
  font: inherit;
  font-size: var(--px-text-md);
  transition: border-color var(--px-motion-fast) var(--px-ease),
    box-shadow var(--px-motion-fast) var(--px-ease);
}

.px-input:hover:not(:disabled) {
  border-color: var(--px-color-text-subtle);
}

.px-input:focus {
  border-color: var(--px-focus-ring);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--px-focus-ring) 25%, transparent);
  outline: none;
}

.px-input:disabled {
  background: var(--px-color-surface-muted);
  color: var(--px-color-text-subtle);
}

.px-field__action {
  right: var(--px-space-1);
  border-radius: var(--px-radius-sm);
  width: 2.5rem;
  height: 2.5rem;
  color: var(--px-color-text-muted);
  cursor: pointer;
  background: none;
  border: 0;
  place-items: center;
  display: grid;
  position: absolute;
}

.px-field__action:hover {
  color: var(--px-color-text);
  background: var(--px-color-surface-muted);
}

.px-field__action:focus-visible {
  outline: 2px solid var(--px-focus-ring);
  outline-offset: 0;
}

.px-field__hint {
  font-size: var(--px-text-xs);
  line-height: var(--px-leading-normal);
  color: var(--px-color-text-subtle);
  margin: 0;
}

.px-field__error {
  font-size: var(--px-text-xs);
  line-height: var(--px-leading-normal);
  color: var(--px-color-danger);
  margin: 0;
}

.px-code {
  grid-template-columns: repeat(var(--px-code-length, 7), minmax(0, 1fr));
  gap: var(--px-space-2);
  display: grid;
}

.px-code__cell {
  border: 1px solid var(--px-color-border-input);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  width: 100%;
  min-width: 0;
  height: 52px;
  color: var(--px-color-text);
  font-family: var(--px-font-mono);
  font-size: 1.25rem;
  font-weight: var(--px-weight-semibold);
  text-align: center;
  text-transform: uppercase;
  caret-color: var(--px-color-primary);
  padding: 0;
}

.px-code__cell:focus {
  border-color: var(--px-focus-ring);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--px-focus-ring) 25%, transparent);
  outline: none;
}

.px-code__cell[aria-invalid="true"] {
  border-color: var(--px-color-danger);
}

@media (max-width: 360px) {
  .px-code {
    gap: var(--px-space-1);
  }

  .px-code__cell {
    height: 46px;
    font-size: 1.1rem;
  }
}

.px-strength {
  align-items: center;
  gap: var(--px-space-3);
  min-height: 1.25rem;
  display: flex;
}

.px-strength__track {
  border-radius: var(--px-radius-full);
  background: var(--px-color-surface-muted);
  flex: 1;
  height: 4px;
  overflow: hidden;
}

.px-strength__fill {
  border-radius: inherit;
  transform-origin: 0;
  width: 100%;
  height: 100%;
  transition: transform var(--px-motion-base) var(--px-ease),
    background-color var(--px-motion-base) var(--px-ease);
  display: block;
  transform: scaleX(0);
}

.px-strength__fill[data-score="1"] {
  background: var(--px-color-danger);
  transform: scaleX(.25);
}

.px-strength__fill[data-score="2"] {
  background: var(--px-color-warning);
  transform: scaleX(.5);
}

.px-strength__fill[data-score="3"] {
  background: var(--px-color-info);
  transform: scaleX(.75);
}

.px-strength__fill[data-score="4"] {
  background: var(--px-color-success);
  transform: scaleX(1);
}

.px-strength__label {
  text-align: right;
  min-width: 4.5rem;
  font-size: var(--px-text-xs);
  color: var(--px-color-text-subtle);
}

.px-alert {
  gap: var(--px-space-3);
  padding: var(--px-space-3) var(--px-space-4);
  border-radius: var(--px-radius-md);
  font-size: var(--px-text-sm);
  line-height: var(--px-leading-normal);
  border: 1px solid #0000;
  display: flex;
}

.px-alert__title {
  font-weight: var(--px-weight-semibold);
  display: block;
}

.px-alert--error {
  background: var(--px-color-danger-subtle);
  border-color: color-mix(in srgb, var(--px-color-danger) 30%, transparent);
  color: var(--px-color-danger);
}

.px-alert--success {
  background: var(--px-color-success-subtle);
  border-color: color-mix(in srgb, var(--px-color-success) 30%, transparent);
  color: var(--px-color-success);
}

.px-alert--info {
  background: var(--px-color-info-subtle);
  border-color: color-mix(in srgb, var(--px-color-info) 30%, transparent);
  color: var(--px-color-info);
}

.px-alert--warning {
  background: var(--px-color-warning-subtle);
  border-color: color-mix(in srgb, var(--px-color-warning) 30%, transparent);
  color: var(--px-color-warning);
}

.px-divider {
  align-items: center;
  gap: var(--px-space-3);
  color: var(--px-color-text-subtle);
  font-size: var(--px-text-xs);
  text-transform: uppercase;
  letter-spacing: .08em;
  display: flex;
}

.px-divider:before, .px-divider:after {
  content: "";
  background: var(--px-color-border);
  flex: 1;
  height: 1px;
}

.px-auth-card {
  width: 100%;
  padding: var(--px-space-8) var(--px-space-6);
  border: 1px solid var(--px-color-border);
  border-radius: var(--px-radius-xl);
  background: var(--px-color-surface);
  box-shadow: var(--px-shadow-card);
}

@media (min-width: 480px) {
  .px-auth-card {
    padding: var(--px-space-10) var(--px-space-8);
  }
}

.px-auth-card__back {
  align-items: center;
  gap: var(--px-space-1);
  margin: 0 0 var(--px-space-4);
  font-size: var(--px-text-sm);
  display: inline-flex;
}

.px-auth-card__title {
  font-size: var(--px-text-xl);
  line-height: var(--px-leading-tight);
  font-weight: var(--px-weight-bold);
  letter-spacing: -.02em;
  color: var(--px-color-text);
  margin: 0;
}

.px-auth-card__title:focus {
  outline: none;
}

.px-auth-card__subtitle {
  margin: var(--px-space-2) 0 0;
  font-size: var(--px-text-sm);
  line-height: var(--px-leading-normal);
  color: var(--px-color-text-muted);
  overflow-wrap: anywhere;
}

.px-auth-card__footer {
  margin-top: var(--px-space-6);
  padding-top: var(--px-space-5);
  border-top: 1px solid var(--px-color-border);
  text-align: center;
  font-size: var(--px-text-sm);
  color: var(--px-color-text-muted);
}

.px-provider-list {
  gap: var(--px-space-3);
  flex-direction: column;
  display: flex;
}

.px-provider-mark {
  flex: none;
  width: 18px;
  height: 18px;
}

.px-checkbox {
  align-items: center;
  gap: var(--px-space-2);
  min-height: var(--px-control-height);
  font-size: var(--px-text-sm);
  color: var(--px-color-text);
  cursor: pointer;
  display: inline-flex;
}

.px-checkbox input {
  width: 18px;
  height: 18px;
  accent-color: var(--px-color-primary);
  margin: 0;
}

.px-checkbox input:focus-visible {
  outline: 2px solid var(--px-focus-ring);
  outline-offset: 2px;
}

.px-checkbox--disabled {
  color: var(--px-color-text-subtle);
  cursor: not-allowed;
}

.px-badge {
  padding: 2px var(--px-space-2);
  border-radius: var(--px-radius-full);
  background: var(--px-color-primary-subtle);
  color: var(--px-color-primary);
  font-size: var(--px-text-xs);
  font-weight: var(--px-weight-semibold);
  text-transform: capitalize;
  align-items: center;
  display: inline-flex;
}

.px-badge--muted {
  background: var(--px-color-surface-muted);
  color: var(--px-color-text-muted);
}

.px-badge--warning {
  background: var(--px-color-warning-subtle);
  color: var(--px-color-warning);
}

.px-input--multiline {
  min-height: 6rem;
  padding: var(--px-space-3) var(--px-space-4);
  line-height: var(--px-leading-normal);
  resize: vertical;
}

.px-entity {
  gap: var(--px-space-4);
  display: grid;
}

.px-entity__header {
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--px-space-3);
  flex-wrap: wrap;
  display: flex;
}

.px-entity__actions, .px-entity__transitions, .px-entity-form__actions {
  align-items: center;
  gap: var(--px-space-2);
  flex-wrap: wrap;
  display: flex;
}

.px-entity__eyebrow {
  color: var(--px-color-text-muted);
  font-size: var(--px-text-sm);
  margin: 0;
}

.px-entity__title {
  font-size: var(--px-text-xl);
  line-height: var(--px-leading-tight);
  overflow-wrap: anywhere;
  margin: 0;
}

.px-entity__subtitle {
  margin: 0 0 var(--px-space-2);
  font-size: var(--px-text-lg);
  font-weight: var(--px-weight-semibold);
}

.px-entity__state {
  color: var(--px-color-text-muted);
  margin: 0;
}

.px-entity__none {
  color: var(--px-color-text-subtle);
}

.px-entity__fields {
  gap: var(--px-space-3) var(--px-space-6);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
  margin: 0;
  display: grid;
}

.px-entity__field dt {
  color: var(--px-color-text-muted);
  font-size: var(--px-text-sm);
}

.px-entity__field dd {
  margin: var(--px-space-1) 0 0;
  overflow-wrap: anywhere;
}

.px-entity__link-list {
  gap: var(--px-space-2);
  margin: 0 0 var(--px-space-3);
  padding: 0;
  list-style: none;
  display: grid;
}

.px-entity__link-list li {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2);
  padding: var(--px-space-2) var(--px-space-3);
  border: 1px solid var(--px-color-border);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  display: flex;
}

.px-entity-form__section {
  gap: var(--px-space-4);
  border: 0;
  margin: 0;
  padding: 0;
  display: grid;
}

.px-table-wrap {
  border: 1px solid var(--px-color-border);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  overflow-x: auto;
}

.px-table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--px-text-sm);
}

.px-table th, .px-table td {
  padding: var(--px-space-3) var(--px-space-4);
  border-bottom: 1px solid var(--px-color-border);
  text-align: left;
  vertical-align: top;
}

.px-table thead th {
  color: var(--px-color-text-muted);
  font-weight: var(--px-weight-semibold);
  background: var(--px-color-surface-muted);
}

.px-table tbody tr:last-child > * {
  border-bottom: 0;
}

.px-table tbody th {
  font-weight: var(--px-weight-medium);
}

.px-table__link {
  color: var(--px-color-primary);
  overflow-wrap: anywhere;
  text-decoration: none;
}

.px-table__link:hover {
  text-decoration: underline;
}

.px-table__link:focus-visible {
  outline: 2px solid var(--px-color-primary);
  outline-offset: 2px;
}

@media (max-width: 640px) {
  .px-table thead {
    clip: rect(0 0 0 0);
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden;
  }

  .px-table tbody tr {
    gap: var(--px-space-1);
    padding: var(--px-space-3) var(--px-space-4);
    border-bottom: 1px solid var(--px-color-border);
    display: grid;
  }

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

  .px-table th, .px-table td {
    gap: var(--px-space-2);
    border: 0;
    padding: 0;
    display: flex;
  }

  .px-table td:before {
    content: attr(data-label);
    min-width: 6rem;
    color: var(--px-color-text-muted);
  }
}

.px-glass {
  background: var(--px-glass-fill);
  border: 1px solid var(--px-glass-border);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
}

.px-display {
  font-family: var(--px-font-display);
  font-weight: var(--px-font-weight-regular);
  letter-spacing: var(--px-letter-spacing-tight);
  line-height: var(--px-line-height-tight);
}

.px-auth-card {
  background: var(--px-glass-fill);
  border: 1px solid var(--px-glass-border);
  border-radius: var(--px-card-radius);
  padding: var(--px-card-padding);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  animation: px-rise var(--px-duration-slower) var(--px-ease-emphasized) both;
}

.px-auth-card__body {
  gap: var(--px-card-gap);
  flex-direction: column;
  display: flex;
}

.px-auth-card__title {
  font-family: var(--px-font-display);
  font-weight: var(--px-font-weight-regular);
  font-size: var(--px-font-size-display-sm);
  line-height: var(--px-line-height-tight);
  letter-spacing: var(--px-letter-spacing-tight);
  color: var(--px-text-primary);
}

.px-auth-card__subtitle, .px-auth-card__footer {
  color: var(--px-text-secondary);
}

@keyframes px-rise {
  from {
    opacity: 0;
    transform: translateY(8px) scale(.99);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.px-button {
  min-height: var(--px-button-height);
  padding: 0 var(--px-button-padding-x);
  border-radius: var(--px-button-radius);
  font-size: var(--px-button-font-size);
  font-weight: var(--px-button-font-weight);
  transition: var(--px-transition-colors), var(--px-transition-transform);
}

.px-button:active:not(:disabled) {
  transform: scale(.985);
}

.px-button--sm {
  min-height: var(--px-button-height-sm);
  padding: 0 var(--px-space-4);
}

.px-button--primary {
  background: var(--px-button-primary-bg);
  color: var(--px-button-primary-fg);
  border-color: #0000;
}

.px-button--primary:hover:not(:disabled) {
  background: var(--px-button-primary-bg-hover);
}

.px-button--secondary {
  background: var(--px-button-secondary-bg);
  color: var(--px-button-secondary-fg);
  border-color: var(--px-button-secondary-border);
  -webkit-backdrop-filter: blur(var(--px-blur-sm));
  backdrop-filter: blur(var(--px-blur-sm));
}

.px-button--secondary:hover:not(:disabled) {
  background: var(--px-button-secondary-bg-hover);
}

.px-button--ghost {
  color: var(--px-text-primary);
  background: none;
}

.px-button--ghost:hover:not(:disabled) {
  background: var(--px-action-soft);
}

.px-button:focus-visible, .px-input:focus-visible, .px-code__cell:focus-visible, .px-segmented__item:focus-visible, .px-link:focus-visible {
  outline: var(--px-focus-width) solid var(--px-focus-ring);
  outline-offset: var(--px-focus-offset);
}

.px-provider-list {
  gap: var(--px-space-3);
  display: grid;
}

.px-provider-list .px-button {
  min-height: 52px;
  font-size: var(--px-font-size-md);
}

.px-input {
  min-height: var(--px-input-height);
  padding: 0 var(--px-input-padding-x);
  border-radius: var(--px-input-radius);
  background: var(--px-input-bg);
  border: 1px solid var(--px-input-border);
  color: var(--px-text-primary);
  transition: var(--px-transition-colors);
}

.px-input::placeholder {
  color: var(--px-input-placeholder);
}

.px-input:focus {
  border-color: var(--px-input-border-focus);
}

.px-input--multiline {
  border-radius: var(--px-radius-lg);
  padding: var(--px-space-3) var(--px-input-padding-x);
}

.px-field__label {
  color: var(--px-text-primary);
  font-weight: var(--px-font-weight-medium);
  padding-left: var(--px-space-2);
}

.px-field__hint {
  color: var(--px-text-secondary);
  padding-left: var(--px-space-2);
}

.px-field__action {
  border-radius: var(--px-radius-pill);
  right: var(--px-space-2);
}

.px-code {
  grid-template-columns: repeat(var(--px-code-length), var(--px-code-cell-size));
  gap: var(--px-code-gap);
  justify-content: center;
  display: grid;
}

.px-code__cell {
  width: var(--px-code-cell-size);
  height: calc(var(--px-code-cell-size) * 1.2);
  border-radius: var(--px-code-cell-radius);
  background: var(--px-input-bg);
  border: 1px solid var(--px-input-border);
  color: var(--px-text-primary);
  font-family: var(--px-font-mono);
  font-size: var(--px-font-size-xl);
  font-weight: var(--px-font-weight-semibold);
  text-align: center;
  transition: var(--px-transition-colors), var(--px-transition-transform);
}

.px-code__cell:focus {
  border-color: var(--px-input-border-focus);
  transform: translateY(-1px);
}

.px-alert {
  border-radius: var(--px-radius-lg);
}

.px-divider {
  color: var(--px-text-tertiary);
}

.px-segmented {
  align-items: center;
  gap: var(--px-space-0-5);
  min-height: var(--px-segmented-height);
  padding: var(--px-segmented-padding);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill);
  border: 1px solid var(--px-glass-border);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  scrollbar-width: none;
  max-width: 100%;
  display: inline-flex;
  overflow-x: auto;
}

.px-segmented__item {
  justify-content: center;
  align-items: center;
  gap: var(--px-space-1-5);
  min-height: calc(var(--px-segmented-height) - 2 * var(--px-segmented-padding));
  min-width: 36px;
  padding: 0 var(--px-segmented-item-padding-x);
  border-radius: var(--px-radius-pill);
  color: var(--px-segmented-fg);
  font: inherit;
  font-size: var(--px-font-size-sm);
  font-weight: var(--px-font-weight-medium);
  white-space: nowrap;
  cursor: pointer;
  transition: var(--px-transition-colors);
  background: none;
  border: 0;
  text-decoration: none;
  display: inline-flex;
}

.px-segmented__item:hover {
  color: var(--px-text-primary);
}

.px-segmented__item[aria-current="page"], .px-segmented__item[aria-pressed="true"], .px-segmented__item[aria-checked="true"] {
  background: var(--px-segmented-active-bg);
  color: var(--px-segmented-active-fg);
}

.px-segmented--sm {
  min-height: 36px;
}

.px-segmented--sm .px-segmented__item {
  min-height: 28px;
  padding: 0 var(--px-space-2);
}

.px-segmented__item svg {
  width: 16px;
  height: 16px;
}

.px-field {
  gap: var(--px-space-1-5);
}

.px-field__control {
  align-items: center;
  display: flex;
  position: relative;
}

.px-input {
  height: var(--px-input-height);
  min-height: var(--px-input-height);
  padding: 0 var(--px-input-padding-x);
  border: 1px solid var(--px-input-border);
  border-radius: var(--px-input-radius);
  background: var(--px-input-bg);
  box-shadow: var(--px-input-shadow);
  color: var(--px-text-primary);
  font-size: var(--px-font-size-md);
  -webkit-backdrop-filter: blur(var(--px-blur-sm));
  backdrop-filter: blur(var(--px-blur-sm));
  -webkit-tap-highlight-color: transparent;
  transition: var(--px-transition-colors);
}

.px-input::placeholder {
  color: var(--px-input-placeholder);
  opacity: 1;
}

.px-input:hover:not(:disabled):not(:focus) {
  border-color: var(--px-input-border-hover);
}

.px-input:focus, .px-input:focus-visible {
  border-color: var(--px-input-border-focus);
  box-shadow: var(--px-input-shadow), var(--px-input-ring);
  outline: none;
}

.px-input[aria-invalid="true"] {
  border-color: var(--px-danger);
}

.px-input[aria-invalid="true"]:focus {
  box-shadow: var(--px-input-shadow), var(--px-input-ring-invalid);
}

.px-input:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.px-input--multiline {
  height: auto;
  min-height: 9.5rem;
  padding: var(--px-space-3) var(--px-input-padding-x);
  border-radius: var(--px-textarea-radius);
  line-height: var(--px-line-height-normal);
  resize: vertical;
}

.px-input--with-leading {
  padding-left: calc(var(--px-input-padding-x) + var(--px-space-8));
}

.px-input--with-action {
  padding-right: calc(var(--px-space-12) + var(--px-space-1));
}

.px-field__leading {
  left: var(--px-input-padding-x);
  z-index: 1;
  color: var(--px-text-tertiary);
  pointer-events: none;
  align-items: center;
  display: inline-flex;
  position: absolute;
}

.px-field__action {
  width: 44px;
  height: 44px;
  right: var(--px-space-0-5);
}

.px-field__hint {
  padding-left: var(--px-space-4);
}

.px-field__error {
  align-items: flex-start;
  gap: var(--px-space-1-5);
  padding-left: var(--px-space-4);
  color: var(--px-danger);
  font-size: var(--px-font-size-xs);
  font-weight: var(--px-font-weight-medium);
  animation: px-fade-in var(--px-duration-base) var(--px-ease-standard) both;
  display: flex;
}

.px-field__error svg {
  flex: none;
  margin-top: .1em;
}

.px-field__counter {
  align-self: flex-end;
  align-items: center;
  gap: var(--px-space-1);
  padding-right: var(--px-space-3);
  color: var(--px-text-tertiary);
  font-size: var(--px-font-size-xs);
  font-weight: var(--px-font-weight-medium);
  font-variant-numeric: tabular-nums;
  transition: var(--px-transition-colors);
  margin: 0;
  display: inline-flex;
}

.px-field__counter--complete {
  color: var(--px-success);
}

@keyframes px-fade-in {
  from {
    opacity: 0;
    transform: translateY(-2px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.px-select__trigger {
  align-items: center;
  gap: var(--px-space-2);
  width: 100%;
  padding-right: calc(var(--px-input-padding-x) + var(--px-space-6));
  font: inherit;
  font-size: var(--px-font-size-md);
  text-align: left;
  cursor: pointer;
  display: flex;
}

input.px-select__trigger {
  cursor: text;
}

.px-select__value {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.px-select__value--placeholder {
  color: var(--px-input-placeholder);
}

.px-select__leading {
  flex: none;
  display: inline-flex;
}

.px-select__chevron {
  right: var(--px-input-padding-x);
  color: var(--px-text-secondary);
  pointer-events: none;
  transition: var(--px-transition-transform);
  position: absolute;
}

.px-select:has([aria-expanded="true"]) .px-select__chevron {
  transform: rotate(180deg);
}

.px-select--sm .px-select__trigger {
  height: var(--px-button-height-sm);
  min-height: var(--px-button-height-sm);
  padding-left: var(--px-space-4);
  font-size: var(--px-font-size-sm);
}

.px-select--sm .px-select__chevron {
  right: var(--px-space-3);
}

.px-popover {
  top: calc(100% + var(--px-space-1-5));
  z-index: var(--px-z-popover);
  min-width: 12rem;
  padding: var(--px-space-1-5);
  border: 1px solid var(--px-popover-border);
  border-radius: var(--px-popover-radius);
  background: var(--px-popover-bg);
  box-shadow: var(--px-popover-shadow);
  -webkit-backdrop-filter: blur(var(--px-popover-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-popover-blur)) saturate(var(--px-glass-saturate));
  transform-origin: top;
  animation: px-pop-in var(--px-duration-base) var(--px-ease-emphasized) both;
  position: absolute;
  left: 0;
  right: 0;
}

.px-popover[data-placement="top"] {
  top: auto;
  bottom: calc(100% + var(--px-space-1-5));
  transform-origin: bottom;
}

.px-listbox {
  max-height: var(--px-popover-max-height);
  overscroll-behavior: contain;
  scrollbar-width: thin;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-y: auto;
}

.px-option {
  align-items: center;
  gap: var(--px-space-3);
  min-height: var(--px-option-height);
  padding: 0 var(--px-space-3);
  border-radius: var(--px-option-radius);
  color: var(--px-text-primary);
  font-size: var(--px-font-size-md);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--px-duration-fast) var(--px-ease-standard);
  display: flex;
}

.px-option[data-active] {
  background: var(--px-option-hover-bg);
}

.px-option--selected {
  font-weight: var(--px-font-weight-semibold);
}

.px-option[aria-disabled="true"] {
  opacity: .45;
  cursor: not-allowed;
}

.px-option__leading {
  flex: none;
  display: inline-flex;
}

.px-option__label {
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.px-option__check {
  color: var(--px-text-primary);
  flex: none;
}

.px-listbox__empty {
  padding: var(--px-space-4) var(--px-space-3);
  color: var(--px-text-secondary);
  font-size: var(--px-font-size-sm);
  text-align: center;
  margin: 0;
}

@keyframes px-pop-in {
  from {
    opacity: 0;
    transform: translateY(-4px) scale(.98);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.px-picker {
  align-items: center;
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.px-picker__frame {
  position: relative;
}

.px-picker__button {
  border-radius: var(--px-radius-pill);
  color: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  background: none;
  border: 0;
  padding: 0;
  display: block;
  position: relative;
}

.px-picker--square .px-picker__button {
  border-radius: var(--px-image-tile-radius);
}

.px-picker__button:focus-visible {
  outline: var(--px-focus-width) solid var(--px-focus-ring);
  outline-offset: 3px;
}

.px-picker__button:disabled {
  cursor: progress;
}

.px-picker__media {
  width: var(--px-avatar-size);
  height: var(--px-avatar-size);
  border: 1px solid var(--px-glass-border);
  border-radius: inherit;
  background: var(--px-picker-bg);
  box-shadow: var(--px-glass-highlight), var(--px-elevation-1);
  color: var(--px-picker-fg);
  -webkit-backdrop-filter: blur(var(--px-blur-sm));
  backdrop-filter: blur(var(--px-blur-sm));
  transition: var(--px-transition-transform),
    box-shadow var(--px-duration-fast) var(--px-ease-standard),
    opacity var(--px-duration-fast) var(--px-ease-standard);
  place-items: center;
  display: grid;
  overflow: hidden;
}

.px-picker--square .px-picker__media {
  width: var(--px-image-tile-size);
  height: var(--px-image-tile-size);
}

.px-picker__media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.px-picker--square .px-picker__media img {
  object-fit: contain;
}

.px-picker__button:hover .px-picker__media {
  box-shadow: var(--px-glass-highlight), var(--px-elevation-2);
}

.px-picker__button:active:not(:disabled) .px-picker__media {
  transform: scale(.97);
}

.px-picker__button[aria-busy="true"] .px-picker__media {
  opacity: .6;
}

.px-picker__initials {
  font-size: var(--px-font-size-xl);
  font-weight: var(--px-font-weight-semibold);
  letter-spacing: var(--px-letter-spacing-wide);
  color: var(--px-text-secondary);
}

.px-picker__badge {
  width: var(--px-picker-badge-size);
  height: var(--px-picker-badge-size);
  border: 2px solid var(--px-surface-solid);
  border-radius: var(--px-radius-pill);
  background: var(--px-picker-badge-bg);
  color: var(--px-picker-badge-fg);
  box-shadow: var(--px-elevation-2);
  transition: var(--px-transition-transform);
  place-items: center;
  display: grid;
  position: absolute;
  bottom: 0;
  right: 0;
}

.px-picker--square .px-picker__badge {
  right: calc(-1 * var(--px-space-2));
  bottom: calc(-1 * var(--px-space-2));
}

.px-picker__button:hover .px-picker__badge {
  transform: scale(1.06);
}

.px-picker__ring {
  inset: calc(-1 * var(--px-space-1));
  border: 2px solid #0000;
  border-top-color: var(--px-focus-ring);
  border-right-color: var(--px-focus-ring);
  border-radius: var(--px-radius-pill);
  animation: .9s linear infinite px-spin;
  position: absolute;
}

.px-picker__remove {
  border-radius: var(--px-radius-pill);
  background: var(--px-popover-bg);
  width: 24px;
  height: 24px;
  color: var(--px-text-primary);
  box-shadow: inset 0 0 0 1px var(--px-border-default),
    var(--px-elevation-2);
  cursor: pointer;
  -webkit-backdrop-filter: blur(var(--px-blur-sm));
  backdrop-filter: blur(var(--px-blur-sm));
  border: 0;
  place-items: center;
  padding: 0;
  display: grid;
  position: absolute;
  top: 0;
  right: 0;
}

.px-picker__remove:before {
  content: "";
  position: absolute;
  inset: -10px;
}

.px-picker--square .px-picker__remove {
  top: calc(-1 * var(--px-space-2));
  right: calc(-1 * var(--px-space-2));
}

.px-picker__remove:focus-visible {
  outline: var(--px-focus-width) solid var(--px-focus-ring);
  outline-offset: var(--px-focus-offset);
}

.px-picker__error {
  text-align: center;
  justify-content: center;
  padding-left: 0;
}

.px-progress {
  align-items: center;
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.px-progress__track {
  gap: var(--px-space-1-5);
  width: 100%;
  max-width: 11rem;
  padding: var(--px-space-1);
  border: 1px solid var(--px-glass-border);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill-strong);
  box-shadow: var(--px-glass-highlight);
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  margin: 0;
  list-style: none;
  display: grid;
}

.px-progress__seg {
  height: var(--px-progress-height);
  border-radius: var(--px-radius-pill);
  background: var(--px-progress-track);
  position: relative;
  overflow: hidden;
}

.px-progress__seg:after {
  content: "";
  border-radius: inherit;
  background: var(--px-progress-fill);
  transform-origin: 0;
  transition: transform var(--px-duration-slow) var(--px-ease-emphasized);
  position: absolute;
  inset: 0;
  transform: scaleX(0);
}

.px-progress__seg--done:after, .px-progress__seg--current:after {
  transform: scaleX(1);
}

.px-auth-card__logo {
  margin-bottom: var(--px-space-4);
  justify-content: center;
  display: flex;
}

.px-auth-card--center .px-auth-card__header {
  text-align: center;
}

.px-auth-card__header {
  margin-bottom: var(--px-space-5);
}

@media (max-width: 599px) {
  .px-auth-card--compact {
    padding: var(--px-space-5) var(--px-space-5) var(--px-space-6);
  }

  .px-auth-card--compact .px-auth-card__logo {
    margin-bottom: var(--px-space-2);
  }

  .px-auth-card--compact .px-auth-card__logo .px-logo {
    width: 2.25rem;
    height: 2.25rem;
  }

  .px-auth-card--compact .px-auth-card__header {
    margin-bottom: var(--px-space-3);
  }

  .px-auth-card--compact .px-auth-card__title {
    font-size: var(--px-font-size-xl);
  }

  .px-auth-card--compact .px-auth-card__subtitle {
    margin-top: var(--px-space-1);
    font-size: var(--px-font-size-xs);
  }

  .px-auth-card--compact .px-auth-card__body {
    gap: var(--px-space-4);
  }
}

.px-button--primary {
  box-shadow: var(--px-elevation-1);
}

.px-button--primary:active:not(:disabled) {
  box-shadow: none;
}

.px-step {
  gap: var(--px-card-gap);
  animation: px-step-in var(--px-duration-slow) var(--px-ease-emphasized) backwards;
  flex-direction: column;
  display: flex;
}

@keyframes px-step-in {
  from {
    opacity: 0;
    transform: translateX(10px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .px-popover, .px-step, .px-field__error, .px-picker__ring {
    animation: none;
  }
}

.px-picker--square .px-picker__ring {
  border-radius: calc(var(--px-image-tile-radius) + var(--px-space-1));
}

.px-button:active:not(:disabled) {
  filter: brightness(.92);
  transform: scale(.97);
}

.px-button:disabled, .px-button[aria-disabled="true"] {
  opacity: .45;
  filter: saturate(.6);
  cursor: not-allowed;
  box-shadow: none;
}

.px-button--loading:disabled {
  opacity: 1;
  filter: none;
  cursor: progress;
}

.px-button__spinner .px-logo-loader {
  pointer-events: none;
}

.px-logo {
  object-fit: contain;
  -webkit-user-select: none;
  user-select: none;
  flex: none;
  display: block;
}

.px-logo--fallback {
  border-radius: var(--px-radius-pill);
  background: var(--px-action-solid);
  color: var(--px-action-on-solid);
  font-weight: var(--px-font-weight-bold);
  place-items: center;
  line-height: 1;
  display: grid;
}

.px-logo-loader {
  flex: none;
  place-items: center;
  display: inline-grid;
  position: relative;
}

.px-logo-loader > * {
  grid-area: 1 / 1;
}

.px-logo-loader__mark {
  width: 78%;
  height: 78%;
  animation: px-logo-breathe 2.4s var(--px-ease-standard) infinite;
  place-items: center;
  display: grid;
}

.px-logo-loader__mark .px-logo {
  width: 100%;
  height: 100%;
}

.px-logo-loader__glow {
  border-radius: var(--px-radius-pill);
  background: radial-gradient(circle,
    color-mix(in srgb, var(--px-brand) 40%, transparent) 0%,
    transparent 70%);
  width: 100%;
  height: 100%;
  animation: px-logo-glow 2.4s var(--px-ease-standard) infinite;
}

.px-logo-loader__orbit {
  border-radius: var(--px-radius-pill);
  border: 2px solid #0000;
  border-top-color: color-mix(in srgb, var(--px-brand) 70%, transparent);
  border-right-color: color-mix(in srgb, var(--px-brand) 25%, transparent);
  width: 100%;
  height: 100%;
  animation: 1.6s linear infinite px-spin;
}

.px-logo-loader--inline .px-logo-loader__glow {
  display: none;
}

.px-logo-loader--inline .px-logo-loader__mark {
  width: 70%;
  height: 70%;
}

.px-logo-loader--inline .px-logo-loader__orbit {
  border-width: 1.5px;
  border-top-color: currentColor;
  border-right-color: #0000;
  animation-duration: .9s;
}

.px-page-loader {
  min-height: 60dvh;
  padding: var(--px-space-8);
  place-items: center;
  display: grid;
}

@keyframes px-logo-breathe {
  0%, 100% {
    transform: scale(.94);
  }

  50% {
    transform: scale(1);
  }
}

@keyframes px-logo-glow {
  0%, 100% {
    opacity: .35;
    transform: scale(.9);
  }

  50% {
    opacity: 1;
    transform: scale(1.08);
  }
}

@keyframes px-logo-fade {
  0%, 100% {
    opacity: .55;
  }

  50% {
    opacity: 1;
  }
}

.px-icon-button {
  width: var(--px-button-height-sm);
  height: var(--px-button-height-sm);
  border: 1px solid var(--px-glass-border);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  color: var(--px-text-primary);
  cursor: pointer;
  transition: var(--px-transition-colors), var(--px-transition-transform);
  place-items: center;
  padding: 0;
  display: inline-grid;
}

.px-icon-button:hover {
  background: var(--px-option-hover-bg);
}

.px-icon-button:active {
  transform: scale(.94);
}

.px-icon-button:focus-visible {
  outline: var(--px-focus-width) solid var(--px-focus-ring);
  outline-offset: var(--px-focus-offset);
}

.px-icon-button svg {
  width: 18px;
  height: 18px;
}

.px-theme-menu {
  display: inline-flex;
  position: relative;
}

.px-menu {
  min-width: 10.5rem;
  left: auto;
  right: 0;
}

.px-menu--start {
  left: 0;
  right: auto;
}

.px-menu__item {
  width: 100%;
  font: inherit;
  font-size: var(--px-font-size-sm);
  text-align: left;
  background: none;
  border: 0;
}

.px-menu__item:hover, .px-menu__item:focus-visible {
  background: var(--px-option-hover-bg);
  outline: none;
}

.px-menu__item[aria-checked="true"] {
  font-weight: var(--px-font-weight-semibold);
}

.px-menu__item svg {
  width: 16px;
  height: 16px;
}

@media (prefers-reduced-motion: reduce) {
  .px-button:active:not(:disabled), .px-icon-button:active {
    transform: none;
  }

  .px-logo-loader__mark, .px-logo-loader__glow {
    animation: none;
    transform: none;
  }

  .px-logo-loader__orbit {
    display: none;
  }

  .px-logo-loader {
    animation: 2s ease-in-out infinite px-logo-fade;
  }

  .px-logo-loader__glow {
    opacity: .5;
  }
}

/* [project]/apps/web/app/globals.css [app-client] (css) */
*, :before, :after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  background: var(--px-color-bg);
  min-height: 100dvh;
  color: var(--px-color-text);
  font-family: var(--px-font-sans);
  font-size: var(--px-text-md);
  line-height: var(--px-leading-normal);
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

.skip-link {
  left: var(--px-space-4);
  z-index: 10;
  padding: var(--px-space-2) var(--px-space-4);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  box-shadow: var(--px-shadow-popover);
  position: absolute;
  top: -100px;
}

.skip-link:focus {
  top: var(--px-space-4);
}

.brand {
  align-items: center;
  gap: var(--px-space-2);
  color: var(--px-color-text);
  font-weight: var(--px-weight-bold);
  font-size: var(--px-text-lg);
  letter-spacing: -.02em;
  text-decoration: none;
  display: inline-flex;
}

.brand__mark {
  width: var(--px-space-8);
  height: var(--px-space-8);
}

.auth-shell {
  min-height: 100dvh;
  padding: var(--px-space-6) var(--px-space-4) var(--px-space-8);
  flex-direction: column;
  align-items: center;
  display: flex;
}

.auth-shell__brand {
  margin: var(--px-space-4) 0 var(--px-space-8);
}

.auth-shell__main {
  width: 100%;
  max-width: 440px;
}

.auth-shell__legal {
  margin-top: var(--px-space-6);
  text-align: center;
  font-size: var(--px-text-xs);
  color: var(--px-color-text-subtle);
}

.stack {
  gap: var(--px-space-4);
  flex-direction: column;
  display: flex;
}

.stack--lg {
  gap: var(--px-space-5);
}

.row-end {
  justify-content: flex-end;
  display: flex;
}

.muted {
  color: var(--px-color-text-muted);
  font-size: var(--px-text-sm);
  margin: 0;
}

.center {
  text-align: center;
}

.strong {
  color: var(--px-color-text);
  font-weight: var(--px-weight-semibold);
}

.page-title {
  font-size: var(--px-text-xl);
  line-height: var(--px-leading-tight);
  letter-spacing: -.02em;
  margin: 0;
}

.page-header {
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--px-space-3);
  margin-bottom: var(--px-space-6);
  flex-wrap: wrap;
  display: flex;
}

.panel {
  padding: var(--px-space-6);
  border: var(--px-hairline) solid var(--px-color-border);
  border-radius: var(--px-radius-lg);
  background: var(--px-color-surface);
  box-shadow: var(--px-shadow-card);
}

.panel__title {
  margin: 0 0 var(--px-space-4);
  font-size: var(--px-text-lg);
}

.grid-cards {
  gap: var(--px-space-4);
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  display: grid;
}

.badges {
  gap: var(--px-space-1);
  flex-wrap: wrap;
  display: flex;
}

.org-list {
  gap: var(--px-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.member-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.member {
  gap: var(--px-space-3);
  padding: var(--px-space-4) 0;
  border-top: var(--px-hairline) solid var(--px-color-border);
  display: grid;
}

.member:first-child {
  border-top: 0;
}

@media (min-width: 720px) {
  .member {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
    align-items: center;
  }
}

.member__name {
  font-weight: var(--px-weight-semibold);
  overflow-wrap: anywhere;
}

.member__email {
  color: var(--px-color-text-subtle);
  font-size: var(--px-text-sm);
  overflow-wrap: anywhere;
}

.member__actions {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  display: flex;
}

.role-editor {
  align-items: center;
  gap: var(--px-space-1) var(--px-space-4);
  border: 0;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  display: flex;
}

.role-editor legend {
  margin-bottom: var(--px-space-2);
  font-size: var(--px-text-sm);
  font-weight: var(--px-weight-semibold);
  color: var(--px-color-text);
  padding: 0;
}

.invite-form {
  gap: var(--px-space-4);
  display: grid;
}

@media (min-width: 720px) {
  .invite-form {
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: end;
  }
}

.status-list {
  margin: var(--px-space-6) 0 0;
  gap: var(--px-space-2);
  padding: 0;
  list-style: none;
  display: grid;
}

.status-list li {
  min-height: 44px;
  padding: 0 var(--px-space-4);
  border-radius: var(--px-radius-md);
  background: var(--px-color-surface);
  border: var(--px-hairline) solid var(--px-color-border);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.ok {
  color: var(--px-color-success);
}

.bad {
  color: var(--px-color-danger);
}

.record-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.record-item {
  gap: var(--px-space-1);
  padding: var(--px-space-3) 0;
  border-top: var(--px-hairline) solid var(--px-color-border);
  display: grid;
}

.record-item:first-child {
  border-top: 0;
}

.record-item--row {
  align-items: center;
  gap: var(--px-space-3);
  grid-template-columns: minmax(0, 1fr) auto;
}

.record-item__meta {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  align-items: baseline;
  display: flex;
}

.record-item__body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
}

.record-item a.strong, .record-item .strong {
  overflow-wrap: anywhere;
}

.form-grid {
  gap: var(--px-space-4);
  display: grid;
}

@media (min-width: 720px) {
  .form-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    align-items: end;
  }
}

.tabs {
  gap: var(--px-space-2);
  margin-bottom: var(--px-space-4);
  flex-wrap: wrap;
  display: flex;
}

.tabs a {
  min-height: 44px;
  padding: 0 var(--px-space-3);
  border-radius: var(--px-radius-md);
  color: var(--px-color-text-subtle);
  align-items: center;
  text-decoration: none;
  display: inline-flex;
}

.tabs a[aria-current="page"] {
  background: var(--px-color-surface-muted);
  color: var(--px-color-text);
  font-weight: var(--px-weight-semibold);
}

.details {
  gap: var(--px-space-2) var(--px-space-4);
  margin: 0 0 var(--px-space-4);
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  display: grid;
}

.details dt {
  color: var(--px-color-text-subtle);
}

.details dd {
  overflow-wrap: anywhere;
  margin: 0;
}

html {
  background: var(--px-atmosphere-base);
}

body {
  background: var(--px-atmosphere);
  font-family: var(--px-font-sans);
  color: var(--px-text-primary);
  font-feature-settings: "cv11", "ss01";
  text-rendering: optimizelegibility;
  background-attachment: fixed;
}

a:hover {
  color: var(--px-text-link-hover);
}

.skip-link {
  z-index: var(--px-z-skipLink);
}

.brand {
  gap: var(--px-space-2);
  font-family: var(--px-font-display);
  font-weight: var(--px-font-weight-regular);
  font-size: var(--px-font-size-xl);
  letter-spacing: var(--px-letter-spacing-tight);
}

.auth-shell {
  padding: var(--px-space-4) var(--px-space-4) var(--px-space-8);
}

.auth-shell__top {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  width: 100%;
  max-width: 1080px;
  margin-bottom: clamp(var(--px-space-8), 8vh, var(--px-space-16));
  display: flex;
}

.auth-shell__actions, .auth-shell__who {
  align-items: center;
  gap: var(--px-space-2);
  min-width: 0;
  display: flex;
}

.auth-shell__email {
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 14rem;
  color: var(--px-text-secondary);
  font-size: var(--px-font-size-sm);
  display: none;
  overflow: hidden;
}

@media (min-width: 720px) {
  .auth-shell__email {
    display: inline;
  }
}

.auth-shell__main {
  max-width: 460px;
}

.auth-shell__legal {
  color: var(--px-text-secondary);
}

.page-title {
  font-family: var(--px-font-display);
  font-weight: var(--px-font-weight-regular);
  font-size: var(--px-font-size-display-sm);
  letter-spacing: var(--px-letter-spacing-tight);
}

.panel, .status-list li {
  border: var(--px-hairline) solid var(--px-glass-border);
  background: var(--px-glass-fill);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
}

.panel {
  border-radius: var(--px-radius-xl);
}

.panel__title {
  font-family: var(--px-font-display);
  font-weight: var(--px-font-weight-regular);
  font-size: var(--px-font-size-xl);
}

.tabs a[aria-current="page"] {
  background: var(--px-action-solid);
  color: var(--px-action-on-solid);
  border-radius: var(--px-radius-pill);
}

.account-grid {
  gap: var(--px-space-5);
  max-width: 760px;
  display: grid;
}

.method-list, .session-list {
  gap: var(--px-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.session-item, .method-item {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  padding: var(--px-space-3) var(--px-space-4);
  border-radius: var(--px-radius-lg);
  background: var(--px-action-soft);
  border: var(--px-hairline) solid var(--px-border-subtle);
  flex-wrap: wrap;
  display: flex;
}

.session-item__meta {
  color: var(--px-text-secondary);
  font-size: var(--px-font-size-sm);
}

.row-actions {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  display: flex;
}

.wizard {
  gap: var(--px-space-5);
  flex-direction: column;
  display: flex;
}

.wizard-actions {
  gap: var(--px-space-3);
  display: flex;
}

.wizard-actions > :last-child {
  flex: 1;
}

.wizard-status {
  min-height: 1.25rem;
  margin: calc(-1 * var(--px-space-2)) 0 0;
  color: var(--px-text-tertiary);
  font-size: var(--px-font-size-xs);
  text-align: center;
}

.flag {
  aspect-ratio: 3 / 2;
  border-radius: var(--px-radius-xs);
  object-fit: cover;
  width: 22px;
  height: auto;
  box-shadow: 0 0 0 1px var(--px-border-default);
  display: block;
}

.brand-mark {
  width: 56px;
  height: 56px;
  filter: drop-shadow(0 4px 10px color-mix(in srgb, var(--px-brand) 35%, transparent));
}

.auth-shell__top--controls {
  margin-bottom: clamp(var(--px-space-4), 4vh, var(--px-space-10));
  justify-content: space-between;
}

.auth-shell__top--controls > :only-child {
  margin-left: auto;
}

@media (max-width: 599px) {
  .auth-shell:has(.px-auth-card--compact) .auth-shell__top--controls {
    margin-bottom: var(--px-space-3);
  }
}

.brand-banner {
  align-items: center;
  gap: var(--px-space-3);
  margin-bottom: var(--px-space-5);
  padding: var(--px-space-4);
  border-radius: var(--px-card-radius);
  box-shadow: var(--px-glass-shadow);
  display: flex;
}

.auth-shell .brand-banner {
  margin-bottom: 0;
}

.brand-banner__logo {
  border-radius: var(--px-radius-md);
  background: var(--px-surface-solid);
  flex: none;
  place-items: center;
  width: 3rem;
  height: 3rem;
  display: grid;
  overflow: hidden;
}

.brand-banner__logo img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.brand-banner__logo .brand-banner__default {
  width: 80%;
  height: 80%;
}

.brand-banner__name {
  min-width: 0;
  font-family: var(--px-font-display);
  font-size: var(--px-font-size-xl);
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
  overflow: hidden;
}

.brand-banner__accent {
  padding: var(--px-space-0-5) var(--px-space-3);
  border-radius: var(--px-radius-full);
  font-size: var(--px-font-size-xs);
  font-weight: var(--px-font-weight-semibold);
  flex: none;
}

.auth-shell__main:has(.shell-setup--wide) {
  max-width: 760px;
}

.shell-setup__loading {
  align-items: center;
  gap: var(--px-space-5);
  padding: var(--px-space-6) 0 var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.shell-summary {
  gap: var(--px-space-4);
  margin-bottom: var(--px-space-5);
  flex-direction: column;
  display: flex;
}

.shell-summary__text {
  color: var(--px-text-primary);
  margin: 0;
  line-height: 1.6;
}

.shell-summary__industry {
  gap: var(--px-space-1);
  flex-direction: column;
  margin: 0;
  display: flex;
}

.shell-summary__label {
  color: var(--px-text-tertiary);
  font-size: var(--px-font-size-xs);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.shell-summary__name {
  color: var(--px-text-primary);
  font-weight: var(--px-font-weight-medium, 500);
}

.shell-summary__isic {
  font-size: var(--px-font-size-sm);
}

.shell-candidates__industry {
  margin: var(--px-space-1) 0 0;
  font-size: var(--px-font-size-xs);
}

.shell-candidates {
  gap: var(--px-space-2);
  margin-bottom: var(--px-space-5);
  flex-direction: column;
  display: flex;
}

.shell-preview {
  gap: var(--px-space-5);
  margin-bottom: var(--px-space-5);
  text-align: left;
  flex-direction: column;
  display: flex;
}

.shell-preview__title {
  align-items: center;
  gap: var(--px-space-2);
  margin: 0 0 var(--px-space-2);
  font-size: var(--px-font-size-sm);
  font-weight: var(--px-font-weight-semibold, 600);
  letter-spacing: .02em;
  display: flex;
}

.shell-preview__hint {
  margin: 0 0 var(--px-space-2);
  color: var(--px-text-tertiary);
  font-size: var(--px-font-size-xs);
}

.shell-chips {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.shell-chip {
  padding: var(--px-space-1) var(--px-space-2-5);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill);
  color: var(--px-text-primary);
  font-size: var(--px-font-size-xs);
}

.shell-chip--locked {
  color: var(--px-text-secondary);
}

.shell-chip--planned {
  opacity: .7;
}

.shell-chip--new {
  border-color: color-mix(in srgb, var(--px-brand) 45%, transparent);
}

.shell-chip__note {
  color: var(--px-text-tertiary);
}

.shell-portals {
  gap: var(--px-space-3);
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  display: grid;
}

.shell-portal {
  padding: var(--px-space-3) var(--px-space-4);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-lg);
  background: var(--px-glass-fill);
}

.shell-portal__name {
  margin: 0 0 var(--px-space-2);
  font-size: var(--px-font-size-sm);
}

.shell-portal__nav {
  padding-left: var(--px-space-4);
  color: var(--px-text-secondary);
  font-size: var(--px-font-size-xs);
  margin: 0;
  line-height: 1.6;
}

.shell-space {
  margin-bottom: var(--px-space-5);
}

.start-screen__base {
  font-size: var(--px-text-sm);
  margin: 0;
}

.country-chip-row {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2);
  min-height: 44px;
  display: flex;
}

.country-chip {
  align-items: center;
  gap: var(--px-space-2);
  min-height: var(--px-space-10);
  padding: 0 var(--px-space-4);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill);
  font-weight: var(--px-weight-semibold);
  display: inline-flex;
}

.start-workspace {
  gap: var(--px-space-4);
  justify-items: start;
  display: grid;
}

.chat-suggestion, .chat-chip {
  min-height: 44px;
  padding: var(--px-space-2) var(--px-space-4);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-pill);
  background: var(--px-glass-fill);
  box-shadow: var(--px-glass-shadow);
  color: var(--px-color-text);
  font: inherit;
  font-size: var(--px-text-sm);
  font-weight: var(--px-weight-semibold);
  cursor: pointer;
  -webkit-backdrop-filter: blur(var(--px-blur-md));
  backdrop-filter: blur(var(--px-blur-md));
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-decoration: none;
  display: inline-flex;
}

.chat-suggestion:hover, .chat-chip:hover {
  background: var(--px-surface-glass-hover);
}

.chat-chip small {
  color: var(--px-color-text-muted);
  font-weight: 400;
}

.chat-msg {
  gap: var(--px-space-2);
  align-items: flex-start;
  min-width: 0;
  display: flex;
}

.chat-msg--user {
  justify-content: flex-end;
}

.chat-msg__avatar {
  margin-top: var(--px-space-1-5);
  flex-shrink: 0;
}

.chat-msg__body {
  gap: var(--px-space-3);
  min-width: 0;
  max-width: 100%;
  display: grid;
}

.chat-msg--assistant .chat-msg__body {
  padding: var(--px-space-3) var(--px-space-4);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-xs) var(--px-radius-lg) var(--px-radius-lg) var(--px-radius-lg);
  background: var(--px-glass-fill);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-md));
  backdrop-filter: blur(var(--px-blur-md));
  flex: 1;
}

.chat-user-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
}

.chat-md > :first-child {
  margin-top: 0;
}

.chat-md > :last-child {
  margin-bottom: 0;
}

.chat-md p, .chat-md ul, .chat-md ol {
  margin: 0 0 var(--px-space-2);
  overflow-wrap: anywhere;
}

.chat-md ul, .chat-md ol {
  padding-left: 1.25rem;
}

.chat-md__h {
  font-weight: var(--px-weight-semibold);
}

.chat-md code {
  padding: var(--px-space-px) var(--px-space-1);
  border-radius: var(--px-radius-xs);
  background: var(--px-color-surface-muted);
  font-family: var(--px-font-mono);
  font-size: .9em;
}

.chat-thinking, .chat-activity {
  align-items: center;
  gap: var(--px-space-2);
  color: var(--px-color-text-muted);
  font-size: var(--px-text-sm);
  display: inline-flex;
}

.chat-view {
  gap: var(--px-space-2);
  padding: var(--px-space-3);
  border: var(--px-hairline) solid var(--px-color-border);
  border-radius: var(--px-radius-md);
  background: var(--px-surface-glass-strong);
  min-width: 0;
  display: grid;
}

.chat-view__title {
  font-weight: var(--px-weight-semibold);
  font-size: var(--px-text-sm);
  margin: 0;
}

.chat-view__more {
  font-size: var(--px-text-sm);
  margin: 0;
}

.chat-table table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--px-text-sm);
}

.chat-table th, .chat-table td {
  padding: var(--px-space-2);
  border-bottom: var(--px-hairline) solid var(--px-color-border);
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.chat-table thead th {
  color: var(--px-color-text-muted);
  font-weight: var(--px-weight-semibold);
}

@media (max-width: 599px) {
  .chat-table thead {
    width: var(--px-space-px);
    height: var(--px-space-px);
    clip: rect(0 0 0 0);
    position: absolute;
    overflow: hidden;
  }

  .chat-table table, .chat-table tbody, .chat-table tr, .chat-table th, .chat-table td {
    display: block;
  }

  .chat-table tr {
    padding: var(--px-space-2) 0;
    border-bottom: var(--px-hairline) solid var(--px-color-border);
  }

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

  .chat-table th, .chat-table td {
    padding: var(--px-space-0-5) 0;
    border: 0;
  }

  .chat-table tbody th a {
    min-height: var(--px-space-8);
    font-size: var(--px-text-md);
    align-items: center;
    display: inline-flex;
  }

  .chat-table td:before {
    content: attr(data-label) " · ";
    color: var(--px-color-text-subtle);
  }
}

.chat-card__sub {
  font-size: var(--px-text-sm);
  margin: 0;
}

.chat-card__fields {
  gap: var(--px-space-1);
  font-size: var(--px-text-sm);
  margin: 0;
  display: grid;
}

.chat-card__fields div {
  gap: var(--px-space-2);
  display: flex;
}

.chat-card__fields dt {
  min-width: 6rem;
  color: var(--px-color-text-muted);
}

.chat-card__fields dd {
  overflow-wrap: anywhere;
  margin: 0;
}

.chat-chips ul {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.chat-chip {
  border-radius: var(--px-radius-md);
  box-shadow: none;
}

.chat-metric {
  align-items: baseline;
  gap: var(--px-space-2);
  display: flex;
}

.chat-metric__value {
  font-family: var(--px-font-display);
  font-size: var(--px-text-32);
  line-height: 1;
}

.onb-shell {
  --onb-ink: var(--px-text-on-brand);
  --onb-ink-soft: var(--px-text-tertiary);
  --onb-glass: var(--px-fill-pressed);
  --onb-glass-strong: var(--px-surface-tile);
  --onb-line: var(--px-border-strong);
  --onb-cta-bg: var(--px-surface-solid);
  --onb-cta-ink: var(--px-text-link);
  min-height: 100dvh;
  color: var(--onb-ink);
  position: relative;
}

html[data-sky="dark"] .onb-shell {
  --onb-ink: var(--px-text-link);
  --onb-ink-soft: var(--px-text-link);
  --onb-glass: var(--px-surface-tile);
  --onb-glass-strong: var(--px-surface-card);
  --onb-line: var(--px-card-border);
  --onb-cta-bg: var(--px-brand);
  --onb-cta-ink: var(--px-text-on-brand);
}

.onb-shell__main {
  z-index: 1;
  justify-content: center;
  min-height: 100dvh;
  display: flex;
  position: relative;
}

.onb {
  width: 100%;
  max-width: 560px;
  min-height: 100dvh;
  padding: max(env(safe-area-inset-top), var(--px-space-4)) var(--px-space-6) max(env(safe-area-inset-bottom), var(--px-space-6));
  flex-direction: column;
  transition: opacity .45s, transform .45s;
  display: flex;
}

.onb--leaving {
  opacity: 0;
  transform: scale(.985);
}

.onb__top {
  min-height: var(--px-space-12);
  grid-template-columns: 44px 1fr 44px;
  align-items: center;
  display: grid;
}

.onb__top > :last-child {
  justify-self: end;
}

.onb__back, .onb__quiet {
  border-radius: var(--px-radius-pill);
  min-width: 44px;
  min-height: 44px;
  color: var(--onb-ink-soft);
  font: inherit;
  font-size: var(--px-text-14);
  cursor: pointer;
  white-space: nowrap;
  background: none;
  border: 0;
  place-items: center;
  display: inline-grid;
}

.onb__back:hover, .onb__quiet:hover {
  color: var(--onb-ink);
  background: var(--onb-glass);
}

.onb__back:focus-visible, .onb__quiet:focus-visible, .onb__chip:focus-visible, .onb__country-chip:focus-visible {
  outline: var(--px-stroke-2) solid var(--onb-ink);
  outline-offset: var(--px-stroke-2);
}

.onb__dots {
  justify-self: center;
  gap: var(--px-space-1-5);
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.onb__dots li {
  width: 18px;
  height: var(--px-space-1);
  border-radius: var(--px-radius-xs);
  background: var(--onb-line);
  opacity: .55;
  transition: background .3s, opacity .3s, width .3s;
}

.onb__dots li.is-on {
  background: var(--onb-ink);
  opacity: 1;
  width: 26px;
}

.onb__stage {
  flex: 1;
  animation: .52s cubic-bezier(.2, .7, .2, 1) both onb-in;
  display: flex;
}

.onb__screen {
  gap: var(--px-space-5);
  flex-direction: column;
  flex: 1;
  padding-top: 14vh;
  display: flex;
}

.onb__screen--setup {
  text-align: center;
  justify-content: center;
  align-items: center;
  gap: var(--px-space-6);
  padding-top: 0;
}

.onb__title {
  font-family: var(--px-font-display);
  font-weight: 400;
  font-size: var(--px-text-48);
  letter-spacing: -.01em;
  text-wrap: balance;
  outline: none;
  margin: 0;
  line-height: 1.04;
}

.onb__title--hero {
  font-size: var(--px-text-48);
  opacity: 0;
  transition: opacity .6s;
}

.onb__title--hero.is-ready {
  opacity: 1;
}

.onb__lead {
  max-width: 30rem;
  font-size: var(--px-text-18);
  color: var(--onb-ink-soft);
  margin: 0;
  line-height: 1.5;
}

.onb__strong {
  color: var(--onb-ink);
  font-weight: 600;
}

.onb .px-field {
  gap: var(--px-space-2);
}

.onb .px-input.onb__input, .onb textarea.onb__area {
  height: auto;
  min-height: var(--px-space-16);
  padding: var(--px-space-4) var(--px-space-5);
  border-radius: var(--px-radius-xl);
  border: var(--px-hairline) solid var(--onb-line);
  background: var(--onb-glass);
  color: var(--onb-ink);
  font-size: var(--px-text-20);
  box-shadow: var(--px-shadow-card);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(1.4);
  backdrop-filter: blur(var(--px-blur-surface)) saturate(1.4);
  resize: none;
  line-height: 1.35;
}

.onb .px-input.onb__input::placeholder, .onb textarea.onb__area::placeholder {
  color: var(--onb-ink-soft);
  opacity: .75;
}

.onb .px-input.onb__input:focus, .onb textarea.onb__area:focus {
  border-color: var(--onb-ink);
  background: var(--onb-glass-strong);
  outline: none;
}

.onb .px-field__error, .onb .px-field__hint, .onb [id$="-counter"] {
  color: var(--onb-ink);
}

.onb__chips {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.onb__chip, .onb__country-chip {
  align-items: center;
  gap: var(--px-space-2);
  min-height: var(--px-space-10);
  padding: var(--px-space-2) var(--px-space-3-5);
  border: var(--px-hairline) solid var(--onb-line);
  border-radius: var(--px-radius-pill);
  background: var(--onb-glass);
  color: var(--onb-ink);
  font: inherit;
  font-size: var(--px-text-14);
  text-align: left;
  cursor: pointer;
  -webkit-backdrop-filter: blur(var(--px-blur-surface));
  backdrop-filter: blur(var(--px-blur-surface));
  transition: background .2s, transform .2s;
  display: inline-flex;
}

.onb__chip:hover, .onb__country-chip:hover {
  background: var(--onb-glass-strong);
}

.onb__chip:active, .onb__country-chip:active {
  transform: scale(.98);
}

.onb__country-change {
  color: var(--onb-ink-soft);
  font-size: var(--px-text-13);
  padding-left: var(--px-space-1-5);
  border-left: var(--px-hairline) solid var(--onb-line);
}

.onb__country .px-input {
  color: var(--px-text-primary);
}

.onb__actions {
  padding-top: var(--px-space-6);
  margin-top: auto;
}

.onb .px-button.onb__cta {
  border-radius: var(--px-radius-pill);
  background: var(--onb-cta-bg);
  width: 100%;
  min-height: 56px;
  color: var(--onb-cta-ink);
  font-size: var(--px-text-16);
  box-shadow: var(--px-shadow-pop);
  border: 0;
}

.onb .px-button.onb__cta:disabled {
  opacity: .45;
  box-shadow: none;
}

.onb__setup-line {
  font-family: var(--px-font-display);
  font-size: var(--px-text-28);
  margin: 0;
  line-height: 1.2;
  animation: .5s both onb-in;
}

@media (min-width: 768px) {
  .onb {
    padding-inline: var(--px-space-8);
  }

  .onb__screen {
    padding-top: 18vh;
  }

  .onb__actions {
    margin-top: var(--px-space-3);
  }

  .onb .px-button.onb__cta {
    width: auto;
    min-width: 200px;
    padding-inline: var(--px-space-8);
  }
}

@keyframes onb-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .onb, .onb__stage, .onb__setup-line, .onb__title--hero {
    transition: none;
    animation: none;
  }
}

.shell {
  z-index: 1;
  min-height: 100dvh;
  position: relative;
}

.sb {
  z-index: var(--px-z-modal);
  gap: var(--px-space-1);
  width: min(300px, 86vw);
  padding: calc(var(--px-space-1-5) + env(safe-area-inset-top)) var(--px-space-2) calc(var(--px-space-2) + env(safe-area-inset-bottom));
  border-right: var(--px-hairline) solid var(--px-glass-border);
  background: var(--px-surface-popover);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  visibility: hidden;
  transition: transform .24s var(--px-ease-standard), width .2s var(--px-ease-standard), visibility 0s linear .24s;
  flex-direction: column;
  display: flex;
  position: fixed;
  inset: 0 auto 0 0;
  overflow: hidden;
  transform: translateX(-102%);
  container: sb / inline-size;
}

.shell[data-open] .sb {
  visibility: visible;
  box-shadow: var(--px-elevation-4);
  transition: transform .24s var(--px-ease-standard), width .2s var(--px-ease-standard);
  transform: none;
}

.shell__scrim {
  z-index: var(--px-z-overlay);
  background: var(--px-overlay);
  border: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

.shell__main {
  min-width: 0;
  min-height: 100dvh;
  transition: padding-left .2s var(--px-ease-standard);
  flex-direction: column;
  display: flex;
}

@media (min-width: 768px) {
  .sb {
    width: var(--px-space-16);
    visibility: visible;
    background: var(--px-glass-fill);
    transform: none;
  }

  .shell[data-open] .sb {
    background: var(--px-surface-popover);
    width: 280px;
  }

  .shell__main {
    padding-left: var(--px-space-16);
  }
}

@media (min-width: 1024px) {
  .sb {
    width: 260px;
    z-index: var(--px-z-sticky);
  }

  .shell[data-collapsed] .sb {
    width: var(--px-space-16);
  }

  .shell__main {
    padding-left: 260px;
  }

  .shell[data-collapsed] .shell__main {
    padding-left: var(--px-space-16);
  }

  .shell__scrim {
    display: none;
  }
}

.sb__top {
  min-height: var(--px-space-12);
  padding: 0 0 0 var(--px-space-1-5);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.sb__brand {
  align-items: center;
  gap: var(--px-space-2);
  min-width: 0;
  min-height: 44px;
  color: var(--px-text-primary);
  font-family: var(--px-font-display);
  font-size: var(--px-text-20);
  letter-spacing: var(--px-letter-spacing-tight);
  white-space: nowrap;
  text-decoration: none;
  display: inline-flex;
}

.sb__icon {
  border-radius: var(--px-radius-tile-lg);
  width: 44px;
  height: 44px;
  color: var(--px-text-secondary);
  cursor: pointer;
  background: none;
  border: 0;
  flex-shrink: 0;
  place-items: center;
  display: inline-grid;
}

.sb__icon:hover {
  background: var(--px-action-soft);
  color: var(--px-text-primary);
}

.sb__icon:focus-visible, .sb__row:focus-visible, .sb__chat:focus-visible, .sb__account:focus-visible, .sb__brand:focus-visible, .chat-sugg:focus-visible, .chat-composer__btn:focus-visible, .shell-menu__item:focus-visible, .shell-menu__theme:focus-visible {
  outline: var(--px-stroke-2) solid var(--px-focus-ring);
  outline-offset: var(--px-hairline);
}

.sb__actions {
  gap: var(--px-space-1);
  grid-template-columns: minmax(0, 1fr);
  display: grid;
}

.sb__row {
  align-items: center;
  gap: var(--px-space-3);
  width: 100%;
  min-height: 44px;
  padding: 0 var(--px-space-3);
  border-radius: var(--px-radius-tile-lg);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-14);
  white-space: nowrap;
  cursor: pointer;
  background: none;
  border: 0;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.sb__row svg {
  color: var(--px-text-secondary);
  flex-shrink: 0;
}

.sb__row:hover {
  background: var(--px-action-soft);
  color: var(--px-text-primary);
}

.sb__row[aria-current="page"] {
  background: var(--px-action-soft);
  font-weight: 600;
}

.sb__row[aria-current="page"] svg {
  color: var(--px-text-primary);
}

.sb__row--railsearch {
  display: none;
}

.sb__search {
  align-items: center;
  gap: var(--px-space-2);
  min-width: 0;
  min-height: var(--px-space-10);
  padding: 0 var(--px-space-3);
  border: var(--px-hairline) solid var(--px-border-subtle);
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-surface-glass);
  color: var(--px-text-secondary);
  display: flex;
}

.sb__search:focus-within {
  outline: var(--px-stroke-2) solid var(--px-focus-ring);
  outline-offset: var(--px-hairline);
}

.sb__search-input {
  width: 100%;
  min-width: 0;
  min-height: 38px;
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-16);
  background: none;
  border: 0;
  outline: none;
  flex: 1;
}

@media (min-width: 768px) {
  .sb__search-input {
    font-size: var(--px-text-14);
  }
}

.sb__search-input::placeholder {
  color: var(--px-text-secondary);
}

.sb__nav {
  gap: var(--px-space-0-5);
  padding: var(--px-space-2) 0;
  border-bottom: var(--px-hairline) solid var(--px-border-subtle);
  display: grid;
}

.sb__recents {
  overscroll-behavior: contain;
  min-height: 0;
  padding: var(--px-space-1) 0 var(--px-space-2);
  scrollbar-width: thin;
  flex: 1;
  overflow-y: auto;
}

.sb__group-title {
  margin: var(--px-space-3) var(--px-space-3) var(--px-space-1);
  color: var(--px-text-secondary);
  font-size: var(--px-text-12);
  letter-spacing: .02em;
  font-weight: 600;
}

.sb__chats {
  gap: var(--px-space-px);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.sb__chat {
  min-height: var(--px-space-10);
  padding: 0 var(--px-space-3);
  border-radius: var(--px-radius-tile);
  color: var(--px-text-primary);
  font-size: var(--px-text-14);
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 40px;
  text-decoration: none;
  display: block;
  overflow: hidden;
}

@media (pointer: coarse) {
  .sb__chat {
    min-height: 44px;
    line-height: 44px;
  }
}

.sb__chat:hover {
  background: var(--px-action-soft);
  color: var(--px-text-primary);
}

.sb__chat[aria-current="page"] {
  background: var(--px-action-soft);
  font-weight: 600;
}

.sb__empty {
  margin: var(--px-space-3);
  color: var(--px-text-secondary);
  font-size: var(--px-text-13);
}

.sb__foot {
  padding-top: var(--px-space-1-5);
  border-top: var(--px-hairline) solid var(--px-border-subtle);
}

.sb__account {
  align-items: center;
  gap: var(--px-space-2-5);
  width: 100%;
  min-height: 52px;
  padding: var(--px-space-1-5) var(--px-space-2);
  border-radius: var(--px-radius-tile-lg);
  color: var(--px-text-primary);
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  display: flex;
}

.sb__account:hover, .sb__account[aria-expanded="true"] {
  background: var(--px-action-soft);
}

.sb__avatar {
  width: var(--px-space-8);
  height: var(--px-space-8);
  background: var(--px-action-solid);
  color: var(--px-action-on-solid);
  font-size: var(--px-text-12);
  border-radius: 50%;
  flex-shrink: 0;
  place-items: center;
  font-weight: 600;
  display: grid;
}

.sb__who {
  flex: 1;
  min-width: 0;
  line-height: 1.25;
  display: grid;
}

.sb__who-name, .sb__who-role {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.sb__who-name {
  font-size: var(--px-text-14);
  font-weight: 600;
}

.sb__who-role {
  color: var(--px-text-secondary);
  font-size: var(--px-text-12);
  text-transform: capitalize;
}

.sb__chevrons {
  color: var(--px-text-secondary);
  display: inline-flex;
}

@container sb (max-width: 120px) {
  .sb__brand, .sb__label, .sb__search {
    display: none;
  }

  .sb__top, .sb__row {
    justify-content: center;
    padding: 0;
  }

  .sb__row--railsearch {
    display: flex;
  }

  .sb__recents {
    visibility: hidden;
  }

  .sb__account {
    padding: var(--px-space-1-5) 0;
    justify-content: center;
  }
}

.shell-menu {
  position: relative;
}

.shell-menu__pop {
  z-index: var(--px-z-popover);
  gap: var(--px-space-0-5);
  min-width: 248px;
  max-width: min(320px, calc(100vw - var(--px-space-6)));
  max-height: 72dvh;
  padding: var(--px-space-1-5);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-panel);
  background: var(--px-surface-popover);
  box-shadow: var(--px-popover-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-lg));
  backdrop-filter: blur(var(--px-blur-lg));
  display: grid;
  position: absolute;
  overflow-y: auto;
}

.shell-menu__pop--bottom-end {
  top: calc(100% + var(--px-space-1-5));
  right: 0;
}

.shell-menu__pop--bottom-start {
  top: calc(100% + var(--px-space-1-5));
  left: 0;
}

.shell-menu__pop--top-start {
  bottom: calc(100% + var(--px-space-1-5));
  left: 0;
}

.shell-menu__pop--top-end {
  bottom: calc(100% + var(--px-space-1-5));
  right: 0;
}

.shell-menu__head {
  padding: var(--px-space-2) var(--px-space-2-5) var(--px-space-2-5);
  line-height: 1.3;
  display: grid;
}

.shell-menu__name {
  font-weight: 600;
  font-size: var(--px-text-14);
}

.shell-menu__email {
  color: var(--px-text-secondary);
  font-size: var(--px-text-13);
  text-overflow: ellipsis;
  overflow: hidden;
}

.shell-menu__group {
  gap: var(--px-space-0-5);
  padding-top: var(--px-space-1);
  border-top: var(--px-hairline) solid var(--px-border-subtle);
  display: grid;
}

.shell-menu__label {
  margin: var(--px-space-1-5) var(--px-space-2-5) var(--px-space-0-5);
  color: var(--px-text-secondary);
  font-size: var(--px-text-12);
  font-weight: 600;
}

.shell-menu__item {
  align-items: center;
  gap: var(--px-space-2-5);
  width: 100%;
  min-height: 44px;
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-tile);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-14);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  text-decoration: none;
  display: flex;
}

.shell-menu__item svg {
  color: var(--px-text-secondary);
  flex-shrink: 0;
}

.shell-menu__item:hover, .shell-menu__item:focus-visible {
  background: var(--px-action-soft);
  color: var(--px-text-primary);
}

.shell-menu__item--danger, .shell-menu__item--danger svg {
  color: var(--px-color-danger);
}

.shell-menu__co {
  border-radius: var(--px-radius-md);
  background: var(--px-action-soft);
  width: 28px;
  height: 28px;
  font-size: var(--px-text-11);
  flex-shrink: 0;
  place-items: center;
  font-weight: 600;
  display: grid;
}

.shell-menu__grow {
  flex: 1;
  min-width: 0;
  line-height: 1.25;
  display: grid;
}

.shell-menu__co-name {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.shell-menu__co-role {
  color: var(--px-text-secondary);
  font-size: var(--px-text-12);
  text-transform: capitalize;
}

.shell-menu__themes {
  gap: var(--px-space-1);
  padding: var(--px-space-2) var(--px-space-1-5) var(--px-space-1-5);
  display: flex;
}

.shell-menu__theme {
  border: var(--px-hairline) solid var(--px-border-subtle);
  border-radius: var(--px-radius-pill);
  min-height: 36px;
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-13);
  cursor: pointer;
  background: none;
  flex: 1;
}

.shell-menu__theme[aria-checked="true"] {
  background: var(--px-action-solid);
  color: var(--px-action-on-solid);
  border-color: #0000;
}

.shell-head {
  z-index: var(--px-z-header);
  align-items: center;
  gap: var(--px-space-1);
  min-height: calc(52px + env(safe-area-inset-top));
  padding: env(safe-area-inset-top) var(--px-space-1) 0;
  border-bottom: var(--px-hairline) solid var(--px-border-subtle);
  background: color-mix(in oklab, var(--px-atmosphere-base) 70%, transparent);
  -webkit-backdrop-filter: blur(var(--px-blur-lg)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-blur-lg)) saturate(var(--px-glass-saturate));
  grid-template-columns: 44px minmax(0, 1fr) auto;
  display: grid;
  position: sticky;
  top: 0;
}

.shell-head__title {
  text-align: center;
  min-width: 0;
}

.shell-head__h1, .shell-head__name {
  color: var(--px-text-primary);
  font-family: var(--px-font-sans);
  font-size: var(--px-text-16);
  text-overflow: ellipsis;
  white-space: nowrap;
  margin: 0;
  font-weight: 600;
  line-height: 1.3;
  display: block;
  overflow: hidden;
}

.shell-head__actions {
  justify-content: flex-end;
  align-items: center;
  min-width: 44px;
  display: flex;
}

.shell-head__rename {
  width: 100%;
  min-height: 36px;
  padding: 0 var(--px-space-2-5);
  border: var(--px-hairline) solid var(--px-focus-ring);
  border-radius: var(--px-radius-tile);
  background: var(--px-surface-popover);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-16);
  outline: none;
  font-weight: 600;
}

@media (min-width: 768px) {
  .shell-head {
    min-height: var(--px-space-12);
    padding: 0 var(--px-space-3) 0 var(--px-space-6);
    -webkit-backdrop-filter: blur(var(--px-blur-md));
    backdrop-filter: blur(var(--px-blur-md));
    background: none;
    border-bottom-color: #0000;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .shell-head__menu, .shell-head__new {
    display: none;
  }

  .shell-head__title {
    text-align: left;
  }

  .shell-head__h1 {
    font-size: var(--px-text-14);
  }

  .shell-head--page {
    display: none;
  }
}

.shell-content {
  outline: none;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
  position: relative;
}

.shell-content--page {
  width: 100%;
  max-width: 1080px;
  padding: var(--px-space-5) var(--px-space-4) var(--px-space-12);
  margin: 0 auto;
  display: block;
}

@media (min-width: 768px) {
  .shell-content--page {
    padding: var(--px-space-10) var(--px-space-8) var(--px-space-16);
  }
}

.chat {
  flex-direction: column;
  flex: 1;
  min-height: 0;
  display: flex;
}

.chat-main {
  width: 100%;
  min-width: 0;
  max-width: 760px;
  padding: 0 var(--px-space-4);
  flex-direction: column;
  flex: 1;
  margin: 0 auto;
  display: flex;
}

.chat-thread {
  align-content: start;
  gap: var(--px-space-5);
  padding: var(--px-space-5) 0 var(--px-space-6);
  flex: 1;
  margin: 0;
  list-style: none;
  display: grid;
}

.chat--empty .chat-thread {
  display: none;
}

.chat-loading {
  padding: var(--px-space-16) 0;
  place-items: center;
  display: grid;
}

.chat-hello {
  justify-content: center;
  align-items: center;
  gap: var(--px-space-3);
  padding: var(--px-space-8) 0 var(--px-space-6);
  text-align: center;
  flex-direction: column;
  flex: 1;
  display: flex;
}

.chat-hello__mark {
  width: var(--px-space-12);
  height: var(--px-space-12);
}

.chat-hello__title {
  margin: var(--px-space-1) 0 0;
  font-family: var(--px-font-display);
  font-size: var(--px-text-40);
  letter-spacing: var(--px-letter-spacing-tight);
  font-weight: 400;
  line-height: 1.1;
}

.chat-hello__lead {
  max-width: 34rem;
  color: var(--px-text-secondary);
  font-size: var(--px-text-16);
  margin: 0;
  line-height: 1.5;
}

.chat-hello__lead strong {
  color: var(--px-text-primary);
}

.chat-chips-row {
  gap: var(--px-space-2);
  width: 100%;
  margin: var(--px-space-4) 0 0;
  grid-template-columns: minmax(0, 1fr);
  padding: 0;
  list-style: none;
  display: grid;
}

@media (min-width: 600px) {
  .chat-chips-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.chat-sugg {
  align-content: center;
  gap: var(--px-space-0-5);
  width: 100%;
  height: 100%;
  min-height: 56px;
  padding: var(--px-space-3) var(--px-space-4);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-panel);
  background: var(--px-glass-fill);
  box-shadow: var(--px-glass-shadow);
  color: var(--px-text-primary);
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-backdrop-filter: blur(var(--px-blur-md));
  backdrop-filter: blur(var(--px-blur-md));
  text-decoration: none;
  transition: background .2s;
  display: grid;
}

.chat-sugg:hover {
  background: var(--px-surface-glass-hover);
  color: var(--px-text-primary);
}

.chat-sugg__title {
  font-size: var(--px-text-14);
  font-weight: 600;
}

.chat-sugg__hint {
  color: var(--px-text-secondary);
  font-size: var(--px-text-13);
}

.chat-dock {
  z-index: var(--px-z-sticky);
  margin: 0 calc(var(--px-space-2) * -1);
  padding: var(--px-space-2) var(--px-space-2) calc(var(--px-space-2-5) + env(safe-area-inset-bottom));
  position: sticky;
  bottom: 0;
}

.chat-error {
  padding-bottom: var(--px-space-2);
}

.chat-composer {
  align-items: flex-end;
  gap: var(--px-space-2);
  padding: var(--px-space-1-5) var(--px-space-1-5) var(--px-space-1-5) var(--px-space-5);
  border: var(--px-hairline) solid var(--px-glass-border);
  border-radius: var(--px-radius-2xl);
  background: var(--px-surface-glass-strong);
  box-shadow: var(--px-glass-shadow);
  -webkit-backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  backdrop-filter: blur(var(--px-glass-blur)) saturate(var(--px-glass-saturate));
  display: flex;
}

.chat-composer:focus-within {
  border-color: var(--px-focus-ring);
}

.chat-composer .px-field {
  flex: 1;
  min-width: 0;
}

.chat-composer textarea.px-input.chat-composer__input, .chat-composer textarea.px-input.chat-composer__input:focus, .chat-composer textarea.px-input.chat-composer__input:hover {
  height: auto;
  min-height: 44px;
  max-height: 200px;
  padding: var(--px-space-2-5) 0;
  box-shadow: none;
  color: var(--px-text-primary);
  font-size: var(--px-text-16);
  resize: none;
  field-sizing: content;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: none;
  border: 0;
  border-radius: 0;
  outline: none;
  line-height: 1.4;
  overflow-y: auto;
}

.chat-composer__btn {
  background: var(--px-action-solid);
  width: 44px;
  height: 44px;
  color: var(--px-action-on-solid);
  cursor: pointer;
  border: 0;
  border-radius: 50%;
  flex-shrink: 0;
  place-items: center;
  transition: opacity .16s;
  display: grid;
}

.chat-composer__btn:disabled {
  opacity: .32;
  cursor: default;
}

.chat-dock__hint {
  margin: var(--px-space-1-5) 0 0;
  color: var(--px-text-secondary);
  font-size: var(--px-text-12);
  text-align: center;
}

@media (max-width: 767px), (pointer: coarse) {
  .chat-dock__hint {
    display: none;
  }
}

@media (max-width: 767px) {
  .page-header {
    margin-bottom: var(--px-space-4);
  }

  .panel {
    padding: var(--px-space-4);
  }

  .record-list {
    gap: var(--px-space-2);
    display: grid;
  }

  .record-item, .record-item:first-child {
    padding: var(--px-space-3) var(--px-space-3-5);
    border: var(--px-hairline) solid var(--px-glass-border);
    border-radius: var(--px-radius-card);
    background: var(--px-surface-glass-strong);
  }

  .record-item--row {
    gap: var(--px-space-2);
    grid-template-columns: minmax(0, 1fr);
  }

  .record-item--row > :last-child:not(:first-child) {
    justify-self: start;
  }

  .tabs {
    scrollbar-width: none;
    flex-wrap: nowrap;
    overflow-x: auto;
  }
}

@media (min-width: 1024px) {
  .onb {
    max-width: 640px;
  }

  .onb__screen {
    justify-content: center;
    padding-top: 0;
  }

  .onb__stage {
    padding-bottom: 12vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sb, .shell[data-open] .sb, .shell__main, .chat-sugg, .chat-composer__btn {
    transition: none;
  }
}

html:has(.shell) {
  --px-app-bg: var(--px-surface-solid);
  --px-app-tint: var(--px-surface-card);
  --px-app-sidebar: var(--px-surface-solid);
  --px-app-user-bubble: var(--px-surface-solid);
  --px-atmosphere-base: var(--px-app-bg);
  --px-color-bg: var(--px-app-bg);
  --px-glass-border: var(--px-border-default);
  --px-glass-fill: var(--px-surface-solid);
  --px-glass-shadow: 0 1px 2px var(--px-shadow-ink);
  --px-surface-glass: var(--px-surface-solid);
  --px-surface-glass-strong: var(--px-surface-solid);
  --px-surface-glass-hover: var(--px-surface-solid);
  --px-action-soft: var(--px-fill-hover);
  background: var(--px-app-bg);
}

html[data-theme="dark"]:has(.shell) {
  --px-app-bg: var(--px-surface-solid);
  --px-app-tint: transparent;
  --px-app-sidebar: var(--px-surface-solid);
  --px-app-user-bubble: var(--px-surface-solid);
  --px-glass-border: var(--px-border-default);
  --px-glass-fill: var(--px-surface-solid);
  --px-glass-shadow: none;
  --px-surface-glass: var(--px-surface-solid);
  --px-surface-glass-strong: var(--px-surface-solid);
  --px-surface-glass-hover: var(--px-surface-solid);
  --px-action-soft: var(--px-fill-hover);
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]):has(.shell) {
    --px-app-bg: var(--px-surface-solid);
    --px-app-tint: transparent;
    --px-app-sidebar: var(--px-surface-solid);
    --px-app-user-bubble: var(--px-surface-solid);
    --px-glass-border: var(--px-border-default);
    --px-glass-fill: var(--px-surface-solid);
    --px-glass-shadow: none;
    --px-surface-glass: var(--px-surface-solid);
    --px-surface-glass-strong: var(--px-surface-solid);
    --px-surface-glass-hover: var(--px-surface-solid);
    --px-action-soft: var(--px-fill-hover);
  }
}

html:has(.shell) body {
  background: linear-gradient(180deg, var(--px-app-tint) 0, transparent 260px) no-repeat, var(--px-app-bg);
  background-attachment: scroll;
}

html .shell .sb, html .shell[data-open] .sb {
  border-right-color: var(--px-border-subtle);
  background: var(--px-app-sidebar);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.chat-msg--assistant .chat-msg__body {
  gap: var(--px-space-3);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: none;
  border: 0;
  border-radius: 0;
  flex: 1;
  padding: 0;
  line-height: 1.65;
}

.chat-msg__mark {
  height: var(--px-space-5);
  display: flex;
}

.chat-msg--user .chat-msg__body {
  max-width: min(80%, 560px);
  padding: var(--px-space-2-5) var(--px-space-4);
  border-radius: var(--px-radius-xl) var(--px-radius-xl) var(--px-radius-sm) var(--px-radius-xl);
  background: var(--px-app-user-bubble, var(--px-color-primary));
  color: var(--px-text-primary);
}

.chat-view {
  border-color: var(--px-glass-border);
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-glass-fill);
}

.chat-table th, .chat-table td {
  border-bottom-color: var(--px-glass-border);
}

.chat-chip, .chat-suggestion, .chat-sugg {
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

@media (max-width: 767px) {
  .chat-main {
    padding: 0 var(--px-space-3);
  }
}

.fin {
  --fin-r: 12px;
  --fin-r-sm: 8px;
  --fin-glass: var(--px-glass-fill, var(--px-color-surface));
  --fin-glass-strong: var(--px-glass-fill-strong, var(--px-color-surface));
  --fin-line: color-mix(in oklch, var(--px-color-border) 80%, transparent);
  --px-button-height: 34px;
  --px-button-height-sm: 28px;
  --px-control-height: 34px;
  --px-button-radius: var(--px-radius-control);
  --px-button-padding-x: 12px;
  --px-input-height: 34px;
  --px-input-radius: var(--px-radius-control);
  gap: var(--px-space-3-5);
  width: 100%;
  min-width: 0;
  font-size: var(--px-font-size-sm);
  flex-direction: column;
  display: flex;
}

.fin .px-button {
  border-radius: var(--px-radius-control);
  min-height: 34px;
  padding: 0 var(--px-space-3);
  font-size: var(--px-text-13);
  gap: var(--px-space-1-5);
}

.fin .px-button--sm {
  min-height: 28px;
  padding: 0 var(--px-space-2-5);
  font-size: var(--px-text-12);
  border-radius: var(--px-radius-md);
}

.fin .px-button--ghost {
  padding: 0 var(--px-space-2-5);
}

.fin-glass, .fin-card, .fin-stat, .fin-gw, .fin-modal__box, .fin-tabs, .fin-doc {
  border: var(--px-hairline) solid var(--px-glass-border, var(--px-color-border));
  background: var(--fin-glass);
  box-shadow: var(--px-glass-shadow, none);
  -webkit-backdrop-filter: blur(var(--px-glass-blur, var(--px-blur-surface))) saturate(var(--px-glass-saturate, 160%));
  backdrop-filter: blur(var(--px-glass-blur, var(--px-blur-surface))) saturate(var(--px-glass-saturate, 160%));
}

.fin-head {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  display: flex;
}

.fin-head .page-title {
  font-size: var(--px-text-28);
  margin: 0;
  line-height: 1.15;
}

.fin-head .muted {
  margin: var(--px-space-0-5) 0 0;
  font-size: var(--px-text-12);
}

.fin-page {
  min-width: 0;
}

.fin-stack {
  gap: var(--px-space-3);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.fin-loading {
  padding: var(--px-space-8);
  text-align: center;
  color: var(--px-color-text-muted);
}

.fin-tabs {
  gap: var(--px-space-0-5);
  padding: var(--px-space-0-5);
  border-radius: var(--px-radius-tile);
  scrollbar-width: none;
  z-index: 5;
  display: flex;
  position: sticky;
  top: 0;
  overflow-x: auto;
}

.fin-tabs::-webkit-scrollbar {
  display: none;
}

.fin-tab {
  padding: var(--px-space-1-5) var(--px-space-2-5);
  white-space: nowrap;
  color: var(--px-color-text-muted);
  font-size: var(--px-text-13);
  border-radius: var(--px-radius-md);
  font-weight: 500;
  text-decoration: none;
  transition: background .15s, color .15s;
}

.fin-tab:hover {
  color: var(--px-color-text);
  background: var(--px-surface-glass-hover, var(--px-color-surface-muted));
}

.fin-tab--on {
  color: var(--px-color-text);
  background: var(--fin-glass-strong);
  box-shadow: 0 1px 2px var(--px-shadow-ink), var(--px-glass-highlight, none);
  font-weight: 600;
}

.fin-page .fin-tabs {
  margin-bottom: var(--px-space-0-5);
  position: static;
}

.fin-card {
  border-radius: var(--fin-r);
  padding: var(--px-space-3-5) var(--px-space-4);
  min-width: 0;
  overflow-x: auto;
}

.fin-card__head {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2-5);
  margin-bottom: var(--px-space-2);
  display: flex;
}

.fin-card__title {
  font-size: var(--px-text-14);
  margin: 0;
  font-weight: 600;
}

.fin-more {
  font-size: var(--px-text-12);
  color: var(--px-color-text-muted);
  text-decoration: none;
}

.fin-more:hover {
  color: var(--px-color-primary);
}

.fin-stats {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  display: grid;
}

.fin-stat {
  border-radius: var(--fin-r);
  padding: var(--px-space-2-5) var(--px-space-3);
  gap: var(--px-space-0-5);
  color: inherit;
  flex-direction: column;
  min-width: 0;
  text-decoration: none;
  display: flex;
}

.fin-stat--link:hover {
  border-color: var(--px-color-border-strong);
  background: var(--fin-glass-strong);
}

.fin-stat__label {
  font-size: var(--px-text-10-5);
  color: var(--px-color-text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 600;
}

.fin-stat__value {
  font-size: var(--px-text-18);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
  letter-spacing: -.01em;
  font-weight: 650;
}

.fin-stat__sub {
  font-size: var(--px-text-11);
  color: var(--px-color-text-muted);
}

.fin-tone-success {
  color: var(--px-color-success);
}

.fin-tone-danger {
  color: var(--px-color-danger);
}

.fin-tone-warning {
  color: var(--px-color-warning);
}

.fin-bg-success {
  background: var(--px-color-success);
}

.fin-bg-danger {
  background: var(--px-color-danger);
}

.fin-bg-warning {
  background: var(--px-color-warning);
}

.fin-actions {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.fin-actions--end {
  margin-top: var(--px-space-3);
  justify-content: flex-end;
}

.fin-spacer {
  flex: 1;
}

.fin-link-btn {
  align-items: center;
  gap: var(--px-space-1-5);
  height: var(--px-space-8);
  padding: 0 var(--px-space-3);
  border-radius: var(--px-radius-control);
  border: var(--px-hairline) solid var(--px-glass-border, var(--px-color-border));
  color: var(--px-color-text);
  font-size: var(--px-text-13);
  background: var(--fin-glass-strong);
  white-space: nowrap;
  box-shadow: var(--px-glass-highlight, none);
  font-weight: 500;
  text-decoration: none;
  display: inline-flex;
}

.fin-link-btn:hover {
  border-color: var(--px-color-border-strong);
}

.fin-link-btn--primary {
  background: var(--px-button-primary-bg, var(--px-color-primary));
  color: var(--px-button-primary-fg, var(--px-text-on-brand));
  border-color: #0000;
}

.fin-textbtn {
  padding: var(--px-space-0-5) var(--px-space-1-5);
  color: var(--px-color-primary);
  font: inherit;
  font-size: var(--px-text-12-5);
  cursor: pointer;
  border-radius: var(--px-radius-sm);
  background: none;
  border: 0;
  font-weight: 500;
}

.fin-textbtn:hover {
  background: var(--px-color-primary-subtle);
}

.fin-grid2 {
  gap: var(--px-space-3);
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  align-items: start;
  display: grid;
}

.fin-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.fin-list li {
  border-bottom: var(--px-hairline) solid var(--fin-line);
}

.fin-list li:last-child {
  border-bottom: 0;
}

.fin-list a, .fin-li {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2-5);
  padding: var(--px-space-1-5) 0;
  color: inherit;
  min-width: 0;
  font-size: var(--px-text-13);
  text-decoration: none;
  display: flex;
}

.fin-li--col {
  align-items: stretch;
  gap: var(--px-space-1);
  flex-direction: column;
}

.fin-list a:hover {
  color: var(--px-color-primary);
}

.fin-sub {
  font-size: var(--px-text-11);
  margin-top: var(--px-space-px);
  display: block;
}

.fin-kind {
  font-size: var(--px-text-11);
  text-transform: capitalize;
}

.fin-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.fin-right {
  text-align: right;
}

.fin-strike {
  opacity: .6;
  text-decoration: line-through;
}

.fin-insights {
  gap: var(--px-space-1-5);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.fin-insight {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2-5);
  padding: var(--px-space-2) var(--px-space-2-5) var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-tile);
  border: var(--px-hairline) solid color-mix(in oklch, var(--px-color-info) 22%, transparent);
  background: color-mix(in oklch, var(--px-color-info-subtle) 70%, transparent);
  font-size: var(--px-text-13);
  display: flex;
}

.fin-insight strong {
  font-weight: 600;
}

.fin-insight--warning {
  border-color: color-mix(in oklch, var(--px-color-warning) 28%, transparent);
  background: color-mix(in oklch, var(--px-color-warning-subtle) 75%, transparent);
}

.fin-insight--danger {
  border-color: color-mix(in oklch, var(--px-color-danger) 25%, transparent);
  background: color-mix(in oklch, var(--px-color-danger-subtle) 75%, transparent);
}

.fin-insight .muted {
  font-size: var(--px-text-12);
}

.fin-insight .px-button, .fin-insight .fin-link-btn {
  flex-shrink: 0;
}

.fin-pill {
  padding: var(--px-space-px) var(--px-space-1-5);
  border-radius: var(--px-radius-sm);
  font-size: var(--px-text-11);
  margin-left: var(--px-space-1-5);
  white-space: nowrap;
  vertical-align: middle;
  align-items: center;
  font-weight: 600;
  line-height: 1.5;
  display: inline-flex;
}

td > .fin-pill:first-child, .fin-right > .fin-pill:first-child {
  margin-left: 0;
}

.fin-pill--info {
  background: var(--px-color-info-subtle);
  color: var(--px-color-info);
}

.fin-pill--success {
  background: var(--px-color-success-subtle);
  color: var(--px-color-success);
}

.fin-pill--warning {
  background: var(--px-color-warning-subtle);
  color: var(--px-color-warning);
}

.fin-pill--danger {
  background: var(--px-color-danger-subtle);
  color: var(--px-color-danger);
}

.fin-table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--px-text-13);
}

.fin-table th, .fin-table td {
  padding: var(--px-space-1-5) var(--px-space-2);
  border-bottom: var(--px-hairline) solid var(--fin-line);
  text-align: left;
  vertical-align: middle;
}

.fin-table th {
  color: var(--px-color-text-muted);
  font-weight: 600;
  font-size: var(--px-text-10-5);
  text-transform: uppercase;
  letter-spacing: .05em;
  white-space: nowrap;
}

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

.fin-table th.fin-num, .fin-table td.fin-num {
  text-align: right;
}

.fin-table a {
  color: inherit;
  font-weight: 500;
}

.fin-click {
  cursor: pointer;
}

.fin-muted-row td {
  opacity: .55;
}

.fin-row-actions {
  gap: var(--px-space-1);
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  display: inline-flex;
}

.fin-filters {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.fin-filters form {
  flex: 200px;
  display: flex;
}

.fin-filters form .fin-input {
  width: 100%;
}

.fin-input {
  height: 34px;
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-control);
  border: var(--px-hairline) solid var(--px-input-border, var(--px-color-border-input));
  background: var(--px-input-bg, var(--px-color-surface));
  box-shadow: var(--px-glass-highlight, none);
  color: var(--px-color-text);
  font: inherit;
  font-size: var(--px-text-13);
  min-width: 0;
  transition: border-color .15s, box-shadow .15s;
}

select.fin-input {
  padding-right: var(--px-space-6);
}

textarea.fin-input {
  height: auto;
  padding: var(--px-space-2) var(--px-space-2-5);
  resize: vertical;
  line-height: 1.45;
}

input[type="file"].fin-input {
  padding: var(--px-space-1) var(--px-space-2);
}

.fin-input:focus {
  border-color: var(--px-focus-ring, var(--px-color-primary));
  box-shadow: 0 0 0 3px color-mix(in oklch, var(--px-focus-ring, var(--px-color-primary)) 20%, transparent);
  outline: none;
}

.fin-input--big {
  height: 44px;
  font-size: var(--px-text-19);
  font-weight: 600;
}

.fin-input--sm {
  max-width: 150px;
  height: 30px;
  font-size: var(--px-text-12-5);
}

.fin-check {
  gap: var(--px-space-1-5);
  font-size: var(--px-text-13);
  align-items: center;
  display: inline-flex;
}

.fin-checks {
  gap: var(--px-space-2) var(--px-space-4);
  flex-wrap: wrap;
  display: flex;
}

.fin-form {
  gap: var(--px-space-2-5);
  margin: var(--px-space-2-5) 0;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  display: grid;
}

.fin-form--one {
  flex: 1;
  grid-template-columns: 1fr;
}

.fin-field {
  gap: var(--px-space-1);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.fin-field--wide {
  grid-column: 1 / -1;
}

.fin-field__label {
  font-size: var(--px-text-11);
  color: var(--px-color-text-muted);
  font-weight: 600;
}

.fin-field .fin-input {
  width: 100%;
}

.fin-inline {
  gap: var(--px-space-1-5);
  margin-bottom: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.fin-inline .fin-input {
  flex: 150px;
}

.fin-seg {
  gap: var(--px-space-0-5);
  padding: var(--px-space-0-5);
  border-radius: var(--px-radius-tile);
  background: color-mix(in oklch, var(--px-color-surface-muted) 75%, transparent);
  border: var(--px-hairline) solid var(--fin-line);
  margin-bottom: var(--px-space-2-5);
  flex-wrap: wrap;
  display: inline-flex;
}

.fin-seg--inline {
  margin-bottom: 0;
}

.fin-seg button {
  padding: var(--px-space-1) var(--px-space-2-5);
  border-radius: var(--px-radius-sm);
  font: inherit;
  font-size: var(--px-text-12-5);
  color: var(--px-color-text-muted);
  cursor: pointer;
  background: none;
  border: 0;
}

.fin-seg button.on {
  background: var(--fin-glass-strong);
  color: var(--px-color-text);
  box-shadow: var(--px-shadow-xs);
  font-weight: 600;
}

.fin-details {
  margin: 0 0 var(--px-space-2-5);
  font-size: var(--px-text-13);
}

.fin-details summary {
  cursor: pointer;
  color: var(--px-color-primary);
  margin-bottom: var(--px-space-1-5);
}

.fin-details textarea {
  width: 100%;
  margin-bottom: var(--px-space-1-5);
}

.fin-error {
  color: var(--px-color-danger);
  font-size: var(--px-text-12-5);
  margin: var(--px-space-1-5) 0;
}

.fin-note {
  padding: var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-control);
  background: var(--px-color-success-subtle);
  color: var(--px-color-success);
  font-size: var(--px-text-12-5);
  margin: 0;
}

.fin-empty {
  padding: var(--px-space-6) var(--px-space-3);
  text-align: center;
  gap: var(--px-space-1);
  flex-direction: column;
  align-items: center;
  display: flex;
}

.fin-totals {
  gap: var(--px-space-1-5) var(--px-space-4);
  font-size: var(--px-text-12-5);
  color: var(--px-color-text-muted);
  margin-bottom: var(--px-space-1-5);
  flex-wrap: wrap;
  display: flex;
}

.fin-totals strong {
  color: var(--px-color-text);
  font-variant-numeric: tabular-nums;
}

.fin-crumbs {
  font-size: var(--px-text-12-5);
  color: var(--px-color-text-muted);
  margin-bottom: var(--px-space-0-5);
}

.fin-crumbs a {
  color: inherit;
}

.fin-modal {
  z-index: 80;
  background: var(--px-overlay);
  -webkit-backdrop-filter: blur(var(--px-blur-surface));
  backdrop-filter: blur(var(--px-blur-surface));
  padding: var(--px-space-4);
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  inset: 0;
}

.fin-modal__box {
  width: min(600px, 100%);
  max-height: calc(100dvh - var(--px-space-8));
  background: var(--px-surface-popover, var(--fin-glass-strong));
  border-radius: var(--px-radius-card);
  box-shadow: var(--px-glass-highlight, none), 0 20px 50px var(--px-shadow-ink);
  flex-direction: column;
  display: flex;
}

.fin-modal__head {
  padding: var(--px-space-3) var(--px-space-4) 0;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.fin-modal__head h2 {
  font-size: var(--px-text-14);
  margin: 0;
  font-weight: 650;
}

.fin-modal__body {
  padding: var(--px-space-2-5) var(--px-space-4) var(--px-space-3-5);
  font-size: var(--px-text-13);
  overflow-y: auto;
}

.fin-modal__body > p:first-child {
  margin-top: 0;
}

.fin-modal__foot {
  justify-content: flex-end;
  gap: var(--px-space-1-5);
  padding: var(--px-space-2-5) var(--px-space-4);
  border-top: var(--px-hairline) solid var(--fin-line);
  flex-wrap: wrap;
  display: flex;
}

.fin-x {
  font-size: var(--px-text-20);
  cursor: pointer;
  color: var(--px-color-text-muted);
  padding: var(--px-space-0-5) var(--px-space-1-5);
  border-radius: var(--px-radius-sm);
  background: none;
  border: 0;
  line-height: 1;
}

.fin-x:hover {
  background: var(--px-surface-glass-hover, var(--px-color-surface-muted));
}

.fin-confirm p {
  margin-top: 0;
}

.fin-bar {
  border-radius: var(--px-radius-pill);
  background: color-mix(in oklch, var(--px-color-surface-muted) 80%, transparent);
  height: 5px;
  overflow: hidden;
}

.fin-bar__fill {
  border-radius: var(--px-radius-pill);
  height: 100%;
}

.fin-lines {
  gap: var(--px-space-1);
  margin: var(--px-space-3) 0;
  flex-direction: column;
  display: flex;
}

.fin-lines__head, .fin-lines__row {
  gap: var(--px-space-1);
  grid-template-columns: 140px minmax(150px, 1fr) 64px 110px 110px 100px 28px;
  align-items: center;
  display: grid;
}

:is(.fin-lines__head:has(span:nth-child(8)), .fin-lines__row--bill) {
  grid-template-columns: 130px minmax(140px, 1fr) 60px 100px 100px 140px 96px 28px;
}

.fin-lines__head {
  font-size: var(--px-text-10-5);
  color: var(--px-color-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
}

.fin-lines__row .fin-input {
  width: 100%;
}

.fin-lines .fin-textbtn {
  align-self: flex-start;
}

.fin-doc-bottom {
  gap: var(--px-space-4);
  flex-wrap: wrap;
  align-items: flex-start;
  display: flex;
}

.fin-sum {
  margin: var(--px-space-2-5) 0 0 auto;
  gap: var(--px-space-1);
  min-width: 240px;
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.fin-sum div {
  justify-content: space-between;
  gap: var(--px-space-3-5);
  display: flex;
}

.fin-sum dt {
  color: var(--px-color-text-muted);
}

.fin-sum dd {
  font-variant-numeric: tabular-nums;
  margin: 0;
}

.fin-sum__total {
  border-top: var(--px-hairline) solid var(--fin-line);
  padding-top: var(--px-space-1);
  font-weight: 700;
  font-size: var(--px-text-14);
}

.fin-sum__total dt {
  color: var(--px-color-text);
}

.fin-doc {
  background: var(--fin-glass-strong);
  border-radius: var(--px-radius-card);
  padding: clamp(var(--px-space-4), 3.2vw, var(--px-space-8));
  gap: var(--px-space-3-5);
  flex-direction: column;
  display: flex;
}

.fin-doc__top {
  justify-content: space-between;
  gap: var(--px-space-3);
  flex-wrap: wrap;
  display: flex;
}

.fin-doc__type {
  font-size: var(--px-text-10-5);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--px-color-text-muted);
  font-weight: 600;
}

.fin-doc__number {
  font-family: var(--px-font-display);
  font-size: var(--px-text-24);
  line-height: 1.1;
}

.fin-doc__amount {
  font-size: var(--px-text-24);
  font-variant-numeric: tabular-nums;
  margin-top: var(--px-space-1);
  font-weight: 700;
}

.fin-doc__meta {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  display: grid;
}

.fin-doc__meta > div {
  gap: var(--px-space-px);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.fin-doc__notes {
  white-space: pre-wrap;
  font-size: var(--px-text-12-5);
  color: var(--px-color-text-muted);
  border-top: var(--px-hairline) solid var(--fin-line);
  padding-top: var(--px-space-2-5);
  margin: 0;
}

.fin-report-grid {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  display: grid;
}

.fin-report-card {
  gap: var(--px-space-1);
  color: inherit;
  flex-direction: column;
  text-decoration: none;
  display: flex;
}

.fin-report-card:hover {
  border-color: var(--px-color-border-strong);
}

.fin-report-card .muted {
  font-size: var(--px-text-12);
}

.fin-rep-sec h3 {
  margin: var(--px-space-2-5) 0 var(--px-space-1);
  font-size: var(--px-text-11);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--px-color-text-muted);
}

.fin-rep-total {
  padding: var(--px-space-1-5) var(--px-space-2);
  border-bottom: var(--px-hairline) solid var(--fin-line);
  justify-content: space-between;
  font-weight: 600;
  display: flex;
}

.fin-rep-grand {
  padding: var(--px-space-2-5) var(--px-space-2);
  font-weight: 700;
  font-size: var(--px-text-14);
  border-top: var(--px-stroke-2) solid var(--px-color-text);
  margin-top: var(--px-space-2-5);
  justify-content: space-between;
  display: flex;
}

.fin-rep-totalrow td {
  border-top: var(--px-stroke-2) solid var(--px-color-border-strong);
  font-weight: 700;
}

.fin-recon {
  gap: var(--px-space-3);
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  display: grid;
}

.fin-recon > div {
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.fin-recon strong {
  font-size: var(--px-text-18);
  font-variant-numeric: tabular-nums;
}

.fin-checklist {
  margin: var(--px-space-2-5) 0;
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  padding: 0;
  list-style: none;
  display: flex;
}

.fin-checklist li:before {
  content: "✓";
  width: var(--px-space-5);
  color: var(--px-color-success);
  font-weight: 700;
  display: inline-block;
}

.fin-checklist li.warn:before {
  content: "!";
  color: var(--px-color-warning);
}

.fin-roles {
  font-size: var(--px-text-12-5);
  color: var(--px-color-text-muted);
  padding-left: var(--px-space-4);
}

.fin-h3 {
  font-size: var(--px-text-13);
  margin: var(--px-space-4) 0 0;
}

.fin-activity .fin-li {
  align-items: flex-start;
}

.fin-gw-grid {
  gap: var(--px-space-2-5);
  margin-top: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  display: grid;
}

.fin-gw {
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-3);
  gap: var(--px-space-1-5);
  background: var(--fin-glass-strong);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.fin-gw .px-button {
  align-self: flex-start;
}

.fin-gw--on {
  border-color: color-mix(in oklch, var(--px-color-success) 45%, transparent);
}

.fin-gw__head {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2);
  font-size: var(--px-text-14);
  display: flex;
}

.fin-gw__meta {
  gap: var(--px-space-1-5);
  font-size: var(--px-text-12);
  align-items: center;
  display: flex;
}

.fin-gw__url {
  gap: var(--px-space-0-5);
  font-size: var(--px-text-11);
  margin: var(--px-space-1) 0;
  flex-direction: column;
  display: flex;
}

.fin-gw__url code {
  background: color-mix(in oklch, var(--px-color-surface-muted) 80%, transparent);
  padding: var(--px-space-1-5) var(--px-space-2);
  border-radius: var(--px-radius-sm);
  overflow-wrap: anywhere;
  font-size: var(--px-text-11);
}

.fin-gw__url .fin-textbtn {
  align-self: flex-start;
}

.fin-steps {
  padding-left: var(--px-space-4);
  font-size: var(--px-text-12-5);
  margin: var(--px-space-1) 0 var(--px-space-2);
}

.fin-steps li {
  margin-bottom: var(--px-space-0-5);
}

.fin-public {
  min-height: 100dvh;
  padding: clamp(var(--px-space-3), 4vw, var(--px-space-10)) var(--px-space-3);
  gap: var(--px-space-2-5);
  flex-direction: column;
  max-width: 780px;
  margin: 0 auto;
  display: flex;
}

.fin-public .px-button {
  border-radius: var(--px-radius-tile);
  min-height: 38px;
}

.fin-public__company {
  font-weight: 700;
  font-size: var(--px-text-16);
  margin-bottom: var(--px-space-1-5);
}

.fin-public__foot {
  text-align: center;
  font-size: var(--px-text-11);
}

@media (max-width: 1024px) {
  .fin-lines__head, .fin-lines__row {
    grid-template-columns: 120px minmax(120px, 1fr) 56px 96px 96px 90px 26px;
  }
}

@media (max-width: 760px) {
  .fin {
    gap: var(--px-space-2-5);
  }

  .fin-head .muted {
    display: none;
  }

  .fin-tabs {
    margin: 0 calc(var(--px-space-1) * -1);
    border-radius: var(--px-radius-tile);
  }

  .fin-card {
    padding: var(--px-space-3);
    border-radius: var(--px-radius-tile);
  }

  .fin-stats {
    gap: var(--px-space-2);
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .fin-stat {
    padding: var(--px-space-2) var(--px-space-2-5);
  }

  .fin-stat__value {
    font-size: var(--px-text-16);
  }

  .fin-grid2 {
    grid-template-columns: minmax(0, 1fr);
  }

  .fin-actions--scroll {
    scrollbar-width: none;
    margin: 0 calc(var(--px-space-1) * -1);
    padding: 0 var(--px-space-1) var(--px-space-0-5);
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .fin-actions--scroll::-webkit-scrollbar {
    display: none;
  }

  .fin-actions--scroll > * {
    flex-shrink: 0;
  }

  .fin-insight {
    padding: var(--px-space-2) var(--px-space-2-5);
    flex-wrap: wrap;
  }

  .fin-insight > div {
    flex: 180px;
  }

  .fin-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .fin-lines__head {
    display: none;
  }

  .fin-lines__row, .fin-lines__row--bill {
    padding: var(--px-space-2);
    border: var(--px-hairline) solid var(--fin-line);
    border-radius: var(--px-radius-tile);
    background: var(--fin-glass);
    grid-template-columns: 1fr 1fr;
  }

  .fin-lines__row > :nth-child(2) {
    grid-column: 1 / -1;
  }

  .fin-sum {
    width: 100%;
    min-width: 0;
  }

  .fin-table--rows thead {
    display: none;
  }

  .fin-table--rows, .fin-table--rows tbody {
    display: block;
  }

  .fin-table--rows tr {
    gap: var(--px-space-px) var(--px-space-2-5);
    padding: var(--px-space-2) 0;
    border-bottom: var(--px-hairline) solid var(--fin-line);
    grid-template-columns: minmax(0, 1fr) auto;
    display: grid;
  }

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

  .fin-table--rows td {
    padding: var(--px-space-px) 0;
    border: 0;
  }

  .fin-table--rows td.fin-num, .fin-table--rows td.fin-right {
    text-align: right;
  }

  .fin-table:not(.fin-table--rows) {
    min-width: 460px;
  }

  .fin-doc {
    padding: var(--px-space-3-5);
  }

  .fin-doc .fin-table {
    min-width: 0;
  }

  .fin-modal {
    align-items: flex-end;
    padding: 0;
  }

  .fin-modal__box {
    border-radius: var(--px-radius-panel) var(--px-radius-panel) 0 0;
    width: 100%;
    max-height: 92dvh;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .fin-modal__foot .px-button {
    flex: auto;
  }

  .fin-gw-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .fin-recon {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) and (pointer: coarse) {
  .fin-input {
    font-size: var(--px-text-16);
    height: 38px;
  }
}

@media (max-width: 380px) {
  .fin-stats {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media print {
  body * {
    visibility: hidden;
  }

  #print-area, #print-area * {
    visibility: visible;
  }

  #print-area {
    width: 100%;
    box-shadow: none;
    background: var(--px-surface-solid);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
  }

  .fin-noprint {
    display: none !important;
  }
}

html {
  --hk-sky-top: var(--px-brand);
  --hk-sky-bottom: var(--px-accent);
  --hk-text: var(--px-text-primary);
  --hk-text-2: var(--px-text-secondary);
  --hk-text-3: var(--px-text-tertiary);
  --hk-ink: var(--px-text-primary);
  --hk-ink-hover: var(--px-text-primary);
  --hk-on-ink: var(--px-surface-solid);
  --hk-stroke: var(--px-border-default);
  --hk-stroke-2: var(--px-border-hairline);
  --hk-wash: var(--px-fill-hover);
  --hk-wash-2: var(--px-fill-pressed);
  --hk-regular: var(--px-surface-card);
  --hk-thin: var(--px-surface-card);
  --hk-cell: var(--px-surface-card);
  --hk-solid: var(--px-surface-solid);
  --hk-shadow: 0 8px 40px var(--px-shadow-ink);
  --hk-shadow-pop: 0 8px 40px var(--px-shadow-ink);
  --hk-info: var(--px-brand);
  --hk-success: var(--px-success);
  --hk-danger: var(--px-danger);
  --hk-warning: var(--px-accent);
  --hk-blur: 40px;
}

html[data-theme="dark"] {
  --hk-sky-top: var(--px-brand);
  --hk-sky-bottom: var(--px-brand);
  --hk-text: var(--px-text-on-brand);
  --hk-text-2: var(--px-text-tertiary);
  --hk-text-3: var(--px-text-tertiary);
  --hk-ink: var(--px-text-on-brand);
  --hk-ink-hover: var(--px-text-on-brand);
  --hk-on-ink: var(--px-surface-solid);
  --hk-stroke: var(--px-border-strong);
  --hk-stroke-2: var(--px-border-default);
  --hk-wash: var(--px-fill-hover);
  --hk-wash-2: var(--px-fill-pressed);
  --hk-regular: var(--px-overlay);
  --hk-thin: var(--px-overlay);
  --hk-cell: var(--px-fill-hover);
  --hk-solid: var(--px-surface-solid);
  --hk-shadow: 0 8px 40px var(--px-shadow-ink);
  --hk-shadow-pop: 0 12px 48px var(--px-shadow-ink);
  --hk-info: var(--px-brand);
  --hk-success: var(--px-success);
  --hk-danger: var(--px-danger);
  --hk-warning: var(--px-accent);
}

html {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --px-app-bg: transparent;
  --px-app-tint: transparent;
  --px-app-sidebar: var(--hk-thin);
  --px-app-user-bubble: var(--hk-regular);
  --px-atmosphere-base: var(--hk-sky-top);
  --px-atmosphere: linear-gradient(180deg, var(--hk-sky-top), var(--hk-sky-bottom));
  --px-color-bg: var(--hk-sky-top);
  --px-text-primary: var(--hk-text);
  --px-text-secondary: var(--hk-text-2);
  --px-text-tertiary: var(--hk-text-3);
  --px-text-link: var(--hk-text);
  --px-text-link-hover: var(--hk-text-2);
  --px-color-text: var(--hk-text);
  --px-color-text-muted: var(--hk-text-2);
  --px-color-text-subtle: var(--hk-text-3);
  --px-color-primary: var(--hk-ink);
  --px-color-primary-hover: var(--hk-ink-hover);
  --px-color-primary-contrast: var(--hk-on-ink);
  --px-color-primary-subtle: var(--hk-wash);
  --px-brand: var(--hk-ink);
  --px-brand-subtle: var(--hk-wash);
  --px-action-solid: var(--hk-ink);
  --px-action-solid-hover: var(--hk-ink-hover);
  --px-action-on-solid: var(--hk-on-ink);
  --px-action-soft: var(--hk-wash);
  --px-action-soft-hover: var(--hk-wash-2);
  --px-button-primary-bg: var(--hk-ink);
  --px-button-primary-bg-hover: var(--hk-ink-hover);
  --px-button-primary-fg: var(--hk-on-ink);
  --px-button-secondary-bg: var(--hk-thin);
  --px-button-secondary-bg-hover: var(--hk-cell);
  --px-button-secondary-fg: var(--hk-text);
  --px-button-secondary-border: transparent;
  --px-segmented-active-bg: var(--hk-ink);
  --px-segmented-active-fg: var(--hk-on-ink);
  --px-segmented-fg: var(--hk-text-2);
  --px-focus-ring: color-mix(in srgb, var(--hk-text) 45%, transparent);
  --px-border-subtle: var(--hk-stroke-2);
  --px-border-default: var(--hk-stroke);
  --px-border-input: var(--hk-stroke);
  --px-border-field: var(--hk-stroke-2);
  --px-border-glass: var(--hk-stroke-2);
  --px-color-border: var(--hk-stroke-2);
  --px-color-border-strong: var(--hk-stroke);
  --px-color-border-input: var(--hk-stroke);
  --px-surface-glass: var(--hk-regular);
  --px-surface-glass-strong: var(--hk-solid);
  --px-surface-glass-hover: var(--hk-cell);
  --px-surface-popover: var(--hk-solid);
  --px-surface-sunken: var(--hk-wash);
  --px-surface-hover-tint: var(--hk-wash);
  --px-popover-bg: var(--hk-solid);
  --px-popover-border: var(--hk-stroke-2);
  --px-popover-shadow: var(--hk-shadow-pop);
  --px-input-bg: var(--hk-thin);
  --px-input-border: transparent;
  --px-input-border-hover: var(--hk-stroke);
  --px-input-border-focus: var(--hk-stroke);
  --px-input-shadow: inset 0 0 0 1px var(--hk-stroke-2);
  --px-input-ring: 0 0 0 3px var(--hk-wash-2);
  --px-picker-bg: var(--hk-thin);
  --px-glass-fill: var(--hk-regular);
  --px-glass-fill-strong: var(--hk-solid);
  --px-glass-border: var(--hk-stroke-2);
  --px-glass-highlight: inset 0 0 0 0 transparent;
  --px-glass-shadow: var(--hk-shadow);
  --px-glass-blur: var(--hk-blur);
  --px-glass-saturate: 140%;
  --px-color-surface: var(--hk-cell);
  --px-color-surface-muted: var(--hk-wash);
  --px-shadow-card: var(--hk-shadow);
  --px-shadow-popover: var(--hk-shadow-pop);
  --px-scrim: var(--px-overlay);
  --px-info: var(--hk-info);
  --px-success: var(--hk-success);
  --px-danger: var(--hk-danger);
  --px-warning: var(--hk-warning);
  --px-color-info: var(--hk-info);
  --px-color-success: var(--hk-success);
  --px-color-danger: var(--hk-danger);
  --px-color-warning: var(--hk-warning);
  --px-info-subtle: color-mix(in srgb, var(--hk-info) 13%, transparent);
  --px-success-subtle: color-mix(in srgb, var(--hk-success) 14%, transparent);
  --px-danger-subtle: color-mix(in srgb, var(--hk-danger) 13%, transparent);
  --px-warning-subtle: color-mix(in srgb, var(--hk-warning) 15%, transparent);
  --px-color-info-subtle: var(--px-info-subtle);
  --px-color-success-subtle: var(--px-success-subtle);
  --px-color-danger-subtle: var(--px-danger-subtle);
  --px-color-warning-subtle: var(--px-warning-subtle);
  --px-button-radius: var(--px-radius-tile-lg);
  --px-input-radius: var(--px-radius-tile-lg);
  --px-card-radius: var(--px-radius-xl);
  background: var(--hk-sky-top);
}

html:has(.shell) {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --px-app-bg: transparent;
  --px-app-tint: transparent;
  --px-app-sidebar: var(--hk-thin);
  --px-app-user-bubble: var(--hk-regular);
  --px-atmosphere-base: var(--hk-sky-top);
  --px-atmosphere: linear-gradient(180deg, var(--hk-sky-top), var(--hk-sky-bottom));
  --px-color-bg: var(--hk-sky-top);
  --px-text-primary: var(--hk-text);
  --px-text-secondary: var(--hk-text-2);
  --px-text-tertiary: var(--hk-text-3);
  --px-text-link: var(--hk-text);
  --px-text-link-hover: var(--hk-text-2);
  --px-color-text: var(--hk-text);
  --px-color-text-muted: var(--hk-text-2);
  --px-color-text-subtle: var(--hk-text-3);
  --px-color-primary: var(--hk-ink);
  --px-color-primary-hover: var(--hk-ink-hover);
  --px-color-primary-contrast: var(--hk-on-ink);
  --px-color-primary-subtle: var(--hk-wash);
  --px-brand: var(--hk-ink);
  --px-brand-subtle: var(--hk-wash);
  --px-action-solid: var(--hk-ink);
  --px-action-solid-hover: var(--hk-ink-hover);
  --px-action-on-solid: var(--hk-on-ink);
  --px-action-soft: var(--hk-wash);
  --px-action-soft-hover: var(--hk-wash-2);
  --px-button-primary-bg: var(--hk-ink);
  --px-button-primary-bg-hover: var(--hk-ink-hover);
  --px-button-primary-fg: var(--hk-on-ink);
  --px-button-secondary-bg: var(--hk-thin);
  --px-button-secondary-bg-hover: var(--hk-cell);
  --px-button-secondary-fg: var(--hk-text);
  --px-button-secondary-border: transparent;
  --px-segmented-active-bg: var(--hk-ink);
  --px-segmented-active-fg: var(--hk-on-ink);
  --px-segmented-fg: var(--hk-text-2);
  --px-focus-ring: color-mix(in srgb, var(--hk-text) 45%, transparent);
  --px-border-subtle: var(--hk-stroke-2);
  --px-border-default: var(--hk-stroke);
  --px-border-input: var(--hk-stroke);
  --px-border-field: var(--hk-stroke-2);
  --px-border-glass: var(--hk-stroke-2);
  --px-color-border: var(--hk-stroke-2);
  --px-color-border-strong: var(--hk-stroke);
  --px-color-border-input: var(--hk-stroke);
  --px-surface-glass: var(--hk-regular);
  --px-surface-glass-strong: var(--hk-solid);
  --px-surface-glass-hover: var(--hk-cell);
  --px-surface-popover: var(--hk-solid);
  --px-surface-sunken: var(--hk-wash);
  --px-surface-hover-tint: var(--hk-wash);
  --px-popover-bg: var(--hk-solid);
  --px-popover-border: var(--hk-stroke-2);
  --px-popover-shadow: var(--hk-shadow-pop);
  --px-input-bg: var(--hk-thin);
  --px-input-border: transparent;
  --px-input-border-hover: var(--hk-stroke);
  --px-input-border-focus: var(--hk-stroke);
  --px-input-shadow: inset 0 0 0 1px var(--hk-stroke-2);
  --px-input-ring: 0 0 0 3px var(--hk-wash-2);
  --px-picker-bg: var(--hk-thin);
  --px-glass-fill: var(--hk-regular);
  --px-glass-fill-strong: var(--hk-solid);
  --px-glass-border: var(--hk-stroke-2);
  --px-glass-highlight: inset 0 0 0 0 transparent;
  --px-glass-shadow: var(--hk-shadow);
  --px-glass-blur: var(--hk-blur);
  --px-glass-saturate: 140%;
  --px-color-surface: var(--hk-cell);
  --px-color-surface-muted: var(--hk-wash);
  --px-shadow-card: var(--hk-shadow);
  --px-shadow-popover: var(--hk-shadow-pop);
  --px-scrim: var(--px-overlay);
  --px-info: var(--hk-info);
  --px-success: var(--hk-success);
  --px-danger: var(--hk-danger);
  --px-warning: var(--hk-warning);
  --px-color-info: var(--hk-info);
  --px-color-success: var(--hk-success);
  --px-color-danger: var(--hk-danger);
  --px-color-warning: var(--hk-warning);
  --px-info-subtle: color-mix(in srgb, var(--hk-info) 13%, transparent);
  --px-success-subtle: color-mix(in srgb, var(--hk-success) 14%, transparent);
  --px-danger-subtle: color-mix(in srgb, var(--hk-danger) 13%, transparent);
  --px-warning-subtle: color-mix(in srgb, var(--hk-warning) 15%, transparent);
  --px-color-info-subtle: var(--px-info-subtle);
  --px-color-success-subtle: var(--px-success-subtle);
  --px-color-danger-subtle: var(--px-danger-subtle);
  --px-color-warning-subtle: var(--px-warning-subtle);
  --px-button-radius: var(--px-radius-tile-lg);
  --px-input-radius: var(--px-radius-tile-lg);
  --px-card-radius: var(--px-radius-xl);
  background: var(--hk-sky-top);
}

html[data-theme="dark"]:has(.shell) {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --px-app-bg: transparent;
  --px-app-tint: transparent;
  --px-app-sidebar: var(--hk-thin);
  --px-app-user-bubble: var(--hk-regular);
  --px-atmosphere-base: var(--hk-sky-top);
  --px-atmosphere: linear-gradient(180deg, var(--hk-sky-top), var(--hk-sky-bottom));
  --px-color-bg: var(--hk-sky-top);
  --px-text-primary: var(--hk-text);
  --px-text-secondary: var(--hk-text-2);
  --px-text-tertiary: var(--hk-text-3);
  --px-text-link: var(--hk-text);
  --px-text-link-hover: var(--hk-text-2);
  --px-color-text: var(--hk-text);
  --px-color-text-muted: var(--hk-text-2);
  --px-color-text-subtle: var(--hk-text-3);
  --px-color-primary: var(--hk-ink);
  --px-color-primary-hover: var(--hk-ink-hover);
  --px-color-primary-contrast: var(--hk-on-ink);
  --px-color-primary-subtle: var(--hk-wash);
  --px-brand: var(--hk-ink);
  --px-brand-subtle: var(--hk-wash);
  --px-action-solid: var(--hk-ink);
  --px-action-solid-hover: var(--hk-ink-hover);
  --px-action-on-solid: var(--hk-on-ink);
  --px-action-soft: var(--hk-wash);
  --px-action-soft-hover: var(--hk-wash-2);
  --px-button-primary-bg: var(--hk-ink);
  --px-button-primary-bg-hover: var(--hk-ink-hover);
  --px-button-primary-fg: var(--hk-on-ink);
  --px-button-secondary-bg: var(--hk-thin);
  --px-button-secondary-bg-hover: var(--hk-cell);
  --px-button-secondary-fg: var(--hk-text);
  --px-button-secondary-border: transparent;
  --px-segmented-active-bg: var(--hk-ink);
  --px-segmented-active-fg: var(--hk-on-ink);
  --px-segmented-fg: var(--hk-text-2);
  --px-focus-ring: color-mix(in srgb, var(--hk-text) 45%, transparent);
  --px-border-subtle: var(--hk-stroke-2);
  --px-border-default: var(--hk-stroke);
  --px-border-input: var(--hk-stroke);
  --px-border-field: var(--hk-stroke-2);
  --px-border-glass: var(--hk-stroke-2);
  --px-color-border: var(--hk-stroke-2);
  --px-color-border-strong: var(--hk-stroke);
  --px-color-border-input: var(--hk-stroke);
  --px-surface-glass: var(--hk-regular);
  --px-surface-glass-strong: var(--hk-solid);
  --px-surface-glass-hover: var(--hk-cell);
  --px-surface-popover: var(--hk-solid);
  --px-surface-sunken: var(--hk-wash);
  --px-surface-hover-tint: var(--hk-wash);
  --px-popover-bg: var(--hk-solid);
  --px-popover-border: var(--hk-stroke-2);
  --px-popover-shadow: var(--hk-shadow-pop);
  --px-input-bg: var(--hk-thin);
  --px-input-border: transparent;
  --px-input-border-hover: var(--hk-stroke);
  --px-input-border-focus: var(--hk-stroke);
  --px-input-shadow: inset 0 0 0 1px var(--hk-stroke-2);
  --px-input-ring: 0 0 0 3px var(--hk-wash-2);
  --px-picker-bg: var(--hk-thin);
  --px-glass-fill: var(--hk-regular);
  --px-glass-fill-strong: var(--hk-solid);
  --px-glass-border: var(--hk-stroke-2);
  --px-glass-highlight: inset 0 0 0 0 transparent;
  --px-glass-shadow: var(--hk-shadow);
  --px-glass-blur: var(--hk-blur);
  --px-glass-saturate: 140%;
  --px-color-surface: var(--hk-cell);
  --px-color-surface-muted: var(--hk-wash);
  --px-shadow-card: var(--hk-shadow);
  --px-shadow-popover: var(--hk-shadow-pop);
  --px-scrim: var(--px-overlay);
  --px-info: var(--hk-info);
  --px-success: var(--hk-success);
  --px-danger: var(--hk-danger);
  --px-warning: var(--hk-warning);
  --px-color-info: var(--hk-info);
  --px-color-success: var(--hk-success);
  --px-color-danger: var(--hk-danger);
  --px-color-warning: var(--hk-warning);
  --px-info-subtle: color-mix(in srgb, var(--hk-info) 13%, transparent);
  --px-success-subtle: color-mix(in srgb, var(--hk-success) 14%, transparent);
  --px-danger-subtle: color-mix(in srgb, var(--hk-danger) 13%, transparent);
  --px-warning-subtle: color-mix(in srgb, var(--hk-warning) 15%, transparent);
  --px-color-info-subtle: var(--px-info-subtle);
  --px-color-success-subtle: var(--px-success-subtle);
  --px-color-danger-subtle: var(--px-danger-subtle);
  --px-color-warning-subtle: var(--px-warning-subtle);
  --px-button-radius: var(--px-radius-tile-lg);
  --px-input-radius: var(--px-radius-tile-lg);
  --px-card-radius: var(--px-radius-xl);
  background: var(--hk-sky-top);
}

:is(html[data-theme="dark"], html[data-theme="dark"]:has(.shell)) {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
}

* {
  -webkit-tap-highlight-color: transparent;
}

html body {
  background: linear-gradient(180deg, var(--hk-sky-top) 0%, var(--hk-sky-bottom) 100%) fixed;
  min-height: 100dvh;
  color: var(--hk-text);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
}

html:has(.shell) body {
  background: linear-gradient(180deg, var(--hk-sky-top) 0%, var(--hk-sky-bottom) 100%) fixed;
  min-height: 100dvh;
  color: var(--hk-text);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
}

html[data-theme="dark"]:has(.shell) body {
  background: linear-gradient(180deg, var(--hk-sky-top) 0%, var(--hk-sky-bottom) 100%) fixed;
  min-height: 100dvh;
  color: var(--hk-text);
  font-feature-settings: "cv11", "ss01";
  -webkit-font-smoothing: antialiased;
}

html body:before, html body:after {
  content: none;
  animation: none;
}

html:has(.shell) body:before {
  content: none;
  animation: none;
}

html:has(.shell) body:after {
  content: none;
  animation: none;
}

html[data-theme="dark"]:has(.shell) body:before {
  content: none;
  animation: none;
}

html[data-theme="dark"]:has(.shell) body:after {
  content: none;
  animation: none;
}

::selection {
  background: color-mix(in srgb, var(--hk-text) 18%, transparent);
}

a {
  color: inherit;
}

html .shell .sb, html .shell[data-open] .sb {
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  box-shadow: none;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

html[data-theme="dark"]:has(.shell) .shell .sb {
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  box-shadow: none;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

html[data-theme="dark"]:has(.shell) .shell[data-open] .sb {
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  box-shadow: none;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

@media (max-width: 1023px) {
  html .shell[data-open] .sb, html[data-theme="dark"] .shell[data-open] .sb {
    background: var(--hk-solid);
  }
}

html .shell-head {
  border-bottom: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  box-shadow: none;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

html[data-theme="dark"]:has(.shell) .shell-head {
  border-bottom: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  box-shadow: none;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

.sb__brand {
  color: var(--hk-text);
}

.sb__row {
  min-height: 38px;
  padding: 0 var(--px-space-2-5);
  gap: var(--px-space-2-5);
  border-radius: var(--px-radius-tile-lg);
  font-size: var(--px-text-14);
  color: var(--hk-text);
  font-weight: 500;
}

.sb__row svg {
  color: var(--hk-text-2);
}

.sb__row:hover {
  background: var(--hk-wash);
}

.sb__row[aria-current="page"], .sb__row[data-here] {
  background: var(--hk-regular);
  box-shadow: var(--px-inset-hi);
  font-weight: 600;
}

.sb__row[aria-current="page"] svg, .sb__row[data-here] svg {
  color: var(--hk-text);
}

.sb__nav {
  gap: var(--px-space-0-5);
}

.sb__item {
  flex-direction: column;
  display: flex;
}

.sb__sub {
  gap: var(--px-space-px);
  margin: var(--px-space-0-5) 0 var(--px-space-1-5) var(--px-space-5);
  padding-left: var(--px-space-2-5);
  border-left: var(--px-hairline) solid var(--hk-stroke);
  flex-direction: column;
  display: flex;
}

.sb__subrow {
  min-height: 30px;
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-control);
  color: var(--hk-text-2);
  font-size: var(--px-text-13);
  white-space: nowrap;
  align-items: center;
  font-weight: 500;
  text-decoration: none;
  display: flex;
}

.sb__subrow:hover {
  color: var(--hk-text);
  background: var(--hk-wash);
}

.sb__subrow[aria-current="page"] {
  color: var(--hk-on-ink);
  background: var(--hk-ink);
  font-weight: 600;
}

.sb__subrow:focus-visible {
  outline: var(--px-stroke-2) solid var(--px-focus-ring);
  outline-offset: var(--px-hairline);
}

@media (min-width: 1024px) {
  .shell[data-collapsed] .sb__sub {
    display: none;
  }
}

.sb__search {
  border-radius: var(--px-radius-tile-lg);
  background: var(--hk-cell);
  min-height: 36px;
  box-shadow: var(--px-inset-hi);
  border: 0;
}

.sb__chat {
  border-radius: var(--px-radius-tile);
  color: var(--hk-text-2);
}

.sb__chat:hover, .sb__chat[aria-current="page"] {
  color: var(--hk-text);
  background: var(--hk-wash);
}

.px-button {
  border-radius: var(--px-radius-tile-lg);
  letter-spacing: -.01em;
  box-shadow: none;
  font-weight: 600;
}

.px-button--primary {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: #0000;
}

.px-button--primary:hover:not([disabled]) {
  background: var(--hk-ink-hover);
}

.px-button--secondary {
  background: var(--hk-thin);
  box-shadow: var(--px-inset-hi);
  color: var(--hk-text);
  -webkit-backdrop-filter: blur(var(--px-blur-surface));
  backdrop-filter: blur(var(--px-blur-surface));
  border-color: #0000;
}

.px-button--secondary:hover:not([disabled]) {
  background: var(--hk-cell);
  box-shadow: var(--px-inset-hi);
  border-color: #0000;
}

.px-button--ghost {
  color: var(--hk-text);
}

.px-button--ghost:hover:not([disabled]) {
  background: var(--hk-wash);
  color: var(--hk-text);
}

.px-button--danger {
  background: color-mix(in srgb, var(--hk-danger) 14%, transparent);
  color: var(--hk-danger);
  border-color: #0000;
}

.px-button:focus-visible {
  outline: var(--px-stroke-2) solid var(--px-focus-ring);
  outline-offset: var(--px-stroke-2);
}

.px-input, .px-select, .px-textarea {
  background: var(--hk-thin);
  box-shadow: var(--px-inset-hi);
  color: var(--hk-text);
  border-color: #0000;
}

.page-title {
  color: var(--hk-text);
  letter-spacing: -.02em;
}

.muted {
  color: var(--hk-text-2);
}

html .chat-msg--user .chat-msg__body {
  background: var(--hk-regular);
  color: var(--hk-text);
  box-shadow: var(--px-inset-hi);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html[data-theme="dark"]:has(.shell) .chat-msg--user .chat-msg__body {
  background: var(--hk-regular);
  color: var(--hk-text);
  box-shadow: var(--px-inset-hi);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html .chat-composer {
  background: var(--hk-regular);
  box-shadow: var(--px-shadow-xs);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
  border: 0;
}

html[data-theme="dark"]:has(.shell) .chat-composer {
  background: var(--hk-regular);
  box-shadow: var(--px-shadow-xs);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
  border: 0;
}

html .chat-sugg, html .chat-chip, html .chat-view, html .panel {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-regular);
  box-shadow: var(--hk-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html[data-theme="dark"]:has(.shell) .chat-sugg {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-regular);
  box-shadow: var(--hk-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html[data-theme="dark"]:has(.shell) .chat-chip {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-regular);
  box-shadow: var(--hk-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html[data-theme="dark"]:has(.shell) .chat-view {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-regular);
  box-shadow: var(--hk-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html[data-theme="dark"]:has(.shell) .panel {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-regular);
  box-shadow: var(--hk-shadow);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
}

html .shell-menu__pop {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-solid);
  border-radius: var(--px-radius-panel);
  box-shadow: var(--hk-shadow-pop);
}

html[data-theme="dark"]:has(.shell) .shell-menu__pop {
  border-color: var(--hk-stroke-2);
  background-image: none;
  background-color: var(--hk-solid);
  border-radius: var(--px-radius-panel);
  box-shadow: var(--hk-shadow-pop);
}

.fin {
  --fin-glass: var(--hk-regular);
  --fin-glass-strong: var(--hk-solid);
  --fin-line: var(--hk-stroke-2);
}

.fin .px-button {
  border-radius: var(--px-radius-tile);
}

.fin .px-button--sm {
  border-radius: var(--px-radius-control);
}

.fin-eyebrow {
  margin: 0 0 var(--px-space-px);
  font-size: var(--px-text-11);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--hk-text-3);
  font-weight: 600;
}

.fin-card, .fin-stat, .fin-gw, .fin-doc, .fin-modal__box {
  box-shadow: var(--px-shadow-xs);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  border: 0;
}

.fin-card {
  border-radius: var(--px-radius-panel);
  padding: var(--px-space-3-5) var(--px-space-4);
}

.fin-stat {
  border-radius: var(--px-radius-panel);
}

.fin-doc {
  background: var(--hk-solid);
  border-radius: var(--px-radius-panel);
}

.fin-modal__box {
  background: var(--hk-solid);
  border-radius: var(--px-radius-xl);
}

.fin-stat--link:hover, .fin-report-card:hover {
  background: var(--hk-solid);
  border-color: #0000;
}

.fin-stat__label, .fin-table th, .fin-lines__head, .fin-doc__type, .fin-rep-sec h3 {
  color: var(--hk-text-3);
}

.fin-link-btn {
  border-radius: var(--px-radius-tile);
  background: var(--hk-thin);
  box-shadow: var(--px-inset-hi);
  color: var(--hk-text);
  border: 0;
  font-weight: 600;
}

.fin-link-btn:hover {
  background: var(--hk-cell);
}

.fin-link-btn--primary {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  box-shadow: none;
}

.fin-link-btn--primary:hover {
  background: var(--hk-ink-hover);
}

.fin-textbtn {
  color: var(--hk-text);
  text-decoration: underline;
  -webkit-text-decoration-color: var(--hk-stroke);
  text-decoration-color: var(--hk-stroke);
  text-underline-offset: 3px;
  font-weight: 600;
}

.fin-textbtn:hover {
  background: var(--hk-wash);
  -webkit-text-decoration-color: var(--hk-text-2);
  text-decoration-color: var(--hk-text-2);
}

.fin-more:hover, .fin-list a:hover {
  color: var(--hk-text);
}

.fin-input {
  border-radius: var(--px-radius-tile);
  background: var(--hk-thin);
  box-shadow: var(--px-inset-hi);
  color: var(--hk-text);
  border: 0;
}

.fin-input::placeholder {
  color: var(--hk-text-3);
}

.fin-input:focus {
  box-shadow: var(--px-shadow-xs);
}

select.fin-input option {
  background: var(--hk-solid);
  color: var(--hk-text);
}

input[type="checkbox"], input[type="radio"] {
  accent-color: var(--hk-ink);
}

.fin-seg, .fin-tabs {
  border-radius: var(--px-radius-pill);
  background: var(--hk-thin);
  box-shadow: var(--px-inset-hi);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay));
  backdrop-filter: blur(var(--px-blur-overlay));
  border: 0;
}

.fin-seg button, .fin-tab {
  border-radius: var(--px-radius-pill);
}

.fin-seg button.on, .fin-tab--on {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  box-shadow: none;
}

.fin-tab:hover {
  background: var(--hk-wash);
}

.fin-tab--on:hover {
  background: var(--hk-ink);
}

.fin-insight {
  border-radius: var(--px-radius-tile-lg);
  background: var(--hk-cell);
  box-shadow: var(--px-shadow-xs);
  border: 0;
}

.fin-insight--warning, .fin-insight--danger {
  background: var(--hk-cell);
  box-shadow: var(--px-shadow-xs);
}

.fin-pill {
  border-radius: var(--px-radius-pill);
  padding: var(--px-space-px) var(--px-space-2);
}

.fin-pill--muted {
  background: var(--hk-wash-2);
  color: var(--hk-text-2);
}

.fin-click:hover td {
  background: var(--hk-wash);
}

.fin-gw--on {
  box-shadow: var(--px-shadow-xs);
}

.fin-gw__url code, .fin-note {
  background: var(--hk-wash);
}

.fin-note {
  color: var(--hk-text);
}

.fin-bar {
  background: var(--hk-wash-2);
}

.fin-lines__row--bill, .fin-lines__row {
  border-color: var(--hk-stroke-2);
}

.fin-crumbs a {
  -webkit-text-decoration-color: var(--hk-stroke);
  text-decoration-color: var(--hk-stroke);
}

.fin-modal {
  background: var(--px-overlay);
}

.fin-public {
  z-index: 1;
  position: relative;
}

@media (max-width: 760px) {
  .fin-lines__row, .fin-lines__row--bill {
    background: var(--hk-cell);
  }

  .fin-modal__box {
    border-radius: var(--px-radius-xl) var(--px-radius-xl) 0 0;
  }
}

html .shell-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hk-sky-top) 85%, transparent) 0%, color-mix(in srgb, var(--hk-sky-top) 0%, transparent) 100%);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  padding: calc(env(safe-area-inset-top) + var(--px-space-2)) var(--px-space-3) var(--px-space-2);
  min-height: calc(60px + env(safe-area-inset-top));
  gap: var(--px-space-2-5);
  border-bottom: 0;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
}

html[data-theme="dark"]:has(.shell) .shell-head {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hk-sky-top) 85%, transparent) 0%, color-mix(in srgb, var(--hk-sky-top) 0%, transparent) 100%);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  padding: calc(env(safe-area-inset-top) + var(--px-space-2)) var(--px-space-3) var(--px-space-2);
  min-height: calc(60px + env(safe-area-inset-top));
  gap: var(--px-space-2-5);
  border-bottom: 0;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
}

.shell-head .sb__icon {
  border-radius: var(--px-radius-pill);
  background: var(--hk-regular);
  width: 44px;
  height: 44px;
  box-shadow: var(--px-shadow-xs);
  color: var(--hk-text);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
}

.shell-head .sb__icon:hover {
  background: var(--hk-solid);
}

.shell-head__title {
  justify-content: center;
  display: flex;
}

.shell-head__name, .shell-head__h1 {
  max-width: 100%;
  padding: var(--px-space-2-5) var(--px-space-5);
  border-radius: var(--px-radius-pill);
  background: var(--hk-regular);
  box-shadow: var(--px-shadow-xs);
  color: var(--hk-text);
  font-size: var(--px-text-14);
  letter-spacing: -.01em;
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(140%);
  font-weight: 600;
  display: inline-block;
}

@media (min-width: 1024px) {
  html .shell-head {
    padding: var(--px-space-2-5) var(--px-space-4) var(--px-space-1-5);
    min-height: 56px;
  }

  html[data-theme="dark"]:has(.shell) .shell-head {
    padding: var(--px-space-2-5) var(--px-space-4) var(--px-space-1-5);
    min-height: 56px;
  }

  .shell-head .sb__icon {
    width: 38px;
    height: 38px;
  }

  .shell-head__name, .shell-head__h1 {
    padding: var(--px-space-2) var(--px-space-4);
    font-size: var(--px-text-14);
  }
}

.shell {
  letter-spacing: -.006em;
  font-weight: 500;
}

.shell .muted, .shell .fin-sub, .shell .fin-stat__sub {
  font-weight: 500;
}

.fin-card__title, .fin-stat__value, .page-title {
  font-weight: 650;
}

.fin-head .page-title {
  font-family: var(--px-font-sans);
  font-size: var(--px-text-28);
  letter-spacing: -.03em;
}

@media (max-width: 760px) {
  .fin-card {
    border-radius: var(--px-radius-xl);
    padding: var(--px-space-3-5) var(--px-space-4);
  }

  .fin-stat {
    border-radius: var(--px-radius-panel);
  }

  .fin .px-button, .fin-link-btn {
    border-radius: var(--px-radius-pill);
    height: auto;
    min-height: 38px;
    padding: 0 var(--px-space-4);
  }

  .fin .px-button--sm {
    min-height: var(--px-space-8);
    border-radius: var(--px-radius-pill);
  }

  .fin-input {
    border-radius: var(--px-radius-card);
  }

  .fin-insight {
    border-radius: var(--px-radius-panel);
  }
}

.fin-row-actions {
  flex-wrap: nowrap;
}

.fin-table td.fin-date, .fin-table--rows td:first-child {
  white-space: nowrap;
}

.fin-table td .muted, .fin-table td.muted {
  font-size: var(--px-text-12);
}

.sb__row--group {
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
}

.sb__chev {
  opacity: .55;
  flex: none;
  margin-left: auto;
  transition: transform .18s;
}

.sb__item--open > .sb__row--group .sb__chev {
  transform: rotate(90deg);
}

.sb__row--group[data-here]:not([aria-expanded="true"]) {
  background: var(--hk-regular);
  box-shadow: var(--px-inset-hi);
}

.sb__row--group[aria-expanded="true"] {
  box-shadow: none;
  background: none;
}

.sb__sub[hidden] {
  display: none;
}

.sb__sub {
  animation: .16s sb-sub-in;
}

@keyframes sb-sub-in {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.shell[data-collapsed] .sb__chev, .sb--collapsed .sb__chev {
  display: none;
}

html .shell .sb, html .shell[data-open] .sb {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hk-sky-top) 72%, transparent), color-mix(in srgb, var(--hk-sky-bottom) 72%, transparent));
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  color: var(--hk-text);
}

html[data-theme="dark"]:has(.shell) .shell .sb {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hk-sky-top) 72%, transparent), color-mix(in srgb, var(--hk-sky-bottom) 72%, transparent));
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  color: var(--hk-text);
}

html[data-theme="dark"]:has(.shell) .shell[data-open] .sb {
  background: linear-gradient(180deg, color-mix(in srgb, var(--hk-sky-top) 72%, transparent), color-mix(in srgb, var(--hk-sky-bottom) 72%, transparent));
  border-right: var(--px-hairline) solid var(--hk-stroke-2);
  color: var(--hk-text);
}

@media (max-width: 1023px) {
  html .shell[data-open] .sb, html[data-theme="dark"] .shell[data-open] .sb {
    background: linear-gradient(180deg, var(--hk-sky-top), var(--hk-sky-bottom));
    box-shadow: var(--px-shadow-pop);
  }

  html[data-theme="dark"]:has(.shell) .shell[data-open] .sb {
    background: linear-gradient(180deg, var(--hk-sky-top), var(--hk-sky-bottom));
    box-shadow: var(--px-shadow-pop);
  }
}

.sb .sb__row, .sb .sb__subrow, .sb .sb__label, .sb .sb__empty, .sb .sb__group-title {
  color: var(--hk-text);
}

.sb .sb__subrow:not([aria-current="page"]), .sb .sb__empty {
  color: color-mix(in srgb, var(--hk-text) 68%, transparent);
}

.sb .sb__row:hover, .sb .sb__subrow:hover:not([aria-current="page"]) {
  background: var(--hk-thin);
}

.sb .sb__row[aria-current="page"], .sb .sb__row--group[data-here]:not([aria-expanded="true"]) {
  background: var(--hk-regular);
  box-shadow: var(--px-inset-hi);
}

.sb .sb__subrow[aria-current="page"] {
  background: var(--hk-fill, var(--hk-text));
  color: var(--hk-on-fill, var(--hk-solid));
}

.chat-confirm {
  border: var(--px-hairline) solid color-mix(in oklab, currentColor 18%, transparent);
}

.chat-confirm__eyebrow {
  margin: 0 0 var(--px-space-0-5);
  font-size: var(--px-text-11);
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .65;
}

.chat-confirm__actions {
  gap: var(--px-space-2);
  margin-top: var(--px-space-3);
  flex-wrap: wrap;
  display: flex;
}

.chat-confirm__actions button {
  min-height: 36px;
  padding: 0 var(--px-space-4);
  border-radius: var(--px-radius-pill);
  font: inherit;
  font-weight: 600;
  font-size: var(--px-text-14);
  cursor: pointer;
}

.chat-confirm__yes {
  background: var(--px-surface-solid);
  color: var(--px-text-on-brand);
  border: var(--px-hairline) solid var(--px-border-strong);
}

.chat-confirm__no {
  color: inherit;
  border: var(--px-hairline) solid color-mix(in oklab, currentColor 28%, transparent);
  background: none;
}

.chat-confirm__yes:focus-visible, .chat-confirm__no:focus-visible {
  outline: var(--px-stroke-2) solid currentColor;
  outline-offset: var(--px-stroke-2);
}

.chat-confirm__done {
  margin: var(--px-space-2-5) 0 0;
  font-size: var(--px-text-13);
}

html[data-theme="dark"] .chat-confirm__yes {
  background: var(--px-surface-solid);
  color: var(--px-text-primary);
  border-color: var(--px-card-border);
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .chat-confirm__yes {
    background: var(--px-surface-solid);
    color: var(--px-text-primary);
    border-color: var(--px-card-border);
  }
}

.crm .fin-actions--scroll {
  scrollbar-width: none;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.crm .fin-actions--scroll::-webkit-scrollbar {
  display: none;
}

.crm-h2 {
  margin: var(--px-space-1) 0 0;
  font-size: var(--px-text-14);
  font-weight: 600;
}

.crm-anchor {
  scroll-margin-top: 72px;
}

.crm-click {
  cursor: pointer;
}

.crm-sort {
  width: auto;
  min-width: 140px;
}

.crm-clip {
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  max-width: 46ch;
  display: -webkit-box;
  overflow: hidden;
}

.crm-tags {
  gap: var(--px-space-1);
  margin-top: var(--px-space-0-5);
  flex-wrap: wrap;
  display: flex;
}

.crm-tag {
  padding: var(--px-space-px) var(--px-space-2);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-11);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  color: var(--hk-text-2);
  white-space: nowrap;
  align-items: center;
  font-weight: 500;
  display: inline-flex;
}

button.crm-tag {
  cursor: pointer;
  font: inherit;
  font-size: var(--px-text-11);
}

.crm-tags--edit {
  align-items: center;
}

.crm-tag-input {
  width: 110px;
  height: 26px;
  min-height: 26px;
  font-size: var(--px-text-12);
  border-radius: var(--px-radius-pill);
}

.crm-chips {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  display: flex;
}

.crm-chip {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  border-radius: var(--px-radius-pill);
  padding: var(--px-space-1) var(--px-space-2-5);
  font: inherit;
  font-size: var(--px-text-12-5);
  cursor: pointer;
}

.crm-chip--on {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: var(--hk-ink);
}

.crm-chip--off {
  color: var(--hk-danger);
  border-color: color-mix(in srgb, var(--hk-danger) 40%, transparent);
}

.crm-chip--won {
  color: var(--hk-success);
}

.crm-chip--lost {
  color: var(--hk-danger);
}

.crm-consent {
  gap: var(--px-space-1-5);
  margin-bottom: var(--px-space-1-5);
  flex-wrap: wrap;
  display: flex;
}

.crm-check {
  align-items: flex-start;
  gap: var(--px-space-2);
  font-size: var(--px-text-13);
  cursor: pointer;
  display: inline-flex;
}

.crm-check input {
  margin-top: var(--px-space-0-5);
  accent-color: var(--hk-ink);
}

.crm-switch {
  align-items: center;
  gap: var(--px-space-2);
  font-size: var(--px-text-12-5);
  color: var(--hk-text-2);
  display: inline-flex;
}

.crm-switch input {
  accent-color: var(--hk-ink);
  width: var(--px-space-4);
  height: var(--px-space-4);
}

.crm-inline {
  gap: var(--px-space-1-5);
  align-items: center;
  display: flex;
}

.crm-inline .fin-input {
  flex: 1;
  min-width: 0;
}

.crm-two {
  gap: var(--px-space-3);
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

.crm-dl {
  gap: var(--px-space-1-5) var(--px-space-3);
  margin: 0 0 var(--px-space-3);
  font-size: var(--px-text-13);
  grid-template-columns: 90px minmax(0, 1fr);
  display: grid;
}

.crm-dl dt {
  color: var(--hk-text-3);
}

.crm-dl dd {
  margin: 0;
}

.crm-hp {
  width: var(--px-space-px);
  height: var(--px-space-px);
  opacity: 0;
  position: absolute;
  left: -9999px;
}

.crm-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--px-text-11);
}

.crm-seglink {
  padding: var(--px-space-1) var(--px-space-2-5);
  border-radius: var(--px-radius-sm);
  font-size: var(--px-text-12-5);
  color: var(--hk-text-2);
  text-decoration: none;
  display: inline-block;
}

.crm-seglink.on {
  background: var(--fin-glass-strong);
  color: var(--hk-text);
  box-shadow: var(--px-shadow-xs);
  font-weight: 600;
}

.crm-hero {
  gap: var(--px-space-3-5);
  flex-wrap: wrap;
  align-items: flex-start;
  display: flex;
}

.crm-hero__main {
  flex: 1;
  min-width: 0;
}

.crm-hero__main h2 {
  margin: 0 0 var(--px-space-1);
  font-size: var(--px-text-19);
  letter-spacing: -.01em;
  line-height: 1.2;
}

.crm-hero__meta {
  gap: var(--px-space-1-5) var(--px-space-2-5);
  font-size: var(--px-text-12-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.crm-hero__meta a {
  color: inherit;
  font-weight: 500;
}

.crm-hero__contact {
  gap: var(--px-space-1) var(--px-space-3-5);
  margin-top: var(--px-space-1-5);
  font-size: var(--px-text-13);
  flex-wrap: wrap;
  display: flex;
}

.crm-hero__contact a {
  color: var(--hk-text);
}

.crm-hero__value {
  font-size: var(--px-text-20);
  margin-top: var(--px-space-1-5);
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

.crm-hero__actions {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  display: flex;
}

.crm-avatar {
  width: var(--px-space-12);
  height: var(--px-space-12);
  font-weight: 650;
  font-size: var(--px-text-16);
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-radius: 50%;
  flex: none;
  place-items: center;
  display: grid;
}

.crm-avatar--sm {
  width: 34px;
  height: 34px;
  font-size: var(--px-text-13);
}

.crm-feed {
  gap: var(--px-space-2-5);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.crm-feed li {
  gap: var(--px-space-2-5);
  font-size: var(--px-text-13);
  grid-template-columns: 10px minmax(0, 1fr);
  display: grid;
}

.crm-feed a {
  color: inherit;
}

.crm-feed__text {
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.crm-dot {
  width: var(--px-space-2);
  height: var(--px-space-2);
  margin-top: var(--px-space-1-5);
  background: var(--hk-text-3);
  border-radius: 50%;
}

.crm-dot--call, .crm-dot--meeting {
  background: var(--hk-info);
}

.crm-dot--followup, .crm-dot--task {
  background: var(--hk-warning);
}

.crm-dot--in {
  background: var(--hk-success);
}

.crm-dot--out, .crm-dot--message {
  background: var(--hk-ink);
}

.crm-bars {
  gap: var(--px-space-2);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.crm-bars__row {
  font-size: var(--px-text-12-5);
  margin-bottom: var(--px-space-0-5);
  justify-content: space-between;
  display: flex;
}

.crm-board {
  gap: var(--px-space-2-5);
  padding-bottom: var(--px-space-1-5);
  scroll-snap-type: x mandatory;
  scrollbar-width: thin;
  grid-auto-columns: minmax(230px, 1fr);
  grid-auto-flow: column;
  display: grid;
  overflow-x: auto;
}

.crm-col {
  border-radius: var(--px-radius-tile-lg);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  scroll-snap-align: start;
  min-height: 200px;
  -webkit-backdrop-filter: blur(var(--hk-blur, var(--px-blur-surface)));
  backdrop-filter: blur(var(--hk-blur, var(--px-blur-surface)));
  flex-direction: column;
  display: flex;
}

.crm-col__head {
  justify-content: space-between;
  gap: var(--px-space-2);
  padding: var(--px-space-2-5) var(--px-space-3) var(--px-space-1-5);
  font-size: var(--px-text-13);
  display: flex;
}

.crm-col--won .crm-col__head strong {
  color: var(--hk-success);
}

.crm-col--lost .crm-col__head strong {
  color: var(--hk-danger);
}

.crm-col__body {
  gap: var(--px-space-2);
  padding: var(--px-space-1) var(--px-space-2) var(--px-space-2-5);
  flex-direction: column;
  display: flex;
}

.crm-col__empty {
  font-size: var(--px-text-12);
  padding: var(--px-space-2) var(--px-space-1);
  margin: 0;
}

.crm-deal {
  border-radius: var(--px-radius-tile);
  padding: var(--px-space-2) var(--px-space-2-5);
  background: var(--hk-regular);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  box-shadow: var(--hk-shadow, none);
  cursor: grab;
  font-size: var(--px-text-13);
  position: relative;
}

.crm-deal:hover {
  background: var(--hk-solid);
}

.crm-deal__title {
  overflow-wrap: anywhere;
  padding-right: var(--px-space-6);
  font-weight: 600;
}

.crm-deal__foot {
  margin-top: var(--px-space-1-5);
  font-variant-numeric: tabular-nums;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.crm-deal__move {
  top: var(--px-space-1-5);
  right: var(--px-space-1-5);
  opacity: .55;
  border-radius: var(--px-radius-sm);
  color: #0000;
  cursor: pointer;
  appearance: none;
  background: none;
  background-image: radial-gradient(circle, var(--hk-text-2) 1.4px, transparent 1.6px);
  background-position: center;
  background-repeat: repeat-x;
  background-size: 6px 6px;
  border: 0;
  width: 22px;
  height: 22px;
  position: absolute;
}

.crm-deal__move:focus-visible {
  outline: var(--px-stroke-2) solid var(--hk-ink);
  opacity: 1;
}

.crm-deal__move option {
  color: var(--hk-text);
  background: var(--hk-solid);
}

.crm-stepper {
  gap: var(--px-space-1);
  scrollbar-width: none;
  display: flex;
  overflow-x: auto;
}

.crm-stepper::-webkit-scrollbar {
  display: none;
}

.crm-step {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text-2);
  border-radius: var(--px-radius-pill);
  padding: var(--px-space-1-5) var(--px-space-3);
  font: inherit;
  font-size: var(--px-text-12-5);
  cursor: pointer;
  white-space: nowrap;
  flex: 1 0 auto;
}

.crm-step--on {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: var(--hk-ink);
  font-weight: 600;
}

.crm-step--won.crm-step--on {
  background: var(--hk-success);
  border-color: var(--hk-success);
  color: var(--px-text-on-brand);
}

.crm-step--lost.crm-step--on {
  background: var(--hk-danger);
  border-color: var(--hk-danger);
  color: var(--px-text-on-brand);
}

.crm-item-row {
  gap: var(--px-space-1-5);
  grid-template-columns: minmax(0, 2fr) 70px minmax(0, 1fr) 28px;
  align-items: center;
  display: grid;
}

.crm-picker {
  position: relative;
}

.crm-picker__list {
  z-index: 20;
  left: 0;
  right: 0;
  top: calc(100% + var(--px-space-1));
  padding: var(--px-space-1);
  border-radius: var(--px-radius-tile);
  background: var(--hk-solid);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  box-shadow: var(--px-shadow-card);
  max-height: 240px;
  margin: 0;
  list-style: none;
  position: absolute;
  overflow: auto;
}

.crm-picker__list button {
  width: 100%;
  padding: var(--px-space-1-5) var(--px-space-2);
  border-radius: var(--px-radius-sm);
  font: inherit;
  font-size: var(--px-text-13);
  color: var(--hk-text);
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}

.crm-picker__list button:hover {
  background: var(--hk-thin);
}

.crm-dup {
  gap: var(--px-space-1) var(--px-space-2-5);
  font-size: var(--px-text-13);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.crm-inbox {
  margin: 0;
  padding: 0;
  list-style: none;
}

.crm-inbox li + li {
  border-top: var(--px-hairline) solid var(--fin-line);
}

.crm-inbox a {
  gap: var(--px-space-2-5);
  padding: var(--px-space-2) var(--px-space-0-5);
  color: inherit;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  text-decoration: none;
  display: grid;
}

.crm-inbox__main {
  min-width: 0;
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.crm-inbox__top {
  justify-content: space-between;
  gap: var(--px-space-2);
  display: flex;
}

.crm-inbox__tags {
  align-items: flex-end;
  gap: var(--px-space-0-5);
  flex-direction: column;
  display: flex;
}

.crm-thread {
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.crm-bubble {
  max-width: min(560px, 88%);
  padding: var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-card);
  font-size: var(--px-text-13);
  white-space: pre-line;
  overflow-wrap: anywhere;
  background: var(--hk-regular);
  border: var(--px-hairline) solid var(--hk-stroke-2);
}

.crm-bubble--in {
  border-bottom-left-radius: var(--px-radius-xs);
  align-self: flex-start;
}

.crm-bubble--out {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: var(--hk-ink);
  border-bottom-right-radius: var(--px-radius-xs);
  align-self: flex-end;
}

.fin-list .crm-bubble--out {
  align-self: stretch;
  max-width: none;
}

.crm-bubble--bad {
  opacity: .6;
  text-decoration: line-through;
}

.crm-bubble__meta {
  margin-top: var(--px-space-1);
  font-size: var(--px-text-11);
  opacity: .7;
}

.crm-composer {
  gap: var(--px-space-2);
  align-items: flex-end;
  display: flex;
}

.crm-composer textarea {
  flex: 1;
  min-width: 0;
}

.crm-qr {
  padding: var(--px-space-2-5);
  background: var(--px-surface-solid);
  border-radius: var(--px-radius-tile-lg);
  aspect-ratio: 1;
  width: 240px;
  max-width: 100%;
  margin: 0 auto var(--px-space-2-5);
  place-items: center;
  display: grid;
}

.crm-qr svg {
  width: 100%;
  height: auto;
}

.crm-public {
  min-height: 100dvh;
  padding: var(--px-space-6) var(--px-space-4);
  background: linear-gradient(180deg, var(--hk-sky-top, var(--px-brand)), var(--hk-sky-bottom, var(--px-accent)));
  color: var(--hk-text, var(--px-text-primary));
  place-items: center;
  display: grid;
}

.crm-public--embed {
  background: none;
  min-height: 0;
  padding: 0;
}

.crm-public__card {
  width: 100%;
  max-width: 420px;
  padding: var(--px-space-5);
  border-radius: var(--px-radius-xl);
  background: var(--hk-regular, var(--px-surface-card));
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-default));
  box-shadow: var(--px-shadow-pop);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(1.6);
  backdrop-filter: blur(var(--px-blur-surface)) saturate(1.6);
}

.crm-public__card h1 {
  margin: 0 0 var(--px-space-3-5);
  font-size: var(--px-text-20);
  letter-spacing: -.01em;
}

.crm-public__card form {
  gap: var(--px-space-2-5);
  flex-direction: column;
  display: flex;
}

.crm-public__card .fin-input {
  border-radius: var(--px-radius-tile-lg);
  width: 100%;
  min-height: 42px;
  padding: 0 var(--px-space-3);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-default));
  background: var(--hk-solid, var(--px-surface-solid));
  color: inherit;
  font: inherit;
}

.crm-public__card textarea.fin-input {
  padding: var(--px-space-2-5) var(--px-space-3);
}

.crm-public__card .px-button {
  border-radius: var(--px-radius-pill);
  background: var(--hk-ink, var(--px-surface-solid));
  min-height: 44px;
  color: var(--hk-on-ink, var(--px-text-on-brand));
}

.crm-public__company {
  margin: 0 0 var(--px-space-1);
  font-size: var(--px-text-12);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--hk-text-3, var(--px-text-tertiary));
}

.crm-public__fine {
  font-size: var(--px-text-11);
  color: var(--hk-text-3, var(--px-text-tertiary));
  margin: var(--px-space-1) 0 0;
}

.crm-rate {
  gap: var(--px-space-1-5);
  margin-bottom: var(--px-space-3);
  justify-content: center;
  display: flex;
}

.crm-rate button {
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-card-border));
  background: var(--hk-solid, var(--px-surface-solid));
  width: 44px;
  height: 44px;
  font-size: var(--px-text-20);
  cursor: pointer;
  color: var(--hk-text-3, var(--px-text-tertiary));
}

.crm-rate button.on, .crm-rate:not(.crm-rate--nps) button.on ~ button {
  color: var(--hk-text-3, var(--px-text-tertiary));
}

.crm-rate:not(.crm-rate--nps):has(button.on) button {
  color: var(--px-warning);
}

.crm-rate:not(.crm-rate--nps) button.on ~ button {
  color: var(--hk-text-3, var(--px-text-tertiary)) !important;
}

.crm-rate--nps {
  flex-wrap: wrap;
}

.crm-rate--nps button {
  width: 34px;
  height: 38px;
  font-size: var(--px-text-14);
}

.crm-rate--nps button.on {
  background: var(--hk-ink, var(--px-surface-solid));
  color: var(--hk-on-ink, var(--px-text-on-brand));
}

@media (max-width: 900px) {
  .crm-two {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 640px) {
  .crm-board {
    grid-auto-columns: 82vw;
  }

  .crm-hero {
    gap: var(--px-space-2-5);
  }

  .crm-avatar {
    width: var(--px-space-10);
    height: var(--px-space-10);
    font-size: var(--px-text-14);
  }

  .crm-hero__actions {
    width: 100%;
  }

  .crm-hero__actions .px-button {
    flex: 1;
  }

  .crm-item-row {
    grid-template-columns: minmax(0, 1fr) 56px 28px;
  }

  .crm-item-row > :nth-child(3) {
    grid-column: 1 / 3;
  }

  .crm-sort {
    flex: 1;
    min-width: 0;
  }

  .crm .fin-filters > .fin-input:first-child, .crm .fin-filters > input.fin-input {
    flex-basis: 100%;
  }
}

@media print {
  .crm-hero__actions, .crm .fin-actions, .crm .fin-filters {
    display: none !important;
  }
}

.crm-find {
  gap: var(--px-space-2);
  margin-top: var(--px-space-2-5);
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) auto;
  align-items: center;
  display: grid;
}

.crm-find .fin-input {
  min-width: 0;
}

.crm-reports {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  display: grid;
}

.crm-report-tile {
  gap: var(--px-space-1);
  color: var(--hk-text);
  background: var(--hk-regular);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(1.5);
  backdrop-filter: blur(var(--px-blur-surface)) saturate(1.5);
  box-shadow: var(--px-shadow-xs);
  flex-direction: column;
  text-decoration: none;
  transition: transform .12s, border-color .12s;
  display: flex;
}

.crm-report-tile strong {
  font-size: var(--px-text-14);
  font-weight: 600;
}

.crm-report-tile:hover {
  border-color: var(--hk-ink);
  transform: translateY(-1px);
}

.crm-report-tile:focus-visible {
  outline: var(--px-stroke-2) solid var(--hk-ink);
  outline-offset: var(--px-stroke-2);
}

@media (max-width: 640px) {
  .crm-find {
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-find .px-button {
    width: 100%;
  }

  .crm-reports {
    gap: var(--px-space-2);
    grid-template-columns: minmax(0, 1fr);
  }

  .crm-report-tile {
    padding: var(--px-space-2-5) var(--px-space-3);
  }
}

@media (prefers-reduced-motion: reduce) {
  .crm-report-tile {
    transition: none;
  }

  .crm-report-tile:hover {
    transform: none;
  }
}

@media print {
  .crm-report .fin-crumbs {
    display: none;
  }
}

.hrm .fin-actions--scroll {
  scrollbar-width: none;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.hrm-person {
  align-items: center;
  gap: var(--px-space-2);
  color: inherit;
  text-decoration: none;
  display: inline-flex;
}

.hrm-avatar {
  width: 30px;
  height: 30px;
  font-size: var(--px-text-11);
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-radius: 50%;
  flex: none;
  place-items: center;
  font-weight: 650;
  display: grid;
}

.hrm-linkbtn {
  font: inherit;
  color: var(--hk-text);
  text-align: left;
  cursor: pointer;
  text-decoration: underline;
  -webkit-text-decoration-color: var(--hk-stroke-2);
  text-decoration-color: var(--hk-stroke-2);
  text-underline-offset: 3px;
  background: none;
  border: 0;
  padding: 0;
}

.hrm-chiplink {
  margin: 0 var(--px-space-1-5) var(--px-space-1) 0;
  padding: var(--px-space-px) var(--px-space-2);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  font-size: var(--px-text-12);
  text-decoration: none;
  display: inline-block;
}

.hrm-onb {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  display: grid;
}

.hrm-onb__card {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2-5) var(--px-space-3);
  background: var(--hk-thin);
}

.hrm-onb__head {
  margin-bottom: var(--px-space-1-5);
  flex-direction: column;
  display: flex;
}

.hrm-onb__head a {
  color: inherit;
}

.hrm-letter {
  white-space: pre-wrap;
  font: inherit;
  font-size: var(--px-text-13);
  padding: var(--px-space-3-5);
  border-radius: var(--px-radius-tile);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  max-height: 60vh;
  margin: 0;
  line-height: 1.55;
  overflow: auto;
}

.hrm-paste {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--px-text-12);
  margin-top: var(--px-space-2);
}

.hrm-pre {
  white-space: pre-line;
}

.hrm-days {
  gap: var(--px-space-1);
  flex-wrap: wrap;
  display: flex;
}

.hrm-day {
  border-radius: var(--px-radius-md);
  width: 30px;
  height: 30px;
  font-size: var(--px-text-11);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  place-items: center;
  font-weight: 600;
  display: grid;
}

.hrm-day--present {
  background: color-mix(in srgb, var(--hk-success) 22%, transparent);
}

.hrm-day--late {
  background: color-mix(in srgb, var(--hk-warning, var(--px-warning)) 28%, transparent);
}

.hrm-day--absent {
  background: color-mix(in srgb, var(--hk-danger) 24%, transparent);
}

.hrm-org {
  padding-bottom: var(--px-space-1-5);
  overflow-x: auto;
}

.hrm-org ul {
  padding-left: var(--px-space-5);
  margin: 0;
  list-style: none;
  position: relative;
}

.hrm-org > ul {
  padding-left: 0;
}

.hrm-org li {
  padding: var(--px-space-1) 0 var(--px-space-1) var(--px-space-3-5);
  position: relative;
}

.hrm-org > ul > li {
  padding-left: 0;
}

.hrm-org ul ul li:before {
  content: "";
  border-left: var(--px-hairline) solid var(--hk-stroke-2);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.hrm-org ul ul li:last-child:before {
  height: 26px;
  bottom: auto;
}

.hrm-org ul ul li:after {
  content: "";
  left: 0;
  top: var(--px-space-6);
  width: var(--px-space-3);
  border-top: var(--px-hairline) solid var(--hk-stroke-2);
  position: absolute;
}

.hrm-node {
  align-items: center;
  gap: var(--px-space-2-5);
  padding: var(--px-space-1-5) var(--px-space-3) var(--px-space-1-5) var(--px-space-2);
  border-radius: var(--px-radius-tile-lg);
  background: var(--fin-glass-strong, var(--hk-thin));
  border: var(--px-hairline) solid var(--hk-stroke-2);
  color: inherit;
  min-width: 220px;
  box-shadow: var(--px-shadow-xs);
  text-decoration: none;
  display: inline-flex;
}

.hrm-node > span:last-child {
  min-width: 0;
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.hrm-node__tags {
  gap: var(--px-space-1);
  margin-top: var(--px-space-0-5);
  flex-wrap: wrap;
  display: flex;
}

.hrm-opening {
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.hrm-app {
  text-align: left;
  gap: var(--px-space-0-5);
  cursor: pointer;
  width: 100%;
  font: inherit;
  color: inherit;
  flex-direction: column;
  display: flex;
}

.hrm-app__top {
  justify-content: space-between;
  gap: var(--px-space-2);
  align-items: center;
  display: flex;
}

.hrm-score {
  min-width: 30px;
  height: 22px;
  padding: 0 var(--px-space-1-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-11);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  flex: none;
  place-items: center;
  font-weight: 700;
  display: grid;
}

.hrm-score--hi {
  background: color-mix(in srgb, var(--hk-success) 24%, transparent);
}

.hrm-score--mid {
  background: color-mix(in srgb, var(--hk-warning, var(--px-warning)) 24%, transparent);
}

.hrm-score--lo {
  background: color-mix(in srgb, var(--hk-danger) 18%, transparent);
}

.hrm-why {
  font-size: var(--px-text-11);
  color: var(--hk-text-2);
  line-height: 1.35;
}

.hrm-why--no {
  color: var(--hk-text-3);
}

.hrm-reasons {
  margin: 0 0 var(--px-space-2-5);
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  padding: 0;
  list-style: none;
  display: flex;
}

.hrm-cv {
  margin: var(--px-space-1-5) 0 var(--px-space-2-5);
  font-size: var(--px-text-13);
}

.hrm-cv summary {
  cursor: pointer;
  color: var(--hk-text-2);
}

.hrm-today {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  display: grid;
}

.hrm-today__head {
  font-size: var(--px-text-12-5);
  margin-bottom: var(--px-space-1);
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
  display: flex;
}

.hrm-clock {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  display: flex;
}

.hrm-clock__time {
  font-size: var(--px-text-28);
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

.hrm-clock button {
  min-width: 120px;
  min-height: 44px;
}

.hrm-rota {
  overflow-x: auto;
}

.hrm-rota td, .hrm-rota th {
  white-space: nowrap;
  font-size: var(--px-text-12-5);
  vertical-align: top;
}

.hrm-rota__gap td:first-child {
  color: var(--hk-danger);
  font-weight: 600;
}

.hrm-shift {
  align-items: center;
  gap: var(--px-space-1);
  padding: var(--px-space-0-5) var(--px-space-1-5);
  margin: var(--px-space-px) var(--px-space-0-5);
  border-radius: var(--px-radius-sm);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  font-variant-numeric: tabular-nums;
  display: inline-flex;
}

.hrm-shift button {
  padding: 0 var(--px-space-0-5);
  color: var(--hk-text-3);
  cursor: pointer;
  font: inherit;
  background: none;
  border: 0;
}

.hrm-leave > span:first-child {
  min-width: 0;
}

.hrm-flag {
  margin: var(--px-space-0-5) var(--px-space-1) 0 0;
  color: var(--hk-danger);
  border-color: color-mix(in srgb, var(--hk-danger) 35%, transparent);
}

.hrm-paylines td {
  vertical-align: top;
}

.hrm-range {
  width: 100%;
  accent-color: var(--hk-ink);
}

.hrm-narrow {
  max-width: 80px;
}

.hrm-slip {
  max-width: 760px;
}

.hrm-slip__head {
  justify-content: space-between;
  gap: var(--px-space-3);
  margin-bottom: var(--px-space-3);
  align-items: flex-start;
  display: flex;
}

.hrm-slip__head h2 {
  font-size: var(--px-text-18);
  margin: 0;
}

.hrm-slip__cols {
  gap: var(--px-space-4);
  grid-template-columns: 1fr 1fr;
  display: grid;
}

.hrm-slip__cols h3 {
  margin: var(--px-space-1-5) 0;
  font-size: var(--px-text-13);
  color: var(--hk-text-2);
  font-weight: 600;
}

.hrm-slip__net {
  margin-top: var(--px-space-3);
  padding: var(--px-space-3) var(--px-space-3-5);
  border-radius: var(--px-radius-tile-lg);
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  justify-content: space-between;
  align-items: baseline;
  display: flex;
}

.hrm-slip__net strong {
  font-size: var(--px-text-20);
}

@media (max-width: 720px) {
  .hrm-today {
    grid-template-columns: 1fr 1fr;
  }

  .hrm-slip__cols {
    grid-template-columns: 1fr;
  }

  .hrm-node {
    min-width: 180px;
  }
}

@media print {
  .hrm .fin-actions, .hrm .fin-filters, .hrm .fin-crumbs {
    display: none !important;
  }

  .hrm-slip__net {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    background: var(--px-surface-solid) !important;
    color: var(--px-text-on-brand) !important;
  }
}

.hrm .crm-hero__name {
  font-size: var(--px-text-18);
  margin: 0;
  font-weight: 650;
}

.cms .fin-actions--scroll {
  scrollbar-width: none;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.cms--wide .fin-page {
  max-width: none;
}

.cms-spark {
  align-items: flex-end;
  gap: var(--px-space-0-5);
  height: 70px;
  margin: var(--px-space-0-5) 0 var(--px-space-3);
  display: flex;
}

.cms-spark span {
  border-radius: var(--px-radius-xs) var(--px-radius-xs) 0 0;
  background: var(--hk-ink);
  opacity: .55;
  flex: 1;
  min-width: 3px;
}

.cms-spark span:hover {
  opacity: .9;
}

.cms-urls {
  gap: var(--px-space-2) var(--px-space-5);
  margin-bottom: var(--px-space-2-5);
  flex-wrap: wrap;
  display: flex;
}

.cms-urls > div {
  gap: var(--px-space-0-5);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.cms-urls a {
  color: var(--hk-text);
  overflow-wrap: anywhere;
  font-weight: 600;
}

.cms-nav {
  margin: 0 0 var(--px-space-2);
  gap: var(--px-space-1-5);
  flex-direction: column;
  padding: 0;
  list-style: none;
  display: flex;
}

.cms-nav li {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.cms-nav li .fin-input {
  flex: 120px;
  min-width: 0;
}

.cms-themes {
  gap: var(--px-space-2);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  display: grid;
}

.cms-theme {
  gap: var(--px-space-0-5);
  text-align: left;
  padding: var(--px-space-2);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  font: inherit;
  cursor: pointer;
  flex-direction: column;
  display: flex;
}

.cms-theme.on {
  border-color: var(--hk-ink);
  box-shadow: var(--px-shadow-xs);
}

.cms-theme:disabled {
  cursor: default;
}

.cms-theme__art {
  gap: var(--px-space-1);
  height: var(--px-space-16);
  padding: var(--px-space-2);
  border-radius: var(--px-radius-md);
  background: var(--px-surface-solid);
  margin-bottom: var(--px-space-1);
  flex-direction: column;
  display: flex;
}

.cms-theme__art i {
  border-radius: var(--px-radius-xs);
  background: color-mix(in srgb, var(--a) 40%, var(--px-surface-solid));
  height: 22px;
  display: block;
}

.cms-theme__art b {
  height: var(--px-space-1-5);
  border-radius: var(--px-radius-xs);
  background: var(--px-fill-pressed);
  width: 70%;
  display: block;
}

.cms-theme--bold .cms-theme__art {
  background: var(--px-surface-solid);
  border-radius: var(--px-radius-xs);
}

.cms-theme--bold .cms-theme__art i {
  background: var(--p);
  border-radius: var(--px-radius-xs);
}

.cms-theme--soft .cms-theme__art {
  background: linear-gradient(160deg, color-mix(in srgb, var(--a) 45%, var(--px-surface-solid)), var(--px-surface-solid));
  border-radius: var(--px-radius-panel);
}

.cms-theme--soft .cms-theme__art i {
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-surface-card);
}

.cms-editor {
  gap: var(--px-space-3-5);
  grid-template-columns: minmax(320px, 440px) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

.cms-editor__side {
  min-width: 0;
}

.cms-editor__preview {
  top: var(--px-space-2-5);
  gap: var(--px-space-2);
  flex-direction: column;
  min-width: 0;
  display: flex;
  position: sticky;
}

.cms-preview__bar {
  align-items: center;
  gap: var(--px-space-2-5);
  flex-wrap: wrap;
  display: flex;
}

.cms-frame {
  border-radius: var(--px-radius-panel);
  border: var(--px-hairline) solid var(--hk-stroke);
  background: var(--px-surface-solid);
  box-shadow: var(--hk-shadow);
  margin: 0 auto;
  transition: width .2s;
  overflow: hidden;
}

.cms-frame iframe {
  background: var(--px-surface-solid);
  border: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.cms-frame--mobile {
  border-radius: var(--px-radius-2xl);
  border-width: 8px;
  border-color: var(--hk-ink);
  width: 390px;
  max-width: 100%;
  height: min(78vh, 780px);
}

.cms-frame--desktop {
  width: 100%;
  height: min(78vh, 820px);
}

.cms-blocks {
  gap: var(--px-space-1-5);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.cms-block {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  border-radius: var(--px-radius-tile-lg);
  background: var(--hk-thin);
}

.cms-block.on {
  border-color: var(--hk-stroke);
  background: var(--hk-cell);
}

.cms-block--hidden {
  opacity: .55;
}

.cms-block__head {
  align-items: center;
  gap: var(--px-space-1-5);
  padding: var(--px-space-1-5) var(--px-space-2);
  display: flex;
}

.cms-block__title {
  min-width: 0;
  padding: var(--px-space-0-5);
  font: inherit;
  color: var(--hk-text);
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  flex-direction: column;
  flex: 1;
  align-items: flex-start;
  display: flex;
}

.cms-block__type {
  font-weight: 650;
  font-size: var(--px-text-13);
}

.cms-block__tools {
  gap: var(--px-space-0-5);
  display: flex;
}

.cms-block__body {
  padding: var(--px-space-1) var(--px-space-2-5) var(--px-space-3);
  border-top: var(--px-hairline) solid var(--hk-stroke-2);
}

.cms-list {
  gap: var(--px-space-2);
  margin-top: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.cms-list__item {
  border: var(--px-hairline) dashed var(--hk-stroke);
  border-radius: var(--px-radius-tile);
  padding: var(--px-space-2);
}

.cms-list__head {
  margin-bottom: var(--px-space-1);
  font-size: var(--px-text-13);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.cms-thumbs {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.cms-thumb {
  width: var(--px-space-16);
  height: var(--px-space-12);
  border-radius: var(--px-radius-md);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  position: relative;
  overflow: hidden;
}

.cms-thumb img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.cms-thumb button {
  top: var(--px-space-0-5);
  right: var(--px-space-0-5);
  background: var(--hk-ink);
  width: 18px;
  height: 18px;
  color: var(--hk-on-ink);
  font-size: var(--px-text-12);
  cursor: pointer;
  border: 0;
  border-radius: 50%;
  padding: 0;
  line-height: 18px;
  position: absolute;
}

.cms-addgrid {
  gap: var(--px-space-2);
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  display: grid;
}

.cms-addtile, .cms-tile-btn {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-3);
  font: inherit;
  cursor: pointer;
  text-align: left;
}

.cms-addtile:hover, .cms-tile-btn:hover {
  border-color: var(--hk-stroke);
}

.cms-cards {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  display: grid;
}

.cms-acard {
  gap: var(--px-space-2);
  color: inherit;
  padding: var(--px-space-2-5);
  flex-direction: column;
  text-decoration: none;
  display: flex;
}

.cms-acard img, .cms-acard__ph {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--px-radius-tile);
  background: var(--hk-wash-2);
  width: 100%;
  display: block;
}

.cms-acard__meta {
  gap: var(--px-space-1-5);
  margin-top: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.cms-mini {
  width: 44px;
  height: var(--px-space-8);
  object-fit: cover;
  border-radius: var(--px-radius-sm);
  display: block;
}

.cms-pre {
  white-space: pre-wrap;
  font-size: var(--px-text-12-5);
}

.cms-title {
  font-size: var(--px-text-20);
  font-weight: 650;
}

.cms-body {
  min-height: 62vh;
  padding: var(--px-space-3);
  resize: vertical;
  font: 14px / 1.6 ui-monospace, SFMono-Regular, Menlo, monospace;
}

.cms-mdprev {
  padding: var(--px-space-1) var(--px-space-4) var(--px-space-4);
  border-radius: var(--px-radius-card);
  background: var(--hk-cell);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  min-height: 62vh;
  line-height: 1.65;
}

.cms-mdprev h2 {
  font-size: var(--px-text-20);
  margin: var(--px-space-4) 0 var(--px-space-1-5);
}

.cms-drop {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  padding: var(--px-space-4);
  border: var(--px-stroke-1-5) dashed var(--hk-stroke);
  border-radius: var(--px-radius-panel);
  background: var(--hk-thin);
  flex-wrap: wrap;
  display: flex;
}

.cms-drop.on {
  border-color: var(--hk-ink);
  background: var(--hk-cell);
}

.cms-media {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  display: grid;
}

.cms-media--pick {
  max-height: 52vh;
  margin-top: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  overflow: auto;
}

.cms-asset {
  gap: var(--px-space-1);
  padding: var(--px-space-1-5);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  font: inherit;
  cursor: pointer;
  text-align: left;
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.cms-asset.on {
  border-color: var(--hk-ink);
  box-shadow: var(--px-shadow-xs);
}

.cms-asset img, .cms-asset__icon {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: var(--px-radius-md);
  background: var(--hk-wash-2);
  width: 100%;
  color: var(--hk-text-2);
  place-items: center;
  font-weight: 700;
  display: grid;
}

.cms-asset__name {
  font-size: var(--px-text-12);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.cms-asset__flags {
  gap: var(--px-space-1);
  min-height: var(--px-space-1);
  flex-wrap: wrap;
  display: flex;
}

.cms-asset__flags .fin-pill {
  font-size: var(--px-text-10-5);
  padding: 0 var(--px-space-1-5);
}

.cms-assetpanel {
  gap: var(--px-space-2-5);
  flex-direction: column;
  display: flex;
}

.cms-assetpanel > img {
  object-fit: contain;
  border-radius: var(--px-radius-tile);
  background: var(--hk-wash);
  max-height: 280px;
}

.cms-inline {
  gap: var(--px-space-1-5);
  align-items: center;
  display: flex;
}

.cms-inline .fin-input {
  flex: 1;
  min-width: 0;
}

.cms-brandrow {
  align-items: center;
  gap: var(--px-space-3);
  margin-bottom: var(--px-space-3);
  display: flex;
}

.cms-logo {
  border-radius: var(--px-radius-tile);
  background: var(--px-surface-solid);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  min-width: 120px;
  height: 56px;
  padding: var(--px-space-1-5);
  place-items: center;
  display: grid;
}

.cms-logo img {
  max-height: 44px;
}

.cms-swatches {
  gap: var(--px-space-2);
  margin-bottom: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  display: grid;
}

.cms-swatch {
  gap: var(--px-space-2);
  padding: var(--px-space-1-5);
  border-radius: var(--px-radius-tile);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  align-items: center;
  display: flex;
}

.cms-swatch input {
  border-radius: var(--px-radius-md);
  cursor: pointer;
  background: none;
  border: 0;
  width: 36px;
  height: 36px;
  padding: 0;
}

.cms-swatch span {
  text-transform: capitalize;
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.cms-cal {
  gap: var(--px-space-1);
  grid-template-columns: repeat(7, minmax(0, 1fr));
  display: grid;
}

.cms-cal__dow {
  font-size: var(--px-text-11);
  color: var(--hk-text-2);
  text-align: center;
  padding: var(--px-space-0-5);
}

.cms-cal__day {
  border-radius: var(--px-radius-tile);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  min-height: 92px;
  padding: var(--px-space-1);
  gap: var(--px-space-0-5);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.cms-cal__day--empty {
  background: none;
  border-color: #0000;
}

.cms-cal__n {
  font-size: var(--px-text-11);
  color: var(--hk-text-2);
}

.cms-cal__item {
  font-size: var(--px-text-11);
  padding: var(--px-space-px) var(--px-space-1);
  border-radius: var(--px-radius-sm);
  background: var(--hk-wash-2);
  color: var(--hk-text);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-decoration: none;
  display: block;
  overflow: hidden;
}

.cms-cal__item--published {
  background: color-mix(in srgb, var(--hk-success) 16%, transparent);
}

.cms-cal__item--scheduled {
  background: color-mix(in srgb, var(--hk-warning) 16%, transparent);
}

.cms-mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: var(--px-text-12);
  overflow-wrap: anywhere;
}

@media (max-width: 1000px) {
  .cms-editor {
    grid-template-columns: minmax(0, 1fr);
  }

  .cms-editor__preview {
    position: static;
  }
}

@media (max-width: 640px) {
  .cms-themes {
    grid-template-columns: minmax(0, 1fr);
  }

  .cms-cal__day {
    min-height: 54px;
  }

  .cms-cal__item {
    height: var(--px-space-1-5);
    padding: 0;
    font-size: 0;
  }
}

@media print {
  .cms .fin-actions, .cms .fin-filters, .cms .fin-crumbs {
    display: none !important;
  }
}

.soc .fin-actions--scroll {
  scrollbar-width: none;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.soc .fin-chip {
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  color: var(--hk-text);
  border-radius: var(--px-radius-pill);
  padding: var(--px-space-0-5) var(--px-space-2-5);
  font: inherit;
  font-size: var(--px-text-12-5);
  cursor: pointer;
  white-space: nowrap;
}

.soc .fin-chip.on {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: var(--hk-ink);
}

.soc-pf {
  align-items: center;
  gap: var(--px-space-0-5);
  min-width: var(--px-space-6);
  height: var(--px-space-5);
  padding: 0 var(--px-space-1-5);
  border-radius: var(--px-radius-sm);
  font-size: var(--px-text-10-5);
  letter-spacing: .02em;
  color: var(--px-text-on-brand);
  background: var(--hk-text-2);
  vertical-align: middle;
  font-weight: 700;
  display: inline-flex;
}

.soc-pf i {
  font-style: normal;
  font-weight: 600;
  font-size: var(--px-text-10);
  opacity: .85;
  padding-left: var(--px-space-0-5);
  border-left: var(--px-hairline) solid var(--px-border-strong);
}

.soc-pf--instagram {
  background: linear-gradient(135deg, var(--px-brand), var(--px-danger) 55%, var(--px-accent));
}

.soc-pf--facebook {
  background: var(--px-brand);
}

.soc-pf--tiktok, .soc-pf--x {
  background: var(--px-surface-solid);
}

.soc-pf--linkedin {
  background: var(--px-brand);
}

.soc-pf--whatsapp {
  background: var(--px-success);
}

.soc-pfs {
  gap: var(--px-space-1);
  flex-wrap: wrap;
  align-items: center;
  display: inline-flex;
}

.soc-month {
  text-align: center;
  min-width: 130px;
}

.soc-cal {
  gap: var(--px-space-1);
  grid-template-columns: repeat(7, minmax(0, 1fr));
  display: grid;
}

.soc-cal__dow {
  font-size: var(--px-text-11);
  color: var(--hk-text-2);
  text-align: center;
  padding: var(--px-space-0-5);
}

.soc-cal__day {
  border-radius: var(--px-radius-tile);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-thin);
  min-height: 96px;
  padding: var(--px-space-1);
  gap: var(--px-space-0-5);
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.soc-cal__day--empty {
  background: none;
  border-color: #0000;
}

.soc-cal__day--today {
  border-color: var(--hk-ink);
}

.soc-cal__n {
  font-size: var(--px-text-11);
  color: var(--hk-text-2);
}

.soc-cal__item {
  font-size: var(--px-text-11);
  padding: var(--px-space-px) var(--px-space-1);
  border-radius: var(--px-radius-sm);
  border-left: 3px solid var(--hk-stroke);
  background: var(--hk-wash-2);
  color: var(--hk-text);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-decoration: none;
  display: block;
  overflow: hidden;
}

.soc-cal__item--published {
  background: color-mix(in srgb, var(--hk-success) 16%, transparent);
}

.soc-cal__item--scheduled, .soc-cal__item--approved {
  background: color-mix(in srgb, var(--hk-warning) 14%, transparent);
}

.soc-cal__item--failed {
  background: color-mix(in srgb, var(--hk-danger, var(--px-danger)) 18%, transparent);
}

.soc-compose {
  gap: var(--px-space-3-5);
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

.soc textarea.fin-input {
  box-sizing: border-box;
  width: 100%;
}

.soc-caption {
  min-height: 130px;
  font: inherit;
  resize: vertical;
  line-height: 1.5;
}

.soc-previews {
  gap: var(--px-space-2-5);
  margin-bottom: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  display: grid;
}

.soc-prev {
  gap: var(--px-space-1-5);
  padding: var(--px-space-2);
  border-radius: var(--px-radius-card);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  background: var(--hk-cell);
  flex-direction: column;
  min-width: 0;
  display: flex;
  position: relative;
}

.soc-prev__head {
  gap: var(--px-space-1-5);
  font-size: var(--px-text-12-5);
  align-items: center;
  min-width: 0;
  display: flex;
}

.soc-prev__head strong {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.soc-prev__media {
  aspect-ratio: 4 / 5;
  border-radius: var(--px-radius-tile);
  background: var(--hk-wash-2);
  color: var(--hk-text-2);
  font-size: var(--px-text-12);
  place-items: center;
  display: grid;
  position: relative;
  overflow: hidden;
}

.soc-prev--facebook .soc-prev__media {
  aspect-ratio: 1;
}

.soc-prev--tall .soc-prev__media {
  aspect-ratio: 9 / 16;
  max-height: 300px;
}

.soc-prev__media img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  display: block;
}

.soc-prev__media i {
  top: var(--px-space-1-5);
  right: var(--px-space-1-5);
  font-style: normal;
  font-size: var(--px-text-10-5);
  padding: var(--px-space-px) var(--px-space-1-5);
  border-radius: var(--px-radius-md);
  background: var(--px-overlay);
  color: var(--px-text-on-brand);
  position: absolute;
}

.soc-prev__text {
  font-size: var(--px-text-12-5);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
  line-height: 1.45;
}

.soc-prev__count {
  font-size: var(--px-text-10-5);
  color: var(--hk-text-2);
  align-self: flex-end;
}

.soc-prev__count.over {
  color: var(--hk-danger, var(--px-danger));
  font-weight: 700;
}

.soc-kpis {
  gap: var(--px-space-2);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  display: grid;
}

.soc-kpis > div {
  padding: var(--px-space-2);
  border-radius: var(--px-radius-tile);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  flex-direction: column;
  display: flex;
}

.soc-kpis strong {
  font-size: var(--px-text-18);
}

.soc-pack {
  padding: var(--px-space-2-5);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) dashed var(--hk-stroke);
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.soc-inbox {
  gap: var(--px-space-3-5);
  grid-template-columns: minmax(260px, 380px) minmax(0, 1fr);
  align-items: start;
  display: grid;
}

.soc-inbox__list {
  max-height: 78vh;
  overflow: auto;
}

.soc-convs {
  gap: var(--px-space-1);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.soc-conv {
  gap: var(--px-space-1);
  text-align: left;
  width: 100%;
  padding: var(--px-space-2);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid transparent;
  color: var(--hk-text);
  font: inherit;
  cursor: pointer;
  background: none;
  flex-direction: column;
  display: flex;
}

.soc-conv:hover {
  background: var(--hk-thin);
}

.soc-conv.on {
  background: var(--hk-cell);
  border-color: var(--hk-stroke);
}

.soc-conv__top {
  gap: var(--px-space-1-5);
  align-items: center;
  min-width: 0;
  display: flex;
}

.soc-conv__top strong {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.soc-conv__msg {
  font-size: var(--px-text-12-5);
  color: var(--hk-text-2);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}

.soc-wa {
  margin-top: var(--px-space-2-5);
  border-top: var(--px-hairline) solid var(--hk-stroke-2);
  padding-top: var(--px-space-1-5);
}

.soc-thread {
  margin: var(--px-space-2-5) 0;
  gap: var(--px-space-2);
  flex-direction: column;
  padding: 0;
  list-style: none;
  display: flex;
}

.soc-msg {
  gap: var(--px-space-0-5);
  flex-direction: column;
  max-width: 82%;
  display: flex;
}

.soc-msg p {
  padding: var(--px-space-2) var(--px-space-2-5);
  border-radius: var(--px-radius-card);
  background: var(--hk-thin);
  border: var(--px-hairline) solid var(--hk-stroke-2);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin: 0;
}

.soc-msg--out {
  align-self: flex-end;
  align-items: flex-end;
}

.soc-msg--out p {
  background: var(--hk-ink);
  color: var(--hk-on-ink);
  border-color: var(--hk-ink);
}

.soc-ok {
  gap: var(--px-space-1-5);
  padding: var(--px-space-2-5);
  margin-top: var(--px-space-2);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid var(--hk-stroke);
  background: var(--hk-cell);
  flex-direction: column;
  display: flex;
}

.soc-growth {
  gap: var(--px-space-2);
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.soc-growth li {
  gap: var(--px-space-2-5);
  grid-template-columns: auto minmax(0, 1fr) 110px;
  align-items: center;
  display: grid;
}

.soc-growth__n {
  flex-direction: column;
  display: flex;
}

.soc-spark {
  width: 110px;
  height: var(--px-space-8);
  color: var(--hk-ink);
  opacity: .7;
}

.soc-senti {
  height: var(--px-space-3-5);
  border-radius: var(--px-radius-sm);
  background: var(--hk-wash-2);
  margin: var(--px-space-1-5) 0;
  display: flex;
  overflow: hidden;
}

.soc-senti span {
  min-width: var(--px-space-0-5);
  flex-basis: 0;
}

.soc-senti__positive {
  background: color-mix(in srgb, var(--hk-success) 70%, transparent);
}

.soc-senti__neutral {
  background: var(--hk-stroke);
}

.soc-senti__negative {
  background: color-mix(in srgb, var(--hk-danger, var(--px-danger)) 70%, transparent);
}

.soc-dot {
  vertical-align: middle;
  border-radius: 50%;
  width: 9px;
  height: 9px;
  display: inline-block;
}

.soc-wrap {
  white-space: normal;
  max-width: 460px;
}

@media (max-width: 1000px) {
  .soc-compose, .soc-inbox {
    grid-template-columns: minmax(0, 1fr);
  }

  .soc-inbox__list {
    max-height: none;
  }
}

@media (max-width: 640px) {
  .soc-cal__day {
    min-height: 54px;
  }

  .soc-cal__item {
    height: var(--px-space-1-5);
    padding: 0;
    font-size: 0;
  }

  .soc-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media print {
  .soc .fin-actions, .soc .fin-filters {
    display: none !important;
  }
}

.mkt-camps {
  gap: var(--px-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.mkt-camps li {
  gap: var(--px-space-1);
  display: grid;
}

.mkt-bars {
  margin: var(--px-space-1-5) 0;
  gap: var(--px-space-1-5);
  padding: 0;
  list-style: none;
  display: grid;
}

.mkt-bars li {
  gap: var(--px-space-2-5);
  font-size: var(--px-text-13);
  grid-template-columns: 110px 1fr auto;
  align-items: center;
  display: grid;
}

.mkt-bars__bar {
  height: var(--px-space-2);
  border-radius: var(--px-radius-sm);
  background: var(--hk-stroke-2, var(--px-fill-pressed));
  overflow: hidden;
}

.mkt-bars__bar i {
  border-radius: var(--px-radius-sm);
  background: linear-gradient(90deg, var(--px-chart-1), color-mix(in srgb, var(--px-chart-1) 60%, white));
  height: 100%;
  display: block;
}

.mkt-cards {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  display: grid;
}

.mkt-card {
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  background: var(--hk-thin, transparent);
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2-5) var(--px-space-3);
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.mkt-card p {
  margin: 0;
}

.mkt-plus {
  color: var(--px-success);
  font-weight: 700;
}

.mkt-minus, .mkt-neg {
  color: var(--px-danger);
}

.mkt-pos {
  color: var(--px-success);
}

.mkt-tags {
  margin: var(--px-space-1) 0;
  gap: var(--px-space-1);
  flex-wrap: wrap;
  padding: 0;
  list-style: none;
  display: flex;
}

.mkt-tags li {
  font-size: var(--px-text-12);
  padding: var(--px-space-0-5) var(--px-space-2);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  background: var(--hk-thin, transparent);
}

.mkt-list {
  margin: var(--px-space-1) 0;
  padding-left: var(--px-space-4);
  font-size: var(--px-text-13);
  gap: var(--px-space-0-5);
  display: grid;
}

.mkt-prose p {
  font-size: var(--px-text-13);
  line-height: 1.5;
}

.mkt-prose h4, .mkt h4 {
  margin: var(--px-space-2) 0 var(--px-space-0-5);
  font-size: var(--px-text-12);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--hk-text-2, var(--px-color-text-muted));
}

.mkt-vp {
  font-size: var(--px-text-18);
  margin: var(--px-space-1) 0 var(--px-space-2);
  font-weight: 600;
  line-height: 1.4;
}

.mkt-ta {
  height: auto;
  min-height: 70px;
  padding: var(--px-space-2) var(--px-space-2-5);
  resize: vertical;
  line-height: 1.4;
}

.mkt-ta--lg {
  min-height: 130px;
}

.mkt-reach {
  gap: var(--px-space-2-5);
  font-size: var(--px-text-12-5);
  display: inline-flex;
}

.mkt-chip {
  align-items: center;
  gap: var(--px-space-1-5);
  padding: var(--px-space-1) var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  background: var(--hk-thin, transparent);
  font: inherit;
  font-size: var(--px-text-12-5);
  color: inherit;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  display: inline-flex;
}

.mkt-chip--on {
  border-color: var(--px-chart-1);
  box-shadow: 0 0 0 2px color-mix(in oklch, var(--px-chart-1) 25%, transparent);
}

.mkt-chstatus {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  display: flex;
}

.mkt-kv {
  gap: var(--px-space-0-5);
  padding: var(--px-space-2) var(--px-space-2-5);
  border-radius: var(--px-radius-tile);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  flex-direction: column;
  min-width: 0;
  display: flex;
}

.mkt-kv span {
  font-size: var(--px-text-11);
  color: var(--hk-text-2, var(--px-color-text-muted));
}

.mkt-kv strong {
  font-size: var(--px-text-14);
}

.mkt-hero {
  justify-content: space-between;
  gap: var(--px-space-3);
  flex-wrap: wrap;
  align-items: flex-start;
  display: flex;
}

.mkt-hero__t {
  font-size: var(--px-text-20);
  margin: 0;
}

.mkt-hero p {
  margin: var(--px-space-1) 0;
  font-size: var(--px-text-13);
  max-width: 760px;
}

.mkt-codes {
  gap: var(--px-space-1-5);
  margin: var(--px-space-1) 0;
  flex-wrap: wrap;
  display: flex;
}

.mkt-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 700;
  font-size: var(--px-text-13);
  letter-spacing: .05em;
  padding: var(--px-space-0-5) var(--px-space-2);
  border-radius: var(--px-radius-sm);
  border: var(--px-hairline) dashed var(--px-chart-1);
  gap: var(--px-space-1-5);
  align-items: baseline;
  display: inline-flex;
}

.mkt-code i {
  font-style: normal;
  font-weight: 400;
  font-size: var(--px-text-11);
  opacity: .7;
  letter-spacing: 0;
  font-family: inherit;
}

.mkt-cal .soc-cal__day {
  min-height: 84px;
}

.mkt-cal__run {
  font-size: var(--px-text-10-5);
  padding: var(--px-space-px) var(--px-space-1);
  border-radius: var(--px-radius-xs);
  background: color-mix(in oklch, var(--px-chart-1) 22%, transparent);
  color: inherit;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-decoration: none;
  overflow: hidden;
}

.mkt-cal__item {
  font-size: var(--px-text-10-5);
  padding: var(--px-space-px) var(--px-space-1);
  border-radius: var(--px-radius-xs);
  border-left: 3px solid var(--px-border-strong);
  background: var(--hk-thin, var(--px-fill-hover));
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
  overflow: hidden;
}

.mkt-cal__item--season {
  border-left-color: var(--px-danger-border);
}

.mkt-cal__item--campaign {
  border-left-color: var(--px-chart-1);
}

.mkt-cal__item--broadcast {
  border-left-color: var(--px-success-border);
}

.mkt-cal__item--ad {
  border-left-color: var(--px-border-focus);
}

.mkt-cal__item--offline {
  border-left-color: var(--px-warning-border);
}

.mkt-legend {
  gap: var(--px-space-2);
  margin-top: var(--px-space-2);
  flex-wrap: wrap;
  display: flex;
}

.mkt-legend .mkt-cal__item {
  display: inline-block;
}

.mkt-variants {
  gap: var(--px-space-2);
  margin: var(--px-space-1-5) 0;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  display: grid;
}

.mkt-variant {
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2-5) var(--px-space-3) var(--px-space-2-5) var(--px-space-8);
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
  position: relative;
}

.mkt-variant p {
  margin: 0;
}

.mkt-variant__l {
  left: var(--px-space-2);
  top: var(--px-space-2);
  background: var(--px-chart-1);
  width: 18px;
  height: 18px;
  color: var(--px-text-on-brand);
  font-size: var(--px-text-11);
  border-radius: 50%;
  place-items: center;
  font-weight: 700;
  display: grid;
  position: absolute;
}

.mkt-msg {
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2-5) var(--px-space-3);
  background: var(--hk-thin, var(--px-fill-hover));
  white-space: pre-wrap;
  font-size: var(--px-text-13);
}

.mkt-copy {
  font: inherit;
  font-size: var(--px-text-12-5);
  color: inherit;
  cursor: copy;
  background: none;
  border: 0;
  padding: 0;
  font-family: ui-monospace, Menlo, monospace;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

.mkt-url {
  font-size: var(--px-text-12);
  color: var(--hk-text-2, var(--px-color-text-muted));
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 320px;
  overflow: hidden;
}

.mkt-lesson {
  margin-top: var(--px-space-1);
  font-size: var(--px-text-12);
  padding: var(--px-space-1-5) var(--px-space-2);
  border-radius: var(--px-radius-md);
  background: color-mix(in oklch, var(--px-chart-2) 18%, transparent);
  max-width: 420px;
  line-height: 1.4;
}

@media print {
  .mkt .fin-actions, .sb, .shell-sidebar {
    display: none !important;
  }
}

.bi-kpis {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
  display: grid;
}

.bi-kpi {
  gap: var(--px-space-1);
  padding: var(--px-space-2-5) var(--px-space-3) var(--px-space-2);
  border-radius: var(--px-radius-card);
  border: var(--px-hairline) solid var(--hk-stroke-2, var(--px-border-strong));
  background: var(--hk-glass, var(--hk-thin, var(--px-surface-card)));
  -webkit-backdrop-filter: blur(var(--px-blur-surface));
  backdrop-filter: blur(var(--px-blur-surface));
  color: inherit;
  flex-direction: column;
  min-width: 0;
  text-decoration: none;
  display: flex;
}

.bi-kpi:hover {
  border-color: var(--px-chart-1);
}

.bi-kpi__top {
  justify-content: space-between;
  gap: var(--px-space-1-5);
  font-size: var(--px-text-12-5);
  color: var(--hk-text-2, var(--px-color-text-muted));
  align-items: center;
  display: flex;
}

.bi-kpi__top span:first-child {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.bi-kpi__v {
  font-size: var(--px-text-24);
  letter-spacing: -.01em;
  font-weight: 650;
}

.bi-kpi__sub {
  gap: var(--px-space-2);
  font-size: var(--px-text-12);
  flex-wrap: wrap;
  display: flex;
}

.bi-up {
  color: var(--px-success);
  font-weight: 600;
}

.bi-down {
  color: var(--px-danger);
  font-weight: 600;
}

.bi-spark {
  width: 100%;
  height: 30px;
  margin-top: var(--px-space-0-5);
}

.bi-spark polyline {
  fill: none;
  stroke: var(--px-chart-1);
  stroke-width: 2px;
  vector-effect: non-scaling-stroke;
}

.bi-spark--bad polyline {
  stroke: var(--px-danger);
}

.bi-chart {
  width: 100%;
  display: block;
  overflow: visible;
}

.bi-grid {
  stroke: var(--hk-stroke-2, var(--px-border-strong));
  stroke-width: 1px;
  vector-effect: non-scaling-stroke;
}

.bi-axis {
  font-size: var(--px-text-10-5);
  fill: var(--hk-text-2, var(--px-text-tertiary));
}

.bi-line {
  fill: none;
  stroke: var(--px-chart-1);
  stroke-width: 2.5px;
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
}

.bi-line--prev {
  stroke: var(--px-border-strong);
  stroke-dasharray: 4 4;
  stroke-width: 1.5px;
}

.bi-line--fc {
  stroke-dasharray: 6 5;
}

.bi-band {
  fill: color-mix(in oklch, var(--px-chart-2) 30%, transparent);
}

.bi-dot {
  fill: var(--px-chart-1);
}

.bi-dot--fc {
  fill: var(--px-surface-solid);
  stroke: var(--px-chart-1);
  stroke-width: 2px;
}

.bi-col {
  fill: color-mix(in oklch, var(--px-chart-1) 70%, transparent);
}

.bi-col--hl {
  fill: var(--px-chart-1);
}

.bi-col--neg {
  fill: var(--px-danger);
}

.bi-col--fc {
  fill: color-mix(in oklch, var(--px-chart-2) 55%, transparent);
}

.bi-whisker {
  stroke: var(--px-text-secondary);
  stroke-width: 1.5px;
}

.bi-hbars {
  margin: var(--px-space-1) 0;
  gap: var(--px-space-2);
  padding: 0;
  list-style: none;
  display: grid;
}

.bi-hbars li {
  gap: var(--px-space-2-5);
  font-size: var(--px-text-13);
  grid-template-columns: minmax(90px, 140px) 1fr auto 52px;
  align-items: center;
  display: grid;
}

.bi-hbars__l {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.bi-hbars__bar {
  height: var(--px-space-2-5);
  border-radius: var(--px-radius-sm);
  background: var(--hk-stroke-2, var(--px-fill-pressed));
  overflow: hidden;
}

.bi-hbars__bar i {
  border-radius: var(--px-radius-sm);
  background: linear-gradient(90deg, var(--px-chart-1), color-mix(in srgb, var(--px-chart-1) 60%, white));
  height: 100%;
  display: block;
}

.bi-hbars__bar i.neg {
  background: var(--px-danger);
}

.bi-hbars em {
  font-style: normal;
  font-size: var(--px-text-12);
  text-align: right;
}

.bi-funnel {
  gap: var(--px-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.bi-funnel li {
  gap: var(--px-space-0-5);
  display: grid;
}

.bi-funnel__bar {
  border-radius: var(--px-radius-md);
  background: linear-gradient(90deg, var(--px-chart-1), color-mix(in srgb, var(--px-chart-1) 60%, white));
  height: 28px;
  color: var(--px-text-on-brand);
  padding: 0 var(--px-space-2-5);
  font-size: var(--px-text-13);
  align-items: center;
  min-width: 60px;
  display: flex;
}

.bi-funnel__l {
  font-size: var(--px-text-12-5);
}

.bi-funnel__l em {
  color: var(--hk-text-2, var(--px-text-tertiary));
  font-style: normal;
}

.bi-dash {
  gap: var(--px-space-3);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  display: grid;
}

.bi-dash > .bi-wide {
  grid-column: 1 / -1;
}

@media (max-width: 900px) {
  .bi-dash {
    grid-template-columns: 1fr;
  }
}

.bi-x {
  font-size: var(--px-text-18);
  cursor: pointer;
  color: var(--hk-text-2, var(--px-text-tertiary));
  background: none;
  border: 0;
  line-height: 1;
}

.bi-goal {
  gap: var(--px-space-2);
  display: grid;
}

.bi-goal__bar {
  height: var(--px-space-3);
  border-radius: var(--px-radius-md);
  background: var(--hk-stroke-2, var(--px-fill-pressed));
  position: relative;
}

.bi-goal__bar--lg {
  height: var(--px-space-4);
}

.bi-goal__bar i {
  border-radius: var(--px-radius-md);
  background: linear-gradient(90deg, var(--px-chart-1), color-mix(in srgb, var(--px-chart-1) 60%, white));
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
}

.bi-goal__bar b {
  top: calc(var(--px-space-1) * -1);
  bottom: calc(var(--px-space-1) * -1);
  width: 3px;
  margin-left: calc(var(--px-space-px) * -1);
  background: var(--px-text-secondary);
  border-radius: var(--px-radius-xs);
  position: absolute;
}

.bi-goal__bar u {
  top: calc(var(--px-space-0-5) * -1);
  bottom: calc(var(--px-space-0-5) * -1);
  width: var(--px-space-0-5);
  margin-left: calc(var(--px-space-px) * -1);
  background: var(--px-fill-pressed);
  position: absolute;
}

.bi-goal__nums {
  justify-content: space-between;
  gap: var(--px-space-2);
  font-size: var(--px-text-13);
  flex-wrap: wrap;
  display: flex;
}

.bi-snap {
  gap: var(--px-space-2-5);
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  display: grid;
}

.bi-snap div {
  gap: var(--px-space-0-5);
  flex-direction: column;
  display: flex;
}

.bi-snap span {
  font-size: var(--px-text-12);
  color: var(--hk-text-2, var(--px-text-tertiary));
}

.bi-snap strong {
  font-size: var(--px-text-18);
}

.bi-snap em {
  font-style: normal;
  font-size: var(--px-text-12);
}

.bi-weeks {
  align-items: flex-end;
  gap: var(--px-space-1-5);
  height: 60px;
  margin: var(--px-space-3) 0 var(--px-space-0-5);
  padding: 0;
  list-style: none;
  display: flex;
}

.bi-weeks li {
  flex: 1;
  align-items: flex-end;
  height: 100%;
  display: flex;
}

.bi-weeks i {
  border-radius: var(--px-radius-xs) var(--px-radius-xs) var(--px-radius-xs) var(--px-radius-xs);
  background: color-mix(in oklch, var(--px-chart-1) 65%, transparent);
  width: 100%;
  display: block;
}

.bi-weeks li:last-child i {
  background: var(--px-chart-1);
}

.bi-insights {
  gap: var(--px-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.bi-insights li {
  gap: var(--px-space-0-5);
  display: grid;
}

.bi-insights p {
  margin: 0;
}

.bi-next {
  font-size: var(--px-text-13);
  color: var(--px-text-link);
  font-weight: 600;
  text-decoration: none;
}

.bi-ins-grid {
  gap: var(--px-space-3);
  grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
  display: grid;
}

@media (max-width: 700px) {
  .bi-ins-grid {
    grid-template-columns: 1fr;
  }
}

.bi-ins-title {
  gap: var(--px-space-2);
  flex-wrap: wrap;
  align-items: center;
  display: inline-flex;
}

.bi-ins-body {
  font-size: var(--px-text-13);
  margin: 0 0 var(--px-space-1-5);
  line-height: 1.5;
}

.bi-ins-action {
  justify-content: space-between;
  gap: var(--px-space-2-5);
  padding: var(--px-space-2) var(--px-space-2-5);
  border-radius: var(--px-radius-tile-lg);
  background: color-mix(in oklch, var(--px-chart-2) 14%, transparent);
  margin: var(--px-space-1-5) 0;
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

.bi-ins-action > div:first-child {
  gap: var(--px-space-0-5);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.bi-askbox {
  gap: var(--px-space-2);
  margin-bottom: var(--px-space-2-5);
  display: flex;
}

.bi-askbox input {
  flex: 1;
}

.bi-answer {
  gap: var(--px-space-2-5);
  display: grid;
}

.bi-answer__q {
  font-size: var(--px-text-13);
  color: var(--hk-text-2, var(--px-text-tertiary));
  margin: 0;
}

.bi-answer__a {
  font-size: var(--px-text-18);
  max-width: 900px;
  margin: 0;
  font-weight: 550;
  line-height: 1.5;
}

.bi-answer__chart h4, .bi-trace h4 {
  margin: var(--px-space-1) 0 var(--px-space-1-5);
  font-size: var(--px-text-12);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--hk-text-2, var(--px-text-tertiary));
}

.bi-trace {
  border-top: var(--px-hairline) dashed var(--hk-stroke-2, var(--px-border-strong));
  padding-top: var(--px-space-2);
  gap: var(--px-space-2);
  display: grid;
}

.bi-trace__list {
  gap: var(--px-space-2);
  font-size: var(--px-text-13);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.bi-scn-text {
  font-size: var(--px-text-14);
  margin: 0 0 var(--px-space-2);
  line-height: 1.5;
}

.bi-report {
  gap: var(--px-space-4);
  display: grid;
}

.bi-report__sum {
  font-size: var(--px-text-16);
  max-width: 920px;
  margin: 0;
  font-weight: 550;
  line-height: 1.55;
}

.bi-report__sec h3 {
  margin: 0 0 var(--px-space-2);
  font-size: var(--px-text-13);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--hk-text-2, var(--px-text-tertiary));
}

.bi-report__kpis {
  gap: var(--px-space-2);
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  display: grid;
}

.bi-report__kpis em {
  font-style: normal;
  font-size: var(--px-text-12);
}

.bi-report__list {
  padding-left: var(--px-space-4);
  gap: var(--px-space-1);
  font-size: var(--px-text-13);
  margin: 0;
  line-height: 1.45;
  display: grid;
}

.bi-dot-s {
  width: var(--px-space-2);
  height: var(--px-space-2);
  background: var(--px-fill-pressed);
  border-radius: 50%;
  display: inline-block;
}

.bi-dot-s--ok {
  background: var(--px-success);
}

.bi-dot-s--stale {
  background: var(--px-warning);
}

.bi-dot-s--failed {
  background: var(--px-danger);
}

.fin-input--sm {
  height: 30px;
  padding: 0 var(--px-space-2);
  font-size: var(--px-text-12-5);
  width: auto;
}

@media print {
  .bi .fin-actions, .bi .fin-head .fin-actions, .sb, .shell-sidebar {
    display: none !important;
  }

  .bi .bi-report {
    gap: var(--px-space-2-5);
  }
}

/* [project]/apps/web/app/ds-tokens.css [app-client] (css) */
html:root:root:root {
  --px-primary-50: #f2f7ff;
  --px-primary-100: #e3edff;
  --px-primary-200: #caddff;
  --px-primary-300: #a6c7ff;
  --px-primary-400: #78a8ff;
  --px-primary-500: #4887ff;
  --px-primary-600: #005bf8;
  --px-primary-700: #004bd4;
  --px-primary-800: #0039a6;
  --px-primary-900: #00277b;
  --px-primary-950: #001652;
  --px-accent-50: #fff8f1;
  --px-accent-100: #ffeddc;
  --px-accent-200: #ffdaba;
  --px-accent-300: #ffc490;
  --px-accent-400: #ffac5d;
  --px-accent-500: #fb9101;
  --px-accent-600: #d97b00;
  --px-accent-700: #b56400;
  --px-accent-800: #924e00;
  --px-accent-900: #733b00;
  --px-accent-950: #482200;
  --px-white: #fff;
  --px-black: #000;
  --px-logo-paper: #fff;
  --px-logo-paper-ink: #4a5361;
  --px-logo-night: #14171c;
  --px-logo-night-ink: #c3c9d2;
  --px-font-sans: var(--px-face-sans, "Inter"), ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --px-font-display: var(--px-font-sans);
  --px-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --px-text-10: 12px;
  --px-text-10-5: 13px;
  --px-text-11: 13px;
  --px-text-12: 13px;
  --px-text-12-5: 14px;
  --px-text-13: 15px;
  --px-text-14: 16px;
  --px-text-16: 17px;
  --px-text-18: 19px;
  --px-text-19: 20px;
  --px-text-20: 22px;
  --px-text-24: 26px;
  --px-text-28: 30px;
  --px-text-32: 34px;
  --px-text-40: 42px;
  --px-text-48: 52px;
  --px-type-page-title: 26px;
  --px-type-card-title: 17px;
  --px-type-kpi: 30px;
  --px-type-kpi-fit: 12.5cqi;
  --px-type-body: var(--px-text-13);
  --px-type-label: 13px;
  --px-type-meta: 13px;
  --px-lh-tight: 1.15;
  --px-lh-snug: 1.3;
  --px-lh-normal: 1.45;
  --px-lh-relaxed: 1.55;
  --px-lh-11: 18px;
  --px-lh-12: 20px;
  --px-lh-13: 22px;
  --px-lh-16: 26px;
  --px-lh-18: 28px;
  --px-lh-20: 30px;
  --px-lh-page-title: 32px;
  --px-lh-card-title: 24px;
  --px-lh-kpi: 36px;
  --px-weight-regular: 400;
  --px-weight-medium: 500;
  --px-weight-semibold: 600;
  --px-weight-bold: 700;
  --px-tracking-tight: -.012em;
  --px-tracking-base: -.008em;
  --px-tracking-num: -.01em;
  --px-tracking-caps: .045em;
  --px-numeric: tabular-nums;
  --px-space-0: 0;
  --px-space-px: 1px;
  --px-space-0-5: 3px;
  --px-space-1: 5px;
  --px-space-1-5: 8px;
  --px-space-2: 10px;
  --px-space-2-5: 12px;
  --px-space-3: 16px;
  --px-space-3-5: 18px;
  --px-space-4: 20px;
  --px-space-5: 24px;
  --px-space-6: 28px;
  --px-space-8: 36px;
  --px-space-10: 44px;
  --px-space-12: 52px;
  --px-space-16: 68px;
  --px-size-row: 48px;
  --px-size-row-compact: 40px;
  --px-size-btn-sm: 40px;
  --px-size-btn-xs: 34px;
  --px-size-input: 42px;
  --px-size-seg: 32px;
  --px-size-tab: 44px;
  --px-size-chip: 26px;
  --px-size-count: 20px;
  --px-size-icon-xs: 16px;
  --px-size-icon-sm: 18px;
  --px-size-icon: 18px;
  --px-size-icon-lg: 22px;
  --px-size-avatar-xs: 22px;
  --px-size-avatar-sm: 28px;
  --px-size-avatar: 32px;
  --px-size-avatar-lg: 40px;
  --px-size-check: 18px;
  --px-size-switch-w: 36px;
  --px-size-switch-h: 20px;
  --px-size-knob: 16px;
  --px-size-dot: 8px;
  --px-size-kbd: 20px;
  --px-size-touch: 44px;
  --px-size-ib: 38px;
  --px-size-rail-hit: 40px;
  --px-size-nav: 38px;
  --px-size-nav-icon: 20px;
  --px-size-nav-sub: 34px;
  --px-size-sidebar: 256px;
  --px-size-rail: 60px;
  --px-size-topbar: 56px;
  --px-size-drawer: 420px;
  --px-size-drawer-phone: 280px;
  --px-size-menu: 220px;
  --px-size-menu-max: 320px;
  --px-size-palette: 680px;
  --px-size-modal: 580px;
  --px-size-toast: 380px;
  --px-size-search: 340px;
  --px-size-search-min: 180px;
  --px-size-company: 280px;
  --px-size-rename: 360px;
  --px-size-measure: 920px;
  --px-size-kpi-min: 220px;
  --px-size-stat-min: 188px;
  --px-size-rail-max: 120px;
  --px-size-bubble: 560px;
  --px-size-meter: 8px;
  --px-size-skel: 12px;
  --px-size-bulk: 44px;
  --px-size-pager: 44px;
  --px-size-palette-in: 52px;
  --px-size-logo-board: 112px;
  --px-size-logo: 56px;
  --px-size-logo-doc: 40px;
  --px-size-swatch: 32px;
  --px-size-bz-card: 320px;
  --px-size-bz-day: 108px;
  --px-size-ask-panel: 420px;
  --px-size-ask-orb: 58px;
  --px-size-mascot: 56px;
  --px-size-mascot-sm: 32px;
  --px-size-mascot-hero: 120px;
  --px-size-mascot-lab: 240px;
  --px-mascot-light: #effcff;
  --px-size-ask-dot: 12px;
  --px-size-ask-rail: 280px;
  --px-size-ask-photo: 220px;
  --px-size-ask-grip: 40px;
  --px-size-ask-nudge: 300px;
  --px-size-brand-mark: 40px;
  --px-size-brand-mark-phone: 44px;
  --px-type-brand: 22px;
  --px-type-brand-phone: 24px;
  --px-weight-brand: 700;
  --px-size-chats-icon: 20px;
  --px-size-sessions-drawer: 380px;
  --px-size-palette-row: 42px;
  --px-size-palette-foot: 36px;
  --px-size-step: 22px;
  --px-size-step-line: 22px;
  --px-hairline: 1px;
  --px-stroke-1-5: 1.5px;
  --px-stroke-2: 2px;
  --px-chart-stroke: 1.75px;
  --px-radius-xs: 5px;
  --px-radius-sm: 7px;
  --px-radius-control: 11px;
  --px-radius-md: 9px;
  --px-radius-tile: 12px;
  --px-radius-tile-lg: 14px;
  --px-radius-card: 16px;
  --px-radius-panel: 18px;
  --px-radius-xl: 20px;
  --px-radius-2xl: 24px;
  --px-radius-pill: 999px;
  --px-gl-blur-panel: 22px;
  --px-gl-blur-raised: 14px;
  --px-gl-blur-overlay: 36px;
  --px-gl-blur-cap: 40px;
  --px-gl-sat: 180%;
  --px-blur-surface: var(--px-gl-blur-panel);
  --px-blur-overlay: var(--px-gl-blur-overlay);
  --px-saturate: var(--px-gl-sat);
  --px-ic-xs: 14px;
  --px-ic-sm: 16px;
  --px-ic-md: 18px;
  --px-ic-lg: 20px;
  --px-ic-xl: 24px;
  --px-ic-tile: 22px;
  --px-ic-hero: 28px;
  --px-z-base: 0;
  --px-z-raised: 1;
  --px-z-sticky: 100;
  --px-z-sidebar: 200;
  --px-z-drawer: 300;
  --px-z-overlay: 400;
  --px-z-modal: 500;
  --px-z-popover: 600;
  --px-z-toast: 700;
  --px-z-tooltip: 800;
  --px-z-skip: 900;
  --px-dur-hover: 80ms;
  --px-dur-press: 60ms;
  --px-dur-pop: .14s;
  --px-dur-panel: .22s;
  --px-dur-toast: .2s;
  --px-dur-dock: .46s;
  --px-ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
  --px-stagger: 18ms;
  --px-dur-chart: .6s;
  --px-dur-skeleton: 1.2s;
  --px-dur-spin: .7s;
  --px-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --px-ease-out: cubic-bezier(.16, 1, .3, 1);
  --px-ease-in: cubic-bezier(.4, 0, 1, 1);
  --px-ease-linear: linear;
  --px-press-scale: .97;
  --px-pop-scale: .98;
  --px-shift-1: 4px;
  --px-shift-2: 8px;
  --px-shift-3: 24px;
  --px-chart-dash: 2400;
  --px-bp-md: 768px;
  --px-bp-lg: 1024px;
  --px-bp-xl: 1280px;
  --px-opacity-disabled: .38;
  --px-opacity-muted: .55;
}

@media (max-width: 767px) {
  html:root:root:root {
    --px-text-13: 16px;
    --px-text-12-5: 15px;
    --px-text-14: 17px;
    --px-lh-13: 24px;
    --px-lh-12: 22px;
    --px-size-btn-sm: 44px;
    --px-size-btn-xs: 44px;
    --px-size-input: 44px;
    --px-size-row: 52px;
    --px-size-row-compact: 44px;
    --px-size-nav: 44px;
    --px-size-ib: 44px;
    --px-size-rail-hit: 44px;
    --px-size-seg: 40px;
    --px-size-tab: 44px;
    --px-size-palette-row: 44px;
    --px-size-check: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:root:root:root {
    --px-dur-hover: 1ms;
    --px-dur-press: 1ms;
    --px-dur-pop: 1ms;
    --px-dur-panel: 1ms;
    --px-dur-toast: 1ms;
    --px-dur-dock: 1ms;
    --px-stagger: 0s;
    --px-dur-chart: 1ms;
    --px-dur-skeleton: 0s;
    --px-shift-1: 0px;
    --px-shift-2: 0px;
    --px-shift-3: 0px;
    --px-press-scale: 1;
  }
}

html:root:root:not([data-theme="dark"]) {
  --lightningcss-light: initial;
  --lightningcss-dark: ;
  color-scheme: light;
  --px-canvas-solid: #f6f8fc;
  --px-sky: radial-gradient(70vw 60vh at 0% 0%, #005bf829, transparent 70%),
    radial-gradient(50vw 50vh at 100% 8%, #4887ff1a, transparent 70%),
    radial-gradient(60vw 55vh at 100% 100%, #fb910124, transparent 70%),
    radial-gradient(40vw 40vh at 12% 100%, #fbac5d14, transparent 70%),
    linear-gradient(180deg, #f4f7fd 0%, #f8f9fc 55%, #fbfaf7 100%);
  --px-gl-panel: #ffffff8f;
  --px-gl-chrome: #ffffff80;
  --px-gl-raised: #ffffffb8;
  --px-gl-overlay: #fffc;
  --px-gl-solid: #ffffffe6;
  --px-gl-line: #ffffffc7;
  --px-gl-outline: #14285a12;
  --px-gl-edge: #fffffff2;
  --px-gl-sheen: inset 0 var(--px-space-3) var(--px-space-4) calc(var(--px-space-3) * -1) #ffffffbf;
  --px-gl-shadow: 0 0 0 1px #14285a0d, 0 1px 2px #14285a0d, 0 8px 24px #1e3c8212, 0 24px 56px #1e3c820f;
  --px-gl-shadow-raised: 0 0 0 1px #14285a0d, 0 1px 2px #14285a0f;
  --px-gl-shadow-overlay: 0 0 0 1px #14285a0f, 0 18px 48px #14285a2e, 0 4px 12px #14285a14;
  --px-surface-sidebar: var(--px-gl-chrome);
  --px-surface-topbar: var(--px-gl-chrome);
  --px-surface-card: var(--px-gl-panel);
  --px-surface-tile: var(--px-gl-raised);
  --px-surface-solid: var(--px-gl-solid);
  --px-surface-overlay: var(--px-gl-overlay);
  --px-surface-chip: var(--px-gl-raised);
  --px-card-border: var(--px-gl-line);
  --px-card-hi: var(--px-gl-edge);
  --px-chip-border: #14285a1a;
  --px-fill-hover: #003caa0d;
  --px-fill-pressed: #003caa17;
  --px-fill-sunken: #003caa0d;
  --px-fill-input: #ffffffe6;
  --px-fill-selected: #005bf80f;
  --px-fill-selected-strong: #005bf81a;
  --px-seg-on: #fff;
  --px-seg-on-shadow: 0 1px 2px #10182814, 0 0 0 1px #1018280f;
  --px-border-hairline: #1018280e;
  --px-border-default: #10182816;
  --px-border-strong: #10182829;
  --px-border-focus: #005bf8;
  --px-focus-glow: 0 0 0 3px #005bf829;
  --px-focus-glow-danger: 0 0 0 3px #c8283f24;
  --px-ring-focus: 0 0 0 2px #fff, 0 0 0 4px #005bf880;
  --px-text-primary: #1a1d24;
  --px-text-secondary: #4a505c;
  --px-text-tertiary: #6b717d;
  --px-text-disabled: #a3a8b2;
  --px-text-strong: #0f1623;
  --px-text-link: #004bd4;
  --px-text-link-hover: #0039a6;
  --px-text-on-brand: #fff;
  --px-text-on-accent: #241200;
  --px-text-on-dark: #fff;
  --px-brand: #005bf8;
  --px-brand-hover: #004bd4;
  --px-brand-text: #004bd4;
  --px-accent: #fb9101;
  --px-accent-text: #a05800;
  --px-nav-fg: #3e4450;
  --px-nav-fg-strong: #14171d;
  --px-nav-fg-3: #6b717d;
  --px-nav-active-bg: linear-gradient(180deg, #ffffff3d 0%, #fff0 55%), linear-gradient(180deg, #2a78ff 0%, #005bf8 100%);
  --px-nav-active-fg: #fff;
  --px-nav-active-shadow: 0 1px 2px #00288c4d, 0 4px 12px #005bf840, inset 0 1px 0 #ffffff4d;
  --px-nav-icon-on: #fff;
  --px-ic-duo: #005bf8;
  --px-ic-duo-opacity: .24;
  --px-ic-duo-on: #fff;
  --px-ic-duo-on-opacity: .3;
  --px-success: #15803d;
  --px-success-bg: #e3f5e9;
  --px-success-border: #15803d38;
  --px-warning: #a05800;
  --px-warning-bg: #fff8f1;
  --px-warning-border: #b564003d;
  --px-danger: #c8283f;
  --px-danger-bg: #fdecee;
  --px-danger-border: #c8283f38;
  --px-info: #004bd4;
  --px-info-bg: #f2f7ff;
  --px-info-border: #004bd433;
  --px-neutral: #4a505c;
  --px-neutral-bg: #1018280f;
  --px-neutral-border: #1018281a;
  --px-chart-1: #005bf8;
  --px-chart-2: #9aa2b1;
  --px-chart-3: #16a34a;
  --px-chart-4: #fb9101;
  --px-chart-5: #7c5cf0;
  --px-chart-6: #0ea5c6;
  --px-chart-7: #e2489a;
  --px-chart-8: #c9a20f;
  --px-chart-area: #005bf81a;
  --px-chart-bar: #10182814;
  --px-chart-grid: #1018280f;
  --px-chart-axis: #7a808c;
  --px-chart-dot: #fff;
  --px-table-bg: var(--px-gl-solid);
  --px-table-head-bg: #003caa09;
  --px-table-head-fg: #5f6676;
  --px-table-zebra: #003caa05;
  --px-bulk-bg: #1a1d24;
  --px-bulk-fg: #fff;
  --px-bulk-fg-3: #a6acb8;
  --px-bulk-hover: #ffffff1a;
  --px-bulk-line: #ffffff29;
  --px-bulk-danger: #ffb4bf;
  --px-tip-bg: #1a1d24;
  --px-tip-fg: #fff;
  --px-toast-bg: #1a1d24f0;
  --px-toast-fg: #fff;
  --px-btn-primary-bg: linear-gradient(180deg, #ffffff38 0%, #fff0 52%), linear-gradient(180deg, #1f6dff 0%, #005bf8 100%);
  --px-btn-primary-bg-hover: linear-gradient(180deg, #fff3 0%, #fff0 52%), linear-gradient(180deg, #0a62ff 0%, #004bd4 100%);
  --px-btn-primary-fg: #fff;
  --px-btn-primary-shadow: 0 1px 2px #00288c4d, 0 4px 12px #005bf833, inset 0 1px 0 #ffffff4d;
  --px-btn-accent-bg: #fb9101;
  --px-btn-accent-fg: #241200;
  --px-chip-shadow: 0 1px 2px #1018280f;
  --px-co-av-bg: #fb9101;
  --px-co-av-fg: #241200;
  --px-avatar-bg: #005bf8;
  --px-avatar-fg: #fff;
  --px-avatar-ring: #ffffff4d;
  --px-avatar-s: 45%;
  --px-avatar-l: 90%;
  --px-avatar-fg-l: 32%;
  --px-switch-track: #10182829;
  --px-switch-knob: #fff;
  --px-selection: #005bf82e;
  --px-overlay: #10182847;
  --px-shadow-xs: 0 1px 2px #1018280f;
  --px-shadow-card: var(--px-gl-shadow);
  --px-shadow-pop: var(--px-gl-shadow-overlay);
  --px-shadow-panel: var(--px-gl-shadow-overlay);
  --px-shadow-knob: 0 1px 2px #10182840;
  --px-inset-hi: inset 0 1px 0 var(--px-gl-edge);
  --px-shadow-ink: #1018281f;
  --px-input-inset: none;
}

html:root:root[data-theme="dark"] {
  --lightningcss-light: ;
  --lightningcss-dark: initial;
  color-scheme: dark;
  --px-canvas-solid: #05070d;
  --px-sky: radial-gradient(70vw 60vh at 0% 0%, #005bf838, transparent 70%),
    radial-gradient(50vw 50vh at 100% 6%, #4887ff1a, transparent 70%),
    radial-gradient(60vw 55vh at 100% 100%, #fb910121, transparent 70%),
    radial-gradient(40vw 40vh at 10% 100%, #005bf814, transparent 70%),
    linear-gradient(180deg, #0a0f1c 0%, #070a14 55%, #05070d 100%);
  --px-gl-panel: #141c3080;
  --px-gl-chrome: #0a0e1a8c;
  --px-gl-raised: #2836565c;
  --px-gl-overlay: #0e1424d1;
  --px-gl-solid: #0c111ee0;
  --px-gl-line: #a0beff1a;
  --px-gl-outline: #a0beff14;
  --px-gl-edge: #ffffff1a;
  --px-gl-sheen: inset 0 var(--px-space-3) var(--px-space-4) calc(var(--px-space-3) * -1) #ffffff0d;
  --px-gl-shadow: 0 1px 2px #0000004d, 0 10px 30px #0000004d, 0 30px 60px #0003;
  --px-gl-shadow-raised: 0 1px 2px #00000040;
  --px-gl-shadow-overlay: 0 0 0 1px #a0beff14, 0 20px 50px #0000008c;
  --px-surface-sidebar: var(--px-gl-chrome);
  --px-surface-topbar: var(--px-gl-chrome);
  --px-surface-card: var(--px-gl-panel);
  --px-surface-tile: var(--px-gl-raised);
  --px-surface-solid: var(--px-gl-solid);
  --px-surface-overlay: var(--px-gl-overlay);
  --px-surface-chip: var(--px-gl-raised);
  --px-card-border: var(--px-gl-line);
  --px-card-hi: var(--px-gl-edge);
  --px-chip-border: #a0beff24;
  --px-fill-hover: #8cafff12;
  --px-fill-pressed: #8cafff1f;
  --px-fill-sunken: #8cafff0f;
  --px-fill-input: #ffffff0b;
  --px-fill-selected: #4887ff1a;
  --px-fill-selected-strong: #4887ff2b;
  --px-seg-on: #ffffff17;
  --px-seg-on-shadow: none;
  --px-border-hairline: #ffffff0d;
  --px-border-default: #ffffff14;
  --px-border-strong: #ffffff26;
  --px-border-focus: #4887ff;
  --px-focus-glow: 0 0 0 3px #4887ff4d;
  --px-focus-glow-danger: 0 0 0 3px #f8718533;
  --px-ring-focus: 0 0 0 2px #07080b, 0 0 0 4px #4887ffb3;
  --px-text-primary: #edeff3;
  --px-text-secondary: #b5bac5;
  --px-text-tertiary: #868c99;
  --px-text-disabled: #555b66;
  --px-text-strong: #fff;
  --px-text-link: #78a8ff;
  --px-text-link-hover: #a6c7ff;
  --px-text-on-brand: #fff;
  --px-text-on-accent: #241200;
  --px-text-on-dark: #edeff3;
  --px-brand: #005bf8;
  --px-brand-hover: #4887ff;
  --px-brand-text: #78a8ff;
  --px-accent: #fb9101;
  --px-accent-text: #ffac5d;
  --px-nav-fg: #aeb3be;
  --px-nav-fg-strong: #f2f3f6;
  --px-nav-fg-3: #868c99;
  --px-nav-active-bg: linear-gradient(180deg, #fff3 0%, #fff0 55%), linear-gradient(180deg, #2a78ff 0%, #004bd4 100%);
  --px-nav-active-fg: #fff;
  --px-nav-active-shadow: 0 4px 14px #005bf859, inset 0 1px 0 #ffffff38;
  --px-nav-icon-on: #fff;
  --px-ic-duo: #4887ff;
  --px-ic-duo-opacity: .32;
  --px-ic-duo-on: #fff;
  --px-ic-duo-on-opacity: .3;
  --px-success: #4ade80;
  --px-success-bg: #4ade801f;
  --px-success-border: #4ade8042;
  --px-warning: #ffac5d;
  --px-warning-bg: #fb910124;
  --px-warning-border: #fb91014d;
  --px-danger: #f87185;
  --px-danger-bg: #f8718521;
  --px-danger-border: #f871854d;
  --px-info: #78a8ff;
  --px-info-bg: #4887ff26;
  --px-info-border: #4887ff4d;
  --px-neutral: #b5bac5;
  --px-neutral-bg: #ffffff12;
  --px-neutral-border: #ffffff1f;
  --px-chart-1: #4887ff;
  --px-chart-2: #7d8494;
  --px-chart-3: #4ade80;
  --px-chart-4: #fb9101;
  --px-chart-5: #a78bfa;
  --px-chart-6: #22c7e0;
  --px-chart-7: #f472b6;
  --px-chart-8: #e8c547;
  --px-chart-area: #4887ff29;
  --px-chart-bar: #ffffff17;
  --px-chart-grid: #ffffff0d;
  --px-chart-axis: #868c99;
  --px-chart-dot: #0b0d12;
  --px-table-bg: var(--px-gl-solid);
  --px-table-head-bg: #8cafff0a;
  --px-table-head-fg: #8f97a8;
  --px-table-zebra: #8cafff06;
  --px-bulk-bg: #1c2333;
  --px-bulk-fg: #eef1f7;
  --px-bulk-fg-3: #98a3bc;
  --px-bulk-hover: #ffffff14;
  --px-bulk-line: #ffffff1f;
  --px-bulk-danger: #ff9aaa;
  --px-tip-bg: #232731;
  --px-tip-fg: #edeff3;
  --px-toast-bg: #1e222bf0;
  --px-toast-fg: #edeff3;
  --px-btn-primary-bg: linear-gradient(180deg, #fff3 0%, #fff0 52%), linear-gradient(180deg, #2a78ff 0%, #005bf8 100%);
  --px-btn-primary-bg-hover: linear-gradient(180deg, #ffffff3d 0%, #fff0 52%), linear-gradient(180deg, #4887ff 0%, #1c6eff 100%);
  --px-btn-primary-fg: #fff;
  --px-btn-primary-shadow: 0 4px 14px #005bf84d, inset 0 1px 0 #ffffff40;
  --px-btn-accent-bg: #fb9101;
  --px-btn-accent-fg: #241200;
  --px-chip-shadow: 0 1px 2px #0000004d;
  --px-co-av-bg: #fb9101;
  --px-co-av-fg: #241200;
  --px-avatar-bg: #005bf8;
  --px-avatar-fg: #fff;
  --px-avatar-ring: #ffffff1f;
  --px-avatar-s: 45%;
  --px-avatar-l: 28%;
  --px-avatar-fg-l: 84%;
  --px-switch-track: #ffffff24;
  --px-switch-knob: #fff;
  --px-selection: #4887ff4d;
  --px-overlay: #0000008c;
  --px-shadow-xs: 0 1px 2px #0006;
  --px-shadow-card: var(--px-gl-shadow);
  --px-shadow-pop: var(--px-gl-shadow-overlay);
  --px-shadow-panel: var(--px-gl-shadow-overlay);
  --px-shadow-knob: 0 1px 2px #0006;
  --px-inset-hi: inset 0 1px 0 var(--px-gl-edge);
  --px-shadow-ink: #0006;
  --px-input-inset: none;
}

@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  html:root:root:not([data-theme="dark"]) {
    --px-gl-panel: #f9fbff;
    --px-gl-chrome: #f3f6fc;
    --px-gl-raised: #fff;
    --px-gl-overlay: #fff;
    --px-gl-solid: #fff;
  }

  html:root:root[data-theme="dark"] {
    --px-gl-panel: #10172a;
    --px-gl-chrome: #0b1020;
    --px-gl-raised: #18213a;
    --px-gl-overlay: #141c31;
    --px-gl-solid: #0e1426;
  }
}

@media (prefers-reduced-transparency: reduce) {
  html:root:root:not([data-theme="dark"]) {
    --px-gl-panel: #f9fbff;
    --px-gl-chrome: #f3f6fc;
    --px-gl-raised: #fff;
    --px-gl-overlay: #fff;
    --px-gl-solid: #fff;
    --px-gl-blur-panel: 0px;
    --px-gl-blur-raised: 0px;
    --px-gl-blur-overlay: 0px;
  }

  html:root:root[data-theme="dark"] {
    --px-gl-panel: #10172a;
    --px-gl-chrome: #0b1020;
    --px-gl-raised: #18213a;
    --px-gl-overlay: #141c31;
    --px-gl-solid: #0e1426;
    --px-gl-blur-panel: 0px;
    --px-gl-blur-raised: 0px;
    --px-gl-blur-overlay: 0px;
  }
}

html:root:root:root {
  --px-size-mascot-md: 64px;
  --px-kb-inset: 0px;
  --px-size-strip-bar: 4px;
  --px-size-chat-menu: 300px;
  --px-size-strip: 40px;
  --px-size-mini: 30px;
  --px-size-brief-more: 300px;
  --px-size-chat-col: 760px;
  --px-size-dock: 88px;
  --px-dur-mat: .32s;
  --px-size-mascot-home: 44px;
  --px-size-ph-chip: 32px;
  --px-size-ph-dot: 8px;
  --px-size-ph-spark: 16px;
  --px-size-ph-spark-stroke: 1.5px;
  --px-size-ph-sheet: 440px;
  --px-size-ph-grip: 36px;
  --px-size-ph-grip-h: 4px;
  --px-dur-sheet: .26s;
  --px-size-ph-pill: 30px;
  --px-size-ph-pill-icon: 14px;
  --px-speed-ph-pills: 34;
  --px-size-eh-row: 48px;
  --px-size-eh-chip: 32px;
  --px-size-eh-gear: 36px;
  --px-size-eh-tab: 36px;
  --px-type-eh-title: 20px;
  --px-type-eh-title-lg: 24px;
  --px-type-eh-tab: 14px;
  --px-type-eh-sub: 13px;
  --px-type-tile-label: 13px;
}

@media (min-width: 768px) {
  html:root:root[data-density="ops"] {
    --px-text-13: 13px;
    --px-text-12-5: 13px;
    --px-text-14: 14px;
    --px-text-16: 15px;
    --px-text-18: 17px;
    --px-lh-13: 20px;
    --px-lh-12: 18px;
    --px-type-page-title: 20px;
    --px-lh-page-title: 26px;
    --px-type-card-title: 15px;
    --px-lh-card-title: 20px;
    --px-type-kpi: 24px;
    --px-lh-kpi: 30px;
    --px-type-label: 12px;
    --px-type-meta: 12px;
    --px-size-row: 32px;
    --px-size-row-compact: 28px;
    --px-size-btn-sm: 30px;
    --px-size-btn-xs: 26px;
    --px-size-input: 32px;
    --px-size-palette-row: 34px;
  }
}

/* [project]/apps/web/app/ds-base.css [app-client] (css) */
html:root:root:root {
  --hk-sky-top: var(--px-canvas-solid);
  --hk-sky-bottom: var(--px-canvas-solid);
  --hk-text: var(--px-text-primary);
  --hk-text-2: var(--px-text-secondary);
  --hk-text-3: var(--px-text-tertiary);
  --hk-ink: var(--px-brand);
  --hk-ink-hover: var(--px-brand-hover);
  --hk-on-ink: var(--px-text-on-brand);
  --hk-stroke: var(--px-border-default);
  --hk-stroke-2: var(--px-border-hairline);
  --hk-wash: var(--px-fill-hover);
  --hk-wash-2: var(--px-fill-pressed);
  --hk-regular: var(--px-surface-card);
  --hk-thin: var(--px-surface-tile);
  --hk-glass: var(--px-surface-card);
  --hk-cell: var(--px-surface-tile);
  --hk-solid: var(--px-surface-overlay);
  --hk-shadow: var(--px-shadow-card);
  --hk-shadow-pop: var(--px-shadow-pop);
  --hk-info: var(--px-info);
  --hk-success: var(--px-success);
  --hk-danger: var(--px-danger);
  --hk-warning: var(--px-warning);
  --hk-blur: var(--px-blur-surface);
  --px-app-bg: transparent;
  --px-app-tint: transparent;
  --px-app-sidebar: var(--px-surface-sidebar);
  --px-app-user-bubble: var(--px-surface-tile);
  --px-atmosphere: var(--px-sky);
  --px-atmosphere-base: var(--px-canvas-solid);
  --px-color-bg: var(--px-canvas-solid);
  --px-color-text: var(--px-text-primary);
  --px-color-text-muted: var(--px-text-secondary);
  --px-color-text-subtle: var(--px-text-tertiary);
  --px-color-primary: var(--px-brand-text);
  --px-color-primary-hover: var(--px-text-link-hover);
  --px-color-primary-contrast: var(--px-text-on-brand);
  --px-color-primary-subtle: var(--px-fill-selected);
  --px-brand-subtle: var(--px-fill-selected);
  --px-action-solid: var(--px-brand);
  --px-action-solid-hover: var(--px-brand-hover);
  --px-action-on-solid: var(--px-text-on-brand);
  --px-action-soft: var(--px-surface-chip);
  --px-action-soft-hover: var(--px-fill-pressed);
  --px-button-primary-bg: var(--px-btn-primary-bg);
  --px-button-primary-bg-hover: var(--px-btn-primary-bg-hover);
  --px-button-primary-fg: var(--px-btn-primary-fg);
  --px-button-secondary-bg: var(--px-surface-chip);
  --px-button-secondary-bg-hover: var(--px-fill-pressed);
  --px-button-secondary-fg: var(--px-text-primary);
  --px-button-secondary-border: var(--px-chip-border);
  --px-segmented-active-bg: var(--px-seg-on);
  --px-segmented-active-fg: var(--px-text-primary);
  --px-segmented-fg: var(--px-text-secondary);
  --px-focus-ring: var(--px-border-focus);
  --px-border-subtle: var(--px-border-hairline);
  --px-border-input: var(--px-border-strong);
  --px-border-field: var(--px-border-default);
  --px-border-glass: var(--px-card-border);
  --px-color-border: var(--px-border-default);
  --px-color-border-strong: var(--px-border-strong);
  --px-color-border-input: var(--px-border-strong);
  --px-surface-glass: var(--px-surface-card);
  --px-surface-glass-strong: var(--px-surface-solid);
  --px-surface-glass-hover: var(--px-fill-hover);
  --px-surface-popover: var(--px-surface-overlay);
  --px-surface-sunken: var(--px-fill-sunken);
  --px-surface-hover-tint: var(--px-fill-hover);
  --px-surface-raised: var(--px-surface-solid);
  --px-popover-bg: var(--px-surface-overlay);
  --px-popover-border: var(--px-border-default);
  --px-popover-shadow: var(--px-shadow-pop);
  --px-popover-radius: var(--px-radius-tile-lg);
  --px-popover-blur: var(--px-blur-overlay);
  --px-input-bg: var(--px-fill-input);
  --px-input-border: var(--px-border-default);
  --px-input-border-hover: var(--px-border-strong);
  --px-input-border-focus: var(--px-border-focus);
  --px-input-shadow: var(--px-input-inset);
  --px-input-ring: var(--px-focus-glow);
  --px-input-ring-invalid: var(--px-focus-glow-danger);
  --px-input-placeholder: var(--px-text-tertiary);
  --px-picker-bg: var(--px-surface-tile);
  --px-picker-badge-bg: var(--px-brand);
  --px-picker-badge-fg: var(--px-text-on-brand);
  --px-progress-track: var(--px-fill-sunken);
  --px-progress-fill: var(--px-brand);
  --px-glass-fill: var(--px-surface-card);
  --px-glass-fill-strong: var(--px-surface-solid);
  --px-glass-border: var(--px-card-border);
  --px-glass-highlight: var(--px-inset-hi);
  --px-glass-shadow: var(--px-inset-hi), var(--px-shadow-card);
  --px-glass-blur: var(--px-blur-surface);
  --px-glass-saturate: var(--px-saturate);
  --px-color-surface: var(--px-surface-card);
  --px-color-surface-muted: var(--px-fill-sunken);
  --px-shadow-card: var(--px-inset-hi), var(--px-shadow-card);
  --px-shadow-popover: var(--px-shadow-pop);
  --px-scrim: var(--px-overlay);
  --px-elevation-1: var(--px-shadow-xs);
  --px-elevation-2: var(--px-shadow-card);
  --px-elevation-3: var(--px-shadow-panel);
  --px-elevation-4: var(--px-shadow-pop);
  --px-color-info: var(--px-info);
  --px-color-success: var(--px-success);
  --px-color-danger: var(--px-danger);
  --px-color-warning: var(--px-warning);
  --px-info-subtle: var(--px-info-bg);
  --px-success-subtle: var(--px-success-bg);
  --px-danger-subtle: var(--px-danger-bg);
  --px-warning-subtle: var(--px-warning-bg);
  --px-color-info-subtle: var(--px-info-bg);
  --px-color-success-subtle: var(--px-success-bg);
  --px-color-danger-subtle: var(--px-danger-bg);
  --px-color-warning-subtle: var(--px-warning-bg);
  --px-font-size-2xs: var(--px-text-11);
  --px-font-size-xs: var(--px-text-12);
  --px-font-size-sm: var(--px-text-13);
  --px-font-size-md: var(--px-text-14);
  --px-font-size-lg: var(--px-text-16);
  --px-font-size-xl: var(--px-text-18);
  --px-font-size-2xl: var(--px-text-20);
  --px-font-size-display-sm: var(--px-text-20);
  --px-font-size-display-md: var(--px-text-24);
  --px-font-size-display-lg: var(--px-text-24);
  --px-button-height: var(--px-size-btn-sm);
  --px-button-height-sm: var(--px-size-btn-xs);
  --px-button-radius: var(--px-radius-control);
  --px-button-padding-x: var(--px-space-2-5);
  --px-button-font-size: var(--px-text-13);
  --px-button-font-weight: var(--px-weight-medium);
  --px-input-height: var(--px-size-input);
  --px-input-radius: var(--px-radius-pill);
  --px-input-padding-x: var(--px-space-2-5);
  --px-textarea-radius: var(--px-radius-tile-lg);
  --px-option-height: var(--px-size-btn-sm);
  --px-option-radius: var(--px-radius-md);
  --px-segmented-height: var(--px-size-btn-sm);
  --px-segmented-padding: var(--px-space-0-5);
  --px-segmented-item-padding-x: var(--px-space-2);
  --px-card-radius: var(--px-radius-card);
  --px-card-padding: var(--px-space-3);
  --px-card-gap: var(--px-space-2-5);
  --px-control-height: var(--px-size-btn-sm);
  --px-duration-fast: var(--px-dur-hover);
  --px-duration-base: var(--px-dur-pop);
  --px-duration-slow: var(--px-dur-panel);
  background: var(--px-canvas-solid);
}

html:root:root:root body {
  color: var(--px-text-primary);
  font-family: var(--px-font-sans);
  font-size: var(--px-text-13);
  line-height: var(--px-lh-13);
  letter-spacing: var(--px-tracking-base);
  font-feature-settings: "cv11";
  font-weight: var(--px-weight-regular);
  -webkit-font-smoothing: antialiased;
  background: none;
}

html:root:root:root ::selection {
  background: var(--px-selection);
}

html:root .sky {
  display: none;
}

html:root:root:root body:before {
  content: "";
  z-index: -1;
  pointer-events: none;
  background: var(--px-sky), var(--px-canvas-solid);
  position: fixed;
  inset: 0;
}

:where(.ds-shell) h1, :where(.ds-shell) h2, :where(.ds-shell) h3 {
  font-family: var(--px-font-sans);
  letter-spacing: var(--px-tracking-tight);
}

.ds-num, .fin-num {
  font-variant-numeric: var(--px-numeric);
  letter-spacing: var(--px-tracking-num);
}

:focus-visible {
  outline: var(--px-stroke-2) solid var(--px-border-focus);
  outline-offset: var(--px-space-0-5);
}

.ds-card {
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  border-radius: var(--px-radius-card);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
}

.ds-tile {
  background: var(--px-surface-tile);
  border-radius: var(--px-radius-tile-lg);
}

.ds-solid {
  background: var(--px-surface-solid);
  border: var(--px-hairline) solid var(--px-border-default);
  border-radius: var(--px-radius-card);
  box-shadow: var(--px-shadow-card);
}

.ds-overlay {
  background: var(--px-surface-overlay);
  border: var(--px-hairline) solid var(--px-border-default);
  box-shadow: var(--px-shadow-pop);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(var(--px-saturate));
}

@keyframes ds-fade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes ds-menu {
  from {
    opacity: 0;
    transform: translateY(calc(var(--px-shift-1) * -1)) scale(var(--px-pop-scale));
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ds-slide-in {
  from {
    transform: translateX(calc(var(--px-shift-3) * -1));
    opacity: var(--px-opacity-muted);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ds-drawer {
  from {
    transform: translateX(var(--px-shift-3));
    opacity: var(--px-opacity-muted);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ds-toast {
  from {
    transform: translateY(var(--px-shift-2));
    opacity: 0;
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ds-rise {
  from {
    opacity: 0;
    transform: translateY(var(--px-shift-1));
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes ds-tip {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

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

@keyframes px-shimmer {
  from {
    background-position: 100% 0;
  }

  to {
    background-position: -200% 0;
  }
}

@keyframes ds-draw {
  from {
    stroke-dashoffset: var(--px-chart-dash);
  }

  to {
    stroke-dashoffset: 0;
  }
}

.ds-shell {
  --sbw: var(--px-size-sidebar);
  grid-template-columns: var(--sbw) minmax(0, 1fr);
  min-height: 100dvh;
  z-index: var(--px-z-raised);
  display: grid;
  position: relative;
}

.ds-shell[data-collapsed] {
  --sbw: var(--px-size-rail);
}

@media (max-width: 1279px) {
  .ds-shell {
    --sbw: var(--px-size-rail);
  }
}

@media (max-width: 767px) {
  .ds-shell {
    grid-template-columns: minmax(0, 1fr);
  }
}

.ds-sb {
  height: 100dvh;
  z-index: var(--px-z-sidebar);
  background: var(--px-surface-sidebar);
  border-right: var(--px-hairline) solid var(--px-card-border);
  min-width: 0;
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  position: sticky;
  top: 0;
  container: dssb / inline-size;
}

.ds-sb__in {
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

@media (max-width: 1279px) {
  .ds-shell[data-open] .ds-sb {
    width: var(--px-size-sidebar);
    background: var(--px-surface-overlay);
    box-shadow: var(--px-shadow-pop);
    animation: ds-slide-in var(--px-dur-panel) var(--px-ease-out);
    position: fixed;
    inset: 0 auto 0 0;
  }
}

@media (max-width: 767px) {
  .ds-sb {
    width: min(var(--px-size-drawer-phone), 86vw);
    visibility: hidden;
    background: var(--px-surface-overlay);
    transition: transform var(--px-dur-panel) var(--px-ease-out), visibility 0s linear var(--px-dur-panel);
    position: fixed;
    inset: 0 auto 0 0;
    transform: translateX(-102%);
  }

  .ds-shell[data-open] .ds-sb {
    visibility: visible;
    width: min(var(--px-size-drawer-phone), 86vw);
    transition: transform var(--px-dur-panel) var(--px-ease-out);
    animation: none;
    transform: none;
  }
}

.ds-sb__head {
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-topbar);
  padding: 0 var(--px-space-2) 0 var(--px-space-3);
  flex: none;
  display: flex;
}

.ds-sb__brand {
  align-items: center;
  gap: var(--px-space-2);
  color: var(--px-nav-fg-strong);
  font-weight: var(--px-weight-semibold);
  font-size: var(--px-text-14);
  flex: 1;
  min-width: 0;
  text-decoration: none;
  display: inline-flex;
}

.ds-sb__brand img, .ds-sb__brand svg {
  width: var(--px-size-icon-lg);
  height: var(--px-size-icon-lg);
  flex: none;
}

.ds-sb__jump {
  align-items: center;
  gap: var(--px-space-2);
  margin: 0 var(--px-space-2) var(--px-space-1-5);
  height: var(--px-size-input);
  padding: 0 var(--px-space-1-5) 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--px-chip-border);
  background: var(--px-fill-input);
  color: var(--px-text-tertiary);
  font: inherit;
  font-size: var(--px-text-13);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--px-dur-hover) var(--px-ease-linear);
  flex: none;
  display: flex;
}

.ds-sb__jump:hover {
  border-color: var(--px-border-strong);
}

.ds-sb__jump .ds-lbl {
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
  overflow: hidden;
}

.ds-sb__nav {
  min-height: 0;
  padding: var(--px-space-0-5) var(--px-space-2) var(--px-space-2);
  scrollbar-width: thin;
  scrollbar-color: var(--px-border-strong) transparent;
  flex: 1;
  overflow: hidden auto;
}

.ds-sb__gt {
  font-size: var(--px-text-11);
  font-weight: var(--px-weight-medium);
  color: var(--px-nav-fg-3);
  padding: var(--px-space-2-5) var(--px-space-2) var(--px-space-1);
  white-space: nowrap;
}

.ds-nav {
  align-items: center;
  gap: var(--px-space-2);
  width: 100%;
  height: var(--px-size-nav);
  padding: 0 var(--px-space-2);
  margin: var(--px-space-px) 0;
  border-radius: var(--px-radius-control);
  font: inherit;
  font-size: var(--px-text-13);
  text-align: left;
  color: var(--px-nav-fg);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear);
  background: none;
  border: 0;
  text-decoration: none;
  display: flex;
  position: relative;
}

.ds-nav svg {
  width: var(--px-size-nav-icon);
  height: var(--px-size-nav-icon);
  color: var(--px-nav-fg-3);
  flex: none;
}

.ds-nav:hover {
  background: var(--px-fill-hover);
  color: var(--px-nav-fg-strong);
}

.ds-nav[aria-current="page"], .ds-nav[data-here] {
  background: var(--px-nav-active-bg);
  color: var(--px-nav-active-fg);
  box-shadow: var(--px-nav-active-shadow);
  font-weight: var(--px-weight-medium);
}

.ds-nav[aria-current="page"] svg, .ds-nav[data-here] svg {
  color: var(--px-nav-icon-on);
}

.ds-nav .ds-lbl {
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.ds-nav__chev {
  transition: transform var(--px-dur-pop) var(--px-ease-out);
  display: inline-flex;
}

.ds-nav__chev svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
}

.ds-nav[aria-expanded="true"] .ds-nav__chev {
  transform: rotate(90deg);
}

.ds-sb__sub {
  margin: var(--px-space-0-5) 0 var(--px-space-1) var(--px-space-3-5);
  padding-left: var(--px-space-2);
  border-left: var(--px-hairline) solid var(--px-border-default);
  gap: var(--px-space-px);
  flex-direction: column;
  display: flex;
}

.ds-sb__sub[hidden] {
  display: none;
}

.ds-subnav {
  height: var(--px-size-nav-sub);
  padding: 0 var(--px-space-2);
  border-radius: var(--px-radius-md);
  color: var(--px-nav-fg);
  font-size: var(--px-text-13);
  white-space: nowrap;
  text-overflow: ellipsis;
  transition: background var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear);
  align-items: center;
  text-decoration: none;
  display: flex;
  overflow: hidden;
}

.ds-subnav:hover {
  background: var(--px-fill-hover);
  color: var(--px-nav-fg-strong);
}

.ds-subnav[aria-current="page"] {
  background: var(--px-nav-active-bg);
  color: var(--px-nav-active-fg);
  box-shadow: var(--px-nav-active-shadow);
  font-weight: var(--px-weight-medium);
}

.ds-sb__chat {
  height: var(--px-size-row-compact);
  line-height: var(--px-size-row-compact);
  padding: 0 var(--px-space-2);
  border-radius: var(--px-radius-md);
  color: var(--px-nav-fg);
  font-size: var(--px-text-12-5);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-decoration: none;
  display: block;
  overflow: hidden;
}

.ds-sb__chat:hover {
  background: var(--px-fill-hover);
  color: var(--px-nav-fg-strong);
}

.ds-sb__chat[aria-current="page"] {
  background: var(--px-nav-active-bg);
  color: var(--px-nav-active-fg);
}

.ds-sb__foot {
  border-top: var(--px-hairline) solid var(--px-border-hairline);
  padding: var(--px-space-1-5) var(--px-space-2) var(--px-space-2);
  flex: none;
}

@container dssb (max-width: 120px) {
  .ds-sb__head {
    justify-content: center;
    gap: var(--px-space-1);
    height: auto;
    padding: var(--px-space-2) 0 0;
    flex-direction: column;
  }

  .ds-sb__brand {
    flex: none;
    justify-content: center;
  }

  .ds-sb__word, .ds-lbl, .ds-kbd-in, .ds-sb__gt, .ds-nav__chev, .ds-sb__sub, .ds-sb__chats {
    display: none !important;
  }

  .ds-sb__jump {
    width: var(--px-size-rail-hit);
    height: var(--px-size-rail-hit);
    margin: var(--px-space-1) auto var(--px-space-1-5);
    background: none;
    border-color: #0000;
    justify-content: center;
    padding: 0;
  }

  .ds-sb__jump:hover {
    background: var(--px-fill-hover);
  }

  .ds-sb__nav {
    padding: var(--px-space-0-5) var(--px-space-2);
    scrollbar-width: none;
  }

  .ds-sb__grp + .ds-sb__grp {
    border-top: var(--px-hairline) solid var(--px-border-hairline);
    margin-top: var(--px-space-1-5);
    padding-top: var(--px-space-1-5);
  }

  .ds-nav {
    width: var(--px-size-rail-hit);
    height: var(--px-size-rail-hit);
    margin: var(--px-space-0-5) auto;
    justify-content: center;
    padding: 0;
  }

  .ds-sb__foot {
    padding: var(--px-space-1-5) var(--px-space-2);
    justify-content: center;
    display: flex;
  }
}

.ds-tip {
  z-index: var(--px-z-tooltip);
  pointer-events: none;
  align-items: center;
  gap: var(--px-space-2);
  padding: var(--px-space-1) var(--px-space-2);
  border-radius: var(--px-radius-md);
  font-size: var(--px-text-12);
  background: var(--px-tip-bg);
  color: var(--px-tip-fg);
  box-shadow: var(--px-shadow-pop);
  white-space: nowrap;
  animation: ds-tip var(--px-dur-pop) var(--px-ease-out);
  display: inline-flex;
  position: fixed;
  transform: translateY(-50%);
}

.ds-scrim {
  z-index: calc(var(--px-z-sidebar) - 1);
  background: var(--px-overlay);
  animation: ds-fade var(--px-dur-panel) var(--px-ease-out);
  border: 0;
  padding: 0;
  position: fixed;
  inset: 0;
}

@media (min-width: 1280px) {
  .ds-scrim {
    display: none;
  }
}

.ds-main {
  flex-direction: column;
  min-width: 0;
  min-height: 100dvh;
  display: flex;
}

.ds-top {
  z-index: var(--px-z-sticky);
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-topbar);
  padding: 0 var(--px-space-3) 0 var(--px-space-3-5);
  background: var(--px-surface-topbar);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
  min-width: 0;
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  display: flex;
  position: sticky;
  top: 0;
}

.ds-ib.ds-top__menu {
  display: none;
}

@media (max-width: 767px) {
  .ds-ib.ds-top__menu {
    display: inline-flex;
  }

  .ds-top {
    padding: 0 var(--px-space-2);
    gap: var(--px-space-1);
  }
}

.ds-co {
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2) 0 var(--px-space-1);
  border-radius: var(--px-radius-control);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-13);
  cursor: pointer;
  min-width: 0;
  max-width: var(--px-size-company);
  background: none;
  border: 0;
  display: inline-flex;
}

.ds-co:hover {
  background: var(--px-fill-hover);
}

.ds-co__av, .ds-shell .shell-menu__co {
  width: var(--px-size-avatar-sm);
  height: var(--px-size-avatar-sm);
  border-radius: var(--px-radius-sm);
  font-size: var(--px-text-10);
  font-weight: var(--px-weight-bold);
  color: var(--px-co-av-fg);
  background: var(--px-co-av-bg);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.ds-co__name {
  font-weight: var(--px-weight-semibold);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ds-co__meta {
  color: var(--px-text-tertiary);
  font-size: var(--px-text-12);
  white-space: nowrap;
}

.ds-co svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  color: var(--px-text-tertiary);
  flex: none;
}

.ds-crumb {
  align-items: center;
  gap: var(--px-space-1-5);
  min-width: 0;
  font-size: var(--px-text-13);
  color: var(--px-text-secondary);
  white-space: nowrap;
  display: flex;
  overflow: hidden;
}

.ds-crumb a {
  color: inherit;
  text-decoration: none;
}

.ds-crumb a:hover {
  color: var(--px-text-primary);
}

.ds-crumb__sep {
  color: var(--px-text-disabled);
}

.ds-crumb__here {
  color: var(--px-text-primary);
  font-weight: var(--px-weight-medium);
  text-overflow: ellipsis;
  overflow: hidden;
}

.ds-top__title {
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-semibold);
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 0;
  margin: 0;
  overflow: hidden;
}

.ds-top__sp {
  min-width: var(--px-space-2);
  flex: 1;
}

.ds-search {
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-input);
  width: clamp(var(--px-size-search-min), 22vw, var(--px-size-search));
  padding: 0 var(--px-space-1-5) 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--px-chip-border);
  background: var(--px-fill-input);
  color: var(--px-text-tertiary);
  font: inherit;
  font-size: var(--px-text-13);
  cursor: pointer;
  text-align: left;
  transition: border-color var(--px-dur-hover) var(--px-ease-linear);
  display: inline-flex;
}

.ds-search:hover {
  border-color: var(--px-border-strong);
}

.ds-search svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  flex: none;
}

.ds-search span {
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
  overflow: hidden;
}

@media (max-width: 1023px) {
  .ds-search {
    width: var(--px-size-ib);
    background: none;
    border-color: #0000;
    justify-content: center;
    padding: 0;
  }

  .ds-search span, .ds-search .ds-kbds {
    display: none;
  }
}

.ds-ask {
  align-items: center;
  gap: var(--px-space-1-5);
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-1-5) 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--px-chip-border);
  background: var(--px-surface-chip);
  box-shadow: var(--px-chip-shadow);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-medium);
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--px-dur-hover) var(--px-ease-linear), transform var(--px-dur-press) var(--px-ease-out);
  text-decoration: none;
  display: inline-flex;
}

.ds-ask:hover {
  background: var(--px-fill-pressed);
}

.ds-ask:active {
  transform: scale(var(--px-press-scale));
}

.ds-ask svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  color: var(--px-accent);
}

@media (max-width: 1023px) {
  .ds-ask .ds-kbds {
    display: none;
  }
}

@media (max-width: 767px) {
  .ds-ask {
    width: var(--px-size-ib);
    height: var(--px-size-ib);
    flex: none;
    justify-content: center;
    gap: 0;
    padding: 0;
  }

  .ds-ask .ds-ask__lbl {
    display: none;
  }

  .ds-co {
    flex: 0 auto;
  }

  .ds-co > span {
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
    overflow: hidden;
  }
}

.ds-ib {
  width: var(--px-size-ib);
  height: var(--px-size-ib);
  border-radius: var(--px-radius-pill);
  color: var(--px-text-secondary);
  cursor: pointer;
  transition: background var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear), transform var(--px-dur-press) var(--px-ease-out);
  background: none;
  border: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: inline-flex;
  position: relative;
}

.ds-ib:hover {
  background: var(--px-fill-hover);
  color: var(--px-text-primary);
}

.ds-ib:active {
  transform: scale(var(--px-press-scale));
}

.ds-ib svg {
  width: var(--px-size-icon);
  height: var(--px-size-icon);
}

.ds-avatar {
  width: var(--px-size-avatar);
  height: var(--px-size-avatar);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-10);
  font-weight: var(--px-weight-semibold);
  color: var(--px-avatar-fg);
  background: var(--px-avatar-bg);
  box-shadow: inset 0 0 0 var(--px-hairline) var(--px-avatar-ring);
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.ds-avbtn {
  padding: var(--px-space-0-5);
  border-radius: var(--px-radius-pill);
  cursor: pointer;
  background: none;
  border: 0;
  flex: none;
  display: inline-flex;
}

.ds-kbds {
  gap: var(--px-space-0-5);
  display: inline-flex;
}

.ds-kbd, .px-kbd {
  font-family: var(--px-font-sans);
  font-size: var(--px-text-10-5);
  line-height: var(--px-size-kbd);
  min-width: var(--px-size-kbd);
  height: var(--px-size-kbd);
  padding: 0 var(--px-space-1);
  border-radius: var(--px-radius-xs);
  background: var(--px-fill-sunken);
  color: var(--px-text-secondary);
  border: var(--px-hairline) solid var(--px-border-default);
  font-weight: var(--px-weight-medium);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.ds-theme .px-icon-button {
  width: var(--px-size-ib);
  height: var(--px-size-ib);
  min-width: var(--px-size-ib);
  min-height: var(--px-size-ib);
  border-radius: var(--px-radius-pill);
  box-shadow: none;
  color: var(--px-text-secondary);
  background: none;
  border: 0;
}

.ds-theme .px-icon-button:hover {
  background: var(--px-fill-hover);
  color: var(--px-text-primary);
}

.ds-theme .px-icon-button svg {
  width: var(--px-size-icon);
  height: var(--px-size-icon);
}

@media (max-width: 767px) {
  .ds-theme, .ds-hide-sm {
    display: none !important;
  }
}

.ds-content {
  outline: none;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
  position: relative;
}

.ds-content--page {
  padding: var(--px-space-3) var(--px-space-4) calc(var(--px-size-mascot) + var(--px-space-8) + env(safe-area-inset-bottom));
  display: block;
}

@media (max-width: 767px) {
  .ds-content--page {
    padding: var(--px-space-3) var(--px-space-3) calc(var(--px-size-mascot) + var(--px-space-8) + env(safe-area-inset-bottom));
  }
}

.ds-shell .shell-menu {
  display: inline-flex;
  position: relative;
}

.ds-shell .shell-menu__pop {
  z-index: var(--px-z-popover);
  min-width: var(--px-size-menu);
  max-width: min(var(--px-size-menu-max), 92vw);
  padding: var(--px-space-1);
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-surface-overlay);
  border: var(--px-hairline) solid var(--px-border-default);
  box-shadow: var(--px-shadow-pop);
  -webkit-backdrop-filter: blur(var(--px-blur-overlay)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-overlay)) saturate(var(--px-saturate));
  animation: ds-menu var(--px-dur-pop) var(--px-ease-out);
  transform-origin: top;
  max-height: 70dvh;
  position: absolute;
  overflow-y: auto;
}

.ds-shell .shell-menu__pop--bottom-end {
  top: calc(100% + var(--px-space-1-5));
  bottom: auto;
  left: auto;
  right: 0;
}

.ds-shell .shell-menu__pop--bottom-start {
  top: calc(100% + var(--px-space-1-5));
  bottom: auto;
  left: 0;
  right: auto;
}

.ds-shell .shell-menu__pop--top-start {
  bottom: calc(100% + var(--px-space-1-5));
  top: auto;
  left: 0;
  right: auto;
}

.ds-shell .shell-menu__item {
  align-items: center;
  gap: var(--px-space-2);
  width: 100%;
  min-height: var(--px-size-btn-sm);
  padding: var(--px-space-1) var(--px-space-2);
  border-radius: var(--px-radius-md);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-13);
  text-align: left;
  cursor: pointer;
  background: none;
  border: 0;
  text-decoration: none;
  display: flex;
}

.ds-shell .shell-menu__item svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  color: var(--px-text-secondary);
  flex: none;
}

.ds-shell .shell-menu__item:hover, .ds-shell .shell-menu__item:focus-visible {
  background: var(--px-fill-hover);
  outline: 0;
}

.ds-shell .shell-menu__item[aria-checked="true"] {
  background: var(--px-fill-selected);
}

.ds-shell .shell-menu__item--danger, .ds-shell .shell-menu__item--danger svg {
  color: var(--px-danger);
}

.ds-shell .shell-menu__group {
  padding: var(--px-space-0-5) 0;
  border-top: var(--px-hairline) solid var(--px-border-hairline);
}

.ds-shell .shell-menu__group:first-child, .ds-shell .shell-menu__head + .shell-menu__group {
  border-top: 0;
}

.ds-shell .shell-menu__head {
  padding: var(--px-space-1-5) var(--px-space-2) var(--px-space-2);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
  margin-bottom: var(--px-space-0-5);
  flex-direction: column;
  display: flex;
}

.ds-shell .shell-menu__name {
  font-weight: var(--px-weight-semibold);
  font-size: var(--px-text-13);
}

.ds-shell .shell-menu__email, .ds-shell .shell-menu__co-role {
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
}

.ds-shell .shell-menu__label {
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  color: var(--px-text-tertiary);
  padding: var(--px-space-1-5) var(--px-space-2) var(--px-space-0-5);
  letter-spacing: var(--px-tracking-caps);
  text-transform: uppercase;
  margin: 0;
}

.ds-shell .shell-menu__grow {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
}

.ds-shell .shell-menu__themes {
  gap: var(--px-space-0-5);
  padding: var(--px-space-0-5);
  margin: var(--px-space-0-5) var(--px-space-1) var(--px-space-1);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  display: flex;
}

.ds-shell .shell-menu__theme {
  height: var(--px-size-seg);
  border-radius: var(--px-radius-pill);
  color: var(--px-text-secondary);
  font: inherit;
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  cursor: pointer;
  background: none;
  border: 0;
  flex: 1;
}

.ds-shell .shell-menu__theme[aria-checked="true"] {
  background: var(--px-seg-on);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
}

.ds-pop-empty {
  padding: var(--px-space-3-5) var(--px-space-2-5);
  font-size: var(--px-text-13);
  color: var(--px-text-secondary);
  text-align: center;
}

.ds-rename {
  height: var(--px-size-row-compact);
  min-width: 0;
  width: min(var(--px-size-rename), 50vw);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--px-border-focus);
  background: var(--px-fill-input);
  color: var(--px-text-primary);
  font: inherit;
  font-size: var(--px-text-13);
  box-shadow: var(--px-focus-glow);
}

.ds-pal-wrap {
  z-index: var(--px-z-modal);
  padding: 12vh var(--px-space-3) var(--px-space-3);
  background: var(--px-overlay);
  animation: ds-fade var(--px-dur-pop) var(--px-ease-out);
  justify-content: center;
  align-items: flex-start;
  display: flex;
  position: fixed;
  inset: 0;
}

.ds-pal {
  width: min(var(--px-size-palette), 100%);
  border-radius: var(--px-radius-panel);
  max-height: 70dvh;
  animation: ds-menu var(--px-dur-pop) var(--px-ease-out);
  flex-direction: column;
  display: flex;
  overflow: hidden;
}

.ds-pal__in {
  align-items: center;
  gap: var(--px-space-2-5);
  height: var(--px-size-palette-in);
  padding: 0 var(--px-space-3-5);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
  flex: none;
  display: flex;
}

.ds-pal__in svg {
  width: var(--px-size-icon);
  height: var(--px-size-icon);
  color: var(--px-text-tertiary);
  flex: none;
}

.ds-pal__in input {
  all: unset;
  font-size: var(--px-text-14);
  color: var(--px-text-primary);
  flex: 1;
}

.ds-pal__in input::placeholder {
  color: var(--px-text-tertiary);
}

.ds-pal__list {
  padding: var(--px-space-1);
  overflow-y: auto;
}

.ds-pal__h {
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  color: var(--px-text-tertiary);
  padding: var(--px-space-2) var(--px-space-2-5) var(--px-space-1);
  letter-spacing: var(--px-tracking-caps);
  text-transform: uppercase;
}

.ds-pal__it {
  align-items: center;
  gap: var(--px-space-2-5);
  height: var(--px-size-palette-row);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-tile);
  color: var(--px-text-primary);
  font-size: var(--px-text-13);
  cursor: pointer;
  display: flex;
}

.ds-pal__it svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  color: var(--px-text-secondary);
  flex: none;
}

.ds-pal__it em {
  color: var(--px-text-tertiary);
  font-style: normal;
  font-size: var(--px-text-12);
  white-space: nowrap;
  margin-left: auto;
}

.ds-pal__it[aria-selected="true"] {
  background: var(--px-fill-selected-strong);
}

.ds-pal__foot {
  gap: var(--px-space-3-5);
  height: var(--px-size-palette-foot);
  padding: 0 var(--px-space-3);
  border-top: var(--px-hairline) solid var(--px-border-hairline);
  font-size: var(--px-text-11);
  color: var(--px-text-tertiary);
  flex: none;
  align-items: center;
  display: flex;
}

.ds-pal__foot span {
  gap: var(--px-space-1);
  align-items: center;
  display: inline-flex;
}

.ds-ph, .fin-head, .page-header {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-3);
  flex-wrap: wrap;
  min-width: 0;
  display: flex;
}

.ds-ph__crumb {
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
  margin: 0 0 var(--px-space-0-5);
}

html:root .page-title, html:root .fin-head .page-title, html:root .ds-ph__title {
  font-family: var(--px-font-sans);
  font-size: var(--px-text-18);
  line-height: var(--px-lh-18);
  font-weight: var(--px-weight-semibold);
  letter-spacing: var(--px-tracking-tight);
  margin: 0;
}

html:root .fin-head .muted, .ds-ph__sum {
  font-size: var(--px-text-12);
  color: var(--px-text-secondary);
  margin: 0;
}

.ds-ph__count {
  height: var(--px-size-chip);
  padding: 0 var(--px-space-1-5);
  margin-left: var(--px-space-2);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-secondary);
  vertical-align: middle;
  align-items: center;
  display: inline-flex;
}

.ds-ph__actions {
  gap: var(--px-space-1-5);
  flex-wrap: wrap;
  align-items: center;
  display: flex;
}

html:root .px-button {
  min-height: var(--px-size-btn-sm);
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-control);
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-medium);
  gap: var(--px-space-1-5);
  transition: background var(--px-dur-hover) var(--px-ease-linear), border-color var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear), transform var(--px-dur-press) var(--px-ease-out);
}

html:root .px-button:active:not(:disabled) {
  transform: scale(var(--px-press-scale));
}

html:root .px-button--sm {
  min-height: var(--px-size-btn-xs);
  height: var(--px-size-btn-xs);
  padding: 0 var(--px-space-2);
  font-size: var(--px-text-12);
  border-radius: var(--px-radius-md);
}

html:root .px-button--primary {
  background: var(--px-btn-primary-bg);
  color: var(--px-btn-primary-fg);
  border: var(--px-hairline) solid transparent;
  box-shadow: var(--px-btn-primary-shadow);
}

html:root .px-button--primary:hover:not(:disabled) {
  background: var(--px-btn-primary-bg-hover);
}

html:root .px-button--secondary {
  background: var(--px-surface-chip);
  border: var(--px-hairline) solid var(--px-chip-border);
  color: var(--px-text-primary);
  box-shadow: var(--px-chip-shadow);
}

html:root .px-button--secondary:hover:not(:disabled) {
  background: var(--px-fill-pressed);
}

html:root .px-button--ghost {
  color: var(--px-text-secondary);
  box-shadow: none;
  background: none;
  border-color: #0000;
}

html:root .px-button--ghost:hover:not(:disabled) {
  background: var(--px-fill-hover);
  color: var(--px-text-primary);
}

html:root .px-button--danger {
  background: var(--px-danger-bg);
  border: var(--px-hairline) solid var(--px-danger-border);
  color: var(--px-danger);
  box-shadow: none;
}

html:root .px-button:disabled {
  opacity: var(--px-opacity-disabled);
}

html:root .px-button:focus-visible {
  box-shadow: var(--px-ring-focus);
  outline: 0;
}

html:root .px-icon-button {
  width: var(--px-size-ib);
  height: var(--px-size-ib);
  min-width: var(--px-size-ib);
  min-height: var(--px-size-ib);
  border-radius: var(--px-radius-pill);
}

html:root .px-icon-button svg {
  width: var(--px-size-icon);
  height: var(--px-size-icon);
}

html:root .px-input, html:root .px-select__trigger, html:root .fin-input {
  min-height: var(--px-size-input);
  height: var(--px-size-input);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-13);
  background: var(--px-fill-input);
  border: var(--px-hairline) solid var(--px-chip-border);
  color: var(--px-text-primary);
  box-shadow: var(--px-input-inset);
  transition: border-color var(--px-dur-hover) var(--px-ease-linear), box-shadow var(--px-dur-pop) var(--px-ease-standard);
}

html:root .px-input--multiline, html:root textarea.px-input, html:root textarea.fin-input {
  height: auto;
  min-height: calc(var(--px-size-row) * 2);
  padding: var(--px-space-1-5) var(--px-space-2-5);
  line-height: var(--px-lh-normal);
  border-radius: var(--px-radius-tile-lg);
}

html:root .px-input:hover, html:root .px-select__trigger:hover, html:root .fin-input:hover {
  border-color: var(--px-border-strong);
}

html:root .px-input:focus, html:root .px-input:focus-visible, html:root .px-select__trigger:focus-visible, html:root .fin-input:focus, html:root .fin-input:focus-visible {
  border-color: var(--px-border-focus);
  box-shadow: var(--px-focus-glow);
  outline: 0;
}

html:root .px-input::placeholder, html:root .fin-input::placeholder {
  color: var(--px-text-tertiary);
}

html:root .fin-input--sm {
  height: var(--px-size-btn-xs);
  min-height: var(--px-size-btn-xs);
  font-size: var(--px-text-12);
}

html:root select.fin-input, html:root select.px-input {
  padding-right: var(--px-space-6);
}

html:root .px-field {
  gap: var(--px-space-1);
}

html:root .px-field__label {
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-secondary);
}

html:root .px-field__hint {
  font-size: var(--px-text-11);
  color: var(--px-text-tertiary);
}

html:root .px-field__error {
  font-size: var(--px-text-11);
  color: var(--px-danger);
}

html:root input[type="checkbox"], html:root input[type="radio"] {
  accent-color: var(--px-brand);
}

html:root .px-segmented {
  min-height: var(--px-size-btn-sm);
  padding: var(--px-space-0-5);
  gap: var(--px-space-0-5);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  box-shadow: none;
  border: 0;
}

html:root .px-segmented__item {
  min-height: var(--px-size-seg);
  height: var(--px-size-seg);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-secondary);
}

html:root .px-segmented__item[aria-selected="true"], html:root .px-segmented__item[aria-current="page"], html:root .px-segmented__item--active {
  background: var(--px-seg-on);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
}

html:root .px-popover {
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-1);
  background: var(--px-surface-overlay);
  border: var(--px-hairline) solid var(--px-border-default);
  box-shadow: var(--px-shadow-pop);
  animation: ds-menu var(--px-dur-pop) var(--px-ease-out);
}

html:root .px-option {
  min-height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2);
  border-radius: var(--px-radius-md);
  font-size: var(--px-text-13);
  gap: var(--px-space-2);
}

html:root .px-option svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
}

html:root .px-alert {
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2) var(--px-space-3);
  font-size: var(--px-text-13);
}

html:root .px-table {
  font-size: var(--px-text-13);
  background: var(--px-table-bg);
}

html:root .px-table th {
  height: var(--px-size-row);
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  color: var(--px-table-head-fg);
  background: var(--px-table-head-bg);
  padding: 0 var(--px-space-2-5);
  border-bottom: var(--px-hairline) solid var(--px-border-default);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
}

html:root .px-table td {
  height: var(--px-size-row);
  padding: 0 var(--px-space-2-5);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
}

html:root .px-table tbody tr:nth-child(2n) td {
  background: var(--px-table-zebra);
}

html:root .px-table tbody tr:hover td {
  background: var(--px-fill-hover);
}

html:root .px-auth-card {
  border-radius: var(--px-radius-panel);
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
}

html:root .px-auth-card__title {
  font-family: var(--px-font-sans);
  font-size: var(--px-text-20);
  line-height: var(--px-lh-20);
  font-weight: var(--px-weight-semibold);
  letter-spacing: var(--px-tracking-tight);
}

html:root .px-auth-card .px-button, html:root .px-auth-card .px-input {
  height: var(--px-size-rail-hit);
  min-height: var(--px-size-rail-hit);
}

.px-btn {
  justify-content: center;
  align-items: center;
  gap: var(--px-space-1-5);
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-control);
  font: inherit;
  font-weight: var(--px-weight-medium);
  font-size: var(--px-text-13);
  white-space: nowrap;
  cursor: pointer;
  border: var(--px-hairline) solid transparent;
  color: var(--px-text-primary);
  transition: background var(--px-dur-hover) var(--px-ease-linear), border-color var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear), transform var(--px-dur-press) var(--px-ease-out);
  background: none;
  text-decoration: none;
  display: inline-flex;
  position: relative;
}

.px-btn--xs {
  height: var(--px-size-btn-xs);
  padding: 0 var(--px-space-2);
  font-size: var(--px-text-12);
  gap: var(--px-space-1);
  border-radius: var(--px-radius-md);
}

.px-btn:active:not(:disabled) {
  transform: scale(var(--px-press-scale));
}

.px-btn:focus-visible {
  box-shadow: var(--px-ring-focus);
  outline: 0;
}

.px-btn svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
  flex: none;
}

.px-btn--primary {
  background: var(--px-btn-primary-bg);
  color: var(--px-btn-primary-fg);
  box-shadow: var(--px-btn-primary-shadow);
}

.px-btn--primary:hover {
  background: var(--px-btn-primary-bg-hover);
}

.px-btn--secondary {
  background: var(--px-surface-chip);
  border-color: var(--px-chip-border);
  box-shadow: var(--px-chip-shadow);
}

.px-btn--secondary:hover {
  background: var(--px-fill-pressed);
}

.px-btn--ghost {
  color: var(--px-text-secondary);
}

.px-btn--ghost:hover {
  background: var(--px-fill-hover);
  color: var(--px-text-primary);
}

.px-btn--danger {
  background: var(--px-danger-bg);
  border-color: var(--px-danger-border);
  color: var(--px-danger);
}

.px-btn--accent {
  background: var(--px-btn-accent-bg);
  color: var(--px-btn-accent-fg);
}

.px-btn--icon {
  width: var(--px-size-btn-sm);
  border-radius: var(--px-radius-pill);
  padding: 0;
}

.px-btn--icon.px-btn--xs {
  width: var(--px-size-btn-xs);
}

.px-btn:disabled {
  opacity: var(--px-opacity-disabled);
  pointer-events: none;
  box-shadow: none;
}

.px-btn--loading {
  pointer-events: none;
  color: #0000 !important;
}

.px-btn--loading:after {
  content: "";
  width: var(--px-size-icon-xs);
  height: var(--px-size-icon-xs);
  border-radius: var(--px-radius-pill);
  border: var(--px-stroke-1-5) solid var(--px-text-tertiary);
  animation: px-spin var(--px-dur-spin) var(--px-ease-linear) infinite;
  border-top-color: #0000;
  position: absolute;
}

.px-verb {
  height: var(--px-size-btn-xs);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-md);
  background: var(--px-surface-chip);
  border: var(--px-hairline) solid var(--px-chip-border);
  box-shadow: var(--px-chip-shadow);
  font: inherit;
  font-size: var(--px-text-12-5);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-primary);
  white-space: nowrap;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  display: inline-flex;
}

.px-verb:hover {
  background: var(--px-fill-pressed);
}

.px-switch {
  all: unset;
  width: var(--px-size-switch-w);
  height: var(--px-size-switch-h);
  border-radius: var(--px-radius-pill);
  background: var(--px-switch-track);
  cursor: pointer;
  transition: background var(--px-dur-hover) var(--px-ease-linear);
  flex: none;
  position: relative;
}

.px-switch:after {
  content: "";
  top: var(--px-space-0-5);
  left: var(--px-space-0-5);
  width: var(--px-size-knob);
  height: var(--px-size-knob);
  border-radius: var(--px-radius-pill);
  background: var(--px-switch-knob);
  box-shadow: var(--px-shadow-knob);
  transition: transform var(--px-dur-pop) var(--px-ease-out);
  position: absolute;
}

.px-switch[aria-checked="true"] {
  background: var(--px-brand);
}

.px-switch[aria-checked="true"]:after {
  transform: translateX(var(--px-size-knob));
}

.px-switch:focus-visible {
  box-shadow: var(--px-ring-focus);
}

.px-ctl {
  align-items: center;
  gap: var(--px-space-2);
  font-size: var(--px-text-13);
  cursor: pointer;
  display: inline-flex;
}

.px-ctl input[type="checkbox"], .px-ctl input[type="radio"] {
  width: var(--px-size-check);
  height: var(--px-size-check);
  margin: 0;
}

.px-seg {
  padding: var(--px-space-0-5);
  gap: var(--px-space-0-5);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  display: inline-flex;
}

.px-seg button {
  all: unset;
  cursor: pointer;
  height: var(--px-size-seg);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-secondary);
  align-items: center;
  gap: var(--px-space-1);
  transition: background var(--px-dur-hover) var(--px-ease-linear), color var(--px-dur-hover) var(--px-ease-linear);
  display: inline-flex;
}

.px-seg button:hover {
  color: var(--px-text-primary);
}

.px-seg button[aria-pressed="true"] {
  background: var(--px-seg-on);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
}

.px-tabs {
  gap: var(--px-space-1);
  scrollbar-width: none;
  display: flex;
  overflow-x: auto;
}

.px-tabs a, .px-tabs button {
  all: unset;
  cursor: pointer;
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-13);
  color: var(--px-text-secondary);
  align-items: center;
  gap: var(--px-space-1-5);
  font-weight: var(--px-weight-medium);
  white-space: nowrap;
  display: inline-flex;
}

.px-tabs a:hover, .px-tabs button:hover {
  color: var(--px-text-primary);
  background: var(--px-fill-hover);
}

.px-tabs [aria-selected="true"], .px-tabs [aria-current="page"] {
  color: var(--px-text-primary);
  background: var(--px-seg-on);
  box-shadow: var(--px-seg-on-shadow);
}

.px-cnt {
  font-size: var(--px-text-11);
  color: var(--px-text-tertiary);
  font-variant-numeric: var(--px-numeric);
}

.px-pill {
  align-items: center;
  gap: var(--px-space-1);
  height: var(--px-size-chip);
  padding: 0 var(--px-space-2);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  white-space: nowrap;
  border: var(--px-hairline) solid var(--px-neutral-border);
  background: var(--px-neutral-bg);
  color: var(--px-neutral);
  display: inline-flex;
}

.px-pill--dot:before {
  content: "";
  width: var(--px-size-dot);
  height: var(--px-size-dot);
  border-radius: var(--px-radius-pill);
  background: currentColor;
}

.px-pill--success {
  background: var(--px-success-bg);
  color: var(--px-success);
  border-color: var(--px-success-border);
}

.px-pill--warning {
  background: var(--px-warning-bg);
  color: var(--px-warning);
  border-color: var(--px-warning-border);
}

.px-pill--danger {
  background: var(--px-danger-bg);
  color: var(--px-danger);
  border-color: var(--px-danger-border);
}

.px-pill--info {
  background: var(--px-info-bg);
  color: var(--px-info);
  border-color: var(--px-info-border);
}

.px-pill--accent {
  background: var(--px-accent);
  color: var(--px-text-on-accent);
  border-color: #0000;
}

.px-count {
  height: var(--px-size-count);
  min-width: var(--px-size-count);
  padding: 0 var(--px-space-1);
  font-size: var(--px-text-10-5);
  border-radius: var(--px-radius-pill);
  background: var(--px-neutral-bg);
  color: var(--px-text-primary);
  font-weight: var(--px-weight-medium);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.px-count--accent {
  background: var(--px-accent);
  color: var(--px-text-on-accent);
}

.px-av {
  width: var(--px-size-avatar);
  height: var(--px-size-avatar);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-10);
  font-weight: var(--px-weight-semibold);
  color: hsl(var(--h) var(--px-avatar-s) var(--px-avatar-fg-l));
  background: hsl(var(--h) var(--px-avatar-s) var(--px-avatar-l));
  flex: none;
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.px-av--xs {
  width: var(--px-size-avatar-xs);
  height: var(--px-size-avatar-xs);
}

.px-av--sm {
  width: var(--px-size-avatar-sm);
  height: var(--px-size-avatar-sm);
}

.px-av--lg {
  width: var(--px-size-avatar-lg);
  height: var(--px-size-avatar-lg);
  font-size: var(--px-text-12);
}

.px-av--sq {
  border-radius: var(--px-radius-md);
}

.px-tipwrap {
  display: inline-flex;
  position: relative;
}

.px-tipwrap > .px-tip {
  bottom: calc(100% + var(--px-space-1-5));
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--px-dur-pop) var(--px-ease-out);
  z-index: var(--px-z-tooltip);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.px-tipwrap:hover > .px-tip, .px-tipwrap:focus-within > .px-tip {
  opacity: 1;
}

.px-tip {
  align-items: center;
  gap: var(--px-space-2);
  padding: var(--px-space-1) var(--px-space-2);
  border-radius: var(--px-radius-md);
  font-size: var(--px-text-12);
  background: var(--px-tip-bg);
  color: var(--px-tip-fg);
  box-shadow: var(--px-shadow-pop);
  white-space: nowrap;
  display: inline-flex;
}

.px-card {
  border-radius: var(--px-radius-card);
  padding: var(--px-space-3);
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  min-width: 0;
}

.px-card__head {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2);
  margin-bottom: var(--px-space-2);
  display: flex;
}

.px-card__title {
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-semibold);
  align-items: center;
  gap: var(--px-space-1-5);
  margin: 0;
  display: inline-flex;
}

.px-card__sum {
  margin: calc(var(--px-space-1) * -1) 0 var(--px-space-2);
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
}

.px-kpi {
  gap: var(--px-space-0-5);
  padding: var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-card);
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
  min-width: 0;
  color: inherit;
  flex-direction: column;
  text-decoration: none;
  display: flex;
}

.px-kpi__label {
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
  color: var(--px-text-tertiary);
}

.px-kpi__value {
  font-size: var(--px-text-20);
  line-height: var(--px-lh-20);
  font-weight: var(--px-weight-semibold);
  letter-spacing: var(--px-tracking-num);
  font-variant-numeric: var(--px-numeric);
}

.px-kpi__delta {
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
}

.px-kpi__delta--up {
  color: var(--px-success);
}

.px-kpi__delta--down {
  color: var(--px-danger);
}

.px-tile {
  background: var(--px-surface-tile);
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-2-5) var(--px-space-3);
}

.px-receipt {
  flex-direction: column;
  display: flex;
}

.px-receipt > div {
  justify-content: space-between;
  gap: var(--px-space-3);
  padding: var(--px-space-1-5) 0;
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
  font-size: var(--px-text-13);
  display: flex;
}

.px-receipt > div:last-child {
  font-weight: var(--px-weight-semibold);
  border-bottom: 0;
}

.px-receipt b {
  font-weight: var(--px-weight-medium);
  font-variant-numeric: var(--px-numeric);
}

.px-skel {
  height: var(--px-size-skel);
  border-radius: var(--px-radius-xs);
  background: linear-gradient(90deg, var(--px-fill-hover) 0%, var(--px-fill-pressed) 40%, var(--px-fill-hover) 80%);
  animation: px-shimmer var(--px-dur-skeleton) var(--px-ease-linear) infinite;
  background-size: 300% 100%;
  display: block;
}

.px-bulk {
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-bulk);
  padding: 0 var(--px-space-1-5) 0 var(--px-space-2-5);
  margin: var(--px-space-1-5);
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-bulk-bg);
  color: var(--px-bulk-fg);
  font-size: var(--px-text-13);
  display: flex;
}

.px-bulk .px-btn--ghost {
  color: var(--px-bulk-fg);
}

.px-bulk .px-btn--ghost:hover {
  background: var(--px-bulk-hover);
}

.px-pager {
  align-items: center;
  gap: var(--px-space-2);
  height: var(--px-size-pager);
  padding: 0 var(--px-space-2-5);
  font-size: var(--px-text-12);
  color: var(--px-text-secondary);
  display: flex;
}

.px-empty {
  align-items: center;
  gap: var(--px-space-1-5);
  padding: var(--px-space-8) var(--px-space-4);
  text-align: center;
  color: var(--px-text-secondary);
  font-size: var(--px-text-13);
  flex-direction: column;
  display: flex;
}

.px-empty__icon {
  width: var(--px-size-avatar-lg);
  height: var(--px-size-avatar-lg);
  border-radius: var(--px-radius-tile);
  background: var(--px-surface-tile);
  color: var(--px-text-secondary);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.px-empty__title {
  margin: var(--px-space-1) 0 0;
  font-size: var(--px-text-14);
  font-weight: var(--px-weight-semibold);
  color: var(--px-text-primary);
}

.px-banner {
  align-items: center;
  gap: var(--px-space-2-5);
  padding: var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-tile-lg);
  border: var(--px-hairline) solid var(--px-info-border);
  background: var(--px-info-bg);
  font-size: var(--px-text-13);
  display: flex;
}

.px-banner--warning {
  border-color: var(--px-warning-border);
  background: var(--px-warning-bg);
}

.px-banner--danger {
  border-color: var(--px-danger-border);
  background: var(--px-danger-bg);
}

.px-banner--success {
  border-color: var(--px-success-border);
  background: var(--px-success-bg);
}

.px-meter {
  height: var(--px-size-meter);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  overflow: hidden;
}

.px-meter > i {
  border-radius: inherit;
  background: var(--px-brand);
  height: 100%;
  transition: width var(--px-dur-chart) var(--px-ease-out);
  display: block;
}

.px-stepper {
  align-items: center;
  gap: var(--px-space-2);
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}

.px-stepper li {
  align-items: center;
  gap: var(--px-space-1-5);
  display: inline-flex;
}

.px-stepper li + li:before {
  content: "";
  width: var(--px-size-step-line);
  height: var(--px-hairline);
  background: var(--px-border-strong);
}

.px-stepper b {
  width: var(--px-size-step);
  height: var(--px-size-step);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-10-5);
  border: var(--px-hairline) solid var(--px-border-strong);
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.px-stepper [aria-current="step"] {
  color: var(--px-text-primary);
}

.px-stepper [aria-current="step"] b, .px-stepper .is-done b {
  background: var(--px-brand);
  border-color: var(--px-brand);
  color: var(--px-text-on-brand);
}

.px-overlay {
  z-index: var(--px-z-modal);
  background: var(--px-overlay);
  animation: ds-fade var(--px-dur-pop) var(--px-ease-out);
  position: fixed;
  inset: 0;
}

.px-modal {
  z-index: calc(var(--px-z-modal) + 1);
  width: min(var(--px-size-modal), calc(100vw - var(--px-space-6)));
  border-radius: var(--px-radius-panel);
  max-height: 76dvh;
  padding: var(--px-space-4);
  animation: ds-menu var(--px-dur-panel) var(--px-ease-out);
  position: fixed;
  top: 14vh;
  left: 50%;
  overflow: auto;
  transform: translateX(-50%);
}

.px-drawer {
  z-index: var(--px-z-drawer);
  width: min(var(--px-size-drawer), 100vw);
  background: var(--px-surface-solid);
  border-left: var(--px-hairline) solid var(--px-border-default);
  box-shadow: var(--px-shadow-panel);
  animation: ds-drawer var(--px-dur-panel) var(--px-ease-out);
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  overflow: auto;
}

.px-drawer__head {
  justify-content: space-between;
  align-items: center;
  gap: var(--px-space-2);
  padding: var(--px-space-2-5) var(--px-space-3);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
  display: flex;
}

.px-drawer__body {
  padding: var(--px-space-3);
}

.px-toast {
  align-items: flex-start;
  gap: var(--px-space-2-5);
  padding: var(--px-space-2-5) var(--px-space-3);
  border-radius: var(--px-radius-card);
  width: min(var(--px-size-toast), calc(100vw - var(--px-space-6)));
  font-size: var(--px-text-13);
  background: var(--px-toast-bg);
  color: var(--px-toast-fg);
  box-shadow: var(--px-shadow-pop);
  animation: ds-toast var(--px-dur-toast) var(--px-ease-out);
  display: flex;
}

.px-toast b {
  font-weight: var(--px-weight-medium);
  display: block;
}

.px-toast span {
  opacity: var(--px-opacity-muted);
  font-size: var(--px-text-12);
}

.px-toasts {
  z-index: var(--px-z-toast);
  right: var(--px-space-4);
  bottom: var(--px-space-4);
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
  position: fixed;
}

.px-bubble {
  padding: var(--px-space-2) var(--px-space-3);
  border-radius: var(--px-radius-panel);
  font-size: var(--px-text-13);
  max-width: min(var(--px-size-bubble), 86%);
}

.px-bubble--user {
  background: var(--px-surface-tile);
  color: var(--px-text-primary);
  border-bottom-right-radius: var(--px-radius-xs);
  margin-left: auto;
}

.px-bubble--ai {
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  border-bottom-left-radius: var(--px-radius-xs);
}

.px-approve {
  border-radius: var(--px-radius-card);
  border: var(--px-hairline) solid var(--px-warning-border);
  background: var(--px-surface-solid);
  box-shadow: var(--px-shadow-card);
  padding: var(--px-space-2-5) var(--px-space-3);
}

.px-approve__head {
  align-items: center;
  gap: var(--px-space-2);
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
  color: var(--px-accent-text);
  margin-bottom: var(--px-space-1-5);
  display: flex;
}

.px-stagger > * {
  animation: ds-rise var(--px-dur-panel) var(--px-ease-out) both;
}

.px-stagger > :nth-child(2) {
  animation-delay: calc(var(--px-stagger) * 1);
}

.px-stagger > :nth-child(3) {
  animation-delay: calc(var(--px-stagger) * 2);
}

.px-stagger > :nth-child(4) {
  animation-delay: calc(var(--px-stagger) * 3);
}

.px-stagger > :nth-child(5) {
  animation-delay: calc(var(--px-stagger) * 4);
}

.px-stagger > :nth-child(6) {
  animation-delay: calc(var(--px-stagger) * 5);
}

.px-stagger > :nth-child(n+7) {
  animation-delay: calc(var(--px-stagger) * 6);
}

html:root .fin {
  gap: var(--px-space-2-5);
  max-width: none;
  font-size: var(--px-text-13);
  --fin-r: var(--px-radius-card);
  --fin-r-sm: var(--px-radius-md);
  --fin-glass: var(--px-surface-card);
  --fin-glass-strong: var(--px-surface-solid);
  --fin-line: var(--px-border-hairline);
  --px-button-height: var(--px-size-btn-sm);
  --px-button-height-sm: var(--px-size-btn-xs);
  --px-control-height: var(--px-size-btn-sm);
  --px-button-radius: var(--px-radius-control);
  --px-input-height: var(--px-size-input);
  --px-input-radius: var(--px-radius-pill);
  margin: 0;
}

html:root .fin .px-button {
  min-height: var(--px-size-btn-sm);
  height: var(--px-size-btn-sm);
  border-radius: var(--px-radius-control);
  padding: 0 var(--px-space-2-5);
  font-size: var(--px-text-13);
}

html:root .fin .px-button--sm {
  min-height: var(--px-size-btn-xs);
  height: var(--px-size-btn-xs);
  padding: 0 var(--px-space-2);
  font-size: var(--px-text-12);
  border-radius: var(--px-radius-md);
}

html:root :is(.fin-glass, .fin-card, .fin-stat, .fin-gw, .fin-tabs) {
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  border-radius: var(--px-radius-card);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
  -webkit-backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
  backdrop-filter: blur(var(--px-blur-surface)) saturate(var(--px-saturate));
}

html:root .fin-card {
  padding: var(--px-space-3);
}

html:root .fin-card__title {
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-semibold);
}

html:root .fin-stats {
  grid-template-columns: repeat(auto-fill, minmax(var(--px-size-stat-min), 1fr));
  gap: var(--px-space-2-5);
}

html:root .fin-stat {
  padding: var(--px-space-2) var(--px-space-3);
  gap: var(--px-space-0-5);
}

html:root .fin-stat__label, html:root .bi-kpi__top span:first-child {
  font-size: var(--px-text-10-5);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
  font-weight: var(--px-weight-semibold);
  color: var(--px-text-tertiary);
}

html:root .fin-stat__value {
  font-size: var(--px-text-20);
  line-height: var(--px-lh-20);
  font-weight: var(--px-weight-semibold);
  letter-spacing: var(--px-tracking-num);
  font-variant-numeric: var(--px-numeric);
}

html:root .fin-stat__sub {
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
}

html:root .fin-stat--link:hover {
  background: var(--px-surface-solid);
  border-color: var(--px-border-default);
}

html:root .fin-tabs {
  max-width: 100%;
  padding: var(--px-space-0-5);
  align-self: flex-start;
  gap: var(--px-space-0-5);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border: 0;
  display: inline-flex;
  position: static;
}

html:root .fin-tab {
  height: var(--px-size-seg);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-12-5);
  font-weight: var(--px-weight-medium);
  color: var(--px-text-secondary);
  box-shadow: none;
  background: none;
  align-items: center;
  display: inline-flex;
}

html:root .fin-tab:hover {
  background: var(--px-fill-hover);
  color: var(--px-text-primary);
}

html:root .fin-tab--on {
  background: var(--px-seg-on);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
  font-weight: var(--px-weight-medium);
}

:is(html:root .fin-card:has(.fin-table), html:root .fin-doc, html:root .fin-modal__box) {
  background: var(--px-surface-solid);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

html:root .fin-doc {
  border: var(--px-hairline) solid var(--px-border-default);
  border-radius: var(--px-radius-card);
  box-shadow: var(--px-shadow-card);
}

html:root .fin-table {
  font-size: var(--px-text-13);
  border-collapse: separate;
  border-spacing: 0;
  background: var(--px-table-bg);
}

html:root .fin-table th {
  height: var(--px-size-row);
  padding: 0 var(--px-space-2-5);
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
  color: var(--px-table-head-fg);
  border-bottom: var(--px-hairline) solid var(--px-border-default);
  background: var(--px-table-head-bg);
  white-space: nowrap;
}

html:root .fin-table td {
  height: var(--px-size-row);
  padding: var(--px-space-1) var(--px-space-2-5);
  border-bottom: var(--px-hairline) solid var(--px-border-hairline);
}

html:root .fin-table tbody tr:nth-child(2n) td {
  background: var(--px-table-zebra);
}

html:root .fin-table tr:hover td, html:root .fin-click:hover td {
  background: var(--px-fill-hover);
}

html:root .fin-table tr[aria-selected="true"] td, html:root .fin-table tr.is-selected td {
  background: var(--px-fill-selected);
}

html:root .fin-table tr.is-active td {
  background: var(--px-fill-selected-strong);
}

html:root .fin-table td.fin-num {
  font-weight: var(--px-weight-medium);
  color: var(--px-text-strong);
  font-variant-numeric: var(--px-numeric);
  letter-spacing: var(--px-tracking-num);
}

:is(html:root .fin-card:has( > .fin-table), html:root .fin-card:has( > div > .fin-table)) {
  padding: 0;
  overflow: hidden;
}

html:root .fin-card:has( > .fin-table) > .fin-card__head {
  padding: var(--px-space-2-5) var(--px-space-3) var(--px-space-1);
}

html:root .fin-pill {
  height: var(--px-size-chip);
  padding: 0 var(--px-space-2);
  border-radius: var(--px-radius-pill);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  border: var(--px-hairline) solid transparent;
  line-height: var(--px-lh-12);
}

html:root .fin-pill--info {
  background: var(--px-info-bg);
  color: var(--px-info);
  border-color: var(--px-info-border);
}

html:root .fin-pill--success {
  background: var(--px-success-bg);
  color: var(--px-success);
  border-color: var(--px-success-border);
}

html:root .fin-pill--warning {
  background: var(--px-warning-bg);
  color: var(--px-warning);
  border-color: var(--px-warning-border);
}

html:root .fin-pill--danger {
  background: var(--px-danger-bg);
  color: var(--px-danger);
  border-color: var(--px-danger-border);
}

html:root .fin-pill--muted {
  background: var(--px-neutral-bg);
  color: var(--px-text-secondary);
  border-color: var(--px-neutral-border);
}

html:root .fin-link-btn {
  height: var(--px-size-btn-sm);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-control);
  font-size: var(--px-text-13);
  background: var(--px-surface-chip);
  border: var(--px-hairline) solid var(--px-chip-border);
  color: var(--px-text-primary);
  box-shadow: var(--px-chip-shadow);
  transition: background var(--px-dur-hover) var(--px-ease-linear), transform var(--px-dur-press) var(--px-ease-out);
}

html:root .fin-link-btn:hover {
  background: var(--px-fill-pressed);
  border-color: var(--px-chip-border);
}

html:root .fin-link-btn:active {
  transform: scale(var(--px-press-scale));
}

html:root .fin-link-btn--primary {
  background: var(--px-btn-primary-bg);
  color: var(--px-btn-primary-fg);
  box-shadow: var(--px-btn-primary-shadow);
  border-color: #0000;
}

html:root .fin-link-btn--primary:hover {
  background: var(--px-btn-primary-bg-hover);
}

html:root .fin-textbtn {
  color: var(--px-brand-text);
  font-size: var(--px-text-12);
}

html:root .fin-textbtn:hover {
  background: var(--px-fill-selected);
}

html:root .fin-more:hover, html:root .fin-list a:hover {
  color: var(--px-brand-text);
}

html:root .fin-insight {
  border-radius: var(--px-radius-tile-lg);
  padding: var(--px-space-1) var(--px-space-1-5) var(--px-space-1) var(--px-space-2-5);
  background: var(--px-surface-tile);
  border: 0;
}

html:root .fin-insight--warning {
  box-shadow: inset var(--px-stroke-2) 0 0 var(--px-warning);
}

html:root .fin-insight--danger {
  box-shadow: inset var(--px-stroke-2) 0 0 var(--px-danger);
}

html:root .fin-modal {
  background: var(--px-overlay);
}

html:root .fin-modal__box {
  border: var(--px-hairline) solid var(--px-border-default);
  border-radius: var(--px-radius-panel);
  box-shadow: var(--px-shadow-pop);
  animation: ds-menu var(--px-dur-panel) var(--px-ease-out);
}

html:root .fin-tone-success, html:root .bi-up {
  color: var(--px-success);
}

html:root .fin-tone-danger, html:root .bi-down {
  color: var(--px-danger);
}

html:root .fin-tone-warning {
  color: var(--px-warning);
}

html:root .bi-kpis {
  grid-template-columns: repeat(auto-fill, minmax(var(--px-size-kpi-min), 1fr));
  gap: var(--px-space-2-5);
}

html:root .bi-kpi {
  border-radius: var(--px-radius-card);
  padding: var(--px-space-2) var(--px-space-3) var(--px-space-1-5);
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
  -webkit-backdrop-filter: blur(var(--px-blur-surface));
  backdrop-filter: blur(var(--px-blur-surface));
}

html:root .bi-kpi:hover {
  background: var(--px-surface-solid);
  border-color: var(--px-border-default);
}

html:root .bi-kpi__top {
  font-size: var(--px-text-12);
  color: var(--px-text-secondary);
}

html:root .bi-kpi__v {
  font-size: var(--px-text-20);
  line-height: var(--px-lh-20);
  font-weight: var(--px-weight-semibold);
  letter-spacing: var(--px-tracking-num);
  font-variant-numeric: var(--px-numeric);
}

html:root .bi-spark polyline {
  stroke: var(--px-chart-1);
  stroke-width: var(--px-stroke-1-5);
}

html:root .bi-spark--bad polyline {
  stroke: var(--px-danger);
}

html:root .bi-grid {
  stroke: var(--px-chart-grid);
}

html:root .bi-axis {
  fill: var(--px-chart-axis);
  font-size: var(--px-text-10-5);
}

html:root .bi-line {
  stroke: var(--px-chart-1);
  stroke-width: var(--px-chart-stroke);
}

html:root .bi-line--prev {
  stroke: var(--px-chart-2);
}

html:root .bi-band {
  fill: var(--px-chart-area);
}

html:root .bi-dot {
  fill: var(--px-chart-1);
}

html:root .bi-dot--fc {
  fill: var(--px-chart-dot);
  stroke: var(--px-chart-1);
}

html:root .bi-col {
  fill: var(--px-chart-bar);
}

html:root .bi-col--hl {
  fill: var(--px-chart-1);
}

html:root .bi-col--neg {
  fill: var(--px-danger);
}

html:root .bi-col--fc {
  fill: var(--px-chart-area);
}

html:root .bi-whisker {
  stroke: var(--px-text-tertiary);
}

html:root .bi-hbars__bar, html:root .bi-goal__bar {
  background: var(--px-fill-sunken);
}

html:root .bi-hbars__bar i, html:root .bi-goal__bar i {
  background: var(--px-chart-1);
}

html:root .bi-funnel__bar {
  background: var(--px-chart-1);
  color: var(--px-text-on-brand);
}

html:root .bi-hbars__bar i.neg {
  background: var(--px-danger);
}

html:root .bi-goal__bar b {
  background: var(--px-accent);
}

html:root .bi-weeks i {
  background: var(--px-chart-bar);
}

html:root .bi-weeks li:last-child i {
  background: var(--px-chart-1);
}

html:root .bi-next {
  color: var(--px-brand-text);
}

html:root .bi-ins-action {
  background: var(--px-surface-tile);
  border-radius: var(--px-radius-tile-lg);
}

html:root .bi-dot-s--ok {
  background: var(--px-success);
}

html:root .bi-dot-s--stale {
  background: var(--px-warning);
}

html:root .bi-dot-s--failed {
  background: var(--px-danger);
}

html:root .mkt-lesson {
  background: var(--px-warning-bg);
}

.bi-line, .bi-spark polyline {
  stroke-dasharray: var(--px-chart-dash);
  stroke-dashoffset: 0;
  animation: ds-draw var(--px-dur-chart) var(--px-ease-out);
}

.bi-line--prev, .bi-line--fc {
  animation: none;
}

html:root .bi-line--prev {
  stroke-dasharray: var(--px-space-1) var(--px-space-1);
}

html:root .bi-line--fc {
  stroke-dasharray: var(--px-space-1-5) var(--px-space-1);
}

html:root .chat-confirm {
  border-radius: var(--px-radius-card);
  border: var(--px-hairline) solid var(--px-warning-border);
  background: var(--px-surface-solid);
  box-shadow: var(--px-shadow-card);
}

@media print {
  .ds-sb, .ds-top {
    display: none !important;
  }

  .ds-shell {
    display: block;
  }
}

.px-spacer {
  flex: 1;
  min-width: 0;
}

.ds-ph__main {
  min-width: 0;
}

.px-legend {
  align-items: center;
  gap: var(--px-space-1);
  margin-left: var(--px-space-2-5);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-regular);
  color: var(--px-text-tertiary);
  display: inline-flex;
}

.px-legend__sw {
  width: var(--px-space-2);
  height: var(--px-space-2);
  border-radius: var(--px-radius-xs);
}

.px-legend__sw--1 {
  background: var(--px-chart-1);
}

.px-legend__sw--2 {
  background: var(--px-chart-2);
}

.px-legend__sw--3 {
  background: var(--px-chart-3);
}

.px-legend__sw--4 {
  background: var(--px-chart-4);
}

.px-legend__sw--5 {
  background: var(--px-chart-5);
}

.px-legend__sw--6 {
  background: var(--px-chart-6);
}

.px-legend__sw--7 {
  background: var(--px-chart-7);
}

.px-legend__sw--8 {
  background: var(--px-chart-8);
}

.px-empty__body {
  margin: 0;
}

.px-modal__title {
  margin-bottom: var(--px-space-2-5);
}

.px-approve__title {
  margin: 0 0 var(--px-space-1-5);
  font-weight: var(--px-weight-medium);
}

.px-approve__actions {
  gap: var(--px-space-1-5);
  margin-top: var(--px-space-2);
  display: flex;
}

.px-irow {
  align-items: center;
  gap: var(--px-space-2-5);
  min-height: var(--px-size-touch);
  padding: var(--px-space-1) var(--px-space-1-5) var(--px-space-1) var(--px-space-1);
  margin-bottom: var(--px-space-1);
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-surface-tile);
  display: flex;
}

.px-irow .px-verb {
  min-width: calc(var(--px-size-avatar-lg) * 3);
}

.px-irow__text {
  flex-direction: column;
  flex: 1;
  min-width: 0;
  display: flex;
}

.px-irow__text b {
  font-weight: var(--px-weight-medium);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.px-irow__text span {
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.px-irow__meta {
  font-size: var(--px-text-12);
  color: var(--px-text-tertiary);
  white-space: nowrap;
}

@media (max-width: 767px) {
  .px-irow .px-verb {
    display: none;
  }
}

html:root .fin-seg {
  gap: var(--px-space-0-5);
  padding: var(--px-space-0-5);
  border-radius: var(--px-radius-pill);
  background: var(--px-fill-sunken);
  box-shadow: none;
  border: 0;
  flex-wrap: wrap;
  display: inline-flex;
}

html:root .fin-seg button {
  height: var(--px-size-seg);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  color: var(--px-text-secondary);
  font: inherit;
  font-size: var(--px-text-12-5);
  font-weight: var(--px-weight-medium);
  box-shadow: none;
  cursor: pointer;
  background: none;
  border: 0;
}

html:root .fin-seg button:hover {
  color: var(--px-text-primary);
}

html:root .fin-seg button.on {
  background: var(--px-seg-on);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
}

html:root .fin-chip {
  height: var(--px-size-btn-xs);
  padding: 0 var(--px-space-2-5);
  border-radius: var(--px-radius-pill);
  border: var(--px-hairline) solid var(--px-chip-border);
  background: var(--px-surface-chip);
  color: var(--px-text-primary);
  font-size: var(--px-text-12-5);
}

html:root .fin-chip.on {
  background: var(--px-seg-on);
  border-color: var(--px-border-strong);
  color: var(--px-text-primary);
  box-shadow: var(--px-seg-on-shadow);
}

html:root .fin-table a, html:root .chat table a {
  color: var(--px-brand-text);
  font-weight: var(--px-weight-medium);
  text-decoration: none;
}

html:root .fin-table a:hover, html:root .chat table a:hover {
  text-decoration: underline;
}

html:root .chat table th {
  font-size: var(--px-text-10-5);
  font-weight: var(--px-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--px-tracking-caps);
  color: var(--px-table-head-fg);
  background: var(--px-table-head-bg);
}

html:root .chat table tbody tr:nth-child(2n) td {
  background: var(--px-table-zebra);
}

html:root .chat table td {
  font-variant-numeric: var(--px-numeric);
}

html:root .panel {
  border-radius: var(--px-radius-card);
  padding: var(--px-space-3) var(--px-space-3-5);
  background: var(--px-surface-card);
  border: var(--px-hairline) solid var(--px-card-border);
  box-shadow: var(--px-inset-hi), var(--px-shadow-card);
}

html:root .panel__title {
  font-family: var(--px-font-sans);
  font-size: var(--px-text-13);
  line-height: var(--px-lh-13);
  font-weight: var(--px-weight-semibold);
  margin: 0 0 var(--px-space-2-5);
}

html:root .account-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(var(--px-size-drawer) + var(--px-space-12))), 1fr));
  gap: var(--px-space-2-5);
  align-items: start;
  max-width: none;
}

html:root .session-item, html:root .method-item {
  border-radius: var(--px-radius-tile-lg);
  background: var(--px-surface-tile);
  padding: var(--px-space-2) var(--px-space-3);
  border: 0;
}

@media (max-width: 767px) {
  html:root .fin-table thead {
    display: none;
  }

  html:root .fin-table, html:root .fin-table tbody {
    width: 100%;
    display: block;
  }

  html:root .fin-table tbody tr {
    column-gap: var(--px-space-3);
    row-gap: var(--px-space-0-5);
    padding: var(--px-space-2) var(--px-space-3);
    border-bottom: var(--px-hairline) solid var(--px-border-hairline);
    grid-template-columns: minmax(0, 1fr) auto;
    display: grid;
  }

  html:root .fin-table tbody tr td {
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    border: 0;
    min-width: 0;
    height: auto;
    padding: 0;
    display: block;
    overflow: hidden;
    background: none !important;
  }

  html:root .fin-table tbody tr td:nth-child(2n) {
    text-align: right;
  }

  html:root .fin-table tbody tr:nth-child(2n) {
    background: var(--px-table-zebra);
  }

  html:root .fin-table tbody tr td:before {
    content: none;
  }
}

@media (min-width: 768px) {
  .ds-shell:before {
    content: "";
    width: var(--sbw);
    background: var(--px-surface-sidebar);
    border-right: var(--px-hairline) solid var(--px-card-border);
    pointer-events: none;
    z-index: var(--px-z-base);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
  }

  .ds-shell:not([data-open]) > .ds-sb {
    background: none;
    border-right-color: #0000;
  }
}

html:root:root:root body {
  min-height: 100dvh;
}

.px-doclogo {
  max-height: var(--px-size-logo-doc);
  max-width: var(--px-size-stat-min);
  object-fit: contain;
  flex: none;
  display: block;
}

.px-docids {
  font-size: var(--px-text-11);
  color: var(--px-text-tertiary);
}

html:root :is(.ds-card, .px-card, .px-kpi, .panel, .px-auth-card, .px-bubble--ai, .fin-card, .fin-stat, .bi-kpi, .fx .fx-card, .fx .fx-qb, .fx .fx-chipbar, .sx-card, .sx-setup, .sl-card, .sl-kpi, .sl-verdict, .sl-sum, .sl-ask, .sl-pub__bar, .bz-guide) {
  border-color: var(--px-gl-line);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-shadow);
  -webkit-backdrop-filter: blur(min(var(--px-gl-blur-panel), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
  backdrop-filter: blur(min(var(--px-gl-blur-panel), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
}

html:root :is(.ds-tile, .px-tile, .fin-insight, .bi-ins-action, .session-item, .method-item, .fx .fx-tile, .sl-chip:not(.sl-chip--primary), .sl-linkbox) {
  background: var(--px-gl-raised);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-sheen), var(--px-gl-shadow-raised);
}

html:root :is(.px-popover, .ds-shell .shell-menu__pop), html:root :is(.ds-overlay, .ds-pal, .px-drawer, .px-modal, .fin-modal__box, .fx .fx-sheet, .fx .fx-drawer, .sl-sheet) {
  background: var(--px-gl-overlay);
  border-color: var(--px-gl-line);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-shadow-overlay);
  -webkit-backdrop-filter: blur(min(var(--px-gl-blur-overlay), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
  backdrop-filter: blur(min(var(--px-gl-blur-overlay), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
}

html:root :is(.fin-card:has(.fin-table), .fin-doc, .sl-card--solid, .sl-list, .sl-tablewrap, .fx .fx-solid, .sx-setup__list, .sx-engines) {
  background: var(--px-gl-solid);
}

html:root .sl-paper {
  background: var(--px-logo-paper);
  color: var(--px-logo-paper-ink);
}

html:root :is(.ds-sb, .ds-top) {
  -webkit-backdrop-filter: blur(min(var(--px-gl-blur-panel), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
  backdrop-filter: blur(min(var(--px-gl-blur-panel), var(--px-gl-blur-cap))) saturate(var(--px-gl-sat));
}

html:root .ds-sb {
  box-shadow: inset calc(var(--px-hairline) * -1) 0 0 var(--px-gl-edge);
}

html:root :is(.sx .sx-empty, .sx-empty-state) {
  background: var(--px-gl-raised);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-shadow-raised);
}

html:root .sx .sx-empty > span {
  flex: 1;
  min-width: 0;
}

html:root :is(.px-btn--primary, .px-button--primary, .fx .fx-btn.fx-pri, .fx .fx-verb.fx-pri, .sx-btn--primary, .sl-chip--primary, .fin-btn--primary) {
  background: var(--px-btn-primary-bg);
  color: var(--px-btn-primary-fg);
  box-shadow: var(--px-btn-primary-shadow);
  border-color: #0000;
}

html:root :is(.px-btn--primary, .px-button--primary, .fx .fx-btn.fx-pri, .fx .fx-verb.fx-pri, .sx-btn--primary, .sl-chip--primary, .fin-btn--primary):hover:not(:disabled) {
  background: var(--px-btn-primary-bg-hover);
}

html:root :is(.px-btn--secondary, .px-button--secondary, .fx .fx-btn:not(.fx-pri):not(.fx-acc):not(.fx-ghost), .fx .fx-verb:not(.fx-pri), .sx-btn:not(.sx-btn--primary), .sx-gear, .fin-link-btn) {
  background: var(--px-gl-raised);
  border-color: var(--px-gl-line);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-shadow-raised);
  -webkit-backdrop-filter: blur(min(var(--px-gl-blur-raised), var(--px-gl-blur-cap)));
  backdrop-filter: blur(min(var(--px-gl-blur-raised), var(--px-gl-blur-cap)));
}

.px-ic {
  width: var(--px-ic-md);
  height: var(--px-ic-md);
  vertical-align: middle;
  flex: none;
}

.px-ic--xs {
  width: var(--px-ic-xs);
  height: var(--px-ic-xs);
}

.px-ic--sm {
  width: var(--px-ic-sm);
  height: var(--px-ic-sm);
}

.px-ic--md {
  width: var(--px-ic-md);
  height: var(--px-ic-md);
}

.px-ic--lg {
  width: var(--px-ic-lg);
  height: var(--px-ic-lg);
}

.px-ic--xl {
  width: var(--px-ic-xl);
  height: var(--px-ic-xl);
}

.px-ic--duotone [opacity] {
  fill: var(--px-ic-duo-fill, var(--px-ic-duo));
  opacity: var(--px-ic-duo-opacity);
}

.px-ic--brand {
  color: var(--px-brand-text);
  --px-ic-duo-fill: var(--px-ic-duo);
}

.px-ic--accent {
  color: var(--px-accent-text);
  --px-ic-duo-fill: var(--px-accent);
}

.px-ic--danger {
  color: var(--px-danger);
  --px-ic-duo-fill: var(--px-danger);
}

.px-ic--success {
  color: var(--px-success);
  --px-ic-duo-fill: var(--px-success);
}

.px-ic--muted {
  --px-ic-duo-fill: currentColor;
}

.ds-nav .px-ic--duotone {
  color: var(--px-nav-fg);
}

.ds-nav[aria-current="page"] .px-ic--duotone [opacity], .ds-nav[data-here] .px-ic--duotone [opacity] {
  fill: var(--px-ic-duo-on);
  opacity: var(--px-ic-duo-on-opacity);
}

.px-eh-ic {
  width: var(--px-size-avatar-lg);
  height: var(--px-size-avatar-lg);
  border-radius: var(--px-radius-tile);
  color: var(--px-brand-text);
  background: var(--px-gl-raised);
  border: var(--px-hairline) solid var(--px-gl-line);
  box-shadow: inset 0 var(--px-hairline) 0 var(--px-gl-edge), var(--px-gl-shadow-raised);
  flex: none;
  place-items: center;
  display: inline-grid;
}

.px-eh-ic .px-ic {
  width: var(--px-ic-lg);
  height: var(--px-ic-lg);
}

html:root .fx .fx-ch .fx-ic {
  background: var(--px-fill-selected);
  color: var(--px-brand-text);
}

html:root .fx .fx-ch .fx-ic svg {
  width: var(--px-ic-sm);
  height: var(--px-ic-sm);
}

html:root .sx .sx-tile-lab {
  align-items: center;
  gap: var(--px-space-1-5);
  display: inline-flex;
}

html:root .sx .sx-tile-lab .sx-tile-ic {
  width: var(--px-ic-tile);
  height: var(--px-ic-tile);
}

html:root .sx .sx-empty-ic, .px-empty__icon .px-ic {
  width: var(--px-ic-lg);
  height: var(--px-ic-lg);
}

.px-icon-sheet {
  padding: var(--px-space-6);
  gap: var(--px-space-2);
  flex-direction: column;
  display: flex;
}

.px-icon-sheet__sub {
  color: var(--px-text-tertiary);
  margin: 0 0 var(--px-space-3);
}

.px-icon-sheet__grid {
  grid-template-columns: repeat(auto-fill, minmax(var(--px-size-stat-min), 1fr));
  gap: var(--px-space-2);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.px-icon-sheet__cell {
  align-items: center;
  gap: var(--px-space-1);
  padding: var(--px-space-3) var(--px-space-2);
  font-size: var(--px-text-12);
  flex-direction: column;
  display: flex;
}

.px-icon-sheet__pair {
  gap: var(--px-space-3);
  color: var(--px-text-primary);
  display: inline-flex;
}

.px-icon-sheet__src {
  color: var(--px-text-tertiary);
  font-size: var(--px-text-11);
}

html:root :is(.page-title, .fin-head .page-title, .ds-ph__title) {
  font-size: var(--px-type-page-title);
  line-height: var(--px-lh-page-title);
}

html:root :is(.px-card__title, .fx .fx-ch .fx-ttl, .sl-card__title, .sx-card__title, .fin-card__title, .panel h2) {
  font-size: var(--px-type-card-title);
  line-height: var(--px-lh-card-title);
}

html:root :is(.px-kpi__value, .bi-kpi__v, .fin-stat__value, .fx .fx-mid, .sl-kpi__value) {
  font-size: var(--px-type-kpi);
  line-height: var(--px-lh-kpi);
}

html:root :is(.fx .fx-lab, .sl-kpi__label, .px-kpi__label, .sx .sx-ft, .fx-phsub, .ds-ph__sum) {
  font-size: var(--px-type-label);
}

html:root .ds-nav[data-here]:not([aria-current="page"]) {
  background: var(--px-fill-selected);
  color: var(--px-brand-text);
  box-shadow: none;
}

html:root .ds-nav[data-here]:not([aria-current="page"]) svg {
  color: var(--px-brand-text);
}

html:root .ds-nav[data-here]:not([aria-current="page"]) .px-ic--duotone [opacity] {
  fill: var(--px-ic-duo);
  opacity: var(--px-ic-duo-opacity);
}

html:root .fx .fx-tile {
  container-type: inline-size;
}

html:root .fx .fx-tile .fx-big, html:root .fx .fx-tile .fx-mid {
  font-size: clamp(var(--px-text-20), var(--px-type-kpi-fit), var(--px-type-kpi));
}

html:root .sx .sx-tile-lab {
  align-items: center;
  gap: var(--px-space-1);
  white-space: nowrap;
  text-overflow: ellipsis;
  text-transform: none;
  letter-spacing: normal;
  min-width: 0;
  font-size: var(--px-type-tile-label);
  font-weight: var(--px-weight-medium);
  display: flex;
  overflow: hidden;
}

html:root .sx .sx-tile-lab .sx-tile-ic {
  flex: none;
}

html:root .sx .sx-tiles .sx-ft {
  white-space: normal;
  -webkit-line-clamp: 2;
  line-height: var(--px-lh-snug);
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
}

@media (max-width: 767px) {
  html:root .sx .sx-tiles .fx-tile .fx-mid {
    font-size: var(--px-text-20);
    line-height: var(--px-lh-snug);
  }
}

html:root .sx .fx-tile {
  min-width: 0;
}

.ds-sb__head {
  min-height: var(--px-size-topbar);
}

.ds-sb__brand {
  gap: var(--px-space-2-5);
  font-size: var(--px-type-brand);
  font-weight: var(--px-weight-brand);
}

.ds-sb__brand img, .ds-sb__brand svg, .ds-sb__brand .px-logo {
  width: var(--px-size-brand-mark);
  height: var(--px-size-brand-mark);
}

.ds-sb__word {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media (max-width: 767px) {
  .ds-sb__brand {
    font-size: var(--px-type-brand-phone);
  }

  .ds-sb__brand img, .ds-sb__brand svg, .ds-sb__brand .px-logo {
    width: var(--px-size-brand-mark-phone);
    height: var(--px-size-brand-mark-phone);
  }
}

.ds-sb__foot {
  padding-bottom: calc(var(--px-space-2) + env(safe-area-inset-bottom));
}

.ds-shell .ds-acct {
  width: 100%;
  display: flex;
}

.ds-acct__btn {
  align-items: center;
  gap: var(--px-space-2-5);
  width: 100%;
  min-height: var(--px-size-row);
  padding: var(--px-space-1) var(--px-space-2);
  border-radius: var(--px-radius-control);
  color: var(--px-nav-fg-strong);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background var(--px-dur-hover) var(--px-ease-linear);
  background: none;
  border: 0;
  display: flex;
}

.ds-acct__btn:hover, .ds-acct__btn[aria-expanded="true"] {
  background: var(--px-fill-hover);
}

.ds-acct__btn:focus-visible {
  box-shadow: var(--px-focus-glow);
  outline: 0;
}

.ds-acct__av {
  width: var(--px-size-avatar-sm);
  height: var(--px-size-avatar-sm);
}

.ds-acct__txt {
  min-width: 0;
  line-height: var(--px-lh-card-title);
  flex: 1;
  display: grid;
}

.ds-acct__name {
  font-size: var(--px-text-13);
  font-weight: var(--px-weight-semibold);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ds-acct__co {
  font-size: var(--px-text-12);
  color: var(--px-nav-fg-3);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ds-acct__chev {
  color: var(--px-nav-fg-3);
  flex: none;
  display: inline-flex;
}

.ds-acct__chev svg {
  width: var(--px-size-icon-sm);
  height: var(--px-size-icon-sm);
}

.ds-shell .ds-acct .shell-menu__pop--top-start {
  width: 100%;
  min-width: var(--px-size-menu);
  transform-origin: bottom;
}

.ds-shell .shell-menu__item .ds-kbd {
  flex: none;
}

@container dssb (max-width: 120px) {
  .ds-sb__brand img, .ds-sb__brand svg, .ds-sb__brand .px-logo {
    width: var(--px-size-rail-hit);
    height: var(--px-size-rail-hit);
  }

  .ds-acct__btn {
    width: var(--px-size-rail-hit);
    height: var(--px-size-rail-hit);
    justify-content: center;
    min-height: 0;
    margin: 0 auto;
    padding: 0;
  }

  .ds-shell .ds-acct .shell-menu__pop--top-start {
    width: auto;
  }
}

.ds-ib.ds-top__chats, .ds-ib.ds-top__menu {
  width: var(--px-size-touch);
  height: var(--px-size-touch);
}

.ds-ib.ds-top__chats svg, .ds-ib.ds-top__menu svg {
  width: var(--px-size-chats-icon);
  height: var(--px-size-chats-icon);
}

.fx-phact .fx-gear {
  width: var(--px-size-touch);
  height: var(--px-size-touch);
}

.bz-model-link {
  color: var(--px-text-link);
  font-size: var(--px-text-12);
  font-weight: var(--px-weight-medium);
  white-space: nowrap;
  flex: none;
  margin-left: auto;
  text-decoration: none;
}

.bz-model-link:hover {
  text-decoration: underline;
}

/* [project]/apps/control/app/control.css [app-client] (css) */
.cc-placeholder {
  min-height: 100dvh;
  padding: var(--px-space-6);
  place-items: center;
  display: grid;
}

.cc-placeholder__card {
  gap: var(--px-space-2);
  max-width: var(--px-size-ph-sheet);
  padding: var(--px-space-5);
  border-radius: var(--px-radius-tile);
  background: var(--px-color-surface);
  box-shadow: var(--px-shadow-popover);
  display: grid;
}

.cc-placeholder__title {
  font-size: var(--px-type-page-title);
  line-height: var(--px-lh-page-title);
  margin: 0;
}

.cc-placeholder__meta {
  color: var(--px-color-text-muted);
  font-size: var(--px-type-meta);
  margin: 0;
}

.cc-auth {
  min-height: 100dvh;
  padding: var(--px-space-6) var(--px-space-4);
  place-items: center;
  display: grid;
}

.cc-auth > * {
  width: 100%;
  max-width: var(--px-size-ph-sheet);
}

.cc-auth__stack {
  gap: var(--px-space-3);
  display: grid;
}

.cc-auth__lead {
  align-items: center;
  gap: var(--px-space-2);
  color: var(--px-color-text);
  margin: 0;
  display: flex;
}

.cc-auth__meta {
  color: var(--px-color-text-muted);
  font-size: var(--px-type-meta);
}

.cc-auth__qr {
  width: calc(var(--px-space-16) * 3);
  height: calc(var(--px-space-16) * 3);
  padding: var(--px-space-2);
  border-radius: var(--px-radius-tile);
  background: var(--px-white);
  justify-self: center;
}

.cc-auth__secret {
  font-family: var(--px-font-mono);
  font-size: var(--px-type-meta);
  color: var(--px-color-text-muted);
  word-break: break-all;
  justify-self: center;
}

.cc-auth__loading {
  place-items: center;
  display: grid;
}

/*# sourceMappingURL=_0mz_bj7v48-96._.css.map*/