/* GENERATED from tokens/tokens.json by tokens/build.mjs. Do not edit. */

@font-face { font-family: "Haksen"; src: url("../../assets/fonts/Haksen-Regular.otf"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Caveat"; src: url("../../assets/fonts/Caveat-Variable.ttf"); font-weight: 400 700; font-display: swap; }

:root, [data-theme="light"] {
  --font-display: Haksen, "Atkinson Hyperlegible Next", system-ui, sans-serif;
  --font-ui: "Atkinson Hyperlegible Next", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-hand: Kalam, "Atkinson Hyperlegible Next", cursive;
  --font-note: Caveat, Kalam, cursive;
  --font-mono: "Atkinson Hyperlegible Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --canvas: #f6f3ee;
  --surface: #ffffff;
  --surface-sunken: #f0ece5;
  --surface-overlay: #ffffff;
  --scrim: rgba(15, 18, 32, 0.40);
  --line: #e4dfd6;
  --line-strong: #7a7f94;
  --ink: #182140;
  --ink-muted: #4f5671;
  --ink-subtle: #5f647c;
  --ink-inverse: #ffffff;
  --action: #182140;
  --action-hover: #2a3560;
  --on-action: #ffffff;
  --focus: #325e8c;
  --link: #2f5a87;
  --selection: rgba(18, 199, 211, 0.28);
  --node-ink: #182140;
  --edge: #2a3048;
  --edge-label: #4f5671;
  --success: #1d7a4e;
  --success-soft: #e2f3ea;
  --warning: #8a5600;
  --warning-soft: #fbefd6;
  --danger: #c22f3c;
  --danger-soft: #fbe3e5;
  --info: #2f5a87;
  --info-soft: #e2edf8;
  --topic-teal: #87f2f8;
  --topic-teal-ring: #00cdd5;
  --topic-harbor: #bcdbff;
  --topic-harbor-ring: #76b2f5;
  --topic-iris: #e0c8fe;
  --topic-iris-ring: #bd96ea;
  --topic-berry: #ffbdc4;
  --topic-berry-ring: #f47e8f;
  --topic-coral: #ffc7b2;
  --topic-coral-ring: #f38e65;
  --topic-amber: #ffcf9d;
  --topic-amber-ring: #eb9c38;
  --topic-sun: #ffea94;
  --topic-sun-ring: #dfbd04;
  --topic-stone: #e0dacf;
  --topic-stone-ring: #bab09f;
  --spectrum-teal: #12c7d3;
  --spectrum-harbor: #325e8c;
  --spectrum-iris: #8a70a6;
  --spectrum-berry: #f54a57;
  --spectrum-coral: #ff6c4d;
  --spectrum-amber: #f28c16;
  --spectrum-sun: #ffd347;
  --spectrum-stone: #7f7f7f;
  --root-ink: #182140;
  --space-0: 2px;
  --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;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;
  --shadow-float: 0 1px 2px rgba(24, 33, 64, 0.06), 0 8px 24px rgba(24, 33, 64, 0.08);
  --shadow-pop: 0 2px 4px rgba(24, 33, 64, 0.08), 0 16px 40px rgba(24, 33, 64, 0.14);
  --shadow-node: 0 6px 18px rgba(24, 33, 64, 0.10);
  --node-width: 200px;
  --node-height: 148px;
  --node-stroke: 3px;
  --ring-gap-1: 1.10;
  --ring-gap-2: 1.20;
  --ring-gap-3: 1.30;
  --edge-width: 2.5px;
  --edge-gap: 15px;
  --edge-arc-max: 45px;
  --immersion-alpha: 0.15;
  --zoom-min: 0.3;
  --zoom-max: 5;
  --duration-instant: 100ms;
  --duration-quick: 160ms;
  --duration-base: 240ms;
  --duration-zoom: 500ms;
  --duration-reveal: 420ms;
  --stagger-reveal: 70ms;
  --ease-zoom: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-bloom: cubic-bezier(0.34, 1.4, 0.64, 1);
  --z-canvas: 0;
  --z-chrome: 10;
  --z-card: 20;
  --z-menu: 40;
  --z-dialog: 60;
  --z-toast: 80;
}

[data-theme="dark"] {
  --canvas: #0f1220;
  --surface: #171b2b;
  --surface-sunken: #0f1220;
  --surface-overlay: #212639;
  --scrim: rgba(0, 0, 0, 0.60);
  --line: #2b3148;
  --line-strong: #6c7392;
  --ink: #eef0f7;
  --ink-muted: #b3b8cc;
  --ink-subtle: #8f95ae;
  --ink-inverse: #182140;
  --action: #f6f3ee;
  --action-hover: #ffffff;
  --on-action: #182140;
  --focus: #12c7d3;
  --link: #5fd8e1;
  --selection: rgba(18, 199, 211, 0.32);
  --edge: #c9cddc;
  --edge-label: #b3b8cc;
  --success: #5ed39e;
  --success-soft: #14301f;
  --warning: #ffc85c;
  --warning-soft: #33270f;
  --danger: #ff8a93;
  --danger-soft: #3a1a1f;
  --info: #7cc8f2;
  --info-soft: #13283a;
  --topic-teal-ring: #0fc5cd;
  --topic-harbor-ring: #73aceb;
  --topic-iris-ring: #b691e1;
  --topic-berry-ring: #eb798a;
  --topic-coral-ring: #ea8962;
  --topic-amber-ring: #e29737;
  --topic-sun-ring: #d8b70a;
  --topic-stone-ring: #b4a999;
  --shadow-float: 0 1px 2px rgba(0, 0, 0, 0.40), 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-pop: 0 2px 4px rgba(0, 0, 0, 0.50), 0 16px 40px rgba(0, 0, 0, 0.50);
  --shadow-node: 0 0 28px rgba(255, 255, 255, 0.10);
}

[data-theme="focus-light"] {
  --canvas: #f4f2ee;
  --edge: #5a6079;
  --edge-label: #5a6079;
  --topic-teal: #bce8ea;
  --topic-teal-ring: #67c6cb;
  --topic-harbor: #c9d9ec;
  --topic-harbor-ring: #8bb2de;
  --topic-iris: #d9cfe8;
  --topic-iris-ring: #b79ed4;
  --topic-berry: #edc6c9;
  --topic-berry-ring: #da9099;
  --topic-coral: #eecec1;
  --topic-coral-ring: #db9b82;
  --topic-amber: #eed4ba;
  --topic-amber-ring: #d6a570;
  --topic-sun: #f4eac1;
  --topic-sun-ring: #d2bf73;
  --topic-stone: #dddad5;
}

[data-theme="focus-dark"] {
  --canvas: #12141c;
  --surface: #171b2b;
  --surface-sunken: #0f1220;
  --surface-overlay: #212639;
  --scrim: rgba(0, 0, 0, 0.60);
  --line: #2b3148;
  --line-strong: #6c7392;
  --ink: #eef0f7;
  --ink-muted: #b3b8cc;
  --ink-subtle: #8f95ae;
  --ink-inverse: #182140;
  --action: #f6f3ee;
  --action-hover: #ffffff;
  --on-action: #182140;
  --focus: #12c7d3;
  --link: #5fd8e1;
  --selection: rgba(18, 199, 211, 0.32);
  --edge: #a9aec0;
  --edge-label: #b3b8cc;
  --success: #5ed39e;
  --success-soft: #14301f;
  --warning: #ffc85c;
  --warning-soft: #33270f;
  --danger: #ff8a93;
  --danger-soft: #3a1a1f;
  --info: #7cc8f2;
  --info-soft: #13283a;
  --topic-teal: #bce8ea;
  --topic-teal-ring: #71bdc1;
  --topic-harbor: #c9d9ec;
  --topic-harbor-ring: #8cabce;
  --topic-iris: #d9cfe8;
  --topic-iris-ring: #ae9bc6;
  --topic-berry: #edc6c9;
  --topic-berry-ring: #cc8e95;
  --topic-coral: #eecec1;
  --topic-coral-ring: #cd9884;
  --topic-amber: #eed4ba;
  --topic-amber-ring: #c9a176;
  --topic-sun: #f4eac1;
  --topic-sun-ring: #c9b97a;
  --topic-stone: #dddad5;
  --topic-stone-ring: #b4a999;
}

[data-theme="colorsafe-light"] {
  --success: #005f99;
  --success-soft: #e0eef8;
  --warning: #7a6000;
  --warning-soft: #f7f0cc;
  --danger: #a63d00;
  --danger-soft: #fbe8dc;
  --info: #6b3a8c;
  --info-soft: #efe6f6;
  --topic-teal: #b0ecbc;
  --topic-teal-ring: #6cc982;
  --topic-harbor: #abdbfe;
  --topic-harbor-ring: #60b4ec;
  --topic-iris: #f6bde2;
  --topic-iris-ring: #dc87c0;
  --topic-berry: #feb79e;
  --topic-berry-ring: #ec7f58;
  --topic-coral: #fece96;
  --topic-coral-ring: #e49d41;
  --topic-amber: #b2e8fa;
  --topic-amber-ring: #5cc4e2;
  --topic-sun: #f6f097;
  --topic-sun-ring: #d0c637;
  --topic-stone: #dbdbdb;
  --topic-stone-ring: #b7afb1;
}

[data-theme="colorsafe-dark"] {
  --canvas: #0f1220;
  --surface: #171b2b;
  --surface-sunken: #0f1220;
  --surface-overlay: #212639;
  --scrim: rgba(0, 0, 0, 0.60);
  --line: #2b3148;
  --line-strong: #6c7392;
  --ink: #eef0f7;
  --ink-muted: #b3b8cc;
  --ink-subtle: #8f95ae;
  --ink-inverse: #182140;
  --action: #f6f3ee;
  --action-hover: #ffffff;
  --on-action: #182140;
  --focus: #12c7d3;
  --link: #5fd8e1;
  --selection: rgba(18, 199, 211, 0.32);
  --edge: #c9cddc;
  --edge-label: #b3b8cc;
  --success: #62b7f0;
  --success-soft: #10283a;
  --warning: #f0e442;
  --warning-soft: #2f2c0c;
  --danger: #ff9a5c;
  --danger-soft: #3a2010;
  --info: #d7a3f0;
  --info-soft: #2a1c33;
  --topic-teal: #b0ecbc;
  --topic-teal-ring: #69c27e;
  --topic-harbor: #abdbfe;
  --topic-harbor-ring: #5eade2;
  --topic-iris: #f6bde2;
  --topic-iris-ring: #d383b9;
  --topic-berry: #feb79e;
  --topic-berry-ring: #e37a55;
  --topic-coral: #fece96;
  --topic-coral-ring: #db9840;
  --topic-amber: #b2e8fa;
  --topic-amber-ring: #5bbdda;
  --topic-sun: #f6f097;
  --topic-sun-ring: #c9bf37;
  --topic-stone: #dbdbdb;
  --topic-stone-ring: #b1a8aa;
}

[data-theme="contrast-light"] {
  --canvas: #ffffff;
  --surface-sunken: #f2f2f2;
  --scrim: rgba(0, 0, 0, 0.60);
  --line: #5c6178;
  --line-strong: #000000;
  --ink: #000000;
  --ink-muted: #1f2433;
  --ink-subtle: #3a3f52;
  --action: #000000;
  --action-hover: #1f2433;
  --focus: #0b4a8f;
  --link: #0b4a8f;
  --node-ink: #000000;
  --edge: #000000;
  --edge-label: #1f2433;
  --success: #004f80;
  --success-soft: #ffffff;
  --warning: #5c4500;
  --warning-soft: #ffffff;
  --danger: #8a2c00;
  --danger-soft: #ffffff;
  --info: #4b2266;
  --info-soft: #ffffff;
  --topic-teal-ring: #006b70;
  --topic-harbor-ring: #0e599d;
  --topic-iris-ring: #683b92;
  --topic-berry-ring: #96173a;
  --topic-coral-ring: #923400;
  --topic-amber-ring: #7e4d00;
  --topic-sun-ring: #7a6600;
  --topic-stone-ring: #63594b;
  --shadow-float: none;
  --shadow-pop: none;
  --shadow-node: none;
}

[data-theme="contrast-dark"] {
  --canvas: #000000;
  --surface: #000000;
  --surface-sunken: #0d0d0d;
  --surface-overlay: #0d0d0d;
  --scrim: rgba(0, 0, 0, 0.75);
  --line: #9aa0b8;
  --line-strong: #ffffff;
  --ink: #ffffff;
  --ink-muted: #e6e8f0;
  --ink-subtle: #c8ccda;
  --ink-inverse: #182140;
  --action: #ffffff;
  --action-hover: #e6e8f0;
  --on-action: #000000;
  --focus: #5fe8f0;
  --link: #7ff0f5;
  --selection: rgba(18, 199, 211, 0.32);
  --node-ink: #000000;
  --edge: #ffffff;
  --edge-label: #e6e8f0;
  --success: #8fd0ff;
  --success-soft: #000000;
  --warning: #f5eb6e;
  --warning-soft: #000000;
  --danger: #ffb08a;
  --danger-soft: #000000;
  --info: #e7b8ff;
  --info-soft: #000000;
  --topic-teal-ring: #64eff7;
  --topic-harbor-ring: #b0d5fe;
  --topic-iris-ring: #dcbfff;
  --topic-berry-ring: #feb3bb;
  --topic-coral-ring: #ffbea5;
  --topic-amber-ring: #ffc78a;
  --topic-sun-ring: #ffe26d;
  --topic-stone-ring: #ddd3c2;
  --shadow-float: none;
  --shadow-pop: none;
  --shadow-node: none;
}

[data-motion="reduced"] {
  --duration-instant: 120ms;
  --duration-quick: 0ms;
  --duration-base: 0ms;
  --duration-zoom: 0ms;
  --duration-reveal: 0ms;
  --stagger-reveal: 0ms;
}
@media (prefers-reduced-motion: reduce) {
    :root:not([data-motion="full"]) {
    --duration-instant: 120ms;
    --duration-quick: 0ms;
    --duration-base: 0ms;
    --duration-zoom: 0ms;
    --duration-reveal: 0ms;
    --stagger-reveal: 0ms;
  }
}

.display-xl { font-family: var(--font-display); font-size: 72px; line-height: 72px; font-weight: 400; letter-spacing: 0.01em; }
.display-l { font-family: var(--font-display); font-size: 48px; line-height: 52px; font-weight: 400; letter-spacing: 0.01em; }
.display-m { font-family: var(--font-display); font-size: 28px; line-height: 32px; font-weight: 400; letter-spacing: 0.02em; }
.eyebrow { font-family: var(--font-display); font-size: 13px; line-height: 16px; font-weight: 400; letter-spacing: 0.14em; }
.title-l { font-family: var(--font-ui); font-size: 32px; line-height: 38px; font-weight: 700; letter-spacing: -0.01em; }
.title { font-family: var(--font-ui); font-size: 22px; line-height: 28px; font-weight: 700; }
.heading { font-family: var(--font-ui); font-size: 17px; line-height: 24px; font-weight: 700; }
.body { font-family: var(--font-ui); font-size: 15px; line-height: 22px; font-weight: 400; }
.body-sm { font-family: var(--font-ui); font-size: 13px; line-height: 18px; font-weight: 400; }
.label { font-family: var(--font-ui); font-size: 13px; line-height: 16px; font-weight: 600; letter-spacing: 0.01em; }
.caption { font-family: var(--font-ui); font-size: 12px; line-height: 16px; font-weight: 400; }
.code { font-family: var(--font-mono); font-size: 13px; line-height: 20px; font-weight: 400; }
.node-root { font-family: var(--font-hand); font-size: 30px; line-height: 34px; font-weight: 700; }
.node-label { font-family: var(--font-hand); font-size: 22px; line-height: 26px; font-weight: 700; }
.signature { font-family: var(--font-hand); font-size: 1em; line-height: 1; font-weight: 400; }
.edge-label { font-family: var(--font-note); font-size: 18px; line-height: 20px; font-weight: 500; }
.annotation { font-family: var(--font-note); font-size: 24px; line-height: 26px; font-weight: 600; }
