/* Libro Mayor · piel Tinta
   Paleta, escala y piezas de la línea Tinta (GUIA de Themis, tinta-product.css y
   tinta-workspace-folio.css). Reglas: papel blanco/gris/negro, títulos Charter,
   interfaz system-ui, números en mono, filetes de 1 px, radios de 4 a 6 px, estados
   desaturados, sin degradados ni vidrio, sin clamp(). Escala tipográfica fija:
   28 · 21 · 17 · 15 · 13,5 · 12,5 · 11,5 · 10,5 px.
   Las clases tm-* y ws-* son las de la línea; las lm-* son piezas propias de la app. */

:root {
  color-scheme: light;
  --bg: #fbfbfc; --bg-alt: #f6f5f0; --elev: #ffffff;
  --ink: #131416; --ink-muted: #3f4146;
  --hair: #e8e7e2; --hair-strong: #d9d8d3; --gray: #6b7280;
  --crit: #a4574b; --med: #a8894e; --med-text: #765f2d; --ok: #6e8b6d; --ok-text: #4d684c; --info: #64748b;
  --on-ink: #ffffff;
  --shadow: 0 1px 2px rgba(0, 0, 0, .04);
  --crit-soft: color-mix(in srgb, var(--crit) 9%, var(--elev));
  --med-soft: color-mix(in srgb, var(--med) 9%, var(--elev));
  --ok-soft: color-mix(in srgb, var(--ok) 9%, var(--elev));
  --info-soft: color-mix(in srgb, var(--info) 9%, var(--elev));
  --focus: 0 0 0 3px color-mix(in srgb, var(--ink) 14%, transparent);
  --serif: Charter, 'Iowan Old Style', Palatino, Georgia, serif;
  --sans: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-drawer: cubic-bezier(.32, .72, 0, 1);
  --band: 0px;
  --appbar-h: 64px;
  --sidebar-w: 248px;
  --toque: 38px;
  --seguro-arriba: env(safe-area-inset-top, 0px);
  --seguro-abajo: env(safe-area-inset-bottom, 0px);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d0e10; --bg-alt: #151619; --elev: #1b1c20;
  --ink: #f2f1ec; --ink-muted: #b7b5ae;
  --hair: #2b2c31; --hair-strong: #3b3c42; --gray: #969aa3;
  --crit: #be8177; --med: #c2a578; --med-text: #c2a578; --ok: #95af94; --ok-text: #95af94; --info: #8fa0b4;
  --on-ink: #0d0e10;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3);
}
body.es-demo { --band: 30px; }

/* ---------- base ---------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-width: 320px; min-height: 100vh;
  color: var(--ink); background: var(--bg);
  font: 400 15px/1.5 var(--sans); letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--ink); text-underline-offset: 2px; text-decoration-thickness: 1px; }
a:hover { text-decoration-color: var(--gray); }
button, input, textarea, select { font: inherit; letter-spacing: 0; color: inherit; }
button { cursor: pointer; }
button:disabled, .tm-btn[aria-disabled="true"] { cursor: not-allowed; opacity: .55; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
::selection { color: var(--on-ink); background: var(--ink); }
h1, h2, h3, h4 { margin: 0 0 .6rem; color: var(--ink); font-family: var(--serif); font-weight: 500; line-height: 1.15; letter-spacing: 0; }
h1 { font-size: 28px; }
h2 { font-size: 21px; }
h3 { font-size: 17px; }
h4 { font-size: 15px; }
p { margin: 0 0 1rem; }
small { font-size: 12.5px; }
hr { margin: 1.5rem 0; border: 0; border-top: 1px solid var(--hair); }
code, kbd, .mono { font-family: var(--mono); font-size: .92em; font-weight: 400; }
kbd { padding: 1px 5px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--elev); font-size: 11.5px; color: var(--ink-muted); }
/* Importes de tabla: sans con cifras tabulares, a la derecha. El mono queda para folios, fechas y trazas. */
.num { text-align: right; font-family: var(--sans); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* Cifras clave (tarjetas, totales): serif Charter. */
.cifra { font-family: var(--serif); font-weight: 400; font-variant-numeric: tabular-nums lining-nums; }
.negativo { color: var(--crit); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.salto { position: absolute; left: 8px; top: -60px; z-index: 100; padding: 8px 12px; background: var(--ink); color: var(--on-ink); border-radius: 4px; }
.salto:focus { top: calc(8px + var(--seguro-arriba)); }
[hidden] { display: none !important; }

/* ---------- piezas Tinta ---------- */
.tm-kicker { color: var(--gray); font-family: var(--mono); font-size: 10.5px; font-weight: 400; letter-spacing: .13em; text-transform: uppercase; }
.tm-lede { max-width: 52rem; color: var(--ink-muted); font-size: 15px; }
.tm-note { color: var(--gray); font-size: 12.5px; }
.tm-rule { margin: 1.5rem 0; border: 0; border-top: 1px solid var(--hair); }
.tm-card { min-width: 0; padding: 20px; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); box-shadow: var(--shadow); }
.tm-card > :last-child { margin-bottom: 0; }
.tm-card--accent { border-top-color: var(--hair-strong); }
.tm-card + .tm-card { margin-top: 16px; }
/* En rejillas la separación la pone el gap: sin esto la segunda tarjeta baja 16 px. */
:is(.lm-rejilla-cuadro, .lm-rejilla, .lm-dos-columnas, .ws-metric-grid) > .tm-card + .tm-card { margin-top: 0; }

.tm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: var(--toque); padding: 8px 14px;
  color: var(--ink); font-family: var(--sans); font-size: 12.5px; font-weight: 400; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
  border: 1px solid var(--hair-strong); border-radius: 5px; background: var(--elev); box-shadow: var(--shadow);
  transition: transform 140ms var(--ease-out), border-color 150ms ease, background-color 150ms ease;
  -webkit-tap-highlight-color: transparent;
}
.tm-btn:hover { border-color: var(--gray); }
.tm-btn:active:not(:disabled) { transform: scale(.97); }
.tm-btn--accent { color: var(--on-ink); border-color: var(--ink); background: var(--ink); }
.tm-btn--accent:hover { border-color: var(--ink); background: color-mix(in srgb, var(--ink) 86%, var(--elev)); }
.tm-btn--ghost { color: var(--ink-muted); border-color: transparent; background: none; box-shadow: none; }
.tm-btn--ghost:hover { color: var(--ink); background: var(--bg-alt); border-color: var(--hair); }
.tm-btn--danger { color: var(--crit); background: none; box-shadow: none; }
.tm-btn--danger:hover { border-color: var(--crit); }
.tm-btn--icon { width: var(--toque); padding: 0; }
.tm-btn--chico { min-height: 30px; padding: 4px 10px; font-size: 11.5px; }
.tm-btn svg { width: 16px; height: 16px; flex: none; }
.tm-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 20px; }
.tm-actions--fin { justify-content: flex-end; }

