/* ==================================================================== */
/* UI styles                                                            */
/*                                                                      */
/* A style owns the interface's character: type voice, density,         */
/* geometry, elevation, and how the shell is composed. It never picks   */
/* hues; it maps theme roles (--t-*) onto semantic tokens.              */
/*                                                                      */
/* The base block re-declares every semantic token on each theming      */
/* scope (document or preview) so nested scopes recompute from their    */
/* own theme roles. It doubles as the Minimal style.                    */
/* ==================================================================== */

:root,
[data-theme],
[data-style],
[data-mode] {
    /* ---- semantic color roles ---------------------------------------- */
    --background: var(--t-canvas);
    --foreground: var(--t-text);
    --foreground-secondary: var(--t-text-2);
    --muted-foreground: var(--t-text-3);

    --surface: var(--t-surface);
    --surface-secondary: color-mix(in oklab, var(--t-text) 4%, transparent);
    --surface-tertiary: var(--t-canvas-2);
    --card: var(--ui-card-bg);
    --card-foreground: var(--t-text);
    --popover: var(--t-raised);
    --popover-foreground: var(--t-text);

    --primary: var(--t-accent);
    --primary-hover: var(--t-accent-hover);
    --primary-active: var(--t-accent-active);
    --primary-foreground: var(--t-accent-fg);
    --primary-subtle: color-mix(
        in oklab,
        var(--t-accent) var(--m-tint),
        transparent
    );

    --secondary: color-mix(in oklab, var(--t-text) 6%, transparent);
    --secondary-hover: color-mix(in oklab, var(--t-text) 9%, transparent);
    --secondary-foreground: var(--t-text);
    --muted: color-mix(in oklab, var(--t-text) 6%, transparent);
    --accent: color-mix(in oklab, var(--t-text) 5%, transparent);
    --accent-foreground: var(--t-text);

    --border: var(--t-line);
    --border-strong: var(--t-line-2);
    --input: var(--t-line-2);
    --input-focus: var(--t-accent);
    --ring: var(--t-accent);

    --success-background: color-mix(
        in oklab,
        var(--success) var(--m-tint),
        transparent
    );
    --warning-background: color-mix(
        in oklab,
        var(--warning) var(--m-tint),
        transparent
    );
    --danger-background: color-mix(
        in oklab,
        var(--danger) var(--m-tint),
        transparent
    );
    --info-background: color-mix(
        in oklab,
        var(--info) var(--m-tint),
        transparent
    );
    --destructive: var(--danger);
    --destructive-foreground: var(--on-danger);

    --chart-1: var(--t-accent);
    --chart-2: var(--t-chart-2);
    --chart-3: var(--danger);
    --chart-4: var(--warning);
    --chart-5: var(--t-text-3);

    --overlay: var(--m-scrim);

    /* ---- type ---------------------------------------------------------- */
    --ui-font-sans:
        var(--font-inter, 'Inter'), 'Inter', ui-sans-serif, system-ui,
        -apple-system, 'Segoe UI', sans-serif;
    --ui-font-display: var(--ui-font-sans);
    --ui-font-features: 'cv11', 'ss01', 'ss03';
    --ui-text-sm: 0.8125rem;
    --ui-text-sm-lh: 1.25rem;
    --ui-title-size: 1.375rem;
    --ui-title-lh: 1.25;
    --ui-title-weight: 600;
    --ui-title-tracking: -0.02em;
    --ui-heading-tracking: -0.011em;
    --ui-figure-weight: 600;
    --ui-figure-tracking: -0.025em;
    --ui-overline-size: 0.75rem;
    --ui-overline-weight: 500;
    --ui-overline-tracking: 0em;
    --ui-overline-transform: none;
    --ui-overline-caps: normal;

    /* ---- geometry ------------------------------------------------------ */
    --ui-radius-xs: 4px;
    --ui-radius-sm: 6px;
    --ui-radius-md: 7px;
    --ui-radius-lg: 10px;
    --ui-radius-xl: 12px;
    --ui-radius-2xl: 16px;
    --ui-radius-control: 6px;
    --ui-radius-item: 5px;
    --ui-radius-menu: 9px;
    --ui-radius-card: 10px;
    --ui-radius-dialog: 14px;
    --ui-radius-badge: 999px;

    /* ---- density ------------------------------------------------------- */
    --ui-control-h-sm: 1.75rem;
    --ui-control-h: 2rem;
    --ui-control-h-lg: 2.25rem;
    --ui-page-max: 1400px;
    --ui-page-pad: 1.5rem;
    --ui-page-pad-xl: 2rem;
    --ui-page-pad-y: 1.5rem;
    --ui-section-gap: 1.5rem;
    --ui-card-pad: 1.25rem;
    --ui-card-gap: 1rem;
    --ui-row-h: 2.75rem;
    --ui-header-h: 3.25rem;
    --ui-nav-h: 2rem;
    --ui-page-rule: 0px;
    --ui-page-rule-gap: 0px;

    /* ---- surfaces & elevation ------------------------------------------ */
    --ui-canvas-image: none;
    --ui-card-bg: var(--t-surface);
    --ui-card-solid: var(--ui-card-bg);
    --ui-card-border: var(--t-line);
    --ui-card-shadow: 0 1px 2px rgb(var(--t-shadow) / calc(0.035 * var(--m-sa)));
    --ui-popover-border: var(--t-line);
    --ui-popover-shadow:
        0 1px 2px rgb(var(--t-shadow) / calc(0.04 * var(--m-sa))),
        0 12px 32px -8px rgb(var(--t-shadow) / calc(0.14 * var(--m-sa)));
    --ui-dialog-shadow:
        0 1px 3px rgb(var(--t-shadow) / calc(0.06 * var(--m-sa))),
        0 24px 64px -16px rgb(var(--t-shadow) / calc(0.26 * var(--m-sa)));
    --ui-control-bg: var(--t-surface);
    --ui-control-bg-hover: color-mix(
        in oklab,
        var(--t-text) 4%,
        var(--ui-control-bg)
    );
    --ui-control-bg-active: color-mix(
        in oklab,
        var(--t-text) 7%,
        var(--ui-control-bg)
    );
    --ui-control-border: var(--t-line-2);
    --ui-control-shadow: 0 1px 1px
        rgb(var(--t-shadow) / calc(0.04 * var(--m-sa)));
    --ui-primary-shadow:
        inset 0 1px 0 rgb(255 255 255 / 0.1),
        0 1px 1px rgb(var(--t-shadow) / calc(0.1 * var(--m-sa)));
    --ui-primary-sheen: none;
    --ui-input-bg: var(--t-surface);
    --ui-input-border: var(--t-line-2);
    --ui-input-shadow: 0 1px 1px rgb(var(--t-shadow) / calc(0.03 * var(--m-sa)));
    --ui-table-head-bg: transparent;
    --ui-skeleton: color-mix(in oklab, var(--t-text) 7%, transparent);
    --ui-switch-off: color-mix(in oklab, var(--t-text) 20%, transparent);
    --ui-sheet-inset: 0px;
    --ui-sheet-radius: 0px;

    /* ---- shell --------------------------------------------------------- */
    --ui-header-bg: color-mix(in oklab, var(--t-canvas) 84%, transparent);
    --ui-header-border: var(--t-line);
    --ui-header-shadow: none;
    --ui-main-bg: transparent;
    --ui-main-margin: 0px;
    --ui-main-radius: 0px;
    --ui-main-shadow: none;

    --sidebar: var(--t-canvas);
    --sidebar-foreground: var(--t-text-2);
    --sidebar-muted: var(--t-text-3);
    --sidebar-hover: color-mix(in oklab, var(--t-text) 4.5%, transparent);
    --sidebar-accent: color-mix(in oklab, var(--t-text) 6.5%, transparent);
    --sidebar-accent-foreground: var(--t-text);
    --sidebar-active-shadow: none;
    --sidebar-icon: var(--t-text-3);
    --sidebar-icon-active: var(--t-accent);
    --sidebar-border: var(--t-line);
    --sidebar-primary: var(--t-accent);
    --sidebar-primary-foreground: var(--t-accent-fg);
    --sidebar-ring: var(--t-accent);

    --ui-island-scheme: var(--m-scheme);
    --ui-island-fg: var(--t-text);
    --ui-island-fg-2: var(--t-text-2);
    --ui-island-muted: var(--t-text-3);
    --ui-island-border: var(--t-line);
    --ui-island-accent: color-mix(in oklab, var(--t-text) 5%, transparent);
    --ui-island-primary: var(--t-accent);
    --ui-island-primary-fg: var(--t-accent-fg);

    /* ---- motion -------------------------------------------------------- */
    --ui-ease: cubic-bezier(0.2, 0, 0, 1);
}

