/* Nomics Tech LP Kit — GERADO por scripts/build-kit.mjs. NÃO editar na mão. */

/* Nomics Tech Design Tokens — GERADO por build.mjs. NÃO editar na mão. Fonte: packages/tokens/src/ */
:root {
  --color-neutral-0: #FFFFFF;
  --color-neutral-25: #FBFBFE;
  --color-neutral-50: #F7F7FA;
  --color-neutral-100: #F0F0F3;
  --color-neutral-200: #E4E4E7;
  --color-neutral-300: #D4D4D7;
  --color-neutral-400: #B7B7BA;
  --color-neutral-500: #929295;
  --color-neutral-600: #6E6E71;
  --color-neutral-700: #4D4D4F;
  --color-neutral-800: #303030;
  --color-neutral-900: #212123;
  --color-neutral-950: #161618;
  --color-neutral-1000: #0C0C0E;
  --color-violet-50: #F7F5FF;
  --color-violet-100: #EDEAFF;
  --color-violet-200: #DDD6FE;
  --color-violet-300: #C7BDFE;
  --color-violet-400: #AF9DFF;
  --color-violet-500: #8C74F6;
  --color-violet-600: #6448E0;
  --color-violet-700: #5631C6;
  --color-violet-800: #4520AD;
  --color-violet-900: #330E8C;
  --color-violet-950: #23026F;
  --color-green-50: #EEFBEF;
  --color-green-100: #DAF5DD;
  --color-green-200: #BCEBC0;
  --color-green-300: #98DB9C;
  --color-green-400: #6EC575;
  --color-green-500: #3BA746;
  --color-green-600: #06811E;
  --color-green-700: #046B13;
  --color-green-800: #025808;
  --color-green-900: #004201;
  --color-green-950: #033001;
  --color-azure-50: #F0F8FF;
  --color-azure-100: #DDF0FF;
  --color-azure-200: #BDE2FE;
  --color-azure-300: #8FD0FF;
  --color-azure-400: #5FB7F3;
  --color-azure-500: #1597DB;
  --color-azure-600: #0572A7;
  --color-azure-700: #055E8A;
  --color-azure-800: #034D72;
  --color-azure-900: #023A56;
  --color-azure-950: #012A40;
  --color-red-50: #FFF4F3;
  --color-red-100: #FFE6E4;
  --color-red-200: #FFCFCB;
  --color-red-300: #FEB0AA;
  --color-red-400: #FE8581;
  --color-red-500: #E65658;
  --color-red-600: #BF2433;
  --color-red-700: #A70223;
  --color-red-800: #89021C;
  --color-red-900: #690214;
  --color-red-950: #4E010D;
  --color-amber-50: #FBF7E2;
  --color-amber-100: #F8EDC2;
  --color-amber-200: #F3DB8F;
  --color-amber-300: #ECC248;
  --color-amber-400: #D7A614;
  --color-amber-500: #B38508;
  --color-amber-600: #8A6302;
  --color-amber-700: #745006;
  --color-amber-800: #614002;
  --color-amber-900: #4B2F00;
  --color-amber-950: #382101;
  --color-teal-50: #EBFBF9;
  --color-teal-100: #D5F4F1;
  --color-teal-200: #B2E9E2;
  --color-teal-300: #85D9CF;
  --color-teal-400: #4DC4B7;
  --color-teal-500: #09A397;
  --color-teal-600: #017B71;
  --color-teal-700: #06665D;
  --color-teal-800: #05544B;
  --color-teal-900: #013F38;
  --color-teal-950: #012E28;
  --color-orange-50: #FFF5ED;
  --color-orange-100: #FFE8D8;
  --color-orange-200: #FFD2B4;
  --color-orange-300: #FFB482;
  --color-orange-400: #F29350;
  --color-orange-500: #D76C09;
  --color-orange-600: #A44F05;
  --color-orange-700: #8A4003;
  --color-orange-800: #733200;
  --color-orange-900: #572502;
  --color-orange-950: #421800;
  --color-orchid-50: #FFF2FC;
  --color-orchid-100: #FFE3F8;
  --color-orchid-200: #FACCF0;
  --color-orchid-300: #F0AEE4;
  --color-orchid-400: #DF8DD3;
  --color-orchid-500: #C365B8;
  --color-orchid-600: #9D3E95;
  --color-orchid-700: #862B81;
  --color-orchid-800: #711C6E;
  --color-orchid-900: #580C57;
  --color-orchid-950: #420343;
  --color-overlay-black-4: #0000000A;
  --color-overlay-white-4: #FFFFFF0A;
  --color-overlay-black-8: #00000014;
  --color-overlay-white-8: #FFFFFF14;
  --color-overlay-black-16: #00000029;
  --color-overlay-white-16: #FFFFFF29;
  --color-overlay-black-32: #00000052;
  --color-overlay-white-32: #FFFFFF52;
  --color-overlay-black-48: #0000007A;
  --color-overlay-white-48: #FFFFFF7A;
  --color-overlay-black-64: #000000A3;
  --color-overlay-white-64: #FFFFFFA3;
  --color-chart-1: #8C74F6;
  --color-chart-2: #09A397;
  --color-chart-3: #ECC248;
  --color-chart-4: #055E8A;
  --color-chart-5: #DF8DD3;
  --color-chart-6: #025808;
  --color-chart-7: #D76C09;
  --color-chart-8: #A70223;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --space-40: 160px;
  --space-48: 192px;
  --radius-none: 0px;
  --radius-xs: 2px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-3xl: 32px;
  --radius-full: 9999px;
  --border-width-0: 0px;
  --border-width-1: 1px;
  --border-width-2: 2px;
  --border-width-4: 4px;
  --border-subtle: #F0F0F3;
  --border-default: #E4E4E7;
  --border-strong: #B7B7BA;
  --border-focus: #6448E0;
  --border-interactive: #D4D4D7;
  --icon-size-xs: 12px;
  --icon-size-sm: 16px;
  --icon-size-md: 20px;
  --icon-size-lg: 24px;
  --icon-size-xl: 32px;
  --icon-size-2xl: 48px;
  --icon-stroke: 1.5px;
  --breakpoint-sm: 640px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
  --breakpoint-2xl: 1536px;
  --container-prose: 680px;
  --container-narrow: 880px;
  --container-default: 1200px;
  --container-wide: 1440px;
  --grid-columns: 12;
  --grid-gutter: 24px;
  --grid-margin: 24px;
  --z-base: 0;
  --z-dropdown: 1000;
  --z-sticky: 1100;
  --z-overlay: 1300;
  --z-modal: 1400;
  --z-popover: 1500;
  --z-toast: 1600;
  --z-tooltip: 1700;
  --motion-duration-instant: 0ms;
  --motion-duration-fast: 150ms;
  --motion-duration-normal: 250ms;
  --motion-duration-slow: 400ms;
  --motion-duration-slower: 600ms;
  --motion-easing-linear: linear;
  --motion-easing-in: cubic-bezier(0.4, 0, 1, 1);
  --motion-easing-out: cubic-bezier(0, 0, 0.2, 1);
  --motion-easing-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --motion-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --motion-easing-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55);
  --motion-transition-color: color 150ms cubic-bezier(0, 0, 0.2, 1), background-color 150ms cubic-bezier(0, 0, 0.2, 1), border-color 150ms cubic-bezier(0, 0, 0.2, 1);
  --motion-transition-transform: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --motion-transition-opacity: opacity 150ms cubic-bezier(0, 0, 0.2, 1);
  --motion-transition-all: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --font-family-display: 'Hedvig Letters Serif', Georgia, 'Times New Roman', serif;
  --font-family-body: 'Hedvig Letters Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-family-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-size-2xs: 0.6875rem;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  --font-size-7xl: 4.5rem;
  --font-leading-tight: 1.05;
  --font-leading-snug: 1.15;
  --font-leading-heading: 1.25;
  --font-leading-normal: 1.5;
  --font-leading-relaxed: 1.65;
  --font-leading-loose: 1.8;
  --font-tracking-tighter: -0.02em;
  --font-tracking-tight: -0.01em;
  --font-tracking-normal: 0em;
  --font-tracking-wide: 0.04em;
  --font-tracking-wider: 0.08em;
  --space-semantic-component-inline: 8px;
  --space-semantic-component-stack: 12px;
  --space-semantic-component-padding: 16px;
  --space-semantic-component-padding-lg: 24px;
  --space-semantic-section-y: 96px;
  --space-semantic-section-y-compact: 64px;
  --space-semantic-container-x: 24px;
  --surface-page: #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-sunken: #F7F7FA;
  --surface-overlay: #FFFFFF;
  --surface-inverse: #303030;
  --surface-brand-wash: #F7F5FF;
  --text-primary: #303030;
  --text-secondary: #6E6E71;
  --text-muted: #929295;
  --text-disabled: #B7B7BA;
  --text-inverse: #FFFFFF;
  --text-on-action: #FFFFFF;
  --text-link: #6448E0;
  --text-link-hover: #5631C6;
  --text-accent: #6448E0;
  --action-primary-default: #303030;
  --action-primary-hover: #212123;
  --action-primary-active: #161618;
  --action-primary-disabled: #D4D4D7;
  --action-secondary-default: #FFFFFF;
  --action-secondary-hover: #F7F7FA;
  --action-secondary-active: #F0F0F3;
  --action-secondary-disabled: #F7F7FA;
  --action-danger-default: #BF2433;
  --action-danger-hover: #A70223;
  --action-danger-active: #89021C;
  --action-danger-disabled: #FFCFCB;
  --action-ghost-default: #00000000;
  --action-ghost-hover: #0000000A;
  --action-ghost-active: #00000014;
  --feedback-success-bg: #EEFBEF;
  --feedback-success-border: #BCEBC0;
  --feedback-success-text: #046B13;
  --feedback-success-icon: #06811E;
  --feedback-warning-bg: #FBF7E2;
  --feedback-warning-border: #F3DB8F;
  --feedback-warning-text: #745006;
  --feedback-warning-icon: #8A6302;
  --feedback-danger-bg: #FFF4F3;
  --feedback-danger-border: #FFCFCB;
  --feedback-danger-text: #A70223;
  --feedback-danger-icon: #BF2433;
  --feedback-info-bg: #F0F8FF;
  --feedback-info-border: #BDE2FE;
  --feedback-info-text: #055E8A;
  --feedback-info-icon: #0572A7;
  --tint-1-bg: #EDEAFF;
  --tint-1-fg: #5631C6;
  --tint-2-bg: #D5F4F1;
  --tint-2-fg: #06665D;
  --tint-3-bg: #DAF5DD;
  --tint-3-fg: #046B13;
  --tint-4-bg: #F8EDC2;
  --tint-4-fg: #745006;
  --tint-5-bg: #FFE3F8;
  --tint-5-fg: #862B81;
  --tint-6-bg: #DDF0FF;
  --tint-6-fg: #055E8A;
  --elevation-0: none;
  --elevation-1: 0 1px 2px 0 rgba(12, 12, 14, 0.04);
  --elevation-2: 0 2px 4px -1px rgba(12, 12, 14, 0.06), 0 1px 2px 0 rgba(12, 12, 14, 0.04);
  --elevation-3: 0 8px 16px -4px rgba(12, 12, 14, 0.08), 0 2px 4px -1px rgba(12, 12, 14, 0.04);
  --elevation-4: 0 16px 32px -8px rgba(12, 12, 14, 0.12), 0 4px 8px -2px rgba(12, 12, 14, 0.05);
  --elevation-5: 0 24px 48px -12px rgba(12, 12, 14, 0.18), 0 8px 16px -4px rgba(12, 12, 14, 0.06);
  --button-radius: 8px;
  --button-border-width: 1px;
  --button-height-xs: 24px;
  --button-height-sm: 32px;
  --button-height-md: 40px;
  --button-height-lg: 48px;
  --button-height-xl: 56px;
  --button-padding-x-sm: 12px;
  --button-padding-x-md: 16px;
  --button-padding-x-lg: 24px;
  --button-primary-bg: #303030;
  --button-primary-bg-hover: #212123;
  --button-primary-bg-active: #161618;
  --button-primary-bg-disabled: #D4D4D7;
  --button-primary-fg: #FFFFFF;
  --button-secondary-bg: #FFFFFF;
  --button-secondary-bg-hover: #F7F7FA;
  --button-secondary-bg-active: #F0F0F3;
  --button-secondary-fg: #303030;
  --button-secondary-border: #D4D4D7;
  --button-danger-bg: #BF2433;
  --button-danger-bg-hover: #A70223;
  --button-danger-bg-active: #89021C;
  --button-danger-fg: #FFFFFF;
  --button-ghost-bg: #00000000;
  --button-ghost-bg-hover: #0000000A;
  --button-ghost-bg-active: #00000014;
  --button-ghost-fg: #303030;
  --input-radius: 8px;
  --input-height: 48px;
  --input-padding-x: 16px;
  --input-bg: #FFFFFF;
  --input-fg: #303030;
  --input-placeholder: #929295;
  --input-border: #D4D4D7;
  --input-border-hover: #B7B7BA;
  --input-border-focus: #6448E0;
  --input-border-error: #BF2433;
  --input-bg-disabled: #F7F7FA;
  --card-radius: 16px;
  --card-radius-lg: 24px;
  --card-padding: 24px;
  --card-padding-lg: 32px;
  --card-bg: #FFFFFF;
  --card-border: #E4E4E7;
  --card-shadow: 0 1px 2px 0 rgba(12, 12, 14, 0.04);
  --badge-radius: 9999px;
  --badge-padding-x: 12px;
  --badge-padding-y: 4px;
  --badge-neutral-bg: #F7F7FA;
  --badge-neutral-fg: #6E6E71;
  --badge-neutral-border: #E4E4E7;
  --badge-brand-bg: #F7F5FF;
  --badge-brand-fg: #6448E0;
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --focus-ring-color: #6448E0;
  --link-style-fg: #6448E0;
  --link-style-fg-hover: #5631C6;
  --link-style-underline-offset: 4px;
}

