/* Vantu — compiled stylesheet.
   Generated from the Vantu design system (tokens/*.css), flattened so the deployed
   site links ONE file. Regenerate rather than hand-editing. */

/* ===== tokens/fonts.css ===== */
/* Action / Vantu — webfonts.
   SUBSTITUTION NOTE: no licensed brand fonts were supplied. These are the closest
   Google Fonts matches and are served from fonts.gstatic.com via the Google CSS API.
   Swap the @import below for self-hosted @font-face rules when the real files land. */
@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Manrope:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap");

/* ===== tokens/colors.css ===== */
:root{
/* — Ink: the neutral spine. Cooler and cleaner than a warm grey; paper is a soft warm white — */
--ink-1000:#04060A;--ink-900:#0B0E14;--ink-800:#13171F;--ink-700:#1D222B;--ink-600:#2C323D;
--ink-500:#474F5C;--ink-400:#6F7887;--ink-300:#9BA3B0;--ink-200:#C6CCD5;--ink-150:#DEE2E8;
--ink-100:#E8EBEF;--ink-50:#F2F4F6;--ink-25:#FBFBFA;--ink-0:#FFFFFF;

/* — Jade: the accent. One saturated hue, used sparingly: rules, marks, key actions — */
--jade-900:#062B22;--jade-800:#0A3E30;--jade-700:#0E5442;--jade-600:#106E55;
--jade-500:#12866A;--jade-400:#1FA080;--jade-300:#4FBFA1;--jade-200:#9BDDCA;--jade-100:#D2F0E7;--jade-50:#EDFAF6;

/* — Sand: the secondary warm, for tinted surfaces and editorial panels only. Never an action — */
--sand-600:#8A7A5E;--sand-400:#C4B396;--sand-200:#E7DECB;--sand-100:#F3EDE1;--sand-50:#FAF7F0;

/* — Deprecated aliases: --brass-* now resolves to jade. Migrate to --jade-*. — */
--brass-900:var(--jade-900);--brass-800:var(--jade-800);--brass-700:var(--jade-700);--brass-600:var(--jade-600);
--brass-500:var(--jade-500);--brass-400:var(--jade-400);--brass-300:var(--jade-300);--brass-200:var(--jade-200);--brass-100:var(--jade-100);--brass-50:var(--jade-50);

/* — Semantic hues: clear, modern, still low-candy — */
--sage-600:#1B6B4B;--sage-500:#23855D;--sage-100:#D6EFE3;
--amber-600:#9A6B12;--amber-500:#C08A1E;--amber-100:#F7E9C8;
--clay-600:#9B3524;--clay-500:#BC4630;--clay-100:#FADFD9;
--slate-600:#28506E;--slate-500:#356588;--slate-100:#DCE8F2;

/* — Semantic aliases — */
--bg-page:var(--ink-25);--bg-inset:var(--ink-50);--bg-cinema:var(--ink-900);--bg-cinema-deep:var(--ink-1000);
--bg-tinted:var(--sand-50);
--surface-card:var(--ink-0);--surface-card-dark:var(--ink-800);--surface-raised:var(--ink-0);--surface-overlay:rgba(11,14,20,.72);
--text-heading:var(--ink-900);--text-body:var(--ink-700);--text-muted:var(--ink-400);--text-faint:var(--ink-300);
--text-on-dark:var(--ink-25);--text-on-dark-muted:var(--ink-300);--text-accent:var(--jade-600);--text-on-accent:var(--ink-0);--text-on-brass:var(--ink-0);
--border-hairline:var(--ink-150);--border-strong:var(--ink-300);--border-dark:rgba(255,255,255,.14);--border-accent:var(--jade-500);
--action-primary:var(--ink-900);--action-primary-fg:var(--ink-25);--action-primary-hover:var(--ink-700);--action-primary-press:var(--ink-1000);
--action-accent:var(--jade-500);--action-accent-hover:var(--jade-600);--action-accent-press:var(--jade-700);
--border-strong-hover:var(--ink-500);--surface-hover:var(--ink-50);--surface-press:var(--ink-100);
--field-disabled-bg:var(--ink-50);--field-disabled-fg:var(--text-muted);
--focus-ring:var(--jade-500);
--status-success:var(--sage-500);--status-warning:var(--amber-500);--status-danger:var(--clay-500);--status-info:var(--slate-500);
--film-grade-warm:rgba(18,134,106,.08);--film-scrim:linear-gradient(180deg,rgba(4,6,10,0) 0%,rgba(4,6,10,.70) 66%,rgba(4,6,10,.92) 100%); /* @kind other */
}

