/* GENERATED — cópia vendorizada de potenzia-digital/viviane-pagani-design-system
 * origem: 02-design-tokens/tokens.css @ 029edef4
 * NÃO EDITAR À MÃO. Corrija no repositório do designer e rode:
 *   node recursos/design-system/sincronizar-ds.mjs
 */
:root {
  /* GERADO por build-tokens.py — não editar. Fonte: *.json */

  /* Cores primitivas (base, temporada, reservado, véu, neutros derivados, feedback) */
  --color-base-nevoa: #93AFBD;
  --color-base-pedra: #93A7B2;
  --color-base-dourado: #EAD392;
  --color-base-branco: #FFFFFF;
  --color-base-raiz: #574639;
  --color-temporada-limao: #E0D25C;
  --color-temporada-menta: #8EDFD3;
  --color-temporada-verde: #88AD78;
  --color-temporada-rosa: #DB638A;
  --color-reservado-azulEscuro: #3F5A68;
  --color-veu-16: rgba(87, 70, 57, 0.16);
  --color-veu-38: rgba(87, 70, 57, 0.38);
  --color-veu-55: rgba(87, 70, 57, 0.55);
  --color-veu-74: rgba(87, 70, 57, 0.74);
  --color-veu-95: rgba(87, 70, 57, 0.95);
  --color-neutral-50: #F8F8F7;
  --color-neutral-100: #F2F0EF;
  --color-neutral-200: #E4E1DF;
  --color-neutral-300: #D7D3CF;
  --color-neutral-400: #BCB5B0;
  --color-neutral-500: #938980;
  --color-neutral-600: #7F7269;
  --color-neutral-700: #6F6055;
  --color-feedback-success-base: #88AD78;
  --color-feedback-success-text: #637E58;
  --color-feedback-success-soft: #ECF2E9;
  --color-feedback-warning-base: #EAD392;
  --color-feedback-warning-text: #817450;
  --color-feedback-warning-soft: #FCF8EE;
  --color-feedback-error-base: #DB638A;
  --color-feedback-error-text: #BA5475;
  --color-feedback-error-soft: #F9E6EC;
  --color-feedback-info-base: #93AFBD;
  --color-feedback-info-text: #657982;
  --color-feedback-info-soft: #EEF2F4;

  /* Tipografia — famílias */
  --font-sans: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --font-serif: "Cormorant Garamond", Garamond, Georgia, serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Tipografia — tamanhos web (rem) */
  --text-2xs: 0.6875rem;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.875rem;
  --text-3xl: 2.25rem;
  --text-4xl: 3rem;
  --text-5xl: 3.75rem;
  --text-6xl: 4.5rem;

  /* Tipografia — tamanhos de peça (px em tela 1080, sem unidade) */
  --peca-text-display: 96;
  --peca-text-voz: 68;
  --peca-text-titulo: 56;
  --peca-text-citacao: 48;
  --peca-text-corpo: 32;
  --peca-text-rotulo: 20;
  --peca-text-assinatura: 20;
  --peca-text-contador: 20;

  /* Tipografia — pesos */
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* Tipografia — entrelinha */
  --leading-none: 1;
  --leading-display: 1.06;
  --leading-voz: 1.12;
  --leading-titulo: 1.14;
  --leading-citacao: 1.24;
  --leading-snug: 1.3;
  --leading-normal: 1.5;

  /* Tipografia — tracking */
  --tracking-display: -0.022em;
  --tracking-titulo: -0.016em;
  --tracking-normal: 0;
  --tracking-wide: 0.06em;
  --tracking-rotulo: 0.22em;
  --tracking-assinatura: 0.30em;

  /* Tipografia — medida */
  --measure-narrow: 38ch;
  --measure-default: 62ch;
  --measure-wide: 72ch;

  /* Tipografia — mínimos da serifada */
  --min-serifPeca: 32px;
  --min-serifWeb: 1.5rem;

  /* Grade das peças — px em tela 1080, sem unidade; usar calc(var(--u) * N) */
  --grade-formato-feed-largura: 1080;
  --grade-formato-feed-altura: 1350;
  --grade-formato-feed-margem: 96;
  --grade-formato-reel-largura: 1080;
  --grade-formato-reel-altura: 1920;
  --grade-formato-reel-margem: 96;
  --grade-caixa-largura: 888;
  --grade-caixa-respiro: 56;
  --grade-caixa-opacidade: 0.95;
  --grade-assinatura-rodape: 60;
  --grade-contador-topo: 60;
  --grade-contador-direita: 96;
  --grade-fio-largura: 120;
  --grade-fio-espessura: 3;
  --grade-reel-zonaMorta-direita: 180;
  --grade-reel-zonaMorta-topo: 220;
  --grade-reel-zonaMorta-rodape: 1520;
  --grade-reel-gancho-min: 540;
  --grade-reel-gancho-max: 860;
  --grade-reel-gancho-minPct: 28;
  --grade-reel-gancho-maxPct: 45;
  --grade-foto-olhosPct: 35;
  --grade-foto-veuGrid: 0.16;
  --grade-foto-veuVideo: 0.74;
  --grade-foto-veuVideoAtePct: 38;
  --grade-foto-veuDouradoMin: 0.55;
  --grade-mosaico-colunasPerfil: 3;
  --grade-mosaico-cardsPorLinha: 1;
  --grade-mosaico-rostosMaxPorLinha: 2;
  --grade-mosaico-cardsSeguidosMax: 2;
  --grade-teto-douradoPct: 15;
  --grade-teto-temporadaPct: 10;
  --grade-teto-corpoLinhasMax: 4;
  --grade-teto-serifLinhasMax: 2;
  --grade-teto-caixaPalavrasMax: 7;

  /* Espaçamento (web) */
  --space-0: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-14: 3.5rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Seções (web) */
  --section-sm: 3rem;
  --section-md: 5rem;
  --section-lg: 8rem;

  /* Dimensões */
  --size-container-sm: 640px;
  --size-container-md: 768px;
  --size-container-lg: 1024px;
  --size-container-xl: 1200px;
  --size-container-prose: 62ch;
  --size-control-sm: 2.25rem;
  --size-control-md: 2.75rem;
  --size-control-lg: 3.25rem;
  --size-icon-xs: 1rem;
  --size-icon-sm: 1.25rem;
  --size-icon-md: 1.5rem;
  --size-icon-lg: 2rem;
  --size-icon-xl: 3rem;
  --size-touchTarget: 44px;
  --size-sidebar: 272px;
  --size-grid-columns: 12;
  --size-grid-gutter: 1.5rem;

  /* Raios */
  --radius-none: 0;
  --radius-circle: 50%;

  /* Bordas */
  --border-hairline: 1px;
  --border-thin: 1.5px;
  --border-thick: 2px;
  --border-fio: 3px;

  /* Outline */
  --outline-focus: 2px solid;
  --outline-focusOffset: 2px;

  /* Sombras (nenhuma) */
  --shadow-none: none;

  /* Breakpoints (referência; não funcionam em media queries) */
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --bp-2xl: 1536px;

  /* Motion */
  --motion-duration-instant: 0ms;
  --motion-duration-fast: 150ms;
  --motion-duration-normal: 250ms;
  --motion-duration-slow: 400ms;
  --motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);
  --motion-easing-linear: linear;
  --motion-distance-sm: 8px;
  --motion-distance-md: 16px;

  /* Unidade de peça: 1 px de uma tela de 1080. Redefinida em .vp-peca como calc(100cqw / 1080). */
  --u: 1px;
}