[data-theme="dark"] {
  --color-neutral-0: #FFFFFF;
  --color-neutral-25: #FBFBFE;
  --color-neutral-50: #F7F7FA;
  --color-neutral-100: #F0F0F3;
  --color-neutral-200: #E4E4E7;
  --color-neutral-300: #D4D4D7;
  --color-neutral-400: #B7B7BA;
  --color-neutral-500: #929295;
  --color-neutral-600: #6E6E71;
  --color-neutral-700: #4D4D4F;
  --color-neutral-800: #303030;
  --color-neutral-900: #212123;
  --color-neutral-950: #161618;
  --color-neutral-1000: #0C0C0E;
  --color-violet-50: #F7F5FF;
  --color-violet-100: #EDEAFF;
  --color-violet-200: #DDD6FE;
  --color-violet-300: #C7BDFE;
  --color-violet-400: #AF9DFF;
  --color-violet-500: #8C74F6;
  --color-violet-600: #6448E0;
  --color-violet-700: #5631C6;
  --color-violet-800: #4520AD;
  --color-violet-900: #330E8C;
  --color-violet-950: #23026F;
  --color-green-50: #EEFBEF;
  --color-green-100: #DAF5DD;
  --color-green-200: #BCEBC0;
  --color-green-300: #98DB9C;
  --color-green-400: #6EC575;
  --color-green-500: #3BA746;
  --color-green-600: #06811E;
  --color-green-700: #046B13;
  --color-green-800: #025808;
  --color-green-900: #004201;
  --color-green-950: #033001;
  --color-azure-50: #F0F8FF;
  --color-azure-100: #DDF0FF;
  --color-azure-200: #BDE2FE;
  --color-azure-300: #8FD0FF;
  --color-azure-400: #5FB7F3;
  --color-azure-500: #1597DB;
  --color-azure-600: #0572A7;
  --color-azure-700: #055E8A;
  --color-azure-800: #034D72;
  --color-azure-900: #023A56;
  --color-azure-950: #012A40;
  --color-red-50: #FFF4F3;
  --color-red-100: #FFE6E4;
  --color-red-200: #FFCFCB;
  --color-red-300: #FEB0AA;
  --color-red-400: #FE8581;
  --color-red-500: #E65658;
  --color-red-600: #BF2433;
  --color-red-700: #A70223;
  --color-red-800: #89021C;
  --color-red-900: #690214;
  --color-red-950: #4E010D;
  --color-amber-50: #FBF7E2;
  --color-amber-100: #F8EDC2;
  --color-amber-200: #F3DB8F;
  --color-amber-300: #ECC248;
  --color-amber-400: #D7A614;
  --color-amber-500: #B38508;
  --color-amber-600: #8A6302;
  --color-amber-700: #745006;
  --color-amber-800: #614002;
  --color-amber-900: #4B2F00;
  --color-amber-950: #382101;
  --color-teal-50: #EBFBF9;
  --color-teal-100: #D5F4F1;
  --color-teal-200: #B2E9E2;
  --color-teal-300: #85D9CF;
  --color-teal-400: #4DC4B7;
  --color-teal-500: #09A397;
  --color-teal-600: #017B71;
  --color-teal-700: #06665D;
  --color-teal-800: #05544B;
  --color-teal-900: #013F38;
  --color-teal-950: #012E28;
  --color-orange-50: #FFF5ED;
  --color-orange-100: #FFE8D8;
  --color-orange-200: #FFD2B4;
  --color-orange-300: #FFB482;
  --color-orange-400: #F29350;
  --color-orange-500: #D76C09;
  --color-orange-600: #A44F05;
  --color-orange-700: #8A4003;
  --color-orange-800: #733200;
  --color-orange-900: #572502;
  --color-orange-950: #421800;
  --color-orchid-50: #FFF2FC;
  --color-orchid-100: #FFE3F8;
  --color-orchid-200: #FACCF0;
  --color-orchid-300: #F0AEE4;
  --color-orchid-400: #DF8DD3;
  --color-orchid-500: #C365B8;
  --color-orchid-600: #9D3E95;
  --color-orchid-700: #862B81;
  --color-orchid-800: #711C6E;
  --color-orchid-900: #580C57;
  --color-orchid-950: #420343;
  --color-overlay-black-4: #0000000A;
  --color-overlay-white-4: #FFFFFF0A;
  --color-overlay-black-8: #00000014;
  --color-overlay-white-8: #FFFFFF14;
  --color-overlay-black-16: #00000029;
  --color-overlay-white-16: #FFFFFF29;
  --color-overlay-black-32: #00000052;
  --color-overlay-white-32: #FFFFFF52;
  --color-overlay-black-48: #0000007A;
  --color-overlay-white-48: #FFFFFF7A;
  --color-overlay-black-64: #000000A3;
  --color-overlay-white-64: #FFFFFFA3;
  --color-chart-1: #8C74F6;
  --color-chart-2: #09A397;
  --color-chart-3: #ECC248;
  --color-chart-4: #055E8A;
  --color-chart-5: #DF8DD3;
  --color-chart-6: #025808;
  --color-chart-7: #D76C09;
  --color-chart-8: #A70223;
  --border-subtle: #212123;
  --border-default: #303030;
  --border-strong: #6E6E71;
  --border-focus: #AF9DFF;
  --border-interactive: #4D4D4F;
  --surface-page: #161618;
  --surface-raised: #212123;
  --surface-sunken: #0C0C0E;
  --surface-overlay: #212123;
  --surface-inverse: #FFFFFF;
  --surface-brand-wash: #23026F;
  --text-primary: #F7F7FA;
  --text-secondary: #B7B7BA;
  --text-muted: #929295;
  --text-disabled: #6E6E71;
  --text-inverse: #303030;
  --text-on-action: #212123;
  --text-link: #AF9DFF;
  --text-link-hover: #C7BDFE;
  --text-accent: #AF9DFF;
  --action-primary-default: #F7F7FA;
  --action-primary-hover: #FFFFFF;
  --action-primary-active: #F0F0F3;
  --action-primary-disabled: #303030;
  --action-secondary-default: #212123;
  --action-secondary-hover: #303030;
  --action-secondary-active: #4D4D4F;
  --action-secondary-disabled: #212123;
  --action-danger-default: #FE8581;
  --action-danger-hover: #FEB0AA;
  --action-danger-active: #FFCFCB;
  --action-danger-disabled: #690214;
  --action-ghost-default: #FFFFFF00;
  --action-ghost-hover: #FFFFFF14;
  --action-ghost-active: #FFFFFF29;
  --feedback-success-bg: #033001;
  --feedback-success-border: #025808;
  --feedback-success-text: #98DB9C;
  --feedback-success-icon: #6EC575;
  --feedback-warning-bg: #382101;
  --feedback-warning-border: #614002;
  --feedback-warning-text: #ECC248;
  --feedback-warning-icon: #D7A614;
  --feedback-danger-bg: #4E010D;
  --feedback-danger-border: #89021C;
  --feedback-danger-text: #FEB0AA;
  --feedback-danger-icon: #FE8581;
  --feedback-info-bg: #012A40;
  --feedback-info-border: #034D72;
  --feedback-info-text: #8FD0FF;
  --feedback-info-icon: #5FB7F3;
  --tint-1-bg: #330E8C;
  --tint-1-fg: #C7BDFE;
  --tint-2-bg: #013F38;
  --tint-2-fg: #85D9CF;
  --tint-3-bg: #004201;
  --tint-3-fg: #98DB9C;
  --tint-4-bg: #4B2F00;
  --tint-4-fg: #ECC248;
  --tint-5-bg: #580C57;
  --tint-5-fg: #F0AEE4;
  --tint-6-bg: #023A56;
  --tint-6-fg: #8FD0FF;
  --elevation-0: none;
  --elevation-1: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
  --elevation-2: 0 2px 4px -1px rgba(0, 0, 0, 0.4), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --elevation-3: 0 8px 16px -4px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.35);
  --elevation-4: 0 16px 32px -8px rgba(0, 0, 0, 0.55), 0 4px 8px -2px rgba(0, 0, 0, 0.4);
  --elevation-5: 0 24px 48px -12px rgba(0, 0, 0, 0.6), 0 8px 16px -4px rgba(0, 0, 0, 0.45);
  --button-primary-bg: #F7F7FA;
  --button-primary-bg-hover: #FFFFFF;
  --button-primary-bg-active: #F0F0F3;
  --button-primary-bg-disabled: #303030;
  --button-primary-fg: #212123;
  --button-secondary-bg: #212123;
  --button-secondary-bg-hover: #303030;
  --button-secondary-bg-active: #4D4D4F;
  --button-secondary-fg: #F7F7FA;
  --button-secondary-border: #4D4D4F;
  --button-danger-bg: #FE8581;
  --button-danger-bg-hover: #FEB0AA;
  --button-danger-bg-active: #FFCFCB;
  --button-danger-fg: #212123;
  --button-ghost-bg: #FFFFFF00;
  --button-ghost-bg-hover: #FFFFFF14;
  --button-ghost-bg-active: #FFFFFF29;
  --button-ghost-fg: #F7F7FA;
  --input-bg: #212123;
  --input-fg: #F7F7FA;
  --input-placeholder: #929295;
  --input-border: #4D4D4F;
  --input-border-hover: #6E6E71;
  --input-border-focus: #AF9DFF;
  --input-border-error: #FE8581;
  --input-bg-disabled: #0C0C0E;
  --card-bg: #212123;
  --card-border: #303030;
  --card-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
  --badge-neutral-bg: #0C0C0E;
  --badge-neutral-fg: #B7B7BA;
  --badge-neutral-border: #303030;
  --badge-brand-bg: #23026F;
  --badge-brand-fg: #AF9DFF;
  --focus-ring-color: #AF9DFF;
  --link-style-fg: #AF9DFF;
  --link-style-fg-hover: #C7BDFE;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-neutral-0: #FFFFFF;
    --color-neutral-25: #FBFBFE;
    --color-neutral-50: #F7F7FA;
    --color-neutral-100: #F0F0F3;
    --color-neutral-200: #E4E4E7;
    --color-neutral-300: #D4D4D7;
    --color-neutral-400: #B7B7BA;
    --color-neutral-500: #929295;
    --color-neutral-600: #6E6E71;
    --color-neutral-700: #4D4D4F;
    --color-neutral-800: #303030;
    --color-neutral-900: #212123;
    --color-neutral-950: #161618;
    --color-neutral-1000: #0C0C0E;
    --color-violet-50: #F7F5FF;
    --color-violet-100: #EDEAFF;
    --color-violet-200: #DDD6FE;
    --color-violet-300: #C7BDFE;
    --color-violet-400: #AF9DFF;
    --color-violet-500: #8C74F6;
    --color-violet-600: #6448E0;
    --color-violet-700: #5631C6;
    --color-violet-800: #4520AD;
    --color-violet-900: #330E8C;
    --color-violet-950: #23026F;
    --color-green-50: #EEFBEF;
    --color-green-100: #DAF5DD;
    --color-green-200: #BCEBC0;
    --color-green-300: #98DB9C;
    --color-green-400: #6EC575;
    --color-green-500: #3BA746;
    --color-green-600: #06811E;
    --color-green-700: #046B13;
    --color-green-800: #025808;
    --color-green-900: #004201;
    --color-green-950: #033001;
    --color-azure-50: #F0F8FF;
    --color-azure-100: #DDF0FF;
    --color-azure-200: #BDE2FE;
    --color-azure-300: #8FD0FF;
    --color-azure-400: #5FB7F3;
    --color-azure-500: #1597DB;
    --color-azure-600: #0572A7;
    --color-azure-700: #055E8A;
    --color-azure-800: #034D72;
    --color-azure-900: #023A56;
    --color-azure-950: #012A40;
    --color-red-50: #FFF4F3;
    --color-red-100: #FFE6E4;
    --color-red-200: #FFCFCB;
    --color-red-300: #FEB0AA;
    --color-red-400: #FE8581;
    --color-red-500: #E65658;
    --color-red-600: #BF2433;
    --color-red-700: #A70223;
    --color-red-800: #89021C;
    --color-red-900: #690214;
    --color-red-950: #4E010D;
    --color-amber-50: #FBF7E2;
    --color-amber-100: #F8EDC2;
    --color-amber-200: #F3DB8F;
    --color-amber-300: #ECC248;
    --color-amber-400: #D7A614;
    --color-amber-500: #B38508;
    --color-amber-600: #8A6302;
    --color-amber-700: #745006;
    --color-amber-800: #614002;
    --color-amber-900: #4B2F00;
    --color-amber-950: #382101;
    --color-teal-50: #EBFBF9;
    --color-teal-100: #D5F4F1;
    --color-teal-200: #B2E9E2;
    --color-teal-300: #85D9CF;
    --color-teal-400: #4DC4B7;
    --color-teal-500: #09A397;
    --color-teal-600: #017B71;
    --color-teal-700: #06665D;
    --color-teal-800: #05544B;
    --color-teal-900: #013F38;
    --color-teal-950: #012E28;
    --color-orange-50: #FFF5ED;
    --color-orange-100: #FFE8D8;
    --color-orange-200: #FFD2B4;
    --color-orange-300: #FFB482;
    --color-orange-400: #F29350;
    --color-orange-500: #D76C09;
    --color-orange-600: #A44F05;
    --color-orange-700: #8A4003;
    --color-orange-800: #733200;
    --color-orange-900: #572502;
    --color-orange-950: #421800;
    --color-orchid-50: #FFF2FC;
    --color-orchid-100: #FFE3F8;
    --color-orchid-200: #FACCF0;
    --color-orchid-300: #F0AEE4;
    --color-orchid-400: #DF8DD3;
    --color-orchid-500: #C365B8;
    --color-orchid-600: #9D3E95;
    --color-orchid-700: #862B81;
    --color-orchid-800: #711C6E;
    --color-orchid-900: #580C57;
    --color-orchid-950: #420343;
    --color-overlay-black-4: #0000000A;
    --color-overlay-white-4: #FFFFFF0A;
    --color-overlay-black-8: #00000014;
    --color-overlay-white-8: #FFFFFF14;
    --color-overlay-black-16: #00000029;
    --color-overlay-white-16: #FFFFFF29;
    --color-overlay-black-32: #00000052;
    --color-overlay-white-32: #FFFFFF52;
    --color-overlay-black-48: #0000007A;
    --color-overlay-white-48: #FFFFFF7A;
    --color-overlay-black-64: #000000A3;
    --color-overlay-white-64: #FFFFFFA3;
    --color-chart-1: #8C74F6;
    --color-chart-2: #09A397;
    --color-chart-3: #ECC248;
    --color-chart-4: #055E8A;
    --color-chart-5: #DF8DD3;
    --color-chart-6: #025808;
    --color-chart-7: #D76C09;
    --color-chart-8: #A70223;
    --border-subtle: #212123;
    --border-default: #303030;
    --border-strong: #6E6E71;
    --border-focus: #AF9DFF;
    --border-interactive: #4D4D4F;
    --surface-page: #161618;
    --surface-raised: #212123;
    --surface-sunken: #0C0C0E;
    --surface-overlay: #212123;
    --surface-inverse: #FFFFFF;
    --surface-brand-wash: #23026F;
    --text-primary: #F7F7FA;
    --text-secondary: #B7B7BA;
    --text-muted: #929295;
    --text-disabled: #6E6E71;
    --text-inverse: #303030;
    --text-on-action: #212123;
    --text-link: #AF9DFF;
    --text-link-hover: #C7BDFE;
    --text-accent: #AF9DFF;
    --action-primary-default: #F7F7FA;
    --action-primary-hover: #FFFFFF;
    --action-primary-active: #F0F0F3;
    --action-primary-disabled: #303030;
    --action-secondary-default: #212123;
    --action-secondary-hover: #303030;
    --action-secondary-active: #4D4D4F;
    --action-secondary-disabled: #212123;
    --action-danger-default: #FE8581;
    --action-danger-hover: #FEB0AA;
    --action-danger-active: #FFCFCB;
    --action-danger-disabled: #690214;
    --action-ghost-default: #FFFFFF00;
    --action-ghost-hover: #FFFFFF14;
    --action-ghost-active: #FFFFFF29;
    --feedback-success-bg: #033001;
    --feedback-success-border: #025808;
    --feedback-success-text: #98DB9C;
    --feedback-success-icon: #6EC575;
    --feedback-warning-bg: #382101;
    --feedback-warning-border: #614002;
    --feedback-warning-text: #ECC248;
    --feedback-warning-icon: #D7A614;
    --feedback-danger-bg: #4E010D;
    --feedback-danger-border: #89021C;
    --feedback-danger-text: #FEB0AA;
    --feedback-danger-icon: #FE8581;
    --feedback-info-bg: #012A40;
    --feedback-info-border: #034D72;
    --feedback-info-text: #8FD0FF;
    --feedback-info-icon: #5FB7F3;
    --tint-1-bg: #330E8C;
    --tint-1-fg: #C7BDFE;
    --tint-2-bg: #013F38;
    --tint-2-fg: #85D9CF;
    --tint-3-bg: #004201;
    --tint-3-fg: #98DB9C;
    --tint-4-bg: #4B2F00;
    --tint-4-fg: #ECC248;
    --tint-5-bg: #580C57;
    --tint-5-fg: #F0AEE4;
    --tint-6-bg: #023A56;
    --tint-6-fg: #8FD0FF;
    --elevation-0: none;
    --elevation-1: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
    --elevation-2: 0 2px 4px -1px rgba(0, 0, 0, 0.4), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    --elevation-3: 0 8px 16px -4px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.35);
    --elevation-4: 0 16px 32px -8px rgba(0, 0, 0, 0.55), 0 4px 8px -2px rgba(0, 0, 0, 0.4);
    --elevation-5: 0 24px 48px -12px rgba(0, 0, 0, 0.6), 0 8px 16px -4px rgba(0, 0, 0, 0.45);
    --button-primary-bg: #F7F7FA;
    --button-primary-bg-hover: #FFFFFF;
    --button-primary-bg-active: #F0F0F3;
    --button-primary-bg-disabled: #303030;
    --button-primary-fg: #212123;
    --button-secondary-bg: #212123;
    --button-secondary-bg-hover: #303030;
    --button-secondary-bg-active: #4D4D4F;
    --button-secondary-fg: #F7F7FA;
    --button-secondary-border: #4D4D4F;
    --button-danger-bg: #FE8581;
    --button-danger-bg-hover: #FEB0AA;
    --button-danger-bg-active: #FFCFCB;
    --button-danger-fg: #212123;
    --button-ghost-bg: #FFFFFF00;
    --button-ghost-bg-hover: #FFFFFF14;
    --button-ghost-bg-active: #FFFFFF29;
    --button-ghost-fg: #F7F7FA;
    --input-bg: #212123;
    --input-fg: #F7F7FA;
    --input-placeholder: #929295;
    --input-border: #4D4D4F;
    --input-border-hover: #6E6E71;
    --input-border-focus: #AF9DFF;
    --input-border-error: #FE8581;
    --input-bg-disabled: #0C0C0E;
    --card-bg: #212123;
    --card-border: #303030;
    --card-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.35);
    --badge-neutral-bg: #0C0C0E;
    --badge-neutral-fg: #B7B7BA;
    --badge-neutral-border: #303030;
    --badge-brand-bg: #23026F;
    --badge-brand-fg: #AF9DFF;
    --focus-ring-color: #AF9DFF;
    --link-style-fg: #AF9DFF;
    --link-style-fg-hover: #C7BDFE;
  }
}

/* Estilos compostos — classes utilitárias. Labels/overline: aplicar text-transform: uppercase no consumo. */
.nt-type-display-hero {
  font-family: var(--font-family-display);
  font-size: clamp(2.2500rem, 1.1250rem + 4.5000vw, 4.5000rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.01em;
}
.nt-type-display-lg {
  font-family: var(--font-family-display);
  font-size: clamp(1.8750rem, 0.9375rem + 3.7500vw, 3.7500rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.01em;
}
.nt-type-heading-1 {
  font-family: var(--font-family-display);
  font-size: clamp(1.8750rem, 1.3125rem + 2.2500vw, 3.0000rem);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -0.01em;
}
.nt-type-heading-2 {
  font-family: var(--font-family-display);
  font-size: clamp(1.5000rem, 1.1250rem + 1.5000vw, 2.2500rem);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0em;
}
.nt-type-heading-3 {
  font-family: var(--font-family-display);
  font-size: clamp(1.2500rem, 0.9375rem + 1.2500vw, 1.8750rem);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0em;
}
.nt-type-heading-4 {
  font-family: var(--font-family-body);
  font-size: var(--font-size-2xl);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0em;
}
.nt-type-heading-5 {
  font-family: var(--font-family-body);
  font-size: var(--font-size-xl);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0em;
}
.nt-type-heading-6 {
  font-family: var(--font-family-body);
  font-size: var(--font-size-lg);
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0em;
}
.nt-type-body-lg {
  font-family: var(--font-family-body);
  font-size: var(--font-size-lg);
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: 0em;
}
.nt-type-body-base {
  font-family: var(--font-family-body);
  font-size: var(--font-size-base);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0em;
}
.nt-type-body-sm {
  font-family: var(--font-family-body);
  font-size: var(--font-size-sm);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0em;
}
.nt-type-label-base {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}
.nt-type-label-sm {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}
.nt-type-caption {
  font-family: var(--font-family-body);
  font-size: var(--font-size-xs);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0em;
}
.nt-type-overline {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.08em;
}
.nt-type-code {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  font-weight: 400;
  line-height: 1.65;
  letter-spacing: 0em;
}
.nt-type-stat {
  font-family: var(--font-family-display);
  font-size: var(--font-size-5xl);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: 0em;
}


/* @nomicstech/ui — GERADO por build-css.mjs. Requer tokens.css carregado antes. */

/* ─── styles/base.css ─── */
/* Fundação compartilhada dos componentes nt-* */
.nt-focusable:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}

.nt-sr-only {
  position: absolute;
  width: 1px; /* nt-allow-hardcode: padrão universal de screen-reader-only */
  height: 1px; /* nt-allow-hardcode: idem */
  padding: 0;
  margin: -1px; /* nt-allow-hardcode: idem */
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ─── avatar/avatar.css ─── */
/* Avatar — iniciais com tinta determinística (tokens tint.*), fallback silhueta. */
.nt-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--surface-sunken);
  color: var(--text-secondary);
  font-family: var(--font-family-mono);
  font-weight: var(--font-weight-medium);
  flex: none;
}
.nt-avatar--circle { border-radius: var(--radius-full); }
.nt-avatar--square { border-radius: var(--radius-md); }

.nt-avatar--xs { width: var(--space-6); height: var(--space-6); font-size: var(--font-size-2xs); }
.nt-avatar--sm { width: var(--space-8); height: var(--space-8); font-size: var(--font-size-2xs); }
.nt-avatar--md { width: var(--space-10); height: var(--space-10); font-size: var(--font-size-xs); }
.nt-avatar--lg { width: var(--space-12); height: var(--space-12); font-size: var(--font-size-sm); }
.nt-avatar--xl { width: var(--space-16); height: var(--space-16); font-size: var(--font-size-lg); }

.nt-avatar__img { width: 100%; height: 100%; object-fit: cover; }
.nt-avatar__fallback { width: 60%; height: 60%; opacity: 0.6; }

.nt-avatar--tint-1 { background: var(--tint-1-bg); color: var(--tint-1-fg); }
.nt-avatar--tint-2 { background: var(--tint-2-bg); color: var(--tint-2-fg); }
.nt-avatar--tint-3 { background: var(--tint-3-bg); color: var(--tint-3-fg); }
.nt-avatar--tint-4 { background: var(--tint-4-bg); color: var(--tint-4-fg); }
.nt-avatar--tint-5 { background: var(--tint-5-bg); color: var(--tint-5-fg); }
.nt-avatar--tint-6 { background: var(--tint-6-bg); color: var(--tint-6-fg); }

.nt-avatar-group { display: inline-flex; align-items: center; }
.nt-avatar-group .nt-avatar { border: var(--border-width-2) solid var(--surface-page); }
.nt-avatar-group .nt-avatar + .nt-avatar { margin-left: calc(var(--space-2) * -1); }
.nt-avatar__counter { background: var(--surface-inverse); color: var(--text-inverse); }

/* ─── badge/badge.css ─── */
/* Badge — pill mono uppercase; cores 100% dos tokens feedback/badge. */
.nt-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-family-mono);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  border-radius: var(--badge-radius);
  border: var(--border-width-1) solid transparent;
}
.nt-badge--md { font-size: var(--font-size-2xs); padding: var(--badge-padding-y) var(--badge-padding-x); }
.nt-badge--sm { font-size: var(--font-size-2xs); padding: 0 var(--space-2); }

.nt-badge__dot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); background: currentColor; }

.nt-badge__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: calc(var(--space-1) * -1);
  padding: 0;
  background: none;
  border: none;
  border-radius: var(--radius-full);
  color: inherit;
  cursor: pointer;
  opacity: 0.7;
  transition: var(--motion-transition-opacity);
}
.nt-badge__remove:hover { opacity: 1; }

.nt-badge--neutral { background: var(--badge-neutral-bg); color: var(--badge-neutral-fg); border-color: var(--badge-neutral-border); }
.nt-badge--brand { background: var(--badge-brand-bg); color: var(--badge-brand-fg); }
.nt-badge--success { background: var(--feedback-success-bg); color: var(--feedback-success-text); border-color: var(--feedback-success-border); }
.nt-badge--warning { background: var(--feedback-warning-bg); color: var(--feedback-warning-text); border-color: var(--feedback-warning-border); }
.nt-badge--danger { background: var(--feedback-danger-bg); color: var(--feedback-danger-text); border-color: var(--feedback-danger-border); }
.nt-badge--info { background: var(--feedback-info-bg); color: var(--feedback-info-text); border-color: var(--feedback-info-border); }

/* ─── button/button.css ─── */
/* Button — consome tokens semânticos/componente. Label mono UPPERCASE = voz técnica. */
.nt-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family-mono);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  text-decoration: none;
  border: var(--button-border-width) solid transparent;
  border-radius: var(--button-radius);
  cursor: pointer;
  transition: var(--motion-transition-color), var(--motion-transition-transform);
  user-select: none;
}
.nt-btn:active:not(:disabled) { transform: scale(0.98); }
.nt-btn:disabled { cursor: not-allowed; }

.nt-btn__content { display: inline-flex; align-items: center; gap: var(--space-2); }
.nt-btn--loading .nt-btn__content { visibility: hidden; }
.nt-btn__spinner { position: absolute; inset: 0; display: grid; place-items: center; }

/* Tamanhos */
.nt-btn--xs { height: var(--button-height-xs); padding: 0 var(--button-padding-x-sm); font-size: var(--font-size-2xs); }
.nt-btn--sm { height: var(--button-height-sm); padding: 0 var(--button-padding-x-sm); font-size: var(--font-size-xs); }
.nt-btn--md { height: var(--button-height-md); padding: 0 var(--button-padding-x-md); font-size: var(--font-size-sm); }
.nt-btn--lg { height: var(--button-height-lg); padding: 0 var(--button-padding-x-lg); font-size: var(--font-size-sm); }
.nt-btn--xl { height: var(--button-height-xl); padding: 0 var(--button-padding-x-lg); font-size: var(--font-size-base); }
.nt-btn--full { width: 100%; box-sizing: border-box; }