/* ===== tokens/typography.css ===== */
:root{
--font-display:"Instrument Serif","Bodoni Moda",Georgia,serif;
--font-ui:"Manrope","Helvetica Neue",Arial,sans-serif;
--font-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;

--size-display-1:clamp(38px,7vw,82px);--size-display-2:clamp(30px,5vw,62px);--size-display-3:clamp(26px,3.6vw,46px);
--size-title-1:clamp(24px,2.6vw,34px);--size-title-2:clamp(21px,2vw,27px);--size-title-3:clamp(18px,1.6vw,21px);
--size-body-lg:18px;--size-body:16px;--size-body-sm:14px;--size-caption:12.5px;--size-eyebrow:12px;

--leading-display:1.0;--leading-title:1.18;--leading-body:1.62;--leading-tight:1.3;
--tracking-display:-0.035em;--tracking-title:-0.022em;--tracking-body:0;--tracking-eyebrow:0.14em;--tracking-button:0.03em;

--weight-light:300;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;

--text-display-1:var(--weight-regular) var(--size-display-1)/var(--leading-display) var(--font-display);
--text-display-2:var(--weight-regular) var(--size-display-2)/var(--leading-display) var(--font-display);
--text-display-3:var(--weight-regular) var(--size-display-3)/var(--leading-title) var(--font-display);
--text-title-1:var(--weight-medium) var(--size-title-1)/var(--leading-title) var(--font-display);
--text-title-2:var(--weight-semibold) var(--size-title-2)/var(--leading-tight) var(--font-ui);
--text-title-3:var(--weight-semibold) var(--size-title-3)/var(--leading-tight) var(--font-ui);
--text-body-default:var(--weight-regular) var(--size-body)/var(--leading-body) var(--font-ui);
--text-body-lg:var(--weight-regular) var(--size-body-lg)/var(--leading-body) var(--font-ui);
--text-body-sm:var(--weight-regular) var(--size-body-sm)/var(--leading-body) var(--font-ui);
--text-caption:var(--weight-medium) var(--size-caption)/1.45 var(--font-ui);
--text-eyebrow:var(--weight-semibold) var(--size-eyebrow)/1.2 var(--font-ui);
}

/* ===== tokens/spacing.css ===== */
:root{
--space-0:0px;--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:20px;
--space-7:24px;--space-8:32px;--space-9:40px;--space-10:48px;--space-11:64px;--space-12:80px;--space-13:96px;--space-14:128px;--space-15:160px;
--gutter-inline:20px;--gutter-inline-lg:clamp(20px,5vw,64px); /* @kind spacing */
--section-y:clamp(56px,8vw,96px); /* @kind spacing */
--section-y-lg:clamp(72px,10vw,128px); /* @kind spacing */
--container-max:1240px;--container-narrow:720px;--measure:64ch;
--control-h-sm:32px;--control-h-md:42px;--control-h-lg:52px;
}

/* ===== tokens/radius.css ===== */
:root{
--radius-0:0px;--radius-xs:4px;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--radius-pill:999px;
--radius-control:var(--radius-sm);--radius-card:var(--radius-md);--radius-media:var(--radius-md);--radius-sheet:var(--radius-lg);
--hairline:1px;--rule-accent:2px;
}

/* ===== tokens/elevation.css ===== */
:root{
--shadow-0:none;
--shadow-1:0 1px 2px rgba(10,11,13,.05);
--shadow-2:0 2px 8px rgba(10,11,13,.06),0 1px 2px rgba(10,11,13,.04);
--shadow-3:0 10px 32px rgba(10,11,13,.09),0 2px 6px rgba(10,11,13,.05);
--shadow-4:0 24px 64px rgba(10,11,13,.16),0 6px 16px rgba(10,11,13,.07);
--shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);
--shadow-focus:0 0 0 2px var(--ink-0),0 0 0 4px var(--focus-ring);
--shadow-focus-dark:0 0 0 2px var(--ink-900),0 0 0 4px var(--focus-ring);
--shadow-media:0 30px 80px rgba(5,6,8,.28);
}