/* Tema light (único) */
:root {
  color-scheme: light;
  --surface-page: #F2F0EF;
  --surface-primary: #FFFFFF;
  --surface-muted: #F8F8F7;
  --surface-subtle: #F2F0EF;
  --surface-nevoa: #93AFBD;
  --surface-pedra: #93A7B2;
  --surface-dourado: #EAD392;
  --surface-raiz: #574639;
  --surface-overlay: rgba(87, 70, 57, 0.74);
  --text-primary: #574639;
  --text-secondary: #6F6055;
  --text-muted: #7F7269;
  --text-disabled: #BCB5B0;
  --text-link: #574639;
  --text-onRaiz: #FFFFFF;
  --text-onRaizSerif: #EAD392;
  --text-onRaizSoft: #93AFBD;
  --text-onNevoa: #574639;
  --text-onPedra: #574639;
  --text-onDourado: #574639;
  --border-default: #E4E1DF;
  --border-strong: #D7D3CF;
  --border-raiz: #574639;
  --border-dourado: #EAD392;
  --border-focus: #574639;
  --border-onRaiz: rgba(255, 255, 255, 0.24);
  --action-primary: #574639;
  --action-primaryText: #FFFFFF;
  --action-primaryHoverText: #EAD392;
  --action-secondary: #EAD392;
  --action-secondaryText: #574639;
  --action-disabledBg: #E4E1DF;
  --action-disabledText: #938980;
  --feedback-success: #88AD78;
  --feedback-successSoft: #ECF2E9;
  --feedback-successText: #637E58;
  --feedback-warning: #EAD392;
  --feedback-warningSoft: #FCF8EE;
  --feedback-warningText: #817450;
  --feedback-error: #DB638A;
  --feedback-errorSoft: #F9E6EC;
  --feedback-errorText: #BA5475;
  --feedback-info: #93AFBD;
  --feedback-infoSoft: #EEF2F4;
  --feedback-infoText: #657982;
}

