/* @slayerlabs/ui-design@0.1.1 dist/tokens.css (vendored copy) */
:root{
/* Fabryka production palette: https://fabryka.ai/media. Legacy red/carbon names are compatibility aliases. */
--paper:#FCFAF6;
--paper-2:#F3EFE9;
--paper-3:#E9E2DA;
--paper-4:#D7D1CA;

--carbon:#1A1512;
--carbon-2:#1D1916;
--carbon-3:#49423D;
--carbon-4:#655D56;

--grey:#A69C93;
--grey-dark:#766E68;
--grey-light:var(--paper-4);

--red:#B33B00;
--red-dark:#963200;
--red-wash:#F3E3D8;

/* State only. Never decorative. */
--signal-green:#1E9E4A;
--signal-amber:#C88A05;
--signal-grey:#8C8C86;

/* --- Semantic aliases (light / paper surface, the default) --- */
--surface:var(--paper);
--surface-raised:var(--paper);
--surface-sunken:var(--paper-2);
--surface-card:var(--paper);
--surface-inverse:var(--carbon);
--surface-accent:var(--red);

--text-body:var(--carbon);
--text-secondary:var(--carbon-3);
--text-heading:var(--carbon);
--text-muted:var(--grey-dark);
--text-faint:var(--grey);
--text-accent:var(--red);
--text-on-inverse:var(--paper);
--text-on-accent:var(--paper);

--rule:var(--paper-4);        /* observed production rule colour */
--rule-soft:rgba(26,21,18,.22);
--rule-faint:rgba(26,21,18,.11);

--link:var(--red);
--link-hover:var(--red-dark);

--focus-ring:var(--red);

--status-live:var(--signal-green);
--status-pass:var(--signal-green);
--status-fail:var(--red);
--status-warn:var(--signal-amber);
--status-idle:var(--signal-grey);

--ink:var(--carbon);
--ink-2:var(--carbon-3);
--mute:var(--grey-dark);
--sota:var(--red);
/* Grid / plate texture */
--grid-line:rgba(26,21,18,.08);
--plate-tint:rgba(26,21,18,.04);

/* Scrims shade imagery under text; alphas and ink follow the production home page. */
--overlay-ink:#211C18;
--scrim-strong:color-mix(in srgb,var(--overlay-ink) 91%,transparent);
--scrim-medium:color-mix(in srgb,var(--overlay-ink) 72%,transparent);
--scrim-soft:color-mix(in srgb,var(--overlay-ink) 40%,transparent);
--scrim-faint:color-mix(in srgb,var(--overlay-ink) 3%,transparent);
--scrim-edge:color-mix(in srgb,var(--overlay-ink) 62%,transparent);
--surface-translucent:color-mix(in srgb,var(--surface) 97%,transparent);
--surface-on-image:color-mix(in srgb,var(--overlay-ink) 37.6%,transparent);
/* Imagery does not change with the theme, so the rule on it does not follow --rule. */
--rule-on-image:color-mix(in srgb,var(--paper-4) 67%,transparent);

--surface-hero:#514437;
--surface-footer:var(--carbon-2);
--surface-inverse-hover:var(--carbon-3);
--surface-accent-hover:var(--red-dark);
--text-accent-on-inverse:var(--red-wash);
--text-accent-on-image:#F0D4C0;
--text-accent-on-carbon:#F08A68;
--surface-placeholder:#E3DED3;
--surface-feature:#F3EEE4;
--text-status:#69675D;
--text-footer:var(--paper-4);
--rule-strong:var(--carbon);
--rule-control:var(--grey-dark);
--rule-accent:var(--red);
--rule-accent-hover:var(--red-dark);
--rule-on-inverse:color-mix(in srgb, var(--paper) 16%, transparent);
--focus-ring-inverse:var(--paper);
--swatch-steel:var(--grey-dark);

--figure-ink:var(--carbon);
--figure-ink-soft:var(--carbon-3);
--figure-ink-muted:var(--carbon-4);
--figure-line-muted:var(--grey-dark);
--figure-faint:var(--grey);
--figure-paper:var(--paper);
--figure-tint:var(--paper-2);
--figure-fill:var(--paper-3);
--figure-accent:var(--red);
--figure-accent-strong:var(--red-dark);

/* Categorical series in research figures; no palette colour carries these roles. */
--data-blue:#3D5D91;
--data-green:#385440;
--data-sage:#B7C2B0;
--data-sage-wash:#E7EBDF;

/* Official mark colours, assets/fabryka-mark.svg. */
--brand-mark-ground:#132126;
--brand-mark-accent:#E85A28;
--brand-mark-paper:#FBF8F2;
}

