/*! FabricCraft design system 1.0.0, fabriccraft-ops 7b651f460d9e design-system/v1.0.0/tokens.css. Vendored copy: do not edit; copy a newer version instead. */
/*
 * FabricCraft design system 1.0.0: tokens.css
 *
 * Tokens only: CSS custom properties, no element or class rules.
 * Source: fabriccraft-ops design-system/v1.0.0. Derived from the fabriccraft.net
 * homepage (server_website assets/site/site.css, AGE-381) and extended for
 * apps (AGE-389). Do not edit a vendored copy; copy a newer version instead.
 *
 * Themes
 *   - Light is the default.
 *   - Dark follows prefers-color-scheme unless the page sets
 *     data-theme="light" on <html>.
 *   - data-theme="dark" or data-theme="light" on <html> forces a theme;
 *     on any other element it switches that subtree (for example a dark
 *     colophon on a light page).
 *
 * Every text pair listed in README.md passes 4.5:1 and every control or
 * status mark passes 3:1 in both themes (tools/check-tokens.py).
 */

:root {
    /* ---------- Palette (theme-independent raw values) ---------- */

    /* Dark surfaces, darkest first. */
    --fc-deepslate: #1a1b20;
    --fc-deepslate-2: #24262c;
    --fc-deepslate-3: #2e3037;
    /* Light surfaces. calcite-raised sits above the page (dialogs, inputs). */
    --fc-calcite: #eceeed;
    --fc-calcite-2: #e2e5e3;
    --fc-calcite-raised: #f7f8f7;
    /* Text on light. */
    --fc-ink: #24262c;
    --fc-ink-soft: #4a4e55;
    --fc-tuff: #646866;
    /* Text on dark. */
    --fc-on-dark: #eef0ef;
    --fc-on-dark-soft: #a3a8ad;
    --fc-on-dark-faint: #979ca2;
    /* The one accent: verdigris on light, verdigris-bright on dark. */
    --fc-verdigris: #266e63;
    --fc-verdigris-bright: #7fd8c4;

    /* ---------- Type ---------- */

    --fc-font-text: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
    --fc-font-figure: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

    /* Reading scale: 1.25 ratio from a 17px base (homepage). */
    --fc-step--1: 0.85rem;
    --fc-step-0: 1.0625rem;
    --fc-step-1: 1.33rem;
    --fc-step-2: 1.66rem;
    --fc-step-3: clamp(1.9rem, 3vw, 2.6rem);
    --fc-step-4: clamp(2.4rem, min(6.4vw, 10.5vh), 5.6rem);

    /* UI scale for dense tools: table cells, labels, controls. */
    --fc-ui-xs: 0.8125rem;  /* 13px: table meta, badges, help text */
    --fc-ui-sm: 0.875rem;   /* 14px: table cells, labels, small buttons */
    --fc-ui-md: 0.9375rem;  /* 15px: controls, app body text */

    --fc-leading-tight: 1.1;
    --fc-leading-ui: 1.4;
    --fc-leading-body: 1.55;
    --fc-weight-regular: 400;
    --fc-weight-medium: 500;
    --fc-weight-strong: 600;
    --fc-weight-heading: 650;
    --fc-tracking-heading: -0.025em;
    --fc-tracking-display: -0.035em;
    /* Martian Mono width axis: narrow for figures in tables, wide for the wordmark. */
    --fc-figure-stretch: 75%;
    --fc-figure-stretch-wide: 112.5%;
    --fc-measure: 68ch;

    /* ---------- Space (4px base) ---------- */

    --fc-space-1: 0.25rem;
    --fc-space-2: 0.5rem;
    --fc-space-3: 0.75rem;
    --fc-space-4: 1rem;
    --fc-space-5: 1.5rem;
    --fc-space-6: 2rem;
    --fc-space-7: 3rem;
    --fc-space-8: 4.5rem;

    --fc-gutter: clamp(1rem, 4vw, 3rem);
    --fc-band-pad: clamp(4.5rem, 10vw, 8.5rem);
    --fc-max: 1320px;
    --fc-masthead-height: 3.75rem;
    --fc-masthead-height-staff: 3.25rem;

    /* Control heights. lg is the homepage button. */
    --fc-control-sm: 1.875rem;
    --fc-control-md: 2.375rem;
    --fc-control-lg: 2.9rem;

    /* ---------- Radii ---------- */

    --fc-radius-sm: 3px;    /* images, badges */
    --fc-radius: 6px;       /* buttons, inputs */
    --fc-radius-lg: 8px;    /* dialogs, panels over imagery */
    --fc-radius-pill: 999px;

    /* ---------- Lines and focus ---------- */

    --fc-hairline: 1px;
    --fc-focus-width: 2px;
    --fc-focus-offset: 3px;

    /* ---------- Motion ---------- */

    --fc-ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
    --fc-duration-fast: 0.15s;
    --fc-duration-base: 0.25s;
    --fc-duration-slow: 0.45s;

    /* ---------- Layers ---------- */

    --fc-z-masthead: 30;
    --fc-z-popover: 40;    /* tooltips and menus over page content */
    --fc-z-dialog: 50;
    --fc-z-toast: 60;
}