/* Variantes */
.nt-btn--primary { background: var(--button-primary-bg); color: var(--button-primary-fg); }
.nt-btn--primary:hover:not(:disabled) { background: var(--button-primary-bg-hover); }
.nt-btn--primary:active:not(:disabled) { background: var(--button-primary-bg-active); }
.nt-btn--primary:disabled { background: var(--button-primary-bg-disabled); }

.nt-btn--secondary { background: var(--surface-sunken); color: var(--text-primary); }
.nt-btn--secondary:hover:not(:disabled) { background: var(--action-secondary-active); }
.nt-btn--secondary:active:not(:disabled) { background: var(--action-secondary-active); }
.nt-btn--secondary:disabled { color: var(--text-disabled); }

.nt-btn--outline { background: var(--button-secondary-bg); color: var(--button-secondary-fg); border-color: var(--button-secondary-border); }
.nt-btn--outline:hover:not(:disabled) { background: var(--button-secondary-bg-hover); }
.nt-btn--outline:active:not(:disabled) { background: var(--button-secondary-bg-active); }
.nt-btn--outline:disabled { color: var(--text-disabled); }

.nt-btn--ghost { background: var(--button-ghost-bg); color: var(--button-ghost-fg); }
.nt-btn--ghost:hover:not(:disabled) { background: var(--button-ghost-bg-hover); }
.nt-btn--ghost:active:not(:disabled) { background: var(--button-ghost-bg-active); }
.nt-btn--ghost:disabled { color: var(--text-disabled); }

.nt-btn--danger { background: var(--button-danger-bg); color: var(--button-danger-fg); }
.nt-btn--danger:hover:not(:disabled) { background: var(--button-danger-bg-hover); }
.nt-btn--danger:active:not(:disabled) { background: var(--button-danger-bg-active); }
.nt-btn--danger:disabled { background: var(--action-danger-disabled); }

.nt-btn--link { background: none; border: none; color: var(--link-style-fg); height: auto; padding: 0; text-decoration: underline; text-underline-offset: var(--link-style-underline-offset); }
.nt-btn--link:hover:not(:disabled) { color: var(--link-style-fg-hover); }
.nt-btn--link:disabled { color: var(--text-disabled); }

@media (prefers-reduced-motion: reduce) {
  .nt-btn, .nt-btn:active:not(:disabled) { transition: none; transform: none; }
}

/* Em dark, o primário claro ganha um anel sutil para assentar na superfície (nada de bloco "vazado") */
[data-theme='dark'] .nt-btn--primary {
  box-shadow: inset 0 0 0 var(--border-width-1) var(--color-overlay-white-16), var(--elevation-2);
}

/* ─── code/code.css ─── */
/* Code — mono sobre superfície sunken, hairline. */
.nt-code {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  background: var(--surface-sunken);
  border: var(--border-width-1) solid var(--border-subtle);
  border-radius: var(--radius-xs);
  padding: 0 var(--space-1);
  color: var(--text-secondary);
}

.nt-codeblock {
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-md);
  background: var(--surface-sunken);
  overflow: hidden;
}
.nt-codeblock__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-4);
  border-bottom: var(--border-width-1) solid var(--border-subtle);
}
.nt-codeblock__lang {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-muted);
}
.nt-codeblock__copy {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1);
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  cursor: pointer;
  transition: var(--motion-transition-color);
}
.nt-codeblock__copy:hover { color: var(--text-primary); }
.nt-codeblock__pre {
  margin: 0;
  padding: var(--space-4) var(--space-5);
  overflow-x: auto;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  line-height: var(--font-leading-relaxed);
  color: var(--text-secondary);
}

/* ─── data/data.css ─── */
/* Dados — Table, Card, Stat, Timeline, Accordion, List. */

/* Table */
.nt-table { width: 100%; border-collapse: collapse; border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-lg); }
.nt-table__th {
  text-align: left;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-muted);
  background: var(--surface-sunken);
  padding: var(--space-3) var(--space-4);
  border-bottom: var(--border-width-1) solid var(--border-default);
  cursor: default;
  outline: none;
}
.nt-table__th[data-allows-sorting] { cursor: pointer; }
.nt-table__th[data-focus-visible] { outline: var(--focus-ring-width) solid var(--focus-ring-color); outline-offset: calc(var(--focus-ring-offset) * -1); }
.nt-table__th-inner { display: inline-flex; align-items: center; gap: var(--space-1); }
.nt-table__sort { transition: var(--motion-transition-transform), var(--motion-transition-opacity); }
.nt-table__sort--asc { transform: rotate(180deg); }
.nt-table__sort--idle { opacity: 0.3; }
.nt-table__td { padding: var(--space-4); font-size: var(--font-size-sm); color: var(--text-primary); border-bottom: var(--border-width-1) solid var(--border-subtle); outline: none; }
.nt-table--compact .nt-table__td { padding: var(--space-2) var(--space-4); }
.nt-table__row { transition: var(--motion-transition-color); outline: none; }
.nt-table__row[data-hovered] { background: var(--surface-sunken); }
.nt-table__row[data-selected] { background: var(--surface-brand-wash); }
.nt-table__row[data-focus-visible] { outline: var(--focus-ring-width) solid var(--focus-ring-color); outline-offset: calc(var(--focus-ring-offset) * -1); }
.nt-table__cell--numeric { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--font-family-mono); }
.nt-table-skeleton { display: flex; flex-direction: column; gap: var(--space-3); }

/* Card */
.nt-card {
  background: var(--card-bg);
  border: var(--border-width-1) solid var(--card-border);
  border-radius: var(--card-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.nt-card--interactive { cursor: pointer; }
.nt-card__media img { display: block; width: 100%; }
.nt-card__header { padding: var(--space-5) var(--card-padding) 0; font-family: var(--font-family-display); font-size: var(--font-size-xl); }
.nt-card__body { padding: var(--card-padding); flex: 1; font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-card__footer { padding: var(--space-4) var(--card-padding); border-top: var(--border-width-1) solid var(--border-subtle); display: flex; gap: var(--space-3); align-items: center; }

/* Stat */
.nt-stat { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--card-padding); border: var(--border-width-1) solid var(--card-border); border-radius: var(--card-radius); background: var(--card-bg); }
.nt-stat__label {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-muted);
}
.nt-stat__value { font-family: var(--font-family-display); font-size: var(--font-size-4xl); line-height: var(--font-leading-tight); color: var(--text-primary); }
.nt-stat__foot { display: flex; align-items: center; gap: var(--space-4); min-height: var(--space-6); }
.nt-stat__delta { font-family: var(--font-family-mono); font-size: var(--font-size-xs); }
.nt-stat__delta--up { color: var(--feedback-success-text); }
.nt-stat__delta--down { color: var(--feedback-danger-text); }
.nt-stat__delta--flat { color: var(--text-muted); }
.nt-stat__spark { flex: 1; height: var(--space-6); }
.nt-stat__spark polyline { stroke: var(--text-accent); stroke-width: var(--border-width-2); }

/* Timeline */
.nt-timeline { list-style: none; margin: 0; padding: 0; }
.nt-timeline__item { position: relative; padding: 0 0 var(--space-6) var(--space-8); }
.nt-timeline__item::before {
  content: '';
  position: absolute;
  left: calc(var(--space-2) - var(--border-width-1));
  top: var(--space-5);
  bottom: 0;
  width: var(--border-width-1);
  background: var(--border-default);
}
.nt-timeline__item:last-child::before { display: none; }
.nt-timeline__dot {
  position: absolute;
  left: 0;
  top: var(--space-1);
  width: var(--space-4);
  height: var(--space-4);
  border-radius: var(--radius-full);
  border: var(--border-width-2) solid var(--border-strong);
  background: var(--surface-page);
}
.nt-timeline__item--success .nt-timeline__dot { border-color: var(--feedback-success-icon); }
.nt-timeline__item--danger .nt-timeline__dot { border-color: var(--feedback-danger-icon); }
.nt-timeline__content { display: flex; flex-direction: column; gap: var(--space-1); }
.nt-timeline__meta { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }
.nt-timeline__title { font-size: var(--font-size-base); color: var(--text-primary); }
.nt-timeline__description { font-size: var(--font-size-sm); color: var(--text-secondary); }

/* Accordion */
.nt-accordion { display: flex; flex-direction: column; }
.nt-accordion__item { border-bottom: var(--border-width-1) solid var(--border-default); }
.nt-accordion__heading { margin: 0; }
.nt-accordion__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-5) 0;
  background: none;
  border: none;
  font-family: var(--font-family-body);
  font-size: var(--font-size-lg);
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
  border-radius: var(--radius-sm);
}
.nt-accordion__chevron { color: var(--text-muted); transition: var(--motion-transition-transform); flex: none; }
.nt-accordion__item[data-expanded] .nt-accordion__chevron { transform: rotate(180deg); }
.nt-accordion__panel { padding: 0 0 var(--space-5); font-size: var(--font-size-base); color: var(--text-secondary); line-height: var(--font-leading-relaxed); }

/* List */
.nt-list { list-style: none; margin: 0; padding: 0; }
.nt-list__item { padding: var(--space-3) 0; font-size: var(--font-size-sm); color: var(--text-primary); }
.nt-list--divided .nt-list__item + .nt-list__item { border-top: var(--border-width-1) solid var(--border-subtle); }

/* ─── divider/divider.css ─── */
/* Divider — hairline border.default. */
.nt-divider--horizontal { border-top: var(--border-width-1) solid var(--border-default); }
.nt-divider--vertical {
  display: inline-block;
  align-self: stretch;
  width: var(--border-width-1);
  min-height: var(--space-4);
  background: var(--border-default);
}
.nt-divider--labeled {
  border: none;
  display: flex;
  align-items: center;
  gap: var(--space-4);
}
.nt-divider--labeled::before,
.nt-divider--labeled::after {
  content: '';
  flex: 1;
  border-top: var(--border-width-1) solid var(--border-default);
}
.nt-divider__label {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ─── feedback/feedback.css ─── */
/* Feedback — Alert/Banner/Toast compartilham a paleta nt-alert--*. */
.nt-alert {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  padding: var(--space-4);
  border-radius: var(--radius-md);
  border: var(--border-width-1) solid;
  font-size: var(--font-size-sm);
}
.nt-alert--success { background: var(--feedback-success-bg); border-color: var(--feedback-success-border); color: var(--feedback-success-text); }
.nt-alert--warning { background: var(--feedback-warning-bg); border-color: var(--feedback-warning-border); color: var(--feedback-warning-text); }
.nt-alert--danger { background: var(--feedback-danger-bg); border-color: var(--feedback-danger-border); color: var(--feedback-danger-text); }
.nt-alert--info { background: var(--feedback-info-bg); border-color: var(--feedback-info-border); color: var(--feedback-info-text); }
.nt-alert__icon { margin-top: var(--space-1); flex: none; }
.nt-alert__body { display: flex; flex-direction: column; gap: var(--space-1); flex: 1; }
.nt-alert__title {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
}
.nt-alert__dismiss {
  display: inline-flex;
  padding: var(--space-1);
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  color: inherit;
  opacity: 0.7;
  cursor: pointer;
  transition: var(--motion-transition-opacity);
}
.nt-alert__dismiss:hover { opacity: 1; }

.nt-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-6);
  border-bottom: var(--border-width-1) solid;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
}

/* Toast */
.nt-toaster {
  position: fixed;
  z-index: var(--z-toast);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: var(--space-6);
  pointer-events: none;
  max-width: 100%;
}
.nt-toaster--bottom-right { bottom: 0; right: 0; }
.nt-toaster--bottom-left { bottom: 0; left: 0; }
.nt-toaster--top-right { top: 0; right: 0; }
.nt-toaster--top-left { top: 0; left: 0; }
.nt-toast {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  width: var(--space-48);
  min-width: fit-content;
  padding: var(--space-4);
  border-radius: var(--radius-md);
  border: var(--border-width-1) solid;
  box-shadow: var(--elevation-4);
  background-clip: padding-box;
  pointer-events: auto;
  animation: nt-fade-up var(--motion-duration-normal) var(--motion-easing-out) both;
}
.nt-toast__action {
  background: none;
  border: none;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  color: inherit;
  text-decoration: underline;
  cursor: pointer;
}
@media (prefers-reduced-motion: reduce) { .nt-toast { animation: none; } }

/* Progress */
.nt-progress { display: flex; flex-direction: column; gap: var(--space-2); }
.nt-progress__track { height: var(--space-2); background: var(--border-default); border-radius: var(--radius-full); overflow: hidden; }
.nt-progress__fill { height: 100%; background: var(--action-primary-default); border-radius: var(--radius-full); transition: width var(--motion-duration-normal) var(--motion-easing-out); }
.nt-progress__fill--indeterminate { width: 40%; animation: nt-progress-slide calc(var(--motion-duration-slower) * 2) var(--motion-easing-in-out) infinite; }
@keyframes nt-progress-slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(350%); }
}
@media (prefers-reduced-motion: reduce) { .nt-progress__fill--indeterminate { animation: none; width: 100%; opacity: 0.5; } }

.nt-progress-circle { position: relative; display: inline-grid; place-items: center; }
.nt-progress-circle--sm { width: var(--space-10); height: var(--space-10); }
.nt-progress-circle--md { width: var(--space-16); height: var(--space-16); }
.nt-progress-circle--lg { width: var(--space-24); height: var(--space-24); }
.nt-progress-circle svg { position: absolute; inset: 0; transform: rotate(-90deg); width: 100%; height: 100%; }
.nt-progress-circle circle { fill: none; stroke-width: var(--space-2); }
.nt-progress-circle__track { stroke: var(--border-default); }
.nt-progress-circle__fill { stroke: var(--action-primary-default); stroke-linecap: round; transition: stroke-dashoffset var(--motion-duration-slow) var(--motion-easing-out); }
.nt-progress-circle__value { font-family: var(--font-family-mono); font-size: var(--font-size-xs); color: var(--text-secondary); }
.nt-progress-circle--sm .nt-progress-circle__value { font-size: var(--font-size-2xs); }

/* Empty / Error */
.nt-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-3);
  padding: var(--space-16) var(--space-8);
  border: var(--border-width-1) dashed var(--border-default);
  border-radius: var(--radius-xl);
}
.nt-empty__media { color: var(--text-muted); }
.nt-empty__error-icon { color: var(--feedback-danger-icon); }
.nt-empty__title { margin: 0; font-family: var(--font-family-display); font-size: var(--font-size-2xl); color: var(--text-primary); }
.nt-empty__description { margin: 0; font-size: var(--font-size-sm); color: var(--text-secondary); max-width: var(--container-prose); }
.nt-empty__action { margin-top: var(--space-3); }

/* ─── form-advanced/form-advanced.css ─── */
/* 5B — Combobox, Slider, DatePicker/TimeField (react-aria-components) e FileUpload. */

/* Popover + ListBox compartilhados */
.nt-popover {
  background: var(--surface-overlay);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--elevation-3);
  min-width: var(--trigger-width, auto);
  overflow: hidden;
}
.nt-listbox { max-height: 40vh; overflow: auto; padding: var(--space-2); outline: none; }
.nt-listbox__empty {
  display: block;
  padding: var(--space-3) var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--text-muted);
}
.nt-option {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  cursor: pointer;
  outline: none;
  transition: var(--motion-transition-color);
}
.nt-option[data-focused] { background: var(--action-secondary-active); }
.nt-option[data-selected] { background: var(--surface-brand-wash); color: var(--text-accent); }
.nt-option__label { font-size: var(--font-size-base); }
.nt-option__description { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Slider */
.nt-slider { display: flex; flex-direction: column; gap: var(--space-3); }
.nt-slider__head { display: flex; justify-content: space-between; align-items: baseline; }
.nt-slider__output { font-family: var(--font-family-mono); font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-slider__track {
  position: relative;
  height: var(--space-1);
  background: var(--border-default);
  border-radius: var(--radius-full);
  margin: var(--space-2) 0;
}
.nt-slider__fill { position: absolute; top: 0; bottom: 0; background: var(--action-primary-default); border-radius: var(--radius-full); }
.nt-slider__thumb {
  width: var(--space-5);
  height: var(--space-5);
  border-radius: var(--radius-full);
  background: var(--surface-raised);
  border: var(--border-width-2) solid var(--action-primary-default);
  top: 50%;
  transition: var(--motion-transition-transform);
}
.nt-slider__thumb[data-dragging] { transform: scale(1.15); }
.nt-slider__marks { position: relative; height: var(--space-5); }
.nt-slider__mark {
  position: absolute;
  transform: translateX(-50%);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  color: var(--text-muted);
}

/* DateField / TimeField */
.nt-datefield { gap: var(--space-1); }
.nt-datefield__input { display: flex; flex: 1; align-items: center; }
.nt-datefield__segment {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-base);
  color: var(--input-fg);
  padding: 0 var(--space-1);
  border-radius: var(--radius-xs);
  outline: none;
  caret-color: transparent;
}
.nt-datefield__segment[data-placeholder] { color: var(--input-placeholder); }
.nt-datefield__segment:focus { background: var(--action-primary-default); color: var(--text-on-action); }

/* Calendário */
.nt-calendar-dialog { padding: var(--space-4); outline: none; }
.nt-calendar__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-3); }
.nt-calendar__title {
  font-family: var(--font-family-display);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-regular);
  text-transform: capitalize;
}
.nt-calendar__grid { border-collapse: collapse; }
.nt-calendar__weekday {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  text-transform: uppercase;
  color: var(--text-muted);
  padding-bottom: var(--space-2);
}
.nt-calendar__cell {
  width: var(--space-10);
  height: var(--space-10);
  display: grid;
  place-items: center;
  font-size: var(--font-size-sm);
  border-radius: var(--radius-sm);
  cursor: pointer;
  outline: none;
  transition: var(--motion-transition-color);
}
.nt-calendar__cell[data-hovered] { background: var(--action-secondary-active); }
.nt-calendar__cell[data-selected] { background: var(--action-primary-default); color: var(--text-on-action); }
.nt-calendar__cell[data-outside-month] { color: var(--text-disabled); }
.nt-calendar__cell[data-focus-visible] {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}
.nt-calendar__cell[data-disabled] { color: var(--text-disabled); cursor: not-allowed; }

/* FileUpload */
.nt-dropzone {
  border: var(--border-width-1) dashed var(--border-strong);
  border-radius: var(--radius-lg);
  background: var(--surface-sunken);
  padding: var(--space-8);
  text-align: center;
  transition: var(--motion-transition-color);
}
.nt-dropzone--over { border-color: var(--border-focus); background: var(--surface-brand-wash); }
.nt-dropzone--disabled { opacity: 0.6; }
.nt-dropzone__cta { display: flex; flex-direction: column; gap: var(--space-1); cursor: pointer; }
.nt-dropzone__action {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  color: var(--text-link);
}
.nt-dropzone__hint { font-size: var(--font-size-xs); color: var(--text-muted); }
.nt-dropzone:has(.nt-check__input:focus-visible) {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}