/* -------------------------------------------------------------------- */
/* Executive — a deep command rail, grey working canvas, white panels,  */
/* rectangular geometry and an enterprise grotesque.                    */
/* -------------------------------------------------------------------- */
[data-style='executive'] {
    --background: var(--t-canvas-2);

    --ui-font-sans:
        var(--font-ibm-plex-sans, 'IBM Plex Sans'), 'IBM Plex Sans',
        ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ui-font-display: var(--ui-font-sans);
    --ui-font-features: normal;
    --ui-text-sm: 0.875rem;
    --ui-text-sm-lh: 1.25rem;
    --ui-title-size: 1.5rem;
    --ui-title-tracking: -0.012em;
    --ui-heading-tracking: -0.004em;
    --ui-figure-tracking: -0.015em;
    --ui-overline-size: 0.6875rem;
    --ui-overline-weight: 600;
    --ui-overline-tracking: 0.06em;
    --ui-overline-transform: uppercase;

    --ui-radius-xs: 3px;
    --ui-radius-sm: 5px;
    --ui-radius-md: 6px;
    --ui-radius-lg: 8px;
    --ui-radius-xl: 10px;
    --ui-radius-2xl: 12px;
    --ui-radius-control: 5px;
    --ui-radius-item: 4px;
    --ui-radius-menu: 6px;
    --ui-radius-card: 8px;
    --ui-radius-dialog: 10px;
    --ui-radius-badge: 4px;

    --ui-control-h-sm: 2rem;
    --ui-control-h: 2.25rem;
    --ui-control-h-lg: 2.5rem;
    --ui-page-pad: 1.75rem;
    --ui-page-pad-xl: 2.25rem;
    --ui-page-pad-y: 1.75rem;
    --ui-header-h: 3.75rem;
    --ui-nav-h: 2.25rem;

    --ui-card-shadow:
        0 1px 2px rgb(var(--t-shadow) / calc(0.05 * var(--m-sa))),
        0 1px 3px rgb(var(--t-shadow) / calc(0.03 * var(--m-sa)));
    --ui-table-head-bg: var(--t-canvas-2);

    --ui-header-bg: var(--t-surface);
    --ui-header-shadow: 0 1px 2px
        rgb(var(--t-shadow) / calc(0.04 * var(--m-sa)));

    --sidebar: var(--t-rail);
    --sidebar-foreground: var(--t-rail-fg-2);
    --sidebar-muted: var(--t-rail-fg-2);
    --sidebar-hover: color-mix(in oklab, var(--t-rail-fg) 7%, transparent);
    --sidebar-accent: var(--t-rail-2);
    --sidebar-accent-foreground: var(--t-rail-fg);
    --sidebar-icon: var(--t-rail-fg-2);
    --sidebar-icon-active: var(--t-rail-accent);
    --sidebar-border: var(--t-rail-line);
    --sidebar-primary: var(--t-rail-accent);
    --sidebar-primary-foreground: var(--t-rail-accent-fg);
    --sidebar-ring: var(--t-rail-accent);

    --ui-island-scheme: dark;
    --ui-island-fg: var(--t-rail-fg);
    --ui-island-fg-2: var(--t-rail-fg-2);
    --ui-island-muted: var(--t-rail-fg-2);
    --ui-island-border: var(--t-rail-line);
    --ui-island-accent: color-mix(in oklab, var(--t-rail-fg) 7%, transparent);
    --ui-island-primary: var(--t-rail-accent);
    --ui-island-primary-fg: var(--t-rail-accent-fg);
}

