/* ═══════════════════════════════════════════════════════════════════
   CANG · tokens de marca (fuente única)
   Los usan www.cang.cl, el Worker (app.cang.cl / recargas) y la interfaz
   del simulador. Para el Worker: copiar este archivo tal cual.
   Se carga después de cang.css y extra.css, y antes de clinic.css.
   ═══════════════════════════════════════════════════════════════════ */
@font-face{font-family:'Outfit';font-style:normal;font-weight:300;font-display:swap;src:url(/a/fonts/outfit-latin-300-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:400;font-display:swap;src:url(/a/fonts/outfit-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:500;font-display:swap;src:url(/a/fonts/outfit-latin-500-normal.woff2) format('woff2')}

:root{
  /* color · claro */
  --cang-bg:#ffffff; --cang-bg-2:#f5f7f7; --cang-paper:#ffffff;
  --cang-ink:#16201e; --cang-ink-2:#56625f; --cang-ink-3:#6b7673;   /* ink-3 ≥ 4,5:1 sobre blanco */
  --cang-line:#e6eae9; --cang-line-2:#d3dad8;
  --cang-accent:#0f7d79;        /* único teal de interfaz */
  --cang-accent-ink:#ffffff;    /* texto sobre el acento */
  --cang-logo:#00918a;          /* teal del logo: solo en el logo y el punto de la A */
  --cang-ia:#5a60c4;            /* letras «IA» en texto chico (AA) */
  --cang-ia-graf:#747bdc;       /* «IA» en gráficos o texto ≥ 24 px */
  --cang-error:#b3261e; --cang-ok:#0f7d79;
  --cang-nav-bg:rgba(255,255,255,.88); --cang-footer:#f5f7f7;

  /* tipografía */
  --cang-font:'Outfit',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --cang-w-light:300; --cang-w-regular:400; --cang-w-medium:500;

  /* radios */
  --cang-r:20px; --cang-r-s:14px; --cang-r-field:12px; --cang-r-pill:999px;

  /* sombras (la capa clínica casi no las usa) */
  --cang-shadow-s:0 1px 2px rgba(22,32,30,.04);
  --cang-shadow-l:0 30px 70px -40px rgba(22,32,30,.22);

  /* espaciado (escala de 4) */
  --cang-s1:4px; --cang-s2:8px; --cang-s3:12px; --cang-s4:16px; --cang-s5:20px; --cang-s6:24px;
  --cang-s8:32px; --cang-s12:48px; --cang-s16:64px; --cang-s24:96px;
  --cang-btn-h:48px;

}

/* Alias que usa la capa clínica del sitio. El selector repetido les da prioridad
   sobre los valores antiguos de cang.css, también en modo oscuro. */
:root,:root[data-theme],:root:not([data-theme="light"]){
  --bg:var(--cang-bg); --bg-2:var(--cang-bg-2); --paper:var(--cang-paper);
  --ink:var(--cang-ink); --ink-2:var(--cang-ink-2); --ink-3:var(--cang-ink-3);
  --line:var(--cang-line); --line-2:var(--cang-line-2);
  --glass:var(--cang-paper); --glass-strong:var(--cang-paper); --glass-line:var(--cang-line);
  --nav-bg:var(--cang-nav-bg); --footer:var(--cang-footer);
  --metal-text:linear-gradient(var(--ink),var(--ink));
  --shadow-s:var(--cang-shadow-s); --shadow-l:var(--cang-shadow-l);
  --accent:var(--cang-accent); --teal:var(--cang-accent); --ia:var(--cang-ia);
  --seg-bg:var(--cang-paper); --seg-ink:var(--cang-ink-2);
  --r:var(--cang-r); --r-s:var(--cang-r-s);
}

/* color · oscuro (preferencia del sistema, salvo que el usuario elija claro) */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --cang-bg:#0e1413; --cang-bg-2:#141c1a; --cang-paper:#141c1a;
    --cang-ink:#eef2f1; --cang-ink-2:#a8b3b0; --cang-ink-3:#8f9b98;
    --cang-line:rgba(255,255,255,.08); --cang-line-2:rgba(255,255,255,.16);
    --cang-accent:#5cc7c1; --cang-accent-ink:#0e1413; --cang-logo:#2fb3aa;
    --cang-ia:#aab0ff; --cang-ia-graf:#aab0ff; --cang-error:#ff8a80; --cang-ok:#5cc7c1;
    --cang-nav-bg:rgba(14,20,19,.86); --cang-footer:#0b100f;
    --cang-shadow-l:0 30px 70px -40px rgba(0,0,0,.7);
  }
}
/* color · oscuro elegido con el botón de tema */
:root[data-theme="dark"]{
  --cang-bg:#0e1413; --cang-bg-2:#141c1a; --cang-paper:#141c1a;
  --cang-ink:#eef2f1; --cang-ink-2:#a8b3b0; --cang-ink-3:#8f9b98;
  --cang-line:rgba(255,255,255,.08); --cang-line-2:rgba(255,255,255,.16);
  --cang-accent:#5cc7c1; --cang-accent-ink:#0e1413; --cang-logo:#2fb3aa;
  --cang-ia:#aab0ff; --cang-ia-graf:#aab0ff; --cang-error:#ff8a80; --cang-ok:#5cc7c1;
  --cang-nav-bg:rgba(14,20,19,.86); --cang-footer:#0b100f;
  --cang-shadow-l:0 30px 70px -40px rgba(0,0,0,.7);
}

/* las imágenes con width/height (para reservar espacio) mantienen su proporción */
:where(img[width][height]){height:auto}