/* ===== tokens/motion.css ===== */
:root{
--dur-instant:90ms; /* @kind other */
--dur-fast:160ms; /* @kind other */
--dur-base:220ms; /* @kind other */
--dur-slow:360ms; /* @kind other */
--dur-cinematic:640ms; /* @kind other */
--ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
--ease-glide:cubic-bezier(.16,1,.3,1); /* @kind other */
--ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
--transition-control:color var(--dur-fast) var(--ease-standard),background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard),opacity var(--dur-fast) var(--ease-standard); /* @kind other */
--transition-reveal:opacity var(--dur-cinematic) var(--ease-glide),transform var(--dur-cinematic) var(--ease-glide); /* @kind other */
}

/* ===== tokens/glass.css ===== */
:root{
/* — Liquid glass: translucent surfaces that sit on the aurora field — */
--glass-fill:rgba(255,255,255,.52);
--glass-fill-strong:rgba(255,255,255,.72);
--glass-fill-subtle:rgba(255,255,255,.30);
--glass-fill-tinted:rgba(210,240,231,.42);
--glass-fill-mint:radial-gradient(620px 340px at 10% 0%,rgba(31,160,128,.22),transparent 64%),radial-gradient(520px 300px at 94% 8%,rgba(196,179,150,.26),transparent 66%),rgba(210,240,231,.42); /* @kind other */
--mint-fg:var(--jade-900);--mint-fg-muted:var(--jade-800);--mint-fg-accent:var(--jade-700);
--mint-border:rgba(255,255,255,.55);--mint-rule:rgba(255,255,255,.50);--mint-chip:rgba(255,255,255,.55);--mint-chip-border:rgba(255,255,255,.70);
--glass-fill-dark:rgba(11,14,20,.80);
--glass-fill-bar:rgba(255,255,255,.62);
--glass-border:rgba(255,255,255,.60);
--glass-border-quiet:rgba(255,255,255,.38);
--glass-border-dark:rgba(255,255,255,.12);
--glass-blur:blur(20px) saturate(150%); /* @kind other */
--glass-blur-heavy:blur(40px) saturate(160%); /* @kind other */
--glass-blur-light:blur(12px) saturate(140%); /* @kind other */
--glass-highlight:inset 0 1px 0 rgba(255,255,255,.80),inset 0 -1px 0 rgba(255,255,255,.22); /* @kind other */
--glass-highlight-dark:inset 0 1px 0 rgba(255,255,255,.14); /* @kind other */
--glass-shadow:0 18px 48px rgba(11,14,20,.10),0 2px 8px rgba(11,14,20,.05); /* @kind other */
--glass-shadow-lifted:0 30px 70px rgba(11,14,20,.14),0 4px 12px rgba(11,14,20,.06); /* @kind other */
--radius-glass:24px;

/* — Skeleton: base slab and the sheen that sweeps across it — */
--skeleton-base:var(--ink-100);
--skeleton-sheen:var(--ink-50);

/* — The aurora field: the only background glass is ever placed on — */
--field-aurora:radial-gradient(1100px 620px at 10% 4%,rgba(31,160,128,.20),transparent 62%),radial-gradient(900px 520px at 90% 10%,rgba(196,179,150,.30),transparent 64%),radial-gradient(1000px 720px at 52% 104%,rgba(155,221,202,.22),transparent 66%),var(--ink-25); /* @kind other */
--field-aurora-dark:radial-gradient(1000px 600px at 12% 0%,rgba(18,134,106,.28),transparent 60%),radial-gradient(900px 520px at 88% 8%,rgba(138,122,94,.22),transparent 62%),var(--ink-1000); /* @kind other */
}

/* ===== tokens/base.css ===== */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg-page);color:var(--text-body);font:var(--text-body-default);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,p{margin:0}
a{color:var(--text-accent);text-decoration:none;border-bottom:1px solid rgba(176,141,87,.35);transition:var(--transition-control)}
a:hover{color:var(--brass-800);border-bottom-color:var(--brass-700)}
::selection{background:var(--brass-200);color:var(--ink-900)}
.eyebrow{font:var(--text-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted)}
@keyframes ds-shimmer{0%{background-position:180% 0}100%{background-position:-80% 0}}
@keyframes ds-fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* Seamless marquee: the track holds the list twice, so the loop rewinds by half its
   width. Scrolling is native (wheel/trackpad/touch/drag); JS nudges scrollLeft per frame. */