.nt-filelist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.nt-filelist__item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-3);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-md);
}
.nt-filelist__thumb { width: var(--space-8); height: var(--space-8); object-fit: cover; border-radius: var(--radius-sm); }
.nt-filelist__name { flex: 1; font-size: var(--font-size-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-filelist__size { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-muted); }
.nt-filelist__progress {
  width: var(--space-24);
  height: var(--space-1);
  background: var(--border-default);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.nt-filelist__progress-fill { display: block; height: 100%; background: var(--action-primary-default); transition: width var(--motion-duration-normal) var(--motion-easing-out); }

/* ─── form/check.css ─── */
/* Checkbox + Radio — nativos estilizados. O input real fica invisível mas focável;
   a caixa desenhada reage via seletores de irmão. */
.nt-check {
  display: inline-flex;
  align-items: flex-start;
  gap: var(--space-3);
  cursor: pointer;
  position: relative;
}
.nt-check--disabled { cursor: not-allowed; }

.nt-check__input {
  position: absolute;
  width: 1px; /* nt-allow-hardcode: padrão sr-only */
  height: 1px; /* nt-allow-hardcode: padrão sr-only */
  margin: -1px; /* nt-allow-hardcode: padrão sr-only */
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.nt-check__box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--space-5);
  height: var(--space-5);
  margin-top: var(--space-1);
  background: var(--input-bg);
  border: var(--border-width-1) solid var(--input-border);
  border-radius: var(--radius-sm);
  color: var(--text-on-action);
  transition: var(--motion-transition-color);
  flex: none;
}
.nt-check__box--radio { border-radius: var(--radius-full); }

.nt-check:hover .nt-check__box { border-color: var(--input-border-hover); }
.nt-check__input:focus-visible + .nt-check__box {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}
/* Atenção: radios de grupo sem seleção casam com :indeterminate — escopo restrito a checkbox. */
.nt-check__input:checked + .nt-check__box,
.nt-check__input[type='checkbox']:indeterminate + .nt-check__box {
  background: var(--action-primary-default);
  border-color: var(--action-primary-default);
}
.nt-check__input:disabled + .nt-check__box { background: var(--input-bg-disabled); border-color: var(--border-subtle); }

.nt-check__mark { width: var(--icon-size-xs); height: var(--icon-size-xs); stroke-width: var(--border-width-2); display: none; }
.nt-check__input:checked + .nt-check__box .nt-check__mark--check { display: block; }
.nt-check__input[type='checkbox']:indeterminate + .nt-check__box .nt-check__mark--check { display: none; }
.nt-check__input[type='checkbox']:indeterminate + .nt-check__box .nt-check__mark--dash { display: block; }

.nt-check__dot {
  width: var(--space-2);
  height: var(--space-2);
  border-radius: var(--radius-full);
  background: var(--text-on-action);
  transform: scale(0);
  transition: var(--motion-transition-transform);
}
.nt-check__input:checked + .nt-check__box .nt-check__dot { transform: scale(1); }

.nt-check__text { display: flex; flex-direction: column; gap: var(--space-1); }
.nt-check__label { font-size: var(--font-size-base); color: var(--text-primary); line-height: var(--font-leading-normal); }
.nt-check__description { font-size: var(--font-size-xs); color: var(--text-muted); line-height: var(--font-leading-normal); }
.nt-check--disabled .nt-check__label { color: var(--text-disabled); }
.nt-check--invalid .nt-check__box { border-color: var(--input-border-error); }

/* Radio card — opção com borda (faixas de faturamento, planos) */
.nt-radio--card {
  border: var(--border-width-1) solid var(--border-interactive);
  border-radius: var(--radius-md);
  padding: var(--space-4);
  transition: var(--motion-transition-color);
  flex: 1;
}
.nt-radio--card:hover { border-color: var(--border-strong); }
.nt-radio--card:has(.nt-check__input:checked) {
  border-color: var(--border-focus);
  background: var(--surface-brand-wash);
}

/* Grupos */
.nt-check-group { border: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.nt-check-group__items { display: flex; gap: var(--space-3); }
.nt-check-group__items--vertical { flex-direction: column; }
.nt-check-group__items--horizontal { flex-direction: row; flex-wrap: wrap; gap: var(--space-4); }

/* ─── form/field.css ─── */
/* Field — label mono (voz técnica), descrição e erro em sans. */
.nt-field { display: flex; flex-direction: column; gap: var(--space-2); }
.nt-field__label {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  color: var(--text-secondary);
  display: inline-flex;
  gap: var(--space-1);
  width: fit-content;
}
.nt-field__required { color: var(--feedback-danger-icon); }
.nt-field__description {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--text-muted);
  line-height: var(--font-leading-normal);
}
.nt-field__error {
  margin: 0;
  font-size: var(--font-size-xs);
  color: var(--feedback-danger-text);
  line-height: var(--font-leading-normal);
}
.nt-field--disabled .nt-field__label { color: var(--text-disabled); }

/* ─── form/input.css ─── */
/* Input — caixa hairline, foco violeta, erro vermelho AA.
   Base tem ALTURA e fonte legível por padrão (>=16px evita zoom no iOS); modificadores só ajustam. */
.nt-input {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  height: var(--input-height);
  font-family: var(--font-family-body);
  font-size: var(--font-size-md);
  color: var(--input-fg);
  background: var(--input-bg);
  border: var(--border-width-1) solid var(--input-border);
  border-radius: var(--input-radius);
  padding: 0 var(--input-padding-x);
  transition: var(--motion-transition-color);
  flex: 1 1 auto; /* basis auto: em coluna (nt-field) a height vale; flex:1 zerava a base e esmagava o campo */
}
.nt-input:hover:not(.nt-input--disabled) { border-color: var(--input-border-hover); }
.nt-input:focus-within {
  border-color: var(--input-border-focus);
  box-shadow: 0 0 0 var(--border-width-1) var(--input-border-focus);
}
.nt-input--invalid,
.nt-input--invalid:hover { border-color: var(--input-border-error); }
.nt-input--invalid:focus-within { box-shadow: 0 0 0 var(--border-width-1) var(--input-border-error); }
.nt-input--disabled { background: var(--input-bg-disabled); }

.nt-input--sm { height: var(--space-10); }
.nt-input--md { height: var(--input-height); }
.nt-input--lg { height: 56px; } /* nt-allow-hardcode: espelha button.height.xl (CTA de LP) */

.nt-input__control {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: none;
  outline: none;
  background: transparent;
  color: var(--input-fg);
  font-family: var(--font-family-body);
  font-size: var(--font-size-base);
}
.nt-input__control::placeholder { color: var(--input-placeholder); }
.nt-input__control:disabled { color: var(--text-disabled); cursor: not-allowed; }
.nt-input__control::-webkit-search-cancel-button { display: none; }

.nt-input__affix { display: inline-flex; align-items: center; color: var(--text-muted); font-size: var(--font-size-sm); }
.nt-input__action {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1);
  margin-right: calc(var(--space-1) * -1);
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  color: var(--text-muted);
  cursor: pointer;
  transition: var(--motion-transition-color);
}
.nt-input__action:hover { color: var(--text-primary); }

.nt-input-group { display: flex; align-items: stretch; flex: 1; }
.nt-input-group__addon {
  display: inline-flex;
  align-items: center;
  padding: 0 var(--space-3);
  background: var(--surface-sunken);
  border: var(--border-width-1) solid var(--input-border);
  color: var(--text-secondary);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
}
.nt-input-group__addon:first-child { border-right: none; border-radius: var(--input-radius) 0 0 var(--input-radius); }
.nt-input-group__addon:last-child { border-left: none; border-radius: 0 var(--input-radius) var(--input-radius) 0; }
.nt-input-group .nt-input:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.nt-input-group .nt-input:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.nt-input-wrap { display: flex; flex-direction: column; gap: var(--space-1); flex: 1; }
.nt-input__count {
  align-self: flex-end;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  color: var(--text-muted);
}

/* ─── form/pin-input.css ─── */
/* PinInput — células mono quadradas. */
.nt-pin { display: inline-flex; gap: var(--space-2); }
.nt-pin__cell {
  width: var(--input-height);
  height: var(--input-height);
  text-align: center;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xl);
  color: var(--input-fg);
  background: var(--input-bg);
  border: var(--border-width-1) solid var(--input-border);
  border-radius: var(--input-radius);
  transition: var(--motion-transition-color);
}
.nt-pin__cell:hover:not(:disabled) { border-color: var(--input-border-hover); }
.nt-pin__cell:focus-visible {
  outline: none;
  border-color: var(--input-border-focus);
  box-shadow: 0 0 0 var(--border-width-1) var(--input-border-focus);
}
.nt-pin--invalid .nt-pin__cell { border-color: var(--input-border-error); }
.nt-pin__cell:disabled { background: var(--input-bg-disabled); color: var(--text-disabled); }

/* ─── form/select.css ─── */
/* Select nativo — mesma caixa do Input, chevron do set de ícones. */
.nt-select {
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: var(--input-height);
  background: var(--input-bg);
  border: var(--border-width-1) solid var(--input-border);
  border-radius: var(--input-radius);
  transition: var(--motion-transition-color);
  flex: 1 1 auto; /* basis auto: em coluna (nt-field) a height vale; flex:1 zerava a base e esmagava o campo */
}
.nt-select:hover:not(.nt-select--disabled) { border-color: var(--input-border-hover); }
.nt-select:focus-within {
  border-color: var(--input-border-focus);
  box-shadow: 0 0 0 var(--border-width-1) var(--input-border-focus);
}
.nt-select--invalid,
.nt-select--invalid:hover { border-color: var(--input-border-error); }
.nt-select--invalid:focus-within { box-shadow: 0 0 0 var(--border-width-1) var(--input-border-error); }
.nt-select--disabled { background: var(--input-bg-disabled); }

.nt-select__control {
  appearance: none;
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  color: var(--input-fg);
  font-family: var(--font-family-body);
  font-size: var(--font-size-base);
  padding: 0 calc(var(--input-padding-x) + var(--icon-size-md)) 0 var(--input-padding-x);
  cursor: pointer;
}
.nt-select__control:disabled { color: var(--text-disabled); cursor: not-allowed; }
.nt-select__control:invalid { color: var(--input-placeholder); }

.nt-select__chevron {
  position: absolute;
  right: var(--space-3);
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  color: var(--text-muted);
  pointer-events: none;
}

/* ─── form/switch.css ─── */
/* Switch — trilho + polegar, tudo por token. */
.nt-switch { display: inline-flex; align-items: center; gap: var(--space-3); cursor: pointer; }
.nt-switch--label-left { flex-direction: row-reverse; }

.nt-switch__track {
  display: inline-flex;
  align-items: center;
  background: var(--border-strong);
  border-radius: var(--radius-full);
  padding: var(--border-width-2);
  transition: var(--motion-transition-color);
  flex: none;
}
.nt-switch--md .nt-switch__track { width: var(--space-10); height: var(--space-6); }
.nt-switch--sm .nt-switch__track { width: var(--space-8); height: var(--space-5); }

.nt-switch__thumb {
  background: var(--surface-raised);
  border-radius: var(--radius-full);
  transition: var(--motion-transition-transform);
  height: 100%;
  aspect-ratio: 1;
}
.nt-switch--md .nt-switch__thumb { --nt-switch-travel: var(--space-4); }
.nt-switch--sm .nt-switch__thumb { --nt-switch-travel: var(--space-3); }

.nt-switch .nt-check__input:checked ~ .nt-switch__track { background: var(--action-primary-default); }
.nt-switch .nt-check__input:checked ~ .nt-switch__track .nt-switch__thumb { transform: translateX(var(--nt-switch-travel)); }
.nt-switch .nt-check__input:focus-visible ~ .nt-switch__track {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}
.nt-switch .nt-check__input:disabled ~ .nt-switch__track { background: var(--border-subtle); }

@media (prefers-reduced-motion: reduce) {
  .nt-switch__thumb { transition: none; }
}

/* ─── form/textarea.css ─── */
/* Textarea — mesmo vocabulário do Input. */
.nt-textarea {
  box-sizing: border-box; /* width 100% + padding sem estourar o container */
  width: 100%;
  padding: var(--space-4) var(--input-padding-x);
  background: var(--input-bg);
  color: var(--input-fg);
  border: var(--border-width-1) solid var(--input-border);
  border-radius: var(--input-radius);
  font-family: var(--font-family-body);
  font-size: var(--font-size-md);
  line-height: var(--font-leading-normal);
  resize: vertical;
  transition: var(--motion-transition-color);
}
.nt-textarea::placeholder { color: var(--input-placeholder); }
.nt-textarea:hover:not(:disabled) { border-color: var(--input-border-hover); }
.nt-textarea:focus-visible {
  outline: none;
  border-color: var(--input-border-focus);
  box-shadow: 0 0 0 var(--border-width-1) var(--input-border-focus);
}
.nt-textarea--invalid,
.nt-textarea--invalid:hover { border-color: var(--input-border-error); }
.nt-textarea--invalid:focus-visible { box-shadow: 0 0 0 var(--border-width-1) var(--input-border-error); }
.nt-textarea:disabled { background: var(--input-bg-disabled); color: var(--text-disabled); cursor: not-allowed; }

/* ─── icon-button/icon-button.css ─── */
/* IconButton — quadrado (largura = altura do tamanho correspondente). */
.nt-iconbtn.nt-btn--xs { width: var(--button-height-xs); padding: 0; }
.nt-iconbtn.nt-btn--sm { width: var(--button-height-sm); padding: 0; }
.nt-iconbtn.nt-btn--md { width: var(--button-height-md); padding: 0; }
.nt-iconbtn.nt-btn--lg { width: var(--button-height-lg); padding: 0; }
.nt-iconbtn.nt-btn--xl { width: var(--button-height-xl); padding: 0; }
.nt-iconbtn--circle { border-radius: var(--radius-full); }

/* ─── kbd/kbd.css ─── */
/* Kbd — tecla física em miniatura. */
.nt-kbd {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--space-5);
  padding: 0 var(--space-1);
  height: var(--space-5);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  color: var(--text-secondary);
  background: var(--surface-sunken);
  border: var(--border-width-1) solid var(--border-default);
  border-bottom-width: var(--border-width-2);
  border-radius: var(--radius-sm);
}
.nt-kbd-combo { display: inline-flex; align-items: center; gap: var(--space-1); }
.nt-kbd-combo__plus { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-muted); }

/* ─── layout/layout.css ─── */
/* Layout — o inline define só a custom property; a media query vence sem !important. */
.nt-grid { display: grid; grid-template-columns: var(--nt-grid-cols); }
@media (max-width: 880px) {
  .nt-grid--responsive { grid-template-columns: 1fr; }
}
.nt-scrollarea { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }

/* ─── link/link.css ─── */
/* Link — violeta como pontuação; sublinhado 'draw' vem do @nomicstech/motion (fallback local abaixo). */
.nt-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  cursor: pointer;
  transition: var(--motion-transition-color);
}
.nt-link--accent { color: var(--link-style-fg); }
.nt-link--accent:hover { color: var(--link-style-fg-hover); }
.nt-link--inherit { color: inherit; }
.nt-link--muted { color: var(--text-muted); }
.nt-link--muted:hover { color: var(--text-secondary); }

.nt-link--u-always { text-decoration: underline; text-underline-offset: var(--link-style-underline-offset); }
.nt-link--u-hover { text-decoration: none; }
.nt-link--u-hover:hover { text-decoration: underline; text-underline-offset: var(--link-style-underline-offset); }
.nt-link--u-none, .nt-link--u-draw { text-decoration: none; }

/* Fallback do 'draw' caso animations.css (motion) não esteja na página */
.nt-link.nt-underline-draw { position: relative; }
.nt-link.nt-underline-draw::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(var(--space-1) * -0.5);
  height: var(--border-width-1);
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--motion-duration-normal) var(--motion-easing-out);
}
.nt-link.nt-underline-draw:hover::after { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .nt-link.nt-underline-draw::after { transition: none; }
}

/* ─── nav/nav.css ─── */
/* Navegação — Tabs, Breadcrumb, Pagination, Menu, Stepper, Navbar. */

/* Tabs */
.nt-tabs--vertical { display: flex; gap: var(--space-8); }
.nt-tabs__list { display: flex; gap: var(--space-1); overflow-x: auto; }
.nt-tabs--vertical .nt-tabs__list { flex-direction: column; }
.nt-tabs--line .nt-tabs__list { border-bottom: var(--border-width-1) solid var(--border-default); }
.nt-tabs--line.nt-tabs--vertical .nt-tabs__list { border-bottom: none; border-right: var(--border-width-1) solid var(--border-default); }
.nt-tabs__tab {
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
  cursor: pointer;
  white-space: nowrap;
  transition: var(--motion-transition-color);
}
.nt-tabs__tab[data-hovered] { color: var(--text-primary); }
.nt-tabs__tab[data-disabled] { color: var(--text-disabled); cursor: not-allowed; }
.nt-tabs--line .nt-tabs__tab { border-bottom: var(--border-width-2) solid transparent; margin-bottom: calc(var(--border-width-1) * -1); }
.nt-tabs--line .nt-tabs__tab[data-selected] { color: var(--text-accent); border-bottom-color: var(--text-accent); }
.nt-tabs--pill .nt-tabs__tab { border-radius: var(--radius-full); }
.nt-tabs--pill .nt-tabs__tab[data-selected] { background: var(--action-primary-default); color: var(--text-on-action); }
.nt-tabs__panel { padding-top: var(--space-6); outline: none; }
.nt-tabs--vertical .nt-tabs__panel { padding-top: 0; flex: 1; }

/* Breadcrumb */
.nt-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.nt-breadcrumb li { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); color: var(--text-muted); }
.nt-breadcrumb a { color: var(--text-secondary); text-decoration: none; border-radius: var(--radius-xs); }
.nt-breadcrumb a:hover { color: var(--text-accent); }
.nt-breadcrumb [aria-current='page'] { color: var(--text-primary); }
.nt-breadcrumb__sep { color: var(--text-disabled); }

/* Pagination */
.nt-pagination { display: flex; align-items: center; gap: var(--space-1); }
.nt-pagination__btn {
  min-width: var(--space-10);
  height: var(--space-10);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 var(--space-2);
  background: none;
  border: var(--border-width-1) solid transparent;
  border-radius: var(--radius-md);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  cursor: pointer;
  transition: var(--motion-transition-color);
}
.nt-pagination__btn:hover:not(:disabled) { background: var(--action-secondary-hover); color: var(--text-primary); }
.nt-pagination__btn--current { background: var(--action-primary-default); color: var(--text-on-action); }
.nt-pagination__btn--current:hover:not(:disabled) { background: var(--action-primary-hover); color: var(--text-on-action); }
.nt-pagination__btn:disabled { color: var(--text-disabled); cursor: not-allowed; }
.nt-pagination__ellipsis { padding: 0 var(--space-2); color: var(--text-disabled); }
.nt-pagination__size { margin-left: var(--space-4); }

/* Menu extras */
.nt-menu__separator { border: none; border-top: var(--border-width-1) solid var(--border-subtle); margin: var(--space-2) 0; }
.nt-menu__item { flex-direction: row; align-items: center; gap: var(--space-3); }
.nt-menu__item--destructive { color: var(--feedback-danger-text); }
.nt-menu__item--destructive[data-focused] { background: var(--feedback-danger-bg); }
.nt-menu__shortcut { margin-left: auto; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-muted); }

/* Stepper */
.nt-stepper { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-6); flex-wrap: wrap; }
.nt-stepper__step { display: flex; gap: var(--space-3); align-items: flex-start; flex: 1; min-width: var(--space-40); }
.nt-stepper__marker {
  width: var(--space-8);
  height: var(--space-8);
  display: grid;
  place-items: center;
  border-radius: var(--radius-full);
  border: var(--border-width-1) solid var(--border-strong);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  color: var(--text-secondary);
  flex: none;
  transition: var(--motion-transition-color);
}
.nt-stepper__step--done .nt-stepper__marker { background: var(--action-primary-default); border-color: var(--action-primary-default); color: var(--text-on-action); }
.nt-stepper__step--current .nt-stepper__marker { border-color: var(--border-focus); color: var(--text-accent); }
.nt-stepper__text { display: flex; flex-direction: column; gap: var(--space-1); }
.nt-stepper__label { font-size: var(--font-size-sm); color: var(--text-primary); }
.nt-stepper__step--todo .nt-stepper__label { color: var(--text-muted); }
.nt-stepper__description { font-size: var(--font-size-xs); color: var(--text-muted); }

/* Navbar */
.nt-navbar { border-bottom: var(--border-width-1) solid var(--border-default); background: var(--surface-page); }
.nt-navbar__inner {
  max-width: var(--container-default);
  margin-inline: auto;
  padding: 0 var(--space-semantic-container-x);
  height: var(--space-16);
  display: flex;
  align-items: center;
  gap: var(--space-8);
}
.nt-navbar__links { display: flex; align-items: center; gap: var(--space-6); flex: 1; }
.nt-navbar__actions { display: flex; align-items: center; gap: var(--space-3); }
.nt-navbar__toggle { display: none; background: none; border: none; color: var(--text-primary); cursor: pointer; padding: var(--space-2); border-radius: var(--radius-sm); }
.nt-navbar__mobile { display: none; }
@media (max-width: 880px) {
  .nt-navbar__links, .nt-navbar__actions { display: none; }
  .nt-navbar__toggle { display: inline-flex; margin-left: auto; }
  .nt-navbar--open .nt-navbar__mobile {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    padding: var(--space-6);
    border-top: var(--border-width-1) solid var(--border-default);
  }
  .nt-navbar__mobile-actions { display: flex; flex-direction: column; gap: var(--space-3); }
}