/* Inverse scope: carbon sections, machine panels, terminal blocks */
[data-theme="carbon"]{
--surface:var(--carbon);
--surface-raised:var(--carbon-2);
--surface-sunken:#0B0B0B;
--surface-card:var(--carbon-2);
--surface-inverse:var(--paper);
--surface-translucent:color-mix(in srgb,var(--surface) 97%,transparent);

--text-body:var(--paper);
--text-secondary:var(--paper-3);
--text-heading:var(--paper);
--text-muted:var(--grey);
--text-faint:var(--grey-dark);
--text-accent:var(--text-accent-on-carbon);
--text-on-inverse:var(--carbon);

--rule:rgba(252,250,246,.9);
--rule-soft:rgba(252,250,246,.28);
--rule-faint:rgba(252,250,246,.14);

--grid-line:rgba(252,250,246,.09);
--plate-tint:rgba(252,250,246,.04);
--link:#FF6A52;
--link-hover:#FF8B77;
/* AA: --red falls to 2.94:1 on --surface-card in this scope; the dark-band accent gives 7.10:1. */
--focus-ring:var(--text-accent-on-carbon);

--surface-inverse-hover:var(--paper-3);
--text-accent-on-inverse:var(--red);
--rule-strong:var(--paper);
--rule-control:var(--grey);
--rule-on-inverse:color-mix(in srgb, var(--carbon) 16%, transparent);
--focus-ring-inverse:var(--carbon);

--figure-ink:var(--paper);
--figure-ink-soft:var(--paper-3);
--figure-ink-muted:var(--grey);
--figure-line-muted:var(--grey);
--figure-faint:var(--grey-dark);
--figure-paper:var(--carbon);
--figure-tint:var(--carbon-2);
--figure-fill:var(--carbon-3);
--figure-accent-strong:var(--red);
}

@media (max-width: 1000px){
:root{--scrim-strong:color-mix(in srgb,var(--overlay-ink) 85%,transparent);--scrim-medium:color-mix(in srgb,var(--overlay-ink) 70%,transparent);--scrim-soft:color-mix(in srgb,var(--overlay-ink) 55%,transparent);}
}
/* AA over the template: production's eyebrow tint falls below 4.5:1 on the narrow hero image. */
@media (max-width: 760px){
:root{--text-accent-on-image:var(--paper);}
}

