/* Paleta das cinco páginas ativas. Primitivos e papéis em uma única fonte. */
:root{
  --navy:#141E30;
  --orange:#F97316;
  --navy-deep:#0D1522;
  --navy-raised:#1E3048;
  --navy-hover:#35577D;
  --orange-hover:#FB9650;
  --amber-soft:#FCB98A;
  --amber-light:#FEDCC5;

  --color-canvas:var(--navy);
  --color-surface:var(--navy-raised);
  --color-surface-hover:var(--navy-hover);
  --color-display:var(--orange);
  --color-text:var(--amber-light);
  --color-muted:var(--amber-soft);
  --color-counter:var(--amber-soft);
  --color-link:var(--orange-hover);
  --color-mark:var(--amber-light);
  --color-action:var(--orange);
  --color-on-action:var(--navy);
  --color-action-hover:var(--orange-hover);
  --color-on-action-hover:var(--navy);
  --color-focus:var(--orange-hover);
  --color-control-border:var(--amber-soft);
  --color-border:color-mix(in srgb,var(--amber-soft) 30%,var(--navy));
  --color-rule:color-mix(in srgb,var(--orange) 28%,var(--navy));
  --color-selection:var(--orange);
  --color-on-selection:var(--navy);
  --color-footer:var(--navy-deep);
  --color-box:var(--amber-light);
  --color-on-box:var(--navy);
  --color-scrim:color-mix(in srgb,var(--navy-deep) 82%,transparent);
  --color-shadow:color-mix(in srgb,var(--navy-deep) 60%,transparent);
  --color-on-dark:var(--amber-light);
  --color-muted-on-dark:var(--amber-soft);

  /* Compatibilidade com a composição existente, sem mudar métricas. */
  --bg:var(--color-canvas);
  --fg:var(--color-display);
  --reading-ink:var(--color-text);
  --accent:var(--color-counter);
  --accent-text:var(--color-link);
  --amber:var(--color-display);
  --amber-text:var(--color-link);
  --graphite:var(--navy);
  --brand-amber:var(--orange);
  --brand-amber-text:var(--orange-hover);
  --papel:var(--amber-light);
  --ambar-claro:var(--amber-soft);
  --logo-ink:var(--color-mark);
  --logo-sun:var(--color-display);
  --muted:var(--color-muted);
  --faint:var(--color-muted);
  --ink:var(--color-text);
  --line:var(--color-border);
  --cota:var(--color-rule);
  --guia:var(--color-rule);
  --veil:var(--color-surface);
  --cursor-select:var(--color-selection);
  --diagonais-papel:repeating-linear-gradient(135deg,transparent 0 23px,color-mix(in srgb,var(--color-text) 6%,transparent) 23px 24px);
  --diagonais-fecho:repeating-linear-gradient(135deg,transparent 0 71px,color-mix(in srgb,var(--amber-light) 8%,transparent) 71px 72px);
  color-scheme:dark;
}

/* A troca existente conserva dois registros, agora navy/orange e orange/navy. */
:root[data-da-palette="graphite-amber"]{
  --color-canvas:var(--orange);
  --color-surface:var(--amber-light);
  --color-surface-hover:var(--amber-soft);
  --color-display:var(--navy-deep);
  --color-text:var(--navy);
  --color-muted:var(--navy);
  --color-counter:var(--navy-raised);
  --color-link:var(--navy-deep);
  --color-mark:var(--navy);
  --color-action:var(--navy);
  --color-on-action:var(--orange);
  --color-action-hover:var(--navy-hover);
  --color-on-action-hover:var(--amber-light);
  --color-focus:var(--navy-deep);
  --color-control-border:var(--navy);
  --color-border:color-mix(in srgb,var(--navy) 44%,var(--orange));
  --color-rule:color-mix(in srgb,var(--navy) 30%,var(--orange));
  --color-selection:var(--navy);
  --color-on-selection:var(--orange);
  color-scheme:light;
}

