/* Sitio del proyecto: capa mínima sobre specimen.css (estructura del espécimen de Stella Nova).
   Mobile first. Solo tokens semánticos de la skin. No redefine tokens ni componentes de la skin. */

/* ── Saltar al contenido ── */
.mx-saltar { position: absolute; left: var(--sn-s-3); top: -100px; z-index: 40; padding: var(--sn-s-2) var(--sn-s-3);
	background: var(--sn-paper); color: var(--sn-ink); border-radius: var(--sn-radius); box-shadow: var(--sn-lift); }
.mx-saltar:focus { top: var(--sn-s-3); }
.mx-pmain:focus { outline: none; }

/* ── Cabecera. Móvil: marca + «Menú» (secciones y lectura apiladas). Escritorio (desde 80rem, donde caben en una fila): secciones en fila + «Lectura» desplegable ── */
.mx-ptop { flex-wrap: wrap; gap: var(--sn-s-2); padding: var(--sn-s-2) var(--sn-s-4); }
/* La marca conserva la alineación de la skin: nombre y versión sobre la misma línea base, ícono centrado. */
.mx-ptop .spec-brand { margin-inline-end: auto; padding-block: var(--sn-s-2); } /* área táctil de 44 px en móvil */
.mx-ptop .spec-brand-name { white-space: nowrap; }
.mx-ptop .spec-brand-ver { color: var(--sn-ink-soft); display: none; } /* --sn-ink-faint no alcanza AA como texto */
.mx-ptop-boton {
	min-height: 44px; padding: 0 var(--sn-s-3); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius);
	background: var(--sn-paper); color: var(--sn-ink); font: inherit; font-size: var(--sn-fs-sm); cursor: pointer; white-space: nowrap;
}
.mx-ptop-boton[aria-expanded="true"] { background: var(--sn-ink); color: var(--sn-paper); border-color: var(--sn-ink); }
.mx-pmenu { display: none; flex-basis: 100%; flex-direction: column; gap: var(--sn-baseline-half); padding: var(--sn-s-2) 0 var(--sn-s-3); }
.mx-ptop-menu[aria-expanded="true"] + .mx-pmenu { display: flex; }
.mx-pnav { flex-direction: column; margin: 0; gap: 2px; }
.mx-pnav a { min-height: 44px; display: flex; align-items: center; font-size: var(--sn-fs-base); }
.mx-ptop-lectura { display: none; }
.mx-ppref { display: flex; flex-direction: column; gap: var(--sn-s-3); margin: 0; padding-top: var(--sn-s-3); border-top: 1px solid var(--sn-hairline-soft); }
.mx-ppref .spec-seg { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; background: transparent; padding: 0; }
.mx-ppref legend { float: left; width: 100%; font-size: var(--sn-fs-xs); color: var(--sn-ink-soft); margin-bottom: var(--sn-s-1); padding: 0; }
.mx-ppref .spec-seg button { min-height: 44px; min-width: 44px; font-size: var(--sn-fs-sm); background: var(--sn-sunk); border-radius: var(--sn-radius); }
.mx-ppref .spec-seg button[aria-pressed="true"] { background: var(--sn-paper); }

/* Acción principal del sitio: ir al prototipo. Botón primario de Stella Nova (--sn-btn-primary-*), fuera de la navegación.
   Móvil: junto a «Menú» (fila propia en pantallas angostas); el menú abierto pasa a la fila siguiente. Escritorio: al final de la cabecera, después de «Lectura». */
.mx-pmenu { order: 1; }
.mx-ptop-proto {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--sn-s-3); box-sizing: border-box;
	border: 1px solid var(--sn-btn-primary-bg); border-radius: var(--sn-radius);
	background: var(--sn-btn-primary-bg); color: var(--sn-btn-primary-fg);
	font-size: var(--sn-fs-sm); font-weight: 600; text-decoration: none; white-space: nowrap;
}
.mx-ptop-proto:hover { background: var(--sn-btn-primary-bg-hover); border-color: var(--sn-btn-primary-bg-hover); color: var(--sn-btn-primary-fg); }
.mx-ptop-proto:focus-visible { outline: 2px solid var(--sn-focus-border); outline-offset: 2px; }
/* Pantallas angostas: no cabe junto a la marca y «Menú», así que ocupa su propia fila a todo el ancho. */
@media (max-width: 29.99rem) { .mx-ptop-proto { flex-basis: 100%; justify-content: center; } }