:root{
/* 4px base, but the system leans on large industrial gutters */
--space-0:0;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:24px;
--space-6:32px;
--space-7:48px;
--space-8:64px;
--space-9:96px;
--space-10:128px;
--space-11:176px;

--gutter:24px;            /* page gutter, mobile */
--gutter-lg:56px;         /* page gutter, desktop */
--measure:66ch;           /* max body measure */
--page-max:1440px;
--col-gap:24px;
--grid-cols:12; /* @kind other */

--section-pad-y:80px;
--section-heading-gap:55px;
--feature-pad-y:72px;
--feature-gap:50px;
--feature-kicker-inset:11px;
--feature-title-gap:22px;
--person-link-gap:14px;
--portrait-gap:22px;
--eyebrow-gap:26px;
--paragraph-gap:18px;
--actions-gap:12px;
--actions-offset:30px;
--feature-actions-offset:25px;
--card-pad-top:29px;
--card-title-gap:15px;
--list-title-gap:10px;
--output-kind-inset:5px;
--output-row-pad-y:30px;
--detail-pad-top:21px;
--more-link-gap:28px;
--subsection-gap:58px;
--subsection-pad-top:36px;
--subsection-offset:28px;
--feature-max:1400px;
--feature-inset:20px;
--feature-art-max:480px;
--split-gap:70px;
--split-pad-y:95px;
--card-pad-x:30px;
--col-output-kind:180px;
--col-output-link:205px;
--output-gap:30px;
--stats-row-gap:28px;
--stats-col-gap:65px;
--stats-offset:44px;
--roster-row-gap:42px;
--roster-col-gap:24px;
--role-min-h:34px;
--ribbon-pad-y:25px;
--ribbon-gap:25px;
--ribbon-step-gap:24px;
--links-row-gap:18px;
--plate-pad:16px;
--card-pad:20px;
--control-pad-x:20px;
--control-pad-y:15px;
--control-pad-x-compact:13px;
--control-pad-y-compact:9px;
--control-pad-x-sm:10px;
--control-pad-y-sm:7px;

--control-h-sm:28px;
--control-h:36px;
--control-h-lg:46px;

--hero-min-h:740px;
--hero-pad-top:85px;
--hero-pad-bottom:100px;
--hero-measure:680px;
--hero-eyebrow-measure:560px;
--hero-lead-measure:505px;
--hero-caption-inset:30px;
--hero-title-gap:28px;
--step-title-gap:28px;
/* Paper title blocks: every page but the home, whose title block is the image band. */
--title-block-pad-top:24px;
--title-block-pad-bottom:64px;
--running-head-gap:24px;
/* A section heading over its running text: the home's feature title → text distance. */
--heading-text-gap:22px;
/* A section heading stacked over its lead: the home's stacked .heading gap (it stacks only at 760px and below). */
--heading-lead-gap:28px;

/* Sticky banner: defined bar heights, each including its bottom rule. */
--header-bar-h:85px;
--section-bar-h:47px;

--measure-prose:42rem;
--measure-narrow:40rem;
--measure-wide:48rem;
--measure-article:56rem;
--measure-statement:20ch;
--measure-tagline:30ch;
--measure-figure:520px;
--measure-feature:620px;
--measure-stat-label:155px;
--measure-panel:640px;
--viewport-h:100dvh;

--col-min-label:160px;
--col-min-card:240px;
--col-min-note:220px;
--col-min-field:260px;
--col-min-paper:300px;
--col-min-detail:420px;
--col-min-artifact:180px;
--col-min-swatch:160px;
--col-min-step:110px;
--col-min-footer-intro:240px;
--col-dossier-index:32px;
--col-programme-number:64px;
--col-row-head:120px;

--table-min-ablation:440px;
--table-min-register:560px;
--table-min-steps:770px;
--canvas-min-graph:760px;

--icon-swatch:10px;
--icon-lockup-sm:24px;
--icon-lockup:28px;
--icon-step:28px;
--icon-avatar-preview:56px;
--icon-signature:72px;
--icon-mark-preview:96px;
--icon-poster:240px;
--icon-asset-preview:320px;
--stage-h:180px;
--swatch-h:160px;
--tile-h:92px;
--cell-h:22px;
--bar-thickness:6px;
--legend-line:16px;
--marker-size:7px;
--point-radius:4.5px;

/* SVG user units: research-loop box and atlas node text baselines. */
--box-code-baseline:22px;
--box-name-baseline:45px;
--node-kicker-baseline:28px;
--node-title-baseline:66px;
--node-subtitle-baseline:92px;
--node-status-baseline:131px;

/* Consent panel offsets equal the production panel. */
--consent-inset:20px;
--consent-offset:58px;
--consent-gap:10px;

--skip-offset:100px;
--sr-only-size:1px;
}

@media (max-width: 1100px){
:root{--col-output-kind:140px;}
}
@media (max-width: 1000px){
:root{--split-gap:40px;--card-pad-x:20px;}
}
@media (max-width: 900px){
:root{--header-bar-h:73px;--col-programme-number:40px;}
}
@media (max-width: 760px){
:root{--title-block-pad-bottom:48px;--hero-pad-top:55px;--hero-pad-bottom:65px;--hero-eyebrow-measure:345px;--section-pad-y:55px;--step-title-gap:18px;--feature-pad-y:42px;--feature-gap:28px;--card-pad-top:28px;--output-kind-inset:0;--actions-gap:14px;--section-heading-gap:36px;--split-gap:28px;--split-pad-y:60px;--output-gap:14px;--stats-row-gap:24px;--stats-col-gap:24px;--roster-row-gap:32px;--roster-col-gap:18px;--ribbon-gap:14px;--ribbon-step-gap:10px;}
}
@media (max-width: 480px){
:root{--role-min-h:0;}
}
@media (max-width: 450px){
:root{--consent-offset:56px;}
}

