/* Neotrium design tokens. Generated from tokens.json by build_tokens.py. Do not hand-edit. */
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  color-scheme: dark;
  --c-bg: 10 15 28;
  --c-band: 15 22 38;
  --c-surface: 19 28 47;
  --c-surface-raised: 27 38 57;
  --c-border: 35 46 69;
  --c-border-input: 107 115 136;
  --c-text: 242 245 250;
  --c-text-muted: 168 176 194;
  --c-text-subtle: 136 144 163;
  --c-text-faint: 107 115 136;
  --c-accent: 45 227 137;
  --c-accent-hover: 92 235 165;
  --c-accent-ink: 45 227 137;
  --c-accent-soft: 14 36 39;
  --c-accent-line: 20 79 61;
  --c-on-accent: 10 15 28;
  --c-danger: 255 122 110;
  --c-warning: 245 185 74;
  --c-success: 45 227 137;
  --focus-ring: rgb(var(--c-accent));

  --font-sans: Rubik, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --emphasis-weight: 500;
  --t-display-size: 56px;
  --t-display-line: 64px;
  --t-display-weight: 300;
  --t-display-tracking: -0.02em;
  --t-display-family: var(--font-sans);
  --t-h2-size: 42px;
  --t-h2-line: 50px;
  --t-h2-weight: 300;
  --t-h2-tracking: -0.015em;
  --t-h2-family: var(--font-sans);
  --t-h3-size: 32px;
  --t-h3-line: 40px;
  --t-h3-weight: 300;
  --t-h3-tracking: -0.01em;
  --t-h3-family: var(--font-sans);
  --t-h4-size: 24px;
  --t-h4-line: 32px;
  --t-h4-weight: 400;
  --t-h4-tracking: -0.005em;
  --t-h4-family: var(--font-sans);
  --t-lg-size: 20px;
  --t-lg-line: 30px;
  --t-lg-weight: 400;
  --t-lg-tracking: 0;
  --t-lg-family: var(--font-sans);
  --t-md-size: 18px;
  --t-md-line: 26px;
  --t-md-weight: 400;
  --t-md-tracking: -0.01em;
  --t-md-family: var(--font-sans);
  --t-base-size: 16px;
  --t-base-line: 24px;
  --t-base-weight: 400;
  --t-base-tracking: 0.01em;
  --t-base-family: var(--font-sans);
  --t-sm-size: 14px;
  --t-sm-line: 20px;
  --t-sm-weight: 400;
  --t-sm-tracking: 0;
  --t-sm-family: var(--font-sans);
  --t-xs-size: 12px;
  --t-xs-line: 16px;
  --t-xs-weight: 500;
  --t-xs-tracking: 0.12em;
  --t-xs-family: var(--font-mono);
  --t-2xs-size: 11px;
  --t-2xs-line: 14px;
  --t-2xs-weight: 500;
  --t-2xs-tracking: 0.04em;
  --t-2xs-family: var(--font-mono);
  --t-label-size: 13px;
  --t-label-line: 16px;
  --t-label-weight: 500;
  --t-label-tracking: 0.1em;
  --t-label-family: var(--font-mono);

  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 56px;
  --space-9: 80px;
  --space-10: 112px;
  --space-11: 160px;
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --shadow-btn: 0 4px 7px -5px rgba(0,0,0,.45);
  --shadow-card: inset 0 1px 0 rgba(242,245,250,.04), 0 16px 40px -12px rgba(0,0,0,.55);
  --shadow-pop: 0 24px 60px -16px rgba(0,0,0,.6);
  --shadow-glow: 0 12px 32px rgba(45,227,137,.35);
  --shadow-paper-card: 0 1px 2px rgba(10,15,28,.06), 0 8px 24px -12px rgba(10,15,28,.14);
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 360ms;
  --motion-ease: cubic-bezier(.44,0,.56,1);
  --motion-ease-out: cubic-bezier(.2,.8,.2,1);
  --glass-nav: rgba(10,15,28,.65);
  --glass-chip: rgba(242,245,250,.08);
  --glass-blur: 10px;

  --container: 1200px;
  --narrow: 840px;
  --text-col: 760px;
  --hero-text: 800px;
  --gutter: 40px;
  --section-y: 128px;
  --nav-w: 1000px;
  --nav-h: 64px;
  --nav-top: 16px;
}