/* O registro orange diferencia a tinta e as superfícies já existentes. */
:root[data-da-palette="graphite-amber"] :is(.da-topnav,#topnav,.da-corner){
  --color-surface:var(--navy-raised);
  --color-surface-hover:var(--navy-hover);
  --color-text:var(--amber-light);
  --color-display:var(--orange);
  --color-link:var(--orange-hover);
  --color-focus:var(--orange-hover);
  --color-control-border:var(--amber-soft);
  --color-border:color-mix(in srgb,var(--amber-soft) 30%,var(--navy));
  --fg:var(--orange);
  --reading-ink:var(--amber-light);
  --accent:var(--orange);
  --amber-text:var(--orange-hover);
  --logo-ink:var(--amber-light);
  --logo-sun:var(--orange);
  --cursor-select:var(--orange-hover);
}
:root[data-da-palette="graphite-amber"] #topnav{
  background:var(--nav-background,var(--navy));
}
:root[data-da-palette="graphite-amber"] .pl-coord{opacity:1}

:root[data-da-palette="graphite-amber"] .campo>li:not(.is-tinta){
  --color-surface:var(--navy-raised);
  --reading-ink:var(--amber-light);
  --accent:var(--orange);
  --line:color-mix(in srgb,var(--amber-soft) 30%,var(--navy-raised));
}
:root[data-da-palette="graphite-amber"] .pilar--velocidade{
  --graphite:var(--amber-soft);
  background:var(--navy-hover);
}
:root[data-da-palette="graphite-amber"] .pilar--velocidade .pilar-nome{color:var(--amber-light)}
:root[data-da-palette="graphite-amber"] .pilar--velocidade :is(.pilar-papel,.pilar-desc){color:var(--amber-light)}
:root[data-da-palette="graphite-amber"] .pilar--velocidade .pilar-glifo{color:color-mix(in srgb,var(--amber-soft) 24%,transparent)}

@media (min-width:901px){
  :root[data-da-palette="graphite-amber"] :is(.pl-baia--servicos,.pl-baia--portfolio){
    --fg:var(--orange);
    --reading-ink:var(--amber-light);
    --color-focus:var(--navy-deep);
    background:var(--navy-raised);
  }
  :root[data-da-palette="graphite-amber"] .pl-baia--servicos{--fg:var(--amber-light);background:var(--navy-hover)}
  :root[data-da-palette="graphite-amber"] .pl-baia:is(:hover,:focus-visible){
    --fg:var(--navy-deep);
    --reading-ink:var(--navy);
    background:var(--amber-light);
  }
}

/* Texto e emblemas em superfícies claras ou orange sempre usam navy. */
:where(.pilar--forma,.pilar--velocidade,.campo>li.is-tinta,.pf-painel,
       .pl-baia--servicos,.pl-baia--artesao){
  --fg:var(--navy);
  --reading-ink:var(--navy);
  --accent:var(--navy-raised);
  --accent-text:var(--navy-deep);
  --logo-ink:var(--navy);
  --line:color-mix(in srgb,var(--navy) 30%,transparent);
  --color-focus:var(--navy);
}

.pf-painel{
  --color-surface:var(--amber-soft);
  --color-action:var(--navy);
  --color-on-action:var(--amber-light);
  --color-action-hover:var(--navy-hover);
  --color-on-action-hover:var(--amber-light);
}

:where(.pilar--estrutura,.pilar--defesa,.fecho){
  --fg:var(--orange);
  --reading-ink:var(--amber-light);
  --accent:var(--amber-soft);
  --accent-text:var(--orange-hover);
  --color-focus:var(--orange-hover);
}

.fecho{
  --color-action:var(--orange);
  --color-on-action:var(--navy);
  --color-action-hover:var(--orange-hover);
  --color-on-action-hover:var(--navy);
  --color-control-border:var(--amber-soft);
}

/* Os canais de contato recebem preenchimento apenas durante a interacao. */
.portal-contact{
  --color-action:var(--navy);
  --color-on-action:var(--amber-soft);
  --color-action-hover:var(--orange);
  --color-on-action-hover:var(--navy);
}

.da-dot{outline:1px solid var(--color-control-border)}

/* A planta vira uma lista aberta no celular, conservando sua composição. */
@media (max-width:900px){
  html[data-da-color-system] .pl-baia{
    --fg:var(--color-display);
    --reading-ink:var(--color-text);
    --color-focus:var(--color-link);
  }
}

/* A transição compartilhada mantém a coreografia e recebe a mesma tinta. */
html[data-da-color-system] :is(.da-field-origin,.da-field-grid){
  --field-ink:var(--navy-deep);
  --field-paper:var(--amber-light);
  --field-amber:var(--orange);
}