:root{
/* Square editorial panels; production hero actions may use 4px corners. */
--radius-0:0px;
--radius-pill:999px;
--radius-dot:50%;
--radius-figure:2px;
--radius-node:3px;
--radius-media:3px;
--radius-header-control:6px;
--radius-panel:8px;

--border-hair:1px;
--border-rule:1.5px;
--border-mid:2px;
--border-heavy:3px;

--border:var(--border-hair) solid var(--rule);
--border-soft:var(--border-hair) solid var(--rule-soft);
--border-faint:var(--border-hair) solid var(--rule-faint);
--border-heavy-solid:var(--border-heavy) solid var(--rule);
--border-strong:var(--border-hair) solid var(--rule-strong);
--border-control:var(--border-hair) solid var(--rule-control);
--border-accent:var(--border-hair) solid var(--rule-accent);
--border-accent-heavy:var(--border-heavy) solid var(--rule-accent);
--border-on-inverse:var(--border-hair) solid var(--rule-on-inverse);
--border-step:var(--border-mid) solid var(--rule-strong);
--border-chip:var(--border-rule) solid var(--rule-strong);
--border-figure:var(--border-hair) solid var(--figure-faint);
--border-planned:var(--border-hair) dashed var(--figure-line-muted);
--border-ring:var(--border-rule) solid var(--figure-ink-muted);
--border-warn:var(--border-rule) solid var(--status-warn);
--border-button:var(--border-hair) solid;
--border-indicator:var(--border-mid) solid transparent;

--focus-width:2px;
--focus-offset:2px;

--stroke-regular:var(--border-rule);
--stroke-strong:var(--border-mid);
--stroke-bold:4px;
--stroke-halo:8px;

--dash-fine:3 3;
--dash-roadmap:3 4;
--dash-threshold:4 4;
--dash-grid:4 5;
--dash-feedback:5 4;
--dash-concept:6 5;
--dash-run:7 5;
--dash-dotted:2 6;

/* No soft startup shadows. Only hard offset "printed" shadows, sparingly. */
--shadow-none:none;
--shadow-stamp:3px 3px 0 var(--carbon);
--shadow-stamp-red:3px 3px 0 var(--red);
--shadow-overlay:0 24px 60px rgba(17,17,17,.28);
--shadow-caption:0 1px 8px var(--overlay-ink);
--shadow-popover:0 8px 35px color-mix(in srgb, var(--carbon) 13%, transparent);
--shadow-outline-soft:inset 0 0 0 var(--border-hair) var(--rule-soft);
--shadow-outline-strong:inset 0 0 0 var(--border-hair) var(--rule-strong);

--dot-size:8px;
--rivet-size:5px;
}

:root{--radius-control:4px;--radius-card:var(--radius-0);}

/* var() resolves where a custom property is declared, so role-based values are re-declared for the carbon roles. */
[data-theme="carbon"]{
--border:var(--border-hair) solid var(--rule);
--border-soft:var(--border-hair) solid var(--rule-soft);
--border-faint:var(--border-hair) solid var(--rule-faint);
--border-heavy-solid:var(--border-heavy) solid var(--rule);
--border-strong:var(--border-hair) solid var(--rule-strong);
--border-control:var(--border-hair) solid var(--rule-control);
--border-on-inverse:var(--border-hair) solid var(--rule-on-inverse);
--border-step:var(--border-mid) solid var(--rule-strong);
--border-chip:var(--border-rule) solid var(--rule-strong);
--border-figure:var(--border-hair) solid var(--figure-faint);
--border-planned:var(--border-hair) dashed var(--figure-line-muted);
--border-ring:var(--border-rule) solid var(--figure-ink-muted);
--shadow-outline-soft:inset 0 0 0 var(--border-hair) var(--rule-soft);
--shadow-outline-strong:inset 0 0 0 var(--border-hair) var(--rule-strong);
}

:root{
/* Mechanical, short, no bounce, no spring. Things switch state; they don't float. */
--dur-instant:60ms; /* @kind other */
--dur-fast:110ms; /* @kind other */
--dur-base:180ms; /* @kind other */
--dur-slow:320ms; /* @kind other */
--ease-mech:cubic-bezier(.2,0,.2,1); /* @kind other */
--ease-linear:linear; /* @kind other */
--ease-step:steps(4,end); /* @kind other */
--transition-control:background-color var(--dur-fast) var(--ease-mech),color var(--dur-fast) var(--ease-mech),border-color var(--dur-fast) var(--ease-mech);
--blink:1.6s; /* @kind other */
}

