@charset "UTF-8";
/* ═══════════════════════════════════════════════════════
   Tema generado con SA-Diseñador.
   Sustituye con esto el bloque :root de la hoja de tema del sistema.
   ═══════════════════════════════════════════════════════ */
:root,
.ui {
  color-scheme: dark;
  /* Superficies */
  --bg: #101214;
  --surface: #171a1a;
  --surface-2: #212627;
  --surface-3: #2d3335;
  --line: #2d3335;
  --line-strong: #454d52;
  /* Tinta */
  --ink: #eeebe4;
  --ink-dim: #9ea7a0;
  --ink-faint: #727c76;
  /* Acento */
  --accent: #a7c080;
  --accent-strong: #478c58;
  --accent-ink: #000000;
  /* Semáforo (estado) */
  --ok: #5aac6e;
  --warn: #c79637;
  --danger: #e67f80;
  --info: #5da99f;
  --ok-bg: rgba(90, 172, 110, 0.12);
  --warn-bg: rgba(199, 150, 55, 0.12);
  --danger-bg: rgba(230, 127, 128, 0.14);
  --info-bg: rgba(93, 169, 159, 0.12);
  /* Tipografía · familias */
  --font-display: 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  /* Tipografía · tamaños */
  --fs-base: 14px;
  --fs-title-lg: 25px;
  --fs-title: 17px;
  --fs-body: 14px;
  --fs-label: 11px;
  --fs-mono: 13px;
  --fs-stat: 30px;
  --fs-table: 14px;
  --fs-badge: 11px;
  /* Tipografía · ritmo */
  --lh-body: 1.68;
  --lh-tight: 1.25;
  --ls-title: 0em;
  --heading-weight: 600;
  --heading-transform: none;
  /* Forma y disposición */
  --border-width: 1px;
  --radius: 8px;
  --cols: 2;
  --gap: 19px;
  --panel-pad: 19px;
  --para-space: 16px;
  --panel-style: card;
  /* Layout del sistema */
  --kind: webapp;
  --layout: sidebar;
  --nav-w: 240px;
  --nav-w-min: 56px;
  --content-max: 1300px;
  --density: 1.05;
  /* Mapa */
  --map-style: mapbox://styles/mapbox/dark-v11;
  /* Escalas */
  --radius-xs: 4px;
  --radius-sm: 5px;
  --radius-md: 8px;
  --radius-lg: 13px;
  --radius-pill: 999px;
  --space-1: 5px;
  --space-2: 9px;
  --space-3: 14px;
  --space-4: 20px;
  --space-5: 29px;
  --space-6: 42px;
  --content-pad: 25px;
  --topbar-h: 56px;
  --btn-h: 36px;
  --input-h: 38px;
  --row-h: 44px;
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 700;
  --ls-caps: 0.07em;
  /* Interacción y elevación */
  --focus-offset: 2px;
  --shadow-strength: 0.4;
  --tint-border-alpha: 0.32;
  --blur-chrome: 0px;
  --chrome-alpha: 1;
  --tab-indicator-h: 2px;
  --nav-active-bar-w: 0px;
  --page-mesh: radial-gradient(920px 540px at 80% -10%, rgba(167,192,128,0.10), transparent 60%), radial-gradient(680px 420px at 8% 112%, rgba(127,187,179,0.08), transparent 58%);
  --gradient-brand: linear-gradient(135deg, #a7c080 0%, #83c092 60%, #7fbbb3 100%);
  /* Movimiento */
  --anim-enter: aparecer;
  --anim-enter-dur: 400ms;
  --anim-stagger: 45ms;
  --hover-lift: 2px;
  --dur-fast: 150ms;
  --dur-base: 250ms;
  --dur-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-emphasis: cubic-bezier(0.25, 0.1, 0.25, 1);
  /* Fondo animado */
  --bg-anim: ondas;
  --bg-anim-speed: 0.5;
  --bg-anim-density: 1;
  --bg-anim-opacity: 0.16;
  --bg-anim-scale: 1;
  /* Capas y puntos de quiebre */
  --z-sticky: 100;
  --z-drawer: 200;
  --z-dropdown: 300;
  --z-modal: 400;
  --z-toast: 500;
  --z-tooltip: 600;
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --dash-cols: 4;
  /* Derivados de la marca */
  --brand-h: 82;
  --brand-s: 34%;
  --brand-l: 39%;
  --rgb-accent: 107, 132, 65;
  --rgb-ok: 90, 172, 110;
  --rgb-warn: 199, 150, 55;
  --rgb-danger: 230, 127, 128;
  --rgb-info: 93, 169, 159;
  --rgb-ink: 238, 235, 228;
  --rgb-surface: 23, 26, 26;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, calc(var(--shadow-strength) * 0.5));
  --shadow-md: 0 6px 18px rgba(0, 0, 0, calc(var(--shadow-strength) * 0.7));
  --shadow-lg: 0 16px 42px rgba(0, 0, 0, calc(var(--shadow-strength) * 1));
  --focus-width: 2px;
  --shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  --overlay: #000000;
  --overlay-alpha: 0.58;
  --alert-tint: 0.12;
  --progress-h: 6px;
  --scroll-size: 10px;
  /* Componentes · en Auto heredan del token global */
  --fw-title-lg: 600;
  --fw-title: 600;
  --fw-body: 400;
  --fw-label: 500;
  --fw-stat: 600;
  --fw-table-head: 600;
  --fw-table: 400;
  --fw-btn: 500;
  --fw-nav: 500;
  --fw-badge: 500;
  --fw-mono: 400;
  --accent-soft: color-mix(in srgb, var(--accent) calc(var(--alert-tint) * 100%), var(--surface));
  --ok-soft: color-mix(in srgb, var(--ok) calc(var(--alert-tint) * 100%), var(--surface));
  --warn-soft: color-mix(in srgb, var(--warn) calc(var(--alert-tint) * 100%), var(--surface));
  --danger-soft: color-mix(in srgb, var(--danger) calc(var(--alert-tint) * 100%), var(--surface));
  --info-soft: color-mix(in srgb, var(--info) calc(var(--alert-tint) * 100%), var(--surface));
  --surface-inset: var(--bg);
  --ink-strong: var(--ink);
  --link: #4e9288;
  --link-hover: #478c58;
  --focus-ring: #a7c080;
  --topbar-bg: #171a1a;
  --topbar-accent: #a7c080;
  --panel-bg: #171a1a;
  --panel-border: #2d3335;
  --panel-border-width: var(--border-width);
  --panel-radius: 10px;
  --panel-tick: var(--accent);
  --btn-radius: 8px;
  --btn-border-width: 1px;
  --btn-primary-bg: #a7c080;
  --btn-primary-ink: #000000;
  --btn-primary-border: var(--accent);
  --btn-bg: #212627;
  --btn-ink: #eeebe4;
  --btn-border: #454d52;
  --input-bg: #101214;
  --input-border: #454d52;
  --input-border-width: var(--border-width);
  --input-radius: 8px;
  --input-focus: var(--accent);
  --badge-radius: 999px;
  --stat-accent: #a7c080;
  --nav-bg: #101214;
  --nav-ink: #9ea7a0;
  --nav-active-bg: #212627;
  --nav-active-ink: #a48b55;
  --nav-radius: var(--radius-sm);
  --tab-ink: var(--ink-dim);
  --tab-active-ink: #eeebe4;
  --tab-indicator: #a7c080;
  --alert-radius: var(--radius-md);
  --control-accent: var(--accent);
  --control-bg: var(--surface-3);
  --control-radius: var(--radius-xs);
  --menu-bg: var(--surface-2);
  --menu-ink: var(--ink);
  --menu-active-bg: var(--surface-3);
  --menu-radius: var(--radius-md);
  --tooltip-bg: #2d3335;
  --tooltip-ink: #eeebe4;
  --tooltip-radius: var(--radius-sm);
  --dialog-bg: #171a1a;
  --dialog-border: #454d52;
  --dialog-radius: var(--radius-lg);
  --progress-track: #212627;
  --progress-fill: #a7c080;
  --page-active-bg: var(--accent);
  --page-active-ink: var(--accent-ink);
  --page-radius: var(--radius-sm);
  --chip-bg: #212627;
  --chip-ink: #9ea7a0;
  --chip-radius: 999px;
  --avatar-bg: var(--accent);
  --avatar-ink: var(--accent-ink);
  --avatar-radius: var(--radius-pill);
  --scroll-track: #101214;
  --scroll-thumb: #454d52;
  --map-land: var(--bg);
  --map-water: var(--surface-2);
  --map-road: var(--line-strong);
  --map-building: var(--surface-3);
  --map-label: var(--ink-dim);
  --map-marker-stroke: var(--bg);
  --map-popup-bg: var(--surface);
  --map-popup-ink: var(--ink);
  --map-popup-border: var(--line-strong);
  --map-ctrl-bg: var(--surface);
  --map-ctrl-ink: var(--ink);
}
/* ═══════════════════════════════════════════════════════
   Tema claro · Everforest Light.
   El theme.css original se exportó sin el tema contrario; este bloque
   lo completa. ui.js fija data-theme en <html> (botón ◐ y preferencia
   del sistema) y aquí se materializa. Solo cambian los valores de color:
   los componentes (framework.css) no se tocan.
   ═══════════════════════════════════════════════════════ */