.vt-rail-vp{scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
.vt-rail-vp::-webkit-scrollbar{display:none}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* ===== tokens/theme-dark.css ===== */
[data-theme="dark"]{
/* Surfaces */
--bg-page:var(--ink-900);--bg-inset:var(--ink-800);--bg-tinted:rgba(31,160,128,.08);
--surface-card:var(--ink-800);
--border-strong-hover:rgba(255,255,255,.42);--surface-hover:rgba(255,255,255,.09);--surface-press:rgba(255,255,255,.15);
--field-disabled-bg:var(--bg-inset);--field-disabled-fg:var(--text-muted);--surface-card-dark:var(--ink-700);--surface-raised:var(--ink-700);
--surface-overlay:rgba(4,6,10,.78);

/* Type */
--text-heading:var(--ink-25);--text-body:var(--ink-200);--text-muted:var(--ink-400);--text-faint:var(--ink-500);
--text-accent:var(--jade-300);--text-on-accent:var(--ink-1000);

/* Lines */
--border-hairline:rgba(255,255,255,.11);--border-strong:rgba(255,255,255,.24);--border-accent:var(--jade-400);

/* Actions — primary inverts to light-on-dark */
--action-primary:var(--ink-25);--action-primary-fg:var(--ink-900);
--action-primary-hover:var(--ink-0);--action-primary-press:var(--ink-200);
--action-accent:var(--jade-400);--action-accent-hover:var(--jade-300);--action-accent-press:var(--jade-500);
--border-strong-hover:var(--ink-500);--surface-hover:var(--ink-50);--surface-press:var(--ink-100);
--field-disabled-bg:var(--ink-50);--field-disabled-fg:var(--text-muted);
--focus-ring:var(--jade-400);

/* Tinted chips (Tag, Badge tone="brass") must not become light slabs */
--brass-50:rgba(31,160,128,.16);--brass-100:rgba(31,160,128,.22);--brass-800:var(--jade-200);--brass-700:var(--jade-300);

/* Semantic chip tints */
--sage-100:rgba(35,133,93,.20);--sage-500:var(--jade-300);--sage-600:var(--jade-200);
--amber-100:rgba(192,138,30,.20);--amber-500:#E0AE4A;--amber-600:#EFC876;
--clay-100:rgba(188,70,48,.20);--clay-500:#E0705A;--clay-600:#EF9584;
--slate-100:rgba(53,101,136,.22);--slate-500:#7FA8C6;--slate-600:#A3C3DA;

/* Glass inverts: thin light films instead of white slabs */
--glass-fill:rgba(255,255,255,.07);--glass-fill-strong:rgba(255,255,255,.12);
--glass-fill-subtle:rgba(255,255,255,.04);--glass-fill-tinted:rgba(31,160,128,.15);
--glass-fill-dark:rgba(4,6,10,.72);--glass-fill-bar:rgba(11,14,20,.74);
--glass-fill-mint:radial-gradient(620px 340px at 10% 0%,rgba(31,160,128,.30),transparent 64%),radial-gradient(520px 300px at 94% 8%,rgba(138,122,94,.22),transparent 66%),#123A31; /* @kind other */
/* On the deep-green panel the copy inverts — jade-900 text would be invisible */
--mint-fg:var(--ink-25);--mint-fg-muted:rgba(255,255,255,.82);--mint-fg-accent:var(--jade-200);
--mint-border:rgba(255,255,255,.16);--mint-rule:rgba(255,255,255,.14);--mint-chip:rgba(255,255,255,.10);--mint-chip-border:rgba(255,255,255,.18);
--glass-border:rgba(255,255,255,.15);--glass-border-quiet:rgba(255,255,255,.10);
--glass-highlight:inset 0 1px 0 rgba(255,255,255,.14); /* @kind other */
--glass-shadow:0 18px 48px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.30); /* @kind other */
--glass-shadow-lifted:0 30px 70px rgba(0,0,0,.55),0 4px 12px rgba(0,0,0,.35); /* @kind other */

/* Skeletons stay dark: a light slab would flash white on a near-black page */
--skeleton-base:rgba(255,255,255,.07);--skeleton-sheen:rgba(255,255,255,.14);

/* Elevation reads as depth, not as a drop shadow */
--shadow-1:0 1px 2px rgba(0,0,0,.40);
--shadow-2:0 2px 8px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.30);
--shadow-3:0 10px 32px rgba(0,0,0,.50),0 2px 6px rgba(0,0,0,.30);
--shadow-4:0 24px 64px rgba(0,0,0,.60),0 6px 16px rgba(0,0,0,.35);

--field-aurora:var(--field-aurora-dark); /* @kind other */
--film-scrim:linear-gradient(180deg,rgba(4,6,10,0) 0%,rgba(4,6,10,.66) 64%,rgba(4,6,10,.92) 100%); /* @kind other */
}
