/* Compatibilidad con la interfaz vigente: solo presentación. */
html:root,html:root[data-theme],html:root:not([data-theme="light"]) {
  --pc-bg:var(--pergamino);--pc-surface:var(--lino);
  --pc-ink:var(--corteza);--pc-ink-2:var(--texto);--pc-muted:var(--tenue);
  --pc-line:var(--linea);--pc-line-2:var(--linea-2);
  --pc-night:var(--roble);--pc-brand:var(--castano);--pc-brand-50:var(--avena);
  --pc-teal:var(--castano);--pc-teal-50:var(--ocre-suave);
  --pc-ok:var(--ok);--pc-ok-50:var(--ok-fondo);
  --pc-warn:var(--aviso);--pc-warn-50:var(--aviso-fondo);
  --pc-crit:var(--critico);--pc-crit-50:var(--critico-fondo);
  --pc-violet:var(--serie-4);--pc-violet-50:var(--neutro-fondo);
  --pc-font:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --pc-shadow:var(--sombra);--pc-focus:0 0 0 3px var(--ocre-suave);
  --brand:var(--roble);--brand-ink:var(--lino);--accent:var(--castano);
  --accent-soft:var(--avena);--gold:var(--ocre);--gold-soft:var(--ocre-suave);
  --paper:var(--pergamino);--sheet:var(--lino);--ink:var(--corteza);
  --ink2:var(--texto);--ink3:var(--tenue);--rule:var(--linea);
  --rule2:var(--linea-2);--mark:var(--ocre-suave);--on-accent:var(--lino);
  --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Fraunces",Georgia,serif;
}