/* -------------------------------------------------------------------- */
/* Sidebar island. A style can paint the sidebar as its own surface     */
/* (Executive's rail); generic tokens are re-scoped inside it. Values   */
/* come from inherited --ui-island-* so they resolve from the nearest   */
/* theming scope, never from an outer document style.                   */
/* -------------------------------------------------------------------- */
[data-sidebar='sidebar'] {
    color-scheme: var(--ui-island-scheme);
    --foreground: var(--ui-island-fg);
    --foreground-secondary: var(--ui-island-fg-2);
    --muted-foreground: var(--ui-island-muted);
    --border: var(--ui-island-border);
    --accent: var(--ui-island-accent);
    --accent-foreground: var(--ui-island-fg);
    --primary: var(--ui-island-primary);
    --primary-foreground: var(--ui-island-primary-fg);
    --ring: var(--ui-island-primary);
}

/* -------------------------------------------------------------------- */
/* Glass — translucent shell and frosted panels over a quiet ambient    */
/* field. Blur is reserved for surfaces that sit above content.         */
/* -------------------------------------------------------------------- */
[data-style='glass'] {
    --ui-font-sans:
        var(--font-geist, 'Geist'), 'Geist', ui-sans-serif, system-ui,
        -apple-system, 'Segoe UI', sans-serif;
    --ui-font-display: var(--ui-font-sans);
    --ui-font-features: normal;
    --ui-text-sm: 0.875rem;
    --ui-text-sm-lh: 1.25rem;
    --ui-title-size: 1.5rem;
    --ui-title-tracking: -0.028em;
    --ui-heading-tracking: -0.015em;
    --ui-figure-tracking: -0.03em;

    --ui-radius-xs: 5px;
    --ui-radius-sm: 8px;
    --ui-radius-md: 10px;
    --ui-radius-lg: 14px;
    --ui-radius-xl: 18px;
    --ui-radius-2xl: 22px;
    --ui-radius-control: 9px;
    --ui-radius-item: 7px;
    --ui-radius-menu: 12px;
    --ui-radius-card: 14px;
    --ui-radius-dialog: 18px;

    --ui-control-h-sm: 2rem;
    --ui-control-h: 2.25rem;
    --ui-control-h-lg: 2.5rem;
    --ui-page-pad: 1.75rem;
    --ui-page-pad-xl: 2.25rem;
    --ui-page-pad-y: 1.75rem;
    --ui-header-h: 3.75rem;
    --ui-nav-h: 2.125rem;

    --ui-canvas-image:
        radial-gradient(60% 70% at 0% 0%, var(--t-glow-a), transparent 72%),
        radial-gradient(50% 55% at 100% 0%, var(--t-glow-b), transparent 72%),
        radial-gradient(55% 60% at 70% 100%, var(--t-glow-a), transparent 74%),
        radial-gradient(40% 45% at 25% 85%, var(--t-glow-b), transparent 70%);
    --ui-card-bg: color-mix(in oklab, var(--t-surface) 66%, transparent);
    --ui-card-solid: color-mix(in oklab, var(--t-surface) 66%, var(--t-canvas));
    --ui-card-border: var(--m-edge);
    --ui-card-shadow:
        inset 0 1px 0 var(--m-highlight),
        0 1px 2px rgb(var(--t-shadow) / calc(0.04 * var(--m-sa))),
        0 12px 32px -14px rgb(var(--t-shadow) / calc(0.2 * var(--m-sa)));
    --popover: color-mix(in oklab, var(--t-raised) 80%, transparent);
    --ui-popover-border: var(--m-edge);
    --ui-popover-shadow:
        inset 0 1px 0 var(--m-highlight),
        0 18px 44px -14px rgb(var(--t-shadow) / calc(0.3 * var(--m-sa)));
    --ui-control-bg: color-mix(in oklab, var(--t-surface) 62%, transparent);
    --ui-control-border: color-mix(in oklab, var(--t-line-2) 85%, transparent);
    --ui-primary-sheen: linear-gradient(
        to bottom,
        rgb(255 255 255 / 0.18),
        rgb(255 255 255 / 0) 65%
    );
    --ui-primary-shadow:
        inset 0 1px 0 rgb(255 255 255 / 0.22),
        0 1px 2px rgb(var(--t-shadow) / calc(0.1 * var(--m-sa))),
        0 6px 16px -6px color-mix(in oklab, var(--t-accent) 55%, transparent);
    --ui-input-bg: color-mix(in oklab, var(--t-surface) 58%, transparent);
    --ui-input-border: color-mix(in oklab, var(--t-line-2) 90%, transparent);
    --ui-table-head-bg: color-mix(in oklab, var(--t-text) 3%, transparent);
    --ui-sheet-inset: 0.5rem;
    --ui-sheet-radius: var(--ui-radius-dialog);

    --ui-header-bg: color-mix(in oklab, var(--t-surface) 52%, transparent);
    --ui-header-border: var(--m-edge);

    --sidebar: color-mix(in oklab, var(--t-surface) 44%, transparent);
    --sidebar-border: var(--m-edge);
    --sidebar-accent: color-mix(in oklab, var(--t-surface) 70%, transparent);
    --sidebar-active-shadow:
        inset 0 1px 0 var(--m-highlight),
        0 1px 2px rgb(var(--t-shadow) / calc(0.06 * var(--m-sa)));
}