/* ─── overlay/overlay.css ─── */
/* Overlays — véu + caixas. Elevação só aqui (o resto do sistema é flat). */
.nt-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  background: var(--color-overlay-black-48);
  display: grid;
  place-items: center;
  padding: var(--space-6);
}
[data-theme='dark'] .nt-overlay { background: var(--color-overlay-black-64); }
.nt-overlay[data-entering] { animation: nt-fade-in var(--motion-duration-fast) var(--motion-easing-out); }

.nt-modal {
  width: 100%;
  background: var(--surface-overlay);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-xl);
  box-shadow: var(--elevation-5);
  max-height: 85vh;
  display: flex;
}
.nt-modal[data-entering] { animation: nt-scale-in var(--motion-duration-normal) var(--motion-easing-out); }
.nt-modal--sm { max-width: 420px; } /* nt-allow-hardcode: larguras de modal são de composição, não escala */
.nt-modal--md { max-width: 560px; } /* nt-allow-hardcode: idem */
.nt-modal--lg { max-width: var(--container-narrow); }
.nt-modal--full { max-width: calc(100vw - var(--space-12)); height: calc(100vh - var(--space-12)); }

.nt-modal__dialog { display: flex; flex-direction: column; flex: 1; min-height: 0; outline: none; }
.nt-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-5) var(--space-6);
  border-bottom: var(--border-width-1) solid var(--border-default);
  flex: none;
}
.nt-modal__title { margin: 0; font-family: var(--font-family-display); font-size: var(--font-size-xl); font-weight: var(--font-weight-regular); }
.nt-modal__body { padding: var(--space-6); overflow-y: auto; flex: 1; font-size: var(--font-size-base); color: var(--text-secondary); }
.nt-modal__footer {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-6);
  border-top: var(--border-width-1) solid var(--border-default);
  flex: none;
}

/* Drawer */
.nt-drawer {
  position: fixed;
  background: var(--surface-overlay);
  border: var(--border-width-1) solid var(--border-default);
  box-shadow: var(--elevation-5);
  display: flex;
}
.nt-drawer--right { top: 0; right: 0; bottom: 0; width: min(420px, 90vw); } /* nt-allow-hardcode: largura de composição */
.nt-drawer--left { top: 0; left: 0; bottom: 0; width: min(420px, 90vw); } /* nt-allow-hardcode: idem */
.nt-drawer--top { top: 0; left: 0; right: 0; max-height: 60vh; }
.nt-drawer--bottom { bottom: 0; left: 0; right: 0; max-height: 85vh; border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
.nt-drawer--right[data-entering] { animation: nt-slide-left var(--motion-duration-normal) var(--motion-easing-out); }
.nt-drawer--left[data-entering] { animation: nt-slide-right var(--motion-duration-normal) var(--motion-easing-out); }
.nt-drawer--bottom[data-entering] { animation: nt-fade-up var(--motion-duration-normal) var(--motion-easing-out); }

/* Popover com conteúdo */
.nt-popover--padded .nt-popover__dialog { padding: var(--space-4); font-size: var(--font-size-sm); color: var(--text-secondary); outline: none; }
.nt-popover__arrow svg { fill: var(--surface-overlay); stroke: var(--border-default); stroke-width: var(--border-width-1); }
.nt-popover__arrow[data-placement='bottom'] svg { transform: rotate(180deg); }
.nt-popover__arrow[data-placement='left'] svg { transform: rotate(-90deg); }
.nt-popover__arrow[data-placement='right'] svg { transform: rotate(90deg); }

/* Tooltip */
.nt-tooltip {
  background: var(--surface-inverse);
  color: var(--text-inverse);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  letter-spacing: var(--font-tracking-wide);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  max-width: var(--container-prose);
}
.nt-tooltip[data-entering] { animation: nt-fade-in var(--motion-duration-fast) var(--motion-easing-out); }

@media (prefers-reduced-motion: reduce) {
  .nt-overlay[data-entering], .nt-modal[data-entering], .nt-drawer--right[data-entering],
  .nt-drawer--left[data-entering], .nt-drawer--bottom[data-entering], .nt-tooltip[data-entering] { animation: none; }
}

/* ─── skeleton/skeleton.css ─── */
/* Skeleton — superfície sunken com brilho sutil. */
.nt-skeleton { background: var(--surface-sunken); border-radius: var(--radius-sm); }
.nt-skeleton--text { height: 1em; }
.nt-skeleton--text + .nt-skeleton--text { margin-top: var(--space-2); }
.nt-skeleton--short { width: 60%; }
.nt-skeleton--circle { border-radius: var(--radius-full); width: var(--space-10); height: var(--space-10); }
.nt-skeleton--rect { height: var(--space-24); }
.nt-skeleton-group { display: block; }

.nt-skeleton--shimmer {
  position: relative;
  overflow: hidden;
}
.nt-skeleton--shimmer::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, var(--color-overlay-white-48), transparent); /* nt-allow-hardcode: gradiente estrutural do shimmer, cores via token */
  animation: nt-shimmer calc(var(--motion-duration-slower) * 2.5) var(--motion-easing-in-out) infinite;
}
[data-theme='dark'] .nt-skeleton--shimmer::after {
  background: linear-gradient(90deg, transparent, var(--color-overlay-white-8), transparent);
}
@keyframes nt-shimmer { to { transform: translateX(100%); } }

@media (prefers-reduced-motion: reduce) {
  .nt-skeleton--shimmer::after { animation: none; }
}

/* ─── spinner/spinner.css ─── */
/* Spinner — anel com arco em currentColor (herda contexto; accent quando isolado). */
.nt-spinner { display: inline-flex; }
.nt-spinner__ring {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: var(--radius-full);
  border: var(--border-width-2) solid currentColor;
  border-top-color: transparent;
  opacity: 0.9;
  animation: nt-spin var(--motion-duration-slower) linear infinite;
}
.nt-spinner--xs { width: var(--icon-size-xs); height: var(--icon-size-xs); }
.nt-spinner--sm { width: var(--icon-size-sm); height: var(--icon-size-sm); }
.nt-spinner--md { width: var(--icon-size-md); height: var(--icon-size-md); }
.nt-spinner--lg { width: var(--icon-size-lg); height: var(--icon-size-lg); }

@keyframes nt-spin { to { transform: rotate(360deg); } }
@keyframes nt-pulse { 50% { opacity: 0.35; } }

@media (prefers-reduced-motion: reduce) {
  .nt-spinner__ring {
    animation: nt-pulse calc(var(--motion-duration-slower) * 2) var(--motion-easing-in-out) infinite;
    border-top-color: currentColor;
  }
}


/* @nomicstech/motion — animações do sistema. 100% dirigidas por tokens (requer tokens.css carregado antes).
   Filosofia (DIRECAO-VISUAL): movimento contido e confiante — reveals de entrada orquestrados com stagger,
   micro-interações rápidas. Nada de bounce em UI de produto, nada de parallax.
   Reveals são ativados por js/reveal.js (html.nt-motion) — sem JS, nada fica escondido. */

/* ---------- Keyframes ---------- */
@keyframes nt-fade-up {
  from { opacity: 0; transform: translateY(var(--space-5)); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes nt-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes nt-scale-in {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes nt-slide-left {
  from { opacity: 0; transform: translateX(var(--space-8)); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes nt-slide-right {
  from { opacity: 0; transform: translateX(calc(var(--space-8) * -1)); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes nt-grow-x {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}
@keyframes nt-grow-y {
  from { transform: scaleY(0); }
  to { transform: scaleY(1); }
}

/* ---------- Reveals de entrada (uso: data-reveal="fade-up|fade-in|scale-in|slide-left|slide-right") ----------
   Estado escondido só existe com JS ativo (html.nt-motion) — acessível e sem FOUC às avessas. */
html.nt-motion [data-reveal]:not(.nt-in) { opacity: 0; }
html.nt-motion [data-reveal].nt-in {
  animation-duration: var(--motion-duration-slower);
  animation-timing-function: var(--motion-easing-out);
  animation-fill-mode: both;
  animation-delay: calc(var(--nt-stagger-i, 0) * var(--motion-duration-fast) * 0.6);
}
html.nt-motion [data-reveal="fade-up"].nt-in { animation-name: nt-fade-up; }
html.nt-motion [data-reveal="fade-in"].nt-in { animation-name: nt-fade-in; }
html.nt-motion [data-reveal="scale-in"].nt-in { animation-name: nt-scale-in; }
html.nt-motion [data-reveal="slide-left"].nt-in { animation-name: nt-slide-left; }
html.nt-motion [data-reveal="slide-right"].nt-in { animation-name: nt-slide-right; }
html.nt-motion [data-reveal="grow-x"].nt-in { animation-name: nt-grow-x; transform-origin: left center; }

/* ---------- Micro-interações ---------- */
.nt-hover-lift { transition: var(--motion-transition-transform), var(--motion-transition-color); }
.nt-hover-lift:hover { transform: translateY(calc(var(--space-1) * -0.5)); }

.nt-hover-grow { transition: var(--motion-transition-transform); }
.nt-hover-grow:hover { transform: scale(1.02); }

.nt-press { transition: var(--motion-transition-transform); }
.nt-press:active { transform: scale(0.98); }

/* Sublinhado que desenha da esquerda (links editoriais) */
.nt-underline-draw { position: relative; text-decoration: none; }
.nt-underline-draw::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(var(--space-1) * -0.5);
  height: var(--border-width-1);
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--motion-duration-normal) var(--motion-easing-out);
}
.nt-underline-draw:hover::after { transform: scaleX(1); }

/* ---------- Acessibilidade: reduced motion desliga TUDO ---------- */
@media (prefers-reduced-motion: reduce) {
  html.nt-motion [data-reveal]:not(.nt-in) { opacity: 1; }
  html.nt-motion [data-reveal].nt-in,
  .nt-hover-lift,
  .nt-hover-grow,
  .nt-press,
  .nt-underline-draw::after {
    animation: none;
    transition: none;
  }
}


/* @nomicstech/html — blocos de LP (nt-lp-*) v2, nível-referência (Acctual/Attio/Origin).
   Requer tokens.css + components.css + animations.css. Sem sticky CTA bar (veto do Vinicius).
   100% tokens — exceções compositivas marcadas com nt-allow-hardcode e motivo. */

/* ---------- Base de página ---------- */
.nt-lp {
  margin: 0; /* reset que o kit standalone precisa */
  font-family: var(--font-family-body);
  color: var(--text-primary);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip; /* elementos flutuantes com offset negativo nunca criam scroll/faixa branca */
}
.nt-lp h1, .nt-lp h2, .nt-lp h3 { text-wrap: balance; }
.nt-lp p { text-wrap: pretty; }
.nt-lp__container { max-width: var(--container-default); margin-inline: auto; padding-inline: var(--space-semantic-container-x); }
.nt-lp__section { padding-block: var(--space-24); }
.nt-lp__section--hairline { border-top: var(--border-width-1) solid var(--border-default); }
.nt-lp__title { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); margin: 0; }
.nt-lp__accent { color: var(--text-accent); }
.nt-lp__center { text-align: center; }
.nt-lp__center .nt-lp__title { margin-inline: auto; }
.nt-lp__lead { font-size: var(--font-size-lg); line-height: var(--font-leading-relaxed); color: var(--text-secondary); max-width: var(--container-prose); }
.nt-lp__center .nt-lp__lead { margin-inline: auto; }

/* Eyebrow: pill (páginas centradas) e linha (seções) */
.nt-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-accent);
  background: var(--surface-brand-wash);
  border: var(--border-width-1) solid var(--color-violet-200);
  border-radius: var(--radius-full);
  padding: var(--space-1) var(--space-3);
}
[data-theme='dark'] .nt-pill { border-color: var(--color-violet-800); }
.nt-lp__eyebrow {
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wider);
  text-transform: uppercase;
  color: var(--text-accent);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-bottom: var(--space-5);
}
.nt-lp__eyebrow::before { content: ''; width: var(--space-6); height: var(--border-width-1); background: var(--text-accent); }

/* ---------- Announcement bar (Attio) ---------- */
.nt-announce {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-2) var(--space-6);
  background: var(--surface-inverse);
  color: var(--text-inverse);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
}
.nt-announce a { color: inherit; }

/* ---------- Navbar de LP ---------- */
.nt-lp-nav { position: relative; z-index: var(--z-sticky); }
.nt-lp-nav__inner { display: flex; align-items: center; justify-content: space-between; height: var(--space-20); gap: var(--space-8); }
.nt-lp-nav__brand { display: inline-flex; align-items: center; gap: var(--space-3); font-family: var(--font-family-display); font-size: var(--font-size-xl); color: var(--text-primary); text-decoration: none; }
.nt-lp-nav__brand svg { width: var(--space-6); height: var(--space-5); color: var(--text-accent); }
.nt-lp-nav__links { display: flex; gap: var(--space-6); align-items: center; }
@media (max-width: 880px) { .nt-lp-nav__links { display: none; } }

/* ---------- Hero centrado (Attio) sobre wash ---------- */
.nt-hero-wash {
  position: relative;
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, var(--surface-brand-wash), transparent 70%);
}
.nt-hero-center { padding-block: var(--space-20) var(--space-16); display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-6); }
.nt-hero-center .nt-lp__title { max-width: var(--container-narrow); }
.nt-hero-center__ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; margin-top: var(--space-4); }

/* Rates/checks inline (Acctual) */
.nt-rates { display: flex; flex-wrap: wrap; gap: var(--space-6); justify-content: center; margin-top: var(--space-4); }
.nt-rate { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-rate svg { color: var(--text-accent); }
.nt-rate b { font-weight: var(--font-weight-regular); color: var(--text-primary); }

/* ---------- Mockup de produto (Attio) + doc flutuante (Acctual) ---------- */
.nt-stage { position: relative; max-width: var(--container-narrow); margin-inline: auto; padding-bottom: var(--space-16); }
.nt-window {
  background: var(--surface-raised);
  border-radius: var(--radius-xl);
  border: var(--border-width-1) solid var(--border-default);
  box-shadow: var(--elevation-4);
  overflow: hidden;
  text-align: left;
}
.nt-window__bar { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); border-bottom: var(--border-width-1) solid var(--border-subtle); }
.nt-window__dot { width: var(--space-3); height: var(--space-3); border-radius: var(--radius-full); background: var(--border-default); }
.nt-window__dot--r { background: var(--color-red-300); }
.nt-window__dot--y { background: var(--color-amber-300); }
.nt-window__dot--g { background: var(--color-green-300); }
.nt-window__title { margin-left: var(--space-2); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }
.nt-window__body { display: grid; grid-template-columns: minmax(0, var(--space-48)) minmax(0, 1fr); min-height: var(--space-48); }
@media (max-width: 880px) { .nt-window__body { grid-template-columns: minmax(0, 1fr); } .nt-window__body .nt-window__side { display: none; } }
.nt-window__side { border-right: var(--border-width-1) solid var(--border-subtle); padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-1); background: var(--surface-sunken); }
.nt-window__navitem { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-window__navitem--active { background: var(--surface-brand-wash); color: var(--text-accent); }
.nt-window__main { padding: var(--space-5); overflow-x: auto; min-width: 0; }
.nt-window table { width: 100%; border-collapse: collapse; font-size: var(--font-size-sm); }
.nt-window th {
  text-align: left;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-2xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--font-tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
  padding: var(--space-2) var(--space-3);
  border-bottom: var(--border-width-1) solid var(--border-default);
}
.nt-window td { padding: var(--space-3); border-bottom: var(--border-width-1) solid var(--border-subtle); white-space: nowrap; font-variant-numeric: tabular-nums; }
.nt-window td:first-child { color: var(--text-primary); }

/* Documento flutuante sobreposto */
.nt-floatdoc {
  position: absolute;
  right: calc(var(--space-10) * -1);
  bottom: 0;
  width: var(--space-48);
  min-width: fit-content;
  background: var(--surface-raised);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--elevation-3);
  padding: var(--space-5);
  transform: rotate(3deg);
  text-align: left;
}
@media (max-width: 1280px) { .nt-floatdoc { right: var(--space-4); } }
@media (max-width: 880px) { .nt-floatdoc { position: static; transform: none; margin-top: var(--space-4); width: auto; } }
.nt-floatdoc__label { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wider); text-transform: uppercase; color: var(--text-muted); }
.nt-floatdoc__row { display: flex; justify-content: space-between; gap: var(--space-6); padding: var(--space-2) 0; border-bottom: var(--border-width-1) solid var(--border-subtle); font-size: var(--font-size-sm); }
.nt-floatdoc__row:last-child { border-bottom: none; }
.nt-floatdoc__row b { font-weight: var(--font-weight-regular); font-variant-numeric: tabular-nums; }

/* ---------- Prova social: strip + quote (Acctual) ---------- */
.nt-logostrip { display: flex; flex-wrap: wrap; gap: var(--space-10); justify-content: center; align-items: center; padding-block: var(--space-10); }
.nt-logostrip span { font-family: var(--font-family-mono); font-size: var(--font-size-sm); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-disabled); }

.nt-bigquote {
  background: var(--surface-sunken);
  border-radius: var(--radius-3xl);
  padding: var(--space-20) var(--space-10);
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
}
.nt-bigquote__stars { color: var(--color-amber-400); letter-spacing: var(--font-tracking-wide); font-size: var(--font-size-lg); }
.nt-bigquote__text { font-family: var(--font-family-display); font-size: var(--font-size-2xl); line-height: var(--font-leading-heading); max-width: var(--container-narrow); margin: 0; }
.nt-bigquote__who { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }

/* ---------- Personas / onde trabalha (Acctual grid sem borda) ---------- */
.nt-personas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
@media (max-width: 880px) { .nt-personas { grid-template-columns: 1fr; } }
.nt-persona { background: var(--surface-sunken); border-radius: var(--radius-xl); padding: var(--space-6); }
.nt-persona__head { display: flex; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
.nt-persona__dot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); flex: none; }
.nt-persona__title { font-size: var(--font-size-base); color: var(--text-primary); }
.nt-persona__text { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0; line-height: var(--font-leading-relaxed); }

/* ---------- O problema: colunas rotuladas + painéis tintados (Acctual) ---------- */
.nt-problems { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
@media (max-width: 880px) { .nt-problems { grid-template-columns: 1fr; } }
.nt-problem__tag { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); letter-spacing: var(--font-tracking-wider); text-transform: uppercase; }
.nt-problem__text { font-size: var(--font-size-sm); color: var(--text-secondary); line-height: var(--font-leading-relaxed); margin: var(--space-2) 0 var(--space-4); min-height: var(--space-16); }
.nt-problem__panel { height: var(--space-32); border-radius: var(--radius-xl); }

/* ---------- Seção dark (Origin) — usa o PRÓPRIO dark theme do sistema ---------- */
.nt-darkband { background: var(--surface-page); color: var(--text-primary); }
.nt-process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-10); margin-top: var(--space-16); }
@media (max-width: 880px) { .nt-process { grid-template-columns: 1fr; } }
.nt-process__num { font-family: var(--font-family-display); font-size: var(--font-size-6xl); line-height: var(--font-leading-tight); color: var(--text-accent); }
.nt-process__title { font-family: var(--font-family-display); font-size: var(--font-size-2xl); margin: var(--space-3) 0 var(--space-2); }
.nt-process__text { font-size: var(--font-size-sm); color: var(--text-secondary); line-height: var(--font-leading-relaxed); margin: 0; }
.nt-process__meta { display: inline-block; margin-top: var(--space-4); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }

/* ---------- Oferta ---------- */
.nt-offer { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
@media (max-width: 880px) { .nt-offer { grid-template-columns: 1fr; } }
.nt-price { border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-2xl); padding: var(--space-10); background: var(--surface-raised); }
.nt-price__anchor { font-size: var(--font-size-base); color: var(--text-muted); text-decoration: line-through; }
.nt-price__value { font-family: var(--font-family-display); font-size: var(--font-size-6xl); line-height: var(--font-leading-tight); font-variant-numeric: tabular-nums; }
.nt-price__suffix { font-size: var(--font-size-lg); color: var(--text-muted); font-family: var(--font-family-body); }
.nt-price__terms { font-size: var(--font-size-sm); color: var(--text-secondary); margin-top: var(--space-3); line-height: var(--font-leading-relaxed); }
.nt-price__cta { margin-top: var(--space-8); }
.nt-price__badges { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-6); }