.tm-field { display: grid; gap: 6px; margin: 0 0 14px; min-width: 0; align-content: start; }
.tm-field > label, .tm-field > span, .tm-field > legend { color: var(--ink-muted); font-size: 11.5px; font-weight: 500; }
.tm-field .requerido { color: var(--gray); font-weight: 400; }
.tm-input, .tm-select, .tm-textarea, .tm-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .tm-field select, .tm-field textarea {
  width: 100%; min-width: 0; min-height: var(--toque); padding: 8px 10px;
  color: var(--ink); font-size: 13.5px;
  border: 1px solid var(--hair-strong); border-radius: 4px; outline: 0; background: var(--elev);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.tm-field textarea, .tm-textarea { min-height: 96px; resize: vertical; }
.tm-input:focus, .tm-select:focus, .tm-textarea:focus, .tm-field input:focus, .tm-field select:focus, .tm-field textarea:focus { border-color: var(--ink); box-shadow: var(--focus); }
.tm-field input[readonly], .tm-field input:disabled, .tm-field select:disabled { background: var(--bg-alt); color: var(--ink-muted); }
.tm-field [aria-invalid="true"] { border-color: var(--crit); }
.tm-field input.num, .tm-input.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Selector de archivos: nunca más ancho que su columna; el botón nativo con aspecto de tm-btn. */
input[type="file"] { display: block; width: 100%; max-width: 100%; min-width: 0; color: var(--ink-muted); font: inherit; font-size: 12.5px; }
input[type="file"]::file-selector-button { min-height: 32px; margin-right: 10px; padding: 5px 12px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--elev); color: var(--ink); font: inherit; font-size: 13px; cursor: pointer; transition: border-color 120ms ease, transform 160ms cubic-bezier(.23, 1, .32, 1); }
input[type="file"]::file-selector-button:hover { border-color: var(--ink); }
input[type="file"]::file-selector-button:active { transform: scale(.97); }
.tm-check { display: flex; gap: 10px; align-items: flex-start; padding: 6px 0; font-size: 13.5px; cursor: pointer; }
.tm-check input { flex: 0 0 auto; width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--ink); }
.tm-check small { display: block; color: var(--gray); }
.lm-error-campo { color: var(--crit); font-size: 12.5px; }
.lm-ayuda { display: inline-flex; align-items: center; gap: 6px; color: var(--gray); font-size: 12.5px; }
.lm-ayuda--ok { color: var(--ok-text); }
.lm-ayuda--crit { color: var(--crit); }
.lm-punto { flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--hair-strong); display: inline-block; }
.lm-punto--ok { background: var(--ok); }
.lm-punto--med { background: var(--med); }
.lm-punto--crit { background: var(--crit); }
.lm-punto--info { background: var(--info); }

/* Estado: punto de 7 px y texto en tinta diluida. Nunca una píldora con relleno ni con borde:
   el color vive sólo en el punto. */
.tm-pill, .ws-pill, .lm-estado {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  color: var(--ink-muted); font-family: var(--sans); font-size: 12.5px; font-weight: 400; line-height: 1.3;
  letter-spacing: 0; text-transform: none; white-space: nowrap;
}
.tm-pill::before, .ws-pill::before, .lm-estado::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--hair-strong); }
.tm-pill--ok::before, .ws-pill--success::before, .lm-estado--ok::before { background: var(--ok); }
.tm-pill--high::before, .ws-pill--warning::before, .lm-estado--med::before { background: var(--med); }
.tm-pill--critical::before, .ws-pill--danger::before, .lm-estado--crit::before { background: var(--crit); }
.tm-pill--info::before, .lm-estado--info::before { background: var(--info); }

.tm-alert { margin: 0 0 16px; padding: 12px 14px; border-left: 3px solid var(--med); background: var(--med-soft); font-size: 13.5px; border-radius: 0 4px 4px 0; }
.tm-alert--danger { border-left-color: var(--crit); background: var(--crit-soft); }
.tm-alert--success { border-left-color: var(--ok); background: var(--ok-soft); }
.tm-alert--info { border-left-color: var(--info); background: var(--info-soft); }
.tm-alert strong { font-weight: 500; }
.tm-alert > :last-child { margin-bottom: 0; }

.tm-data { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.tm-data th, .tm-data td { padding: 9px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--hair); }
.tm-data th { color: var(--gray); font-family: var(--mono); font-size: 10.5px; font-weight: 400; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; vertical-align: bottom; }
.tm-data th.num, .tm-data td.num { text-align: right; }
.tm-data tbody tr:hover td { background: color-mix(in srgb, var(--bg-alt) 60%, transparent); }
.tm-data tfoot td { border-bottom: 0; border-top: 1px solid var(--hair-strong); font-weight: 500; }
.tm-data tfoot td.num { font-family: var(--serif); font-size: 15px; font-weight: 400; }
.tm-data td.mono, .tm-data td.mono a { font-weight: 400; }
.tm-data .acciones { width: 1%; white-space: nowrap; text-align: right; }
.tm-empty { padding: 20px; color: var(--gray); text-align: center; border: 1px solid var(--hair); border-radius: 4px; }

/* ---------- banda de demostración ---------- */
.demo-band {
  position: fixed; inset: 0 0 auto; z-index: 60; height: calc(var(--band) + var(--seguro-arriba)); padding-top: var(--seguro-arriba);
  display: flex; align-items: center; justify-content: center; gap: 12px;
  font: 400 10.5px/1 var(--mono); letter-spacing: .14em; text-transform: uppercase;
  color: var(--med-text); background: var(--bg-alt); border-bottom: 1px solid var(--hair);
}

/* ---------- cáscara ---------- */
.ws-appbar {
  position: fixed; inset: var(--band) 0 auto; z-index: 40;
  height: calc(var(--appbar-h) + var(--seguro-arriba)); padding: var(--seguro-arriba) 20px 0;
  display: flex; align-items: center; gap: 16px;
  background: var(--elev); border-bottom: 1px solid var(--hair);
}
body.es-demo .ws-appbar { top: calc(var(--band) + var(--seguro-arriba)); padding-top: 0; height: var(--appbar-h); }
.ws-wordmark { display: inline-flex; align-items: baseline; gap: 8px; color: var(--ink); text-decoration: none; white-space: nowrap; }
.ws-wordmark strong { font: 500 21px/1 var(--serif); letter-spacing: .01em; }
.ws-wordmark strong::after { content: "\00a7"; margin-left: 5px; color: var(--gray); font-size: 12.5px; vertical-align: 1px; }
.ws-wordmark span { color: var(--gray); font-family: var(--mono); font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; }
.lm-contexto { display: flex; align-items: center; gap: 10px; min-width: 0; flex: 1 1 auto; }
.lm-contexto form { display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0; }
.lm-contexto label { color: var(--gray); font-family: var(--mono); font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.lm-contexto select { min-height: 34px; max-width: 320px; padding: 5px 28px 5px 10px; border: 1px solid var(--hair-strong); border-radius: 5px; background: var(--elev); font-size: 13.5px; }
.lm-contexto .lm-ejercicio select { max-width: 150px; }
.ws-appbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-left: auto; }
.lm-buscar-boton { min-width: 220px; justify-content: space-between; color: var(--gray); }
.lm-buscar-boton kbd { margin-left: 12px; }
.lm-menu-boton { display: none; }
.lm-menu-usuario { position: relative; }
.lm-menu-usuario > summary { list-style: none; }
.lm-menu-usuario > summary::-webkit-details-marker { display: none; }
.lm-menu-usuario .lm-iniciales { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--bg-alt); border: 1px solid var(--hair-strong); font: 400 11.5px/1 var(--mono); }
.lm-menu-lista {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 50; min-width: 240px; padding: 6px;
  border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); box-shadow: 0 6px 24px rgba(0, 0, 0, .08);
  transform-origin: top right; animation: lm-pop 150ms var(--ease-out);
}
.lm-menu-lista header { padding: 8px 10px 10px; border-bottom: 1px solid var(--hair); margin-bottom: 6px; }
.lm-menu-lista header strong { display: block; font: 500 15px/1.2 var(--serif); }
.lm-menu-lista header span { color: var(--gray); font-size: 12.5px; overflow-wrap: anywhere; }
.lm-menu-lista a, .lm-menu-lista button { display: flex; width: 100%; align-items: center; min-height: 36px; padding: 6px 10px; border: 0; border-radius: 4px; background: none; color: var(--ink); font-size: 13.5px; text-align: left; text-decoration: none; }
.lm-menu-lista a:hover, .lm-menu-lista button:hover { background: var(--bg-alt); }
.lm-menu-lista form { margin: 0; }
.lm-menu-lista hr { margin: 6px 0; }
@keyframes lm-pop { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }

.ws-layout { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); padding-top: calc(var(--band) + var(--appbar-h) + var(--seguro-arriba)); min-height: 100vh;
  box-shadow: inset var(--sidebar-w) 0 0 var(--bg-alt), inset calc(var(--sidebar-w) + 1px) 0 0 var(--hair); }
.ws-sidebar {
  position: sticky; top: calc(var(--band) + var(--appbar-h) + var(--seguro-arriba)); align-self: start;
  height: calc(100vh - var(--band) - var(--appbar-h) - var(--seguro-arriba)); overflow-y: auto; overscroll-behavior: contain;
  padding: 14px 10px calc(24px + var(--seguro-abajo)); background: var(--bg-alt);
}
.lm-cajon-cabecera { display: none; }
.lm-nav { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.lm-nav > li > a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 36px; padding: 6px 10px; border-radius: 5px; color: var(--ink); text-decoration: none; font: 500 15px/1.2 var(--serif); }
.lm-nav > li > a:hover { background: color-mix(in srgb, var(--elev) 60%, transparent); }
.lm-nav > li > a[aria-current="page"], .lm-nav > li.activa > a { background: var(--elev); }
.lm-nav > li > a .lm-flecha { color: var(--gray); font: 400 12.5px/1 var(--sans); transition: transform 150ms var(--ease-out); }
.lm-nav > li.activa > a .lm-flecha { transform: rotate(90deg); }
.lm-subnav { margin: 4px 0 10px; padding: 0 0 0 10px; list-style: none; }
.lm-subnav .lm-grupo { margin: 10px 0 4px; padding: 0 10px; color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.lm-subnav .lm-grupo:first-child { margin-top: 4px; }
.lm-subnav a { display: flex; align-items: center; min-height: 32px; padding: 5px 10px; border-radius: 4px; color: var(--ink-muted); font-size: 13.5px; text-decoration: none; line-height: 1.25; }
.lm-subnav a:hover { color: var(--ink); background: color-mix(in srgb, var(--elev) 60%, transparent); }
.lm-subnav a[aria-current="page"] { color: var(--ink); background: var(--elev); }
.lm-velo { display: none; }

.ws-main { width: 100%; max-width: 1480px; min-width: 0; padding: 28px 32px calc(48px + var(--seguro-abajo)); outline: none; }
.lm-migas { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; padding: 0; list-style: none; color: var(--gray); font-size: 12.5px; }
.lm-migas li + li::before { content: "/"; margin-right: 6px; color: var(--hair-strong); }
.lm-migas a { color: var(--gray); text-decoration: none; }
.lm-migas a:hover { color: var(--ink); }
.ws-page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 16px; margin-bottom: 24px; border-bottom: 1px solid var(--hair); }
.ws-page-header h1 { margin-bottom: 4px; }
.ws-page-description { margin: 0; color: var(--ink-muted); font-size: 15px; max-width: 70ch; }
.ws-page-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.ws-section-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; margin-bottom: 12px; }
.ws-section-heading h2, .ws-section-heading h3 { margin: 0; }
.ws-section-heading > span, .ws-section-heading > a { color: var(--gray); font-size: 12.5px; }
.lm-bloque { margin-top: 32px; }

.ws-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.ws-metric { min-width: 0; display: grid; gap: 4px; align-content: start; padding: 14px 16px; border: 1px solid var(--hair); border-radius: 4px; background: var(--elev); color: var(--ink); text-decoration: none; }
a.ws-metric:hover { border-color: var(--hair-strong); }
.ws-metric span { color: var(--ink-muted); font-family: var(--mono); font-size: 10.5px; letter-spacing: .09em; text-transform: uppercase; }
.ws-metric strong { font: 400 28px/1.15 var(--serif); letter-spacing: 0; font-variant-numeric: tabular-nums lining-nums; overflow-wrap: anywhere; }
.ws-metric small { color: var(--gray); font-size: 12.5px; }
/* Tarjeta con riesgo: superficie blanca como las demás; el color sólo en el punto y en la cifra. */
.ws-metric--danger > span:first-child { display: inline-flex; align-items: center; gap: 6px; }
.ws-metric--danger > span:first-child::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--crit); }
.ws-metric--danger strong { color: var(--crit); }
.lm-rejilla-cuadro { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.lm-filas { display: grid; margin: 0; padding: 0; list-style: none; }
.lm-filas li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 4px 12px; padding: 9px 0; border-bottom: 1px solid var(--hair); font-size: 13.5px; }
.lm-filas li:last-child { border-bottom: 0; }
.lm-filas small { grid-column: 1 / -1; color: var(--gray); }
.lm-filas a { text-decoration: none; }
.lm-filas a:hover { text-decoration: underline; }

/* ---------- portada de sección y tarjetas de enlace ---------- */
.lm-enlaces { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.lm-enlace { display: grid; gap: 4px; min-height: 76px; padding: 14px 16px; border: 1px solid var(--hair); border-radius: 4px; background: var(--elev); color: var(--ink); text-decoration: none; transition: border-color 150ms ease; }
.lm-enlace:hover { border-color: var(--gray); }
.lm-enlace strong { font: 500 15px/1.25 var(--serif); }
.lm-enlace small { color: var(--gray); }
.lm-grupo-titulo { margin: 24px 0 10px; color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.lm-grupo-titulo:first-child { margin-top: 0; }

/* ---------- estados vacíos y en obras ---------- */
.lm-vacio { display: grid; justify-items: center; gap: 8px; padding: 40px 20px; text-align: center; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); }
.lm-vacio h2, .lm-vacio h3 { margin: 0; font-size: 17px; }
.lm-vacio p { max-width: 52ch; margin: 0; color: var(--ink-muted); font-size: 13.5px; }
.lm-vacio .tm-actions { justify-content: center; margin-top: 8px; }
.lm-vacio-marca { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--hair-strong); border-radius: 50%; color: var(--gray); font: 400 17px/1 var(--serif); margin-bottom: 4px; }

/* ---------- tabla con filtros ---------- */
.lm-tabla { min-width: 0; }
.lm-tabla-barra { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin-bottom: 12px; }
.lm-tabla-barra .tm-field { margin: 0; }
.lm-tabla-barra .lm-busqueda { flex: 1 1 240px; max-width: 360px; }
.lm-tabla-barra .lm-exportar { display: flex; gap: 6px; margin-left: auto; }
/* position: relative hace de bloque contenedor: así los textos ocultos (.sr-only, absolutos) de una
   tabla ancha quedan recortados por el marco y no ensanchan la página en el teléfono. */
.lm-tabla-marco { position: relative; overflow-x: auto; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); -webkit-overflow-scrolling: touch; }
.lm-tabla-marco .tm-data tr:last-child td { border-bottom: 0; }
.lm-tabla-marco .tm-data th:first-child, .lm-tabla-marco .tm-data td:first-child { padding-left: 14px; }
.lm-tabla-marco .tm-data th:last-child, .lm-tabla-marco .tm-data td:last-child { padding-right: 14px; }
.lm-orden { display: inline-flex; align-items: center; gap: 4px; color: inherit; text-decoration: none; }
.lm-orden:hover { color: var(--ink); }
.lm-orden[aria-sort] { color: var(--ink); }
.lm-orden .lm-flecha-orden { font-family: var(--sans); font-size: 11px; }
.lm-tabla .tm-data td a.lm-celda-enlace { font-weight: 500; text-decoration: none; }
.lm-tabla .tm-data td a.lm-celda-enlace:hover { text-decoration: underline; }
.lm-tabla .lm-fila-enlace { cursor: pointer; }
.lm-paginacion { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; color: var(--gray); font-size: 12.5px; }
.lm-paginacion nav { display: flex; gap: 6px; align-items: center; }
.lm-paginacion select { min-height: 30px; padding: 2px 8px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--elev); font-size: 12.5px; }
.lm-cargando { opacity: .55; transition: opacity 120ms ease; }
.htmx-request.lm-tabla, .htmx-request .lm-tabla-marco { opacity: .6; }