html:root{--pc-night-2:var(--roble-2);--blue:var(--castano);--navy:var(--roble);--line:var(--linea);--muted:var(--tenue);font-family:var(--sans);background:var(--pergamino);color:var(--texto)}
body.pc-otono-interno{background:var(--pergamino);color:var(--texto);font-family:var(--sans)}
.pc-otono-interno #app{position:relative;z-index:1}
.pc-otono-interno aside{background:var(--roble);color:var(--lino)}
.pc-otono-interno aside :is(.brand,.brand p,.nav button){color:var(--lino)}
.pc-otono-interno aside :is(.brand small,.side-status small){color:var(--ocre-claro)}
.pc-otono-interno .nav button.active{background:var(--roble-2);box-shadow:inset 3px 0 var(--ocre-claro)}
.pc-otono-interno .topbar .search input{background:var(--pergamino);color:var(--texto)}
.pc-otono-interno .topbar .search input::placeholder{color:var(--tenue)}
.pc-otono-interno .grid{gap:12px}
.pc-otono-interno .card{padding:16px}
.pc-otono-interno .grid.cards>.kpi{grid-column:auto;gap:8px}
.pc-otono-interno .metric{font-family:var(--serif);color:var(--corteza)}
.pc-otono-interno .table-wrap{margin:0;padding:0}
.pc-otono-interno table{min-width:0;font-size:12px}
.pc-otono-interno .legend{display:grid;gap:9px}
.pc-otono-interno .tabs.seg{display:flex;padding:4px;background:var(--avena);border-radius:12px;align-items:center}
.pc-otono-interno .tabs.seg button.active{background:var(--lino);color:var(--corteza);box-shadow:var(--sombra);border:0;border-radius:9px}
.pc-otono-interno .steps.seg{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;padding:0;border:0;background:transparent}
.pc-otono-interno progress{accent-color:var(--serie-1)}
.pc-otono-interno .badge{display:inline-flex;align-items:center;gap:6px;white-space:normal;padding:4px 8px}
.pc-otono-interno .badge.neutro{background:var(--neutro-fondo);color:var(--neutro)}
.pc-otono-interno .badge.ok{background:var(--ok-fondo);color:var(--ok)}
.pc-otono-interno .badge.aviso{background:var(--aviso-fondo);color:var(--aviso)}
.pc-otono-interno .badge.critico{background:var(--critico-fondo);color:var(--critico)}
.pc-otono-interno .notice.badge{display:flex;align-items:flex-start}
.pc-otono-interno .side-status>div.badge{display:block;background:var(--roble-2);color:var(--lino)}
.pc-otono-interno .side-status>div.badge::before{vertical-align:middle;margin-right:6px}
.pc-otono-interno .status-dot{display:none}
@media(min-width:1700px){.pc-otono-interno .card{padding:20px}}
@media(max-width:800px){.pc-otono-interno .card{padding:13px}.pc-otono-interno .steps.seg{gap:2px}}
/* Iconos decorativos reutilizados por CSS: evitar miles de nodos adicionales. */
.pc-otono-interno .badge.neutro{--otono-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%208h.01M12%2011v5%22%2F%3E%3C%2Fsvg%3E")}
.pc-otono-interno .badge.ok{--otono-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m8%2012%203%203%205-6%22%2F%3E%3C%2Fsvg%3E")}
.pc-otono-interno .badge.aviso{--otono-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%3E%3Cpath%20d%3D%22M12%203%202%2021h20L12%203Z%22%2F%3E%3Cpath%20d%3D%22M12%209v5M12%2017h.01%22%2F%3E%3C%2Fsvg%3E")}
.pc-otono-interno .badge.critico{--otono-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.7%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22m9%209%206%206M15%209l-6%206%22%2F%3E%3C%2Fsvg%3E")}
.pc-otono-interno .badge::before{content:"";display:inline-block;flex:none;width:14px;height:14px;background:currentColor;-webkit-mask:var(--otono-icon) center/contain no-repeat;mask:var(--otono-icon) center/contain no-repeat}

.pc-otono-interno .topbar .domain-pill{color:var(--corteza);background:var(--lino);border-color:var(--linea)}
.pc-otono-interno .steps.seg button::after{display:none}
.pc-otono-interno .steps.seg button{padding:8px 6px;min-height:40px}

/* Revisión de lectura: fuente formal, texto contenido y cifras alineadas. */
html:root,html:root[data-theme],html:root:not([data-theme="light"]){--sans:Arial,"Helvetica Neue",Helvetica,sans-serif;--pc-font:var(--sans);--serif:Georgia,"Times New Roman",serif}
body.pc-otono-interno{--serif:var(--sans);font-family:var(--sans);font-size:15px;line-height:1.5}
body.pc-otono-interno :is(button,input,select,textarea){font-family:var(--sans);line-height:1.4}
body.pc-otono-interno :is(h1,h2,h3){font-family:var(--sans);font-style:normal;letter-spacing:normal;line-height:1.3;font-weight:600;overflow-wrap:break-word}
body.pc-otono-interno h1{font-size:clamp(22px,2vw,28px)}
body.pc-otono-interno h2{font-size:18px}
body.pc-otono-interno h3{font-size:16px}
body.pc-otono-interno :is(.kpi,.metric) :is(strong,b,.value){font-family:var(--sans)!important;font-style:normal;line-height:1.25;font-variant-numeric:tabular-nums}
body.pc-otono-interno :is(.card,.panel,.kpi,.toolbar,.filters)>*{min-width:0}
body.pc-otono-interno :is(.table-wrap,.pc-table-wrap,.utbl,.tbl,.mxwrap){max-width:100%;min-width:0;overflow:auto;-webkit-overflow-scrolling:touch}
body.pc-otono-interno table{font-family:var(--sans);font-size:14px;line-height:1.5;font-variant-numeric:tabular-nums}
body.pc-otono-interno table :is(th,td){vertical-align:top;white-space:normal!important;overflow-wrap:anywhere;word-break:normal;line-height:1.5;padding:10px 12px}
body.pc-otono-interno table th{font-size:12px;font-weight:600;letter-spacing:.025em}
body.pc-otono-interno table td :is(p,div,span,a,button,strong){white-space:normal;overflow-wrap:anywhere;min-width:0}
body.pc-otono-interno .badge{font-size:12px;line-height:1.4;max-width:100%;flex-shrink:0}
body.pc-otono-interno :is(.filters,.form-grid) label{font-size:13px;line-height:1.45}
body.pc-otono-interno :is(input,select){min-height:40px}
body.pc-otono-interno :is(.sidebar,.rail) :is(button,a){line-height:1.4}
body.pc-otono-interno table{min-width:780px;width:100%;table-layout:auto}
body.pc-otono-interno :is(.stats,.stats-grid,.kpis,.grid){min-width:0}
body.pc-otono-interno :is(.tabs,.seg){flex-wrap:wrap;gap:6px}
body.pc-otono-interno .side .nav{display:flex;align-items:center;gap:10px;text-align:left;min-height:44px}

body.pc-otono-interno .steps.seg button{white-space:normal;min-width:0;overflow-wrap:anywhere;line-height:1.4;font-size:13px}
body.pc-otono-interno .master>div{grid-template-columns:minmax(95px,130px) minmax(0,1fr)}
body.pc-otono-interno .master>div>*{min-width:0;overflow-wrap:anywhere}
body.pc-otono-interno .page-title{flex-wrap:wrap;align-items:flex-start}
@media(max-width:800px){body.pc-otono-interno .steps.seg{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media print{body.pc-otono-interno table{min-width:0!important;width:100%;font-size:10px}body.pc-otono-interno :is(.table-wrap,.pc-table-wrap){overflow:visible!important}}

/* Anchos de lectura: ningún encabezado o estado debe reducirse a letras sueltas. */
body.pc-otono-interno table :is(th,td){min-width:120px;max-width:360px;overflow-wrap:break-word}
body.pc-otono-interno table .badge{min-width:100px;overflow-wrap:normal;word-break:normal}
@media print{body.pc-otono-interno table :is(th,td){min-width:0!important;max-width:none}}