.nt-bonus { border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-2xl); padding: var(--space-8); }
.nt-bonus__item { display: flex; justify-content: space-between; gap: var(--space-6); padding: var(--space-3) 0; border-bottom: var(--border-width-1) solid var(--border-subtle); font-size: var(--font-size-sm); }
.nt-bonus__value { font-family: var(--font-family-mono); font-size: var(--font-size-xs); color: var(--text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.nt-bonus__total { display: flex; justify-content: space-between; padding-top: var(--space-4); font-family: var(--font-family-display); font-size: var(--font-size-lg); }

.nt-guarantee { display: flex; gap: var(--space-5); align-items: flex-start; border-radius: var(--radius-2xl); padding: var(--space-8); background: var(--feedback-success-bg); border: var(--border-width-1) solid var(--feedback-success-border); }
.nt-guarantee__seal { color: var(--feedback-success-icon); flex: none; }
.nt-guarantee__title { font-family: var(--font-family-display); font-size: var(--font-size-lg); margin: 0 0 var(--space-1); color: var(--feedback-success-text); }
.nt-guarantee__text { margin: 0; font-size: var(--font-size-sm); color: var(--feedback-success-text); line-height: var(--font-leading-relaxed); }

/* ---------- Countdown ---------- */
.nt-countdown { display: flex; gap: var(--space-3); }
.nt-countdown__cell { text-align: center; min-width: var(--space-16); padding: var(--space-3); border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-lg); background: var(--surface-raised); }
.nt-countdown__num { display: block; font-family: var(--font-family-display); font-size: var(--font-size-3xl); font-variant-numeric: tabular-nums; }
.nt-countdown__label { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }

/* ---------- Formulário de captura: painel 2 colunas ---------- */
.nt-capture { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-16); align-items: start; }
@media (max-width: 880px) { .nt-capture { grid-template-columns: 1fr; gap: var(--space-10); } }
.nt-capture__aside { display: flex; flex-direction: column; gap: var(--space-8); }
.nt-capture__steps { display: flex; flex-direction: column; gap: var(--space-5); }
.nt-capture__step { display: flex; gap: var(--space-4); align-items: flex-start; }
.nt-capture__stepnum {
  width: var(--space-8);
  height: var(--space-8);
  border-radius: var(--radius-full);
  border: var(--border-width-1) solid var(--border-strong);
  display: grid;
  place-items: center;
  font-family: var(--font-family-mono);
  font-size: var(--font-size-xs);
  color: var(--text-accent);
  border-color: var(--color-violet-200);
  background: var(--surface-brand-wash);
  flex: none;
}
[data-theme='dark'] .nt-capture__stepnum { border-color: var(--color-violet-800); }
.nt-capture__steptitle { font-size: var(--font-size-base); color: var(--text-primary); }
.nt-capture__steptext { font-size: var(--font-size-sm); color: var(--text-muted); }
.nt-capture__trust { display: flex; flex-direction: column; gap: var(--space-3); padding-top: var(--space-6); border-top: var(--border-width-1) solid var(--border-default); }

.nt-capture__panel {
  background: var(--surface-raised);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-2xl);
  padding: var(--space-10);
  box-shadow: var(--elevation-2);
}
@media (max-width: 880px) { .nt-capture__panel { padding: var(--space-6); } }
.nt-capture__form { display: flex; flex-direction: column; gap: var(--space-5); }
.nt-capture__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); }
@media (max-width: 640px) { .nt-capture__row { grid-template-columns: 1fr; } }
.nt-capture__cards { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); }
@media (max-width: 640px) { .nt-capture__cards { grid-template-columns: 1fr; } }
.nt-capture__status { min-height: var(--space-6); font-size: var(--font-size-sm); text-align: center; }
.nt-capture__status--erro { color: var(--feedback-danger-text); }
.nt-capture__status--ok { color: var(--feedback-success-text); }
.nt-capture__fineprint { font-size: var(--font-size-xs); color: var(--text-muted); text-align: center; margin: 0; }

/* ---------- Depoimentos ---------- */
.nt-testimonials { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
@media (max-width: 880px) { .nt-testimonials { grid-template-columns: 1fr; } }
.nt-testimonial { border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-2xl); padding: var(--space-8); background: var(--surface-raised); display: flex; flex-direction: column; gap: var(--space-4); }
.nt-testimonial__stars { color: var(--color-amber-400); font-size: var(--font-size-sm); letter-spacing: var(--font-tracking-wide); }
.nt-testimonial__result { font-family: var(--font-family-display); font-size: var(--font-size-2xl); line-height: var(--font-leading-heading); }
.nt-testimonial__quote { margin: 0; font-size: var(--font-size-sm); color: var(--text-secondary); line-height: var(--font-leading-relaxed); }
.nt-testimonial__who { display: flex; align-items: center; gap: var(--space-3); margin-top: auto; padding-top: var(--space-4); }
.nt-testimonial__name { font-size: var(--font-size-sm); }
.nt-testimonial__role { font-size: var(--font-size-xs); color: var(--text-muted); }

/* ---------- Módulos / FAQ ---------- */
.nt-modules { display: flex; flex-direction: column; }
.nt-module { border-bottom: var(--border-width-1) solid var(--border-default); }
.nt-module summary { display: flex; align-items: baseline; gap: var(--space-4); padding: var(--space-5) 0; cursor: pointer; list-style: none; }
.nt-module summary::-webkit-details-marker { display: none; }
.nt-module summary::after { content: '+'; margin-left: auto; font-family: var(--font-family-mono); font-size: var(--font-size-lg); color: var(--text-muted); transition: rotate var(--motion-duration-fast) var(--motion-easing-out); }
.nt-module[open] summary::after { rotate: 45deg; }
.nt-module__num { font-family: var(--font-family-mono); font-size: var(--font-size-sm); color: var(--text-accent); }
.nt-module__title { font-family: var(--font-family-display); font-size: var(--font-size-xl); }
.nt-module__meta { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: var(--font-tracking-wide); color: var(--text-muted); }
.nt-module__body { padding: 0 0 var(--space-5); color: var(--text-secondary); font-size: var(--font-size-sm); line-height: var(--font-leading-relaxed); max-width: var(--container-prose); }
.nt-faq { max-width: var(--container-narrow); margin-inline: auto; }

/* ---------- CTA final ---------- */
.nt-final { text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--space-8); }

/* ---------- Footer ---------- */
.nt-lp-footer { border-top: var(--border-width-1) solid var(--border-default); padding-block: var(--space-12); font-size: var(--font-size-xs); color: var(--text-muted); }
.nt-lp-footer__inner { display: flex; justify-content: space-between; gap: var(--space-10); flex-wrap: wrap; }
.nt-lp-footer__legal { max-width: var(--container-prose); line-height: var(--font-leading-relaxed); margin: 0; }
.nt-lp-footer__links { display: flex; gap: var(--space-6); flex-wrap: wrap; }

/* ---------- Exit intent + social proof ---------- */
.nt-exit[hidden] { display: none; }
.nt-exit { position: fixed; inset: 0; z-index: var(--z-modal); background: var(--color-overlay-black-48); display: grid; place-items: center; padding: var(--space-6); }
.nt-exit__box { background: var(--surface-overlay); border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-2xl); padding: var(--space-10); max-width: var(--container-prose); box-shadow: var(--elevation-5); position: relative; }
.nt-exit__close { position: absolute; top: var(--space-4); right: var(--space-4); background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-2); border-radius: var(--radius-sm); }

.nt-proof { position: fixed; bottom: var(--space-6); left: var(--space-6); z-index: var(--z-toast); display: flex; align-items: center; gap: var(--space-3); background: var(--surface-overlay); border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); box-shadow: var(--elevation-4); font-size: var(--font-size-sm); max-width: var(--container-prose); }
.nt-proof[hidden] { display: none; }
.nt-proof__dot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); background: var(--feedback-success-icon); flex: none; }

/* ================= v2.1 — popup de captura, inputs soft, segmented, versus, bandas ================= */

/* Grid de engenharia no hero (pontos sutis que somem pro fundo) */
.nt-hero-wash--grid { background-image: radial-gradient(ellipse 80% 60% at 50% 0%, var(--surface-brand-wash), transparent 70%); }
/* pontos de engenharia num pseudo-elemento: a máscara de fade NUNCA toca os filhos */
.nt-hero-wash--grid::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, var(--border-default) var(--border-width-1), transparent var(--border-width-1));
  background-size: var(--space-6) var(--space-6);
  -webkit-mask-image: linear-gradient(to bottom, var(--color-neutral-1000) 60%, transparent);
  mask-image: linear-gradient(to bottom, var(--color-neutral-1000) 60%, transparent);
}
.nt-hero-wash > * { position: relative; z-index: 1; }

/* Segmented control (faturamento) — compacto, grafite quando ativo */
.nt-seg { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.nt-seg__opt { position: relative; }
.nt-seg__opt input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.nt-seg__opt span {
  display: inline-flex;
  align-items: center;
  padding: var(--space-2) var(--space-4);
  border: var(--border-width-1) solid var(--border-interactive);
  border-radius: var(--radius-full);
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  transition: var(--motion-transition-color);
  white-space: nowrap;
}
.nt-seg__opt:hover span { border-color: var(--border-strong); color: var(--text-primary); }
.nt-seg__opt input:checked + span { background: var(--action-primary-default); border-color: var(--action-primary-default); color: var(--text-on-action); }
.nt-seg__opt input:focus-visible + span { outline: var(--focus-ring-width) solid var(--focus-ring-color); outline-offset: var(--focus-ring-offset); }

/* Dialog de captura (popup nativo) */
.nt-dialog {
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-2xl);
  padding: 0;
  width: min(100% - var(--space-8), var(--container-prose));
  box-shadow: var(--elevation-5);
  background: var(--surface-overlay);
  color: var(--text-primary);
  overflow-x: clip; /* nada dentro do popup cria barra horizontal */
  max-height: calc(100dvh - var(--space-12)); /* no mobile o quiz alto rola por dentro */
  overflow-y: auto;
}
.nt-dialog::backdrop { background: var(--color-overlay-black-48); }
.nt-dialog[open] { animation: nt-scale-in var(--motion-duration-normal) var(--motion-easing-out); }
.nt-dialog__head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-4); padding: var(--space-8) var(--space-8) 0; }
.nt-dialog__title { font-family: var(--font-family-display); font-size: var(--font-size-2xl); margin: 0; }
.nt-dialog__sub { font-size: var(--font-size-sm); color: var(--text-muted); margin: var(--space-2) 0 0; }
.nt-dialog__close { background: none; border: none; cursor: pointer; color: var(--text-muted); padding: var(--space-2); border-radius: var(--radius-sm); flex: none; }
.nt-dialog__close:hover { color: var(--text-primary); }
.nt-dialog__body { padding: var(--space-6) var(--space-8) var(--space-8); }
@media (max-width: 640px) { .nt-dialog__head { padding: var(--space-6) var(--space-6) 0; } .nt-dialog__body { padding: var(--space-5) var(--space-6) var(--space-6); } }
@media (prefers-reduced-motion: reduce) { .nt-dialog[open] { animation: none; } }

/* Banda de CTA (usada no lugar do formulário inline e no fechamento dark) */
.nt-ctaband { text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--space-6); }
.nt-ctaband__hint { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }
.nt-darkband--wash {
  background:
    radial-gradient(ellipse 70% 90% at 50% 100%, var(--surface-brand-wash), transparent 70%),
    var(--surface-page);
}

/* Versus: SaaS alugado × Service as a Software */
.nt-versus { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6); align-items: stretch; }
@media (max-width: 880px) { .nt-versus { grid-template-columns: 1fr; } }
.nt-versus__col { border-radius: var(--radius-2xl); padding: var(--space-8); border: var(--border-width-1) solid var(--border-default); }
.nt-versus__col--them { background: var(--surface-sunken); }
.nt-versus__col--us { background: var(--surface-brand-wash); border-color: var(--color-violet-200); position: relative; }
[data-theme='dark'] .nt-versus__col--us { border-color: var(--color-violet-800); }
.nt-versus__tag { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); font-weight: var(--font-weight-medium); letter-spacing: var(--font-tracking-wider); text-transform: uppercase; color: var(--text-muted); }
.nt-versus__col--us .nt-versus__tag { color: var(--text-accent); }
.nt-versus__title { font-family: var(--font-family-display); font-size: var(--font-size-2xl); margin: var(--space-2) 0 var(--space-6); }
.nt-versus__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.nt-versus__list li { display: flex; gap: var(--space-3); align-items: baseline; padding: var(--space-3) 0; border-top: var(--border-width-1) solid var(--border-subtle); font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-versus__col--us .nt-versus__list li { border-top-color: var(--color-violet-200); color: var(--text-primary); }
[data-theme='dark'] .nt-versus__col--us .nt-versus__list li { border-top-color: var(--color-violet-800); }
.nt-versus__x { color: var(--text-disabled); font-family: var(--font-family-mono); flex: none; }
.nt-versus__check { color: var(--text-accent); font-family: var(--font-family-mono); flex: none; }

/* ================= v2.2 — efeitos Epic Labs (aprovados pelo Vinicius) ================= */

/* Colunas-guia de engenharia atravessando o hero */
.nt-hero-wash { position: relative; }
.nt-hero-wash--cols::before {
  content: '';
  position: absolute;
  inset-block: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(100% - calc(var(--space-semantic-container-x) * 2), var(--container-default));
  border-inline: var(--border-width-1) solid var(--border-subtle);
  pointer-events: none;
}

/* Dot pulsante de escassez */
.nt-livedot { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); background: var(--color-green-400); flex: none; }
@keyframes nt-pulse-dot { 50% { opacity: 0.35; transform: scale(0.8); } }
.nt-livedot { animation: nt-pulse-dot calc(var(--motion-duration-slower) * 2) var(--motion-easing-in-out) infinite; }
@media (prefers-reduced-motion: reduce) { .nt-livedot { animation: none; } }

/* Feed da IA trabalhando (notificações que chegam em ciclo) */
.nt-ainotify {
  position: absolute;
  left: calc(var(--space-10) * -1);
  top: calc(var(--space-6) * -1);
  display: grid; /* todos os cards na MESMA célula — um visível por vez no ciclo */
  z-index: var(--z-sticky);
}
.nt-ainotify__card { grid-area: 1 / 1; }
@media (max-width: 1280px) { .nt-ainotify { left: var(--space-4); } }
@media (max-width: 880px) { .nt-ainotify { position: static; width: auto; margin-bottom: var(--space-4); } }
.nt-ainotify__card {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  background: var(--surface-overlay);
  border: var(--border-width-1) solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: var(--elevation-3);
  padding: var(--space-3) var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
  opacity: 0;
  animation: nt-ainotify-cycle calc(var(--motion-duration-slower) * 20) var(--motion-easing-out) infinite;
}
.nt-ainotify__card:nth-child(2) { animation-delay: calc(var(--motion-duration-slower) * 6.6); }
.nt-ainotify__card:nth-child(3) { animation-delay: calc(var(--motion-duration-slower) * 13.3); }
.nt-ainotify__spark { color: var(--text-accent); font-family: var(--font-family-mono); flex: none; }
.nt-ainotify__card b { font-weight: var(--font-weight-regular); color: var(--text-primary); }
@keyframes nt-ainotify-cycle {
  0% { opacity: 0; transform: translateY(var(--space-3)); }
  4%, 30% { opacity: 1; transform: translateY(0); }
  36%, 100% { opacity: 0; transform: translateY(calc(var(--space-2) * -1)); }
}
@media (prefers-reduced-motion: reduce) {
  .nt-ainotify__card { animation: none; opacity: 1; transform: none; }
}

/* Mobile: quebras de linha manuais de headline não mandam em telas estreitas */
@media (max-width: 640px) {
  .nt-lp h1 br, .nt-lp h2 br { display: none; }
  .nt-lp__section { padding-block: var(--space-16); }
  .nt-floatdoc { box-shadow: var(--elevation-2); }
}

/* ================= Aurora — fundo vivo SEM vídeo (decisão Vinicius 03/Ago) =================
   Roxo com pontos brancos na pegada do vídeo do Higgsfield; funciona em mobile e desktop. */