/* Temporadas — uma ativa por vez. :root = estado padrão (Dourado). */
:root, [data-temporada="dourado"] { --accent: #EAD392; --accent-ink: #574639; --accent-ink-min: any; --accent-nome: "Dourado Claro"; }
[data-temporada="limao"] { --accent: #E0D25C; --accent-ink: #574639; --accent-ink-min: any; --accent-nome: "Limão Siciliano"; }
[data-temporada="menta"] { --accent: #8EDFD3; --accent-ink: #574639; --accent-ink-min: any; --accent-nome: "Menta"; }
[data-temporada="verde"] { --accent: #88AD78; --accent-ink: #574639; --accent-ink-min: display; --accent-nome: "Verde Vivo"; }
[data-temporada="rosa"] { --accent: #DB638A; --accent-ink: #FFFFFF; --accent-ink-min: display; --accent-nome: "Rosa"; }

/* Estilos de texto web (classes utilitárias) */
.t-display { font-family: var(--font-sans); font-size: var(--text-6xl); font-weight: var(--weight-extrabold); line-height: var(--leading-display); letter-spacing: var(--tracking-display); text-transform: uppercase; }
.t-voz { font-family: var(--font-serif); font-size: var(--text-4xl); font-weight: var(--weight-light); line-height: var(--leading-voz); letter-spacing: var(--tracking-normal); }
.t-citacao { font-family: var(--font-serif); font-size: var(--text-2xl); font-weight: var(--weight-light); line-height: var(--leading-citacao); letter-spacing: var(--tracking-normal); font-style: italic; }
.t-h1 { font-family: var(--font-sans); font-size: var(--text-4xl); font-weight: var(--weight-bold); line-height: var(--leading-titulo); letter-spacing: var(--tracking-titulo); }
.t-h2 { font-family: var(--font-sans); font-size: var(--text-3xl); font-weight: var(--weight-bold); line-height: var(--leading-titulo); letter-spacing: var(--tracking-titulo); }
.t-h3 { font-family: var(--font-sans); font-size: var(--text-xl); font-weight: var(--weight-semibold); line-height: var(--leading-snug); letter-spacing: var(--tracking-normal); }
.t-h4 { font-family: var(--font-sans); font-size: var(--text-lg); font-weight: var(--weight-semibold); line-height: var(--leading-snug); letter-spacing: var(--tracking-normal); }
.t-body-lg { font-family: var(--font-sans); font-size: var(--text-md); font-weight: var(--weight-regular); line-height: var(--leading-normal); letter-spacing: var(--tracking-normal); }
.t-body { font-family: var(--font-sans); font-size: var(--text-base); font-weight: var(--weight-regular); line-height: var(--leading-normal); letter-spacing: var(--tracking-normal); }
.t-body-sm { font-family: var(--font-sans); font-size: var(--text-sm); font-weight: var(--weight-regular); line-height: var(--leading-normal); letter-spacing: var(--tracking-normal); }
.t-rotulo { font-family: var(--font-sans); font-size: var(--text-xs); font-weight: var(--weight-semibold); line-height: var(--leading-normal); letter-spacing: var(--tracking-rotulo); text-transform: uppercase; }
.t-assinatura { font-family: var(--font-sans); font-size: var(--text-xs); font-weight: var(--weight-medium); line-height: var(--leading-normal); letter-spacing: var(--tracking-assinatura); text-transform: uppercase; }
.t-button { font-family: var(--font-sans); font-size: var(--text-sm); font-weight: var(--weight-semibold); line-height: var(--leading-none); letter-spacing: var(--tracking-wide); }

/* Estilos de peça (seção 05 do PDF). Dentro de .vp-peca, --u escala com a largura. */
.t-peca-display { font-family: var(--font-sans); font-size: calc(var(--u) * var(--peca-text-display)); font-weight: var(--weight-extrabold); line-height: var(--leading-display); letter-spacing: var(--tracking-display); text-transform: uppercase; }
.t-peca-voz { font-family: var(--font-serif); font-size: calc(var(--u) * var(--peca-text-voz)); font-weight: var(--weight-light); line-height: var(--leading-voz); letter-spacing: var(--tracking-normal); }
.t-peca-citacao { font-family: var(--font-serif); font-size: calc(var(--u) * var(--peca-text-citacao)); font-weight: var(--weight-light); line-height: var(--leading-citacao); letter-spacing: var(--tracking-normal); font-style: italic; }
.t-peca-titulo { font-family: var(--font-sans); font-size: calc(var(--u) * var(--peca-text-titulo)); font-weight: var(--weight-bold); line-height: var(--leading-titulo); letter-spacing: var(--tracking-titulo); }
.t-peca-corpo { font-family: var(--font-sans); font-size: calc(var(--u) * var(--peca-text-corpo)); font-weight: var(--weight-regular); line-height: var(--leading-normal); letter-spacing: var(--tracking-normal); }
.t-peca-rotulo { font-family: var(--font-sans); font-size: calc(var(--u) * var(--peca-text-rotulo)); font-weight: var(--weight-semibold); line-height: var(--leading-normal); letter-spacing: var(--tracking-rotulo); text-transform: uppercase; }
.t-peca-assinatura { font-family: var(--font-sans); font-size: calc(var(--u) * var(--peca-text-assinatura)); font-weight: var(--weight-medium); line-height: var(--leading-normal); letter-spacing: var(--tracking-assinatura); text-transform: uppercase; }