/* Ancestor-matched on purpose: inside a non-glass preview these surfaces
   are opaque, so a stray blur is invisible. */
[data-style='glass'] :is([data-sidebar='sidebar'], [data-slot='app-header']) {
    backdrop-filter: blur(22px) saturate(1.5);
}

[data-style='glass']
    :is(
        [data-slot='card'],
        .panel,
        .floating,
        [data-slot='dropdown-menu-content'],
        [data-slot='dropdown-menu-sub-content'],
        [data-slot='select-content'],
        [data-slot='popover-content'],
        [data-slot='dialog-content'],
        [data-slot='sheet-content'],
        [data-sonner-toast]
    ) {
    backdrop-filter: blur(18px) saturate(1.4);
}

/* -------------------------------------------------------------------- */
/* Soft — the workspace is a raised sheet on a tinted ground; panels   */
/* are gentle tinted wells, controls are generous and rounded.          */
/* -------------------------------------------------------------------- */
[data-style='soft'] {
    --background: var(--t-canvas-2);

    --ui-font-sans:
        var(--font-figtree, 'Figtree'), 'Figtree', ui-sans-serif, system-ui,
        -apple-system, 'Segoe UI', sans-serif;
    --ui-font-display: var(--ui-font-sans);
    --ui-font-features: normal;
    --ui-text-sm: 0.875rem;
    --ui-text-sm-lh: 1.375rem;
    --ui-title-size: 1.625rem;
    --ui-title-tracking: -0.022em;
    --ui-heading-tracking: -0.01em;
    --ui-figure-tracking: -0.02em;

    --ui-radius-xs: 6px;
    --ui-radius-sm: 10px;
    --ui-radius-md: 12px;
    --ui-radius-lg: 16px;
    --ui-radius-xl: 20px;
    --ui-radius-2xl: 24px;
    --ui-radius-control: 10px;
    --ui-radius-item: 9px;
    --ui-radius-menu: 14px;
    --ui-radius-card: 16px;
    --ui-radius-dialog: 22px;

    --ui-control-h-sm: 2.125rem;
    --ui-control-h: 2.375rem;
    --ui-control-h-lg: 2.75rem;
    --ui-page-pad: 2rem;
    --ui-page-pad-xl: 2.5rem;
    --ui-page-pad-y: 2rem;
    --ui-section-gap: 1.75rem;
    --ui-card-pad: 1.5rem;
    --ui-card-gap: 1.25rem;
    --ui-row-h: 3rem;
    --ui-header-h: 3.75rem;
    --ui-nav-h: 2.375rem;

    --ui-card-bg: color-mix(in oklab, var(--t-text) 3.2%, var(--t-surface));
    --ui-card-border: transparent;
    --ui-card-shadow: none;
    --ui-popover-border: color-mix(in oklab, var(--t-line) 70%, transparent);
    --ui-popover-shadow:
        0 2px 4px rgb(var(--t-shadow) / calc(0.04 * var(--m-sa))),
        0 18px 44px -10px rgb(var(--t-shadow) / calc(0.18 * var(--m-sa)));
    --ui-dialog-shadow:
        0 2px 6px rgb(var(--t-shadow) / calc(0.05 * var(--m-sa))),
        0 32px 80px -20px rgb(var(--t-shadow) / calc(0.32 * var(--m-sa)));
    --ui-control-shadow: 0 1px 2px
        rgb(var(--t-shadow) / calc(0.05 * var(--m-sa)));
    --ui-primary-shadow:
        0 1px 2px color-mix(in oklab, var(--t-accent) 30%, transparent),
        0 6px 14px -6px color-mix(in oklab, var(--t-accent) 60%, transparent);
    --ui-input-shadow: 0 1px 2px rgb(var(--t-shadow) / calc(0.04 * var(--m-sa)));
    --ui-sheet-inset: 0.5rem;
    --ui-sheet-radius: var(--ui-radius-dialog);

    --ui-header-bg: var(--t-surface);
    --ui-header-border: color-mix(in oklab, var(--t-line) 70%, transparent);
    --ui-main-bg: var(--t-surface);
    --ui-main-margin: 0.5rem;
    --ui-main-radius: 1rem;
    --ui-main-shadow:
        0 0 0 1px rgb(var(--t-shadow) / calc(0.05 * var(--m-sa))),
        0 2px 8px -2px rgb(var(--t-shadow) / calc(0.08 * var(--m-sa)));

    --sidebar: var(--t-canvas-2);
    --sidebar-border: transparent;
    --sidebar-hover: color-mix(in oklab, var(--t-text) 5%, transparent);
    --sidebar-accent: var(--t-surface);
    --sidebar-active-shadow:
        0 1px 2px rgb(var(--t-shadow) / calc(0.06 * var(--m-sa))),
        0 0 0 1px rgb(var(--t-shadow) / calc(0.04 * var(--m-sa)));
}

