:root {
    --nwdc-bg: #06151d;
    --nwdc-surface: #0b2d3b;
    --nwdc-surface-deep: #08232e;
    --nwdc-petrol: #105260;
    --nwdc-teal: #168f99;
    --nwdc-ocean-light: #72c8cc;
    --nwdc-text: #f4f7f6;
    --nwdc-muted: #a8bcc2;
    --nwdc-yellow: #ffd523;
    --nwdc-yellow-hover: #ffe164;
    --nwdc-amber: #f2a23a;
    --nwdc-orange: #e96a2d;
    --nwdc-line: #285362;
    --nwdc-control-line: #678d9a;
    --nwdc-logo-gray: #606363;
    --nwdc-white: #fff;
    --nwdc-paper: var(--nwdc-bg);
    --nwdc-ink: var(--nwdc-text);
    --nwdc-space-1: 8px;
    --nwdc-space-2: 16px;
    --nwdc-space-3: 24px;
    --nwdc-space-4: 32px;
    --nwdc-space-5: 40px;
    --nwdc-space-6: 48px;
    --nwdc-space-8: 64px;
    --nwdc-space-10: 80px;
    --nwdc-radius: 4px;
    --nwdc-content: 1280px;
    --nwdc-gutter: clamp(24px, 4.45vw, 64px);
    --nwdc-shell: calc(var(--nwdc-content) + 2 * var(--nwdc-gutter));
    --nwdc-display: Horizon, Inter, sans-serif;
    --nwdc-body: Inter, sans-serif;
    --nwdc-display-size: clamp(64px, 7.1vw, 104px);
    --nwdc-section-size: clamp(28px, 2.7vw, 40px);
    --nwdc-body-size: 16px;
    --nwdc-motion-duration: 500ms;
    --nwdc-motion-easing: cubic-bezier(.2,.65,.3,1);
    color-scheme: dark;
}
@media (max-width: 700px) {
    :root { --nwdc-gutter: 20px; --nwdc-display-size: clamp(30px, 8.5vw, 58px); }
}
@media (prefers-reduced-motion: reduce) { :root { --nwdc-motion-duration: 0ms; } }