:root{




/* The app's next/font variables lead; the asset stacks serve standalone SVG and PNG files. */
--family-sans:var(--font-sans), system-ui, sans-serif;
--family-serif:var(--font-serif), Georgia, serif;
--family-mono:var(--font-mono), ui-monospace, monospace;
--family-sans-asset:Inter, system-ui, sans-serif;
--family-serif-asset:'EB Garamond', Georgia, serif;
--family-mono-asset:'JetBrains Mono', ui-monospace, monospace;

/* Editorial headlines use natural width and sentence case. */
--display-stretch:normal;
--display-weight:500;
--display-tracking:-0.055em;
--display-leading:1.04;

/* Type scale (px) — display sizes are deliberately extreme */
--size-display-1:108px;
--size-display-2:86px;
--size-display-3:66px;
--size-display-4:42px;
--size-heading:22px;
--size-body-lg:18px;
--size-body:16px;
--size-body-sm:14px;
--size-mono:13px;
--size-mono-sm:11.5px;
--size-label:11px;

--size-page-title:clamp(2.6rem, 6vw, 4.75rem);
--size-closing:clamp(1.4rem, 2.6vw, 1.9rem);
--size-statement:clamp(1.1rem, 2vw, 1.35rem);
--size-card-title:18px;
--size-step-title:26px;
--size-subsection-title:34px;
--size-list-title:24px;
--size-person-title:23px;
--size-body-compact:15px;
--size-meta:var(--size-mono);
--size-control-sm:12px;
--size-fine:0.85rem;
--size-code:0.9em;
--size-stat:clamp(2.2rem, 4vw, 3rem);
--size-count:52px;
--size-stat-label:14px;
--size-initials:64px;
--size-lockup:28px;
--size-lockup-sm:24px;
--size-figure-lg:26px;
--size-figure-md:20px;
--size-figure:10.5px;
--size-figure-sm:10px;

/* Production home page values (fabryka.ai), the template for every page. */
--size-hero:clamp(48px,5.1vw,78px);
--size-hero-lead:18px;
--leading-hero-lead:var(--leading-lead);
--size-section:clamp(34px,3.6vw,52px);
--leading-section:1.13;
--size-feature-title:clamp(30px,3.5vw,51px);
--leading-feature-title:1.12;
--track-section:-0.045em;
--size-caption:12px;
--size-hero-caption:14px;
--track-caption:0.06em;
--size-ribbon:15px;
--size-status:12px;
--leading-lead:1.75;
--leading-card-title:1.25;
--leading-list-title:1.3;
--leading-subsection-title:1.2;
--track-eyebrow:0.02em;
--track-kicker:0.07em;
--track-ribbon:0.045em;
--track-feature-title:-0.04em;
--track-card-title:-0.7px;
--track-list-title:-0.6px;
--track-subsection-title:-1px;

--leading-body:1.65;
--leading-mono:1.55;
--leading-none:1;
--leading-snug:1.4;
--leading-label:1.6;
--leading-compact:1.5;
--leading-relaxed:1.7;
--leading-meta:1.8;

--track-label:0.14em;   /* mono/eyebrow labels: wide, all caps */
--track-mono:var(--track-eyebrow);
--track-body:0; /* @kind other */
--track-heading:-0.02em;
--track-accent:-0.01em;
--track-lockup:var(--track-heading);
--track-stat:-2px;
--underline-offset:3px;

--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
/* Roles alias the scale, never the reverse: retuning a role must not move every generic weight. */
--weight-section:var(--weight-medium);
--weight-feature:var(--weight-semibold);
--weight-bold:700;
--weight-black:900;
}

:root{--size-nav:16px;--size-nav-mobile:15px;}

/* AA over the template: production's 14px hero caption falls below 4.5:1 between 1601 and 1800px only. */
@media (max-width: 1800px){
:root{--size-hero-caption:12px;}
}
@media (max-width: 1600px){
:root{--size-hero-caption:14px;}
}
@media (max-width: 1000px){
:root{--size-hero:60px;}
}
@media (max-width: 760px){
:root{--size-hero:clamp(43px,8.5vw,62px);--size-hero-lead:17px;--size-caption:11px;--size-feature-title:34px;--size-count:44px;--size-stat-label:13px;--size-step-title:25px;--size-person-title:21px;--size-ribbon:12px;}
}
@media (max-width: 480px){
:root{--size-count:42px;--size-person-title:25px;}
}

:root{
--blur-translucent:10px;
--blur-on-image:5px;

--opacity-band:0.07;
--hero-crop-x:60%;
--portrait-crop:26%;

/* Home hero scrim: stop n sits at max(stop-n, factor-n × the text column end). */
--hero-scrim-stop-1:29%;
--hero-scrim-stop-2:48%;
--hero-scrim-stop-3:75%;
--hero-scrim-stop-edge:40%;
--hero-scrim-factor-1:0.85;
--hero-scrim-factor-2:1.2;
--hero-scrim-factor-3:1.6;
}

@media (max-width: 760px){
:root{--hero-crop-x:64%;}
}

:root{
--z-below:-1;
--z-above:1;
--z-header:20;
--z-consent-toggle:29;
--z-consent:30;
--z-skip:30;
}