/* src/theme-tokens.css */
/*
  UXPIN THEME TOKENS - integrated with the Wire theme editor.
  This file is the single source of truth for the design: every color, font,
  radius and shadow lives here as a CSS variable.
  KEEP THE STRUCTURE: exactly one "html:root:not(.dark)" block (light scheme)
  and one "html:root.dark" block (dark scheme), one "--token: value;" per line.
  Change VALUES or add/remove token lines - never rename or merge the blocks.
*/
html:root:not(.dark) {
  --mui-font-family: "Geist", "Helvetica Neue", Arial, sans-serif;
  --mui-font-weight-h1: 600;
  --mui-font-size-h1: 40px;
  --mui-font-lineHeight-h1: 1.1;
  --mui-font-weight-h2: 600;
  --mui-font-size-h2: 28px;
  --mui-font-lineHeight-h2: 1.2;
  --mui-font-weight-h3: 600;
  --mui-font-size-h3: 15px;
  --mui-font-lineHeight-h3: 1.4;
  --mui-font-weight-h4: 600;
  --mui-font-size-h4: 20px;
  --mui-font-lineHeight-h4: 1.3;
  --mui-font-weight-h5: 500;
  --mui-font-size-h5: 15px;
  --mui-font-lineHeight-h5: 1.4;
  --mui-font-weight-h6: 600;
  --mui-font-size-h6: 20px;
  --mui-font-lineHeight-h6: 1.3;
  --mui-font-weight-subtitle1: 500;
  --mui-font-size-subtitle1: 15px;
  --mui-font-lineHeight-subtitle1: 1.5;
  --mui-font-weight-subtitle2: 500;
  --mui-font-size-subtitle2: 13px;
  --mui-font-lineHeight-subtitle2: 1.5;
  --mui-font-weight-body1: 400;
  --mui-font-size-body1: 14px;
  --mui-font-lineHeight-body1: 1.5;
  --mui-font-weight-body2: 400;
  --mui-font-size-body2: 13px;
  --mui-font-lineHeight-body2: 1.5;
  --mui-font-weight-button: 500;
  --mui-font-size-button: 14px;
  --mui-font-lineHeight-button: 1.2;
  --mui-font-weight-caption: 500;
  --mui-font-size-caption: 12px;
  --mui-font-lineHeight-caption: 1.4;
  --mui-font-weight-overline: 500;
  --mui-font-size-overline: 11px;
  --mui-font-lineHeight-overline: 1.4;
  --mui-spacing: 8px;
  --mui-shape-borderRadius: 8px;
  --mui-shadows-0: none;
  --mui-shadows-1: 0 1px 0 rgba(20,18,15,0.04);
  --mui-shadows-2: 0 1px 2px rgba(20,18,15,0.05);
  --mui-shadows-3: 0 1px 2px rgba(20,18,15,0.06);
  --mui-shadows-4: 0 1px 3px rgba(20,18,15,0.06);
  --mui-shadows-5: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-6: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-7: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-8: 0 4px 12px rgba(20,18,15,0.07);
  --mui-shadows-9: 0 12px 32px rgba(20,18,15,0.08);
  --mui-shadows-10: 0 12px 32px rgba(20,18,15,0.08);
  --mui-shadows-11: 0 12px 32px rgba(20,18,15,0.09);
  --mui-shadows-12: 0 12px 32px rgba(20,18,15,0.09);
  --mui-shadows-13: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-14: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-15: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-16: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-17: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-18: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-19: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-20: 0 24px 48px rgba(20,18,15,0.13);
  --mui-shadows-21: 0 24px 48px rgba(20,18,15,0.13);
  --mui-shadows-22: 0 24px 48px rgba(20,18,15,0.14);
  --mui-shadows-23: 0 24px 48px rgba(20,18,15,0.14);
  --mui-shadows-24: 0 24px 48px rgba(20,18,15,0.14);
  --mui-zIndex-mobileStepper: 1000;
  --mui-zIndex-fab: 1050;
  --mui-zIndex-speedDial: 1050;
  --mui-zIndex-appBar: 1100;
  --mui-zIndex-drawer: 1200;
  --mui-zIndex-modal: 1300;
  --mui-zIndex-snackbar: 1400;
  --mui-zIndex-tooltip: 1500;
  --mui-comp-button-radius: 8px;
  --mui-comp-button-font: "Geist", "Helvetica Neue", Arial, sans-serif;
  --mui-comp-button-text-transform: none;
  --mui-comp-button-border-width: 1px;
  --mui-comp-button-border-style: solid;
  --mui-comp-button-border-color: var(--ds-border);
  --mui-comp-button-shadow: none;
  --mui-comp-button-shadow-hover: none;
  --mui-comp-button-shadow-active: none;
  --mui-comp-button-hover-transform: none;
  --mui-comp-button-active-transform: none;
  --mui-comp-paper-radius: 12px;
  --mui-comp-paper-border: 1px solid var(--mui-palette-divider);
  --mui-comp-chip-radius: 6px;
  --mui-comp-input-radius: 8px;
  --mui-comp-input-border-width: 1px;
  --mui-comp-input-border-style: solid;
  --mui-comp-input-border-color: var(--ds-border);
  --mui-comp-input-focus-border-color: var(--mui-palette-primary-main);
  --ds-accent: #2F4A3A;
  --ds-accent-contrast: #FFFFFF;
  --ds-surface-alt: #F7F5F0;
  --ds-surface-alt-text: #14120F;
  --ds-decor-1: #14120F;
  --ds-decor-2: #2F4A3A;
  --ds-border: #D8D3C7;
  --ds-overlay: rgba(20, 18, 15, 0.40);
  --ds-mono-font: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  colorScheme: light;
  --mui-palette-primary-main: #2F4A3A;
  --mui-palette-primary-light: #4A6B58;
  --mui-palette-primary-dark: #1F3327;
  --mui-palette-primary-contrastText: #FFFFFF;
  --mui-palette-primary-mainChannel: 47 74 58;
  --mui-palette-primary-lightChannel: 74 107 88;
  --mui-palette-primary-darkChannel: 31 51 39;
  --mui-palette-primary-contrastTextChannel: 255 255 255;
  --mui-palette-secondary-main: #EDEAE2;
  --mui-palette-secondary-light: #F5F3EE;
  --mui-palette-secondary-dark: #E0DCD0;
  --mui-palette-secondary-contrastText: #14120F;
  --mui-palette-secondary-mainChannel: 237 234 226;
  --mui-palette-secondary-lightChannel: 245 243 238;
  --mui-palette-secondary-darkChannel: 224 220 208;
  --mui-palette-secondary-contrastTextChannel: 20 18 15;
  --mui-palette-error-main: #B3261E;
  --mui-palette-error-light: #D4574F;
  --mui-palette-error-dark: #8C1D18;
  --mui-palette-error-contrastText: #FFFFFF;
  --mui-palette-error-mainChannel: 179 38 30;
  --mui-palette-error-lightChannel: 212 87 79;
  --mui-palette-error-darkChannel: 140 29 24;
  --mui-palette-error-contrastTextChannel: 255 255 255;
  --mui-palette-warning-main: #A56A00;
  --mui-palette-warning-light: #C98A1B;
  --mui-palette-warning-dark: #7D5000;
  --mui-palette-warning-contrastText: #FFFFFF;
  --mui-palette-warning-mainChannel: 165 106 0;
  --mui-palette-warning-lightChannel: 201 138 27;
  --mui-palette-warning-darkChannel: 125 80 0;
  --mui-palette-warning-contrastTextChannel: 255 255 255;
  --mui-palette-info-main: #2F5D8A;
  --mui-palette-info-light: #5584AD;
  --mui-palette-info-dark: #1F4568;
  --mui-palette-info-contrastText: #FFFFFF;
  --mui-palette-info-mainChannel: 47 93 138;
  --mui-palette-info-lightChannel: 85 132 173;
  --mui-palette-info-darkChannel: 31 69 104;
  --mui-palette-info-contrastTextChannel: 255 255 255;
  --mui-palette-success-main: #1F7A4D;
  --mui-palette-success-light: #3E9B6C;
  --mui-palette-success-dark: #155C39;
  --mui-palette-success-contrastText: #FFFFFF;
  --mui-palette-success-mainChannel: 31 122 77;
  --mui-palette-success-lightChannel: 62 155 108;
  --mui-palette-success-darkChannel: 21 92 57;
  --mui-palette-success-contrastTextChannel: 255 255 255;
  --mui-palette-background-default: #F7F5F0;
  --mui-palette-background-paper: #FFFFFF;
  --mui-palette-background-defaultChannel: 247 245 240;
  --mui-palette-background-paperChannel: 255 255 255;
  --mui-palette-text-primary: #14120F;
  --mui-palette-text-secondary: #6B665D;
  --mui-palette-text-disabled: #A8A398;
  --mui-palette-text-primaryChannel: 20 18 15;
  --mui-palette-text-secondaryChannel: 107 102 93;
  --mui-palette-divider: #E4E0D6;
  --mui-palette-dividerChannel: 228 224 214;
  --mui-palette-common-black: #000000;
  --mui-palette-common-white: #FFFFFF;
  --mui-palette-common-background: #F7F5F0;
  --mui-palette-common-onBackground: #14120F;
  --mui-palette-common-backgroundChannel: 247 245 240;
  --mui-palette-common-onBackgroundChannel: 20 18 15;
  --mui-palette-grey-50: #FAF8F4;
  --mui-palette-grey-100: #F3F0E9;
  --mui-palette-grey-200: #E4E0D6;
  --mui-palette-grey-300: #D8D3C7;
  --mui-palette-grey-400: #B9B3A5;
  --mui-palette-grey-500: #928C7E;
  --mui-palette-grey-600: #6B665D;
  --mui-palette-grey-700: #4E4A43;
  --mui-palette-grey-800: #34312C;
  --mui-palette-grey-900: #1F1D19;
  --mui-palette-grey-A100: #F3F0E9;
  --mui-palette-grey-A200: #E4E0D6;
  --mui-palette-grey-A400: #B9B3A5;
  --mui-palette-grey-A700: #4E4A43;
  --mui-palette-action-active: rgba(20, 18, 15, 0.56);
  --mui-palette-action-hover: rgba(20, 18, 15, 0.04);
  --mui-palette-action-hoverOpacity: 0.04;
  --mui-palette-action-selected: rgba(47, 74, 58, 0.08);
  --mui-palette-action-selectedOpacity: 0.08;
  --mui-palette-action-disabled: rgba(20, 18, 15, 0.28);
  --mui-palette-action-disabledBackground: rgba(20, 18, 15, 0.08);
  --mui-palette-action-disabledOpacity: 0.38;
  --mui-palette-action-focus: rgba(20, 18, 15, 0.1);
  --mui-palette-action-focusOpacity: 0.1;
  --mui-palette-action-activatedOpacity: 0.12;
  --mui-palette-action-activeChannel: 20 18 15;
  --mui-palette-action-selectedChannel: 47 74 58;
  --mui-palette-Alert-errorColor: #5E1612;
  --mui-palette-Alert-infoColor: #1B3A57;
  --mui-palette-Alert-successColor: #0F4A2D;
  --mui-palette-Alert-warningColor: #5A3A00;
  --mui-palette-Alert-errorFilledBg: var(--mui-palette-error-main);
  --mui-palette-Alert-infoFilledBg: var(--mui-palette-info-main);
  --mui-palette-Alert-successFilledBg: var(--mui-palette-success-main);
  --mui-palette-Alert-warningFilledBg: var(--mui-palette-warning-main);
  --mui-palette-Alert-errorFilledColor: #FFFFFF;
  --mui-palette-Alert-infoFilledColor: #FFFFFF;
  --mui-palette-Alert-successFilledColor: #FFFFFF;
  --mui-palette-Alert-warningFilledColor: #FFFFFF;
  --mui-palette-Alert-errorStandardBg: #FBEDEB;
  --mui-palette-Alert-infoStandardBg: #EAF1F8;
  --mui-palette-Alert-successStandardBg: #E9F4EE;
  --mui-palette-Alert-warningStandardBg: #FAF1E1;
  --mui-palette-Alert-errorIconColor: var(--mui-palette-error-main);
  --mui-palette-Alert-infoIconColor: var(--mui-palette-info-main);
  --mui-palette-Alert-successIconColor: var(--mui-palette-success-main);
  --mui-palette-Alert-warningIconColor: var(--mui-palette-warning-main);
  --mui-palette-AppBar-defaultBg: var(--mui-palette-background-paper);
  --mui-palette-Avatar-defaultBg: var(--mui-palette-grey-400);
  --mui-palette-Button-inheritContainedBg: var(--mui-palette-grey-200);
  --mui-palette-Button-inheritContainedHoverBg: var(--mui-palette-grey-300);
  --mui-palette-Chip-defaultBorder: var(--mui-palette-divider);
  --mui-palette-Chip-defaultAvatarColor: var(--mui-palette-grey-700);
  --mui-palette-Chip-defaultIconColor: var(--mui-palette-grey-700);
  --mui-palette-FilledInput-bg: rgba(20, 18, 15, 0.05);
  --mui-palette-FilledInput-hoverBg: rgba(20, 18, 15, 0.08);
  --mui-palette-FilledInput-disabledBg: rgba(20, 18, 15, 0.08);
  --mui-palette-LinearProgress-primaryBg: #DDE5DF;
  --mui-palette-LinearProgress-secondaryBg: #E4E0D6;
  --mui-palette-LinearProgress-errorBg: #F0D3D0;
  --mui-palette-LinearProgress-infoBg: #D6E2EE;
  --mui-palette-LinearProgress-successBg: #D3E8DC;
  --mui-palette-LinearProgress-warningBg: #EEDDBF;
  --mui-palette-Skeleton-bg: rgba(20, 18, 15, 0.07);
  --mui-palette-Slider-primaryTrack: #BFCDC4;
  --mui-palette-Slider-secondaryTrack: #D8D3C7;
  --mui-palette-Slider-errorTrack: #E8B9B5;
  --mui-palette-Slider-infoTrack: #BFD2E4;
  --mui-palette-Slider-successTrack: #B4D8C4;
  --mui-palette-Slider-warningTrack: #E6CFA1;
  --mui-palette-SnackbarContent-bg: #14120F;
  --mui-palette-SnackbarContent-color: #F7F5F0;
  --mui-palette-SpeedDialAction-fabHoverBg: #E4E0D6;
  --mui-palette-StepConnector-border: var(--mui-palette-divider);
  --mui-palette-StepContent-border: var(--mui-palette-divider);
  --mui-palette-Switch-defaultColor: #FFFFFF;
  --mui-palette-Switch-defaultDisabledColor: var(--mui-palette-grey-100);
  --mui-palette-Switch-primaryDisabledColor: #BFCDC4;
  --mui-palette-Switch-secondaryDisabledColor: #D8D3C7;
  --mui-palette-Switch-errorDisabledColor: #E8B9B5;
  --mui-palette-Switch-infoDisabledColor: #BFD2E4;
  --mui-palette-Switch-successDisabledColor: #B4D8C4;
  --mui-palette-Switch-warningDisabledColor: #E6CFA1;
  --mui-palette-TableCell-border: var(--mui-palette-divider);
  --mui-palette-Tooltip-bg: #14120F;
  --mui-opacity-inputPlaceholder: 0.5;
  --mui-opacity-inputUnderline: 0.42;
  --mui-opacity-switchTrackDisabled: 0.12;
  --mui-opacity-switchTrack: 0.3;
}
html:root.dark {
  --mui-font-family: "Geist", "Helvetica Neue", Arial, sans-serif;
  --mui-font-weight-h1: 600;
  --mui-font-size-h1: 40px;
  --mui-font-lineHeight-h1: 1.1;
  --mui-font-weight-h2: 600;
  --mui-font-size-h2: 28px;
  --mui-font-lineHeight-h2: 1.2;
  --mui-font-weight-h3: 600;
  --mui-font-size-h3: 15px;
  --mui-font-lineHeight-h3: 1.4;
  --mui-font-weight-h4: 600;
  --mui-font-size-h4: 20px;
  --mui-font-lineHeight-h4: 1.3;
  --mui-font-weight-h5: 500;
  --mui-font-size-h5: 15px;
  --mui-font-lineHeight-h5: 1.4;
  --mui-font-weight-h6: 600;
  --mui-font-size-h6: 20px;
  --mui-font-lineHeight-h6: 1.3;
  --mui-font-weight-subtitle1: 500;
  --mui-font-size-subtitle1: 15px;
  --mui-font-lineHeight-subtitle1: 1.5;
  --mui-font-weight-subtitle2: 500;
  --mui-font-size-subtitle2: 13px;
  --mui-font-lineHeight-subtitle2: 1.5;
  --mui-font-weight-body1: 400;
  --mui-font-size-body1: 14px;
  --mui-font-lineHeight-body1: 1.5;
  --mui-font-weight-body2: 400;
  --mui-font-size-body2: 13px;
  --mui-font-lineHeight-body2: 1.5;
  --mui-font-weight-button: 500;
  --mui-font-size-button: 14px;
  --mui-font-lineHeight-button: 1.2;
  --mui-font-weight-caption: 500;
  --mui-font-size-caption: 12px;
  --mui-font-lineHeight-caption: 1.4;
  --mui-font-weight-overline: 500;
  --mui-font-size-overline: 11px;
  --mui-font-lineHeight-overline: 1.4;
  --mui-spacing: 8px;
  --mui-shape-borderRadius: 8px;
  --mui-shadows-0: none;
  --mui-shadows-1: 0 1px 0 rgba(20,18,15,0.04);
  --mui-shadows-2: 0 1px 2px rgba(20,18,15,0.05);
  --mui-shadows-3: 0 1px 2px rgba(20,18,15,0.06);
  --mui-shadows-4: 0 1px 3px rgba(20,18,15,0.06);
  --mui-shadows-5: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-6: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-7: 0 4px 12px rgba(20,18,15,0.06);
  --mui-shadows-8: 0 4px 12px rgba(20,18,15,0.07);
  --mui-shadows-9: 0 12px 32px rgba(20,18,15,0.08);
  --mui-shadows-10: 0 12px 32px rgba(20,18,15,0.08);
  --mui-shadows-11: 0 12px 32px rgba(20,18,15,0.09);
  --mui-shadows-12: 0 12px 32px rgba(20,18,15,0.09);
  --mui-shadows-13: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-14: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-15: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-16: 0 12px 32px rgba(20,18,15,0.10);
  --mui-shadows-17: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-18: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-19: 0 24px 48px rgba(20,18,15,0.12);
  --mui-shadows-20: 0 24px 48px rgba(20,18,15,0.13);
  --mui-shadows-21: 0 24px 48px rgba(20,18,15,0.13);
  --mui-shadows-22: 0 24px 48px rgba(20,18,15,0.14);
  --mui-shadows-23: 0 24px 48px rgba(20,18,15,0.14);
  --mui-shadows-24: 0 24px 48px rgba(20,18,15,0.14);
  --mui-zIndex-mobileStepper: 1000;
  --mui-zIndex-fab: 1050;
  --mui-zIndex-speedDial: 1050;
  --mui-zIndex-appBar: 1100;
  --mui-zIndex-drawer: 1200;
  --mui-zIndex-modal: 1300;
  --mui-zIndex-snackbar: 1400;
  --mui-zIndex-tooltip: 1500;
  --mui-comp-button-radius: 8px;
  --mui-comp-button-font: "Geist", "Helvetica Neue", Arial, sans-serif;
  --mui-comp-button-text-transform: none;
  --mui-comp-button-border-width: 1px;
  --mui-comp-button-border-style: solid;
  --mui-comp-button-border-color: var(--ds-border);
  --mui-comp-button-shadow: none;
  --mui-comp-button-shadow-hover: none;
  --mui-comp-button-shadow-active: none;
  --mui-comp-button-hover-transform: none;
  --mui-comp-button-active-transform: none;
  --mui-comp-paper-radius: 12px;
  --mui-comp-paper-border: 1px solid var(--mui-palette-divider);
  --mui-comp-chip-radius: 6px;
  --mui-comp-input-radius: 8px;
  --mui-comp-input-border-width: 1px;
  --mui-comp-input-border-style: solid;
  --mui-comp-input-border-color: var(--ds-border);
  --mui-comp-input-focus-border-color: var(--mui-palette-primary-main);
  --ds-accent: #8FB59F;
  --ds-accent-contrast: #0F1A13;
  --ds-surface-alt: #1F1D19;
  --ds-surface-alt-text: #F2EFE8;
  --ds-decor-1: #2B2924;
  --ds-decor-2: #3A5A47;
  --ds-border: #3A372F;
  --ds-overlay: rgba(0, 0, 0, 0.60);
  --ds-mono-font: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  colorScheme: dark;
  --mui-palette-primary-main: #8FB59F;
  --mui-palette-primary-light: #B2CEBD;
  --mui-palette-primary-dark: #A9CDB7;
  --mui-palette-primary-contrastText: #0F1A13;
  --mui-palette-primary-mainChannel: 143 181 159;
  --mui-palette-primary-lightChannel: 178 206 189;
  --mui-palette-primary-darkChannel: 169 205 183;
  --mui-palette-primary-contrastTextChannel: 15 26 19;
  --mui-palette-secondary-main: #26241F;
  --mui-palette-secondary-light: #302D27;
  --mui-palette-secondary-dark: #34312A;
  --mui-palette-secondary-contrastText: #F2EFE8;
  --mui-palette-secondary-mainChannel: 38 36 31;
  --mui-palette-secondary-lightChannel: 48 45 39;
  --mui-palette-secondary-darkChannel: 52 49 42;
  --mui-palette-secondary-contrastTextChannel: 242 239 232;
  --mui-palette-error-main: #F0786F;
  --mui-palette-error-light: #F59A93;
  --mui-palette-error-dark: #E55A50;
  --mui-palette-error-contrastText: #1A0D0C;
  --mui-palette-error-mainChannel: 240 120 111;
  --mui-palette-error-lightChannel: 245 154 147;
  --mui-palette-error-darkChannel: 229 90 80;
  --mui-palette-error-contrastTextChannel: 26 13 12;
  --mui-palette-warning-main: #E0A23A;
  --mui-palette-warning-light: #EDB95E;
  --mui-palette-warning-dark: #C98A1B;
  --mui-palette-warning-contrastText: #1A1204;
  --mui-palette-warning-mainChannel: 224 162 58;
  --mui-palette-warning-lightChannel: 237 185 94;
  --mui-palette-warning-darkChannel: 201 138 27;
  --mui-palette-warning-contrastTextChannel: 26 18 4;
  --mui-palette-info-main: #7DB0E0;
  --mui-palette-info-light: #A0C7EC;
  --mui-palette-info-dark: #5F98CF;
  --mui-palette-info-contrastText: #0B1822;
  --mui-palette-info-mainChannel: 125 176 224;
  --mui-palette-info-lightChannel: 160 199 236;
  --mui-palette-info-darkChannel: 95 152 207;
  --mui-palette-info-contrastTextChannel: 11 24 34;
  --mui-palette-success-main: #5CC48E;
  --mui-palette-success-light: #82D6A9;
  --mui-palette-success-dark: #46AE78;
  --mui-palette-success-contrastText: #08170F;
  --mui-palette-success-mainChannel: 92 196 142;
  --mui-palette-success-lightChannel: 130 214 169;
  --mui-palette-success-darkChannel: 70 174 120;
  --mui-palette-success-contrastTextChannel: 8 23 15;
  --mui-palette-background-default: #0F0E0C;
  --mui-palette-background-paper: #181714;
  --mui-palette-background-defaultChannel: 15 14 12;
  --mui-palette-background-paperChannel: 24 23 20;
  --mui-palette-text-primary: #F2EFE8;
  --mui-palette-text-secondary: #A29D92;
  --mui-palette-text-disabled: #6F6B62;
  --mui-palette-text-icon: #A29D92;
  --mui-palette-text-primaryChannel: 242 239 232;
  --mui-palette-text-secondaryChannel: 162 157 146;
  --mui-palette-divider: #2A2823;
  --mui-palette-dividerChannel: 42 40 35;
  --mui-palette-common-black: #000000;
  --mui-palette-common-white: #FFFFFF;
  --mui-palette-common-background: #0F0E0C;
  --mui-palette-common-onBackground: #F2EFE8;
  --mui-palette-common-backgroundChannel: 15 14 12;
  --mui-palette-common-onBackgroundChannel: 242 239 232;
  --mui-palette-grey-50: #FAF8F4;
  --mui-palette-grey-100: #F3F0E9;
  --mui-palette-grey-200: #E4E0D6;
  --mui-palette-grey-300: #D8D3C7;
  --mui-palette-grey-400: #B9B3A5;
  --mui-palette-grey-500: #928C7E;
  --mui-palette-grey-600: #6B665D;
  --mui-palette-grey-700: #4E4A43;
  --mui-palette-grey-800: #34312C;
  --mui-palette-grey-900: #1F1D19;
  --mui-palette-grey-A100: #F3F0E9;
  --mui-palette-grey-A200: #E4E0D6;
  --mui-palette-grey-A400: #B9B3A5;
  --mui-palette-grey-A700: #4E4A43;
  --mui-palette-action-active: rgba(242, 239, 232, 0.6);
  --mui-palette-action-hover: rgba(242, 239, 232, 0.06);
  --mui-palette-action-hoverOpacity: 0.06;
  --mui-palette-action-selected: rgba(143, 181, 159, 0.14);
  --mui-palette-action-selectedOpacity: 0.14;
  --mui-palette-action-disabled: rgba(242, 239, 232, 0.3);
  --mui-palette-action-disabledBackground: rgba(242, 239, 232, 0.08);
  --mui-palette-action-disabledOpacity: 0.38;
  --mui-palette-action-focus: rgba(242, 239, 232, 0.12);
  --mui-palette-action-focusOpacity: 0.12;
  --mui-palette-action-activatedOpacity: 0.24;
  --mui-palette-action-activeChannel: 242 239 232;
  --mui-palette-action-selectedChannel: 143 181 159;
  --mui-palette-Alert-errorColor: #F6C9C5;
  --mui-palette-Alert-infoColor: #C3DBF2;
  --mui-palette-Alert-successColor: #BFE6D1;
  --mui-palette-Alert-warningColor: #F2D9A8;
  --mui-palette-Alert-errorFilledBg: var(--mui-palette-error-main);
  --mui-palette-Alert-infoFilledBg: var(--mui-palette-info-main);
  --mui-palette-Alert-successFilledBg: var(--mui-palette-success-main);
  --mui-palette-Alert-warningFilledBg: var(--mui-palette-warning-main);
  --mui-palette-Alert-errorFilledColor: #1A0D0C;
  --mui-palette-Alert-infoFilledColor: #0B1822;
  --mui-palette-Alert-successFilledColor: #08170F;
  --mui-palette-Alert-warningFilledColor: #1A1204;
  --mui-palette-Alert-errorStandardBg: #2A1614;
  --mui-palette-Alert-infoStandardBg: #131D28;
  --mui-palette-Alert-successStandardBg: #12231A;
  --mui-palette-Alert-warningStandardBg: #2A200E;
  --mui-palette-Alert-errorIconColor: var(--mui-palette-error-main);
  --mui-palette-Alert-infoIconColor: var(--mui-palette-info-main);
  --mui-palette-Alert-successIconColor: var(--mui-palette-success-main);
  --mui-palette-Alert-warningIconColor: var(--mui-palette-warning-main);
  --mui-palette-AppBar-defaultBg: var(--mui-palette-background-paper);
  --mui-palette-AppBar-darkBg: var(--mui-palette-background-paper);
  --mui-palette-AppBar-darkColor: var(--mui-palette-text-primary);
  --mui-palette-Avatar-defaultBg: var(--mui-palette-grey-600);
  --mui-palette-Button-inheritContainedBg: var(--mui-palette-grey-800);
  --mui-palette-Button-inheritContainedHoverBg: var(--mui-palette-grey-700);
  --mui-palette-Chip-defaultBorder: var(--mui-palette-divider);
  --mui-palette-Chip-defaultAvatarColor: var(--mui-palette-grey-300);
  --mui-palette-Chip-defaultIconColor: var(--mui-palette-grey-300);
  --mui-palette-FilledInput-bg: rgba(242, 239, 232, 0.07);
  --mui-palette-FilledInput-hoverBg: rgba(242, 239, 232, 0.1);
  --mui-palette-FilledInput-disabledBg: rgba(242, 239, 232, 0.08);
  --mui-palette-LinearProgress-primaryBg: #2A3A31;
  --mui-palette-LinearProgress-secondaryBg: #2A2823;
  --mui-palette-LinearProgress-errorBg: #4A2420;
  --mui-palette-LinearProgress-infoBg: #1F3347;
  --mui-palette-LinearProgress-successBg: #1F3A2B;
  --mui-palette-LinearProgress-warningBg: #4A3913;
  --mui-palette-Skeleton-bg: rgba(242, 239, 232, 0.09);
  --mui-palette-Slider-primaryTrack: #3F5A4A;
  --mui-palette-Slider-secondaryTrack: #3A372F;
  --mui-palette-Slider-errorTrack: #6B2F2A;
  --mui-palette-Slider-infoTrack: #2F4A66;
  --mui-palette-Slider-successTrack: #2F5A44;
  --mui-palette-Slider-warningTrack: #6B521F;
  --mui-palette-SnackbarContent-bg: #F2EFE8;
  --mui-palette-SnackbarContent-color: #14120F;
  --mui-palette-SpeedDialAction-fabHoverBg: #2A2823;
  --mui-palette-StepConnector-border: var(--mui-palette-divider);
  --mui-palette-StepContent-border: var(--mui-palette-divider);
  --mui-palette-Switch-defaultColor: #D8D3C7;
  --mui-palette-Switch-defaultDisabledColor: var(--mui-palette-grey-600);
  --mui-palette-Switch-primaryDisabledColor: #3F5A4A;
  --mui-palette-Switch-secondaryDisabledColor: #3A372F;
  --mui-palette-Switch-errorDisabledColor: #6B2F2A;
  --mui-palette-Switch-infoDisabledColor: #2F4A66;
  --mui-palette-Switch-successDisabledColor: #2F5A44;
  --mui-palette-Switch-warningDisabledColor: #6B521F;
  --mui-palette-TableCell-border: var(--mui-palette-divider);
  --mui-palette-Tooltip-bg: #F2EFE8;
  --mui-opacity-inputPlaceholder: 0.5;
  --mui-opacity-inputUnderline: 0.7;
  --mui-opacity-switchTrackDisabled: 0.2;
  --mui-opacity-switchTrack: 0.3;
  --mui-overlays-0: none;
  --mui-overlays-1: none;
  --mui-overlays-2: none;
  --mui-overlays-3: none;
  --mui-overlays-4: none;
  --mui-overlays-5: none;
  --mui-overlays-6: none;
  --mui-overlays-7: none;
  --mui-overlays-8: none;
  --mui-overlays-9: none;
  --mui-overlays-10: none;
  --mui-overlays-11: none;
  --mui-overlays-12: none;
  --mui-overlays-13: none;
  --mui-overlays-14: none;
  --mui-overlays-15: none;
  --mui-overlays-16: none;
  --mui-overlays-17: none;
  --mui-overlays-18: none;
  --mui-overlays-19: none;
  --mui-overlays-20: none;
  --mui-overlays-21: none;
  --mui-overlays-22: none;
  --mui-overlays-23: none;
  --mui-overlays-24: none;
}


