/* Hallmark: Workbench; locked Hemu indigo system; semantic N/P/K accents. */
.nutrient-page {
  --nl-bg: var(--pi-canvas, #f7f8fc);
  --nl-surface: var(--pi-surface, #fff);
  --nl-soft: var(--pi-surface-soft, #f1f4fb);
  --nl-ink: var(--pi-ink, #1d2940);
  --nl-muted: var(--pi-muted, #627089);
  --nl-line: var(--pi-line, #dce3ef);
  --nl-accent: var(--pi-accent, #536ab6);
  --nl-strong: var(--pi-accent-strong, #405799);
  --nl-focus: var(--pi-focus, #384f9d);
  --nl-n: #1d754f; --nl-n-soft: #e5f3eb;
  --nl-p: #97600e; --nl-p-soft: #fff0d2;
  --nl-k: #3567b3; --nl-k-soft: #e8effb;
  --nl-soil: #d4c1a1; --nl-soil-side: #b4a287; --nl-soil-ink: #655b48;
  --nl-leaf: #55a377; --nl-leaf-deep: #287f53; --nl-root: #786752;
  --nl-danger: #b53243; --nl-danger-soft: #fff0f0;
  --nl-white: #fff; --nl-scrim: rgb(13 22 42 / 48%);
  --nl-action-ink: #fff; --nl-print-bg: #fff; --nl-print-ink: #111;
  --nl-print-muted: #333; --nl-print-line: #aaa;
  --nl-shadow: 0 12px 36px rgb(37 54 91 / 7%);
  --nl-dialog-shadow: 0 24px 80px rgb(12 22 43 / 22%);
  --nl-radius: 18px; --nl-radius-sm: 10px; --nl-radius-control: 8px;
  --nl-font: var(--font, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif);
  --nl-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --nl-control: 180ms; --nl-state: 320ms; --nl-entrance: 420ms;
  --nl-reveal: 360ms; --nl-product-enter: 380ms; --nl-chart-enter: 550ms;
  --nl-ease-out: cubic-bezier(.2,.8,.2,1);
  --nl-ease: cubic-bezier(.22,.75,.22,1); --nl-pop: cubic-bezier(.16,1.15,.32,1);
  --nl-rail: min(1368px, calc(100% - 80px));
  --nl-gutter: 24px; --nl-ring: 0 0 0 3px color-mix(in srgb, var(--nl-focus) 22%, transparent);
}
html[data-theme="dark"] .nutrient-page {
  --nl-action-ink: #152035;
  --nl-n: #81d3a5; --nl-n-soft: #233c32;
  --nl-p: #eec070; --nl-p-soft: #403624;
  --nl-k: #99bcf4; --nl-k-soft: #27374e;
  --nl-soil: #8a795c; --nl-soil-side: #655c4c; --nl-soil-ink: #272621;
  --nl-leaf: #72b992; --nl-leaf-deep: #48a579; --nl-root: #e4d1a9;
  --nl-danger: #ffa3ad; --nl-danger-soft: #422933;
  --nl-shadow: 0 12px 36px rgb(0 0 0 / 12%);
}
@media(max-width:900px){.nutrient-page{--nl-rail:calc(100% - 36px);--nl-gutter:20px}}
@media(max-width:520px){.nutrient-page{--nl-rail:calc(100% - 28px);--nl-gutter:18px}}

/* Reading and botanical illustration tokens for the 2026-10-04 refinement. */
.nutrient-page {
  --nl-text-xs: 12px; --nl-text-sm: 13px; --nl-text-body: 14px;
  --nl-text-input: 16px; --nl-text-panel: 28px;
  --nl-space-xs: 8px; --nl-space-sm: 12px; --nl-space-md: 16px;
  --nl-space-lg: 24px; --nl-space-xl: 32px;
  --nl-art-red-soft: color-mix(in srgb, var(--nl-danger) 14%, var(--nl-surface));
  --nl-art-earth-soft: color-mix(in srgb, var(--nl-soil) 42%, var(--nl-surface));
  --nl-dock-shadow: 0 -4px 24px color-mix(in srgb, var(--nl-ink) 8%, transparent);
}