/* ---------- formularios ---------- */
.lm-rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.lm-rejilla--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lm-rejilla--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lm-rejilla .ancho-total { grid-column: 1 / -1; }
.lm-rejilla .ancho-2 { grid-column: span 2; }
fieldset.lm-grupo-campos { margin: 0 0 20px; padding: 0; border: 0; min-width: 0; }
fieldset.lm-grupo-campos > legend { padding: 0; margin-bottom: 12px; font: 500 17px/1.2 var(--serif); }
.lm-formulario { max-width: 920px; }
.lm-formulario--estrecho { max-width: 560px; }
.lm-pie-formulario { position: sticky; bottom: 0; z-index: 5; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: flex-end; margin: 24px 0 0; padding: 12px 0 calc(12px + var(--seguro-abajo)); background: var(--bg); border-top: 1px solid var(--hair); }
.lm-pie-formulario .lm-izquierda { margin-right: auto; }
.lm-pestanas { position: relative; display: flex; gap: 2px; margin: 0 0 20px; padding: 0; overflow-x: auto; border-bottom: 1px solid var(--hair); list-style: none; }
.lm-pestanas a { display: flex; align-items: center; min-height: 40px; padding: 8px 12px; color: var(--ink-muted); font-size: 13.5px; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.lm-pestanas a:hover { color: var(--ink); }
.lm-pestanas a[aria-current="true"], .lm-pestanas a[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--ink); }
.lm-datos { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0; font-size: 13.5px; }
.lm-datos dt { color: var(--gray); }
.lm-datos dd { margin: 0; overflow-wrap: anywhere; }
.lm-dos-columnas { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: start; }

/* ---------- autocompletar ---------- */
.lm-autocompletar { position: relative; }
.lm-opciones { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 45; max-height: 320px; overflow-y: auto; margin: 0; padding: 4px; list-style: none; border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); box-shadow: 0 6px 24px rgba(0, 0, 0, .08); }
.lm-opciones:empty { display: none; }
.lm-opcion { display: grid; gap: 2px; min-height: 40px; padding: 7px 10px; border-radius: 4px; cursor: pointer; font-size: 13.5px; }
.lm-opcion small { color: var(--gray); font-size: 11.5px; }
.lm-opcion[aria-selected="true"], .lm-opcion:hover { background: var(--bg-alt); }
.lm-opcion--vacia { color: var(--gray); cursor: default; }

/* ---------- editor de líneas ---------- */
.lm-lineas-marco { position: relative; overflow-x: auto; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); }
.lm-lineas { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.lm-lineas th { padding: 8px 6px; color: var(--gray); font: 400 10.5px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; text-align: left; border-bottom: 1px solid var(--hair); white-space: nowrap; }
.lm-lineas th.num { text-align: right; }
.lm-lineas td { padding: 6px; border-bottom: 1px solid var(--hair); vertical-align: top; }
.lm-lineas td input, .lm-lineas td select { width: 100%; min-height: 34px; padding: 5px 8px; border: 1px solid var(--hair-strong); border-radius: 4px; background: var(--elev); font-size: 13.5px; }
.lm-lineas td input:focus, .lm-lineas td select:focus { outline: 0; border-color: var(--ink); box-shadow: var(--focus); }
.lm-lineas td.num input { text-align: right; font-family: var(--sans); font-variant-numeric: tabular-nums; }
.lm-lineas .col-articulo { width: 22%; } .lm-lineas .col-cantidad { width: 9%; } .lm-lineas .col-precio { width: 11%; }
.lm-lineas .col-descuento { width: 8%; } .lm-lineas .col-iva { width: 11%; } .lm-lineas .col-importe { width: 11%; }
.lm-lineas .lm-importe-linea { display: block; padding: 7px 2px; text-align: right; font-family: var(--sans); font-variant-numeric: tabular-nums; }
.lm-lineas .acciones { width: 1%; }
.lm-lineas-pie { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 16px; margin-top: 12px; }
.lm-totales { min-width: 300px; margin-left: auto; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); padding: 6px 16px; }
.lm-totales dl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 16px; margin: 0; font-size: 13.5px; }
.lm-totales dt, .lm-totales dd { padding: 6px 0; border-bottom: 1px solid var(--hair); margin: 0; }
.lm-totales dd { text-align: right; font-family: var(--serif); font-variant-numeric: tabular-nums lining-nums; }
.lm-totales .lm-total dt, .lm-totales .lm-total dd { border-bottom: 0; font-size: 17px; }
.lm-totales .lm-total dt { font-family: var(--serif); font-weight: 500; }
.lm-totales dl > div { display: contents; }
.lm-totales .lm-errores { color: var(--crit); font-size: 12.5px; margin: 6px 0; }

/* ---------- avisos (toasts) ---------- */
.lm-avisos { position: fixed; right: 16px; bottom: calc(16px + var(--seguro-abajo)); z-index: 90; display: grid; gap: 8px; width: min(420px, calc(100% - 32px)); pointer-events: none; }
.lm-aviso { pointer-events: auto; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 10px; padding: 12px 12px 12px 14px; border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); box-shadow: 0 6px 24px rgba(0, 0, 0, .08); font-size: 13.5px; transition: opacity 200ms var(--ease-out), transform 200ms var(--ease-out); }
@starting-style { .lm-aviso { opacity: 0; transform: translateY(8px); } }
.lm-aviso.saliendo { opacity: 0; transform: translateY(8px); }
.lm-aviso .lm-punto { margin-top: 6px; }
.lm-aviso button { border: 0; background: none; color: var(--gray); font-size: 17px; line-height: 1; padding: 0 4px; min-width: 28px; min-height: 28px; }
.lm-aviso--ok .lm-punto { background: var(--ok); }
.lm-aviso--med .lm-punto { background: var(--med); }
.lm-aviso--crit { border-color: color-mix(in srgb, var(--crit) 40%, var(--hair-strong)); }
.lm-aviso--crit .lm-punto { background: var(--crit); }
.lm-aviso--info .lm-punto { background: var(--info); }

/* ---------- diálogos ---------- */
dialog.lm-modal { width: min(560px, calc(100% - 32px)); max-height: calc(100vh - 64px - var(--seguro-arriba) - var(--seguro-abajo)); padding: 0; color: var(--ink); border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); box-shadow: 0 12px 40px rgba(0, 0, 0, .12); }
dialog.lm-modal--ancho { width: min(880px, calc(100% - 32px)); }
dialog.lm-modal[open] { animation: lm-pop 180ms var(--ease-out); }
dialog.lm-modal::backdrop { background: rgba(19, 20, 22, .32); }
.lm-modal-cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--hair); }
.lm-modal-cabecera h2 { margin: 0; font-size: 17px; }
.lm-modal-cuerpo { padding: 20px; overflow-y: auto; }
.lm-modal-cuerpo > :last-child { margin-bottom: 0; }
.lm-modal-pie { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--hair); background: var(--bg); }
.lm-cerrar { border: 0; background: none; color: var(--gray); font-size: 21px; line-height: 1; min-width: 36px; min-height: 36px; border-radius: 4px; }
.lm-cerrar:hover { color: var(--ink); background: var(--bg-alt); }