@media (min-width: 80rem) {
	.mx-ptop-proto { order: 2; min-height: 32px; }
	/* Todos los textos de la barra (marca, secciones, «Lectura» y «Ver prototipo») comparten la línea base */
	.mx-ptop { flex-wrap: nowrap; gap: var(--sn-s-4); padding: var(--sn-s-3) var(--sn-s-5); align-items: baseline; }
	.mx-ptop .spec-brand { margin-inline-end: 0; padding-block: 0; }
	.mx-ptop-menu { display: none; }
	.mx-pmenu { display: flex; flex: 1; flex-basis: auto; flex-direction: row; align-items: baseline; padding: 0; }
	.mx-pnav { flex-direction: row; flex-wrap: wrap; margin-inline-start: var(--sn-s-2); }
	.mx-pnav a { min-height: 0; font-size: var(--sn-fs-sm); white-space: nowrap; }
	.mx-plectura { margin-inline-start: auto; position: relative; }
	.mx-ptop-lectura { display: inline-flex; align-items: center; min-height: 32px; }
	.mx-ppref { display: none; position: absolute; right: 0; top: calc(100% + var(--sn-s-2)); width: 18rem; padding: var(--sn-s-3) var(--sn-s-4);
		background: var(--sn-paper); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius-l); box-shadow: var(--sn-lift); z-index: 31; }
	.mx-ptop-lectura[aria-expanded="true"] + .mx-ppref { display: flex; }
	.mx-ppref .spec-seg button { min-height: 32px; min-width: 32px; }
}
@media (min-width: 112rem) { .mx-ptop .spec-brand-ver { display: inline; white-space: nowrap; } }

/* Índice del documento: títulos sin el filete de los h2 */
.mx-pdoc__indice h2 { border: 0; padding: 0; line-height: var(--sn-leading); }

/* ── Contenido ── */
.mx-pmain { padding: var(--sn-baseline) var(--sn-s-4) var(--sn-baseline-3); }
@media (min-width: 48rem) { .mx-pmain { padding: var(--sn-baseline-2) var(--sn-s-5) var(--sn-baseline-3); } }
.mx-pcab { margin-bottom: var(--sn-baseline-2); }
.mx-pmiga { margin: 0 0 var(--sn-baseline-half); color: var(--sn-ink-soft); font-size: var(--sn-fs-sm); }
.mx-pmiga a { color: var(--sn-ink-soft); }

/* Documento: hoja de papel de la skin; índice arriba en móvil y al costado en escritorio */
.mx-pdoc { display: grid; gap: var(--sn-baseline) var(--sn-s-6); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 64rem) { .mx-pdoc { grid-template-columns: 15rem minmax(0, 1fr); align-items: start; } }
.mx-pdoc__indice { font-size: var(--sn-fs-sm); }
@media (min-width: 64rem) { .mx-pdoc__indice { position: sticky; top: calc(var(--sn-header-h) + var(--sn-s-4)); max-height: calc(100vh - var(--sn-header-h) - var(--sn-s-6)); overflow-y: auto; } }
.mx-pdoc__indice h2 { font-size: var(--sn-fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--sn-ink-soft); margin: 0 0 var(--sn-baseline-half); font-weight: 600; }
.mx-pdoc__indice ol, .mx-pdoc__indice ul { list-style: none; margin: 0 0 var(--sn-baseline); padding: 0; }
.mx-pdoc__indice li { margin: 0; }
.mx-pdoc__indice a { display: block; padding: var(--sn-s-1) var(--sn-s-2); border-radius: var(--sn-radius); color: var(--sn-ink-soft); text-decoration: none; min-height: 24px; }
.mx-pdoc__indice a:hover { background: var(--sn-sunk); color: var(--sn-ink); }
.mx-pdoc__indice a[aria-current="page"] { background: var(--sn-paper); color: var(--sn-ink); box-shadow: var(--sn-lift-paper); }
.mx-phoja { background: var(--sn-paper); border-radius: var(--sn-radius-paper); box-shadow: var(--sn-lift-paper); padding: var(--sn-baseline) var(--sn-s-4); min-width: 0; }
@media (min-width: 48rem) { .mx-phoja { padding: var(--sn-baseline-2) var(--sn-s-6); } }
.mx-phoja > .mw-parser-output > :first-child { margin-top: 0; }