/* ---------- Semantic roles: light (default) ---------- */

:root,
[data-theme="light"] {
    color-scheme: light;

    --fc-bg: var(--fc-calcite);
    --fc-fill: var(--fc-calcite-2);
    --fc-raised: var(--fc-calcite-raised);

    --fc-text: var(--fc-ink);
    --fc-text-soft: var(--fc-ink-soft);
    /* tuff darkened a little so faint text also passes on --fc-fill. */
    --fc-text-faint: #5f6361;

    --fc-accent: var(--fc-verdigris);
    --fc-accent-fill: var(--fc-verdigris);
    --fc-accent-fill-hover: #1d574e;
    --fc-on-accent: var(--fc-calcite-raised);
    --fc-accent-muted: #d4e6e0;

    --fc-rule: rgba(36, 38, 44, 0.14);
    --fc-rule-solid: #d0d3d2;
    --fc-control-border: #797e7c;
    --fc-control-border-hover: var(--fc-ink);
    --fc-focus: var(--fc-verdigris);

    --fc-ok: #2c6a2f;
    --fc-ok-muted: #d9e7d5;
    --fc-info: #2a5c99;
    --fc-info-muted: #dae3ef;
    --fc-warning: #85520a;
    --fc-warning-muted: #f0e3c9;
    --fc-danger: #ad2a22;
    --fc-danger-muted: #f3dcd8;
    --fc-danger-fill-hover: #8e211b;
    --fc-on-danger: var(--fc-calcite-raised);

    --fc-backdrop: rgba(26, 27, 32, 0.55);
}

/* ---------- Semantic roles: dark ---------- */

[data-theme="dark"] {
    color-scheme: dark;

    --fc-bg: var(--fc-deepslate);
    --fc-fill: var(--fc-deepslate-2);
    --fc-raised: var(--fc-deepslate-3);

    --fc-text: var(--fc-on-dark);
    --fc-text-soft: var(--fc-on-dark-soft);
    --fc-text-faint: var(--fc-on-dark-faint);

    --fc-accent: var(--fc-verdigris-bright);
    --fc-accent-fill: var(--fc-verdigris-bright);
    --fc-accent-fill-hover: #a4e6d6;
    --fc-on-accent: var(--fc-deepslate);
    --fc-accent-muted: #1b3732;

    --fc-rule: rgba(238, 240, 239, 0.14);
    --fc-rule-solid: #3a3c41;
    --fc-control-border: #80858c;
    --fc-control-border-hover: var(--fc-on-dark);
    --fc-focus: var(--fc-verdigris-bright);

    --fc-ok: #93d37e;
    --fc-ok-muted: #1f2e20;
    --fc-info: #8fbaf3;
    --fc-info-muted: #1e2939;
    --fc-warning: #e9bb55;
    --fc-warning-muted: #322a17;
    --fc-danger: #ff9d92;
    --fc-danger-muted: #3a2321;
    --fc-danger-fill-hover: #ffbdb5;
    --fc-on-danger: var(--fc-deepslate);

    --fc-backdrop: rgba(14, 15, 18, 0.75);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;

        --fc-bg: var(--fc-deepslate);
        --fc-fill: var(--fc-deepslate-2);
        --fc-raised: var(--fc-deepslate-3);

        --fc-text: var(--fc-on-dark);
        --fc-text-soft: var(--fc-on-dark-soft);
        --fc-text-faint: var(--fc-on-dark-faint);

        --fc-accent: var(--fc-verdigris-bright);
        --fc-accent-fill: var(--fc-verdigris-bright);
        --fc-accent-fill-hover: #a4e6d6;
        --fc-on-accent: var(--fc-deepslate);
        --fc-accent-muted: #1b3732;

        --fc-rule: rgba(238, 240, 239, 0.14);
        --fc-rule-solid: #3a3c41;
        --fc-control-border: #80858c;
        --fc-control-border-hover: var(--fc-on-dark);
        --fc-focus: var(--fc-verdigris-bright);

        --fc-ok: #93d37e;
        --fc-ok-muted: #1f2e20;
        --fc-info: #8fbaf3;
        --fc-info-muted: #1e2939;
        --fc-warning: #e9bb55;
        --fc-warning-muted: #322a17;
        --fc-danger: #ff9d92;
        --fc-danger-muted: #3a2321;
        --fc-danger-fill-hover: #ffbdb5;
        --fc-on-danger: var(--fc-deepslate);

        --fc-backdrop: rgba(14, 15, 18, 0.75);
    }
}

/* Interactions still settle, but nothing travels. */
@media (prefers-reduced-motion: reduce) {
    :root {
        --fc-duration-fast: 0.01ms;
        --fc-duration-base: 0.01ms;
        --fc-duration-slow: 0.01ms;
    }
}