/* src/styles/base.css */
/* Aliases over the theme tokens. No raw colours live in this file. */
:root {
  --bg: var(--mui-palette-background-default);
  --paper: var(--mui-palette-background-paper);
  --ink: var(--mui-palette-text-primary);
  --muted: var(--mui-palette-text-secondary);
  --faint: var(--mui-palette-text-disabled);
  --line: var(--mui-palette-divider);
  --line-2: var(--ds-border);
  --alt: var(--ds-surface-alt);
  --accent: var(--mui-palette-primary-main);
  --accent-ink: var(--mui-palette-primary-contrastText);
  --pos: var(--mui-palette-success-main);
  --neg: var(--mui-palette-error-main);
  --warn: var(--mui-palette-warning-main);
  --info: var(--mui-palette-info-main);
  --pos-bg: rgba(var(--mui-palette-success-mainChannel) / 0.12);
  --neg-bg: rgba(var(--mui-palette-error-mainChannel) / 0.1);
  --warn-bg: rgba(var(--mui-palette-warning-mainChannel) / 0.14);
  --info-bg: rgba(var(--mui-palette-info-mainChannel) / 0.12);
  --accent-bg: rgba(var(--mui-palette-primary-mainChannel) / 0.1);
  --hover: rgba(var(--mui-palette-text-primaryChannel) / 0.04);
  --press: rgba(var(--mui-palette-text-primaryChannel) / 0.08);
  --mono: var(--ds-mono-font);
  --r-card: 12px;
  --r-ctl: 8px;
  --r-chip: 6px;
  --dur-fast: 120ms;
  --dur: 200ms;
  --dur-slow: 250ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --rail-w: 232px;
  --top-h: 56px;
  --f-h1: var(--mui-font-weight-h1) var(--mui-font-size-h1) / var(--mui-font-lineHeight-h1) var(--mui-font-family);
  --f-h2: var(--mui-font-weight-h2) var(--mui-font-size-h2) / var(--mui-font-lineHeight-h2) var(--mui-font-family);
  --f-h3: var(--mui-font-weight-h3) var(--mui-font-size-h3) / var(--mui-font-lineHeight-h3) var(--mui-font-family);
  --f-h4: var(--mui-font-weight-h4) var(--mui-font-size-h4) / var(--mui-font-lineHeight-h4) var(--mui-font-family);
  --f-body: var(--mui-font-weight-body1) var(--mui-font-size-body1) / var(--mui-font-lineHeight-body1) var(--mui-font-family);
  --f-small: var(--mui-font-weight-body2) var(--mui-font-size-body2) / var(--mui-font-lineHeight-body2) var(--mui-font-family);
  --f-ui: var(--mui-font-weight-button) var(--mui-font-size-button) / var(--mui-font-lineHeight-button) var(--mui-font-family);
  --f-cap: var(--mui-font-weight-caption) var(--mui-font-size-caption) / var(--mui-font-lineHeight-caption) var(--mui-font-family);
}