dialog.lm-paleta { width: min(640px, calc(100% - 24px)); margin-top: calc(12vh + var(--seguro-arriba)); padding: 0; border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); color: var(--ink); box-shadow: 0 12px 40px rgba(0, 0, 0, .14); }
dialog.lm-paleta::backdrop { background: rgba(19, 20, 22, .28); }
.lm-paleta-entrada { display: flex; align-items: center; gap: 10px; padding: 0 14px; border-bottom: 1px solid var(--hair); }
.lm-paleta-entrada input { flex: 1; min-height: 52px; border: 0; outline: 0; background: none; font-size: 17px; }
.lm-paleta-resultados { max-height: min(60vh, 520px); overflow-y: auto; padding: 6px; }
.lm-paleta-grupo { margin: 8px 8px 4px; color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.lm-resultado { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: baseline; min-height: 44px; padding: 8px 10px; border-radius: 4px; color: var(--ink); text-decoration: none; font-size: 13.5px; }
.lm-resultado small { color: var(--gray); font-size: 11.5px; }
.lm-resultado[aria-selected="true"], .lm-resultado:hover { background: var(--bg-alt); }
.lm-paleta-pie { display: flex; gap: 14px; padding: 8px 14px; border-top: 1px solid var(--hair); color: var(--gray); font-size: 11.5px; }

/* ---------- acceso (entrar, registro…) ---------- */
.lm-acceso { min-height: 100vh; display: grid; grid-template-rows: auto 1fr auto; padding: var(--seguro-arriba) 0 var(--seguro-abajo); }
.lm-acceso-cabecera { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; border-bottom: 1px solid var(--hair); background: var(--elev); }
.lm-acceso-cuerpo { width: min(440px, calc(100% - 32px)); margin: 56px auto 40px; }
.lm-acceso-cuerpo--ancho { width: min(620px, calc(100% - 32px)); }
.lm-acceso-cuerpo h1 { margin-bottom: 6px; }
.lm-acceso-cuerpo .tm-lede { margin-bottom: 24px; font-size: 15px; }
.lm-acceso-cuerpo .tm-btn--accent { width: 100%; min-height: 44px; font-size: 13.5px; }
.lm-acceso-pie { padding: 16px 24px; color: var(--gray); font-size: 12.5px; border-top: 1px solid var(--hair); display: flex; gap: 16px; flex-wrap: wrap; justify-content: space-between; }
.lm-separador { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: var(--gray); font-size: 12.5px; }
.lm-separador::before, .lm-separador::after { content: ""; flex: 1; border-top: 1px solid var(--hair); }

/* ---------- impresión ---------- */
.lm-solo-impresion { display: none; }
@page { margin: 16mm 14mm; }
@media print {
  :root { --band: 0px; }
  body { background: #fff; color: #000; font-size: 10.5pt; }
  .ws-appbar, .ws-sidebar, .demo-band, .lm-velo, .lm-avisos, .lm-no-imprimir, .lm-tabla-barra, .lm-paginacion, .lm-pie-formulario, .ws-page-actions, .lm-migas, dialog { display: none !important; }
  .ws-layout { display: block; padding: 0; }
  .ws-main { padding: 0; max-width: none; }
  .lm-solo-impresion { display: block; }
  .lm-cabecera-impresion { display: flex; justify-content: space-between; gap: 16px; padding-bottom: 8px; margin-bottom: 12px; border-bottom: 1px solid #000; font-size: 9pt; }
  .lm-tabla-marco, .tm-card, .ws-metric, .lm-totales { border-color: #bbb; box-shadow: none; }
  .tm-data th, .tm-data td { padding: 4px 6px; border-bottom-color: #ccc; }
  .lm-ocultar-movil { display: table-cell !important; }
  a { color: #000; text-decoration: none; }
  tr, .tm-card { break-inside: avoid; }
}

/* ---------- pantallas medianas ---------- */
@media (max-width: 1180px) {
  .lm-buscar-boton { min-width: 0; }
  .lm-buscar-boton .lm-texto-buscar { display: none; }
  .ws-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lm-rejilla--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lm-dos-columnas { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- teléfono y tableta: cajón lateral ---------- */
@media (max-width: 900px) {
  :root { --appbar-h: 56px; --toque: 44px; }
  body { font-size: 16px; }
  .ws-appbar { gap: 8px; padding-left: 8px; padding-right: 8px; }
  .lm-menu-boton { display: inline-flex; }
  .ws-wordmark span { display: none; }
  .lm-contexto { display: none; }
  .lm-buscar-boton kbd { display: none; }
  .ws-layout { display: block; box-shadow: none; }
  .ws-sidebar {
    position: fixed; top: 0; bottom: 0; left: 0; z-index: 70; width: min(320px, 86vw); height: auto;
    padding: calc(12px + var(--seguro-arriba)) 12px calc(24px + var(--seguro-abajo));
    border-right: 1px solid var(--hair-strong); box-shadow: 0 0 40px rgba(0, 0, 0, .12);
    transform: translateX(-104%); visibility: hidden;
    transition: transform 260ms var(--ease-drawer), visibility 0s linear 260ms;
  }
  body[data-cajon="abierto"] .ws-sidebar { transform: none; visibility: visible; transition: transform 260ms var(--ease-drawer), visibility 0s; }
  .lm-velo { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(19, 20, 22, .32); opacity: 0; pointer-events: none; transition: opacity 200ms ease; }
  body[data-cajon="abierto"] .lm-velo { opacity: 1; pointer-events: auto; }
  body[data-cajon="abierto"] { overflow: hidden; }
  .lm-cajon-cabecera { display: grid; gap: 12px; padding: 0 4px 14px; margin-bottom: 10px; border-bottom: 1px solid var(--hair); }
  .lm-cajon-cabecera .lm-fila { display: flex; align-items: center; justify-content: space-between; }
  .lm-cajon-cabecera form { display: grid; gap: 4px; margin: 0; }
  .lm-cajon-cabecera label { color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
  .lm-cajon-cabecera select { width: 100%; min-height: 44px; padding: 8px 10px; border: 1px solid var(--hair-strong); border-radius: 5px; background: var(--elev); font-size: 16px; }
  .lm-nav > li > a { min-height: 44px; font-size: 17px; }
  .lm-subnav a { min-height: 44px; font-size: 16px; }
  .ws-main { padding: 20px 16px calc(40px + var(--seguro-abajo)); }
  .ws-page-header { flex-direction: column; align-items: stretch; gap: 12px; }
  .ws-page-actions { justify-content: flex-start; }
  .tm-field > label, .tm-field > span { font-size: 12.5px; }
  .tm-input, .tm-select, .tm-textarea, .tm-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), .tm-field select, .tm-field textarea { font-size: 16px; }
  .tm-btn { font-size: 13.5px; }
  .tm-btn--chico { min-height: 36px; }
  .lm-rejilla, .lm-rejilla--3, .lm-rejilla--4 { grid-template-columns: minmax(0, 1fr); }
  .lm-rejilla .ancho-2 { grid-column: auto; }
  .lm-rejilla-cuadro { grid-template-columns: minmax(0, 1fr); }
  .lm-ocultar-movil { display: none; }
  .tm-data { font-size: 14px; }
  .tm-data th, .tm-data td { padding: 10px 8px; }
  /* Zona táctil de 44 px; el texto de un enlace queda arriba, alineado con las otras celdas. */
  .tm-data td a:not(.tm-btn) { min-height: 44px; display: inline-flex; align-items: flex-start; }
  .tm-data td a.tm-btn, .tm-data td button { min-height: 44px; display: inline-flex; align-items: center; }
  .lm-tabla-barra .lm-busqueda { max-width: none; flex-basis: 100%; }
  .lm-tabla-barra .lm-exportar { margin-left: 0; }
  .lm-pie-formulario { margin: 20px 0 0; }
  .lm-pie-formulario .tm-btn { flex: 1 1 auto; }
  .lm-subnav .lm-grupo { margin-top: 14px; }
  .lm-menu-lista a, .lm-menu-lista button { min-height: 44px; font-size: 16px; }
  .lm-resultado { min-height: 48px; font-size: 16px; }
  .lm-opcion { min-height: 44px; font-size: 16px; }
  dialog.lm-paleta { margin-top: calc(8px + var(--seguro-arriba)); }
  .lm-cerrar { min-width: 44px; min-height: 44px; }
  input[type="file"]::file-selector-button { min-height: 44px; font-size: 15px; }
  .lm-datos { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lm-datos dd { margin-bottom: 8px; }
  .lm-acceso-cuerpo { margin-top: 32px; }
  .lm-acceso-cabecera { padding: 14px 16px; }
  /* editor de líneas apilado */
  .lm-lineas thead { display: none; }
  .lm-lineas, .lm-lineas tbody { display: block; }
  .lm-lineas tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; border-bottom: 1px solid var(--hair); }
  .lm-lineas td { display: grid; gap: 4px; padding: 0; border: 0; }
  .lm-lineas td::before { content: attr(data-etiqueta); color: var(--gray); font: 400 10.5px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
  .lm-lineas td.col-articulo, .lm-lineas td.col-descripcion { grid-column: 1 / -1; }
  .lm-lineas td input, .lm-lineas td select { min-height: 44px; font-size: 16px; }
  .lm-lineas td.acciones { grid-column: 1 / -1; justify-items: end; }
  .lm-lineas td.acciones::before { display: none; }
  .lm-totales { min-width: 0; width: 100%; }
}
@media (max-width: 560px) {
  .ws-metric-grid { grid-template-columns: minmax(0, 1fr); }
  .ws-metric strong { font-size: 24px; }
  .lm-buscar-boton { width: var(--toque); padding: 0; }
  .lm-buscar-boton .lm-icono-buscar { margin: 0; }
  .lm-enlaces { grid-template-columns: minmax(0, 1fr); }
  .lm-paginacion { justify-content: center; }
  .lm-paginacion .lm-por-pagina { display: none; }
  h1 { font-size: 24px; }
}

/* ---------- menos movimiento ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .tm-btn:active:not(:disabled) { transform: none; }
  .ws-sidebar, body[data-cajon="abierto"] .ws-sidebar { transition: opacity 150ms ease, visibility 0s; }
  .lm-aviso, .lm-aviso.saliendo { transform: none; }
  @starting-style { .lm-aviso { transform: none; } }
}

/* ---------- indicadores de htmx (los estilos propios de htmx van desactivados) ---------- */
.htmx-indicator { opacity: 0; transition: opacity 200ms ease; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; }
.lm-girando { display: inline-block; width: 12px; height: 12px; border: 2px solid var(--hair-strong); border-top-color: var(--ink); border-radius: 50%; animation: lm-giro .7s linear infinite; }
@keyframes lm-giro { to { transform: rotate(360deg); } }

/* ---------- utilidades ---------- */
.lm-en-linea { display: inline; margin: 0; }
.lm-opciones:not(:has(li)) { display: none; }
.lm-sin-barra .ws-main { margin: 0 auto; }
body.sin-empresa .ws-layout { display: block; }

/* ---------- ajustes tras revisar las capturas ---------- */
input[type="search"]::-webkit-search-cancel-button { display: none; }
.demo-band .lm-banda-larga { white-space: nowrap; }
@media (max-width: 900px) {
  .demo-band .lm-banda-larga { display: none; }
}
@media (max-width: 560px) {
  .lm-buscar-boton { justify-content: center; }
}

/* ---------- contabilidad: pasos del cierre (P3) ---------- */
.lm-paso .ws-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.lm-paso__numero { display: inline-block; min-width: 1.4em; font-family: var(--serif); color: var(--ink-muted); }
.lm-subtitulo { font-family: var(--serif); font-weight: 400; font-size: 17px; margin: 18px 0 6px; }
.lm-selector-ejercicio select { min-width: 9rem; }
.lm-paso .lm-tabla-marco input { width: 100%; max-width: 12rem; }
.lm-rejilla > .lm-doble { grid-column: span 2; }
.lm-rejilla > .lm-triple { grid-column: span 3; }
@media (max-width: 720px) { .lm-rejilla > .lm-doble, .lm-rejilla > .lm-triple { grid-column: auto; } }
.lm-lista-simple { margin: 0; padding-left: 1.1em; line-height: 1.7; }

/* =====================================================================================
   P3-D · listados (columnas, vistas), hoja de impreso, editor visual, etiquetas, borradores
   ===================================================================================== */
.lm-columnas { position: relative; }
.lm-columnas > summary { list-style: none; cursor: pointer; }
.lm-columnas > summary::-webkit-details-marker { display: none; }
.lm-columnas-lista { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; display: grid; gap: 2px; min-width: 220px; max-width: min(88vw, 320px); max-height: 60vh; overflow-y: auto; margin: 0; padding: 10px 12px; border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); }
.lm-columnas-lista > legend { float: left; width: 100%; margin-bottom: 6px; color: var(--gray); font: 400 10.5px/1.2 var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.lm-casilla { display: flex; align-items: center; gap: 8px; min-height: 30px; font-size: 13.5px; cursor: pointer; }
.lm-casilla input { margin: 0; }
.lm-columnas-elegir { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 2px 14px; }
.lm-filtro-columna select, .lm-filtro-columna input { max-width: 200px; }
.lm-vistas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: -2px 0 12px; }
.lm-vistas-lista { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.lm-vistas-titulo { color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.lm-vista { color: var(--ink-muted); font-size: 13px; text-decoration: none; border-bottom: 1px solid transparent; }
.lm-vista:hover { color: var(--ink); border-bottom-color: var(--hair-strong); }
.lm-vista.activa { color: var(--ink); font-weight: 500; border-bottom-color: var(--ink); }
.lm-guardar-vista { position: relative; }
.lm-guardar-vista > summary { list-style: none; cursor: pointer; }
.lm-guardar-vista > summary::-webkit-details-marker { display: none; }
.lm-guardar-vista-form { position: absolute; z-index: 20; top: calc(100% + 6px); left: 0; display: grid; gap: 8px; width: 300px; max-width: 88vw; padding: 12px 14px; border: 1px solid var(--hair-strong); border-radius: 6px; background: var(--elev); }
.lm-guardar-vista-form .tm-field { margin: 0; }
.lm-tabla tr[data-enlace]:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.lm-seccion { margin-top: 20px; }
.lm-seccion > h2 { margin: 0 0 12px; font: 500 17px/1.25 var(--serif); }
.lm-cifras { margin-bottom: 16px; }

/* Hoja A4 del impreso (vista en pantalla y lienzo del editor): papel blanco, medidas en mm. */
.lm-hoja-marco { overflow: auto; padding: 12px; border: 1px solid var(--hair); border-radius: 6px; background: var(--bg-alt); -webkit-overflow-scrolling: touch; }
.lm-hoja { position: relative; width: 210mm; min-width: 210mm; height: 297mm; margin: 0 auto; background: #fff; color: #1a1a1a; border: 1px solid var(--hair-strong); font-family: var(--sans); font-size: 9pt; line-height: 1.3; }
.lm-hoja-el { position: absolute; box-sizing: border-box; overflow: hidden; }
.lm-hoja-el .destacado { font-weight: 600; }
.lm-hoja-el.serif { font-family: var(--serif); }
.lm-hoja-el.gris { color: #6b6b6b; }
.lm-hoja-el.negrita { font-weight: 600; }
.lm-hoja-el table { width: 100%; border-collapse: collapse; }
.lm-hoja-el th { padding: 1mm; border-bottom: 0.6pt solid #1a1a1a; color: #6b6b6b; font-weight: 600; text-align: left; }
.lm-hoja-el td { padding: 1mm; border-bottom: 0.25pt solid #d9d9d6; vertical-align: top; }
.lm-hoja-el .num { text-align: right; font-variant-numeric: tabular-nums; }
.lm-hoja-par { display: flex; justify-content: space-between; gap: 2mm; }
.lm-hoja-par > span:first-child { color: #6b6b6b; }
.lm-hoja-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 1.5mm; padding-top: 1.5mm; border-top: 0.6pt solid #1a1a1a; }
.lm-hoja-total > span:first-child { font-weight: 600; }
.lm-hoja-total > span:last-child { font-family: var(--serif); font-size: 150%; }
.lm-hoja-el hr { margin: 0; border: 0; border-top: 0.5pt solid #1a1a1a; }

.lm-editor-impreso { display: grid; grid-template-columns: 220px minmax(0, 1fr) 240px; gap: 14px; align-items: start; margin-bottom: 70px; }
.lm-editor-paleta, .lm-editor-propiedades { position: sticky; top: calc(var(--appbar-h, 56px) + 10px); max-height: calc(100vh - 120px); overflow-y: auto; padding: 12px; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); }
.lm-editor-propiedades .tm-field { margin-bottom: 8px; }
.lm-paleta-lista { display: grid; gap: 4px; margin: 0 0 12px; padding: 0; list-style: none; }
.lm-paleta-campo { width: 100%; min-height: 32px; padding: 5px 9px; border: 1px solid var(--hair); border-radius: 4px; background: var(--elev); color: var(--ink); font: 400 13px/1.25 var(--sans); text-align: left; cursor: grab; }
.lm-paleta-campo:hover, .lm-paleta-campo:focus-visible { border-color: var(--gray); }
.lm-paleta-campo:active { cursor: grabbing; }
[data-lienzo-impreso] .lm-hoja-el { min-height: 4mm; outline: 1px dashed transparent; cursor: move; touch-action: none; }
[data-lienzo-impreso] .lm-hoja-el:hover { outline-color: #b5b5b0; }
[data-lienzo-impreso] .lm-hoja-el.elegido, [data-lienzo-impreso] .lm-hoja-el:focus-visible { outline: 1px solid #1a1a1a; }

/* Aviso de borrador recuperable */
.lm-borrador { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 14px; }
.lm-borrador .tm-actions { margin: 0; }

@media (max-width: 1100px) {
  .lm-editor-impreso { grid-template-columns: minmax(0, 1fr); }
  .lm-editor-paleta, .lm-editor-propiedades { position: static; max-height: none; }
  .lm-paleta-lista { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
}
@media (max-width: 720px) {
  .lm-columnas-lista, .lm-guardar-vista-form { position: fixed; top: auto; left: 12px; right: 12px; bottom: calc(12px + var(--seguro-abajo, 0px)); width: auto; max-width: none; min-width: 0; }
  .lm-casilla { min-height: 44px; font-size: 15px; }
  .lm-filtro-columna select, .lm-filtro-columna input { max-width: none; }
  .lm-paleta-campo { min-height: 44px; font-size: 15px; }
}
@media print {
  .lm-vistas, .lm-columnas, .lm-editor-paleta, .lm-editor-propiedades { display: none !important; }
  .lm-hoja-marco { padding: 0; border: 0; background: none; overflow: visible; }
  .lm-hoja { border: 0; }
}

/* P3-D · configuración transversal: grupos, tareas, ayuda */
.lm-cabecera-tarjeta { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lm-lista-filas { list-style: none; margin: 12px 0; padding: 0; border-top: 1px solid var(--hair); }
.lm-lista-filas > li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--hair); }
.lm-formulario-en-linea { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin: 12px 0 0; }
.lm-formulario-en-linea .tm-field { margin: 0; min-width: min(100%, 260px); }
.lm-acciones-izquierda { justify-content: flex-start; flex-wrap: wrap; }
.lm-ayuda-temas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 12px; }
.lm-ayuda-temas a { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 14px 16px; border: 1px solid var(--hair); border-radius: 6px; background: var(--elev); color: inherit; text-decoration: none; }
.lm-ayuda-temas a:hover, .lm-ayuda-temas a:focus-visible { border-color: currentColor; }
.lm-ayuda-temas strong { font: 500 17px/1.25 var(--serif); }
.lm-ayuda-temas span { font-size: 13.5px; color: var(--ink-muted); }
.lm-ayuda-texto { max-width: 68ch; }
.lm-ayuda-texto section + section { margin-top: 24px; }
.lm-ayuda-texto h2 { font: 500 19px/1.3 var(--serif); margin: 0 0 8px; }
.lm-ayuda-texto p { line-height: 1.65; margin: 0 0 10px; }
.lm-ayuda-tabla th { width: 38%; font-weight: 500; }
.lm-ayuda-indice ul { list-style: none; margin: 0 0 16px; padding: 0; line-height: 1.9; }
.lm-ayuda-indice a[aria-current="page"] { font-weight: 600; text-decoration: none; }

/* ---------- vida: íconos, dibujos y movimiento (5-nov) ----------
   Íconos de trazo fino en el menú y en las tarjetas; dibujos que se trazan solos en
   portadas y estados vacíos; contenido que entra con un desliz corto; gráficas que
   crecen. Solo transform, opacity y stroke-dashoffset. Sin sombras ni degradados. */
@keyframes lm-entrar { from { opacity: 0; transform: translateY(6px); } }
@keyframes lm-trazar { from { stroke-dashoffset: var(--largo, 600); } to { stroke-dashoffset: 0; } }
@keyframes lm-sellar { from { opacity: 0; transform: scale(.9) rotate(-12deg); } }
@keyframes lm-crecer-y { from { transform: scaleY(0); } }
@keyframes lm-crecer-x { from { transform: scaleX(0); } }
@keyframes lm-anillo { from { stroke-dasharray: 0 400; } }
@keyframes lm-escribir { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(-5px, 3px) rotate(-3deg); } }
@keyframes lm-izar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(14px); } }

.lm-ico { flex: none; width: 18px; height: 18px; color: var(--gray); transition: color 150ms ease, transform 200ms var(--ease-out); }

/* menú lateral */
.lm-nav-rotulo { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.lm-nav > li > a:hover .lm-ico, .lm-nav > li.activa > a .lm-ico { color: var(--ink); }
.lm-nav > li.activa > a .lm-ico * { --largo: 80; stroke-dasharray: 80; animation: lm-trazar 700ms var(--ease-out) both; }
.lm-subnav a { gap: 9px; }
.lm-subnav a .lm-ico { width: 15px; height: 15px; }
.lm-subnav a:hover .lm-ico, .lm-subnav a[aria-current="page"] .lm-ico { color: var(--ink); }
@media (hover: hover) and (pointer: fine) {
  .lm-nav a:hover .lm-ico { transform: translateX(1px) scale(1.08); }
}

/* el contenido entra con un desliz corto, escalonado */
.ws-main > * { animation: lm-entrar 280ms var(--ease-out) backwards; }
.ws-main > *:nth-child(2) { animation-delay: 40ms; }
.ws-main > *:nth-child(3) { animation-delay: 80ms; }
.ws-main > *:nth-child(4) { animation-delay: 120ms; }
.ws-main > *:nth-child(n+5) { animation-delay: 160ms; }

/* portada de sección: título, filtro y dibujo */
.lm-portada { display: grid; grid-template-columns: minmax(0, 1fr) 240px; align-items: center; gap: 28px; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid var(--hair); }
.lm-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 10px; color: var(--gray); font: 400 10.5px/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; }
.lm-kicker .lm-ico { width: 15px; height: 15px; color: var(--ink); }
.lm-portada h1 { margin: 0; font: 500 28px/1.15 var(--serif); }
.lm-portada-lede { max-width: 60ch; margin: 8px 0 0; color: var(--ink-muted); font-size: 15px; }
.lm-portada-cuenta { margin: 14px 0 0; color: var(--gray); font-size: 12.5px; }
.lm-portada-cuenta .num { margin-right: 2px; color: var(--ink); font: 500 21px/1 var(--serif); }
.lm-filtro { display: flex; align-items: center; gap: 8px; max-width: 440px; min-height: 40px; margin-top: 16px; padding: 0 12px; border: 1px solid var(--hair-strong); border-radius: 5px; background: var(--elev); transition: border-color 150ms ease; }
.lm-filtro:focus-within { border-color: var(--ink); box-shadow: var(--focus); }
.lm-filtro input { flex: 1; min-width: 0; min-height: 38px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: 400 13.5px var(--sans); }
.lm-filtro-vacio { margin-top: 16px; }

.lm-dibujo { justify-self: end; width: 100%; max-width: 240px; height: auto; stroke: var(--ink); stroke-width: 1.4; }
.lm-dibujo-hoja rect { fill: var(--elev); stroke: var(--hair-strong); --largo: 500; stroke-dasharray: 500; animation: lm-trazar 900ms var(--ease-out) both; }
.lm-dibujo-hoja path { stroke: var(--hair-strong); --largo: 120; stroke-dasharray: 120; animation: lm-trazar 700ms var(--ease-out) 250ms both; }
.lm-dibujo-hoja .lm-dibujo-margen { stroke: color-mix(in srgb, var(--crit) 45%, transparent); }
.lm-dibujo-cifras { stroke: var(--gray); }
.lm-dibujo-cifras path { --largo: 120; stroke-dasharray: 120; animation: lm-trazar 600ms var(--ease-out) 700ms both; }
.lm-dibujo-figura * { --largo: 90; stroke-dasharray: 90; animation: lm-trazar 1100ms var(--ease-out) 300ms both; }
.lm-dibujo-sello { stroke: var(--ok); fill: var(--elev); transform-box: fill-box; transform-origin: center; animation: lm-sellar 420ms var(--ease-out) 1000ms backwards; transition: transform 300ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .lm-portada:hover .lm-dibujo-sello { transform: rotate(-10deg) scale(1.06); }
}

/* tarjetas con ícono */
.lm-enlace--ico { grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; column-gap: 14px; transition: border-color 150ms ease, background-color 150ms ease, transform 160ms var(--ease-out); }
.lm-enlace-ico { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--hair); border-radius: 6px; background: var(--bg-alt); transition: background-color 150ms ease, border-color 150ms ease; }
.lm-enlace-ico .lm-ico { color: var(--ink); }
.lm-enlace-texto { display: grid; gap: 4px; min-width: 0; }
.lm-enlace-flecha { color: var(--gray); transition: transform 200ms var(--ease-out), color 150ms ease; }
.lm-enlace--ico:active { transform: scale(.985); }
@media (hover: hover) and (pointer: fine) {
  .lm-enlace--ico:hover { background: var(--bg-alt); }
  .lm-enlace--ico:hover .lm-enlace-ico { background: var(--elev); border-color: var(--hair-strong); }
  .lm-enlace--ico:hover .lm-enlace-ico .lm-ico { transform: scale(1.1) rotate(-6deg); }
  .lm-enlace--ico:hover .lm-enlace-flecha { transform: translateX(4px); color: var(--ink); }
}
.lm-enlaces > .lm-enlace { animation: lm-entrar 320ms var(--ease-out) backwards; }
.lm-enlaces > .lm-enlace:nth-child(2) { animation-delay: 30ms; }
.lm-enlaces > .lm-enlace:nth-child(3) { animation-delay: 60ms; }
.lm-enlaces > .lm-enlace:nth-child(4) { animation-delay: 90ms; }
.lm-enlaces > .lm-enlace:nth-child(5) { animation-delay: 120ms; }
.lm-enlaces > .lm-enlace:nth-child(6) { animation-delay: 150ms; }
.lm-enlaces > .lm-enlace:nth-child(7) { animation-delay: 180ms; }
.lm-enlaces > .lm-enlace:nth-child(n+8) { animation-delay: 210ms; }
.lm-enlace[hidden], .lm-enlaces[hidden], .lm-grupo-titulo[hidden] { display: none; }

/* estados vacíos y secciones en obras: dibujo que se traza */
.lm-vacio-dibujo { width: 150px; height: auto; margin-bottom: 4px; stroke: var(--ink-muted); stroke-width: 1.5; }
.lm-vacio-dibujo .lm-trazo { --largo: 400; stroke-dasharray: 400; animation: lm-trazar 900ms var(--ease-out) both; }
.lm-vacio-dibujo .lm-trazo--tarde { stroke: var(--gray); animation-delay: 350ms; }
.lm-vacio-lapiz { stroke: var(--ink); fill: var(--elev); transform-box: fill-box; transform-origin: 0 100%; animation: lm-entrar 300ms var(--ease-out) 700ms backwards, lm-escribir 1.6s ease-in-out 1s 3; }
.lm-vacio-carga { stroke: var(--ink); fill: var(--bg-alt); animation: lm-izar 2.4s ease-in-out 900ms 3; }

/* cuadro de mando: gráficas que crecen, anillo que se llena, barras de ranking */
.ce-grafica rect { transform-box: fill-box; transform-origin: 50% 100%; animation: lm-crecer-y 700ms var(--ease-out) both; }
.ce-grafica polyline { --largo: 2000; stroke-dasharray: 2000; animation: lm-trazar 1200ms var(--ease-out) both; }
.ce-avance { animation: lm-anillo 1000ms var(--ease-out) both; }
.ce-barra > span { display: block; transform-origin: 0 50%; animation: lm-crecer-x 700ms var(--ease-out) 150ms both; }

/* tablas: las primeras filas entran escalonadas */
.tm-data tbody tr { animation: lm-entrar 260ms var(--ease-out) backwards; }
.tm-data tbody tr:nth-child(2) { animation-delay: 20ms; }
.tm-data tbody tr:nth-child(3) { animation-delay: 40ms; }
.tm-data tbody tr:nth-child(4) { animation-delay: 60ms; }
.tm-data tbody tr:nth-child(5) { animation-delay: 80ms; }
.tm-data tbody tr:nth-child(6) { animation-delay: 100ms; }
.tm-data tbody tr:nth-child(n+7) { animation-delay: 120ms; }

@media (max-width: 760px) {
  .lm-portada { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lm-dibujo { order: -1; justify-self: start; max-width: 180px; }
  .lm-filtro { max-width: none; min-height: 44px; }
  .lm-enlace--ico { min-height: 64px; }
}
@media print {
  .lm-dibujo, .lm-filtro, .lm-vacio-dibujo, .lm-ico { display: none; }
  .ws-main > *, .tm-data tbody tr { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lm-vacio-lapiz, .lm-vacio-carga, .lm-dibujo-sello { animation: none; }
  .lm-ico, .lm-enlace-flecha, .lm-enlace--ico { transition: color 150ms ease, background-color 150ms ease; }
}