/* Light section theme: put data-theme="paper" on any section. Same role names. */
[data-theme="paper"] {
  color-scheme: light;
  --c-bg: 242 245 250;
  --c-band: 231 235 242;
  --c-surface: 255 255 255;
  --c-surface-raised: 233 237 244;
  --c-border: 213 219 230;
  --c-border-input: 122 131 150;
  --c-text: 10 15 28;
  --c-text-muted: 69 78 98;
  --c-text-subtle: 91 100 120;
  --c-text-faint: 91 100 120;
  --c-accent: 45 227 137;
  --c-accent-hover: 37 200 119;
  --c-accent-ink: 8 112 63;
  --c-accent-soft: 210 242 232;
  --c-accent-line: 159 221 195;
  --c-on-accent: 10 15 28;
  --c-danger: 184 55 47;
  --c-warning: 138 90 12;
  --c-success: 8 112 63;
  --focus-ring: rgb(var(--c-accent-ink));
  --shadow-card: 0 1px 2px rgba(10,15,28,.06), 0 8px 24px -12px rgba(10,15,28,.14);
}

/* Kitchen section theme (Rawkure palette): where the protocol becomes food. Neon never appears here. */
[data-theme="kitchen"] {
  color-scheme: light;
  --c-bg: 247 245 239;
  --c-band: 239 235 224;
  --c-surface: 255 255 255;
  --c-surface-raised: 239 235 224;
  --c-border: 223 218 204;
  --c-border-input: 132 140 124;
  --c-text: 43 51 39;
  --c-text-muted: 86 95 79;
  --c-text-subtle: 100 109 93;
  --c-text-faint: 100 109 93;
  --c-accent: 78 102 63;
  --c-accent-hover: 63 84 51;
  --c-accent-ink: 78 102 63;
  --c-accent-soft: 230 235 221;
  --c-accent-line: 185 198 168;
  --c-on-accent: 247 245 239;
  --c-danger: 169 58 47;
  --c-warning: 126 90 18;
  --c-success: 78 102 63;
  --focus-ring: rgb(var(--c-accent-ink));
  --shadow-card: 0 1px 2px rgba(10,15,28,.06), 0 8px 24px -12px rgba(10,15,28,.14);
  --shadow-glow: 0 10px 28px rgba(78,102,63,.28);
}

@media (max-width: 1279px) {
  :root { --gutter: 32px; --section-y: 96px; }
}
@media (max-width: 809px) {
  :root {
    --gutter: 20px; --section-y: 72px;
    --t-display-size: 38px;
    --t-display-line: 44px;
    --t-h2-size: 30px;
    --t-h2-line: 36px;
    --t-h3-size: 24px;
    --t-h3-line: 30px;
    --t-h4-size: 20px;
    --t-h4-line: 28px;
  }
}

/* Type roles. Two-weight headline: wrap the second line in <strong>. */
.t-display { font-family: var(--t-display-family); font-size: var(--t-display-size); line-height: var(--t-display-line); font-weight: var(--t-display-weight); letter-spacing: var(--t-display-tracking); }
.t-h2 { font-family: var(--t-h2-family); font-size: var(--t-h2-size); line-height: var(--t-h2-line); font-weight: var(--t-h2-weight); letter-spacing: var(--t-h2-tracking); }
.t-h3 { font-family: var(--t-h3-family); font-size: var(--t-h3-size); line-height: var(--t-h3-line); font-weight: var(--t-h3-weight); letter-spacing: var(--t-h3-tracking); }
.t-h4 { font-family: var(--t-h4-family); font-size: var(--t-h4-size); line-height: var(--t-h4-line); font-weight: var(--t-h4-weight); letter-spacing: var(--t-h4-tracking); }
.t-lg { font-family: var(--t-lg-family); font-size: var(--t-lg-size); line-height: var(--t-lg-line); font-weight: var(--t-lg-weight); letter-spacing: var(--t-lg-tracking); }
.t-md { font-family: var(--t-md-family); font-size: var(--t-md-size); line-height: var(--t-md-line); font-weight: var(--t-md-weight); letter-spacing: var(--t-md-tracking); }
.t-base { font-family: var(--t-base-family); font-size: var(--t-base-size); line-height: var(--t-base-line); font-weight: var(--t-base-weight); letter-spacing: var(--t-base-tracking); }
.t-sm { font-family: var(--t-sm-family); font-size: var(--t-sm-size); line-height: var(--t-sm-line); font-weight: var(--t-sm-weight); letter-spacing: var(--t-sm-tracking); }
.t-xs { font-family: var(--t-xs-family); font-size: var(--t-xs-size); line-height: var(--t-xs-line); font-weight: var(--t-xs-weight); letter-spacing: var(--t-xs-tracking); text-transform: uppercase; }
.t-2xs { font-family: var(--t-2xs-family); font-size: var(--t-2xs-size); line-height: var(--t-2xs-line); font-weight: var(--t-2xs-weight); letter-spacing: var(--t-2xs-tracking); }
.t-label { font-family: var(--t-label-family); font-size: var(--t-label-size); line-height: var(--t-label-line); font-weight: var(--t-label-weight); letter-spacing: var(--t-label-tracking); text-transform: uppercase; }
.t-display strong, .t-h2 strong, .t-h3 strong { font-weight: var(--emphasis-weight); }

@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 0ms; --motion-base: 0ms; --motion-slow: 0ms; }
}