.nt-aurora { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.nt-aurora__beam {
  position: absolute;
  inset: -10%;
  background:
    linear-gradient(115deg, transparent 42%, var(--color-violet-200) 56%, transparent 68%),
    radial-gradient(ellipse 55% 60% at 80% 20%, var(--color-violet-300), transparent 70%),
    radial-gradient(ellipse 70% 55% at 15% 0%, var(--color-violet-100), transparent 65%);
  opacity: 0.55;
  filter: blur(var(--space-10));
  animation: nt-aurora-breathe calc(var(--motion-duration-slower) * 14) var(--motion-easing-in-out) infinite;
}
.nt-aurora__orb {
  position: absolute;
  border-radius: var(--radius-full);
  background: radial-gradient(circle, var(--color-neutral-0) 20%, transparent 70%);
  animation: nt-aurora-float calc(var(--motion-duration-slower) * 18) var(--motion-easing-in-out) infinite;
}
.nt-aurora__orb:nth-child(2) { width: var(--space-6); height: var(--space-6); top: 18%; left: 58%; opacity: 0.9; }
.nt-aurora__orb:nth-child(3) { width: var(--space-3); height: var(--space-3); top: 30%; left: 44%; opacity: 0.7; animation-delay: calc(var(--motion-duration-slower) * -6); }
.nt-aurora__orb:nth-child(4) { width: var(--space-10); height: var(--space-10); top: 12%; right: 12%; opacity: 0.8; filter: blur(var(--border-width-2)); animation-delay: calc(var(--motion-duration-slower) * -10); }
.nt-aurora__orb:nth-child(5) { width: var(--space-4); height: var(--space-4); bottom: 28%; right: 6%; opacity: 0.75; animation-delay: calc(var(--motion-duration-slower) * -3); }
.nt-aurora__orb:nth-child(6) { width: var(--space-8); height: var(--space-8); bottom: 14%; left: 8%; opacity: 0.5; filter: blur(var(--border-width-2)); animation-delay: calc(var(--motion-duration-slower) * -13); }
.nt-aurora__orb:nth-child(7) { width: var(--space-2); height: var(--space-2); top: 48%; right: 30%; opacity: 0.8; animation-delay: calc(var(--motion-duration-slower) * -8); }
@keyframes nt-aurora-breathe {
  50% { opacity: 0.75; transform: translateY(calc(var(--space-4) * -1)) scale(1.03); }
}
@keyframes nt-aurora-float {
  33% { transform: translate(var(--space-3), calc(var(--space-4) * -1)); opacity: 1; }
  66% { transform: translate(calc(var(--space-2) * -1), var(--space-2)); }
}
@media (prefers-reduced-motion: reduce) {
  .nt-aurora__beam, .nt-aurora__orb { animation: none; }
}

/* ---- Aurora v2 (03/Ago): efeito na página INTEIRA + adaptação nas bandas escuras ---- */
/* Camada fixa: acompanha o scroll, o efeito vive na página toda (mobile e desktop) */
.nt-aurora--page { position: fixed; z-index: 0; }
.nt-lp > *:not(.nt-aurora--page):not(dialog) { position: relative; z-index: 1; } /* dialog fica de fora: precisa do position fixed nativo do modal */
.nt-aurora--page .nt-aurora__beam { opacity: 0.4; }
.nt-aurora--page .nt-aurora__orb:nth-child(2)  { width: var(--space-6);  height: var(--space-6);  top: 14%; left: 58%; right: auto; bottom: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(3)  { width: var(--space-3);  height: var(--space-3);  top: 30%; left: 30%; right: auto; bottom: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(4)  { width: var(--space-10); height: var(--space-10); top: 10%; right: 10%; left: auto; bottom: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(5)  { width: var(--space-4);  height: var(--space-4);  bottom: 30%; right: 5%; left: auto; top: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(6)  { width: var(--space-8);  height: var(--space-8);  bottom: 12%; left: 7%; right: auto; top: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(7)  { width: var(--space-2);  height: var(--space-2);  top: 46%; right: 28%; left: auto; bottom: auto; }
.nt-aurora--page .nt-aurora__orb:nth-child(8)  { width: var(--space-3);  height: var(--space-3);  top: 64%; left: 16%; opacity: 0.7; animation-delay: calc(var(--motion-duration-slower) * -4); }
.nt-aurora--page .nt-aurora__orb:nth-child(9)  { width: var(--space-5);  height: var(--space-5);  bottom: 6%; right: 38%; opacity: 0.6; filter: blur(var(--border-width-2)); animation-delay: calc(var(--motion-duration-slower) * -15); }
.nt-aurora--page .nt-aurora__orb:nth-child(10) { width: var(--space-2);  height: var(--space-2);  top: 78%; left: 46%; opacity: 0.8; animation-delay: calc(var(--motion-duration-slower) * -9); }

/* Bandas escuras: aurora próprio (a banda é opaca e cobre a camada fixa) */
.nt-darkband { position: relative; overflow: clip; }
.nt-darkband > *:not(.nt-aurora) { position: relative; z-index: 1; }

/* Adaptação dark (vale pra banda escura E pra página dark inteira): beam violeta profundo, pontos viram estrelas */
[data-theme='dark'] .nt-aurora__beam {
  background:
    linear-gradient(115deg, transparent 42%, var(--color-violet-800) 56%, transparent 68%),
    radial-gradient(ellipse 55% 60% at 80% 20%, var(--color-violet-700), transparent 70%),
    radial-gradient(ellipse 70% 55% at 15% 0%, var(--color-violet-900), transparent 65%);
  opacity: 0.5;
}
[data-theme='dark'] .nt-aurora--page .nt-aurora__beam { opacity: 0.6; }

/* ---- Ajustes mobile (03/Ago, revisão do Vinicius) ---- */
@media (max-width: 640px) {
  /* Announce: quebra equilibrada em 2 linhas, sem palavra órfã */
  .nt-announce { text-wrap: balance; text-align: center; padding-inline: var(--space-4); }
  /* Nav mais baixa, CTA numa linha só */
  .nt-lp-nav__inner { height: var(--space-16); gap: var(--space-4); }
  .nt-lp-nav__inner .nt-btn { white-space: nowrap; padding-inline: var(--space-4); }
  /* Linha de confiança do hero: empilhada e centrada */
  .nt-rates { flex-direction: column; align-items: center; gap: var(--space-2); }
  /* Janela de produto: no mobile a tabela vira Automação + Economia (cabe inteira, sem corte) */
  .nt-window__main th:nth-child(2), .nt-window__main td:nth-child(2),
  .nt-window__main th:nth-child(3), .nt-window__main td:nth-child(3),
  .nt-window__main th:nth-child(5), .nt-window__main td:nth-child(5) { display: none; }
  .nt-window__main th:nth-child(4), .nt-window__main td:nth-child(4) { white-space: nowrap; text-align: right; }
  /* Bigquote: tipografia e respiro proporcionais à tela */
  .nt-bigquote { padding: var(--space-8) var(--space-5); }
  .nt-bigquote__text { font-size: var(--font-size-xl); }
  /* Countdown: as 4 células dividem a largura e cabem inteiras */
  .nt-countdown { gap: var(--space-2); }
  .nt-countdown__cell { flex: 1 1 0; min-width: 0; padding: var(--space-2); }
  .nt-countdown__num { font-size: var(--font-size-2xl); }
}

/* ================= v3 — LP Diagnóstico (interações pedidas pelo Vinicius, 03/Ago) ================= */

/* ---- Seletor interativo (S02 sistemas · S06 portfólio): tabs + preview vivo ---- */
.nt-picker { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--space-10); align-items: start; }
@media (max-width: 880px) { .nt-picker { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); } }
.nt-picker__tabs { display: flex; flex-direction: column; gap: var(--space-2); }
@media (max-width: 880px) { .nt-picker__tabs { flex-direction: row; overflow-x: auto; padding-bottom: var(--space-2); } }
.nt-picker__tab {
  font: inherit;
  text-align: left;
  padding: var(--space-4) var(--space-5);
  border: var(--border-width-1) solid var(--border-subtle);
  border-radius: var(--radius-lg);
  background: var(--surface-raised);
  cursor: pointer;
  transition-property: border-color, background-color, transform;
  transition-duration: var(--motion-duration-fast);
  transition-timing-function: var(--motion-easing-out);
}
@media (max-width: 880px) { .nt-picker__tab { flex: none; max-width: 70%; } }
.nt-picker__tab:hover { border-color: var(--color-violet-300); }
.nt-picker__tab:active { transform: scale(0.98); }
.nt-picker__tab[aria-selected='true'] { border-color: var(--color-violet-400); background: var(--surface-brand-wash); }
.nt-picker__tab b { display: block; font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-lg); color: var(--text-primary); }
.nt-picker__tab span { font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-picker__num { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-accent); letter-spacing: var(--font-tracking-wider); }
.nt-picker__scene { display: none; }
.nt-picker__scene[data-active] { display: block; }

/* ---- Cenas (mini-visualizações CSS por sistema/projeto) ---- */
.nt-scene { display: grid; gap: var(--space-3); padding: var(--space-5); }
[data-active] .nt-scene > * { animation: nt-scene-pop var(--motion-duration-slow) var(--motion-easing-out) both; }
[data-active] .nt-scene > *:nth-child(2) { animation-delay: calc(var(--motion-duration-fast) * 1); }
[data-active] .nt-scene > *:nth-child(3) { animation-delay: calc(var(--motion-duration-fast) * 2); }
[data-active] .nt-scene > *:nth-child(4) { animation-delay: calc(var(--motion-duration-fast) * 3); }
[data-active] .nt-scene > *:nth-child(5) { animation-delay: calc(var(--motion-duration-fast) * 4); }
@keyframes nt-scene-pop { from { opacity: 0; transform: translateY(var(--space-2)); } }
.nt-scene__row { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; }
.nt-scene__chip {
  font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase;
  color: var(--text-secondary); background: var(--surface-raised); border: var(--border-width-1) solid var(--border-subtle);
  border-radius: var(--radius-full); padding: var(--space-1) var(--space-3);
}
.nt-scene__chip--on { color: var(--text-accent); border-color: var(--color-violet-300); background: var(--surface-brand-wash); }
.nt-scene__cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); align-items: start; }
.nt-scene__coltitle { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: var(--font-tracking-wide); color: var(--text-muted); margin-bottom: var(--space-2); }
.nt-scene__col { display: grid; gap: var(--space-2); }
.nt-scene__card {
  border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-md);
  background: var(--surface-raised); padding: var(--space-2) var(--space-3);
  font-size: var(--font-size-2xs); color: var(--text-secondary);
}
.nt-scene__card b { display: block; font-weight: var(--font-weight-regular); font-size: var(--font-size-xs); color: var(--text-primary); }
.nt-scene__card--hot { border-color: var(--color-violet-300); background: var(--surface-brand-wash); }
.nt-scene__bars { display: flex; align-items: flex-end; gap: var(--space-3); height: var(--space-24); }
.nt-scene__bar { flex: 1; border-radius: var(--radius-sm) var(--radius-sm) 0 0; background: var(--color-violet-200); transform-origin: bottom; }
.nt-scene__bar--hi { background: var(--color-violet-400); }
[data-active] .nt-scene__bar { animation: nt-scene-grow var(--motion-duration-slower) var(--motion-easing-out) both; }
[data-active] .nt-scene__bar:nth-child(2) { animation-delay: calc(var(--motion-duration-fast) * 1); }
[data-active] .nt-scene__bar:nth-child(3) { animation-delay: calc(var(--motion-duration-fast) * 2); }
[data-active] .nt-scene__bar:nth-child(4) { animation-delay: calc(var(--motion-duration-fast) * 3); }
[data-active] .nt-scene__bar:nth-child(5) { animation-delay: calc(var(--motion-duration-fast) * 4); }
@keyframes nt-scene-grow { from { transform: scaleY(0); } }
.nt-scene__h20 { height: 20%; } .nt-scene__h40 { height: 40%; } .nt-scene__h60 { height: 60%; } .nt-scene__h80 { height: 80%; } .nt-scene__h100 { height: 100%; }
.nt-scene__line { height: var(--space-2); border-radius: var(--radius-full); background: var(--border-default); }
.nt-scene__line--accent { background: var(--color-violet-300); }
.nt-scene__w40 { width: 40%; } .nt-scene__w60 { width: 60%; } .nt-scene__w80 { width: 80%; } .nt-scene__w95 { width: 95%; }
[data-active] .nt-scene__line { animation: nt-scene-type var(--motion-duration-slower) var(--motion-easing-out) both; }
@keyframes nt-scene-type { from { width: 0; } }
.nt-scene__thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.nt-scene__thumb { aspect-ratio: 4 / 5; border-radius: var(--radius-md); border: var(--border-width-1) solid var(--border-subtle); }
.nt-scene__thumb:nth-child(6n+1) { background: var(--color-violet-100); }
.nt-scene__thumb:nth-child(6n+2) { background: var(--color-azure-100); }
.nt-scene__thumb:nth-child(6n+3) { background: var(--color-amber-100); }
.nt-scene__thumb:nth-child(6n+4) { background: var(--color-green-100); }
.nt-scene__thumb:nth-child(6n+5) { background: var(--color-orchid-100); }
.nt-scene__thumb:nth-child(6n+6) { background: var(--color-teal-100); }
.nt-scene__stack { display: flex; flex-direction: column; gap: var(--space-2); }
.nt-scene__bubble { max-width: 85%; padding: var(--space-2) var(--space-3); border-radius: var(--radius-lg); font-size: var(--font-size-xs); }
.nt-scene__bubble--in { align-self: flex-start; background: var(--surface-raised); border: var(--border-width-1) solid var(--border-subtle); color: var(--text-secondary); }
.nt-scene__bubble--out { align-self: flex-end; background: var(--color-violet-600); color: var(--color-neutral-0); }
.nt-scene__ok { color: var(--color-green-600); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); }
.nt-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--space-1); }
.nt-cal span { aspect-ratio: 1 / 1; border-radius: var(--radius-sm); background: var(--surface-sunken); }
.nt-cal span[data-on] { background: var(--color-violet-300); }

/* ---- Dia a dia clicável (S03): details/summary com cena ---- */
.nt-daylist { border-top: var(--border-width-1) solid var(--border-default); }
.nt-daylist details { border-bottom: var(--border-width-1) solid var(--border-default); }
.nt-daylist summary {
  list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--space-4);
  padding-block: var(--space-5); cursor: pointer;
  font-family: var(--font-family-display); font-size: var(--font-size-lg); color: var(--text-primary);
}
.nt-daylist summary::-webkit-details-marker { display: none; }
.nt-daylist__plus { font-family: var(--font-family-mono); color: var(--text-accent); transition: transform var(--motion-duration-base) var(--motion-easing-out); flex: none; }
.nt-daylist details[open] .nt-daylist__plus { transform: rotate(45deg); }
.nt-daylist__panel { padding-bottom: var(--space-6); max-width: var(--container-prose); }
.nt-daylist details[open] .nt-scene > * { animation: nt-scene-pop var(--motion-duration-slow) var(--motion-easing-out) both; }
.nt-daylist details[open] .nt-scene > *:nth-child(2) { animation-delay: calc(var(--motion-duration-fast) * 1); }
.nt-daylist details[open] .nt-scene > *:nth-child(3) { animation-delay: calc(var(--motion-duration-fast) * 2); }
.nt-daylist .nt-scene { padding: var(--space-4); border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-lg); background: var(--surface-raised); }

/* ---- Wizard do diagnóstico (popup etapa a etapa) ---- */
.nt-wizard__progress { display: flex; gap: var(--space-1); margin-bottom: var(--space-6); }
.nt-wizard__seg { height: var(--space-1); flex: 1; border-radius: var(--radius-full); background: var(--border-subtle); transition: background-color var(--motion-duration-base) var(--motion-easing-out); }
.nt-wizard__seg[data-done] { background: var(--color-violet-600); }
.nt-wizard__step { display: none; }
.nt-wizard__step[data-active] { display: grid; gap: var(--space-4); animation: nt-scene-pop var(--motion-duration-base) var(--motion-easing-out) both; }
.nt-wizard__q { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-2xl); margin: 0; }
.nt-wizard__pills { display: grid; gap: var(--space-2); }
.nt-pillopt {
  font: inherit; font-size: var(--font-size-md); color: var(--text-primary); text-align: left;
  padding: var(--space-4) var(--space-5);
  border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-lg); background: var(--surface-raised);
  cursor: pointer;
  transition-property: border-color, background-color, transform;
  transition-duration: var(--motion-duration-fast);
  transition-timing-function: var(--motion-easing-out);
}
.nt-pillopt:hover { border-color: var(--color-violet-400); }
.nt-pillopt:active { transform: scale(0.96); }
.nt-pillopt[data-picked] { border-color: var(--color-violet-600); background: var(--surface-brand-wash); }
.nt-wizard__nav { display: flex; justify-content: space-between; align-items: center; }
.nt-wizard__back { font: inherit; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); background: none; border: 0; cursor: pointer; padding: var(--space-2); }
.nt-wizard__back.is-hidden { visibility: hidden; }
.nt-wizard__err { color: var(--color-red-600); font-size: var(--font-size-sm); display: none; margin: 0; }
.nt-wizard__err[data-show] { display: block; }
.nt-wizard__done { display: none; }
.nt-wizard__done[data-active] { display: grid; gap: var(--space-4); animation: nt-scene-pop var(--motion-duration-base) var(--motion-easing-out) both; }

/* ---- Quem constrói (S07) ---- */
.nt-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); }
@media (max-width: 880px) { .nt-team { grid-template-columns: minmax(0, 1fr); } }
.nt-team__card { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-xl); background: var(--surface-raised); padding: var(--space-8); display: grid; gap: var(--space-3); justify-items: start; }
.nt-team__ava { width: var(--space-16); height: var(--space-16); border-radius: var(--radius-full); background: var(--surface-brand-wash); border: var(--border-width-1) solid var(--color-violet-200); display: grid; place-items: center; font-family: var(--font-family-display); font-size: var(--font-size-xl); color: var(--text-accent); }
.nt-team__name { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-xl); margin: 0; }
.nt-team__role { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-accent); }
.nt-team__bio { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0; }

/* ---- Três portas (S08) ---- */
.nt-doors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
@media (max-width: 880px) { .nt-doors { grid-template-columns: minmax(0, 1fr); } }
.nt-doors__card { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-xl); background: var(--surface-raised); padding: var(--space-8); display: grid; gap: var(--space-3); align-content: start; }
.nt-doors__card--main { border-color: var(--color-violet-300); background: var(--surface-brand-wash); }
.nt-doors__num { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wider); color: var(--text-accent); }
.nt-doors__title { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-xl); margin: 0; }
.nt-doors__body { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0; }

/* ---- Nota de rodapé da garantia ---- */
.nt-asterisk { color: inherit; text-decoration: none; }
.nt-asterisk:hover { color: var(--text-accent); }
.nt-footnote { font-size: var(--font-size-xs); color: var(--text-muted); }

/* ---- v3.1: cenas nível-produto (feedback Vinicius: "tem que ser real") ---- */
.nt-app { font-size: var(--font-size-2xs); }
.nt-app__bar { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) var(--space-4); border-bottom: var(--border-width-1) solid var(--border-subtle); }
.nt-app__logo { font-family: var(--font-family-display); font-size: var(--font-size-sm); color: var(--text-primary); }
.nt-app__search { flex: 1; max-width: 40%; height: var(--space-6); border-radius: var(--radius-full); background: var(--surface-sunken); }
.nt-app__main { padding: var(--space-4); display: grid; gap: var(--space-3); }
.nt-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.nt-kpi { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-md); padding: var(--space-2) var(--space-3); background: var(--surface-raised); }
.nt-kpi span { display: block; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); text-transform: uppercase; letter-spacing: var(--font-tracking-wide); color: var(--text-muted); }
.nt-kpi b { display: block; font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-lg); color: var(--text-primary); font-variant-numeric: tabular-nums; }
.nt-kpi em { font-style: normal; font-size: var(--font-size-2xs); color: var(--color-green-600); }
.nt-progress { height: var(--space-2); border-radius: var(--radius-full); background: var(--surface-sunken); overflow: hidden; }
.nt-progress i { display: block; height: 100%; border-radius: var(--radius-full); background: var(--color-violet-600); }
[data-active] .nt-progress i { animation: nt-scene-type var(--motion-duration-slower) var(--motion-easing-out) both; }
.nt-adcard { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-md); overflow: hidden; background: var(--surface-raised); }
.nt-adcard__img { aspect-ratio: 4 / 3; }
.nt-adcard:nth-child(3n+1) .nt-adcard__img { background: var(--color-violet-100); }
.nt-adcard:nth-child(3n+2) .nt-adcard__img { background: var(--color-amber-100); }
.nt-adcard:nth-child(3n+3) .nt-adcard__img { background: var(--color-azure-100); }
.nt-adcard__txt { padding: var(--space-2) var(--space-3); display: grid; gap: var(--space-1); }
.nt-adcard__txt b { font-weight: var(--font-weight-regular); font-size: var(--font-size-2xs); color: var(--text-primary); }
.nt-adcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.nt-sched { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) 0; border-top: var(--border-width-1) solid var(--border-subtle); font-size: var(--font-size-2xs); color: var(--text-secondary); }
.nt-sched:first-child { border-top: 0; }
.nt-sched b { font-family: var(--font-family-mono); font-weight: var(--font-weight-regular); color: var(--text-primary); flex: none; }
.nt-sched .nt-scene__chip { margin-left: auto; }
.nt-typing { display: block; max-width: 100%; overflow: hidden; white-space: nowrap; border-right: var(--border-width-2) solid var(--color-violet-600); font-size: var(--font-size-xs); color: var(--text-secondary); }
[data-active] .nt-typing { animation: nt-typewrite calc(var(--motion-duration-slower) * 6) steps(42, end) both, nt-caret calc(var(--motion-duration-slower) * 2) step-end infinite; }
@keyframes nt-typewrite { from { max-width: 0; } to { max-width: 100%; } }
@keyframes nt-caret { 50% { border-color: transparent; } }
.nt-agent { display: flex; align-items: center; gap: var(--space-2); font-size: var(--font-size-2xs); color: var(--text-secondary); padding: var(--space-2) 0; border-top: var(--border-width-1) solid var(--border-subtle); }
.nt-agent:first-child { border-top: 0; }
.nt-agent .nt-livedot { width: var(--space-2); height: var(--space-2); }
.nt-agent__off { width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); background: var(--border-default); flex: none; }
.nt-qabadge { display: inline-flex; align-items: center; gap: var(--space-2); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--color-green-600); border: var(--border-width-1) solid var(--color-green-200); background: var(--color-green-100); border-radius: var(--radius-full); padding: var(--space-1) var(--space-3); }
.nt-mini-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--space-3); align-items: start; }

/* ---- v3.1: planos (S08 estilo "Planos para escolher") ---- */
.nt-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); align-items: stretch; }
@media (max-width: 880px) { .nt-plans { grid-template-columns: minmax(0, 1fr); } }
.nt-plan { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-xl); background: var(--surface-raised); padding: var(--space-8); display: flex; flex-direction: column; gap: var(--space-4); }
.nt-plan--main { border-color: var(--color-violet-400); background: var(--surface-brand-wash); box-shadow: var(--elevation-2); }
.nt-plan__flag { align-self: flex-start; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-accent); border: var(--border-width-1) solid var(--color-violet-300); border-radius: var(--radius-full); padding: var(--space-1) var(--space-3); }
.nt-plan__title { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-2xl); margin: 0; }
.nt-plan__desc { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0; }
.nt-plan__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.nt-plan__list li { display: flex; gap: var(--space-3); align-items: baseline; padding: var(--space-2) 0; border-top: var(--border-width-1) solid var(--border-subtle); font-size: var(--font-size-sm); color: var(--text-secondary); }
.nt-plan--main .nt-plan__list li { border-top-color: var(--color-violet-200); color: var(--text-primary); }
.nt-plan__check { color: var(--text-accent); font-family: var(--font-family-mono); flex: none; }
.nt-plan__cta { margin-top: auto; }

/* Reduced motion: cenas e wizard mostram o estado final, sem animação */
@media (prefers-reduced-motion: reduce) {
  [data-active] .nt-scene > *, [data-active] .nt-scene__bar, [data-active] .nt-scene__line,
  [data-active] .nt-typing, [data-active] .nt-progress i,
  .nt-daylist details[open] .nt-scene > *, .nt-wizard__step[data-active], .nt-wizard__done[data-active] { animation: none; }
}