/* Lista de documentos */
.mx-pdocs { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sn-s-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); }
.mx-pdocs li { margin: 0; }
.mx-pdocs a { display: block; height: 100%; box-sizing: border-box; padding: var(--sn-baseline-half) var(--sn-s-4) var(--sn-baseline); background: var(--sn-paper); border-radius: var(--sn-radius-l); box-shadow: var(--sn-lift-soft); color: var(--sn-ink); text-decoration: none; }
.mx-pdocs a:hover { box-shadow: var(--sn-lift); }
.mx-pdocs b { display: block; font-size: var(--sn-fs-md); margin: var(--sn-baseline-half) 0; color: var(--sn-link); }
.mx-pdocs p { margin: 0; color: var(--sn-ink-soft); font-size: var(--sn-fs-sm); }

/* Tablas del espécimen en móvil */
.spec .mx-tabla-scroll, .spec .mx-ptabla { overflow-x: auto; }
@media (max-width: 48rem) {
	.spec .spec-usage { grid-template-columns: minmax(0, 1fr); }
}

/* Propuestas para la skin: lado a lado, «Hoy» y «Con la propuesta» */
.mx-prop { display: grid; gap: var(--sn-s-4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 48rem) { .mx-prop { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mx-prop__col h3 { font-size: var(--sn-fs-sm); text-transform: uppercase; letter-spacing: .06em; color: var(--sn-ink-soft); margin: 0 0 var(--sn-baseline-half); }
.mx-cand { display: grid; gap: var(--sn-s-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr)); }
.mx-cand > div { padding: var(--sn-baseline-half) var(--sn-s-3); border-radius: var(--sn-radius); }
.mx-cand dl { display: grid; grid-template-columns: max-content 1fr; gap: 0 var(--sn-s-2); margin: var(--sn-baseline-half) 0 0; font-size: var(--sn-fs-xs); }
.mx-cand dt { color: var(--sn-ink-soft); }
.mx-cand dd { margin: 0; }
@media (forced-colors: active) { .mx-ptop-boton[aria-expanded="true"] { border: 2px solid CanvasText; } }

/* ── Propuestas para Stella Nova (alcance limitado a .mx-propuesta: no tocan la skin) ── */
.mx-propuesta {
	/* Token de nota (capa semántica). Candidata por defecto: azul; se compara con malva y coral. */
	--sn-note: light-dark(color-mix(in oklab, var(--sn-azul-300) 62%, var(--sn-tinta-750)), var(--sn-azul-300));
	--sn-note-wash: color-mix(in oklab, var(--sn-note) 12%, var(--sn-paper));
	--sn-note-ink: light-dark(var(--sn-papel-50), var(--sn-tinta-850));
	/* Marca de modo */
	--sn-mode-mark: var(--sn-icon);
	--sn-mode-mark-size: .6em;
}
.mx-propuesta.mx-cand-malva { --sn-note: light-dark(color-mix(in oklab, var(--sn-malva-400) 62%, var(--sn-tinta-750)), var(--sn-malva-400)); }
.mx-propuesta.mx-cand-coral { --sn-note: light-dark(color-mix(in oklab, var(--sn-coral-300) 62%, var(--sn-tinta-750)), var(--sn-coral-300)); }
.mx-propuesta .mx-nota-marca { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 24px; padding: 0 var(--sn-s-1);
	font: 600 var(--sn-fs-xs) / 1 var(--sn-font-mono); border-radius: var(--sn-radius-pill); background: var(--sn-note); color: var(--sn-note-ink); }
.mx-propuesta .sn-note-bloque { outline: 1px dashed var(--sn-note); outline-offset: 3px; border-radius: var(--sn-radius-s); }
.mx-propuesta .sn-note-tarjeta { border-left: 3px solid var(--sn-note); background: var(--sn-note-wash); padding: var(--sn-baseline-half) var(--sn-s-3); border-radius: 0 var(--sn-radius) var(--sn-radius) 0; margin: var(--sn-baseline-half) 0; }
.mx-propuesta .sn-note-tarjeta p { margin: 0; }
.mx-propuesta .sn-badge-modo { gap: var(--sn-s-1); color: var(--sn-ink); }
.mx-propuesta .sn-badge-modo::before { content: ""; width: var(--sn-mode-mark-size); height: var(--sn-mode-mark-size); background: var(--sn-mode-mark); flex: none; }
.mx-propuesta .sn-badge-modo[data-modo="aprender"]::before { border-radius: 50%; }
.mx-propuesta .sn-badge-modo[data-modo="consultar"]::before { border-radius: 1px; }
.mx-propuesta .sn-badge-modo[data-modo="entender"]::before { transform: rotate(45deg) scale(.85); }
.mx-propuesta .sn-badge-modo[data-modo="resolver"]::before { width: 0; height: 0; background: transparent; border-left: calc(var(--sn-mode-mark-size) * .55) solid transparent; border-right: calc(var(--sn-mode-mark-size) * .55) solid transparent; border-bottom: var(--sn-mode-mark-size) solid var(--sn-mode-mark); }
.mx-cand .sn-note-tarjeta, .mx-cand p { font-size: var(--sn-fs-sm); line-height: var(--sn-leading); }
:root[data-sn-font="large"] .mx-ptop .spec-brand-ver { display: none; }
.spec section[id], .spec h2[id], .mw-parser-output [id] { scroll-margin-top: 6rem; }
/* La captura de la wiki trae los filetes de títulos de MediaWiki; el espécimen de la skin no los usa */
.spec .comp :is(h1, h2) { border-bottom: 0; }

/* Todas las páginas del proyecto: misma escala que un artículo de la wiki (raíz de 16 px); documentos con .sn-body y wikitable */
html.mx-escala-wiki { font-size: var(--sn-fs-root); }
.mx-phoja .mx-tabla-scroll { overflow-x: auto; margin: var(--sn-baseline) 0; }
.mx-phoja .mx-tabla-scroll > table.wikitable { margin: 0; }

/* Enlaces de la cabecera: no toman el color de «visitado» de la skin (a:visited, también con :root[data-sn-theme] a:visited).
   Son navegación y acciones, no enlaces de lectura. Especificidad (0,3,0) para ganar a (0,2,1). */
.mx-ptop .spec-brand:is(:link, :visited) { color: var(--sn-ink); }
.mx-ptop .spec-nav a:is(:link, :visited) { color: var(--sn-ink-soft); }
.mx-ptop .spec-nav a:is(:hover, [aria-current="page"]) { color: var(--sn-ink); }
.mx-ptop .mx-ptop-proto:is(:link, :visited, :hover, :active) { color: var(--sn-btn-primary-fg); }

/* ── Diátaxis: mapa de cuadrantes y brújula (docs/DIATAXIS-marco.md). Solo tokens de la skin. ── */
.mx-dtx-mapa { margin: var(--sn-baseline) 0; }
.mx-dtx-mapa__marco { position: relative; }
.mx-dtx-rejilla { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sn-s-2); grid-template-columns: minmax(0, 1fr); }
.mx-dtx-cuad { margin: 0; padding: var(--sn-s-3) var(--sn-s-4); text-align: start; border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); background: var(--sn-paper); }
.sn-body .mx-dtx-cuad h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sn-s-2); margin: 0 0 var(--sn-baseline-half); border: 0; padding: 0; }
.sn-body .mx-dtx-cuad p { margin: 0 0 var(--sn-baseline-half); text-align: start; }
.mx-dtx-cuad p:last-child { margin-bottom: 0; }
.mx-dtx-cuad__ejes { font-size: var(--sn-fs-xs); color: var(--sn-ink-soft); }
.mx-dtx-cuad[data-activo] { border-color: var(--sn-ink); box-shadow: inset 0 0 0 1px var(--sn-ink); }
.mx-dtx-eje { display: none; font-size: var(--sn-fs-xs); color: var(--sn-ink-soft); }
.mx-dtx-mapa figcaption { margin-top: var(--sn-baseline-half); font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }
@media (min-width: 40rem) {
	.mx-dtx-mapa__marco { padding: calc(var(--sn-baseline) * 1.25) calc(var(--sn-s-6) + var(--sn-s-2)); }
	.mx-dtx-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mx-dtx-cuad__ejes { display: none; }
	.mx-dtx-eje { display: block; position: absolute; text-align: center; }
	.mx-dtx-eje--arriba { top: 0; left: 0; right: 0; }
	.mx-dtx-eje--abajo { bottom: 0; left: 0; right: 0; }
	.mx-dtx-eje--izq, .mx-dtx-eje--der { top: 0; bottom: 0; width: var(--sn-s-6); writing-mode: vertical-rl; display: flex; align-items: center; justify-content: center; white-space: nowrap; }
	.mx-dtx-eje--izq { left: 0; transform: rotate(180deg); }
	.mx-dtx-eje--der { right: 0; }
}
.mx-dtx-brujula { margin: var(--sn-baseline) 0; display: grid; gap: var(--sn-s-3); }
.mx-dtx-brujula fieldset { margin: 0; padding: var(--sn-s-3) var(--sn-s-4); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); }
.mx-dtx-brujula legend { padding: 0 var(--sn-s-1); font-weight: 600; }
.mx-dtx-opcion { display: flex; align-items: center; gap: var(--sn-s-2); min-height: 44px; cursor: pointer; }
.mx-dtx-opcion input { flex: none; width: 1.1em; height: 1.1em; margin: 0; accent-color: var(--sn-ink); }
.mx-dtx-opcion input:focus-visible { outline: 2px solid var(--sn-focus-border); outline-offset: 2px; }
.mx-dtx-resultado { display: block; padding: var(--sn-s-3) var(--sn-s-4); border-radius: var(--sn-radius); background: var(--sn-sunk); }
@media (min-width: 48rem) { .mx-dtx-brujula { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mx-dtx-resultado { grid-column: 1 / -1; } }

/* ── Comentarios en el sitio del proyecto ── */
.mx-plectura { display: flex; flex-direction: column; gap: var(--sn-s-2); }
.mx-ptop .mx-comtoggle[aria-pressed="true"] { background: var(--sn-ink); color: var(--sn-paper); border-color: var(--sn-ink); }
@media (min-width: 80rem) {
	.mx-plectura { flex-direction: row; align-items: baseline; }
	.mx-ptop .mx-comtoggle { display: inline-flex; align-items: center; min-height: 32px; }
}
.mx-pcoms__filtro { display: flex; flex-wrap: wrap; gap: 0 var(--sn-s-4); margin: 0 0 var(--sn-baseline-half); padding: var(--sn-s-2) var(--sn-s-4); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); }
.mx-pcoms__filtro legend { padding: 0 var(--sn-s-1); font-weight: 600; }
.mx-pcoms__estado { color: var(--sn-ink-soft); }
.mx-pcoms__items { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sn-s-3); }
.mx-pcom { margin: 0; padding: var(--sn-s-3) var(--sn-s-4); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); background: var(--sn-paper); }
.mx-pcom p { margin: 0 0 var(--sn-s-2); }
.mx-pcom p:last-child { margin-bottom: 0; }
.mx-pcom__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sn-s-2); }
/* Prototipo y proyecto se distinguen por la etiqueta (texto) y la forma del sello, no solo por color */
.mx-pcom[data-superficie="proyecto"] .mx-pcom__sup { background: var(--sn-paper); border: 1px solid var(--sn-ink-soft); }
.mx-pcom__cita { margin: 0 0 var(--sn-s-2); padding-inline-start: var(--sn-s-3); border-inline-start: 2px solid var(--sn-hairline); color: var(--sn-ink-soft); font-size: var(--sn-fs-sm); }
.mx-pcom__autor { font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }
.mx-pcoms__como { margin-top: var(--sn-baseline); font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }

/* Avisos nota dentro de los documentos: sin el margen inferior del último párrafo */
.mx-phoja .cas-aviso > :last-child { margin-bottom: 0; }
.mx-phoja .cas-aviso > :first-child { margin-top: 0; }

/* ── Árbol interactivo (Árbol completo de ayudas, §3). Solo tokens de la skin. ── */
.mx-tree-app { margin: var(--sn-baseline) 0; }
.mx-tree-herr { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sn-s-3); padding: var(--sn-s-3) var(--sn-s-4); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); background: var(--sn-paper-edge); }
.mx-tree-campo { display: flex; flex-direction: column; gap: var(--sn-s-1); font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); flex: 1 1 12rem; }
.mx-tree-campo :is(input, select) { min-height: 44px; padding: 0 var(--sn-s-2); border: 1px solid var(--sn-hairline); border-radius: var(--sn-radius); background: var(--sn-paper); color: var(--sn-ink); font: inherit; font-size: var(--sn-fs-base); box-sizing: border-box; width: 100%; }
.mx-tree-campo :is(input, select):focus-visible { outline: 2px solid var(--sn-focus-border); outline-offset: 2px; }
.mx-tree-botones { display: flex; gap: var(--sn-s-2); }
.mx-tree-estado { min-height: var(--sn-baseline); margin: var(--sn-s-2) 0; font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }
.sn-body ul.mx-tree { list-style: none; margin: 0; padding: 0 0 0 var(--sn-s-4); border-left: 1px solid var(--sn-hairline); }
.sn-body ul.mx-tree--raiz { padding-left: 0; border-left: 0; }
.sn-body .mx-tree-li { margin: 0; padding: 0; text-align: start; }
.sn-body .mx-tree-li[hidden] { display: none; }
.mx-tree-item { display: block; padding: var(--sn-s-1) var(--sn-s-2); border-radius: var(--sn-radius); line-height: var(--sn-leading); }
summary.mx-tree-item { cursor: pointer; min-height: 32px; }
summary.mx-tree-item:hover { background: var(--sn-sunk); }
summary.mx-tree-item:focus-visible { outline: 2px solid var(--sn-focus-border); outline-offset: 1px; }
.mx-tree-cab { display: inline; }
.mx-tree-num { display: inline-block; min-width: 2.2em; font-family: var(--sn-font-mono); font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }
.mx-tree-nota, .mx-tree-cuenta { color: var(--sn-ink-soft); font-size: var(--sn-fs-sm); }
.mx-tree-origen { display: block; margin-top: 2px; padding-left: 2.2em; font-size: var(--sn-fs-sm); color: var(--sn-ink-soft); }
.mx-tree-sello { font-size: var(--sn-fs-xs); vertical-align: middle; }
.mx-tree--raiz > .mx-tree-li { margin-bottom: var(--sn-s-2); }
.mx-tree--raiz > .mx-tree-li > details > summary { font-size: var(--sn-fs-base); }
@media (max-width: 40rem) { .mx-tree-origen { padding-left: 0; } .sn-body ul.mx-tree { padding-left: var(--sn-s-2); } }
/* Indicador de rama: triángulo que gira al abrir (la skin oculta el marcador nativo de summary) */
summary.mx-tree-item { list-style: none; position: relative; padding-left: calc(var(--sn-s-2) + 1.1em); }
summary.mx-tree-item::-webkit-details-marker { display: none; }
summary.mx-tree-item::before { content: ""; position: absolute; left: var(--sn-s-2); top: calc(var(--sn-s-1) + .55em); width: 0; height: 0; border-top: .32em solid transparent; border-bottom: .32em solid transparent; border-left: .45em solid var(--sn-ink-soft); transition: transform var(--sn-dur-1); }
details[open] > summary.mx-tree-item::before { transform: rotate(90deg); }
@media (prefers-reduced-motion: reduce) { summary.mx-tree-item::before { transition: none; } }
@media (forced-colors: active) { summary.mx-tree-item::before { border-left-color: CanvasText; } }