/* AiGent · 2026 Brand Identity 1.1 · design tokenek
   GENERÁLT FÁJL: tools/build_tokens.py állítja elő a tokens.json-ból. Kézzel ne szerkeszd. */

:root{
  --ag-color-stage-bg: #0C0C10;
  --ag-color-stage-surface: #14141A;
  --ag-color-stage-raised: #1C1C24;
  --ag-color-stage-black: #000000;
  --ag-color-stage-text-1: #F4F4F2;
  --ag-color-stage-text-2: #B4B4BE;
  --ag-color-stage-text-3: #7C7C88;
  --ag-color-stage-text-4: #8E8E99;
  --ag-color-stage-line: rgba(255,255,255,.12);
  --ag-color-stage-line-strong: rgba(255,255,255,.25);
  --ag-color-stage-fill-card: rgba(255,255,255,.035);
  --ag-color-stage-fill-box: rgba(255,255,255,.05);
  --ag-color-stage-fill-zone: rgba(255,255,255,.07);
  --ag-color-paper-bg: #FAFAF8;
  --ag-color-paper-surface: #FFFFFF;
  --ag-color-paper-ink-1: #17171C;
  --ag-color-paper-ink-2: #55555E;
  --ag-color-paper-ink-3: #8E8E99;
  --ag-color-paper-line: rgba(23,23,28,.12);
  --ag-color-paper-line-strong: rgba(23,23,28,.24);
  --ag-color-paper-fill-card: rgba(255,255,255,.72);
  --ag-color-aurora-blue: #AAC8F0;
  --ag-color-aurora-lavender: #C9B7EF;
  --ag-color-aurora-peach: #F3CDB3;
  --ag-color-aurora-step-1: #B6C2F0;
  --ag-color-aurora-step-2: #C2BBEF;
  --ag-color-aurora-step-3: #DCC0D6;
  --ag-color-aurora-step-4: #EBC7C2;
  --ag-color-aurora-gradient: linear-gradient(115deg,#AAC8F0,#C9B7EF 48%,#F3CDB3);
  --ag-color-status-live: oklch(0.68 0.16 155);
  --ag-color-status-live-hex: #20B46B;
  --ag-color-status-demo: #F3CDB3;
  --ag-color-status-future: #C9B7EF;
  --ag-color-status-own: #AAC8F0;
  --ag-color-status-demo-border: rgba(243,205,179,.5);
  --ag-color-status-future-border: rgba(201,183,239,.5);
  --ag-color-status-own-border: rgba(170,200,240,.5);
  --ag-color-status-placeholder-border: rgba(243,205,179,.6);
  --ag-color-status-demo-ink-light: #9A5520;
  --ag-color-chart-dark-focus: #8DB6F2;
  --ag-color-chart-dark-context: #6E6E7A;
  --ag-color-chart-dark-third: #F3CDB3;
  --ag-color-chart-dark-seq-1: #C9DBF5;
  --ag-color-chart-dark-seq-2: #8DB6F2;
  --ag-color-chart-dark-seq-3: #5A86C8;
  --ag-color-chart-dark-seq-4: #34558F;
  --ag-color-chart-dark-zero: rgba(255,255,255,.4);
  --ag-color-chart-dark-mark: #C9B7EF;
  --ag-color-chart-dark-mark-line: rgba(201,183,239,.45);
  --ag-color-chart-light-focus: #3E6DB5;
  --ag-color-chart-light-context: #8E8E99;
  --ag-color-chart-light-third: #D9823F;
  --ag-color-chart-light-seq-1: #94B2E4;
  --ag-color-chart-light-seq-2: #6890D0;
  --ag-color-chart-light-seq-3: #3E6DB5;
  --ag-color-chart-light-seq-4: #22437A;
  --ag-color-chart-light-zero: rgba(23,23,28,.4);
  --ag-color-chart-light-mark: #7A62C4;
  --ag-color-chart-light-mark-line: rgba(122,98,196,.45);
  --ag-color-graph-zone-free-fill: rgba(170,200,240,.06);
  --ag-color-graph-zone-free-stroke: rgba(170,200,240,.35);
  --ag-color-graph-zone-closed-fill: rgba(201,183,239,.06);
  --ag-color-graph-zone-closed-stroke: rgba(201,183,239,.45);
  --ag-color-graph-node-fill: #14141A;
  --ag-color-graph-node-stroke: rgba(255,255,255,.25);
  --ag-color-graph-node-key: #C9B7EF;
  --ag-color-graph-node-human-fill: rgba(243,205,179,.08);
  --ag-color-graph-node-human-stroke: #F3CDB3;
  --ag-color-graph-node-ext-fill: rgba(170,200,240,.08);
  --ag-color-graph-edge: rgba(255,255,255,.6);
  --ag-color-graph-edge-head: rgba(255,255,255,.75);
  --ag-color-graph-edge-both: rgba(255,255,255,.55);
  --ag-color-graph-frame-dashed: rgba(255,255,255,.45);
  --ag-color-graph-net-link-rgb: 201,183,239;
  --ag-font-sans: 'Instrument Sans', Arial, sans-serif;
  --ag-font-mono: 'JetBrains Mono', Menlo, monospace;
  --ag-space-1: 4px;
  --ag-space-2: 8px;
  --ag-space-3: 12px;
  --ag-space-4: 16px;
  --ag-space-5: 24px;
  --ag-space-6: 32px;
  --ag-space-7: 40px;
  --ag-space-8: 48px;
  --ag-space-9: 56px;
  --ag-space-10: 80px;
  --ag-space-11: 120px;
  --ag-space-12: 150px;
  --ag-radius-card: 16px;
  --ag-radius-zone: 20px;
  --ag-radius-tooltip: 12px;
  --ag-radius-bar: 4px;
  --ag-radius-pill: 999px;
  --ag-stroke-hairline: 1px;
  --ag-stroke-zero: 1.5px;
  --ag-stroke-emphasis: 2px;
  --ag-stroke-edge: 2.5px;
  --ag-stroke-series: 3px;
  --ag-stroke-chain: 4px;
  --ag-stroke-dash-zone: 6 8;
  --ag-stroke-dash-frame: 8 9;
  --ag-stroke-dash-mark: 4 6;
  --ag-layout-presentation-canvas-w: 1920px;
  --ag-layout-presentation-canvas-h: 1080px;
  --ag-layout-presentation-pad-top: 120px;
  --ag-layout-presentation-pad-x: 150px;
  --ag-layout-presentation-pad-bottom: 110px;
  --ag-layout-presentation-content-w: 1620px;
  --ag-layout-presentation-kicker-gap: 28px;
  --ag-layout-presentation-block-gap: 56px;
  --ag-layout-presentation-block-gap-s: 36px;
  --ag-layout-presentation-grid-gap-l: 80px;
  --ag-layout-presentation-grid-gap: 60px;
  --ag-layout-presentation-grid-gap-s: 48px;
  --ag-layout-presentation-card-pad-y: 40px;
  --ag-layout-presentation-card-pad-x: 44px;
  --ag-layout-presentation-source-bottom: 44px;
  --ag-layout-presentation-h2-measure: 21em;
  --ag-layout-presentation-lead-measure: 33em;
  --ag-layout-web-container: 1280px;
  --ag-layout-web-page-x: clamp(20px, 4.4vw, 64px);
  --ag-layout-web-section-y: clamp(72px, 8.3vw, 120px);
  --ag-layout-web-kicker-gap: 16px;
  --ag-layout-web-block-gap: clamp(24px, 2.8vw, 40px);
  --ag-layout-web-grid-gap: clamp(24px, 3.3vw, 48px);
  --ag-layout-web-card-pad: clamp(24px, 2.2vw, 32px);
  --ag-layout-web-measure-h2: 21em;
  --ag-layout-web-measure-text: 36em;
  --ag-layout-web-lead-gap: clamp(16px, 1.7vw, 24px);
  --ag-layout-web-measure-lead: 33em;
  --ag-layout-web-logo-w: 132px;
  --ag-layout-web-hero-min-h: 88vh;
  --ag-effect-aurora-a-size: 900px;
  --ag-effect-aurora-a-left: -260px;
  --ag-effect-aurora-a-top: -320px;
  --ag-effect-aurora-a-color: #AAC8F0;
  --ag-effect-aurora-a-blur: 140px;
  --ag-effect-aurora-a-opacity: 0.16;
  --ag-effect-aurora-b-size: 800px;
  --ag-effect-aurora-b-right: -240px;
  --ag-effect-aurora-b-bottom: -360px;
  --ag-effect-aurora-b-color: #F3CDB3;
  --ag-effect-aurora-b-blur: 140px;
  --ag-effect-aurora-b-opacity: 0.16;
  --ag-effect-aurora-light-opacity: 0.32;
  --ag-effect-grain-tile: 160px;
  --ag-effect-grain-baseFrequency: 0.9;
  --ag-effect-grain-numOctaves: 2;
  --ag-effect-grain-opacity: 0.04;
  --ag-effect-glass-blur: 6px;
  --ag-effect-shadow-light: 0 12px 40px rgba(23,23,28,.06);
  --ag-motion-presentation-slide-duration: 600ms;
  --ag-motion-presentation-slide-easing: ease;
  --ag-motion-presentation-slide-property: opacity;
  --ag-motion-presentation-step-duration: 500ms;
  --ag-motion-presentation-step-easing: ease;
  --ag-motion-presentation-step-distance: 16px;
  --ag-motion-presentation-step-property: opacity, transform;
  --ag-motion-presentation-logo-duration: 2400ms;
  --ag-motion-presentation-logo-easing: cubic-bezier(.16,1,.3,1);
  --ag-motion-presentation-logo-distance: 120px;
  --ag-motion-presentation-logo-blur: 18px;
  --ag-motion-presentation-logo-property: opacity, transform, filter;
  --ag-motion-presentation-preshow-out-duration: 1200ms;
  --ag-motion-presentation-preshow-out-easing: ease;
  --ag-motion-presentation-teaser-fade: 1400ms;
  --ag-motion-presentation-teaser-easing: ease;
  --ag-motion-presentation-teaser-scaleFrom: 1.02;
  --ag-motion-presentation-teaser-scaleDuration: 6000ms;
  --ag-motion-presentation-teaser-scaleEasing: linear;
  --ag-motion-presentation-teaser-interval: 7000ms;
  --ag-motion-presentation-progress-duration: 400ms;
  --ag-motion-presentation-progress-height: 3px;
  --ag-motion-presentation-tooltip-duration: 150ms;
  --ag-motion-presentation-network-nodes: 46;
  --ag-motion-presentation-network-speed: 0.175;
  --ag-motion-presentation-network-linkDistance: 260;
  --ag-motion-presentation-network-linkAlpha: 0.35;
  --ag-motion-presentation-network-lineWidth: 1.4;
  --ag-motion-presentation-network-nodeRadius: 3.2;
  --ag-motion-presentation-network-canvasOpacity: 0.5;
  --ag-motion-web-hover-duration: 150ms;
  --ag-motion-web-hover-easing: ease-out;
  --ag-motion-web-state-duration: 200ms;
  --ag-motion-web-state-easing: ease;
  --ag-motion-web-reveal-duration: 400ms;
  --ag-motion-web-reveal-easing: cubic-bezier(.16,1,.3,1);
  --ag-motion-web-reveal-distance: 12px;
  --ag-motion-web-reveal-stagger: 80ms;
  --ag-motion-web-max: 600ms;
  --ag-type-display-family: var(--ag-font-sans);
  --ag-type-display-weight: 600;
  --ag-type-display-lh: 1.02;
  --ag-type-display-ls: -0.035em;
  --ag-type-display-size: clamp(52px, calc(38.63px + 3.429vw), 88px);
  --ag-type-display-size-presentation: 140px;
  --ag-type-display-lh-presentation: 1.02;
  --ag-type-h1-family: var(--ag-font-sans);
  --ag-type-h1-weight: 600;
  --ag-type-h1-lh: 1.02;
  --ag-type-h1-ls: -0.03em;
  --ag-type-h1-size: clamp(40px, calc(31.09px + 2.286vw), 64px);
  --ag-type-h1-size-presentation: 104px;
  --ag-type-h1-lh-presentation: 1.02;
  --ag-type-h2-family: var(--ag-font-sans);
  --ag-type-h2-weight: 600;
  --ag-type-h2-lh: 1.06;
  --ag-type-h2-ls: -0.025em;
  --ag-type-h2-size: clamp(30px, calc(24.06px + 1.524vw), 46px);
  --ag-type-h2-size-presentation: 72px;
  --ag-type-h2-lh-presentation: 1.06;
  --ag-type-h3-family: var(--ag-font-sans);
  --ag-type-h3-weight: 600;
  --ag-type-h3-lh: 1.15;
  --ag-type-h3-ls: -0.015em;
  --ag-type-h3-size: clamp(22px, calc(19.77px + 0.571vw), 28px);
  --ag-type-h3-size-presentation: 40px;
  --ag-type-h3-lh-presentation: 1.15;
  --ag-type-lead-family: var(--ag-font-sans);
  --ag-type-lead-weight: 400;
  --ag-type-lead-lh: 1.35;
  --ag-type-lead-ls: 0;
  --ag-type-lead-size: clamp(19px, calc(17.14px + 0.476vw), 24px);
  --ag-type-lead-size-presentation: 42px;
  --ag-type-lead-lh-presentation: 1.35;
  --ag-type-body-family: var(--ag-font-sans);
  --ag-type-body-weight: 400;
  --ag-type-body-lh: 1.6;
  --ag-type-body-ls: 0;
  --ag-type-body-size: clamp(17px, calc(16.26px + 0.190vw), 19px);
  --ag-type-body-size-presentation: 34px;
  --ag-type-body-lh-presentation: 1.45;
  --ag-type-caption-family: var(--ag-font-sans);
  --ag-type-caption-weight: 400;
  --ag-type-caption-lh: 1.4;
  --ag-type-caption-ls: 0;
  --ag-type-caption-size: clamp(14px, calc(13.26px + 0.190vw), 16px);
  --ag-type-caption-size-presentation: 26px;
  --ag-type-caption-lh-presentation: 1.4;
  --ag-type-kicker-family: var(--ag-font-mono);
  --ag-type-kicker-weight: 400;
  --ag-type-kicker-lh: 1.2;
  --ag-type-kicker-ls: 0.18em;
  --ag-type-kicker-size: clamp(12px, calc(11.63px + 0.095vw), 13px);
  --ag-type-kicker-size-presentation: 22px;
  --ag-type-kicker-lh-presentation: 1.2;
  --ag-type-metric-xl-family: var(--ag-font-mono);
  --ag-type-metric-xl-weight: 500;
  --ag-type-metric-xl-lh: 1.0;
  --ag-type-metric-xl-ls: -0.04em;
  --ag-type-metric-xl-size: clamp(52px, calc(41.60px + 2.667vw), 80px);
  --ag-type-metric-xl-size-presentation: 128px;
  --ag-type-metric-xl-lh-presentation: 1.0;
  --ag-type-metric-l-family: var(--ag-font-mono);
  --ag-type-metric-l-weight: 500;
  --ag-type-metric-l-lh: 1.0;
  --ag-type-metric-l-ls: -0.03em;
  --ag-type-metric-l-size: clamp(34px, calc(28.80px + 1.333vw), 48px);
  --ag-type-metric-l-size-presentation: 72px;
  --ag-type-metric-l-lh-presentation: 1.0;
  --ag-type-tag-family: var(--ag-font-mono);
  --ag-type-tag-weight: 400;
  --ag-type-tag-lh: 1.0;
  --ag-type-tag-ls: 0.12em;
  --ag-type-tag-size: clamp(11px, calc(10.63px + 0.095vw), 12px);
  --ag-type-tag-size-presentation: 20px;
  --ag-type-tag-lh-presentation: 1.0;
  --ag-type-source-family: var(--ag-font-mono);
  --ag-type-source-weight: 400;
  --ag-type-source-lh: 1.4;
  --ag-type-source-ls: 0.02em;
  --ag-type-source-size: clamp(12px, calc(12.00px + 0.000vw), 12px);
  --ag-type-source-size-presentation: 17px;
  --ag-type-source-lh-presentation: 1.4;
  --ag-type-chart-label-family: var(--ag-font-sans);
  --ag-type-chart-label-weight: 400;
  --ag-type-chart-label-lh: 1.2;
  --ag-type-chart-label-ls: 0;
  --ag-type-chart-label-size: clamp(12px, calc(11.26px + 0.190vw), 14px);
  --ag-type-chart-label-size-presentation: 22px;
  --ag-type-chart-label-lh-presentation: 1.2;
  --ag-type-chart-value-family: var(--ag-font-mono);
  --ag-type-chart-value-weight: 400;
  --ag-type-chart-value-lh: 1.2;
  --ag-type-chart-value-ls: 0;
  --ag-type-chart-value-size: clamp(13px, calc(12.26px + 0.190vw), 15px);
  --ag-type-chart-value-size-presentation: 24px;
  --ag-type-chart-value-lh-presentation: 1.2;
  --ag-type-quote-family: var(--ag-font-sans);
  --ag-type-quote-weight: 700;
  --ag-type-quote-lh: 1.4;
  --ag-type-quote-ls: -0.015em;
  --ag-type-quote-size: clamp(34px, calc(25.83px + 2.095vw), 56px);
  --ag-type-quote-size-presentation: 104px;
  --ag-type-quote-lh-presentation: 1.4;
}

:root, [data-ag-theme="dark"]{
  color-scheme: dark;
  --ag-bg: var(--ag-color-stage-bg);
  --ag-surface: var(--ag-color-stage-surface);
  --ag-raised: var(--ag-color-stage-raised);
  --ag-text-1: var(--ag-color-stage-text-1);
  --ag-text-2: var(--ag-color-stage-text-2);
  --ag-text-3: var(--ag-color-stage-text-3);
  --ag-text-4: var(--ag-color-stage-text-4);
  --ag-line: var(--ag-color-stage-line);
  --ag-line-strong: var(--ag-color-stage-line-strong);
  --ag-fill-card: var(--ag-color-stage-fill-card);
  --ag-accent: var(--ag-color-aurora-blue);
  --ag-chart-focus: var(--ag-color-chart-dark-focus);
  --ag-chart-context: var(--ag-color-chart-dark-context);
  --ag-chart-third: var(--ag-color-chart-dark-third);
  --ag-chart-seq-1: var(--ag-color-chart-dark-seq-1);
  --ag-chart-seq-2: var(--ag-color-chart-dark-seq-2);
  --ag-chart-seq-3: var(--ag-color-chart-dark-seq-3);
  --ag-chart-seq-4: var(--ag-color-chart-dark-seq-4);
  --ag-chart-zero: var(--ag-color-chart-dark-zero);
  --ag-chart-mark: var(--ag-color-chart-dark-mark);
  --ag-chart-mark-line: var(--ag-color-chart-dark-mark-line);
  --ag-aurora-opacity: var(--ag-effect-aurora-a-opacity);
  --ag-g-node-fill: var(--ag-color-graph-node-fill);
  --ag-g-node-stroke: var(--ag-color-graph-node-stroke);
  --ag-g-ext-fill: var(--ag-color-stage-fill-box);
  --ag-g-edge: var(--ag-color-graph-edge);
  --ag-g-edge-both: var(--ag-color-graph-edge-both);
  --ag-g-head: var(--ag-color-graph-edge-head);
  --ag-g-frame: var(--ag-color-graph-frame-dashed);
  --ag-g-zone-fill: var(--ag-color-stage-fill-zone);
  --ag-g-zone-stroke: var(--ag-color-stage-line);
  --ag-g-core-stroke: var(--ag-color-stage-line-strong);
  --ag-g-label-free: var(--ag-color-aurora-blue);
  --ag-g-label-closed: var(--ag-color-aurora-lavender);
  --ag-g-label-human: var(--ag-color-aurora-peach);
  --ag-tag-demo: var(--ag-color-status-demo);
  --ag-tag-future: var(--ag-color-status-future);
  --ag-tag-own: var(--ag-color-status-own);
  --ag-card-shadow: none;
}

[data-ag-theme="light"]{
  color-scheme: light;
  --ag-bg: var(--ag-color-paper-bg);
  --ag-surface: var(--ag-color-paper-surface);
  --ag-raised: var(--ag-color-paper-surface);
  --ag-text-1: var(--ag-color-paper-ink-1);
  --ag-text-2: var(--ag-color-paper-ink-2);
  --ag-text-3: var(--ag-color-paper-ink-3);
  --ag-text-4: var(--ag-color-paper-ink-3);
  --ag-line: var(--ag-color-paper-line);
  --ag-line-strong: var(--ag-color-paper-line-strong);
  --ag-fill-card: var(--ag-color-paper-fill-card);
  --ag-accent: var(--ag-color-chart-light-focus);
  --ag-chart-focus: var(--ag-color-chart-light-focus);
  --ag-chart-context: var(--ag-color-chart-light-context);
  --ag-chart-third: var(--ag-color-chart-light-third);
  --ag-chart-seq-1: var(--ag-color-chart-light-seq-1);
  --ag-chart-seq-2: var(--ag-color-chart-light-seq-2);
  --ag-chart-seq-3: var(--ag-color-chart-light-seq-3);
  --ag-chart-seq-4: var(--ag-color-chart-light-seq-4);
  --ag-chart-zero: var(--ag-color-chart-light-zero);
  --ag-chart-mark: var(--ag-color-chart-light-mark);
  --ag-chart-mark-line: var(--ag-color-chart-light-mark-line);
  --ag-aurora-opacity: var(--ag-effect-aurora-light-opacity);
  --ag-g-node-fill: var(--ag-color-paper-surface);
  --ag-g-node-stroke: var(--ag-color-paper-line-strong);
  --ag-g-ext-fill: var(--ag-color-paper-surface);
  --ag-g-edge: var(--ag-color-paper-ink-2);
  --ag-g-edge-both: var(--ag-color-paper-ink-2);
  --ag-g-head: var(--ag-color-paper-ink-2);
  --ag-g-frame: var(--ag-color-paper-line-strong);
  --ag-g-zone-fill: var(--ag-color-paper-bg);
  --ag-g-zone-stroke: var(--ag-color-paper-line);
  --ag-g-core-stroke: var(--ag-color-paper-line-strong);
  --ag-g-label-free: var(--ag-color-chart-light-focus);
  --ag-g-label-closed: var(--ag-color-chart-light-mark);
  --ag-g-label-human: var(--ag-color-chart-light-third);
  --ag-tag-demo: var(--ag-color-status-demo-ink-light);
  --ag-tag-future: var(--ag-color-chart-light-mark);
  --ag-tag-own: var(--ag-color-chart-light-focus);
  --ag-card-shadow: var(--ag-effect-shadow-light);
}

.ag-canvas{
  --ag-type-display-size: 140px;
  --ag-type-display-lh: 1.02;
  --ag-type-h1-size: 104px;
  --ag-type-h1-lh: 1.02;
  --ag-type-h2-size: 72px;
  --ag-type-h2-lh: 1.06;
  --ag-type-h3-size: 40px;
  --ag-type-h3-lh: 1.15;
  --ag-type-lead-size: 42px;
  --ag-type-lead-lh: 1.35;
  --ag-type-body-size: 34px;
  --ag-type-body-lh: 1.45;
  --ag-type-caption-size: 26px;
  --ag-type-caption-lh: 1.4;
  --ag-type-kicker-size: 22px;
  --ag-type-kicker-lh: 1.2;
  --ag-type-metric-xl-size: 128px;
  --ag-type-metric-xl-lh: 1.0;
  --ag-type-metric-l-size: 72px;
  --ag-type-metric-l-lh: 1.0;
  --ag-type-tag-size: 20px;
  --ag-type-tag-lh: 1.0;
  --ag-type-source-size: 17px;
  --ag-type-source-lh: 1.4;
  --ag-type-chart-label-size: 22px;
  --ag-type-chart-label-lh: 1.2;
  --ag-type-chart-value-size: 24px;
  --ag-type-chart-value-lh: 1.2;
  --ag-type-quote-size: 104px;
  --ag-type-quote-lh: 1.4;
}