/* ════════════════════════════════════════════════════════════
   SKOOL MRR — donuts del resumen (antigüedad, geografía, modalidad,
   origen). Propio de esta sección; no toca css/base.css ni
   css/componentes.css. Ver docs/decisiones.md, entrada 2026-09-06.
   ════════════════════════════════════════════════════════════ */

:root{
  /* Paleta categórica del donut: orden fijo, validado con
     scripts/validate_palette.js de la skill dataviz (dark,
     superficie #0F1113). --skool y --violet ya caían dentro de la
     banda de luminosidad OKLCH para modo oscuro (L 0.48–0.67) y se
     reutilizan tal cual; --amber/--cyan/--mint/--rose de base.css
     están pensados para washes translúcidos y son demasiado claros
     para marcar identidad como trazo sólido, así que aquí van sus
     versiones oscurecidas (mismo tono, L reajustada). El orden
     (skool, mint, violet, amber, cyan, rose) es el que pasa las
     seis comprobaciones: separación CVD adyacente floor 6–8 en un
     único par (mint↔skool), legal porque cada porción lleva
     etiqueta directa en la leyenda y un hueco de 2 px entre trazos. */
  --skool-c2:#009e67;
  --skool-c4:#ad7c2f;
  --skool-c5:#0094ae;
  --skool-c6:#f44265;
}

#c-skool{position:relative}

.dona-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:16px 12px;
}
@media(max-width:360px){.dona-grid{grid-template-columns:1fr}}

.dona-caja{display:flex;flex-direction:column;gap:9px;min-width:0}

.dona-svg-wrap,.dona-vacia{
  position:relative;width:100%;max-width:112px;margin:0 auto;aspect-ratio:1/1;
}
.dona-svg{width:100%;height:100%;display:block;overflow:visible}
.dona-porcion{
  cursor:pointer;touch-action:manipulation;
  transition:stroke-width .12s ease, filter .12s ease;
}
.dona-porcion:hover,.dona-porcion.on,.dona-porcion:focus-visible{
  stroke-width:15.5;filter:brightness(1.2);outline:none;
}
.dona-total{
  position:absolute;inset:0;display:grid;place-items:center;
  pointer-events:none;text-align:center;
}
.dona-total b{
  font-family:var(--f-dp);font-size:19px;font-weight:600;letter-spacing:-.02em;
  color:var(--tx);font-variant-numeric:tabular-nums;
}
.dona-total .nd{font-size:12px}

.dona-leyenda{display:flex;flex-direction:column;gap:3px}
.dona-fila{
  display:flex;align-items:center;gap:7px;padding:3px 5px;border-radius:6px;
  transition:background .12s ease;
}
.dona-fila.on{background:color-mix(in srgb, var(--a) 16%, transparent)}
.dona-fila i{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.dona-fila span{
  flex:1;min-width:0;font-size:11px;color:var(--tx-2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.dona-fila b{
  font-family:var(--f-mo);font-size:10.5px;font-weight:400;color:var(--tx);
  font-variant-numeric:tabular-nums;flex:0 0 auto;
}
.dona-fila small{
  font-family:var(--f-mo);font-size:9.5px;color:var(--tx-3);
  min-width:40px;text-align:right;flex:0 0 auto;
}

.dona-tip{
  position:absolute;z-index:6;padding:6px 9px;border-radius:8px;
  font:500 11px/1.3 var(--f-ui);color:var(--tx);white-space:nowrap;
  pointer-events:none;
  background:color-mix(in srgb, var(--a) 18%, var(--card-hi));
  border:1px solid color-mix(in srgb, var(--a) 45%, var(--line-2));
  box-shadow:0 10px 26px -12px rgba(0,0,0,.9);
}