/* ---- v3.2: identidade real por produto + autoplay stories (pacote aprovado 03/Ago) ---- */
/* Barra de progresso do autoplay dentro do tab ativo */
.nt-picker__tab { position: relative; overflow: hidden; }
.nt-picker__tabbar { position: absolute; left: 0; bottom: 0; height: var(--border-width-2); width: 0; background: var(--color-violet-400); }
.nt-picker[data-auto] .nt-picker__tab[aria-selected='true'] .nt-picker__tabbar { animation: nt-autofill calc(var(--motion-duration-slower) * 12) linear both; }
.nt-picker[data-auto]:hover .nt-picker__tabbar, .nt-picker[data-auto]:focus-within .nt-picker__tabbar { animation-play-state: paused; }
@keyframes nt-autofill { to { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .nt-picker[data-auto] .nt-picker__tab[aria-selected='true'] .nt-picker__tabbar { animation: none; } }

/* Glow atrás da janela na cor do produto ativo (pseudo vira grid item na coluna da janela) */
.nt-picker::before { content: ''; grid-column: 2; grid-row: 1; place-self: stretch; margin: calc(var(--space-6) * -1); border-radius: var(--radius-2xl); background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-violet-200), transparent 70%); filter: blur(var(--space-8)); opacity: 0.7; transition: background var(--motion-duration-slow) var(--motion-easing-out); }
@media (max-width: 880px) { .nt-picker::before { display: none; } }
.nt-picker:has([data-scene='hera'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-green-200), transparent 70%); }
.nt-picker:has([data-scene='copysys'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-orange-200), transparent 70%); }
.nt-picker:has([data-scene='central'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-azure-200), transparent 70%); }
.nt-picker:has([data-scene='criativos'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-amber-200), transparent 70%); }
.nt-picker:has([data-scene='dash'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-azure-200), transparent 70%); }
.nt-picker:has([data-scene='conteudo'][data-active])::before { background: radial-gradient(ellipse 70% 60% at 50% 40%, var(--color-amber-200), transparent 70%); }
.nt-picker > .nt-window { position: relative; grid-column: 2; grid-row: 1; }
.nt-picker__tabs { grid-column: 1; grid-row: 1; }
@media (max-width: 880px) {
  .nt-picker__tabs { grid-column: 1; grid-row: 1; }
  .nt-picker > .nt-window { grid-column: 1; grid-row: 2; }
}
.nt-kpi--good b { color: var(--color-green-600); }

/* Temas de produto (réplicas: Hera=verde-lima · Brain=terracota) */
.nt-applogo { font-family: var(--font-family-display); font-size: var(--font-size-sm); color: var(--text-primary); }
.nt-applogo--pill { border-radius: var(--radius-md); padding: var(--space-1) var(--space-3); }
.nt-app--lime .nt-applogo--pill { background: var(--color-green-300); color: var(--color-neutral-950); }
.nt-app--lime .nt-scene__chip--on { color: var(--color-green-800); border-color: var(--color-green-300); background: var(--color-green-100); }
.nt-app--lime .nt-kpi em { color: var(--color-green-600); }
.nt-app--terra .nt-applogo--pill { background: var(--color-orange-600); color: var(--color-neutral-0); }
.nt-app--terra .nt-scene__chip--on { color: var(--color-orange-800); border-color: var(--color-orange-300); background: var(--color-orange-100); }
.nt-appbanner { display: flex; align-items: center; gap: var(--space-3); border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-md); padding: var(--space-2) var(--space-3); font-size: var(--font-size-2xs); color: var(--text-secondary); }
.nt-appbanner--lime { background: var(--color-green-100); border-color: var(--color-green-200); }
.nt-appbanner b { font-weight: var(--font-weight-regular); color: var(--text-primary); }

/* Nomics Brain: saudação central + input de chat */
.nt-brainhero { display: grid; justify-items: center; text-align: center; gap: var(--space-3); padding-block: var(--space-4); }
.nt-brainhero__hi { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-lg); color: var(--text-primary); }
.nt-braininput { display: flex; align-items: center; gap: var(--space-3); width: 100%; max-width: 90%; border: var(--border-width-1) solid var(--border-default); border-radius: var(--radius-xl); padding: var(--space-3) var(--space-4); font-size: var(--font-size-2xs); color: var(--text-muted); text-align: left; }
.nt-braininput span:first-child { flex: 1; }
.nt-brainsend { width: var(--space-6); height: var(--space-6); border-radius: var(--radius-full); background: var(--color-orange-600); color: var(--color-neutral-0); display: grid; place-items: center; flex: none; }

/* Portal: canvas de funis com zonas coloridas */
.nt-canvas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); }
.nt-canvas__zone { border: var(--border-width-1) dashed var(--color-azure-300); background: var(--color-azure-100); border-radius: var(--radius-lg); padding: var(--space-3); display: grid; gap: var(--space-2); }
.nt-canvas__zone--pink { border-color: var(--color-red-300); background: var(--color-red-100); }
.nt-canvas__label { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); }
.nt-canvas .nt-scene__card { box-shadow: var(--elevation-1); }
.nt-portalnav { display: grid; gap: var(--space-1); font-size: var(--font-size-2xs); color: var(--text-secondary); }
.nt-portalnav span { padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); }
.nt-portalnav span[data-on] { background: var(--surface-brand-wash); color: var(--text-accent); }

/* Rodapé: assinatura Grupo Nomics */
.nt-groupbrand { display: inline-flex; align-items: center; gap: var(--space-2); font-family: var(--font-family-display); font-size: var(--font-size-md); color: var(--text-primary); text-decoration: none; }
.nt-groupbrand svg { width: var(--space-5); height: var(--space-4); color: var(--text-primary); }

/* Cenas novas no mobile: split e canvas empilham */
@media (max-width: 640px) {
  .nt-mini-split { grid-template-columns: minmax(0, 1fr); }
  .nt-canvas { grid-template-columns: minmax(0, 1fr); }
  .nt-braininput { max-width: 100%; }
}

/* Vitrine com captura real do produto (decisão Vinicius: imagens reais, dados fictícios) */
.nt-scene--shot { padding: 0; gap: 0; }
.nt-shot { display: block; width: 100%; aspect-ratio: 2 / 1; object-fit: cover; object-position: left top; background: var(--surface-sunken); }
.nt-scene--shot .nt-scene__ok { display: block; padding: var(--space-3) var(--space-5); border-top: var(--border-width-1) solid var(--border-subtle); }

/* ---- v3.3: showcase centrado do portfólio (formato distinto da S02) ---- */
.nt-picker--showcase { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: var(--space-8); }
.nt-picker--showcase::before { grid-column: 1; grid-row: 2; }
.nt-picker--showcase .nt-picker__tabs { grid-column: 1; grid-row: 1; flex-direction: row; flex-wrap: wrap; justify-content: center; }
.nt-picker--showcase > .nt-window { grid-column: 1; grid-row: 2; width: 100%; }
.nt-picker--showcase .nt-picker__tab { border-radius: var(--radius-full); padding: var(--space-2) var(--space-5); font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-secondary); }
.nt-picker--showcase .nt-picker__tab[aria-selected='true'] { color: var(--text-accent); }
@media (max-width: 880px) { .nt-picker--showcase .nt-picker__tabs { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; max-width: 100%; padding-bottom: var(--space-2); } .nt-picker--showcase .nt-picker__tab { flex: none; max-width: none; } }
.nt-showcase__meta { grid-column: 1; grid-row: 3; display: none; margin: 0; text-align: center; max-width: var(--container-prose); font-size: var(--font-size-lg); line-height: var(--font-leading-relaxed); color: var(--text-secondary); }
.nt-showcase__meta[data-active] { display: block; animation: nt-scene-pop var(--motion-duration-slow) var(--motion-easing-out) both; }

/* ---- v3.3: um dia na sua operação (S03 vira linha do tempo) ---- */
.nt-timeline { max-width: var(--container-prose); margin-inline: auto; display: grid; }
.nt-tl__item { display: grid; grid-template-columns: var(--space-16) var(--space-6) minmax(0, 1fr); gap: var(--space-3); }
.nt-tl__time { font-family: var(--font-family-mono); font-size: var(--font-size-sm); color: var(--text-accent); text-align: right; padding-top: var(--space-5); }
.nt-tl__rail { position: relative; }
.nt-tl__rail::before { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: var(--border-width-1); background: var(--border-default); }
.nt-tl__item:first-child .nt-tl__rail::before { top: var(--space-6); }
.nt-tl__item:last-child .nt-tl__rail::before { bottom: auto; height: var(--space-6); }
.nt-tl__dot { position: absolute; top: var(--space-5); left: 50%; transform: translateX(-50%); width: var(--space-3); height: var(--space-3); border-radius: var(--radius-full); background: var(--color-green-400); animation: nt-pulse-dot calc(var(--motion-duration-slower) * 2) var(--motion-easing-in-out) infinite; }
@media (prefers-reduced-motion: reduce) { .nt-tl__dot { animation: none; } }
.nt-tl__card { border: var(--border-width-1) solid var(--border-subtle); border-radius: var(--radius-lg); background: var(--surface-raised); padding: var(--space-5) var(--space-6); margin-bottom: var(--space-5); display: grid; gap: var(--space-2); }
.nt-tl__title { font-family: var(--font-family-display); font-weight: var(--font-weight-regular); font-size: var(--font-size-lg); margin: 0; }
.nt-tl__body { font-size: var(--font-size-sm); color: var(--text-secondary); margin: 0; }
@media (max-width: 640px) {
  .nt-tl__item { grid-template-columns: var(--space-12) var(--space-5) minmax(0, 1fr); }
  .nt-tl__time { font-size: var(--font-size-2xs); }
  .nt-tl__card { padding: var(--space-4); }
}

/* ---- v3.4: refinos Vinicius (timeline mastigada, showcase menor, mobile centrado) ---- */
/* Showcase: janela menor, centrada */
.nt-picker--showcase > .nt-window { max-width: var(--container-narrow); }

/* Timeline: contraste antes ✕ / agora ✓ */
.nt-tl__compare { display: grid; gap: var(--space-1); margin-top: var(--space-1); }
.nt-tl__was { font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-muted); }

/* Rodapé centralizado */
.nt-footer-center { display: grid; gap: var(--space-3); justify-items: center; text-align: center; }
.nt-footer-center .nt-footnote { display: block; }
.nt-footer-center p[style] { justify-content: center; }

/* Mobile: nav só com a logo centrada (CTA some; o hero e as seções já têm CTA) */
@media (max-width: 640px) {
  .nt-lp-nav__inner { justify-content: center; height: auto; padding-block: var(--space-8) var(--space-2); }
  .nt-lp-nav__inner > .nt-btn { display: none; }
  /* logo e hero mais próximos no mobile */
  .nt-hero-center { padding-block-start: var(--space-6); }
  /* Processo (banda escura): tudo centrado */
  .nt-process > div { text-align: center; }
  /* S02 no mobile: chips compactos (sem descrição no tab) + descrição embaixo da janela */
  .nt-picker--sys .nt-picker__tab span { display: none; }
  .nt-picker--sys .nt-picker__tab { max-width: none; flex: none; }
  .nt-picker--sys .nt-picker__tab b { font-size: var(--font-size-sm); }
  .nt-picker--sys .nt-showcase__meta { grid-row: auto; }
  .nt-picker--sys .nt-showcase__meta[data-active] { display: block; font-size: var(--font-size-sm); }
}
/* Desktop: metas da S02 ficam escondidas (a descrição já vive nos tabs) */
@media (min-width: 641px) { .nt-picker--sys .nt-showcase__meta { display: none; } }

/* ---- v3.5: dia a dia vira celular com notificações da IA (3ª forma da S03) ---- */
.nt-phone { width: 100%; max-width: calc(var(--space-24) * 3.6); margin-inline: auto; border: var(--border-width-2) solid var(--color-neutral-800); border-radius: var(--radius-2xl); padding: var(--space-2); background: var(--surface-page); box-shadow: var(--elevation-3); }
.nt-phone__screen { border-radius: var(--radius-xl); background: var(--surface-sunken); padding: var(--space-3); padding-bottom: var(--space-8); display: grid; gap: var(--space-2); overflow: hidden; }
.nt-phone__statusbar { display: flex; justify-content: space-between; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); color: var(--text-muted); padding: var(--space-1) var(--space-2); }
.nt-phone__day { text-align: center; font-family: var(--font-family-mono); font-size: var(--font-size-2xs); letter-spacing: var(--font-tracking-wide); text-transform: uppercase; color: var(--text-muted); padding-block: var(--space-1); }
.nt-notif { display: flex; gap: var(--space-3); align-items: flex-start; background: var(--surface-raised); border-radius: var(--radius-lg); padding: var(--space-3); box-shadow: var(--elevation-1); font-size: var(--font-size-2xs); color: var(--text-secondary); }
.nt-notif__icon { width: var(--space-8); height: var(--space-8); border-radius: var(--radius-md); flex: none; display: grid; place-items: center; font-size: var(--font-size-sm); }
.nt-notif__icon--fin { background: var(--color-azure-100); }
.nt-notif__icon--wpp { background: var(--color-green-100); }
.nt-notif__icon--com { background: var(--color-amber-100); }
.nt-notif__icon--onb { background: var(--color-violet-100); }
.nt-notif__body { min-width: 0; }
.nt-notif__body b { display: block; font-weight: var(--font-weight-regular); font-size: var(--font-size-xs); color: var(--text-primary); }
.nt-notif__time { margin-left: auto; font-family: var(--font-family-mono); flex: none; color: var(--text-muted); }

/* ---- v3.6: aurora com mais detalhe (2º feixe cruzado + poeira de estrelas) ---- */
.nt-aurora__beam--2 {
  background:
    linear-gradient(245deg, transparent 40%, var(--color-violet-100) 54%, transparent 68%),
    radial-gradient(ellipse 50% 45% at 18% 78%, var(--color-violet-200), transparent 70%);
  opacity: 0.45;
  animation-duration: calc(var(--motion-duration-slower) * 19);
  animation-delay: calc(var(--motion-duration-slower) * -7);
}
.nt-aurora--page .nt-aurora__orb:nth-child(12) { width: var(--space-1); height: var(--space-1); top: 22%; left: 22%; opacity: 0.7; animation-delay: calc(var(--motion-duration-slower) * -2); }
.nt-aurora--page .nt-aurora__orb:nth-child(13) { width: var(--space-2); height: var(--space-2); top: 38%; right: 14%; left: auto; opacity: 0.6; animation-delay: calc(var(--motion-duration-slower) * -11); }
.nt-aurora--page .nt-aurora__orb:nth-child(14) { width: var(--space-1); height: var(--space-1); top: 58%; left: 8%; opacity: 0.8; animation-delay: calc(var(--motion-duration-slower) * -5); }
.nt-aurora--page .nt-aurora__orb:nth-child(15) { width: var(--space-1); height: var(--space-1); bottom: 20%; right: 22%; left: auto; top: auto; opacity: 0.7; animation-delay: calc(var(--motion-duration-slower) * -14); }
.nt-aurora--page .nt-aurora__orb:nth-child(16) { width: var(--space-2); height: var(--space-2); bottom: 40%; left: 30%; top: auto; opacity: 0.5; filter: blur(var(--border-width-2)); animation-delay: calc(var(--motion-duration-slower) * -8); }

/* ================= Skin "SKV" — dark estilo SkillTree/Altari (amostra 04/Ago) =================
   Canvas escuro com céu estrelado, vidro translúcido, headline sans+serif itálico, CTA claro. */
.nt-skv .nt-stars { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.nt-skv .nt-stars span { position: absolute; width: calc(var(--space-1) / 2); height: calc(var(--space-1) / 2); border-radius: var(--radius-full); background: var(--color-neutral-0); opacity: 0.5; animation: nt-twinkle calc(var(--motion-duration-slower) * 7) var(--motion-easing-in-out) infinite; }
.nt-skv .nt-stars span:nth-child(1)  { top: 8%;  left: 12%; }
.nt-skv .nt-stars span:nth-child(2)  { top: 15%; left: 78%; animation-delay: calc(var(--motion-duration-slower) * -2); }
.nt-skv .nt-stars span:nth-child(3)  { top: 24%; left: 40%; animation-delay: calc(var(--motion-duration-slower) * -5); }
.nt-skv .nt-stars span:nth-child(4)  { top: 32%; left: 90%; animation-delay: calc(var(--motion-duration-slower) * -1); }
.nt-skv .nt-stars span:nth-child(5)  { top: 45%; left: 6%;  animation-delay: calc(var(--motion-duration-slower) * -4); }
.nt-skv .nt-stars span:nth-child(6)  { top: 52%; left: 64%; animation-delay: calc(var(--motion-duration-slower) * -6); }
.nt-skv .nt-stars span:nth-child(7)  { top: 63%; left: 28%; animation-delay: calc(var(--motion-duration-slower) * -3); }
.nt-skv .nt-stars span:nth-child(8)  { top: 71%; left: 84%; animation-delay: calc(var(--motion-duration-slower) * -7); }
.nt-skv .nt-stars span:nth-child(9)  { top: 80%; left: 48%; animation-delay: calc(var(--motion-duration-slower) * -2); }
.nt-skv .nt-stars span:nth-child(10) { top: 88%; left: 16%; animation-delay: calc(var(--motion-duration-slower) * -5); }
.nt-skv .nt-stars span:nth-child(11) { top: 12%; left: 55%; opacity: 0.3; animation-delay: calc(var(--motion-duration-slower) * -4); }
.nt-skv .nt-stars span:nth-child(12) { top: 92%; left: 72%; opacity: 0.3; animation-delay: calc(var(--motion-duration-slower) * -6); }
@keyframes nt-twinkle { 50% { opacity: 0.12; } }
@media (prefers-reduced-motion: reduce) { .nt-skv .nt-stars span { animation: none; } }

/* Nav em pílula de vidro */
.nt-skv .nt-lp-nav__inner {
  border: var(--border-width-1) solid color-mix(in oklab, var(--color-neutral-0) 14%, transparent);
  border-radius: var(--radius-full);
  padding-inline: var(--space-6);
  margin-top: var(--space-4);
  background: color-mix(in oklab, var(--color-neutral-0) 4%, transparent);
  backdrop-filter: blur(var(--space-3));
}

/* Headline misturada: linha 1 sans, palavra-chave em serif itálico lilás */
.nt-skv__h1-sans { font-family: var(--font-family-body); letter-spacing: var(--font-tracking-tight); }
.nt-skv__h1-serif { font-family: var(--font-family-display); font-style: italic; color: var(--text-accent); }

/* Vidro translúcido nas superfícies-chave */
.nt-skv .nt-picker__tab,
.nt-skv .nt-plan,
.nt-skv .nt-team__card,
.nt-skv .nt-doors__card,
.nt-skv .nt-tl__card,
.nt-skv .nt-versus__col {
  background: color-mix(in oklab, var(--color-neutral-0) 3%, transparent);
  border-color: color-mix(in oklab, var(--color-neutral-0) 12%, transparent);
}
.nt-skv .nt-picker__tab[aria-selected='true'],
.nt-skv .nt-plan--main,
.nt-skv .nt-versus__col--us {
  background: color-mix(in oklab, var(--color-violet-400) 10%, transparent);
  border-color: color-mix(in oklab, var(--color-violet-400) 45%, transparent);
}
.nt-skv .nt-window { border-color: color-mix(in oklab, var(--color-neutral-0) 14%, transparent); box-shadow: var(--elevation-3); }
.nt-skv .nt-announce { background: color-mix(in oklab, var(--color-neutral-0) 6%, transparent); color: var(--text-primary); border-bottom: var(--border-width-1) solid color-mix(in oklab, var(--color-neutral-0) 10%, transparent); }

/* Bandas internas: no skin dark, as darkbands viram um degrau mais profundo */
.nt-skv .nt-darkband { background: var(--color-neutral-950); }

/* Skin SKV: aurora contida (SkillTree é quase preto, luz pontual) */
.nt-skv .nt-aurora__beam { opacity: 0.12; }
.nt-skv .nt-aurora--page .nt-aurora__beam { opacity: 0.15; }
.nt-skv .nt-aurora__beam--2 { opacity: 0.08; }
.nt-skv .nt-aurora__beam { animation: none; }
.nt-skv .nt-hero-wash { background: radial-gradient(ellipse 65% 45% at 50% 0%, color-mix(in oklab, var(--color-violet-600) 16%, transparent), transparent 70%); }

/* Quem constrói: foto real dos sócios (puxada do site do Grupo Nomics) */
.nt-team__photo { width: var(--space-24); height: var(--space-24); border-radius: var(--radius-full); object-fit: cover; border: var(--border-width-1) solid var(--border-subtle); background: var(--surface-sunken); }

/* Botão WhatsApp (verde, pedido do Vinicius: falar direto com o CTO no fim do quiz MQL) */
.nt-btn--whatsapp { background: var(--color-green-600); color: var(--color-neutral-0); border-color: var(--color-green-600); }
.nt-btn--whatsapp:hover { background: var(--color-green-800); border-color: var(--color-green-800); color: var(--color-neutral-0); }