/* -------------------------------------------------------------------- */
/* Editorial — serif display over a paper ground, hairline rules,       */
/* sharp geometry and generous measure.                                 */
/* -------------------------------------------------------------------- */
[data-style='editorial'] {
    --background: color-mix(in oklab, var(--t-canvas) 95%, #d9c4a2);

    --ui-font-sans:
        var(--font-schibsted-grotesk, 'Schibsted Grotesk'), 'Schibsted Grotesk',
        ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ui-font-display:
        var(--font-source-serif-4, 'Source Serif 4'), 'Source Serif 4',
        'Iowan Old Style', Georgia, serif;
    --ui-font-features: normal;
    --ui-text-sm: 0.875rem;
    --ui-text-sm-lh: 1.375rem;
    --ui-title-size: 2rem;
    --ui-title-lh: 1.15;
    --ui-title-weight: 500;
    --ui-title-tracking: -0.018em;
    --ui-heading-tracking: -0.006em;
    --ui-figure-weight: 500;
    --ui-figure-tracking: -0.015em;
    --ui-overline-size: 0.8125rem;
    --ui-overline-tracking: 0.05em;
    --ui-overline-caps: all-small-caps;

    --ui-radius-xs: 2px;
    --ui-radius-sm: 3px;
    --ui-radius-md: 4px;
    --ui-radius-lg: 4px;
    --ui-radius-xl: 6px;
    --ui-radius-2xl: 8px;
    --ui-radius-control: 3px;
    --ui-radius-item: 3px;
    --ui-radius-menu: 4px;
    --ui-radius-card: 4px;
    --ui-radius-dialog: 6px;
    --ui-radius-badge: 3px;

    --ui-control-h-sm: 2rem;
    --ui-control-h: 2.25rem;
    --ui-control-h-lg: 2.625rem;
    --ui-page-max: 1320px;
    --ui-page-pad: 2rem;
    --ui-page-pad-xl: 3rem;
    --ui-page-pad-y: 2.5rem;
    --ui-section-gap: 2.5rem;
    --ui-card-pad: 1.5rem;
    --ui-card-gap: 1.25rem;
    --ui-row-h: 3rem;
    --ui-header-h: 4rem;
    --ui-nav-h: 2.125rem;
    --ui-page-rule: 1px;
    --ui-page-rule-gap: 1.75rem;

    --ui-card-shadow: none;
    --ui-popover-border: var(--t-line-2);
    --ui-popover-shadow: 0 14px 36px -14px
        rgb(var(--t-shadow) / calc(0.2 * var(--m-sa)));
    --ui-dialog-shadow: 0 30px 70px -24px
        rgb(var(--t-shadow) / calc(0.3 * var(--m-sa)));
    --ui-control-shadow: none;
    --ui-primary-shadow: none;
    --ui-input-shadow: none;

    --ui-header-bg: color-mix(in oklab, var(--t-canvas) 95%, #d9c4a2);

    --sidebar: color-mix(in oklab, var(--t-canvas) 95%, #d9c4a2);
}