html { -webkit-text-size-adjust: 100%; }
body { background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; }
button { font-family: inherit; }
h1, h2, h3, p { margin: 0; }

.t-h1 { font: var(--f-h1); letter-spacing: -0.03em; }
.t-h2 { font: var(--f-h2); letter-spacing: -0.02em; }
.t-h3 { font: var(--f-h3); }
.t-h4 { font: var(--f-h4); letter-spacing: -0.01em; }
.t-body { font: var(--f-body); }
.t-small { font: var(--f-small); }
.t-cap { font: var(--f-cap); }
.muted { color: var(--muted); }
.num { font-family: var(--mono) !important; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; font-feature-settings: "tnum" 1; }
.pos { color: var(--pos); }
.neg { color: var(--neg); }
.nowrap { white-space: nowrap; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.MuiInputBase-input:focus-visible { outline: none; }

/* Layout */
.page { max-width: 1200px; margin: 0 auto; padding: 24px; display: flex; flex-direction: column; gap: 16px; width: 100%; box-sizing: border-box; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.page-head__title { font: var(--f-h2); letter-spacing: -0.02em; }
.page-head__sub { font: var(--f-body); color: var(--muted); margin-top: 4px; }
.page-head__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

.grid { display: grid; gap: 16px; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: stretch; }
.span-12 { grid-column: span 12; }
.span-8 { grid-column: span 8; }
.span-7 { grid-column: span 7; }
.span-6 { grid-column: span 6; }
.span-5 { grid-column: span 5; }
.span-4 { grid-column: span 4; }
.span-3 { grid-column: span 3; }
@media (max-width: 1099px) {
  .span-8, .span-7, .span-6, .span-5, .span-4 { grid-column: span 12; }
  .span-3 { grid-column: span 6; }
}
@media (max-width: 479px) {
  .span-3 { grid-column: span 12; }
}

/* Panels */
.panel { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-card); display: flex; flex-direction: column; min-width: 0; box-sizing: border-box; }
.panel__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px 0; min-height: 24px; flex-wrap: wrap; }
.panel__title { font: var(--f-h3); }
.panel__sub { font: var(--f-small); color: var(--muted); }
.panel__body { padding: 16px 20px 20px; flex: 1; min-width: 0; }
.panel__body--flush { padding: 8px 0 0; }
.panel__link { display: inline-flex; align-items: center; gap: 4px; font: var(--f-ui); color: var(--accent); text-decoration: none; border-radius: 6px; padding: 4px 6px; margin: -4px -6px; transition: background var(--dur-fast) var(--ease); }
.panel__link:hover { background: var(--accent-bg); }
.panel__link:active { background: var(--press); }