:root[data-theme="light"],
[data-theme="light"] .ui {
  color-scheme: light;
  /* Superficies */
  --bg: #efebd4;
  --surface: #fdf6e3;
  --surface-2: #f4f0d9;
  --surface-3: #e6e2cc;
  --line: #e0dcc7;
  --line-strong: #bdc3af;
  /* Tinta */
  --ink: #5c6a72;
  --ink-dim: #7d8b84;
  --ink-faint: #a6b0a0;
  /* Acento */
  --accent: #8da101;
  --accent-strong: #708d00;
  --accent-ink: #000000;
  /* Semáforo (estado): versiones oscurecidas, legibles sobre crema */
  --ok: #35793f;
  --warn: #8f5f00;
  --danger: #c03a3c;
  --info: #256e66;
  --ok-bg: rgba(53, 121, 63, 0.12);
  --warn-bg: rgba(143, 95, 0, 0.12);
  --danger-bg: rgba(192, 58, 60, 0.12);
  --info-bg: rgba(37, 110, 102, 0.12);
  /* Fondo y elevación */
  --page-mesh: radial-gradient(920px 540px at 80% -10%, rgba(141, 161, 1, 0.10), transparent 60%), radial-gradient(680px 420px at 8% 112%, rgba(53, 167, 124, 0.08), transparent 58%);
  --shadow: 0 8px 24px rgba(92, 106, 114, 0.18);
  --shadow-strength: 0.14;
  --overlay: #3a464c;
  /* Componentes */
  --link: #256e66;
  --link-hover: #1d5a54;
  --focus-ring: #708d00;
  --topbar-bg: #fdf6e3;
  --topbar-accent: #708d00;
  --panel-bg: #fdf6e3;
  --panel-border: #e0dcc7;
  --btn-primary-bg: #a7c080;
  --btn-primary-ink: #000000;
  --btn-bg: #f4f0d9;
  --btn-ink: #5c6a72;
  --btn-border: #bdc3af;
  --input-bg: #fffbef;
  --input-border: #bdc3af;
  --stat-accent: #708d00;
  --nav-bg: #f4f0d9;
  --nav-ink: #667680;
  --nav-active-bg: #e6e2cc;
  --nav-active-ink: #8a6d2f;
  --tab-active-ink: #3a464c;
  --tab-indicator: #708d00;
  --tooltip-bg: #3a464c;
  --tooltip-ink: #fdf6e3;
  --dialog-bg: #fdf6e3;
  --dialog-border: #bdc3af;
  --progress-track: #e6e2cc;
  --progress-fill: #8da101;
  --chip-bg: #e6e2cc;
  --chip-ink: #667680;
  --scroll-track: #efebd4;
  --scroll-thumb: #bdc3af;
}