/* Chips */
.chip { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 8px; border-radius: var(--r-chip); font: var(--f-cap); white-space: nowrap; box-sizing: border-box; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.chip--pos { background: var(--pos-bg); color: var(--pos); }
.chip--neg { background: var(--neg-bg); color: var(--neg); }
.chip--warn { background: var(--warn-bg); color: var(--warn); }
.chip--info { background: var(--info-bg); color: var(--info); }
.chip--accent { background: var(--accent-bg); color: var(--accent); }
.chip--neutral { background: var(--alt); color: var(--muted); box-shadow: inset 0 0 0 1px var(--line); }
.chip--plain::before { display: none; }

/* Merchant mark and avatars */
.mmark { width: 32px; height: 32px; border-radius: 8px; background: var(--alt); border: 1px solid var(--line); color: var(--muted); display: inline-flex; align-items: center; justify-content: center; font: var(--f-ui); flex-shrink: 0; box-sizing: border-box; }
.mmark--in { background: var(--pos-bg); border-color: transparent; color: var(--pos); }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--ds-decor-1); color: var(--mui-palette-common-white); display: inline-flex; align-items: center; justify-content: center; font: var(--f-cap); flex-shrink: 0; text-decoration: none; box-sizing: border-box; }

/* Tables */
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; }
.tbl th { text-align: left; padding: 0 16px; height: 40px; font: var(--f-cap); color: var(--muted); border-bottom: 1px solid var(--line); white-space: nowrap; background: var(--paper); }
.tbl td { padding: 0 16px; height: 56px; border-bottom: 1px solid var(--line); font: var(--f-body); vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tbody tr { transition: background var(--dur-fast) var(--ease); }
.tbl tbody tr:hover { background: var(--hover); }
.tbl tbody tr.is-selected { background: var(--accent-bg); }
.tbl tbody tr.row-link { cursor: pointer; }
.tbl tbody tr:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.tbl .r { text-align: right; }
.tbl .check { width: 48px; padding-right: 0; }
.th-btn { background: none; border: 0; padding: 0; font: inherit; color: inherit; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; height: 40px; border-radius: 4px; transition: color var(--dur-fast) var(--ease); }
.th-btn:hover { color: var(--ink); }
.th-btn[data-active="true"] { color: var(--ink); }
.cell-merchant { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cell-merchant__name { font: var(--f-ui); display: block; }
.cell-merchant__sub { font: var(--f-cap); color: var(--muted); display: block; font-weight: 400; }

/* List rows (mobile + compact lists) */
.rows { list-style: none; margin: 0; padding: 0; }
.row { display: flex; align-items: center; gap: 12px; padding: 12px 20px; min-height: 56px; box-sizing: border-box; border-top: 1px solid var(--line); text-decoration: none; color: inherit; transition: background var(--dur-fast) var(--ease); width: 100%; background: none; border-left: 0; border-right: 0; border-bottom: 0; text-align: left; cursor: pointer; font: inherit; }
.rows > li:first-child .row { border-top: 0; }
.row:hover { background: var(--hover); }
.row:active { background: var(--press); }
.row:focus-visible { outline-offset: -2px; }
.row__main { flex: 1; min-width: 0; }
.row__title { font: var(--f-ui); display: block; }
.row__sub { font: var(--f-cap); color: var(--muted); display: block; font-weight: 400; }
.row__end { text-align: right; flex-shrink: 0; }
.row__amount { font: var(--f-ui); display: block; }

/* Segmented control */
.seg { display: inline-flex; padding: 2px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--alt); gap: 2px; max-width: 100%; overflow-x: auto; }
.seg button { height: 32px; padding: 0 12px; border: 0; background: transparent; border-radius: 6px; font: var(--f-ui); color: var(--muted); cursor: pointer; white-space: nowrap; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.seg button:hover { color: var(--ink); background: var(--hover); }
.seg button:active { background: var(--press); }
.seg button[aria-checked="true"], .seg button[aria-pressed="true"] { background: var(--paper); color: var(--ink); box-shadow: 0 0 0 1px var(--line); }

/* Key / value lists */
.kv { display: grid; grid-template-columns: 128px minmax(0, 1fr); gap: 12px 16px; margin: 0; }
.kv dt { font: var(--f-small); color: var(--muted); }
.kv dd { margin: 0; font: var(--f-body); min-width: 0; overflow-wrap: anywhere; }

/* Meter */
.meter { height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.meter > span { display: block; height: 100%; border-radius: 3px; background: var(--accent); transition: width var(--dur) var(--ease); }
.meter--warn > span { background: var(--warn); }
.meter--neg > span { background: var(--neg); }

/* Empty / error states */
.empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 48px 24px; }
.empty__icon { width: 48px; height: 48px; border-radius: 50%; background: var(--alt); border: 1px solid var(--line); display: inline-flex; align-items: center; justify-content: center; color: var(--muted); margin-bottom: 4px; }
.empty__icon--neg { background: var(--neg-bg); border-color: transparent; color: var(--neg); }
.empty__title { font: var(--f-h3); }
.empty__text { font: var(--f-body); color: var(--muted); max-width: 360px; }
.empty .MuiButton-root { margin-top: 8px; }

/* Forms */
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.field-full { grid-column: 1 / -1; }
@media (max-width: 599px) { .form-grid { grid-template-columns: minmax(0, 1fr); } }
.stack { display: flex; flex-direction: column; gap: 16px; }
.stack-sm { display: flex; flex-direction: column; gap: 8px; }
.inline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.menu-paper { min-width: 220px; }

/* Touch targets on small screens */
@media (max-width: 899px) {
  .page { padding: 16px; }
  .MuiButton-root { min-height: 44px; }
  .MuiIconButton-root { min-width: 44px; min-height: 44px; }
  .MuiMenuItem-root { min-height: 44px; }
  .seg button { min-height: 44px; }
  .page-head__title { font-size: var(--mui-font-size-h4); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}


/* src/styles/shell.css */
.shell { display: grid; grid-template-columns: var(--rail-w) minmax(0, 1fr); min-height: 100vh; transition: grid-template-columns var(--dur) var(--ease); }
.shell--collapsed { --rail-w: 64px; }
.skip { position: absolute; left: 8px; top: -48px; z-index: 100; background: var(--ink); color: var(--bg); border: 0; border-radius: 8px; padding: 10px 14px; font: var(--f-ui); cursor: pointer; }
.skip:focus { top: 8px; }

/* Rail */
.rail { position: sticky; top: 0; height: 100vh; box-sizing: border-box; display: flex; flex-direction: column; gap: 16px; padding: 12px 8px; background: var(--paper); border-right: 1px solid var(--line); overflow: hidden; }
.brand { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px; border-radius: 8px; text-decoration: none; color: var(--ink); font: var(--f-h3); letter-spacing: -0.01em; }
.brand:hover { background: var(--hover); }
.brand__mark { width: 24px; height: 24px; border-radius: 7px; background: var(--ink); color: var(--paper); display: inline-flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: var(--mui-font-size-caption); font-weight: 500; flex-shrink: 0; }
.rail__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.navlink { display: flex; align-items: center; gap: 12px; height: 40px; padding: 0 10px; border-radius: 8px; color: var(--muted); text-decoration: none; font: var(--f-ui); transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); white-space: nowrap; box-sizing: border-box; }
.navlink:hover { background: var(--hover); color: var(--ink); }
.navlink:active { background: var(--press); }
.navlink.active { background: var(--accent-bg); color: var(--accent); }
.rail__foot { margin-top: auto; display: flex; flex-direction: column; gap: 8px; }
.workspace { display: flex; align-items: center; gap: 10px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; min-width: 0; }
.workspace__name { font: var(--f-ui); display: block; }
.workspace__sub { font: var(--f-cap); color: var(--muted); display: block; font-weight: 400; }
.rail__toggle { display: flex; align-items: center; gap: 12px; height: 40px; padding: 0 10px; border: 0; background: none; border-radius: 8px; color: var(--muted); font: var(--f-ui); cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease); }
.rail__toggle:hover { background: var(--hover); color: var(--ink); }
.rail__toggle:active { background: var(--press); }
.shell--collapsed .navlink__label, .shell--collapsed .brand__name, .shell--collapsed .workspace__text, .shell--collapsed .rail__toggle-label { display: none; }
.shell--collapsed .navlink, .shell--collapsed .rail__toggle { justify-content: center; padding: 0; }
.shell--collapsed .workspace { justify-content: center; padding: 8px 0; border-color: transparent; }
.shell--collapsed .brand { justify-content: center; padding: 0; }

/* Top bar */
.main { min-width: 0; display: flex; flex-direction: column; }
.topbar { position: sticky; top: 0; z-index: 20; height: var(--top-h); box-sizing: border-box; display: flex; align-items: center; gap: 12px; padding: 0 24px; background: var(--bg); border-bottom: 1px solid var(--line); }
.topbar__spacer { flex: 1; }
.searchbox { flex: 1; max-width: 420px; height: 36px; box-sizing: border-box; display: flex; align-items: center; gap: 8px; padding: 0 8px 0 12px; border: 1px solid var(--line-2); background: var(--paper); border-radius: var(--r-ctl); color: var(--muted); cursor: pointer; font: var(--f-body); text-align: left; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.searchbox:hover { border-color: var(--muted); }
.searchbox:active { background: var(--press); }
.searchbox__label { flex: 1; }
.kbd { font: var(--f-cap); font-family: var(--mono); border: 1px solid var(--line-2); border-radius: 4px; padding: 2px 6px; color: var(--muted); background: var(--alt); }
.acct-btn { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 8px 0 10px; border: 1px solid var(--line-2); border-radius: var(--r-ctl); background: var(--paper); color: var(--ink); cursor: pointer; font: var(--f-ui); transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.acct-btn:hover { border-color: var(--muted); }
.acct-btn:active { background: var(--press); }
.acct-btn__cur { font-family: var(--mono); font-size: var(--mui-font-size-caption); color: var(--muted); }
.acct-item { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; }
.acct-item__name { font: var(--f-ui); display: block; }
.acct-item__sub { font: var(--f-cap); color: var(--muted); display: block; font-weight: 400; }
.main__content { flex: 1; outline: none; }

/* Bottom bar (mobile) */
.bottombar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; box-sizing: border-box; padding-bottom: env(safe-area-inset-bottom); background: var(--paper); border-top: 1px solid var(--line); }
.bottombar a, .bottombar button { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 56px; padding: 6px 0; color: var(--muted); font: var(--f-cap); text-decoration: none; background: none; border: 0; cursor: pointer; transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.bottombar a:active, .bottombar button:active { background: var(--press); }
.bottombar a.active { color: var(--accent); }
.more-sheet { padding: 8px 8px 16px; }
.more-sheet .navlink { height: 48px; }

@media (max-width: 899px) {
  .shell { grid-template-columns: minmax(0, 1fr); }
  .topbar { padding: 0 16px; gap: 8px; }
  .main__content { padding-bottom: 72px; }
  .kbd { display: none; }
  .searchbox { flex: 0 0 auto; width: 44px; height: 44px; padding: 0; justify-content: center; border-color: transparent; background: transparent; }
  .searchbox__label { display: none; }
  .acct-btn { height: 44px; }
}

/* Command palette */
.cmdk { width: 560px; max-width: calc(100vw - 32px); align-self: flex-start; margin-top: 12vh; }
.cmdk__input-wrap { display: flex; align-items: center; gap: 12px; padding: 0 16px; border-bottom: 1px solid var(--line); color: var(--muted); }
.cmdk__input { flex: 1; height: 52px; border: 0; background: transparent; color: var(--ink); font: var(--f-body); font-size: var(--mui-font-size-subtitle1); outline: none; }
.cmdk__input::placeholder { color: var(--faint); }
.cmdk__list { max-height: 360px; overflow-y: auto; padding: 8px; }
.cmdk__group { font: var(--f-cap); color: var(--muted); padding: 8px 8px 4px; }
.cmdk__item { display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 0 8px; border-radius: 8px; text-decoration: none; color: var(--ink); font: var(--f-body); background: none; border: 0; width: 100%; text-align: left; cursor: pointer; box-sizing: border-box; }
.cmdk__item[aria-selected="true"] { background: var(--accent-bg); }
.cmdk__item:active { background: var(--press); }
.cmdk__item:focus-visible { outline-offset: -2px; }
.cmdk__hint { margin-left: auto; font: var(--f-cap); color: var(--muted); }
.cmdk__foot { display: flex; gap: 16px; padding: 8px 16px; border-top: 1px solid var(--line); color: var(--muted); font: var(--f-cap); }

/* Toasts */
.toasts { position: fixed; left: 24px; bottom: 24px; z-index: var(--mui-zIndex-snackbar); display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.toast { pointer-events: auto; display: flex; align-items: center; gap: 12px; min-width: 280px; max-width: 420px; box-sizing: border-box; background: var(--ink); color: var(--bg); padding: 8px 8px 8px 16px; border-radius: 10px; font: var(--f-body); animation: toast-in var(--dur-slow) var(--ease); box-shadow: var(--mui-shadows-8); }
.toast__icon--success { color: var(--mui-palette-success-light); }
.toast__icon--error { color: var(--mui-palette-error-light); }
.toast__icon--info { color: var(--mui-palette-info-light); }
.toast__msg { flex: 1; padding: 4px 0; }
.toast__close { width: 32px; height: 32px; border: 0; border-radius: 6px; background: none; color: inherit; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; opacity: 0.7; transition: opacity var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); }
.toast__close:hover { opacity: 1; background: rgba(var(--mui-palette-common-backgroundChannel) / 0.14); }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 899px) {
  .toasts { left: 16px; right: 16px; bottom: 80px; }
  .toast { min-width: 0; max-width: none; }
}


/* src/styles/overview.css */
/* Balance header */
.balance { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 20px 24px; align-items: stretch; flex-direction: row; }
.balance__main { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.balance__label { font: var(--f-small); color: var(--muted); margin-top: 8px; }
.balance__amount { font: var(--f-h1); font-weight: 500; letter-spacing: -0.03em; margin: 0; }
.balance__meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.balance__pending { font: var(--f-small); color: var(--muted); }
.balance__side { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; gap: 16px; }
.balance__actions { display: flex; gap: 8px; }
.balance__stats { display: grid; grid-template-columns: repeat(3, auto); margin: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--alt); }
.balance__stats > div { padding: 12px 20px; border-left: 1px solid var(--line); }
.balance__stats > div:first-child { border-left: 0; }
.balance__stats dt { font: var(--f-cap); color: var(--muted); }
.balance__stats dd { margin: 4px 0 0; font: var(--f-h3); }
@media (max-width: 899px) {
  .balance { grid-template-columns: minmax(0, 1fr); padding: 16px; }
  .balance__side { align-items: stretch; }
  .balance__actions .MuiButton-root { flex: 1; }
  .balance__amount { font-size: var(--mui-font-size-h2); }
  .balance__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .balance__stats > div { padding: 12px; }
}

/* KPI tiles */
.kpi { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 12px; padding: 16px 20px; height: 100%; }
.kpi__text { min-width: 0; }
.kpi__label { font: var(--f-small); color: var(--muted); margin: 0; }
.kpi__value { font: var(--f-h4); font-weight: 500; margin: 4px 0 8px; }
.kpi__foot { display: flex; align-items: center; gap: 8px; margin: 0; font: var(--f-cap); flex-wrap: wrap; }
.kpi__delta { display: inline-flex; align-items: center; gap: 2px; }
.kpi__delta--pos { color: var(--pos); }
.kpi__delta--neg { color: var(--neg); }
.kpi__delta--neutral { color: var(--ink); }
.kpi__ctx { color: var(--muted); font-weight: 400; }
.kpi__spark { flex-shrink: 0; }
.spark { display: block; overflow: visible; }
.spark--neutral { color: var(--muted); }
.spark--pos { color: var(--pos); }
.spark--neg { color: var(--neg); }
.spark__line { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.spark__dot { fill: currentColor; }
@media (max-width: 479px) {
  .kpi { align-items: center; }
}

/* Cash-flow chart */
.cf-legend { list-style: none; margin: 0 0 12px; padding: 0; display: flex; gap: 16px; flex-wrap: wrap; font: var(--f-cap); color: var(--muted); }
.cf-legend li { display: inline-flex; align-items: center; gap: 8px; }
.cf-key { display: inline-block; flex-shrink: 0; }
.cf-key--line { width: 16px; height: 2px; background: var(--ink); }
.cf-key--dash { width: 16px; height: 0; border-top: 2px dashed var(--ink); }
.cf-key--band { width: 16px; height: 10px; background: var(--accent-bg); border-radius: 2px; }
.cf-key--in { width: 8px; height: 8px; border-radius: 2px; background: var(--pos); }
.cf-key--out { width: 8px; height: 8px; border-radius: 2px; background: var(--ink); opacity: 0.7; }
.cf-wrap { position: relative; border-radius: 8px; outline-offset: 4px; }
.cf { display: block; overflow: visible; touch-action: pan-y; }
.cf-grid { stroke: var(--line); stroke-width: 1; shape-rendering: crispEdges; }
.cf-axis { fill: var(--muted); font-family: var(--mono); font-size: 11px; font-variant-numeric: tabular-nums; }
.cf-line { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.cf-line--fc { stroke-dasharray: 2 5; }
.cf-band { fill: var(--accent-bg); stroke: none; }
.cf-today { stroke: var(--line-2); stroke-dasharray: 3 3; }
.cf-tag { fill: var(--muted); font: var(--f-cap); }
.cf-zero { stroke: var(--line-2); shape-rendering: crispEdges; }
.cf-in { fill: var(--pos); }
.cf-out { fill: var(--ink); fill-opacity: 0.7; }
.cf-bars--fc .cf-in, .cf-bars--fc .cf-out { fill-opacity: 0.35; }
.cf-cross { stroke: var(--muted); stroke-width: 1; shape-rendering: crispEdges; }
.cf-dot { fill: var(--paper); stroke: var(--ink); stroke-width: 2; }
.cf-hit { fill: transparent; cursor: crosshair; }
.cf-tip { position: absolute; top: 8px; transform: translateX(12px); min-width: 200px; box-sizing: border-box; background: var(--paper); border: 1px solid var(--line-2); border-radius: 10px; padding: 12px; pointer-events: none; box-shadow: var(--mui-shadows-8); z-index: 2; }
.cf-tip--flip { transform: translateX(calc(-100% - 12px)); }
.cf-tip__date { display: flex; align-items: center; justify-content: space-between; gap: 8px; font: var(--f-ui); margin-bottom: 8px; }
.cf-tip__rows { margin: 0; display: grid; gap: 4px; }
.cf-tip__rows > div { display: flex; justify-content: space-between; gap: 16px; font: var(--f-small); }
.cf-tip__rows dt { color: var(--muted); }
.cf-tip__rows dd { margin: 0; }

/* Lists and tiles */
.datetile { width: 40px; height: 40px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; background: var(--alt); flex-shrink: 0; line-height: 1; }
.datetile__m { font: var(--f-cap); font-size: var(--mui-font-size-overline); color: var(--muted); text-transform: uppercase; letter-spacing: 0.04em; }
.datetile__d { font: var(--f-ui); margin-top: 2px; }
.group-label { font: var(--f-cap); color: var(--muted); padding: 12px 20px 8px; margin: 0; }
.rows + .group-label { border-top: 1px solid var(--line); margin-top: 8px; }
.row--static { cursor: default; }
.row--static:hover, .row--static:active { background: none; }
.row__check { width: 20px; display: inline-flex; color: transparent; flex-shrink: 0; }
.row__check.is-on { color: var(--accent); }
.panel__body--flush { padding-bottom: 8px; }
.col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.col > .panel:last-child { flex: 1; }
.cardsum { display: flex; flex-direction: column; gap: 16px; }
.cardsum__art { width: 100%; height: auto; display: block; }
.cardsum__row { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.skel-row { display: flex; align-items: center; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--line); }
.skel-rows .skel-row:first-child { border-top: 0; }
.skel-row__main { flex: 1; min-width: 0; }


/* src/styles/table.css */
.txf { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.txf__top { display: flex; gap: 8px; align-items: center; }
.txf__search { flex: 1; min-width: 0; }
.txf__fields { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.txf__fields .MuiTextField-root { min-width: 148px; }
@media (max-width: 899px) {
  .txf { padding: 12px 16px; }
  .txf__fields .MuiTextField-root { flex: 1 1 140px; }
}

.selbar { display: flex; align-items: center; gap: 12px; padding: 8px 20px; background: var(--accent-bg); border-bottom: 1px solid var(--line); min-height: 48px; box-sizing: border-box; }
.selbar__count { font: var(--f-ui); }
.selbar__spacer { flex: 1; }

.th-btn--r { flex-direction: row-reverse; }
.col-merchant { max-width: 280px; }
.cell-merchant { min-width: 0; }
.cell-merchant__text { min-width: 0; display: block; }

.pager { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 20px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.pager__totals { margin: 0; }
.pager__controls { display: flex; align-items: center; gap: 8px; }

/* Transaction drawer */
.txdrawer { width: 440px; max-width: 100vw; box-sizing: border-box; }
@media (max-width: 899px) {
  .txdrawer { width: 100%; max-height: 92vh; border-radius: 16px 16px 0 0; }
}
.txd { display: flex; flex-direction: column; min-height: 100%; }
.txd__head { padding: 8px 24px 20px; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.txd__bar { display: flex; justify-content: space-between; align-items: center; width: 100%; margin: 0 -8px; padding-right: 16px; box-sizing: border-box; }
.txd__id { display: flex; gap: 12px; align-items: center; }
.txd__title { font: var(--f-h4); letter-spacing: -0.01em; }
.txd__amount { font: var(--f-h2); font-weight: 500; letter-spacing: -0.02em; margin: 0; }
.txd__body { padding: 20px 24px 32px; display: flex; flex-direction: column; gap: 20px; }

.receipt-empty { border: 1px dashed var(--line-2); border-radius: 10px; padding: 16px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; color: var(--muted); }
.receipt-empty__title { font: var(--f-ui); color: var(--ink); margin: 0; }
.receipt-wrap { display: flex; flex-direction: column; gap: 8px; }
.receipt { background: var(--alt); border: 1px solid var(--line); border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 8px; font-family: var(--mono); font-size: var(--mui-font-size-body2); max-width: 320px; box-sizing: border-box; width: 100%; }
.receipt__merchant { font-weight: 500; text-transform: uppercase; letter-spacing: 0.04em; margin: 0; }
.receipt__line { display: flex; justify-content: space-between; gap: 16px; margin: 0; }
.receipt__rule { border: 0; border-top: 1px dashed var(--line-2); margin: 4px 0; width: 100%; }
.receipt__total { font-weight: 500; }
.receipt__foot { margin: 0; color: var(--muted); font-size: var(--mui-font-size-caption); }
.receipt-actions { display: flex; justify-content: space-between; align-items: center; }


/* src/styles/cards.css */
.cardtiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(236px, 1fr)); gap: 16px; }
.cardtile { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-card); padding: 12px; display: flex; flex-direction: column; gap: 12px; text-align: left; cursor: pointer; font: inherit; color: inherit; transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease); min-width: 0; }
.cardtile:hover { border-color: var(--line-2); }
.cardtile:active { background: var(--press); }
.cardtile.is-selected { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.cardtile__art { width: 100%; height: auto; display: block; }
.cardtile__label { display: block; }
.cardtile__name { font: var(--f-ui); display: block; }
.cardtile__sub { font: var(--f-cap); color: var(--muted); display: block; font-weight: 400; }

/* Card artwork */
.cardart { display: block; color: var(--mui-palette-common-white); }
.cardart--ink .cardart__bg { fill: var(--ds-decor-1); }
.cardart--moss .cardart__bg { fill: var(--ds-decor-2); }
.cardart--paper { color: var(--ink); }
.cardart--paper .cardart__bg { fill: var(--paper); stroke: var(--line-2); stroke-width: 1; }
.cardart__ring { fill: none; stroke: currentColor; stroke-opacity: 0.1; }
.cardart__brand { fill: currentColor; font-family: var(--mui-font-family); font-weight: 600; font-size: 18px; letter-spacing: -0.01em; }
.cardart__kind { fill: currentColor; fill-opacity: 0.7; font-family: var(--mono); font-size: 9px; letter-spacing: 0.08em; }
.cardart__chip { fill: currentColor; fill-opacity: 0.2; stroke: currentColor; stroke-opacity: 0.45; }
.cardart__chipline { stroke: currentColor; stroke-opacity: 0.35; fill: none; }
.cardart__pan { fill: currentColor; font-family: var(--mono); font-size: 17px; letter-spacing: 0.06em; font-variant-numeric: tabular-nums; }
.cardart__meta { fill: currentColor; fill-opacity: 0.8; font-family: var(--mui-font-family); font-size: 11px; letter-spacing: 0.08em; }
.cardart__meta--num { font-family: var(--mono); }
.cardart__mark { fill: currentColor; }
.cardart__veil { fill: var(--paper); fill-opacity: 0.62; }
.cardart__tag { fill: var(--paper); stroke: var(--line-2); }
.cardart__tagtext { fill: var(--ink); font-family: var(--mono); font-size: 13px; letter-spacing: 0.1em; }

/* Controls */
.switchrow { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.stack > .switchrow:first-child { border-top: 0; padding-top: 0; }
.switchrow__title { font: var(--f-ui); margin: 0; }
.switchrow__sub { font: var(--f-small); color: var(--muted); margin: 2px 0 0; }
.limit__row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.limit__label { font: var(--f-ui); }
.limit__value { font: var(--f-h4); font-weight: 500; }
.limit__scale { display: flex; justify-content: space-between; margin-top: -4px; }
.limit__error { margin: 8px 0 0; color: var(--neg); font: var(--f-small); }
.dlg { padding-top: 8px; }


/* src/styles/invoices.css */
.invsum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex-direction: row; }
.invsum__cell { display: flex; flex-direction: column; gap: 4px; padding: 16px 20px; border: 0; border-left: 1px solid var(--line); background: none; text-align: left; font: inherit; color: inherit; min-width: 0; }
.invsum__cell:first-child { border-left: 0; }
.invsum__cell--btn { cursor: pointer; transition: background var(--dur-fast) var(--ease); }
.invsum__cell--btn:hover { background: var(--hover); }
.invsum__cell--btn:active { background: var(--press); }
.invsum__cell--btn:first-child { border-radius: var(--r-card) 0 0 var(--r-card); }
.invsum__cell--btn:last-child { border-radius: 0 var(--r-card) var(--r-card) 0; }
.invsum__label { font: var(--f-small); color: var(--muted); }
.invsum__value { font: var(--f-h4); font-weight: 500; }
.invsum__sub { font: var(--f-cap); color: var(--muted); font-weight: 400; }
@media (max-width: 899px) {
  .invsum { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .invsum__cell:nth-child(3) { border-left: 0; }
  .invsum__cell:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .invsum__cell--btn { border-radius: 0; }
}

.txf--row { flex-direction: row; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.txf__search--sm { width: 320px; max-width: 100%; flex: 0 1 320px; }
@media (max-width: 899px) { .txf__search--sm { flex: 1 1 100%; width: 100%; } }
.tbl .actions { width: 56px; text-align: right; padding-left: 0; }

/* Composer */
.cmp__title { display: inline-flex; align-items: center; gap: 12px; }
.cmp { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; padding-top: 8px; }
.cmp__side { display: flex; flex-direction: column; gap: 16px; align-self: start; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--alt); position: sticky; top: 0; }
@media (max-width: 899px) {
  .cmp { grid-template-columns: minmax(0, 1fr); }
  .cmp__side { position: static; order: -1; }
}
.li { display: grid; grid-template-columns: minmax(0, 1fr) 72px 124px 104px 40px; gap: 8px; align-items: start; }
.li__total { height: 40px; display: flex; align-items: center; justify-content: flex-end; font: var(--f-body); }
.li__remove { margin-top: 0; }
@media (max-width: 599px) {
  .li { grid-template-columns: 72px minmax(0, 1fr) 40px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
  .li__desc { grid-column: 1 / -1; }
  .li__total { grid-column: 1 / 3; justify-content: flex-start; }
  .li__remove { grid-column: 3; grid-row: 2 / span 2; }
}
.totals { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.totals > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; font: var(--f-body); }
.totals dt { color: var(--muted); }
.totals dd { margin: 0; }
.totals__grand { padding-top: 12px; border-top: 1px solid var(--line-2); }
.totals__grand dt { color: var(--ink); font: var(--f-ui); }
.totals__grand dd { font: var(--f-h4); font-weight: 500; }


/* src/styles/move.css */
.move { overflow: visible; }
.move__body { padding: 24px; max-width: 640px; }
@media (max-width: 899px) { .move__body { padding: 16px; } }
.step-actions { display: flex; justify-content: space-between; gap: 8px; padding-top: 8px; }
.step-actions--center { justify-content: center; flex-wrap: wrap; }
.step-actions:only-child, .step-actions > :only-child { margin-left: auto; }

/* Stepper */
.stepper { padding: 16px 24px; border-bottom: 1px solid var(--line); }
.stepper__compact { display: none; font: var(--f-ui); margin: 0; }
.stepper__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; align-items: center; }
.stepper__item { display: flex; align-items: center; gap: 8px; color: var(--muted); font: var(--f-ui); }
.stepper__item + .stepper__item::before { content: ""; width: 32px; height: 1px; background: var(--line-2); margin-right: 8px; }
.stepper__dot { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--line-2); display: inline-flex; align-items: center; justify-content: center; font: var(--f-cap); box-sizing: border-box; flex-shrink: 0; }
.stepper__item--current { color: var(--ink); }
.stepper__item--current .stepper__dot { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.stepper__item--done { color: var(--ink); }
.stepper__item--done .stepper__dot { background: var(--accent-bg); border-color: transparent; color: var(--accent); }
@media (max-width: 599px) {
  .stepper { padding: 12px 16px; }
  .stepper__compact { display: block; }
  .stepper__list { display: none; }
}

/* Payee and option cards */
.payees, .opts { display: flex; flex-direction: column; gap: 8px; }
.opts { flex-direction: row; }
.payee, .opt { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); text-align: left; font: inherit; color: inherit; cursor: pointer; min-height: 56px; box-sizing: border-box; transition: border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease); }
.payee:hover, .opt:hover { border-color: var(--line-2); background: var(--hover); }
.payee:active, .opt:active { background: var(--press); }
.payee.is-selected, .opt.is-selected { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); background: var(--accent-bg); }
.payee__text { flex: 1; min-width: 0; display: block; }
.payee__name { font: var(--f-ui); display: block; }
.payee__sub { font: var(--f-cap); color: var(--muted); font-weight: 400; display: block; font-family: var(--mono); }
.payee__check { color: transparent; display: inline-flex; }
.payee.is-selected .payee__check { color: var(--accent); }
.opt { flex: 1; flex-direction: column; align-items: flex-start; gap: 2px; }
.opt__label { font: var(--f-ui); }
.opt__sub { font: var(--f-small); color: var(--muted); }
@media (max-width: 599px) { .opts { flex-direction: column; } }

.amount-input input { font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: var(--mui-font-size-h4); padding-top: 12px; padding-bottom: 12px; }
.code-input { max-width: 280px; }

/* FX preview */
.fx { border: 1px solid var(--line); border-radius: 10px; background: var(--alt); padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.fx__head { display: flex; align-items: center; gap: 8px; font: var(--f-ui); }
.fx__rows { margin: 0; display: flex; flex-direction: column; gap: 8px; }
.fx__rows > div { display: flex; justify-content: space-between; gap: 16px; font: var(--f-body); }
.fx__rows dt { color: var(--muted); }
.fx__rows dd { margin: 0; }
.fx__total { padding-top: 12px; border-top: 1px solid var(--line-2); }
.fx__total dt { color: var(--ink) !important; font: var(--f-ui); }
.fx__total dd { font: var(--f-h4); font-weight: 500; }
.fx__note { margin: 0; }

/* Review / summary lists */
.kv--review { grid-template-columns: 140px minmax(0, 1fr); padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--alt); }
.kv--summary { grid-template-columns: 88px minmax(0, 1fr); }
.kv__sub { display: block; font: var(--f-small); color: var(--muted); }
.kv__strong { font: var(--f-h3); }
.summary { position: sticky; top: calc(var(--top-h) + 16px); }
.summary__total { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line-2); font: var(--f-ui); }
.summary__amount { font: var(--f-h4); font-weight: 500; }
.summary .t-small { margin-top: 8px; }

/* Success */
.success { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 24px 0; margin: 0 auto; max-width: 480px; }
.success__mark { width: 56px; height: 56px; border-radius: 50%; background: var(--pos-bg); color: var(--pos); display: inline-flex; align-items: center; justify-content: center; }
.success__text { margin: 0; }
.success__rows { width: 100%; text-align: left; margin-top: 8px; }


/* src/styles/team.css */
.role-select { min-width: 132px; }
.limit-input { width: 148px; }
.limit-input input { font-family: var(--mono); font-variant-numeric: tabular-nums; }

.matrix { width: 100%; border-collapse: collapse; }
.matrix th, .matrix td { padding: 0; height: 40px; text-align: center; border-bottom: 1px solid var(--line); font: var(--f-cap); color: var(--muted); }
.matrix thead th { height: 32px; }
.matrix tbody th { text-align: left; font: var(--f-body); color: var(--ink); padding-right: 8px; }
.matrix tbody tr:last-child th, .matrix tbody tr:last-child td { border-bottom: 0; }
.matrix__yes { color: var(--pos); display: inline-flex; }
.matrix__no { color: var(--faint); display: inline-flex; }

.prefs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.prefs .switchrow:first-child { border-top: 0; padding-top: 0; }
.sessions__title { margin-bottom: 8px; }
.sessions .row { padding-left: 0; padding-right: 0; }
.sessions { border-top: 1px solid var(--line); }