/* ================================================================
   MAQUINADOS GUERA — Sistema de Diseno v3.0
   Titulos: Baloo Bhaijaan 2 · Texto: Commissioner
   Paleta: Shadow Grey / Tomato Jam / Tropical Teal / Vanilla Custard / Linen
   El layout usa utilidades de Tailwind y componentes propios
   (card-clean, table-clean, btn-*, badge-status, input-minimal).
   Interactividad con Alpine.js (sidebar/logo/toast/modales) + AOS.
   Iconos con Lucide.
   ================================================================ */

:root {
    --shadow-grey-50:#f3f1f2; --shadow-grey-100:#e7e4e5; --shadow-grey-200:#cfc9ca; --shadow-grey-300:#b7aeb0;
    --shadow-grey-400:#9f9396; --shadow-grey-500:#87787c; --shadow-grey-600:#6c6063; --shadow-grey-700:#51484a;
    --shadow-grey-800:#363031; --shadow-grey-900:#1b1819; --shadow-grey-950:#131111;
    --tomato-jam-50:#faedeb; --tomato-jam-100:#f5dbd6; --tomato-jam-200:#eab7ae; --tomato-jam-300:#e09385;
    --tomato-jam-400:#d56f5d; --tomato-jam-500:#cb4b34; --tomato-jam-600:#a23c2a; --tomato-jam-700:#7a2d1f;
    --tomato-jam-800:#511e15; --tomato-jam-900:#290f0a; --tomato-jam-950:#1c0a07;
    --tropical-teal-50:#eef6f7; --tropical-teal-100:#dcedef; --tropical-teal-200:#badcde; --tropical-teal-300:#97cace;
    --tropical-teal-400:#74b9be; --tropical-teal-500:#52a7ad; --tropical-teal-600:#41868b; --tropical-teal-700:#316468;
    --tropical-teal-800:#214345; --tropical-teal-900:#102123; --tropical-teal-950:#0b1718;
    --vanilla-custard-50:#fcf7e8; --vanilla-custard-100:#f9efd2; --vanilla-custard-200:#f3e0a5; --vanilla-custard-300:#edd078;
    --vanilla-custard-400:#e8c04a; --vanilla-custard-500:#e2b11d; --vanilla-custard-600:#b58d17; --vanilla-custard-700:#876a12;
    --linen-50:#f7f2ee; --linen-100:#efe6dc; --linen-200:#deccba; --linen-300:#ceb397; --linen-400:#be9974;
    --linen-500:#ad8052; --linen-600:#8b6641; --linen-700:#684d31; --linen-800:#453321; --linen-900:#231a10; --linen-950:#18120b;

    /* Alias de compatibilidad: permiten migrar las vistas sin alterar expresiones Thymeleaf. */
    --graphite-50:var(--shadow-grey-50); --graphite-100:var(--shadow-grey-100); --graphite-200:var(--shadow-grey-200); --graphite-300:var(--shadow-grey-300);
    --graphite-400:var(--shadow-grey-400); --graphite-500:var(--shadow-grey-500); --graphite-600:var(--shadow-grey-600); --graphite-700:var(--shadow-grey-700);
    --graphite-800:var(--shadow-grey-800); --graphite-900:var(--shadow-grey-900); --graphite-950:var(--shadow-grey-950);
    --khaki-50:var(--tropical-teal-50); --khaki-100:var(--tropical-teal-100); --khaki-500:var(--tropical-teal-500); --khaki-700:var(--tropical-teal-700); --khaki-950:var(--tropical-teal-950);
    --amber-50:var(--tomato-jam-50); --amber-100:var(--tomato-jam-100); --amber-300:var(--tomato-jam-300); --amber-400:var(--tomato-jam-400); --amber-500:var(--tomato-jam-500); --amber-600:var(--tomato-jam-600); --amber-700:var(--tomato-jam-700);
    --glow-300:var(--vanilla-custard-300); --glow-400:var(--vanilla-custard-400); --glow-500:var(--vanilla-custard-500); --glow-600:var(--vanilla-custard-600);

    /* Alias --color-*: los componentes del rediseno usan var(--color-<paleta>-<tono>),
       pero la paleta real se define sin ese prefijo. Estos alias evitan tocar ~85
       sitios en las vistas y previenen que las barras de avance/tarjetas queden
       transparentes. (Correccion Fase 1 del plan V4.1.) */
    --color-shadow-grey-50:var(--shadow-grey-50); --color-shadow-grey-100:var(--shadow-grey-100); --color-shadow-grey-200:var(--shadow-grey-200); --color-shadow-grey-300:var(--shadow-grey-300);
    --color-shadow-grey-400:var(--shadow-grey-400); --color-shadow-grey-500:var(--shadow-grey-500); --color-shadow-grey-600:var(--shadow-grey-600); --color-shadow-grey-700:var(--shadow-grey-700);
    --color-shadow-grey-800:var(--shadow-grey-800); --color-shadow-grey-900:var(--shadow-grey-900); --color-shadow-grey-950:var(--shadow-grey-950);
    --color-tomato-jam-50:var(--tomato-jam-50); --color-tomato-jam-100:var(--tomato-jam-100); --color-tomato-jam-200:var(--tomato-jam-200); --color-tomato-jam-300:var(--tomato-jam-300);
    --color-tomato-jam-400:var(--tomato-jam-400); --color-tomato-jam-500:var(--tomato-jam-500); --color-tomato-jam-600:var(--tomato-jam-600); --color-tomato-jam-700:var(--tomato-jam-700);
    --color-tomato-jam-800:var(--tomato-jam-800); --color-tomato-jam-900:var(--tomato-jam-900); --color-tomato-jam-950:var(--tomato-jam-950);
    --color-tropical-teal-50:var(--tropical-teal-50); --color-tropical-teal-100:var(--tropical-teal-100); --color-tropical-teal-200:var(--tropical-teal-200); --color-tropical-teal-300:var(--tropical-teal-300);
    --color-tropical-teal-400:var(--tropical-teal-400); --color-tropical-teal-500:var(--tropical-teal-500); --color-tropical-teal-600:var(--tropical-teal-600); --color-tropical-teal-700:var(--tropical-teal-700);
    --color-tropical-teal-800:var(--tropical-teal-800); --color-tropical-teal-900:var(--tropical-teal-900); --color-tropical-teal-950:var(--tropical-teal-950);
    --color-vanilla-custard-50:var(--vanilla-custard-50); --color-vanilla-custard-100:var(--vanilla-custard-100); --color-vanilla-custard-200:var(--vanilla-custard-200); --color-vanilla-custard-300:var(--vanilla-custard-300);
    --color-vanilla-custard-400:var(--vanilla-custard-400); --color-vanilla-custard-500:var(--vanilla-custard-500); --color-vanilla-custard-600:var(--vanilla-custard-600); --color-vanilla-custard-700:var(--vanilla-custard-700); --color-vanilla-custard-800:var(--vanilla-custard-700);
    --color-linen-50:var(--linen-50); --color-linen-100:var(--linen-100); --color-linen-200:var(--linen-200); --color-linen-300:var(--linen-300);
    --color-linen-400:var(--linen-400); --color-linen-500:var(--linen-500); --color-linen-600:var(--linen-600); --color-linen-700:var(--linen-700);

    --bg-page: var(--linen-50);
    --bg-card: rgba(255,255,255,0.94);
    --bg-soft: var(--linen-50);
    --text-main: var(--shadow-grey-900);
    --text-dark: var(--shadow-grey-900);
    --text-muted: var(--shadow-grey-500);
    --accent-blue: var(--tomato-jam-600);
    --accent-blue-dark: var(--tomato-jam-700);
    --accent-gold: var(--vanilla-custard-500);
    --border-light: var(--shadow-grey-100);
    --shadow-soft: 0 1px 2px rgba(27,24,25,0.04), 0 14px 36px rgba(27,24,25,0.055);
    --shadow-lifted: 0 20px 50px rgba(27,24,25,0.12);
    --font-family: 'Commissioner', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-display: 'Baloo Bhaijaan 2', 'Commissioner', sans-serif;
    --radius-card: 1.1rem;
}

/* ======================== BASE ======================== */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

/* Alpine: oculta los elementos con x-cloak hasta que Alpine arranca y evalua sus
   condiciones. Estaba en un <style> inline dentro de base.html; se movio aqui al
   retirar 'unsafe-inline' de la CSP. */
[x-cloak] { display: none !important; }

/* ---------------------------------------------------------------------------
   Cambio de tema claro <-> oscuro: sin arrastre.

   La hoja tiene ~70 reglas con `transition` sobre color, background y border.
   Al voltear data-theme, TODAS se disparan a la vez: cada tarjeta, boton, fila
   de tabla e icono anima su color por su cuenta durante 200-350 ms. Con una
   pantalla llena (dashboard, tabla de facturacion) el navegador recalcula y
   repinta cientos de elementos en paralelo, y el cambio se percibe lento y
   sucio, como un degradado que se arrastra.

   Durante el cambio se anulan transiciones y animaciones para que los colores
   nuevos aparezcan de golpe; lo unico que se anima es el barrido circular de la
   View Transition, que es intencional. mg-theme.js pone y quita esta clase.
   --------------------------------------------------------------------------- */
html.mg-theme-switching,
html.mg-theme-switching *,
html.mg-theme-switching *::before,
html.mg-theme-switching *::after {
    transition: none !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
}

body {
    background: radial-gradient(circle at 5% 0%, rgba(82,167,173,0.10), transparent 28rem), linear-gradient(180deg, var(--linen-50) 0%, #fff 28rem);
    color: var(--text-main);
    font-family: var(--font-family);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.025em; line-height: 1.08; color: var(--text-dark); }
p { line-height: 1.65; }
button, input, select, textarea { font: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(82,167,173,0.35); outline-offset: 2px; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; height: auto; }
::selection { background: var(--vanilla-custard-300); color: var(--shadow-grey-950); }

/* [data-aos] visibility se define en aos.css (CDN); no requiere reglas extra aqui */

/* ======================== BOTONES ======================== */
.btn-sm { padding: 0.35rem 0.8rem; font-size: 0.82rem; }

/* ======================== TARJETAS ======================== */
/* ======================== TABLAS ======================== */
.table-clean {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0;
    font-size: 0.85rem;
}
.table-clean th {
    background: var(--tropical-teal-50);
    padding: 12px;
    text-align: left;
    font-size: 0.7rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.075em;
    font-weight: 600;
}
.table-clean td {
    padding: 14px 12px;
    border-bottom: 1px solid var(--border-light);
}
.table-clean tbody tr:hover { background: rgba(238,246,247,0.72); }

/* ======================== STATUS BADGES ======================== */
.badge-status {
    padding: 4px 12px;
    border-radius: 9999px;
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    display: inline-block;
}
.st-cotizada, .badge-status.cotizada { background: var(--graphite-100); color: var(--graphite-700); }
.st-pendiente, .badge-status.pendiente { background: var(--vanilla-custard-100); color: var(--vanilla-custard-700); }
.st-maquinado, .badge-status.maquinado { background: var(--khaki-100); color: var(--khaki-700); }
.st-terminada, .badge-status.terminada { background: var(--graphite-800); color: #fff; }

/* ======================== INPUTS ======================== */
.input-minimal {
    width: 100%;
    padding: 0.55rem 1rem;
    background-color: #ffffff;
    border: 1px solid var(--border-light);
    border-radius: 0.7rem;
    font-size: 0.85rem;
    font-family: var(--font-family);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    outline: none;
}
.input-minimal:hover { border-color: var(--shadow-grey-300); }
.input-minimal:focus { border-color: var(--tropical-teal-500); box-shadow: 0 0 0 3px rgba(82,167,173,0.15); }

/* ======================== LOADING ANIMATION ======================== */
.loading-animation {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--graphite-950);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    transition: opacity 0.5s ease;
    gap: 12px;
}
.loading-animation.hidden { opacity: 0; pointer-events: none; }
.loading-animation p { color: var(--glow-400); font-size: 0.8rem; margin-top: 16px; letter-spacing: 0.15em; text-transform: uppercase; font-weight: 500; }

.cnc-part {
    width: 40px;
    height: 40px;
    border: 3px solid rgba(255,167,51,0.2);
    border-top-color: var(--glow-400);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
.cnc-part:nth-child(2) { animation-delay: 0.15s; width: 32px; height: 32px; }
.cnc-part:nth-child(3) { animation-delay: 0.3s; width: 24px; height: 24px; }

@keyframes spin { to { transform: rotate(360deg); } }

/* ======================== TOAST ======================== */
.toast {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: var(--khaki-950);
    color: #fff;
    padding: 12px 24px;
    border-radius: 30px;
    font-size: 0.9rem;
    opacity: 0;
    transition: opacity 0.3s, transform 0.3s;
    z-index: 1060;
    pointer-events: none;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast.ok { background: var(--amber-600); }
.toast.err { background: #c0392b; }
.toast.info { background: var(--glow-500); color: var(--text-main); }

/* ================================================================
   NAVBAR SUPERIOR — Logo animado MG <-> Engrane
   ================================================================ */
.site-header {
    background: rgba(19,17,17,0.96);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 1050;
    box-shadow: 0 8px 30px rgba(19,17,17,0.18);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(255,255,255,0.06);
}
.site-header .nav-link {
    font-size: 0.9rem;
    font-weight: 500;
    padding: 0.5rem 0.9rem !important;
    transition: all 0.2s ease;
    color: rgba(255,255,255,0.65) !important;
    border-radius: 0.5rem;
}
.site-header .nav-link:hover, .site-header .nav-link.show { color: #fff !important; background: rgba(255,255,255,0.06); }
.site-header .dropdown-menu { border: none; box-shadow: 0 12px 30px rgba(0,0,0,0.35); border-radius: 0.75rem; padding: 0.4rem; }
.site-header .dropdown-item { font-size: 0.88rem; padding: 0.5rem 0.9rem; border-radius: 0.5rem; }
.site-header .dropdown-item:hover, .site-header .dropdown-item:focus { background: var(--amber-50); color: var(--amber-700); }
.site-public-nav { align-items:center; justify-content:center; gap:.1rem; margin-inline:auto; }
.site-public-nav a,
.site-access-link {
    display:inline-flex;
    align-items:center;
    min-height:2.25rem;
    padding:.45rem .72rem;
    color:rgba(255,255,255,.82);
    border:1px solid transparent;
    border-radius:9999px;
    font-size:.72rem;
    font-weight:600;
    letter-spacing:.01em;
    transition:color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.site-public-nav a:hover,
.site-public-nav a:focus-visible,
.site-access-link:hover,
.site-access-link:focus-visible {
    color:#fff;
    background:rgba(255,255,255,.1);
    border-color:rgba(255,255,255,.34);
    transform:translateY(-1px);
}
.site-access-link { color:#fff; border-color:rgba(255,255,255,.5); padding-inline:1rem; }

.user-info { display: flex; align-items: center; gap: 10px; color: #ccc; font-size: 0.85rem; }
.role-badge { background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.25); padding:3px 10px; border-radius:9999px; font-size:.64rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; }

.logo-container {
    position: relative;
    width: 44px;
    height: 44px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    z-index: 60;
    border-radius: 0.6rem;
    transition: background 0.2s ease;
}
.logo-container:hover { background: rgba(255,255,255,0.06); }
.logo-text {
    font-size: 1.35rem;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.5px;
    transition: opacity 0.3s ease, transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
    position: absolute;
    line-height: 1;
}
.logo-text span { color:#fff; }
.logo-gear {
    position: absolute;
    width: 32px;
    height: 32px;
    opacity: 0;
    transform: scale(0.3) rotate(0deg);
    transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.34,1.56,0.64,1);
    fill: none;
    stroke:#fff;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.logo-container.active .logo-text { opacity: 0; transform: scale(0.3) rotate(180deg); }
.logo-container.active .logo-gear { opacity: 1; transform: scale(1) rotate(0deg); animation: gear-spin 3s linear infinite; }
@keyframes gear-spin { from { transform: scale(1) rotate(0deg); } to { transform: scale(1) rotate(360deg); } }

/* Sidebar lateral */
.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    background: linear-gradient(180deg, rgba(11,23,24,0.99) 0%, rgba(19,17,17,0.995) 100%);
    backdrop-filter: blur(20px);
    border-right: 1px solid rgba(116,185,190,0.20);
    box-shadow: 5px 0 30px rgba(0,0,0,0.5);
    z-index: 1055;
    transform: translateX(-100%);
    transition: transform 0.4s cubic-bezier(0.22,1,0.36,1);
    padding: 1.4rem 1.1rem;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}
.sidebar.open { transform: translateX(0); }
.sidebar-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,0.1); }
.sidebar-header h2 { color: #fff; font-size: 1.1rem; font-weight: 600; margin: 0; }
.close-sidebar-btn { background: none; border: none; color: rgba(255,255,255,0.6); font-size: 1.4rem; cursor: pointer; transition: color 0.2s; padding: 0.2rem; line-height: 1; }
.close-sidebar-btn:hover { color: #fff; }
.sidebar-link {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 0.9rem;
    color: rgba(255,255,255,0.75);
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 0.7rem;
    transition: all 0.2s ease;
    margin-bottom: 0.2rem;
}
.sidebar-link:hover { background: rgba(82,167,173,0.16); color: #fff; transform: translateX(2px); }
.sidebar-link.active-link { color: var(--vanilla-custard-400); background: rgba(82,167,173,0.12); font-weight: 600; }
.sidebar-section-title { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.09em; color: rgba(255,255,255,0.32); padding: 0.5rem 0.9rem; margin-top: 0.6rem; }
.sidebar-eyebrow { display:block; color:var(--tropical-teal-300); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; margin-bottom:.2rem; }
.sidebar-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); backdrop-filter: blur(3px); z-index: 1054; transition: opacity 0.3s ease; }
@media (max-width: 640px) { .sidebar { width: 260px; } }

/* ======================== DASHBOARD ======================== */
.dashboard-container { min-height: 100vh; }

.dashboard-header {
    background: var(--khaki-950);
    color: #fff;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 1050;
}

.dashboard-nav ul { list-style: none; display: flex; gap: 6px; margin: 0; padding: 0; }
.dashboard-nav a {
    color: var(--glow-400);
    border: 1px solid var(--glow-400);
    padding: 5px 14px;
    border-radius: 9999px;
    font-size: 0.85rem;
    font-weight: 500;
    transition: all 0.2s;
}
.dashboard-nav a:hover { background: var(--glow-400); color: var(--graphite-900); }

.dashboard-content { padding: 2rem; max-width: 1200px; margin: 0 auto; }

.content-section { display: none; animation: fadeIn 0.4s ease-out; }
.content-section.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.ot-widget { margin-bottom: 20px; }
.ot-widget .header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.ot-widget .title { margin: 0; font-size: 1.3rem; }
.ot-widget .last-update { font-size: 0.8rem; color: var(--text-muted); }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 20px; }
.stat-card { background: var(--bg-card); border: 1px solid var(--border-light); border-radius: 0.75rem; padding: 16px; text-align: center; box-shadow: var(--shadow-soft); }
.stat-label { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.stat-value { font-size: 1.8rem; font-weight: 700; color: var(--text-dark); margin-top: 4px; }

.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.toolbar .filter-group, .toolbar .search-group { display: flex; align-items: center; gap: 6px; }
.toolbar label { font-size: 0.85rem; color: var(--text-muted); }
.toolbar input, .toolbar select { padding: 6px 10px; border: 1px solid var(--border-light); border-radius: 0.5rem; font-family: var(--font-family); font-size: 0.85rem; }
.toolbar input:focus, .toolbar select:focus { outline: none; border-color: var(--accent-blue); }

/* ======================== PORTAL — HERO ======================== */
.hero { display:flex; align-items:center; gap:4rem; padding:5.5rem 1.5rem; max-width:80rem; margin:0 auto; min-height:72vh; }
.hero-content { flex: 1; }
.hero-content .section-title { color:var(--tomato-jam-700); font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em; margin-bottom:1rem; display:inline-block; background:var(--tomato-jam-50); padding:.45rem 1rem; border-radius:9999px; }
.hero-content h1 { font-size:clamp(3rem, 6vw, 5.4rem); font-weight:600; line-height:.93; margin:0 0 1.25rem; max-width:12ch; }
.hero-highlight { color:var(--tomato-jam-600); position:relative; display:inline-block; }
.hero-highlight::after { content: ''; position: absolute; bottom: -2px; left: 0; width: 100%; height: 6px; background: var(--glow-400); border-radius: 3px; opacity: 0.45; }
.hero-content p { font-size:1.05rem; color:var(--shadow-grey-600); max-width:36rem; line-height:1.7; margin-bottom:1.5rem; }
.hero-image-wrapper { flex:1; display:flex; justify-content:center; padding:1rem; border:1px solid var(--shadow-grey-900); border-radius:1.4rem; background:linear-gradient(145deg,var(--tropical-teal-100),var(--vanilla-custard-50)); box-shadow:var(--shadow-lifted); }
.hero-img { max-width:420px; border-radius:1rem; }

/* ======================== PORTAL — HISTORIA INTERACTIVA ======================== */
.about-us { width:100%; max-width:80rem; margin:0 auto; padding:5rem 1.5rem; }
.history-heading { max-width:46rem; margin:0 auto 1.5rem; text-align:center; }
.history-eyebrow { display:inline-block; margin-bottom:.55rem; color:var(--tomato-jam-600); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.history-heading h2 { margin:0; font-size:clamp(2.5rem,5vw,4.2rem); text-transform:none; }
.history-heading p { margin:.75rem auto 0; color:var(--shadow-grey-600); max-width:38rem; }
.history-experience { height:31rem; display:grid; grid-template-columns:minmax(12rem,15rem) minmax(0,1fr); overflow:hidden; background:var(--shadow-grey-950); border:1px solid var(--shadow-grey-800); border-radius:1.5rem; box-shadow:var(--shadow-lifted); contain:layout paint; }
.history-years { position:relative; z-index:3; display:flex; flex-direction:column; justify-content:center; gap:.55rem; padding:1.5rem; background:rgba(255,255,255,.035); border-right:1px solid rgba(255,255,255,.1); }
.history-years button { width:100%; display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:.85rem 1rem; color:rgba(255,255,255,.48); text-align:left; background:transparent; border:1px solid transparent; border-radius:.85rem; cursor:pointer; transition:color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease; }
.history-years button span { font-family:var(--font-display); font-size:1.45rem; line-height:1; }
.history-years button small { font-size:.66rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
.history-years button:hover { color:#fff; background:rgba(255,255,255,.06); transform:translateX(3px); }
.history-years button.is-active { color:#fff; background:var(--tomato-jam-600); border-color:var(--tomato-jam-400); box-shadow:0 12px 28px rgba(162,60,42,.28); }
.history-stage { position:relative; height:31rem; min-width:0; display:grid; grid-template-areas:"history-panel"; grid-template-rows:minmax(0,1fr); align-items:end; overflow:hidden; padding:clamp(2rem,5vw,4.5rem); }
.history-blueprint { position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.24) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.24) 1px,transparent 1px); background-size:36px 36px; mask-image:linear-gradient(to bottom,#000,transparent 90%); }
.history-gear { position:absolute; width:min(55vw,30rem); height:min(55vw,30rem); top:-10rem; right:-7rem; color:var(--tropical-teal-500); opacity:.18; animation:history-gear-spin 28s linear infinite; }
.history-panel { position:relative; z-index:2; grid-area:history-panel; width:100%; max-width:42rem; align-self:end; color:#fff; }
.history-panel-number { display:block; margin-bottom:1.5rem; color:var(--tropical-teal-300); font-size:.68rem; font-weight:700; letter-spacing:.18em; }
.history-panel strong { display:block; margin-bottom:.1rem; color:var(--vanilla-custard-400); font-family:var(--font-display); font-size:clamp(4.5rem,10vw,8rem); line-height:.72; letter-spacing:-.06em; }
.history-panel h3 { max-width:18ch; margin:1.4rem 0 .7rem; color:#fff; font-size:clamp(1.7rem,3vw,2.6rem); }
.history-panel p { max-width:38rem; margin:0; color:var(--shadow-grey-300); font-size:.94rem; line-height:1.75; }
.history-progress { position:absolute; z-index:4; left:clamp(2rem,5vw,4.5rem); right:clamp(2rem,5vw,4.5rem); bottom:1.4rem; height:3px; overflow:hidden; background:rgba(255,255,255,.14); border-radius:9999px; }
.history-progress span { display:block; height:100%; background:linear-gradient(90deg,var(--tropical-teal-400),var(--vanilla-custard-400)); border-radius:inherit; transition:width .65s cubic-bezier(.22,1,.36,1); }
@keyframes history-gear-spin { to { transform:rotate(360deg); } }

/* ======================== PORTAL — ENGRANES DE IDENTIDAD ======================== */
.mission-vision-philosophy { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; max-width:68rem; margin:0 auto; padding-block:1rem 2rem; }
.gear-feature { position:relative; min-height:19rem; display:grid; place-items:center; isolation:isolate; cursor:pointer; border-radius:1.5rem; outline:none; }
.gear-stage { position:relative; width:min(100%,16rem); aspect-ratio:1; display:grid; place-items:center; transition:opacity .35s ease, transform .45s cubic-bezier(.22,1,.36,1), filter .35s ease; }
.gear-feature-svg { width:100%; height:100%; color:var(--tropical-teal-700); filter:drop-shadow(0 14px 18px rgba(11,23,24,.14)); animation:identity-gear-spin 14s linear infinite; transform-origin:center; }
.gear-feature--reverse .gear-feature-svg { color:var(--tomato-jam-600); animation-direction:reverse; animation-duration:17s; }
.gear-feature:nth-child(3) .gear-feature-svg { color:var(--shadow-grey-700); animation-duration:20s; }
.gear-stage h3 { position:absolute; z-index:2; margin:0; color:currentColor; font-size:clamp(1.65rem,3vw,2.25rem); pointer-events:none; }
.gear-reveal { position:absolute; z-index:3; inset:50% .35rem auto; padding:1.35rem; color:var(--shadow-grey-900); text-align:center; background:rgba(255,255,255,.96); border:1px solid var(--shadow-grey-200); border-radius:1.15rem; box-shadow:var(--shadow-lifted); opacity:0; transform:translateY(-42%) scale(.88); pointer-events:none; transition:opacity .3s ease, transform .45s cubic-bezier(.22,1,.36,1); }
.gear-reveal-kicker { display:block; margin-bottom:.45rem; color:var(--tomato-jam-600); font-size:.66rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.gear-reveal p { margin:0; color:var(--shadow-grey-700); font-size:.82rem; line-height:1.62; }
.gear-feature:hover .gear-stage,
.gear-feature:focus-visible .gear-stage,
.gear-feature:focus-within .gear-stage { opacity:.16; transform:scale(.82); filter:blur(2px); }
.gear-feature:hover .gear-feature-svg,
.gear-feature:focus-visible .gear-feature-svg,
.gear-feature:focus-within .gear-feature-svg { animation-play-state:paused; }
.gear-feature:hover .gear-reveal,
.gear-feature:focus-visible .gear-reveal,
.gear-feature:focus-within .gear-reveal { opacity:1; transform:translateY(-50%) scale(1); pointer-events:auto; }
@keyframes identity-gear-spin { to { transform:rotate(360deg); } }

/* ======================== LOGIN — form-group ========================
   .services-section/.services-grid/.service-card y .contacto-form/h2 del
   diseño de portal viejo se quitaron de aqui: el markup real (index.html)
   usa la version "V4" de estas mismas clases, definida mas abajo en este
   archivo con otro layout (grid de 12 columnas en vez de flex, tarjetas con
   .service-card-top, .contact-panel/.contact-copy/.contact-map). La version
   vieja quedaba muerta por cascada (misma especificidad, gana la que
   aparece despues) - la misma clase de bug que ya se corrigio dos veces en
   .card-clean/.btn-*/.badge-status. .form-group SI sigue vivo (lo usa
   auth/login.html, no el portal), por eso se queda. */
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-weight: 500; margin-bottom: 6px; font-size: 0.9rem; color: var(--text-dark); }
.form-group input, .form-group textarea, .form-group select {
    width: 100%; padding: 10px 12px; border: 1px solid var(--border-light); border-radius: 0.6rem;
    font-family: var(--font-family); font-size: 0.95rem; transition: border-color 0.2s ease, box-shadow .2s ease;
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus {
    outline: none; border-color: var(--amber-400); box-shadow: 0 0 0 3px rgba(230,158,76,0.12);
}

/* ======================== LOGIN ======================== */
.login-container { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--bg-soft); padding: 24px; }
.login-card { background: var(--bg-card); border: 1px solid var(--border-light); border-radius: 1rem; padding: 40px; width: 100%; max-width: 420px; box-shadow: var(--shadow-soft); text-align: center; }
.login-card .logo { margin-bottom: 20px; }
.login-card .logo img { height: 60px; }
.login-card h2 { font-size: 1.3rem; margin-bottom: 24px; color: var(--text-dark); }
.login-card .form-group { text-align: left; }
.login-card .error-message { color: #c0392b; font-size: 0.85rem; margin-top: 12px; display: none; }

/* ======================== PERT-CPM ======================== */
.text-primary { color: var(--accent-blue) !important; }
.nav-tabs .nav-link.active { color: var(--accent-blue); border-bottom-color: var(--accent-blue); font-weight: 600; }
.nav-tabs .nav-link { color: var(--text-muted); }

.diagrama-placeholder { min-height: 350px; border: 2px dashed var(--graphite-200); border-radius: 0.75rem; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: var(--bg-soft); color: var(--accent-blue); }
.diagrama-placeholder i { font-size: 3rem; margin-bottom: 1rem; opacity: 0.5; }

.btn-agregar-fila { border: 2px dashed var(--accent-blue); color: var(--accent-blue); background: transparent; }
.btn-agregar-fila:hover { background-color: var(--accent-blue); color: #fff; }

.ruta-critica { background-color: #fff5f5; color: #c0392b; font-weight: 600; }
.ruta-critica td { border-left: 3px solid #c0392b; }

.calc-progress-track { height: 7px; border-radius: 4px; background-color: var(--graphite-100); }
.calc-progress-track .progress-bar { background-color: var(--accent-blue) !important; }

.fila-edicion { background-color: var(--amber-50) !important; border-top: 2px solid var(--accent-blue); border-bottom: 2px solid var(--accent-blue); }

.inline-pred-wrap { position: relative; min-width: 140px; }
.inline-pred-display { cursor: pointer; user-select: none; display: flex; align-items: center; gap: 4px; font-size: 0.85rem; min-height: 31px; padding: 4px 8px; flex-wrap: wrap; transition: border-color 0.15s; }
.inline-pred-display:hover { border-color: var(--accent-blue); }
.inline-pred-display .chevron { margin-left: auto; font-size: 0.65rem; color: #888; flex-shrink: 0; }
.inline-pred-dropdown { display: none; position: fixed; z-index: 9999; background: #fff; border: 1px solid var(--border-light); border-radius: 0.6rem; box-shadow: var(--shadow-soft); min-width: 200px; max-height: 220px; overflow-y: auto; padding: 4px 0; }
.inline-pred-dropdown.open { display: block; }
.inline-pred-option { display: flex; align-items: center; gap: 8px; padding: 6px 12px; cursor: pointer; font-size: 0.83rem; transition: background 0.1s; }
.inline-pred-option:hover { background: var(--bg-soft); }
.inline-pred-option input[type="checkbox"] { width: 14px; height: 14px; cursor: pointer; accent-color: var(--accent-blue); }
.inline-pred-empty { padding: 8px 12px; font-size: 0.82rem; color: #aaa; font-style: italic; }

.diag-zoom-panel { position: absolute; top: 12px; right: 12px; z-index: 10; display: flex; flex-direction: column; gap: 4px; background: rgba(255,255,255,0.92); border: 1px solid var(--border-light); border-radius: 0.6rem; padding: 6px; box-shadow: var(--shadow-soft); }
.diag-zoom-btn { width: 30px; height: 30px; border: 1px solid var(--border-light); border-radius: 0.5rem; background: #fff; color: #555; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 0.85rem; transition: background 0.15s, color 0.15s; }
.diag-zoom-btn:hover { background: var(--accent-blue); color: #fff; border-color: var(--accent-blue); }
.diag-zoom-sep { height: 1px; background: var(--border-light); margin: 2px 0; }

.diag-pb-bar { display: flex; align-items: center; gap: 4px; padding: 8px 14px; background: var(--bg-soft); border-top: 1px solid var(--border-light); border-radius: 0 0 0.6rem 0.6rem; }
.diag-pb-btn { width: 30px; height: 30px; border: 1px solid var(--graphite-200); border-radius: 0.5rem; background: #fff; color: #555; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 0.85rem; transition: background 0.15s, color 0.15s; flex-shrink: 0; }
.diag-pb-btn:hover { background: var(--accent-blue); color: #fff; border-color: var(--accent-blue); }
.diag-pb-main { background: var(--accent-blue); color: #fff; border-color: var(--accent-blue); width: 34px; height: 34px; }
.diag-pb-main:hover { background: var(--accent-blue-dark); border-color: var(--accent-blue-dark); }
.diag-pb-slider { flex: 1; height: 4px; cursor: pointer; accent-color: var(--accent-blue); margin: 0 6px; }
.diag-pb-label { font-size: 0.75rem; color: #888; white-space: nowrap; min-width: 80px; text-align: right; }

.rc-banner { border: 1.5px solid #e74c3c; border-radius: 0.6rem; overflow: hidden; }
.rc-banner-header { background: linear-gradient(135deg, #c0392b 0%, #922b21 100%); color: #fff; padding: 10px 16px; font-size: 1rem; font-weight: 600; }
.rc-banner-path { padding: 12px 16px; background: #fff5f5; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; font-size: 1rem; }
.rc-banner-note { padding: 8px 16px; background: var(--amber-50); color: #7d6608; font-size: 0.82rem; border-top: 1px solid var(--amber-100); }
.rc-leyenda { display: flex; gap: 20px; font-size: 0.82rem; color: #666; }
.rc-leyenda-item { display: flex; align-items: center; gap: 6px; }
.rc-dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }

.gantt-leyenda { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; font-size: 0.82rem; color: #666; padding: 8px 12px; background: var(--bg-soft); border-radius: 0.5rem; border: 1px solid var(--border-light); }
.gantt-leyenda-item { display: flex; align-items: center; gap: 6px; }
.gantt-leg { display: inline-block; width: 30px; height: 13px; border-radius: 3px; vertical-align: middle; }
.gantt-leg--crit { background: #e53935; border: 1.5px solid #c62828; }
.gantt-leg--norm { background: var(--accent-blue); border: 1.5px solid var(--accent-blue-dark); }
.gantt-leg--slack { background: var(--graphite-200); border: 1.5px dashed var(--graphite-300); }

.calc-pert-formula-box { background: var(--bg-soft); border: 1px solid var(--border-light); border-radius: 0.6rem; padding: 10px 16px; font-size: 0.87rem; color: #666; }
.calc-pert-result-box { background: #f0f8f4; border: 1.5px solid #2d6a4f; border-radius: 0.75rem; padding: 16px 20px; }
.calc-pert-te-value { font-size: 2.8rem; font-weight: 700; color: var(--accent-blue); line-height: 1; }


/* ======================== RESPONSIVE ======================== */
@media (max-width: 768px) {
    .hero { flex-direction: column; text-align: center; padding: 40px 16px; min-height: auto; }
    .hero-content h1 { font-size: 2rem; }
    .hero-image-wrapper { display: none; }
    .about-us { padding:4rem 1rem; }
    .history-experience { height:auto; grid-template-columns:1fr; grid-template-rows:auto 30rem; }
    .history-years { flex-direction:row; justify-content:stretch; padding:.8rem; border-right:0; border-bottom:1px solid rgba(255,255,255,.1); }
    .history-years button { min-width:0; flex:1; flex-direction:column; align-items:flex-start; gap:.15rem; padding:.65rem; }
    .history-years button span { font-size:1.15rem; }
    .history-years button small { font-size:.54rem; }
    .history-years button:hover { transform:translateY(-2px); }
    .history-stage { height:30rem; padding:2rem 1.35rem 3.2rem; }
    .history-panel strong { font-size:4.5rem; }
    .history-progress { left:1.35rem; right:1.35rem; }
    .dashboard-header { flex-wrap: wrap; gap: 10px; }
    .dashboard-nav ul { flex-wrap: wrap; }
    .stats { grid-template-columns: repeat(2, 1fr); }
    .toolbar { flex-direction: column; align-items: stretch; }
    .services-grid { grid-template-columns: 1fr; }
    .mission-vision-philosophy { grid-template-columns: 1fr; }
    .gear-feature { min-height:17rem; }
    .gear-stage { width:min(100%,14rem); }
}

/* ================================================================
   COMPONENTES AUTONOMOS DEL SISTEMA
   ================================================================ */

/* --- Tarjeta --- */
.card-clean {
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-card);
    padding: 22px;
    margin-bottom: 20px;
    box-shadow: var(--shadow-soft);
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
}
.card-clean:hover { border-color: var(--shadow-grey-200); box-shadow: var(--shadow-lifted); }

/* --- Botones (autonomos) --- */
.btn-primary, .btn-outline, .btn-success, .btn-danger, .btn-warning {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem;
    padding: 0.6rem 1.2rem; border-radius: 0.7rem; border: 1px solid transparent;
    font-family: var(--font-family); font-weight: 500; font-size: 0.9rem; line-height: 1.2;
    cursor: pointer; text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-primary { background: var(--accent-blue); color: #fff; border-color: var(--accent-blue); }
.btn-primary:hover, .btn-primary:focus { background: var(--accent-blue-dark); border-color: var(--accent-blue-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(122,45,31,0.22); }
.btn-outline { background: transparent; color: var(--accent-blue); border-color: var(--accent-blue); }
.btn-outline:hover, .btn-outline:focus { background: var(--accent-blue); color: #fff; transform: translateY(-1px); }
/* Regla base de .btn-ghost (antes solo existian los overrides de tema oscuro, por
   lo que el boton "Contraer" se veia sin estilo). Correccion Fase 1 del plan V4.1. */
.btn-ghost { background: transparent; color: var(--text-muted); border-color: transparent; }
.btn-ghost:hover, .btn-ghost:focus { background: var(--surface-subtle); color: var(--text-dark); }
.btn-success { background: #2d6a4f; color: #fff; }
.btn-success:hover, .btn-success:focus { background: #23543e; color: #fff; transform: translateY(-1px); }
.btn-danger { background: #c0392b; color: #fff; }
.btn-danger:hover, .btn-danger:focus { background: #a3301f; color: #fff; transform: translateY(-1px); }
.btn-warning { background: var(--accent-gold); color: var(--text-main); }
.btn-warning:hover, .btn-warning:focus { background: var(--glow-600); color: #fff; transform: translateY(-1px); }
.btn-primary:disabled, .btn-outline:disabled, .btn-success:disabled, .btn-danger:disabled, .btn-warning:disabled { opacity: 0.6; cursor: not-allowed; transform: none; box-shadow: none; }
.btn-primary svg, .btn-outline svg, .btn-success svg, .btn-danger svg, .btn-warning svg { width: 1rem; height: 1rem; }

/* --- Badge de estado: modificadores genericos (para th:classappend) --- */
.badge-status.primary   { background: var(--amber-100);    color: var(--amber-700); }
.badge-status.secondary { background: var(--graphite-100); color: var(--graphite-700); }
.badge-status.success   { background: #e6f4ec;             color: #256447; }
.badge-status.danger    { background: #fdecea;             color: #a83226; }
.badge-status.warning   { background: var(--glow-300);     color: var(--graphite-900); }
.badge-status.info      { background: var(--khaki-100);    color: var(--khaki-700); }

/* Redefinido al final para ganar la cascada sobre .btn-*  */
.btn-sm { padding: 0.4rem 0.85rem; font-size: 0.82rem; }
.input-minimal.input-sm, select.input-minimal { font-size: 0.85rem; }

/* ================================================================
   AJUSTES DE MIGRACION — sidebar bajo el header + responsive
   ================================================================ */

/* (3) La sidebar se despliega JUSTO debajo del site-header (64px) */
.site-header { height: 64px; }
.sidebar { top: 64px; height: calc(100vh - 64px); z-index: 1045; }
.sidebar-overlay { top: 64px; z-index: 1040; }

/* (2) Acciones dentro de tablas que NO se encimen */
.table-clean td .flex { flex-wrap: wrap; gap: 0.4rem; }
.table-clean td form { margin: 0; }
.table-clean td > a + a,
.table-clean td > button + button,
.table-clean td > form + form,
.table-clean td > a + form,
.table-clean td > form + a { margin-left: 0.35rem; }
.table-clean select.input-minimal,
.table-clean input.input-minimal { min-width: 7rem; max-width: 100%; }
.cell-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
.cell-actions form { display: inline-flex; margin: 0; }

/* Botones y tarjetas mas compactos en movil */
@media (max-width: 768px) {
    .btn-primary, .btn-outline, .btn-success, .btn-danger, .btn-warning { padding: 0.5rem 0.9rem; font-size: 0.84rem; }
    .btn-sm { padding: 0.35rem 0.7rem; font-size: 0.78rem; }
    .card-clean { padding: 16px; }
    .table-clean { font-size: 0.8rem; }
    .table-clean th, .table-clean td { padding: 10px 8px; }
}

/* ======================== SISTEMA V3: LAYOUT Y ACCESIBILIDAD ======================== */
.page-shell { width: 100%; max-width: 80rem; margin-inline: auto; padding: 2rem 1rem; }
.page-shell--narrow { max-width: 56rem; }
.page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }
.page-heading h1, .page-heading h2 { margin:0; font-size:clamp(1.8rem, 3vw, 2.6rem); }
.page-kicker { display:block; margin-bottom:.3rem; color:var(--tomato-jam-600); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.surface-accent { border-top:4px solid var(--tropical-teal-500); }
.table-shell { width:100%; overflow-x:auto; border:1px solid var(--border-light); border-radius:.9rem; }
.table-shell .table-clean { min-width:42rem; }
.empty-state { padding:3rem 1.5rem; text-align:center; color:var(--text-muted); }

.site-footer { position:relative; margin-top:auto; padding:2.25rem 1.5rem 1rem; color:#fff; background:linear-gradient(135deg,var(--shadow-grey-950),var(--tropical-teal-950)); border-top:1px solid rgba(255,255,255,.12); overflow:hidden; }
.site-footer::before { content:""; position:absolute; width:18rem; height:18rem; right:-6rem; top:-11rem; border:1px solid rgba(116,185,190,.18); border-radius:50%; box-shadow:0 0 0 2rem rgba(116,185,190,.035),0 0 0 4rem rgba(116,185,190,.025); }
.site-footer-inner { position:relative; z-index:1; max-width:80rem; margin:0 auto; display:grid; grid-template-columns:minmax(16rem,1.25fr) minmax(13rem,.85fr) auto; align-items:center; gap:2rem; }
.site-footer-brand { display:flex; align-items:center; gap:1rem; }
.site-footer-mark { width:3.5rem; height:3.5rem; flex:0 0 auto; display:grid; place-items:center; color:var(--tropical-teal-300); }
.site-footer-mark svg { width:100%; height:100%; animation:footer-gear-spin 18s linear infinite; }
.site-footer h5 { color:#fff; margin:0 0 .25rem; font-size:1.35rem; }
.site-footer h5 span { color:#fff; }
.site-footer p { color:var(--shadow-grey-300); margin:0; font-size:.78rem; line-height:1.55; }
.site-footer-contact { display:flex; flex-direction:column; align-items:flex-start; gap:.28rem; }
.site-footer-label { margin-bottom:.15rem; color:var(--tropical-teal-300); font-size:.62rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.site-footer-contact a { color:rgba(255,255,255,.78); font-size:.78rem; transition:color .2s ease, transform .2s ease; }
.site-footer-contact a:hover { color:#fff; transform:translateX(2px); }
.social-links { display:flex; align-items:center; justify-content:flex-end; gap:.55rem; }
.social-links a { width:2.65rem; height:2.65rem; display:grid; place-items:center; color:#fff; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.18); border-radius:50%; transition:background .25s ease, border-color .25s ease, transform .3s cubic-bezier(.22,1,.36,1), box-shadow .25s ease; }
.social-links a:hover { background:var(--tomato-jam-600); border-color:var(--tomato-jam-400); transform:translateY(-4px) rotate(-5deg); box-shadow:0 10px 24px rgba(0,0,0,.25); }
.social-links svg { width:1.15rem; height:1.15rem; fill:currentColor; }
.social-links a:nth-child(2) svg,
.social-links a:nth-child(3) svg { fill:none; }
.site-footer-bottom { position:relative; z-index:1; max-width:80rem; margin:1.5rem auto 0; padding-top:.85rem; display:flex; justify-content:space-between; gap:1rem; border-top:1px solid rgba(255,255,255,.09); }
@keyframes footer-gear-spin { to { transform:rotate(360deg); } }

/* ================================================================
   PORTAL V4 — LANDING EDITORIAL INDUSTRIAL
   ================================================================ */
.portal-hero { position:relative; width:100%; max-width:90rem; min-height:calc(100vh - 64px); margin:0 auto; padding:clamp(4rem,8vw,7rem) clamp(1.25rem,5vw,4.5rem); display:grid; grid-template-columns:minmax(0,1.02fr) minmax(26rem,.98fr); align-items:center; gap:clamp(3rem,7vw,7rem); overflow:hidden; }
.portal-hero::before { content:""; position:absolute; width:28rem; height:28rem; left:-19rem; top:3rem; border:1px solid var(--linen-300); border-radius:50%; box-shadow:0 0 0 4rem rgba(206,179,151,.09),0 0 0 8rem rgba(206,179,151,.055); pointer-events:none; }
.portal-hero-copy { position:relative; z-index:2; }
.portal-hero-kicker { display:flex; align-items:center; gap:.65rem; margin-bottom:1.25rem; color:var(--shadow-grey-600); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.portal-hero-kicker span { width:2.5rem; height:2px; background:var(--tomato-jam-600); }
.portal-hero h1 { max-width:11ch; margin:0 0 1.35rem; font-size:clamp(3.5rem,7vw,7rem); line-height:.84; letter-spacing:-.055em; }
.portal-hero h1 em { color:var(--tomato-jam-600); font-style:normal; }
.portal-hero-copy > p { max-width:38rem; margin:0 0 1.8rem; color:var(--shadow-grey-600); font-size:clamp(.98rem,1.5vw,1.14rem); line-height:1.75; }
.portal-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:1rem; }
.portal-text-link { display:inline-flex; align-items:center; gap:.4rem; padding:.65rem .2rem; color:var(--shadow-grey-800); border-bottom:1px solid var(--shadow-grey-400); font-size:.86rem; font-weight:600; transition:color .2s ease, border-color .2s ease, gap .2s ease; }
.portal-text-link:hover { gap:.65rem; color:var(--tomato-jam-700); border-color:var(--tomato-jam-600); }
.portal-proof { margin-top:3.4rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--shadow-grey-200); }
.portal-proof div { padding:1rem .9rem .2rem 0; }
.portal-proof div + div { padding-left:1rem; border-left:1px solid var(--shadow-grey-200); }
.portal-proof strong { display:block; color:var(--shadow-grey-900); font-family:var(--font-display); font-size:2rem; line-height:1; }
.portal-proof span { display:block; margin-top:.28rem; color:var(--shadow-grey-500); font-size:.64rem; line-height:1.35; text-transform:uppercase; letter-spacing:.06em; }
.portal-hero-visual { position:relative; min-height:36rem; display:grid; place-items:center; overflow:hidden; background:linear-gradient(150deg,var(--tropical-teal-100),var(--linen-50) 58%,var(--vanilla-custard-50)); border:1px solid var(--shadow-grey-900); border-radius:1.8rem; box-shadow:0 35px 70px rgba(27,24,25,.14); }
.portal-hero-grid { position:absolute; inset:0; opacity:.28; background-image:linear-gradient(rgba(49,100,104,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(49,100,104,.22) 1px,transparent 1px); background-size:38px 38px; mask-image:linear-gradient(145deg,#000,transparent 80%); }
.portal-hero-visual img { position:relative; z-index:2; width:min(88%,34rem); max-height:30rem; object-fit:contain; filter:drop-shadow(0 28px 28px rgba(19,17,17,.24)); transition:transform .7s cubic-bezier(.22,1,.36,1); }
.portal-hero-visual:hover img { transform:translateY(-7px) scale(1.025); }
.portal-visual-tag { position:absolute; z-index:4; display:flex; align-items:center; gap:.65rem; padding:.72rem .9rem; color:var(--shadow-grey-800); background:rgba(255,255,255,.91); border:1px solid rgba(27,24,25,.15); border-radius:.8rem; box-shadow:0 14px 32px rgba(27,24,25,.1); backdrop-filter:blur(12px); font-size:.72rem; font-weight:600; }
.portal-visual-tag span { color:var(--tomato-jam-600); font-size:.62rem; font-weight:700; }
.portal-visual-tag--top { top:2rem; left:2rem; }
.portal-visual-tag--bottom { right:2rem; bottom:2rem; }
.portal-visual-gear { position:absolute; z-index:1; width:18rem; height:18rem; right:-5rem; top:-5rem; color:var(--tropical-teal-700); opacity:.19; animation:portal-gear-spin 22s linear infinite; }
@keyframes portal-gear-spin { to { transform:rotate(360deg); } }
.portal-marquee { width:100%; overflow:hidden; color:#fff; background:var(--shadow-grey-950); border-block:1px solid var(--shadow-grey-800); }
.portal-marquee > div { min-width:max-content; display:flex; align-items:center; justify-content:center; gap:1.4rem; padding:.85rem 1.5rem; }
.portal-marquee span { font-size:.66rem; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
.portal-marquee i { width:.35rem; height:.35rem; background:var(--tropical-teal-400); border-radius:50%; }

/* Un solo mecanismo cultural: los radios y centros se calculan para que los engranes se toquen. */
.identity-system { margin-top:6rem; padding:clamp(2rem,5vw,4rem); display:grid; grid-template-columns:minmax(20rem,.85fr) minmax(34rem,1.15fr); align-items:center; gap:2rem; background:linear-gradient(145deg,var(--linen-50),#fff); border:1px solid var(--linen-200); border-radius:1.8rem; overflow:hidden; }
.identity-copy { position:relative; z-index:3; }
.identity-eyebrow { display:block; margin-bottom:.65rem; color:var(--tomato-jam-600); font-size:.68rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.identity-copy > h2 { max-width:10ch; margin:0; text-align:left; font-size:clamp(2.6rem,5vw,4.7rem); line-height:.9; }
.identity-intro { max-width:31rem; margin:1rem 0 1.5rem; color:var(--shadow-grey-600); font-size:.9rem; }
.identity-detail { position:relative; min-height:13rem; padding:1.3rem; background:#fff; border:1px solid var(--shadow-grey-100); border-radius:1rem; box-shadow:var(--shadow-soft); }
.identity-detail article { position:absolute; inset:1.3rem; }
.identity-detail span { color:var(--tropical-teal-700); font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.identity-detail h3 { margin:.45rem 0 .6rem; font-size:1.8rem; }
.identity-detail p { margin:0; color:var(--shadow-grey-600); font-size:.8rem; line-height:1.62; }
.identity-hint { display:flex; align-items:center; gap:.4rem; margin:1rem 0 0; color:var(--shadow-grey-500); font-size:.68rem; }
.gear-mechanism { position:relative; min-height:31rem; overflow:hidden; }
.gear-canvas { position:absolute; width:37.5rem; height:30rem; left:50%; top:50%; transform:translate(-50%,-50%); }
.gear-canvas::before { content:""; position:absolute; inset:2rem 0; background-image:radial-gradient(circle,var(--shadow-grey-300) 1px,transparent 1px); background-size:18px 18px; opacity:.22; mask-image:radial-gradient(circle,#000,transparent 68%); }
.connected-gear { position:absolute; display:grid; place-items:center; padding:0; color:var(--tropical-teal-700); background:transparent; border:0; border-radius:50%; cursor:pointer; outline:none; }
.connected-gear svg { position:absolute; inset:0; width:100%; height:100%; filter:drop-shadow(0 14px 16px rgba(19,17,17,.12)); transform-origin:center; transition:color .25s ease, filter .25s ease; }
.connected-gear > span { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; color:currentColor; font-family:var(--font-display); font-size:1.5rem; line-height:.9; pointer-events:none; }
.connected-gear > span small { margin-bottom:.25rem; font-family:var(--font-family); font-size:.56rem; font-weight:700; letter-spacing:.12em; }
.connected-gear--large { width:18.75rem; height:18.75rem; left:1.875rem; top:7.5rem; color:var(--tropical-teal-700); }
.connected-gear--large svg { animation:connected-gear-cw 24s linear infinite; }
.connected-gear--medium { width:13.125rem; height:13.125rem; left:20rem; top:5.625rem; color:var(--tomato-jam-600); }
.connected-gear--medium svg { animation:connected-gear-ccw 16.8s linear infinite; }
.connected-gear--small { width:9.375rem; height:9.375rem; left:25.94rem; top:18.25rem; color:var(--vanilla-custard-700); }
.connected-gear--small svg { animation:connected-gear-cw 12s linear infinite; }
.connected-gear--medium > span { font-size:1.2rem; }
.connected-gear--small > span { font-size:.95rem; }
.connected-gear:hover svg,
.connected-gear:focus-visible svg,
.connected-gear.is-active svg { filter:drop-shadow(0 0 7px currentColor) drop-shadow(0 18px 18px rgba(19,17,17,.14)); }
.connected-gear.is-active > span { color:var(--shadow-grey-950); }
@keyframes connected-gear-cw { to { transform:rotate(360deg); } }
@keyframes connected-gear-ccw { to { transform:rotate(-360deg); } }

.portal-section-heading { max-width:56rem; margin:0 auto 2.8rem; text-align:center; }
.portal-section-heading > span { display:block; margin-bottom:.55rem; color:var(--tomato-jam-600); font-size:.68rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.portal-section-heading h2 { margin:0; font-size:clamp(2.5rem,5vw,4.5rem); line-height:.92; text-transform:none; }
.portal-section-heading p { max-width:38rem; margin:1rem auto 0; color:var(--shadow-grey-600); font-size:.9rem; }
.services-section { width:100%; max-width:80rem; margin:0 auto; padding:7rem 1.5rem; }
.services-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:1rem; }
.service-card { position:relative; min-width:0; min-height:14rem; padding:1.6rem; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; background:#fff; border:1px solid var(--shadow-grey-200); border-radius:1.15rem; box-shadow:none; transition:transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease; }
.service-card:nth-child(1) { grid-column:span 5; color:#fff; background:var(--tropical-teal-950); border-color:var(--tropical-teal-900); }
.service-card:nth-child(2) { grid-column:span 7; }
.service-card:nth-child(n+3) { grid-column:span 4; }
.service-card:hover { transform:translateY(-7px); box-shadow:var(--shadow-lifted); border-color:var(--tropical-teal-400); }
.service-card-top { position:absolute; left:1.4rem; right:1.4rem; top:1.25rem; display:flex; align-items:center; justify-content:space-between; }
.service-card-top span { color:var(--shadow-grey-400); font-size:.62rem; font-weight:700; letter-spacing:.12em; }
.service-card-top svg { width:1.35rem; height:1.35rem; color:var(--tomato-jam-600); }
.service-card:nth-child(1) .service-card-top span,
.service-card:nth-child(1) .service-card-top svg { color:var(--tropical-teal-300); }
.service-card h3 { margin:0 0 .55rem; color:var(--shadow-grey-900); font-size:1.5rem; }
.service-card:nth-child(1) h3 { color:#fff; }
.service-card p { margin:0; color:var(--shadow-grey-600); font-size:.8rem; line-height:1.65; }
.service-card:nth-child(1) p { color:var(--shadow-grey-300); }

.contacto-form { width:100%; max-width:none; margin:0; padding:1rem 1.5rem 7rem; }
.contact-panel { max-width:80rem; min-height:34rem; margin:0 auto; display:grid; grid-template-columns:minmax(20rem,.8fr) minmax(28rem,1.2fr); overflow:hidden; background:var(--shadow-grey-950); border-radius:1.6rem; box-shadow:var(--shadow-lifted); }
.contact-copy { padding:clamp(2rem,5vw,4rem); display:flex; flex-direction:column; justify-content:center; }
.contact-copy > span { color:var(--tropical-teal-300); font-size:.68rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.contact-copy h2 { max-width:12ch; margin:.7rem 0 1rem; color:#fff; font-size:clamp(2.5rem,4vw,4rem); line-height:.92; }
.contact-copy > p { margin:0; color:var(--shadow-grey-300); font-size:.86rem; }
.contact-actions { display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.5rem; }
.contact-copy .btn-outline { color:#fff; border-color:rgba(255,255,255,.35); }
.contact-copy .btn-outline:hover { background:#fff; color:var(--shadow-grey-950); }
.contact-direct { margin-top:2rem; display:flex; flex-direction:column; gap:.5rem; }
.contact-direct a { display:flex; align-items:center; gap:.6rem; color:var(--shadow-grey-300); font-size:.72rem; }
.contact-direct svg { width:1rem; height:1rem; color:var(--tropical-teal-300); }
.contact-map { position:relative; min-height:34rem; overflow:hidden; }
.contact-map iframe { position:absolute; inset:0; border:0; filter:grayscale(1) contrast(.9); transition:filter .4s ease, transform .7s ease; }
.contact-map:hover iframe { filter:grayscale(.15) contrast(1); transform:scale(1.015); }
.contact-map-label { position:absolute; left:1.25rem; bottom:1.25rem; display:flex; align-items:center; gap:.5rem; padding:.7rem .9rem; color:var(--shadow-grey-800); background:rgba(255,255,255,.92); border:1px solid rgba(27,24,25,.14); border-radius:.8rem; box-shadow:var(--shadow-soft); font-size:.7rem; font-weight:600; backdrop-filter:blur(10px); }
.contact-map-label svg { width:1rem; height:1rem; color:var(--tomato-jam-600); }

.quality-section { width:100%; max-width:80rem; margin:0 auto; padding:2rem 1.5rem 7rem; }
.quality-toggle { display:flex; justify-content:center; margin-bottom:1.5rem; }
.policy-document { padding:clamp(1.5rem,4vw,3rem); column-count:2; column-gap:3rem; background:#fff; border:1px solid var(--shadow-grey-200); border-top:4px solid var(--tropical-teal-500); border-radius:1.2rem; box-shadow:var(--shadow-soft); }
.policy-document p { break-inside:avoid; margin:0 0 1rem; color:var(--shadow-grey-600); font-size:.78rem; line-height:1.72; }
.policy-document p:first-child { color:var(--shadow-grey-900); font-family:var(--font-display); font-size:1.35rem; line-height:1.25; }

@media (max-width: 1024px) {
    .portal-hero { grid-template-columns:1fr; min-height:auto; }
    .portal-hero h1 { max-width:12ch; }
    .portal-hero-visual { min-height:30rem; }
    .identity-system { grid-template-columns:1fr; }
    .identity-copy > h2 { max-width:14ch; }
    .gear-mechanism { min-height:29rem; }
}
@media (max-width: 768px) {
    .portal-hero { padding:4rem 1rem; gap:3rem; text-align:left; }
    .portal-hero h1 { font-size:clamp(3.25rem,15vw,5rem); }
    .portal-proof { margin-top:2.4rem; }
    .portal-hero-visual { min-height:24rem; }
    .portal-visual-tag--top { top:1rem; left:1rem; }
    .portal-visual-tag--bottom { right:1rem; bottom:1rem; }
    .identity-system { margin-top:4rem; padding:1.5rem; grid-template-columns:1fr; }
    .identity-detail { min-height:15rem; }
    .gear-mechanism { min-height:19rem; }
    .gear-canvas { top:0; left:50%; transform:translateX(-50%) scale(.61); transform-origin:top center; }
    .services-section { padding:5rem 1rem; }
    .services-grid { grid-template-columns:1fr; }
    .service-card,
    .service-card:nth-child(1),
    .service-card:nth-child(2),
    .service-card:nth-child(n+3) { grid-column:auto; min-height:12rem; }
    .contacto-form { padding:0 1rem 5rem; }
    .contact-panel { grid-template-columns:1fr; }
    .contact-map { min-height:22rem; }
    .quality-section { padding:1rem 1rem 5rem; }
    .policy-document { column-count:1; }
}
@media (max-width: 480px) {
    .portal-proof div { padding-right:.35rem; }
    .portal-proof div + div { padding-left:.55rem; }
    .portal-proof strong { font-size:1.55rem; }
    .portal-proof span { font-size:.52rem; }
    .portal-visual-tag { font-size:.62rem; }
    .gear-mechanism { min-height:16.5rem; }
    .gear-canvas { transform:translateX(-50%) scale(.52); }
}

/* ================================================================
   ESPACIOS DE TRABAJO V4 — ADMIN / CLIENTE / OPERADOR
   Cada rol comparte componentes, pero conserva una jerarquia y tono propios.
   ================================================================ */
.workspace-banner { display:none; }
.app-view {
    --role-accent:var(--tomato-jam-600);
    --role-accent-dark:var(--tomato-jam-800);
    --role-soft:var(--tomato-jam-50);
    --role-rgb:162,60,42;
    background:
        radial-gradient(circle at 90% 22rem,rgba(var(--role-rgb),.08),transparent 25rem),
        linear-gradient(180deg,var(--shadow-grey-50),#fff 42rem);
}
.app-view--client {
    --role-accent:var(--tropical-teal-600);
    --role-accent-dark:var(--tropical-teal-900);
    --role-soft:var(--tropical-teal-50);
    --role-rgb:65,134,139;
}
.app-view--operator {
    --role-accent:var(--vanilla-custard-600);
    --role-accent-dark:var(--vanilla-custard-900);
    --role-soft:var(--vanilla-custard-50);
    --role-rgb:181,141,23;
}
.app-view .site-public-nav { display:none !important; }
.app-view .workspace-banner { display:block; position:relative; overflow:hidden; color:#fff; background:var(--shadow-grey-950); border-bottom:1px solid rgba(255,255,255,.08); }
.app-view .workspace-banner::before { content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:32px 32px; mask-image:linear-gradient(90deg,transparent,#000 65%); }
.app-view .workspace-banner::after { content:""; position:absolute; width:28rem; height:28rem; right:-14rem; top:-15rem; border:1px solid rgba(var(--role-rgb),.42); border-radius:50%; box-shadow:0 0 0 3.5rem rgba(var(--role-rgb),.055),0 0 0 7rem rgba(var(--role-rgb),.035); }
.workspace-banner__inner { position:relative; z-index:2; width:100%; max-width:80rem; min-height:13rem; margin:0 auto; padding:2.2rem 2rem; display:grid; grid-template-columns:minmax(22rem,1.2fr) minmax(22rem,.9fr) 9rem; align-items:center; gap:2rem; }
.workspace-banner__eyebrow { display:flex; align-items:center; gap:.5rem; margin-bottom:.65rem; color:rgba(255,255,255,.58); font-size:.65rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.workspace-banner__eyebrow svg { width:.95rem; height:.95rem; color:var(--role-accent); }
.workspace-banner__copy h1 { max-width:15ch; margin:0; color:#fff; font-size:clamp(2rem,3.6vw,3.35rem); line-height:.88; }
.workspace-banner__copy h1 em { color:var(--role-accent); font-style:normal; }
.app-view--operator .workspace-banner__copy h1 em { color:var(--vanilla-custard-400); }
.workspace-banner__copy p { max-width:37rem; margin:.8rem 0 0; color:var(--shadow-grey-300); font-size:.78rem; line-height:1.6; }
.workspace-banner__actions { display:flex; flex-direction:column; gap:.45rem; }
.workspace-banner__actions a { min-height:3.15rem; padding:.55rem .75rem; display:grid; grid-template-columns:1.8rem 1fr; align-items:center; gap:.55rem; color:#fff; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.1); border-radius:.75rem; transition:transform .25s ease,background .25s ease,border-color .25s ease; }
.workspace-banner__actions a:hover { transform:translateX(5px); background:rgba(var(--role-rgb),.18); border-color:rgba(var(--role-rgb),.6); }
.workspace-banner__actions svg { width:1.15rem; height:1.15rem; color:var(--role-accent); }
.app-view--operator .workspace-banner__actions svg { color:var(--vanilla-custard-400); }
.workspace-banner__actions span { font-size:.73rem; font-weight:600; }
.workspace-banner__actions small { display:block; margin-top:.12rem; color:var(--shadow-grey-400); font-size:.57rem; font-weight:400; }
.workspace-banner__mechanism { position:relative; width:9rem; height:9rem; color:var(--role-accent); opacity:.66; }
.workspace-gear { position:absolute; filter:drop-shadow(0 10px 18px rgba(0,0,0,.22)); }
.workspace-gear--large { width:7.1rem; height:7.1rem; left:0; bottom:0; animation:workspace-gear-cw 18s linear infinite; }
.workspace-gear--small { width:4.6rem; height:4.6rem; right:-.1rem; top:-.1rem; animation:workspace-gear-ccw 11.6s linear infinite; }
@keyframes workspace-gear-cw { to { transform:rotate(360deg); } }
@keyframes workspace-gear-ccw { to { transform:rotate(-360deg); } }

.app-view .page-shell { flex:1 0 auto; padding-top:2.6rem; padding-bottom:5rem; }
.app-view .page-shell > h2,
.app-view .page-shell > .mb-6:first-child h2,
.app-view .page-shell > .flex.justify-between:first-child h2,
.app-view .page-shell > .grid:first-child h2 { margin:0; font-size:clamp(2rem,3vw,3rem); line-height:.92; }
.app-view .page-shell > h2::after,
.app-view .page-shell > .mb-6:first-child h2::after,
.app-view .page-shell > .flex.justify-between:first-child h2::after,
.app-view .page-shell > .grid:first-child h2::after { content:""; width:2.75rem; height:3px; margin-top:.6rem; display:block; background:var(--role-accent); border-radius:99px; }
.app-view .page-shell > .mb-6:first-child p { margin:.6rem 0 0; font-size:.84rem; }
.app-view .card-clean { position:relative; border-color:rgba(var(--role-rgb),.12); box-shadow:0 1px 2px rgba(19,17,17,.025),0 12px 32px rgba(19,17,17,.045); }
.app-view .card-clean:hover { border-color:rgba(var(--role-rgb),.32); box-shadow:0 18px 42px rgba(19,17,17,.09); }
.app-view form.card-clean:hover { transform:none; }
.app-view .card-clean h3,
.app-view .card-clean h4,
.app-view .card-clean h5 { letter-spacing:-.015em; }
.app-view .table-clean th { position:sticky; top:0; z-index:1; color:var(--role-accent-dark); background:var(--role-soft); border-bottom:1px solid rgba(var(--role-rgb),.2); }
.app-view .table-clean tbody tr { transition:background .18s ease,transform .18s ease; }
.app-view .table-clean tbody tr:nth-child(even) { background:rgba(var(--role-rgb),.018); }
.app-view .table-clean tbody tr:hover { background:rgba(var(--role-rgb),.07); }
.app-view .input-minimal:focus { border-color:var(--role-accent); box-shadow:0 0 0 3px rgba(var(--role-rgb),.14); }
.app-view label { color:var(--shadow-grey-700); font-size:.73rem; font-weight:600; }
.app-view .btn-primary { background:var(--role-accent); border-color:var(--role-accent); }
.app-view .btn-primary:hover,
.app-view .btn-primary:focus { background:var(--role-accent-dark); border-color:var(--role-accent-dark); box-shadow:0 10px 24px rgba(var(--role-rgb),.22); }
.app-view .btn-outline { color:var(--role-accent-dark); border-color:rgba(var(--role-rgb),.55); }
.app-view .btn-outline:hover,
.app-view .btn-outline:focus { color:#fff; background:var(--role-accent-dark); border-color:var(--role-accent-dark); }
.app-view .badge-status.primary { color:var(--role-accent-dark); background:var(--role-soft); border:1px solid rgba(var(--role-rgb),.22); }
.app-view .text-amber-600 { color:var(--role-accent) !important; }
.app-view .bg-amber-600 { background-color:var(--role-accent) !important; }

/* Dashboard administrativo: lectura ejecutiva y accesos de control. */
.admin-stat { min-height:9.2rem; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; }
.admin-stat::after { content:""; position:absolute; width:7rem; height:7rem; right:-3.2rem; top:-3.2rem; border:1px solid rgba(var(--role-rgb),.22); border-radius:50%; box-shadow:0 0 0 1.25rem rgba(var(--role-rgb),.04); }
.admin-stat__top { display:flex; align-items:center; justify-content:space-between; gap:.75rem; }
.admin-stat__icon { width:2.35rem; height:2.35rem; display:grid; place-items:center; color:var(--role-accent); background:var(--role-soft); border-radius:.7rem; }
.admin-stat__icon svg { width:1.15rem; height:1.15rem; }
.admin-stat__value { font-family:var(--font-display); font-size:2.75rem; font-weight:600; line-height:.85; }
.quick-actions-panel { color:#fff; background:linear-gradient(145deg,var(--shadow-grey-950),var(--tomato-jam-950)); border-color:var(--shadow-grey-800) !important; }
.quick-actions-panel h3 { color:#fff; }
.quick-actions-panel .btn-outline { color:#fff; border-color:rgba(255,255,255,.2); background:rgba(255,255,255,.04); }
.quick-actions-panel .btn-outline:hover { color:var(--shadow-grey-950); background:#fff; border-color:#fff; }

/* Cliente: fichas de activos faciles de explorar. */
.client-identity { background:linear-gradient(120deg,var(--tropical-teal-950),var(--tropical-teal-800)) !important; color:#fff; border:0 !important; }
.client-identity strong { display:block; margin-bottom:.2rem; color:var(--tropical-teal-200); font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; }
.client-identity .badge-status { border-color:rgba(255,255,255,.25); }
.equipment-card { height:calc(100% - 1.5rem); padding-top:1.2rem; overflow:hidden; }
.equipment-card::before { content:""; position:absolute; left:0; top:0; width:100%; height:3px; background:linear-gradient(90deg,var(--tropical-teal-500),var(--tropical-teal-200)); }
.equipment-card p { margin:.55rem 0; color:var(--shadow-grey-600); font-size:.78rem; }
.equipment-card p strong { color:var(--shadow-grey-800); }
.equipment-card .btn-outline { width:100%; }

/* Operador: la lista se comporta como una cola de ejecucion. */
.operator-filter { max-width:24rem; padding:.65rem; background:var(--vanilla-custard-50); border:1px solid var(--vanilla-custard-200); border-radius:.9rem; }
.task-board { padding:.45rem; background:rgba(255,255,255,.82); }
.task-row { position:relative; margin:.3rem; border:1px solid transparent !important; border-radius:.8rem; transition:background .2s ease,border-color .2s ease,transform .2s ease !important; }
.task-row::before { content:""; position:absolute; left:0; top:.75rem; bottom:.75rem; width:3px; background:var(--vanilla-custard-500); border-radius:99px; }
.task-row:hover { background:var(--vanilla-custard-50); border-color:var(--vanilla-custard-200) !important; transform:translateX(4px); }
.app-view--operator .task-row h5 a { color:var(--shadow-grey-900) !important; }

@media (max-width: 1024px) {
    .workspace-banner__inner { grid-template-columns:1fr minmax(20rem,.85fr); }
    .workspace-banner__mechanism { display:none; }
}
@media (max-width: 720px) {
    .workspace-banner__inner { min-height:auto; padding:1.7rem 1rem; grid-template-columns:1fr; gap:1.3rem; }
    .workspace-banner__copy h1 { font-size:2.35rem; }
    .workspace-banner__actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .workspace-banner__actions a:last-child:nth-child(3) { grid-column:1 / -1; }
    .app-view .page-shell { padding-top:1.7rem; padding-bottom:3.5rem; }
    .app-view .page-shell > .flex.justify-between { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 440px) {
    .workspace-banner__actions { grid-template-columns:1fr; }
    .workspace-banner__actions a:last-child:nth-child(3) { grid-column:auto; }
}

/* ======================== ACCESO V5 ======================== */
.auth-page { min-height:100vh; background:var(--shadow-grey-950); }
.auth-shell { width:100%; min-height:100vh; display:grid; grid-template-columns:minmax(28rem,1.08fr) minmax(26rem,.92fr); }
.auth-story { position:relative; min-height:100vh; padding:clamp(2rem,5vw,5rem); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; color:#fff; background:linear-gradient(145deg,var(--tropical-teal-950),var(--shadow-grey-950) 64%); }
.auth-story__grid { position:absolute; inset:0; opacity:.18; background-image:linear-gradient(rgba(255,255,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.11) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(145deg,#000,transparent 78%); }
.auth-brand { position:relative; z-index:3; display:flex; align-items:center; gap:.85rem; color:#fff; font-size:.82rem; font-weight:600; }
.auth-brand__mark { width:2.75rem; height:2.75rem; display:grid; place-items:center; color:var(--shadow-grey-950); background:var(--vanilla-custard-400); border-radius:.75rem; font-family:var(--font-display); font-size:1.25rem; }
.auth-brand small { display:block; margin-top:.12rem; color:var(--shadow-grey-400); font-size:.56rem; font-weight:500; letter-spacing:.13em; text-transform:uppercase; }
.auth-story__copy { position:relative; z-index:3; max-width:43rem; margin:auto 0; padding:5rem 0; }
.auth-kicker { display:flex; align-items:center; gap:.65rem; margin-bottom:1rem; color:var(--tropical-teal-200); font-size:.66rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.auth-kicker::before { content:""; width:2.4rem; height:2px; background:var(--tomato-jam-500); }
.auth-story h1 { max-width:10ch; margin:0; color:#fff; font-size:clamp(3.4rem,6vw,6.4rem); line-height:.82; letter-spacing:-.055em; }
.auth-story h1 em { color:var(--vanilla-custard-400); font-style:normal; }
.auth-story__copy > p { max-width:34rem; margin:1.4rem 0 2.2rem; color:var(--shadow-grey-300); font-size:.9rem; line-height:1.75; }
.auth-proof { max-width:34rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.14); }
.auth-proof span { padding:.9rem .7rem 0 0; color:var(--shadow-grey-300); font-size:.63rem; text-transform:uppercase; letter-spacing:.06em; }
.auth-proof span + span { padding-left:.8rem; border-left:1px solid rgba(255,255,255,.12); }
.auth-proof strong { display:block; margin-bottom:.25rem; color:var(--tropical-teal-300); font-family:var(--font-display); font-size:1.35rem; }
.auth-gear { position:absolute; color:var(--tropical-teal-400); opacity:.17; }
.auth-gear--large { width:26rem; height:26rem; right:-10rem; bottom:-10rem; animation:workspace-gear-cw 34s linear infinite; }
.auth-gear--small { width:13rem; height:13rem; right:8rem; bottom:15rem; color:var(--tomato-jam-400); animation:workspace-gear-ccw 19s linear infinite; }
.auth-form-panel { min-height:100vh; padding:2rem; display:grid; place-items:center; background:linear-gradient(180deg,#fff,var(--linen-50)); }
.auth-form-wrap { width:100%; max-width:28rem; }
.auth-form-eyebrow { color:var(--tropical-teal-700); font-size:.66rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.auth-form-wrap h2 { margin:.45rem 0 .5rem; font-size:clamp(2.5rem,4vw,3.5rem); line-height:.9; }
.auth-form-intro { margin:0 0 1.8rem; color:var(--shadow-grey-500); font-size:.8rem; }
.auth-feedback { margin-bottom:1rem; padding:.8rem .9rem; display:flex; align-items:flex-start; gap:.55rem; border:1px solid; border-radius:.8rem; font-size:.75rem; }
.auth-feedback svg { width:1rem; height:1rem; flex:0 0 auto; margin-top:.1rem; }
.auth-feedback--error { color:#9f2f24; background:#fff4f2; border-color:#f3c7c1; }
.auth-feedback--success { color:var(--tropical-teal-800); background:var(--tropical-teal-50); border-color:var(--tropical-teal-200); }
.auth-form-wrap .form-group { margin-bottom:1.1rem; }
.auth-form-wrap label { margin-bottom:.45rem; color:var(--shadow-grey-700); font-size:.72rem; }
.auth-input-wrap { position:relative; }
.auth-input-wrap > svg { position:absolute; z-index:2; left:.9rem; top:50%; width:1rem; height:1rem; color:var(--shadow-grey-400); transform:translateY(-50%); pointer-events:none; }
.auth-input-wrap .input-minimal { min-height:3rem; padding-left:2.65rem; padding-right:3rem; border-color:var(--shadow-grey-200); }
.auth-password-toggle { position:absolute; right:.55rem; top:50%; width:2.2rem; height:2.2rem; display:grid; place-items:center; color:var(--shadow-grey-500); background:transparent; border:0; border-radius:.55rem; transform:translateY(-50%); cursor:pointer; }
.auth-password-toggle:hover { color:var(--tropical-teal-700); background:var(--tropical-teal-50); }
.auth-password-toggle svg { width:1rem; height:1rem; }
.auth-help-link { color:var(--tropical-teal-700); font-size:.66rem; font-weight:600; }
.auth-help-link:hover { text-decoration:underline; }
.auth-caps-warning { margin:.45rem 0 0; display:flex; align-items:center; gap:.35rem; color:var(--vanilla-custard-700); font-size:.65rem; }
.auth-caps-warning svg { width:.9rem; height:.9rem; }
.auth-submit { width:100%; min-height:3rem; margin-top:.25rem; }
.auth-submit:disabled { opacity:.75; cursor:wait; transform:none; }
.auth-spinner { width:1rem; height:1rem; display:inline-block; border:2px solid rgba(255,255,255,.38); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }
.auth-enrollment { margin:1.35rem 0 .65rem; color:var(--shadow-grey-500); font-size:.66rem; text-align:center; }
.auth-back-link { display:flex; align-items:center; justify-content:center; gap:.35rem; color:var(--shadow-grey-500); font-size:.66rem; }
.auth-back-link:hover { color:var(--shadow-grey-900); }
.auth-back-link svg { width:.85rem; height:.85rem; }
@media (max-width: 900px) {
    .auth-shell { grid-template-columns:1fr; }
    .auth-story { min-height:22rem; padding:2rem; }
    .auth-story__copy { margin:3rem 0 0; padding:0; }
    .auth-story h1 { max-width:13ch; font-size:clamp(3rem,10vw,4.6rem); }
    .auth-story__copy > p,.auth-proof { display:none; }
    .auth-gear--small { right:4rem; bottom:2rem; }
    .auth-form-panel { min-height:auto; padding:3rem 1.25rem 4rem; }
}
@media (max-width: 520px) {
    .auth-story { min-height:18rem; }
    .auth-story h1 { font-size:2.75rem; }
    .auth-gear--small { display:none; }
}

/* ======================== FACTURACION V5 ======================== */
.billing-kpis { margin-bottom:1rem; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.billing-kpis article { position:relative; min-height:7.4rem; padding:1.15rem; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; background:#fff; border:1px solid var(--shadow-grey-100); border-radius:1rem; box-shadow:var(--shadow-soft); }
.billing-kpis article span { color:var(--shadow-grey-500); font-size:.63rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.billing-kpis article strong { position:relative; z-index:2; color:var(--shadow-grey-900); font-family:var(--font-display); font-size:clamp(1.8rem,3vw,2.6rem); line-height:.9; }
.billing-kpis article > svg { position:absolute; width:4.4rem; height:4.4rem; right:-.7rem; bottom:-.9rem; color:var(--tomato-jam-100); }
.billing-filters { margin-bottom:1.2rem; padding:.8rem; display:flex; align-items:flex-end; flex-wrap:wrap; gap:.7rem; background:rgba(255,255,255,.78); border:1px solid var(--shadow-grey-100); border-radius:1rem; }
.billing-filters label { min-width:12rem; flex:1; }
.billing-filters label .input-minimal { margin-top:.3rem; }
.billing-filter-clear { padding:.7rem .4rem; color:var(--shadow-grey-500); font-size:.7rem; }
.invoice-stack { display:flex; flex-direction:column; gap:.9rem; }
.invoice-family { overflow:hidden; background:#fff; border:1px solid var(--shadow-grey-200); border-radius:1.15rem; box-shadow:var(--shadow-soft); }
.invoice-family__header { padding:1rem 1.15rem; display:grid; grid-template-columns:minmax(13rem,1.3fr) minmax(9rem,.7fr) minmax(8rem,.55fr) auto; align-items:center; gap:1rem; }
.invoice-kind { display:inline-flex; margin-bottom:.25rem; color:var(--tropical-teal-700); font-size:.55rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.invoice-kind--extra { color:var(--tomato-jam-600); }
.invoice-family__identity h3,.invoice-child h4 { margin:0; font-size:1.35rem; }
.invoice-family__identity p { margin:.18rem 0 0; color:var(--shadow-grey-500); font-size:.65rem; }
.invoice-family__amount span,.invoice-child > div:nth-child(2) span,.invoice-child > div:nth-child(3) span { display:block; margin-bottom:.2rem; color:var(--shadow-grey-400); font-size:.55rem; font-weight:600; text-transform:uppercase; }
.invoice-family__amount strong { font-family:var(--font-display); font-size:1.55rem; }
.invoice-family__status { display:flex; align-items:flex-start; flex-direction:column; gap:.35rem; }
.invoice-family__status small { color:var(--shadow-grey-500); font-size:.62rem; }
.invoice-family__actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.45rem; }
.invoice-breakdown { padding:.35rem 1.15rem .9rem; border-top:1px solid var(--shadow-grey-100); }
.invoice-line { min-height:3.5rem; padding:.65rem .4rem; display:grid; grid-template-columns:minmax(9rem,.65fr) minmax(14rem,1.5fr) auto; align-items:center; gap:1rem; border-bottom:1px solid var(--shadow-grey-100); }
.invoice-line:last-child { border-bottom:0; }
.invoice-line div span { display:block; color:var(--shadow-grey-800); font-size:.7rem; font-weight:600; }
.invoice-line div small { display:block; margin-top:.15rem; color:var(--tomato-jam-600); font-size:.55rem; font-weight:600; text-transform:uppercase; }
.invoice-line p { margin:0; color:var(--shadow-grey-600); font-size:.68rem; line-height:1.45; }
.invoice-line > strong { font-size:.72rem; }
.invoice-empty-lines { margin:.6rem 0; color:var(--shadow-grey-500); font-size:.68rem; }
.invoice-children { padding:.7rem; background:var(--shadow-grey-50); border-top:1px solid var(--shadow-grey-100); }
.invoice-child { margin:.4rem 0; padding:.8rem; display:grid; grid-template-columns:minmax(12rem,1fr) minmax(7rem,.45fr) minmax(7rem,.45fr) auto auto; align-items:center; gap:.8rem; background:#fff; border:1px solid var(--shadow-grey-100); border-left:3px solid var(--tomato-jam-400); border-radius:.8rem; }
.invoice-child h4 { font-size:1rem; }
.invoice-child small { color:var(--shadow-grey-500); font-size:.58rem; }
.invoice-child > div:nth-child(2) strong,.invoice-child > div:nth-child(3) strong { font-size:.72rem; }
.invoice-child__lines { grid-column:1 / -1; border-top:1px solid var(--shadow-grey-100); }
.modal-shell { position:fixed; inset:0; z-index:1200; padding:1rem; display:grid; place-items:center; }
.modal-backdrop { position:absolute; inset:0; background:rgba(19,17,17,.68); backdrop-filter:blur(5px); }
.modal-card { position:relative; z-index:2; width:min(100%,36rem); max-height:calc(100vh - 2rem); overflow:auto; background:#fff; border:1px solid var(--shadow-grey-200); border-radius:1.15rem; box-shadow:0 30px 80px rgba(0,0,0,.3); }
.modal-card > header { padding:1.1rem 1.25rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#fff; background:var(--shadow-grey-950); }
.modal-card > header span { color:var(--tropical-teal-300); font-size:.56rem; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.modal-card > header h3 { margin:.2rem 0 0; color:#fff; font-size:1.35rem; }
.modal-card > header button { width:2rem; height:2rem; color:#fff; background:rgba(255,255,255,.07); border:0; border-radius:50%; font-size:1.35rem; cursor:pointer; }
.modal-card__body { padding:1.25rem; display:flex; flex-direction:column; gap:1rem; }
.modal-card__body label { display:block; }
.modal-card__body label .input-minimal { margin-top:.35rem; }
.modal-card > footer { padding:1rem 1.25rem; display:flex; justify-content:flex-end; gap:.6rem; background:var(--shadow-grey-50); border-top:1px solid var(--shadow-grey-100); }
.payment-balance { padding:.9rem; display:flex; align-items:center; justify-content:space-between; color:#fff; background:var(--tropical-teal-900); border-radius:.8rem; }
.payment-balance span { color:var(--tropical-teal-200); font-size:.62rem; text-transform:uppercase; }
.payment-balance strong { font-family:var(--font-display); font-size:1.5rem; }
/* Saldo restante en vivo del modal de pago (Fase 3 del plan V4.1). */
.payment-remaining { margin-top:-.35rem; padding:.55rem .9rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; background:var(--surface-subtle); border:1px solid var(--border-light); border-radius:.7rem; }
.payment-remaining span { color:var(--text-muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; }
.payment-remaining strong { font-family:var(--font-display); font-size:1.05rem; color:var(--text-dark); }
.payment-remaining.is-over { background:var(--tomato-jam-50); border-color:var(--tomato-jam-300); }
.payment-remaining.is-over span, .payment-remaining.is-over strong { color:var(--tomato-jam-700); }
html[data-theme="dark"] .payment-remaining { background:var(--surface-subtle); border-color:var(--line-soft); }
html[data-theme="dark"] .payment-remaining strong { color:var(--ink-strong); }
html[data-theme="dark"] .payment-remaining.is-over { background:rgba(162,60,42,.18); border-color:rgba(224,147,133,.35); }
html[data-theme="dark"] .payment-remaining.is-over span, html[data-theme="dark"] .payment-remaining.is-over strong { color:#ef9b8d; }
@media (max-width: 900px) {
    .invoice-family__header { grid-template-columns:1fr 1fr; }
    .invoice-family__actions { justify-content:flex-start; }
    .invoice-child { grid-template-columns:1fr 1fr; }
    .invoice-child > .badge-status,.invoice-child > .cell-actions { justify-self:start; }
}
@media (max-width: 640px) {
    .billing-kpis { grid-template-columns:1fr; }
    .billing-kpis article { min-height:6.2rem; }
    .invoice-family__header,.invoice-child { grid-template-columns:1fr; }
    .invoice-line { grid-template-columns:1fr; gap:.35rem; }
}

select.input-minimal { appearance:auto; }
textarea.input-minimal { min-height:6.5rem; resize:vertical; }
.input-minimal:disabled { background:var(--shadow-grey-50); color:var(--shadow-grey-500); cursor:not-allowed; }

@media (min-width: 640px) { .page-shell { padding-inline:1.5rem; } }
@media (min-width: 1024px) { .page-shell { padding-inline:2rem; } }
@media (max-width: 900px) and (min-width: 641px) {
    .site-footer-inner { grid-template-columns:1fr 1fr; }
    .social-links { grid-column:1 / -1; justify-content:flex-start; }
}
@media (max-width: 640px) {
    .page-heading { align-items:flex-start; flex-direction:column; }
    .site-footer-inner { grid-template-columns:1fr; gap:1.35rem; }
    .social-links { justify-content:flex-start; }
    .site-footer-bottom { flex-direction:column; gap:.2rem; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior:auto; }
    *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* (4) En el portal el header propio va DEBAJO del app-header (no sticky encimado) */
.portal-header { position: static; }

/* ======================== TEMA CLARO / OSCURO ======================== */
.theme-toggle {
    width: 2.45rem;
    height: 2.45rem;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    padding: 0;
    color: var(--vanilla-custard-300);
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 50%;
    cursor: pointer;
    transition: color .2s ease, background .2s ease, border-color .2s ease, transform .25s ease;
}
.theme-toggle:hover { color:#fff; background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.4); transform:rotate(-8deg); }
.theme-toggle__icon { font-size:1.15rem; line-height:1; }
.theme-toggle__icon--sun { display:none; }
.theme-toggle--standalone { position:fixed; z-index:20; top:1rem; right:1rem; color:var(--shadow-grey-700); background:var(--bg-card); border-color:var(--border-light); box-shadow:var(--shadow-soft); }
.theme-toggle--standalone:hover { color:var(--tomato-jam-600); background:var(--bg-card); border-color:var(--tomato-jam-400); }

html[data-theme="dark"] {
    --bg-page:#0f1213;
    --bg-card:rgba(27,31,33,.97);
    --bg-soft:#171b1d;
    --text-main:#ece8e5;
    --text-dark:#faf7f4;
    --text-muted:#b7aeb0;
    --accent-blue:#d56f5d;
    --accent-blue-dark:#cb4b34;
    --accent-gold:#e8c04a;
    --border-light:#363c3f;
    --shadow-soft:0 1px 2px rgba(0,0,0,.2),0 14px 36px rgba(0,0,0,.25);
    --shadow-lifted:0 22px 55px rgba(0,0,0,.38);
}
html[data-theme="dark"] .theme-toggle__icon--moon { display:none; }
html[data-theme="dark"] .theme-toggle__icon--sun { display:inline; }

html[data-theme="dark"] body {
    background:radial-gradient(circle at 5% 0%,rgba(82,167,173,.12),transparent 30rem),linear-gradient(180deg,#101416 0%,#0b0e0f 32rem);
    color:var(--text-main);
}
html[data-theme="dark"] .app-view--admin {
    --role-accent:var(--tomato-jam-400);
    --role-accent-dark:#ef9b8d;
    --role-soft:rgba(203,75,52,.14);
}
html[data-theme="dark"] .app-view--client {
    --role-accent:var(--tropical-teal-400);
    --role-accent-dark:var(--tropical-teal-300);
    --role-soft:rgba(82,167,173,.15);
}
html[data-theme="dark"] .app-view--operator {
    --role-accent:var(--vanilla-custard-400);
    --role-accent-dark:var(--vanilla-custard-200);
    --role-soft:rgba(226,177,29,.13);
}

html[data-theme="dark"] .card-clean,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .identity-detail,
html[data-theme="dark"] .policy-document,
html[data-theme="dark"] .gear-reveal,
html[data-theme="dark"] .task-board,
html[data-theme="dark"] .bg-white {
    color:var(--text-main);
    background:var(--bg-card) !important;
    border-color:var(--border-light);
}
html[data-theme="dark"] .identity-system { background:linear-gradient(145deg,#171b1d,#101314); border-color:var(--border-light); }
html[data-theme="dark"] .portal-hero-visual { background:linear-gradient(150deg,#183033,#15191a 58%,#29230f); border-color:#5b6265; }
html[data-theme="dark"] .portal-visual-tag { color:#e7e1dd; background:rgba(25,30,32,.92); border-color:rgba(255,255,255,.14); }
html[data-theme="dark"] .portal-visual-tag span { color:var(--tomato-jam-300); }
html[data-theme="dark"] .gear-reveal { color:var(--text-main); }
html[data-theme="dark"] .gear-reveal p,
html[data-theme="dark"] .hero-content p,
html[data-theme="dark"] .history-heading p,
html[data-theme="dark"] .portal-hero-copy > p,
html[data-theme="dark"] .portal-hero-kicker,
html[data-theme="dark"] .identity-intro,
html[data-theme="dark"] .equipment-card p { color:var(--text-muted); }
html[data-theme="dark"] .equipment-card p strong,
html[data-theme="dark"] .portal-text-link,
html[data-theme="dark"] .portal-proof strong,
html[data-theme="dark"] .app-view--operator .task-row h5 a { color:var(--text-dark) !important; }
html[data-theme="dark"] .portal-section-heading p,
html[data-theme="dark"] .identity-detail p,
html[data-theme="dark"] .identity-hint,
html[data-theme="dark"] .service-card p,
html[data-theme="dark"] .policy-document p,
html[data-theme="dark"] .equipment-card p,
html[data-theme="dark"] .app-view label { color:var(--text-muted); }
html[data-theme="dark"] .service-card h3,
html[data-theme="dark"] .policy-document p:first-child,
html[data-theme="dark"] .connected-gear.is-active > span,
html[data-theme="dark"] .contact-map-label { color:var(--text-dark); }
html[data-theme="dark"] .page-kicker,
html[data-theme="dark"] .history-eyebrow,
html[data-theme="dark"] .identity-eyebrow,
html[data-theme="dark"] .portal-section-heading > span,
html[data-theme="dark"] .tracking-result__code { color:var(--tomato-jam-300); }
html[data-theme="dark"] .identity-detail span,
html[data-theme="dark"] .tracking-equipment-mark,
html[data-theme="dark"] .tracking-current-work__progress { color:var(--tropical-teal-300); }
html[data-theme="dark"] .connected-gear--large { color:var(--tropical-teal-300); }
html[data-theme="dark"] .connected-gear--medium { color:var(--tomato-jam-300); }
html[data-theme="dark"] .connected-gear--small { color:var(--vanilla-custard-300); }
html[data-theme="dark"] .gear-feature:nth-child(3) .gear-feature-svg { color:var(--shadow-grey-300); }
html[data-theme="dark"] .contact-map-label { background:rgba(27,31,33,.94); border-color:var(--border-light); }
html[data-theme="dark"] .service-card-top span { color:#a9a1a3; }
html[data-theme="dark"] body:not(.app-view) .btn-primary { color:#fff; background:var(--tomato-jam-700); border-color:var(--tomato-jam-700); }
html[data-theme="dark"] body:not(.app-view) .btn-primary:hover,
html[data-theme="dark"] body:not(.app-view) .btn-primary:focus { background:var(--tomato-jam-600); border-color:var(--tomato-jam-600); }
html[data-theme="dark"] .app-view--admin .btn-primary,
html[data-theme="dark"] .app-view--admin .btn-outline:hover { color:#fff; background:var(--tomato-jam-700); border-color:var(--tomato-jam-700); }
html[data-theme="dark"] .app-view--client .btn-primary,
html[data-theme="dark"] .app-view--client .btn-outline:hover { color:#fff; background:var(--tropical-teal-700); border-color:var(--tropical-teal-700); }
html[data-theme="dark"] .app-view--operator .btn-primary,
html[data-theme="dark"] .app-view--operator .btn-outline:hover { color:#17130a; background:var(--vanilla-custard-400); border-color:var(--vanilla-custard-400); }
html[data-theme="dark"] .operator-project__label { color:var(--vanilla-custard-300); }
html[data-theme="dark"] .portal-proof,
html[data-theme="dark"] .portal-proof div + div { border-color:var(--border-light); }

html[data-theme="dark"] .input-minimal,
html[data-theme="dark"] .form-group input,
html[data-theme="dark"] .form-group textarea,
html[data-theme="dark"] .form-group select,
html[data-theme="dark"] .toolbar input,
html[data-theme="dark"] .toolbar select,
html[data-theme="dark"] .inline-pred-dropdown,
html[data-theme="dark"] .diag-zoom-btn,
html[data-theme="dark"] .diag-pb-btn {
    color:var(--text-main);
    background:#141819;
    border-color:var(--border-light);
}
html[data-theme="dark"] .input-minimal::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] input::placeholder { color:#8f8789; }
html[data-theme="dark"] .input-minimal:disabled { color:#8f8789; background:#202426; }
html[data-theme="dark"] option { color:var(--text-main); background:#141819; }

html[data-theme="dark"] .table-clean th { color:#c8c0c2; background:#182526; }
html[data-theme="dark"] .table-clean td { border-color:var(--border-light); }
html[data-theme="dark"] .table-clean tbody tr:hover,
html[data-theme="dark"] .task-row:hover { background:rgba(82,167,173,.10); }
html[data-theme="dark"] .table-shell { border-color:var(--border-light); }
html[data-theme="dark"] .operator-filter { background:rgba(226,177,29,.08); border-color:rgba(226,177,29,.25); }

html[data-theme="dark"] .bg-graphite-50,
html[data-theme="dark"] .bg-graphite-100,
html[data-theme="dark"] .bg-tropical-50 { background-color:#202527 !important; }
html[data-theme="dark"] .bg-green-50 { background-color:rgba(45,106,79,.2) !important; }
html[data-theme="dark"] .bg-red-50 { background-color:rgba(192,57,43,.18) !important; }
html[data-theme="dark"] .text-graphite-300,
html[data-theme="dark"] .text-graphite-400,
html[data-theme="dark"] .text-graphite-500 { color:#b7aeb0 !important; }
html[data-theme="dark"] .text-graphite-700,
html[data-theme="dark"] .text-graphite-900 { color:#eee9e6 !important; }
html[data-theme="dark"] .text-tropical-700 { color:#97cace !important; }
html[data-theme="dark"] .text-green-700 { color:#83c7a5 !important; }
html[data-theme="dark"] .text-red-600,
html[data-theme="dark"] .text-red-700 { color:#ef9b8d !important; }
html[data-theme="dark"] .border-graphite-100 { border-color:var(--border-light) !important; }

html[data-theme="dark"] .badge-status.secondary,
html[data-theme="dark"] .st-cotizada,
html[data-theme="dark"] .badge-status.cotizada { color:#d9d2d3; background:#303638; }
html[data-theme="dark"] .badge-status.success { color:#9bd3b4; background:rgba(45,106,79,.25); }
html[data-theme="dark"] .badge-status.danger { color:#f0a095; background:rgba(192,57,43,.23); }
html[data-theme="dark"] .badge-status.info,
html[data-theme="dark"] .st-maquinado,
html[data-theme="dark"] .badge-status.maquinado { color:#badcde; background:rgba(82,167,173,.18); }
html[data-theme="dark"] .st-pendiente,
html[data-theme="dark"] .badge-status.pendiente { color:#f3e0a5; background:rgba(226,177,29,.15); }

html[data-theme="dark"] .diag-zoom-panel { background:rgba(20,24,25,.94); }
html[data-theme="dark"] .rc-banner-path,
html[data-theme="dark"] .ruta-critica { color:#ef9b8d; background:rgba(192,57,43,.14); }
html[data-theme="dark"] .rc-banner-note,
html[data-theme="dark"] .fila-edicion { color:#f3e0a5; background:rgba(226,177,29,.1) !important; }
html[data-theme="dark"] .calc-pert-result-box { background:rgba(45,106,79,.16); }
html[data-theme="dark"] .rc-leyenda,
html[data-theme="dark"] .gantt-leyenda,
html[data-theme="dark"] .calc-pert-formula-box { color:var(--text-muted); }

html[data-theme="dark"] .theme-toggle--standalone { color:var(--vanilla-custard-300); background:var(--bg-card); }

body,
.card-clean,
.stat-card,
.login-card,
.input-minimal,
.table-clean th,
.table-clean tbody tr,
.identity-system,
.identity-detail,
.service-card,
.policy-document {
    transition:background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease;
}

@media (prefers-reduced-motion: reduce) {
    body,
    .card-clean,
    .stat-card,
    .login-card,
    .input-minimal,
    .table-clean th,
    .table-clean tbody tr,
    .identity-system,
    .identity-detail,
    .service-card,
    .policy-document,
    .theme-toggle { transition-duration:.01ms !important; }
}

/* ======================== EXPERIENCIA DEL OPERADOR ======================== */
.operator-queue { max-width:76rem; }
.operator-page-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; margin-bottom:1.5rem; }
.operator-page-heading h2 { margin:0; font-size:clamp(2rem,4vw,3.2rem); }
.operator-page-heading p { margin:.45rem 0 0; color:var(--text-muted); }
.operator-shift { display:inline-flex; align-items:center; gap:.65rem; padding:.7rem .9rem; color:var(--text-muted); background:var(--bg-card); border:1px solid var(--border-light); border-radius:.85rem; box-shadow:var(--shadow-soft); font-size:.8rem; }
.operator-shift svg { width:1rem; color:var(--vanilla-custard-600); }
.operator-shift strong { color:var(--text-dark); text-transform:capitalize; }
.operator-alert { display:flex; align-items:flex-start; gap:.7rem; margin-bottom:1rem; padding:.9rem 1rem; border:1px solid; border-radius:.9rem; }
.operator-alert svg { width:1.15rem; flex:0 0 auto; }
.operator-alert--error { color:#a83226; background:#fdecea; border-color:#f3b8b1; }

.operator-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin-bottom:1rem; }
.operator-summary__item { min-width:0; display:flex; align-items:center; gap:.8rem; padding:1rem; color:var(--text-main); text-align:left; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1rem; box-shadow:var(--shadow-soft); cursor:pointer; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.operator-summary__item:hover { transform:translateY(-2px); border-color:var(--vanilla-custard-400); box-shadow:var(--shadow-lifted); }
.operator-summary__item.is-selected { border-color:var(--vanilla-custard-500); box-shadow:0 0 0 3px rgba(226,177,29,.14); }
.operator-summary__icon { width:2.55rem; height:2.55rem; flex:0 0 auto; display:grid; place-items:center; color:var(--shadow-grey-700); background:var(--shadow-grey-100); border-radius:.8rem; }
.operator-summary__icon svg { width:1.15rem; }
.operator-summary__item--pending .operator-summary__icon { color:#876a12; background:var(--vanilla-custard-100); }
.operator-summary__item--progress .operator-summary__icon { color:#7a2d1f; background:var(--tomato-jam-100); }
.operator-summary__item--done .operator-summary__icon { color:#256447; background:#e6f4ec; }
.operator-summary__item strong,.operator-summary__item small { display:block; }
.operator-summary__item strong { color:var(--text-dark); font-family:var(--font-display); font-size:1.55rem; line-height:1; }
.operator-summary__item small { margin-top:.2rem; color:var(--text-muted); font-size:.7rem; }

.operator-toolbar { display:flex; align-items:center; gap:.65rem; margin-bottom:1.35rem; padding:.65rem; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1rem; box-shadow:var(--shadow-soft); }
.operator-search { min-width:12rem; flex:1; display:flex; align-items:center; gap:.55rem; padding:0 .8rem; color:var(--text-muted) !important; background:var(--bg-soft); border:1px solid transparent; border-radius:.75rem; }
.operator-search:focus-within { border-color:var(--vanilla-custard-500); box-shadow:0 0 0 3px rgba(226,177,29,.12); }
.operator-search svg { width:1rem; }
.operator-search input,.operator-state-filter select { width:100%; min-height:2.65rem; color:var(--text-main); background:transparent; border:0; outline:0; }
.operator-state-filter { min-width:12rem; }
.operator-state-filter select { padding:0 .75rem; background:var(--bg-soft); border:1px solid transparent; border-radius:.75rem; }
.operator-state-filter select:focus { border-color:var(--vanilla-custard-500); }
.operator-clear-filter { min-height:2.65rem; display:inline-flex; align-items:center; gap:.35rem; padding:0 .75rem; color:var(--text-muted); background:transparent; border:0; border-radius:.7rem; cursor:pointer; }
.operator-clear-filter:hover { color:var(--text-dark); background:var(--bg-soft); }
.operator-clear-filter svg { width:.9rem; }

.operator-project-list { display:grid; gap:1rem; }
.operator-project { overflow:hidden; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1.15rem; box-shadow:var(--shadow-soft); }
.operator-project__heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.15rem; background:linear-gradient(90deg,rgba(226,177,29,.08),transparent); border-bottom:1px solid var(--border-light); }
.operator-project__label { display:block; margin-bottom:.12rem; color:var(--vanilla-custard-700); font-size:.6rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.operator-project__heading h3 { margin:0; font-size:1.15rem; }
.operator-project__count { color:var(--text-muted); font-size:.72rem; }
.operator-task-list { padding:.5rem; }
.operator-task { position:relative; min-height:8.1rem; display:grid; grid-template-columns:.28rem minmax(0,1fr) auto; align-items:center; overflow:hidden; border:1px solid transparent; border-radius:.9rem; transition:background .2s ease,border-color .2s ease,transform .2s ease; }
.operator-task + .operator-task { margin-top:.35rem; }
.operator-task:hover { background:var(--bg-soft); border-color:var(--border-light); transform:translateX(3px); }
.operator-task__state { width:.28rem; align-self:stretch; margin:.85rem 0; background:var(--shadow-grey-300); border-radius:99px; }
.operator-task--en_progreso .operator-task__state { background:var(--tomato-jam-500); }
.operator-task--completada .operator-task__state { background:#2d6a4f; }
.operator-task--bloqueada .operator-task__state { background:var(--vanilla-custard-500); }
.operator-task--en_revision .operator-task__state { background:var(--tropical-teal-500); }
.operator-task__content { min-width:0; padding:1rem 1.15rem; }
.operator-task__topline { display:flex; align-items:center; gap:.55rem; margin-bottom:.5rem; }
.operator-task__percentage { color:var(--text-muted); font-size:.72rem; font-weight:700; }
.operator-task h4 { margin:0; font-size:1.12rem; }
.operator-task p { max-width:58rem; margin:.35rem 0 .75rem; overflow:hidden; color:var(--text-muted); font-size:.8rem; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.operator-task__progress { width:100%; max-width:24rem; height:.34rem; overflow:hidden; background:var(--border-light); border-radius:99px; }
.operator-task__progress span { height:100%; display:block; background:linear-gradient(90deg,var(--vanilla-custard-500),var(--tomato-jam-500)); border-radius:inherit; }
.operator-task__action { min-width:8.75rem; min-height:2.8rem; align-self:center; display:flex; align-items:center; justify-content:center; gap:.45rem; margin-right:1rem; padding:.7rem 1rem; color:var(--shadow-grey-900); background:var(--vanilla-custard-300); border-radius:.75rem; font-size:.78rem; font-weight:700; transition:background .2s ease,gap .2s ease; }
.operator-task__action:hover { gap:.7rem; background:var(--vanilla-custard-400); }
.operator-task__action svg { width:1rem; }
.operator-empty { padding:4rem 1rem; text-align:center; color:var(--text-muted); background:var(--bg-card); border:1px dashed var(--border-light); border-radius:1.15rem; }
.operator-empty > span { width:4rem; height:4rem; margin:0 auto 1rem; display:grid; place-items:center; color:#256447; background:#e6f4ec; border-radius:50%; }
.operator-empty h3 { margin:0 0 .3rem; }
.operator-empty p { margin:0; }

.operator-detail { max-width:76rem; }
.operator-back { width:max-content; display:inline-flex; align-items:center; gap:.45rem; margin-bottom:1rem; padding:.58rem .8rem; color:var(--text-main); background:var(--bg-card); border:1px solid var(--border-light); border-radius:.75rem; box-shadow:var(--shadow-soft); font-size:.78rem; font-weight:650; }
.operator-back:hover { color:var(--vanilla-custard-700); border-color:var(--vanilla-custard-500); transform:translateX(-2px); }
.operator-back svg { width:1rem; }
.operator-detail__hero { display:flex; align-items:flex-start; justify-content:space-between; gap:2rem; margin-bottom:1rem; padding:clamp(1.2rem,3vw,2rem); color:#fff; background:linear-gradient(130deg,var(--shadow-grey-950),#2d2924); border:1px solid rgba(255,255,255,.1); border-radius:1.2rem; box-shadow:var(--shadow-lifted); }
.operator-detail__eyebrow { display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom:.6rem; color:var(--vanilla-custard-300); font-size:.65rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.operator-detail__hero h2 { max-width:18ch; margin:0; color:#fff; font-size:clamp(2rem,4vw,3.5rem); }
.operator-detail__hero p { max-width:48rem; margin:.7rem 0 0; color:var(--shadow-grey-300); }
.operator-detail__status { min-width:8rem; display:flex; flex-direction:column; align-items:flex-end; }
.operator-detail__status > strong { margin-top:.8rem; color:#fff; font-family:var(--font-display); font-size:2.5rem; line-height:1; }
.operator-detail__status > small { margin-top:.25rem; color:var(--shadow-grey-300); font-size:.65rem; }
.operator-progress-card { margin-bottom:1rem; padding:1rem 1.2rem; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1rem; box-shadow:var(--shadow-soft); }
.operator-progress-card > div:first-child { display:flex; align-items:center; gap:.8rem; }
.operator-progress-card__icon { width:2.8rem; height:2.8rem; flex:0 0 auto; display:grid; place-items:center; color:#876a12; background:var(--vanilla-custard-100); border-radius:.8rem; }
.operator-progress-card__icon svg { width:1.2rem; }
.operator-progress-card h3 { margin:0; font-size:1rem; }
.operator-progress-card p { margin:.2rem 0 0; color:var(--text-muted); font-size:.75rem; line-height:1.4; }
.operator-progress-track { height:.6rem; margin-top:.85rem; overflow:hidden; background:var(--border-light); border-radius:99px; }
.operator-progress-track span { height:100%; display:block; background:linear-gradient(90deg,var(--vanilla-custard-500),var(--tomato-jam-500)); border-radius:inherit; transition:width .35s ease; }
.operator-detail__layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(18rem,22rem); align-items:start; gap:1rem; }
.operator-checklist-card,.operator-action-panel__inner { background:var(--bg-card); border:1px solid var(--border-light); border-radius:1.1rem; box-shadow:var(--shadow-soft); }
.operator-checklist-card { overflow:hidden; scroll-margin-top:5rem; }
.operator-section-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.15rem 1.25rem; border-bottom:1px solid var(--border-light); }
.operator-section-heading h3 { margin:0; font-size:1.35rem; }
.operator-section-heading > span { color:var(--text-muted); font-size:.72rem; }
.operator-checklist { padding:.55rem; }
.operator-step { display:grid; grid-template-columns:2.2rem minmax(0,1fr) auto; align-items:center; gap:.8rem; padding:.8rem; border:1px solid transparent; border-radius:.85rem; transition:background .2s ease,border-color .2s ease; }
.operator-step + .operator-step { margin-top:.3rem; }
.operator-step:hover { background:var(--bg-soft); border-color:var(--border-light); }
.operator-step.is-complete { background:rgba(45,106,79,.07); }
.operator-step__number { width:2.15rem; height:2.15rem; display:grid; place-items:center; color:var(--text-muted); background:var(--bg-soft); border:1px solid var(--border-light); border-radius:50%; font-size:.75rem; font-weight:700; }
.operator-step.is-complete .operator-step__number { color:#fff; background:#2d6a4f; border-color:#2d6a4f; }
.operator-step__copy { min-width:0; }
.operator-step__copy strong,.operator-step__copy small { display:block; }
.operator-step__copy strong { color:var(--text-dark); font-size:.84rem; }
.operator-step__copy small { margin-top:.15rem; color:var(--text-muted); font-size:.65rem; }
.operator-step-form { margin:0; }
.operator-step__toggle { min-width:7.8rem; display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.55rem .7rem; color:var(--text-main); background:transparent; border:1px solid var(--border-light); border-radius:.7rem; cursor:pointer; font-size:.72rem; font-weight:650; }
.operator-step__toggle:hover { border-color:#2d6a4f; }
.operator-step__toggle.is-complete { color:#256447; background:#e6f4ec; border-color:#b8dcc8; }
.operator-step__toggle.is-saving { opacity:.65; }
.operator-step__toggle:disabled { opacity:.72; cursor:default; }
.operator-step__toggle svg { width:.9rem; }
.operator-checklist-empty { padding:3.5rem 1.2rem; text-align:center; color:var(--text-muted); }
.operator-checklist-empty > svg { width:2.4rem; height:2.4rem; margin:0 auto .7rem; color:var(--vanilla-custard-600); }
.operator-checklist-empty h4 { margin:0; }
.operator-checklist-empty p { margin:.35rem auto 0; font-size:.78rem; }
.operator-action-panel { position:sticky; top:5rem; }
.operator-action-panel__inner { padding:1.2rem; }
.operator-action-panel h3 { margin:0 0 .5rem; font-size:1.35rem; }
.operator-action-panel > div > p { margin:0 0 1rem; color:var(--text-muted); font-size:.8rem; line-height:1.55; }
.operator-action-form { margin:.55rem 0 0; }
.operator-primary-action { width:100%; min-height:3rem; }
.operator-secondary-action { width:100%; min-height:2.7rem; display:flex; align-items:center; justify-content:center; gap:.4rem; color:var(--text-muted); background:transparent; border:1px solid var(--border-light); border-radius:.7rem; cursor:pointer; font-size:.75rem; }
.operator-secondary-action:hover { color:var(--text-dark); background:var(--bg-soft); }
.operator-secondary-action svg { width:.95rem; }
.operator-context { display:grid; gap:.6rem; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--border-light); }
.operator-context > div { min-width:0; display:flex; align-items:center; gap:.6rem; }
.operator-context svg { width:1rem; color:var(--vanilla-custard-600); }
.operator-context span,.operator-context small,.operator-context strong { min-width:0; display:block; }
.operator-context > div > span { flex:1; overflow:hidden; }
.operator-context small { color:var(--text-muted); font-size:.6rem; }
.operator-context strong { overflow:hidden; color:var(--text-dark); font-size:.72rem; text-overflow:ellipsis; white-space:nowrap; }
.operator-notifications { max-width:68rem; }
.operator-back--compact { margin:0; }
.operator-notification-list { display:grid; gap:.7rem; }
.operator-notification { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:1rem; padding:1rem; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1rem; box-shadow:var(--shadow-soft); }
.operator-notification.is-unread::before { content:""; position:absolute; left:-.22rem; top:1rem; bottom:1rem; width:.25rem; background:var(--vanilla-custard-500); border-radius:99px; }
.operator-notification__icon { width:2.8rem; height:2.8rem; display:grid; place-items:center; color:var(--text-muted); background:var(--bg-soft); border-radius:.8rem; }
.operator-notification__icon svg { width:1.15rem; }
.operator-notification__icon.is-alert { color:#a83226; background:#fdecea; }
.operator-notification__icon.is-task { color:#876a12; background:var(--vanilla-custard-100); }
.operator-notification__icon.is-info { color:var(--tropical-teal-700); background:var(--tropical-teal-50); }
.operator-notification__copy { min-width:0; }
.operator-notification__copy > div { display:flex; align-items:center; flex-wrap:wrap; gap:.55rem; }
.operator-notification__copy small { color:var(--text-muted); font-size:.62rem; }
.operator-notification h3 { margin:.5rem 0 .2rem; font-size:1rem; }
.operator-notification p { margin:0; color:var(--text-muted); font-size:.75rem; line-height:1.5; }
.operator-notification__action { margin:0; }
.operator-notification__action button { min-height:2.45rem; display:inline-flex; align-items:center; gap:.35rem; padding:.55rem .75rem; color:var(--text-main); background:var(--bg-soft); border:1px solid var(--border-light); border-radius:.7rem; cursor:pointer; font-size:.7rem; font-weight:650; }
.operator-notification__action button:hover { border-color:var(--vanilla-custard-500); }
.operator-notification__action button:disabled { opacity:.65; cursor:wait; }
.operator-notification__action svg { width:.9rem; }

/* ======================== RASTREO PUBLICO ======================== */
.tracking-shell { max-width:74rem; padding-top:clamp(2.5rem,6vw,5rem); padding-bottom:5rem; }
.tracking-heading { max-width:48rem; margin:0 auto 1.5rem; text-align:center; }
.tracking-heading h1 { margin:0; font-size:clamp(2.4rem,5vw,4.4rem); line-height:.95; }
.tracking-heading p { max-width:42rem; margin:.85rem auto 0; color:var(--text-muted); }
.tracking-search { margin:0 auto 1.25rem; padding:1.25rem; color:#fff; background:linear-gradient(135deg,var(--tropical-teal-950),var(--shadow-grey-950)); border:1px solid rgba(255,255,255,.12); border-radius:1.2rem; box-shadow:0 20px 55px rgba(11,23,24,.24); }
.tracking-search__intro { display:flex; align-items:center; gap:.8rem; margin-bottom:1rem; }
.tracking-search__icon { width:2.9rem; height:2.9rem; flex:0 0 auto; display:grid; place-items:center; color:var(--tropical-teal-200); background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); border-radius:.85rem; }
.tracking-search__icon svg { width:1.3rem; }
.tracking-search h2 { margin:0; color:#fff; font-size:1.3rem; }
.tracking-search__intro p { margin:.15rem 0 0; color:var(--shadow-grey-300); font-size:.75rem; line-height:1.45; }
.tracking-form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:.75rem; }
.tracking-field { color:var(--shadow-grey-200); font-size:.66rem; font-weight:650; letter-spacing:.04em; }
.tracking-field > span:first-child { display:block; margin-bottom:.38rem; }
.tracking-input-wrap { min-height:3rem; display:flex; align-items:center; gap:.55rem; padding:0 .8rem; color:var(--shadow-grey-300); background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.18); border-radius:.8rem; transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.tracking-input-wrap:focus-within { background:rgba(255,255,255,.11); border-color:var(--tropical-teal-300); box-shadow:0 0 0 3px rgba(116,185,190,.15); }
.tracking-input-wrap > svg { width:1rem; flex:0 0 auto; }
.tracking-input-wrap input { min-width:0; flex:1; color:#fff; background:transparent; border:0; outline:0; font-size:.82rem; }
.tracking-input-wrap input::placeholder { color:var(--shadow-grey-400); }
.tracking-input-wrap button { width:2rem; height:2rem; display:grid; place-items:center; color:var(--shadow-grey-300); background:transparent; border:0; border-radius:.5rem; cursor:pointer; }
.tracking-input-wrap button:hover { color:#fff; background:rgba(255,255,255,.08); }
.tracking-input-wrap button svg { width:1rem; }
.tracking-submit { min-height:3rem; display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:0 1.15rem; color:var(--shadow-grey-950); background:var(--vanilla-custard-400); border:1px solid var(--vanilla-custard-400); border-radius:.8rem; cursor:pointer; font-size:.78rem; font-weight:750; transition:transform .2s ease,background .2s ease; }
.tracking-submit:hover { background:var(--vanilla-custard-300); transform:translateY(-1px); }
.tracking-submit:disabled { opacity:.65; cursor:wait; transform:none; }
.tracking-submit svg { width:1rem; }
.tracking-privacy { display:flex; align-items:center; gap:.35rem; margin:.8rem 0 0; color:var(--shadow-grey-400); font-size:.62rem; line-height:1.3; }
.tracking-privacy svg { width:.8rem; }

.tracking-result { overflow:hidden; background:var(--bg-card); border:1px solid var(--border-light); border-radius:1.25rem; box-shadow:var(--shadow-lifted); }
.tracking-result__header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:1rem; padding:1.4rem; border-bottom:1px solid var(--border-light); }
.tracking-equipment-mark { width:4rem; height:4rem; display:grid; place-items:center; color:var(--tropical-teal-700); background:var(--tropical-teal-50); border-radius:1rem; }
.tracking-equipment-mark svg { width:1.8rem; height:1.8rem; }
.tracking-result__identity { min-width:0; }
.tracking-result__code { display:block; margin-bottom:.25rem; color:var(--tomato-jam-600); font-size:.62rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.tracking-result__identity h2 { margin:0; font-size:1.65rem; }
.tracking-result__identity p { margin:.3rem 0 0; overflow:hidden; color:var(--text-muted); font-size:.75rem; text-overflow:ellipsis; white-space:nowrap; }
.tracking-status { display:inline-flex; align-items:center; gap:.4rem; padding:.55rem .7rem; border-radius:99px; font-size:.65rem; font-weight:750; letter-spacing:.03em; text-transform:uppercase; }
.tracking-status svg { width:.85rem; }
.tracking-status--active { color:#876a12; background:var(--vanilla-custard-100); }
.tracking-status--ready { color:#256447; background:#e6f4ec; }
.tracking-status--alert { color:#a83226; background:#fdecea; }
.tracking-progress-block { padding:1.25rem 1.4rem; background:linear-gradient(90deg,rgba(82,167,173,.08),transparent); border-bottom:1px solid var(--border-light); }
.tracking-progress-block__copy { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; }
.tracking-progress-block__copy span,.tracking-progress-block__copy strong { display:block; }
.tracking-progress-block__copy span { margin-bottom:.2rem; color:var(--text-muted); font-size:.64rem; }
.tracking-progress-block__copy > div strong { color:var(--text-dark); font-size:.9rem; }
.tracking-progress-block__copy > strong { color:var(--tropical-teal-700); font-family:var(--font-display); font-size:2rem; line-height:1; }
.tracking-progress { height:.72rem; margin-top:.75rem; overflow:hidden; background:var(--border-light); border-radius:99px; }
.tracking-progress span { height:100%; display:block; background:linear-gradient(90deg,var(--tropical-teal-500),var(--tomato-jam-500)); border-radius:inherit; }
.tracking-progress-block > p { margin:.45rem 0 0; color:var(--text-muted); font-size:.62rem; text-align:right; }
.tracking-no-project { display:flex; align-items:center; gap:.75rem; padding:1.2rem 1.4rem; color:var(--text-muted); background:var(--bg-soft); border-bottom:1px solid var(--border-light); }
.tracking-no-project > svg { width:1.5rem; color:var(--tropical-teal-600); }
.tracking-no-project strong,.tracking-no-project span { display:block; }
.tracking-no-project strong { color:var(--text-dark); font-size:.82rem; }
.tracking-no-project span { margin-top:.15rem; font-size:.7rem; }
.tracking-info-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-bottom:1px solid var(--border-light); }
.tracking-info-grid article { min-width:0; padding:1.15rem; border-right:1px solid var(--border-light); }
.tracking-info-grid article:last-child { border-right:0; }
.tracking-info-grid svg { width:1rem; margin-bottom:.6rem; color:var(--tomato-jam-500); }
.tracking-info-grid span,.tracking-info-grid strong { display:block; }
.tracking-info-grid span { color:var(--text-muted); font-size:.6rem; }
.tracking-info-grid strong { margin-top:.25rem; overflow:hidden; color:var(--text-dark); font-size:.75rem; text-overflow:ellipsis; white-space:nowrap; }
.tracking-activity { padding:1.4rem; }
.tracking-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.tracking-section-heading h3 { margin:0; font-size:1.4rem; }
.tracking-section-heading > span { color:var(--text-muted); font-size:.68rem; }
.tracking-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:.65rem; margin-bottom:1rem; }
.tracking-metrics article { padding:.8rem; background:var(--bg-soft); border:1px solid var(--border-light); border-radius:.8rem; }
.tracking-metrics strong,.tracking-metrics span { display:block; }
.tracking-metrics strong { color:var(--text-dark); font-family:var(--font-display); font-size:1.35rem; }
.tracking-metrics span { color:var(--text-muted); font-size:.62rem; }
.tracking-current-work { overflow:hidden; border:1px solid var(--border-light); border-radius:.9rem; }
.tracking-current-work h4 { margin:0; padding:.75rem 1rem; font-size:.82rem; background:var(--bg-soft); border-bottom:1px solid var(--border-light); }
.tracking-current-work article { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.7rem; padding:.75rem 1rem; }
.tracking-current-work article + article { border-top:1px solid var(--border-light); }
.tracking-current-work__icon { width:2.1rem; height:2.1rem; display:grid; place-items:center; color:var(--tropical-teal-700); background:var(--tropical-teal-50); border-radius:.65rem; }
.tracking-current-work__icon svg { width:.9rem; }
.tracking-current-work article strong,.tracking-current-work article div span { display:block; }
.tracking-current-work article strong { color:var(--text-dark); font-size:.76rem; }
.tracking-current-work article div span { margin-top:.15rem; color:var(--text-muted); font-size:.6rem; text-transform:capitalize; }
.tracking-current-work__progress { color:var(--tropical-teal-700); font-size:.72rem; font-weight:750; }
.tracking-all-done { display:flex; align-items:center; gap:.65rem; padding:1rem; color:#256447; background:#e6f4ec; border:1px solid #b8dcc8; border-radius:.9rem; font-size:.72rem; }
.tracking-all-done svg { width:1.2rem; }
.tracking-all-done strong { display:block; }
.tracking-all-done--neutral { color:var(--text-muted); background:var(--bg-soft); border-color:var(--border-light); }
.tracking-message { display:flex; align-items:flex-start; gap:1rem; padding:1.4rem; background:var(--bg-card); border:1px solid; border-radius:1.1rem; box-shadow:var(--shadow-soft); }
.tracking-message > span { width:3rem; height:3rem; flex:0 0 auto; display:grid; place-items:center; border-radius:.8rem; }
.tracking-message svg { width:1.3rem; }
.tracking-message h2 { margin:0; font-size:1.2rem; }
.tracking-message p { margin:.35rem 0 0; color:var(--text-muted); font-size:.75rem; line-height:1.5; }
.tracking-message--error { border-color:#f0b2aa; }
.tracking-message--error > span { color:#a83226; background:#fdecea; }
.tracking-guide { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:1rem; margin-top:1.25rem; padding:1rem; color:var(--text-muted); }
.tracking-guide > div { display:flex; align-items:center; gap:.65rem; }
.tracking-guide > div > span { width:2rem; height:2rem; flex:0 0 auto; display:grid; place-items:center; color:var(--tropical-teal-700); background:var(--tropical-teal-50); border-radius:50%; font-size:.7rem; font-weight:750; }
.tracking-guide p,.tracking-guide strong { display:block; }
.tracking-guide p { margin:0; font-size:.67rem; line-height:1.4; }
.tracking-guide strong { color:var(--text-dark); }
.tracking-guide > svg { width:1rem; color:var(--border-light); }

/* ======================== TEMA OSCURO: COBERTURA Y CONTRASTE ======================== */
html { color-scheme:light; }
html[data-theme="dark"] { color-scheme:dark; }
html[data-theme="dark"] hr { border-color:var(--border-light); }
html[data-theme="dark"] .card-clean:hover,
html[data-theme="dark"] .stat-card:hover { border-color:#4a5255; box-shadow:var(--shadow-lifted); }
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .workspace-empty,
html[data-theme="dark"] .operator-empty { color:var(--text-muted); background:rgba(27,31,33,.72); border-color:#42494c; }
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus { -webkit-text-fill-color:var(--text-main); box-shadow:0 0 0 1000px #141819 inset; caret-color:var(--text-main); }
html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator { filter:invert(1); opacity:.75; }
html[data-theme="dark"] .operator-alert--error,
html[data-theme="dark"] .tracking-message--error > span { color:#ffb0a4; background:rgba(192,57,43,.18); border-color:rgba(224,147,133,.4); }
html[data-theme="dark"] .operator-summary__item,
html[data-theme="dark"] .operator-toolbar,
html[data-theme="dark"] .operator-project,
html[data-theme="dark"] .operator-progress-card,
html[data-theme="dark"] .operator-checklist-card,
html[data-theme="dark"] .operator-action-panel__inner,
html[data-theme="dark"] .operator-back,
html[data-theme="dark"] .operator-notification,
html[data-theme="dark"] .tracking-result,
html[data-theme="dark"] .tracking-message { background:var(--bg-card); border-color:var(--border-light); }
html[data-theme="dark"] .operator-summary__icon { color:#d9d2d3; background:#303638; }
html[data-theme="dark"] .operator-summary__item--pending .operator-summary__icon { color:#f3e0a5; background:rgba(226,177,29,.16); }
html[data-theme="dark"] .operator-summary__item--progress .operator-summary__icon { color:#f0a095; background:rgba(203,75,52,.18); }
html[data-theme="dark"] .operator-summary__item--done .operator-summary__icon,
html[data-theme="dark"] .operator-empty > span { color:#9bd3b4; background:rgba(45,106,79,.25); }
html[data-theme="dark"] .operator-search,
html[data-theme="dark"] .operator-state-filter select,
html[data-theme="dark"] .operator-task:hover,
html[data-theme="dark"] .operator-step:hover,
html[data-theme="dark"] .tracking-metrics article,
html[data-theme="dark"] .tracking-current-work h4,
html[data-theme="dark"] .tracking-no-project { background:#202527; }
html[data-theme="dark"] .operator-task__action { color:#171410; background:#e8c04a; }
html[data-theme="dark"] .operator-task__action:hover { background:#edd078; }
html[data-theme="dark"] .operator-step.is-complete { background:rgba(45,106,79,.13); }
html[data-theme="dark"] .operator-step__toggle.is-complete,
html[data-theme="dark"] .tracking-all-done { color:#9bd3b4; background:rgba(45,106,79,.22); border-color:rgba(131,199,165,.32); }
html[data-theme="dark"] .operator-progress-card__icon { color:#f3e0a5; background:rgba(226,177,29,.16); }
html[data-theme="dark"] .operator-notification__icon.is-alert { color:#f0a095; background:rgba(192,57,43,.2); }
html[data-theme="dark"] .operator-notification__icon.is-task { color:#f3e0a5; background:rgba(226,177,29,.16); }
html[data-theme="dark"] .operator-notification__icon.is-info { color:#97cace; background:rgba(82,167,173,.16); }
html[data-theme="dark"] .tracking-equipment-mark,
html[data-theme="dark"] .tracking-current-work__icon,
html[data-theme="dark"] .tracking-guide > div > span { color:#97cace; background:rgba(82,167,173,.16); }
html[data-theme="dark"] .tracking-status--active { color:#f3e0a5; background:rgba(226,177,29,.16); }
html[data-theme="dark"] .tracking-status--ready { color:#9bd3b4; background:rgba(45,106,79,.24); }
html[data-theme="dark"] .tracking-status--alert { color:#f0a095; background:rgba(192,57,43,.22); }
html[data-theme="dark"] .tracking-progress-block { background:linear-gradient(90deg,rgba(82,167,173,.12),transparent); }
html[data-theme="dark"] .tracking-progress-block__copy > strong,
html[data-theme="dark"] .tracking-current-work__progress { color:#97cace; }

/* Facturación: cada folio funciona como un estado de cuenta independiente. */
.invoice-list { display:grid; gap:1rem; }
.invoice-ledger { padding:0; overflow:hidden; }
.invoice-ledger__summary {
    display:grid; grid-template-columns:minmax(180px,1.5fr) repeat(3,minmax(105px,.7fr)) auto auto;
    align-items:center; gap:1rem; padding:1.1rem 1.25rem; cursor:pointer; list-style:none;
}
.invoice-ledger__summary::-webkit-details-marker { display:none; }
.invoice-ledger__summary > div:first-child { display:flex; flex-direction:column; min-width:0; }
.invoice-ledger__summary > div:first-child strong { font-size:1.05rem; }
.invoice-ledger__summary > div:first-child small { color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.invoice-ledger__amount { display:flex; flex-direction:column; }
.invoice-ledger__amount span,
.invoice-financials span { color:var(--text-muted); font-size:.75rem; }
.invoice-ledger__chevron { width:1.1rem; transition:transform .2s ease; }
.invoice-ledger[open] .invoice-ledger__chevron { transform:rotate(180deg); }
.invoice-ledger__body { padding:1.25rem; border-top:1px solid var(--border-light); }
.invoice-financials { display:grid; grid-template-columns:repeat(5,minmax(120px,1fr)); gap:.75rem; }
.invoice-financials > div { display:flex; flex-direction:column; padding:.85rem; border:1px solid var(--border-light); border-radius:.75rem; background:var(--bg-soft); }
.invoice-financials__balance { border-color:rgba(203,75,52,.28) !important; }
.invoice-financials__balance strong { color:var(--accent-blue); }
.invoice-paid-banner { display:flex; align-items:center; gap:.75rem; margin-top:1rem; padding:.9rem 1rem; border:1px solid rgba(45,106,79,.25); border-radius:.8rem; color:#245b44; background:#edf8f2; }
.invoice-paid-banner > svg { width:1.5rem; flex:0 0 auto; }
.invoice-paid-banner > div { display:flex; flex-direction:column; }
.invoice-paid-banner span { font-size:.82rem; }
.invoice-payments-table td:first-child { display:flex; flex-direction:column; }
.invoice-payments-table td:first-child small { color:var(--text-muted); }
.invoice-empty-payments { display:flex; align-items:center; gap:.65rem; padding:1rem; border:1px dashed var(--border-light); border-radius:.75rem; color:var(--text-muted); }
.invoice-empty-payments svg { width:1.2rem; }
.invoice-payment-context { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1rem; }
.invoice-payment-context span { display:flex; flex-direction:column; padding:.75rem; border-radius:.7rem; background:var(--bg-soft); }
html[data-theme="dark"] .invoice-paid-banner { color:#9bd3b4; background:rgba(45,106,79,.18); border-color:rgba(131,199,165,.3); }

/* Planeacion PERT-CPM por macrocomponentes */
.planning-back { display:inline-flex; align-items:center; gap:.4rem; margin-bottom:1rem; color:var(--text-muted); font-size:.75rem; font-weight:700; text-decoration:none; }
.planning-back svg { width:1rem; }
.planning-model-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem; }
.planning-model { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1rem; color:inherit; text-decoration:none; }
.planning-model__icon { width:3.2rem; height:3.2rem; display:grid; place-items:center; color:var(--tropical-teal-700); background:var(--tropical-teal-50); border-radius:.9rem; }
.planning-model__icon svg,.planning-model > svg { width:1.2rem; }
.planning-model h3 { margin:.15rem 0; }
.planning-model p,.planning-model small,.planning-heading p { margin:0; color:var(--text-muted); font-size:.72rem; }
.planning-two-columns { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); gap:1rem; align-items:start; }
.planning-time-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; }
.planning-help { color:var(--text-muted); font-size:.72rem; line-height:1.5; }
.planning-consensus { margin-bottom:1rem; background:linear-gradient(135deg,var(--tropical-teal-50),var(--bg-card)); }
.planning-consensus small,.planning-consensus strong,.planning-consensus p { display:block; }
.planning-consensus strong { margin:.35rem 0; color:var(--tropical-teal-700); font-family:var(--font-display); font-size:2rem; }
.planning-consensus p { margin:0; color:var(--text-muted); font-size:.72rem; }
.planning-section-title { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.planning-section-title small { color:var(--tomato-jam-600); font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.planning-section-title h3 { margin:.15rem 0 0; }
.planning-section-title > p { max-width:32rem; margin:0; color:var(--text-muted); font-size:.7rem; text-align:right; }
.planning-json { color:var(--text-muted); font-size:.7rem; line-height:1.45; }
.table-clean td small { display:block; margin-top:.18rem; color:var(--text-muted); font-size:.62rem; }
.planning-check { display:flex; align-items:center; gap:.5rem; margin:1rem 0; color:var(--text-main); font-size:.75rem; }
.planning-relations { display:grid; gap:.75rem; }
.planning-relations article { padding:.8rem; border:1px solid var(--border-light); border-radius:.8rem; }
.planning-relations article > div { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:.5rem; font-size:.72rem; }
.planning-relations article > div strong { padding:.25rem .45rem; color:var(--tomato-jam-700); background:var(--tomato-jam-50); border-radius:.4rem; }
.planning-relations article > p { color:var(--text-muted); font-size:.65rem; }
.planning-relations footer { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.planning-project-duration { text-align:right; }
.planning-project-duration span,.planning-project-duration strong { display:block; }
.planning-project-duration span { color:var(--text-muted); font-size:.65rem; }
.planning-project-duration strong { color:var(--tropical-teal-700); font-size:1.5rem; }
.planning-gantt { min-width:720px; overflow-x:auto; }
.planning-gantt__scale { display:flex; justify-content:space-between; margin-left:230px; padding:0 0 .45rem; color:var(--text-muted); font-size:.62rem; }
.planning-gantt__row { display:grid; grid-template-columns:220px minmax(360px,1fr) 80px; align-items:center; gap:.65rem; min-height:2.9rem; border-top:1px solid var(--border-light); }
.planning-gantt__row > div:first-child strong,.planning-gantt__row > div:first-child small { display:block; }
.planning-gantt__row > div:first-child strong { font-size:.72rem; }
.planning-gantt__row > div:first-child small { color:var(--text-muted); font-size:.6rem; }
.planning-gantt__track { position:relative; height:1.1rem; background:var(--bg-soft); border-radius:99px; }
.planning-gantt__track span { position:absolute; top:0; bottom:0; min-width:6px; background:var(--tropical-teal-500); border-radius:99px; }
.planning-gantt__track span.is-critical { background:var(--tomato-jam-500); box-shadow:0 0 0 2px rgba(203,75,52,.14); }
.planning-gantt__row em { color:var(--text-muted); font-size:.62rem; font-style:normal; }
.planning-critical-row td:first-child { color:var(--tomato-jam-600); font-weight:800; }
.planning-mapping-list { display:grid; gap:.8rem; }
.planning-mapping header,.planning-mapping footer { display:flex; align-items:center; gap:.65rem; flex-wrap:wrap; }
.planning-mapping header strong { flex:1; }
.planning-mapping p { color:var(--text-muted); font-size:.72rem; }
.planning-mapping footer form:first-child { display:flex; align-items:center; gap:.5rem; flex:1; }
.planning-mapping footer select { flex:1; min-width:220px; }
html[data-theme="dark"] .planning-model__icon { color:#97cace; background:rgba(82,167,173,.16); }
html[data-theme="dark"] .planning-consensus { background:linear-gradient(135deg,rgba(82,167,173,.12),var(--bg-card)); }
@media(max-width:800px) { .planning-two-columns { grid-template-columns:1fr; } .planning-time-grid { grid-template-columns:1fr; } .planning-section-title { align-items:flex-start; flex-direction:column; } .planning-section-title > p { text-align:left; } }

/* Revision supervisada de partidas del motor de inferencia */
.inference-heading { margin-bottom:1rem; }
.inference-stats { grid-template-columns:repeat(5,minmax(130px,1fr)); }
.inference-stats .stat-value { color:var(--role-accent); }
.inference-filters { display:grid; grid-template-columns:minmax(180px,.8fr) minmax(190px,.8fr) minmax(250px,1.4fr) auto auto; align-items:end; gap:.75rem; margin-bottom:1rem; }
.inference-filters label,.inference-edit-grid label { display:grid; gap:.35rem; color:var(--text-muted); font-size:.68rem; font-weight:700; }
.inference-result-count { margin:.75rem 0; color:var(--text-muted); font-size:.7rem; }
.inference-list { display:grid; gap:.85rem; }
.inference-item { padding:1rem 1.1rem; }
.inference-item__header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.inference-item__header > div:first-child { display:flex; gap:.35rem; flex-wrap:wrap; }
.inference-source { text-align:right; }
.inference-source strong,.inference-source span { display:block; }
.inference-source strong { font-family:var(--font-mono,monospace); font-size:.75rem; }
.inference-source span { margin-top:.2rem; color:var(--text-muted); font-size:.62rem; }
.inference-description { margin:.85rem 0; font-size:.82rem; line-height:1.55; }
.inference-current { display:grid; grid-template-columns:minmax(250px,1.4fr) minmax(90px,.35fr) minmax(180px,.7fr); gap:.75rem; padding:.75rem; background:var(--bg-soft); border-radius:.75rem; }
.inference-current small,.inference-current strong { display:block; }
.inference-current small { color:var(--text-muted); font-size:.6rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.inference-current strong { margin-top:.3rem; font-size:.68rem; }
.inference-tags { display:flex; gap:.35rem; flex-wrap:wrap; margin-top:.3rem; }
.inference-tags span { padding:.25rem .45rem; color:var(--tropical-teal-700); background:var(--tropical-teal-50); border-radius:.4rem; font-size:.64rem; font-weight:700; }
.inference-tags em { color:var(--text-muted); font-size:.66rem; }
.inference-editor { margin-top:.75rem; border-top:1px solid var(--border-light); }
.inference-editor > summary { display:flex; align-items:center; gap:.4rem; padding-top:.75rem; color:var(--role-accent); font-size:.7rem; font-weight:800; cursor:pointer; list-style:none; }
.inference-editor > summary svg { width:1rem; }
.inference-editor form { margin-top:.85rem; }
.inference-editor fieldset { padding:0; border:0; }
.inference-editor legend { margin-bottom:.55rem; color:var(--text-muted); font-size:.65rem; font-weight:800; text-transform:uppercase; }
.inference-macro-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(185px,1fr)); gap:.45rem; }
.inference-macro-grid label { display:flex; align-items:center; gap:.5rem; padding:.55rem; border:1px solid var(--border-light); border-radius:.6rem; cursor:pointer; }
.inference-macro-grid label:has(input:checked) { border-color:var(--role-accent); background:var(--role-soft); }
.inference-macro-grid strong,.inference-macro-grid small { display:block; }
.inference-macro-grid strong { font-size:.67rem; }
.inference-macro-grid small { margin-top:.1rem; color:var(--text-muted); font-size:.55rem; }
.inference-edit-grid { display:grid; grid-template-columns:minmax(180px,.6fr) minmax(140px,.35fr) minmax(260px,1fr); gap:.75rem; margin-top:.8rem; }
.inference-edit-grid textarea { min-height:4.4rem; }
.inference-editor footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:.75rem; }
.inference-editor footer a { display:inline-flex; align-items:center; gap:.35rem; color:var(--text-muted); font-size:.68rem; font-weight:700; }
.inference-editor footer svg { width:1rem; }
.inference-history { display:grid; gap:.8rem; }
.inference-history article header,.inference-history article > div { display:flex; align-items:center; gap:.5rem; }
.inference-history article header { justify-content:space-between; margin-bottom:.7rem; }
.inference-history time { color:var(--text-muted); font-size:.65rem; }
.inference-history article > div svg { width:1rem; }
.inference-history dl { display:grid; grid-template-columns:150px minmax(0,1fr); gap:.45rem .8rem; margin:1rem 0 0; font-size:.7rem; }
.inference-history dt { color:var(--text-muted); font-weight:700; }
.inference-history dd { margin:0; overflow-wrap:anywhere; }
.project-macro-group__header td { padding-top:1rem; background:var(--bg-soft); }
.project-macro-assignment { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.project-macro-assignment > div { display:flex; align-items:center; gap:.55rem; flex-wrap:wrap; }
.project-macro-assignment small { color:var(--text-muted); font-size:.62rem; }
.project-macro-assignment form { display:flex; align-items:center; gap:.45rem; }
.project-macro-assignment form select { min-width:180px; }
.planning-expert-inline { display:grid; grid-template-columns:1fr 1fr auto; gap:.65rem; }
.planning-project-macros { display:grid; gap:1rem; }
.planning-project-macro > header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.planning-project-macro > header h3 { margin:.35rem 0 .1rem; }
.planning-project-macro > header small { color:var(--text-muted); font-size:.6rem; }
.planning-consensus-mini { text-align:right; }
.planning-consensus-mini span,.planning-consensus-mini strong,.planning-consensus-mini small { display:block; }
.planning-consensus-mini strong { margin:.2rem 0; color:var(--tropical-teal-700); font-size:1.3rem; }
.planning-project-macro details { margin:.8rem 0; }
.planning-project-macro summary { display:flex; align-items:center; gap:.4rem; color:var(--text-muted); font-size:.7rem; font-weight:700; cursor:pointer; }
.planning-project-macro summary svg { width:1rem; }
.planning-project-parts { display:grid; gap:.4rem; margin:.7rem 0; padding-left:1.25rem; }
.planning-project-parts li { display:grid; grid-template-columns:90px minmax(0,1fr) auto; gap:.6rem; padding:.45rem 0; border-bottom:1px solid var(--border-light); font-size:.68rem; }
.planning-project-parts small { color:var(--text-muted); }
.planning-project-estimates { display:grid; gap:.35rem; margin:.7rem 0; }
.planning-project-estimates > div { display:grid; grid-template-columns:minmax(140px,.6fr) 1fr auto; gap:.6rem; padding:.45rem .55rem; background:var(--bg-soft); border-radius:.5rem; font-size:.68rem; }
.planning-project-estimates em { color:var(--tropical-teal-700); font-style:normal; font-weight:800; }
.planning-project-estimate-form { display:grid; grid-template-columns:1.1fr repeat(4,.65fr) 1.5fr auto; gap:.45rem; align-items:end; }
html[data-theme="dark"] .inference-tags span { color:#97cace; background:rgba(82,167,173,.16); }
@media(max-width:1000px) { .inference-stats { grid-template-columns:repeat(3,1fr); } .inference-filters { grid-template-columns:1fr 1fr; } .inference-search { grid-column:1/-1; } .inference-edit-grid { grid-template-columns:1fr 1fr; } .inference-notes { grid-column:1/-1; } }
@media(max-width:1050px) { .planning-project-estimate-form { grid-template-columns:repeat(3,1fr); } }
@media(max-width:650px) { .inference-stats { grid-template-columns:1fr 1fr; } .inference-filters { grid-template-columns:1fr; } .inference-search { grid-column:auto; } .inference-item__header { flex-direction:column; } .inference-source { text-align:left; } .inference-current,.inference-edit-grid { grid-template-columns:1fr; } .inference-notes { grid-column:auto; } .inference-editor footer { align-items:stretch; flex-direction:column; } .inference-editor footer .btn-primary { width:100%; justify-content:center; } .inference-history dl { grid-template-columns:1fr; } .project-macro-assignment,.project-macro-assignment form { align-items:stretch; flex-direction:column; } .planning-expert-inline,.planning-project-estimate-form { grid-template-columns:1fr; } .planning-project-macro > header { flex-direction:column; } .planning-consensus-mini { text-align:left; } .planning-project-parts li,.planning-project-estimates > div { grid-template-columns:1fr; } }

@media (max-width:900px) {
    .invoice-ledger__summary { grid-template-columns:minmax(180px,1fr) repeat(2,minmax(100px,.6fr)) auto; }
    .invoice-ledger__amount:nth-of-type(2) { display:none; }
    .invoice-financials { grid-template-columns:repeat(3,1fr); }
}

@media (max-width:900px) {
    .operator-summary { grid-template-columns:repeat(2,1fr); }
    .operator-detail__layout { grid-template-columns:1fr; }
    .operator-action-panel { position:static; order:-1; }
    .tracking-form { grid-template-columns:1fr 1fr; }
    .tracking-submit { grid-column:1/-1; }
    .tracking-info-grid { grid-template-columns:repeat(2,1fr); }
    .tracking-info-grid article:nth-child(2) { border-right:0; }
    .tracking-info-grid article:nth-child(-n+2) { border-bottom:1px solid var(--border-light); }
}

@media (max-width:640px) {
    .invoice-ledger__summary { grid-template-columns:minmax(0,1fr) auto auto; gap:.65rem; }
    .invoice-ledger__amount { display:none; }
    .invoice-ledger__summary .badge-status { justify-self:end; }
    .invoice-financials { grid-template-columns:1fr 1fr; }
    .invoice-financials__balance { grid-column:1/-1; }
    .app-view--operator .workspace-banner { display:none; }
    .operator-page-heading { align-items:flex-start; flex-direction:column; }
    .operator-shift { width:100%; }
    .operator-summary { gap:.5rem; }
    .operator-summary__item { padding:.75rem; }
    .operator-summary__icon { width:2.25rem; height:2.25rem; }
    .operator-summary__item strong { font-size:1.3rem; }
    .operator-toolbar { align-items:stretch; flex-direction:column; }
    .operator-state-filter { min-width:0; }
    .operator-task { grid-template-columns:.22rem minmax(0,1fr); }
    .operator-task__action { grid-column:1/-1; width:calc(100% - 1.5rem); min-height:2.8rem; margin:0 .75rem .75rem; }
    .operator-detail__hero { flex-direction:column; }
    .operator-detail__status { width:100%; align-items:flex-start; }
    .operator-detail__status > strong { font-size:2rem; }
    .operator-step { grid-template-columns:2.1rem minmax(0,1fr); }
    .operator-step-form { grid-column:1/-1; }
    .operator-step__toggle { width:100%; }
    .operator-notification { grid-template-columns:auto minmax(0,1fr); align-items:start; }
    .operator-notification__action { grid-column:1/-1; }
    .operator-notification__action button { width:100%; justify-content:center; }
    .tracking-heading { text-align:left; }
    .tracking-form { grid-template-columns:1fr; }
    .tracking-submit { grid-column:auto; }
    .tracking-result__header { grid-template-columns:auto minmax(0,1fr); }
    .tracking-status { grid-column:1/-1; width:max-content; }
    .tracking-info-grid { grid-template-columns:1fr; }
    .tracking-info-grid article { border-right:0; border-bottom:1px solid var(--border-light); }
    .tracking-info-grid article:last-child { border-bottom:0; }
    .tracking-metrics { gap:.4rem; }
    .tracking-metrics article { padding:.65rem; }
    .tracking-guide { grid-template-columns:1fr; padding-inline:0; }
    .tracking-guide > svg { display:none; }
}

/* Planeación de proyecto: vista operativa progresiva */
.planning-project-page { display:grid; gap:1.15rem; }
.planning-project-page .planning-back { margin-bottom:0; }
.planning-project-hero { position:relative; overflow:hidden; padding:1.35rem; border:1px solid var(--border-light); border-radius:1.1rem; background:linear-gradient(135deg,var(--bg-card) 20%,var(--role-soft)); box-shadow:var(--shadow-soft); }
.planning-project-hero::after { content:""; position:absolute; width:15rem; height:15rem; top:-9rem; right:-5rem; border-radius:50%; background:radial-gradient(circle,rgba(82,167,173,.2),transparent 68%); pointer-events:none; }
.planning-project-hero__copy { max-width:49rem; }
.planning-eyebrow,.planning-stage__heading > div:last-child > span,.planning-results-summary span,.planning-project-hero__copy > span,.planning-modal__panel > header span,.planning-relations-panel > header span,.planning-gantt-card > header span,.planning-estimate-editor__heading span { color:var(--tomato-jam-600); font-size:.62rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.planning-project-hero h2 { margin:.3rem 0; font-size:clamp(1.55rem,3vw,2.25rem); }
.planning-project-hero p { max-width:45rem; margin:0; color:var(--text-muted); font-size:.75rem; }
.planning-project-hero__actions { position:absolute; z-index:1; top:1.25rem; right:1.25rem; }
.planning-project-hero__actions .btn-secondary { display:flex; align-items:center; gap:.45rem; }
.planning-count { min-width:1.35rem; padding:.12rem .36rem; border-radius:99px; color:white; background:var(--tropical-teal-700); font-size:.62rem; text-align:center; }
.planning-project-kpis { position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; margin-top:1.2rem; }
.planning-project-kpis article { display:grid; grid-template-columns:1fr auto; gap:.1rem .7rem; padding:.75rem .85rem; border:1px solid var(--border-light); border-radius:.75rem; background:color-mix(in srgb,var(--bg-card) 88%,transparent); }
.planning-project-kpis span,.planning-project-kpis small { color:var(--text-muted); font-size:.6rem; }
.planning-project-kpis strong { grid-row:1/3; grid-column:2; align-self:center; font-size:1.35rem; }
.planning-project-kpis small { grid-column:1; }
.planning-project-kpis .is-ready strong { color:var(--tropical-teal-700); }
.planning-project-kpis .is-pending strong,.planning-project-kpis .is-critical strong { color:var(--tomato-jam-600); }

.planning-stage { padding:1.15rem; border:1px solid var(--border-light); border-radius:1.05rem; background:var(--bg-soft); }
.planning-stage__heading { display:flex; align-items:center; gap:.8rem; margin-bottom:1rem; }
.planning-stage__number { width:2.25rem; height:2.25rem; display:grid; place-items:center; flex:0 0 auto; border-radius:.7rem; color:white; background:var(--role-accent); font-weight:900; }
.planning-stage__heading h3 { margin:.08rem 0; }
.planning-stage__heading p { margin:0; color:var(--text-muted); font-size:.68rem; }

.planning-project-macros { gap:.65rem; }
.planning-macro-card { margin:0; padding:0; overflow:hidden; }
.planning-macro-card > summary,.planning-relation-builder > summary,.planning-calculation-details > summary,.planning-expert-item > summary { list-style:none; cursor:pointer; }
.planning-macro-card > summary::-webkit-details-marker,.planning-relation-builder > summary::-webkit-details-marker,.planning-calculation-details > summary::-webkit-details-marker,.planning-expert-item > summary::-webkit-details-marker { display:none; }
.planning-macro-card__summary { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:1rem; padding:1rem 1.1rem; }
.planning-macro-card__identity { display:flex; align-items:center; gap:.75rem; min-width:0; }
.planning-macro-icon { width:2.45rem; height:2.45rem; display:grid; place-items:center; flex:0 0 auto; border-radius:.7rem; color:var(--tropical-teal-700); background:var(--tropical-teal-50); }
.planning-macro-icon svg { width:1.15rem; }
.planning-macro-card__identity h4 { margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.planning-macro-card__identity small,.planning-macro-card__result span,.planning-macro-card__result small { display:block; color:var(--text-muted); font-size:.6rem; }
.planning-macro-card__result { min-width:130px; text-align:right; }
.planning-macro-card__result strong { display:block; margin:.12rem 0; color:var(--tropical-teal-700); font-size:.9rem; }
.planning-macro-card__result.is-pending strong { color:var(--tomato-jam-600); }
.planning-chevron { width:1rem; transition:transform .2s ease; }
details[open] > summary .planning-chevron { transform:rotate(180deg); }
.planning-macro-card__body { padding:1rem 1.1rem 1.1rem; border-top:1px solid var(--border-light); background:var(--bg-card); }
.planning-macro-disclosures { display:grid; gap:.45rem; margin-bottom:.9rem; }
.planning-macro-disclosures > details { padding:.65rem .75rem; border:1px solid var(--border-light); border-radius:.65rem; }
.planning-macro-disclosures > details > summary { display:flex; align-items:center; gap:.4rem; color:var(--text-muted); cursor:pointer; font-size:.67rem; font-weight:800; }
.planning-macro-disclosures > details > summary svg { width:.95rem; }
.planning-macro-disclosures > details > summary span { margin-left:auto; padding:.1rem .35rem; border-radius:99px; background:var(--bg-soft); }
.planning-project-estimates > div { grid-template-columns:minmax(120px,.6fr) 1fr auto; }
.planning-project-estimates > div small { grid-column:1/-1; }
.planning-estimate-editor { padding:.9rem; border-radius:.8rem; background:var(--bg-soft); }
.planning-estimate-editor__heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:.75rem; }
.planning-estimate-editor__heading h5 { margin:.1rem 0 0; }
.planning-estimate-editor__heading p { max-width:26rem; margin:0; color:var(--text-muted); font-size:.62rem; text-align:right; }
.planning-field { display:grid; gap:.28rem; color:var(--text-muted); font-size:.62rem; font-weight:750; }
.planning-project-estimate-form { grid-template-columns:1.1fr repeat(4,.62fr) 1.5fr auto; align-items:end; }
.planning-project-estimate-form .btn-primary { min-height:2.55rem; }

.planning-sequence-layout { display:grid; grid-template-columns:minmax(320px,.85fr) minmax(0,1.15fr); gap:.8rem; align-items:start; }
.planning-relation-builder { margin:0; padding:0; overflow:hidden; }
.planning-relation-builder > summary,.planning-calculation-details > summary { display:flex; align-items:center; justify-content:space-between; padding:.9rem 1rem; }
.planning-relation-builder > summary > div,.planning-calculation-details > summary > div { display:flex; align-items:center; gap:.6rem; }
.planning-relation-builder > summary svg,.planning-calculation-details > summary svg { width:1.05rem; }
.planning-relation-builder > summary span,.planning-calculation-details > summary span { display:grid; }
.planning-relation-builder > summary small,.planning-calculation-details > summary small { color:var(--text-muted); font-size:.58rem; }
.planning-relation-builder > form { display:grid; gap:.7rem; padding:1rem; border-top:1px solid var(--border-light); }
.planning-relation-nodes { display:grid; grid-template-columns:1fr auto 1fr; align-items:end; gap:.5rem; }
.planning-relation-arrow { width:2rem; height:2.55rem; display:grid; place-items:center; color:var(--role-accent); }
.planning-relation-arrow svg { width:1rem; }
.planning-relation-options { display:grid; grid-template-columns:1fr .7fr; gap:.6rem; }
.planning-relation-help { margin:.7rem 1rem 1rem; font-size:.62rem; }
.planning-relation-help > summary { color:var(--role-accent); cursor:pointer; font-weight:800; }
.planning-relation-help > div { display:grid; gap:.3rem; margin-top:.5rem; color:var(--text-muted); }
.planning-relations-panel { margin:0; }
.planning-relations-panel > header,.planning-gantt-card > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.8rem; }
.planning-relations-panel h4,.planning-gantt-card h4 { margin:.08rem 0 0; }
.planning-relations-panel > header > strong { min-width:2rem; height:2rem; display:grid; place-items:center; border-radius:.6rem; color:var(--role-accent); background:var(--role-soft); }
.planning-relations article { padding:.75rem; background:var(--bg-card); }
.planning-relation-line { display:grid !important; grid-template-columns:minmax(0,1fr) auto auto minmax(0,1fr) !important; }
.planning-relation-line span:last-child { text-align:right; }
.planning-relation-line svg { width:.9rem; color:var(--text-muted); }
.planning-relations footer { justify-content:space-between; }
.planning-relations footer form { margin-left:auto; }
.planning-parallel-empty { display:grid; place-items:center; gap:.3rem; padding:1.5rem; color:var(--text-muted); text-align:center; }
.planning-parallel-empty svg { width:1.5rem; }
.planning-parallel-empty p { max-width:25rem; margin:0; font-size:.65rem; }

.planning-incomplete-note { display:flex; align-items:center; gap:.55rem; margin-bottom:.8rem; padding:.7rem .8rem; border:1px solid rgba(203,75,52,.2); border-radius:.7rem; color:var(--tomato-jam-700); background:var(--tomato-jam-50); font-size:.68rem; }
.planning-incomplete-note svg { width:1rem; }
.planning-results { display:grid; gap:.8rem; }
.planning-results-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.65rem; }
.planning-results-summary article { display:grid; grid-template-columns:1fr auto; padding:.8rem 1rem; border:1px solid var(--border-light); border-radius:.8rem; background:var(--bg-card); }
.planning-results-summary strong { grid-row:1/3; grid-column:2; color:var(--tropical-teal-700); font-size:1.45rem; }
.planning-results-summary small { color:var(--text-muted); font-size:.6rem; }
.planning-results-summary .is-critical strong { color:var(--tomato-jam-600); }
.planning-critical-path { padding:1rem; border:1px solid rgba(203,75,52,.22); border-radius:.9rem; background:linear-gradient(135deg,var(--bg-card),var(--tomato-jam-50)); }
.planning-critical-path > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.75rem; }
.planning-critical-path > header > div { display:flex; align-items:center; gap:.55rem; }
.planning-critical-path > header svg { width:1.1rem; color:var(--tomato-jam-600); }
.planning-critical-path > header span { display:grid; }
.planning-critical-path > header small { color:var(--text-muted); font-size:.58rem; }
.planning-critical-legend { display:flex !important; grid-auto-flow:column; align-items:center; gap:.35rem; color:var(--text-muted); font-size:.6rem; }
.planning-critical-legend i { width:.55rem; height:.55rem; border-radius:50%; background:var(--tomato-jam-500); }
.planning-critical-flow { display:flex; align-items:stretch; gap:.45rem; overflow-x:auto; padding-bottom:.2rem; }
.planning-critical-flow > article { min-width:155px; display:grid; gap:.15rem; padding:.65rem .75rem; border-left:3px solid var(--tomato-jam-500); border-radius:.55rem; background:var(--bg-card); }
.planning-critical-flow > article span,.planning-critical-flow > article small { color:var(--text-muted); font-size:.57rem; }
.planning-critical-flow > article strong { font-size:.68rem; }
.planning-critical-flow > svg { width:.9rem; flex:0 0 auto; align-self:center; color:var(--tomato-jam-500); }
.planning-gantt-card { margin:0; overflow:hidden; }
.planning-gantt-legend { display:flex; gap:.75rem; color:var(--text-muted); font-size:.6rem; }
.planning-gantt-legend span { display:flex; align-items:center; gap:.3rem; }
.planning-gantt-legend i { width:.7rem; height:.45rem; border-radius:99px; }
.planning-gantt-legend .is-normal { background:var(--tropical-teal-500); }
.planning-gantt-legend .is-critical { background:var(--tomato-jam-500); }
.planning-gantt-scroll { overflow-x:auto; }
.planning-gantt { min-width:760px; overflow:visible; }
.planning-gantt__scale { display:grid; grid-template-columns:repeat(3,1fr); margin-left:240px; padding-right:90px; }
.planning-gantt__scale span:nth-child(2) { text-align:center; }
.planning-gantt__scale span:last-child { text-align:right; }
.planning-gantt__row { grid-template-columns:230px minmax(400px,1fr) 82px; min-height:3.2rem; }
.planning-gantt__row.is-critical { background:linear-gradient(90deg,transparent,var(--tomato-jam-50)); }
.planning-gantt__label strong,.planning-gantt__label small { display:block; }
.planning-gantt__track { height:1.35rem; overflow:visible; background-color:var(--bg-soft); background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 1px),var(--border-light) 10%); }
.planning-gantt__track span { display:flex; align-items:center; justify-content:center; box-shadow:0 3px 8px rgba(34,102,107,.16); }
.planning-gantt__track span b { color:white; font-size:.52rem; white-space:nowrap; }
.planning-gantt__row em.is-critical { color:var(--tomato-jam-600); font-weight:800; }
.planning-calculation-details { margin:0; padding:0; overflow:hidden; }
.planning-calculation-details > div { padding:0 1rem 1rem; }
.planning-results-empty { display:grid; place-items:center; gap:.35rem; }
.planning-results-empty svg { width:1.8rem; color:var(--text-muted); }
.planning-results-empty p { margin:0; color:var(--text-muted); font-size:.68rem; }

.planning-modal { position:fixed; z-index:1200; inset:0; display:grid; place-items:center; padding:1rem; }
.planning-modal__backdrop { position:absolute; inset:0; background:rgba(15,23,32,.58); backdrop-filter:blur(3px); }
.planning-modal__panel { position:relative; width:min(780px,100%); max-height:88vh; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--border-light); border-radius:1rem; background:var(--bg-card); box-shadow:0 24px 70px rgba(0,0,0,.28); }
.planning-modal__panel > header { display:flex; justify-content:space-between; gap:1rem; padding:1rem 1.15rem; border-bottom:1px solid var(--border-light); }
.planning-modal__panel > header h3 { margin:.1rem 0; }
.planning-modal__panel > header p { margin:0; color:var(--text-muted); font-size:.65rem; }
.planning-modal__panel > header button { border:0; color:var(--text-muted); background:transparent; font-size:1.75rem; cursor:pointer; }
.planning-modal__body { display:grid; gap:1rem; padding:1rem 1.15rem; overflow-y:auto; }
.planning-modal__panel > footer { display:flex; justify-content:flex-end; padding:.8rem 1.15rem; border-top:1px solid var(--border-light); }
.planning-expert-create { display:grid; grid-template-columns:1fr 1.1fr 1.1fr auto; align-items:end; gap:.6rem; padding:.85rem; border-radius:.75rem; background:var(--bg-soft); }
.planning-expert-create > div { display:grid; align-self:center; }
.planning-modal-label { color:var(--tomato-jam-600); font-size:.58rem; font-weight:800; text-transform:uppercase; }
.planning-expert-list { display:grid; gap:.45rem; }
.planning-expert-list__heading { display:flex; justify-content:space-between; color:var(--text-muted); font-size:.65rem; font-weight:800; }
.planning-expert-list__heading strong { color:var(--role-accent); }
.planning-expert-item { border:1px solid var(--border-light); border-radius:.7rem; }
.planning-expert-item > summary { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.65rem; padding:.7rem .8rem; }
.planning-expert-avatar { width:2rem; height:2rem; display:grid; place-items:center; border-radius:50%; color:white; background:var(--tropical-teal-700); font-weight:900; }
.planning-expert-item > summary div { display:grid; }
.planning-expert-item > summary small { color:var(--text-muted); font-size:.58rem; }
.planning-expert-item__editor { display:flex; align-items:end; justify-content:space-between; gap:.6rem; padding:.75rem .8rem; border-top:1px solid var(--border-light); background:var(--bg-soft); }
.planning-expert-item__editor > form:first-child { flex:1; display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:.55rem; }
.planning-expert-empty { display:flex; align-items:center; justify-content:center; gap:.5rem; padding:1.2rem; color:var(--text-muted); font-size:.68rem; }
.planning-expert-empty svg { width:1rem; }

html[data-theme="dark"] .planning-macro-icon { color:#9bd3d6; background:rgba(82,167,173,.16); }
html[data-theme="dark"] .planning-incomplete-note,html[data-theme="dark"] .planning-critical-path { background:rgba(203,75,52,.1); }
@media(max-width:1050px) {
    .planning-project-kpis { grid-template-columns:1fr 1fr; }
    .planning-project-estimate-form { grid-template-columns:repeat(3,1fr); }
    .planning-field--assumptions { grid-column:span 2; }
    .planning-sequence-layout { grid-template-columns:1fr; }
    .planning-expert-create { grid-template-columns:1fr 1fr; }
}
@media(max-width:680px) {
    .planning-project-hero { padding:1rem; }
    .planning-project-hero__actions { position:static; margin-top:.8rem; }
    .planning-project-kpis,.planning-results-summary { grid-template-columns:1fr 1fr; }
    .planning-stage { padding:.8rem; }
    .planning-macro-card__summary { grid-template-columns:minmax(0,1fr) auto; }
    .planning-macro-card__result { grid-column:1; grid-row:2; text-align:left; }
    .planning-macro-card__summary > .planning-chevron { grid-column:2; grid-row:1/3; }
    .planning-estimate-editor__heading { align-items:flex-start; flex-direction:column; }
    .planning-estimate-editor__heading p { text-align:left; }
    .planning-project-estimate-form,.planning-expert-create,.planning-expert-item__editor > form:first-child { grid-template-columns:1fr; }
    .planning-field--assumptions { grid-column:auto; }
    .planning-relation-nodes { grid-template-columns:1fr; }
    .planning-relation-arrow { height:1.2rem; transform:rotate(90deg); justify-self:center; }
    .planning-relation-options { grid-template-columns:1fr; }
    .planning-gantt-card > header,.planning-critical-path > header { align-items:flex-start; flex-direction:column; }
    .planning-expert-item__editor { align-items:stretch; flex-direction:column; }
}

/* ============================================================
   RESPUESTA DE FORMULARIOS Y ACTUALIZACION PROGRESIVA
   ============================================================ */
.mg-global-activity {
    position:fixed;
    inset:0 0 auto;
    height:3px;
    z-index:20000;
    overflow:hidden;
    pointer-events:none;
    opacity:0;
    transition:opacity .16s ease;
}
.mg-global-activity.is-active { opacity:1; }
.mg-global-activity span {
    display:block;
    width:38%;
    height:100%;
    border-radius:999px;
    background:linear-gradient(90deg,var(--tropical-teal-500,#52a7ad),var(--custard-yellow-500,#e2b11d),var(--tomato-red-500,#cb4b34));
    box-shadow:0 0 14px rgba(82,167,173,.55);
    animation:mg-activity-slide 1s cubic-bezier(.4,0,.2,1) infinite;
}
@keyframes mg-activity-slide {
    from { transform:translateX(-110%); }
    to { transform:translateX(365%); }
}

.mg-is-submitting { position:relative; cursor:wait !important; opacity:.78; }
.mg-submit-spinner {
    display:inline-block;
    flex:0 0 auto;
    width:1em;
    height:1em;
    margin-right:.42rem;
    border:2px solid currentColor;
    border-right-color:transparent;
    border-radius:50%;
    vertical-align:-.12em;
    animation:mg-spinner .65s linear infinite;
}
@keyframes mg-spinner { to { transform:rotate(360deg); } }

.mg-feedback-region {
    position:fixed;
    top:76px;
    right:18px;
    z-index:21000;
    display:grid;
    width:min(390px,calc(100vw - 32px));
    gap:.65rem;
    pointer-events:none;
}
.mg-feedback {
    display:grid;
    grid-template-columns:2.25rem minmax(0,1fr) auto;
    gap:.7rem;
    align-items:start;
    padding:.85rem .9rem;
    color:var(--text-primary,#1b1819);
    background:color-mix(in srgb,var(--surface,#fff) 94%,transparent);
    border:1px solid var(--border-light,#e7e4e5);
    border-left:4px solid var(--tropical-teal-500,#52a7ad);
    border-radius:.85rem;
    box-shadow:0 18px 45px rgba(19,17,17,.18);
    backdrop-filter:blur(14px);
    opacity:0;
    transform:translateY(-8px) scale(.98);
    transition:opacity .18s ease,transform .18s ease;
    pointer-events:auto;
}
.mg-feedback.is-visible { opacity:1; transform:none; }
.mg-feedback.is-leaving { opacity:0; transform:translateX(12px); }
.mg-feedback--error { border-left-color:var(--tomato-red-500,#cb4b34); }
.mg-feedback__icon {
    display:grid;
    place-items:center;
    width:2.1rem;
    height:2.1rem;
    color:#fff;
    background:var(--tropical-teal-600,#41868b);
    border-radius:50%;
    font-weight:800;
}
.mg-feedback--error .mg-feedback__icon { background:var(--tomato-red-500,#cb4b34); }
.mg-feedback strong { display:block; margin:.05rem 0 .12rem; font-size:.78rem; }
.mg-feedback p { margin:0; color:var(--text-muted,#6c6063); font-size:.7rem; line-height:1.45; }
.mg-feedback button {
    padding:0;
    color:var(--text-muted,#6c6063);
    background:transparent;
    border:0;
    font-size:1.2rem;
    line-height:1;
    cursor:pointer;
}

.page-shell.mg-content-updating { opacity:.72; transition:opacity .14s ease; }
.mg-form-saved { position:relative; animation:mg-saved-outline 1.45s ease; }
@keyframes mg-saved-outline {
    0%,100% { box-shadow:inherit; }
    18% { box-shadow:0 0 0 3px rgba(82,167,173,.2),0 12px 28px rgba(19,17,17,.08); }
}
.mg-inline-save-status {
    display:inline-flex;
    align-items:center;
    width:max-content;
    position:absolute;
    right:.65rem;
    bottom:.45rem;
    z-index:2;
    padding:.2rem .45rem;
    margin:0;
    color:var(--tropical-teal-700,#316468);
    background:var(--surface,#fff);
    border-radius:999px;
    box-shadow:0 2px 8px rgba(19,17,17,.08);
    font-size:.68rem;
    font-weight:800;
    animation:mg-status-in .2s ease both;
}
@keyframes mg-status-in { from { opacity:0; transform:translateY(3px); } }

html[data-theme="dark"] .mg-feedback {
    color:#f3f1f2;
    background:rgba(27,24,25,.94);
    border-color:rgba(255,255,255,.12);
}
html[data-theme="dark"] .mg-feedback p { color:#cfc9ca; }

@media (max-width:640px) {
    .mg-feedback-region { top:70px; right:12px; width:calc(100vw - 24px); }
}
@media (prefers-reduced-motion:reduce) {
    .mg-global-activity span,.mg-submit-spinner,.mg-form-saved,.mg-inline-save-status { animation-duration:.001ms !important; animation-iteration-count:1 !important; }
    .mg-feedback,.page-shell.mg-content-updating { transition:none !important; }
}
/* ========================================================================== */
/* CONTROL DE PROYECTO Y JORNADA OPERATIVA V6                                */
/* ========================================================================== */
.back-link{display:inline-flex;align-items:center;gap:.45rem;margin-bottom:1.25rem;color:var(--color-shadow-grey-600);font-weight:700;text-decoration:none}.back-link svg{width:1rem}
.feedback-banner{display:flex;gap:.65rem;align-items:center;padding:.85rem 1rem;border-radius:14px;margin-bottom:1rem;font-weight:650}.feedback-banner svg{width:1.1rem}.feedback-banner--success{background:#edf8f2;color:#236a47}.feedback-banner--error{background:var(--color-tomato-jam-50);color:var(--color-tomato-jam-700)}
.project-control__hero,.task-focus__header,.page-heading{display:flex;justify-content:space-between;gap:2rem;align-items:flex-end;margin:1rem 0 2rem}.project-control__hero h1,.task-focus__header h1,.page-heading h1{font-size:clamp(2.25rem,5vw,4.25rem);line-height:.95;margin:.3rem 0 .65rem}.project-control__hero p,.task-focus__header p,.page-heading p{max-width:740px;color:var(--color-shadow-grey-600);margin:0}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.14em;font-size:.7rem;font-weight:800;color:var(--color-tomato-jam-600)}
.project-identity{display:flex;gap:1.25rem;flex-wrap:wrap;margin-top:1rem}.project-identity span{display:flex;align-items:center;gap:.4rem}.project-identity svg{width:1rem;color:var(--color-tropical-teal-600)}.project-control__actions{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;flex-wrap:wrap;min-width:230px}
.project-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--color-shadow-grey-200);border:1px solid var(--color-shadow-grey-200);border-radius:20px;overflow:hidden;margin-bottom:3rem}.project-kpi-grid article{background:#fff;padding:1.35rem;min-height:130px;display:flex;flex-direction:column}.project-kpi-grid span,.project-kpi-grid small{color:var(--color-shadow-grey-500)}.project-kpi-grid strong{font-family:'Baloo Bhaijaan 2',sans-serif;font-size:1.75rem;margin:auto 0 .15rem}.project-kpi-grid .needs-attention{background:var(--color-vanilla-custard-50)}
.progress-track{height:7px;background:var(--color-shadow-grey-100);border-radius:999px;overflow:hidden}.progress-track i,.progress-track span{display:block;height:100%;background:var(--color-tomato-jam-500);border-radius:inherit}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:1rem}.section-heading h2{font-size:2rem;margin:.25rem 0 0}.section-heading p{color:var(--color-shadow-grey-500)}.macro-stack{display:grid;gap:1rem}.macro-card{border:1px solid var(--color-shadow-grey-200);border-radius:18px;background:#fff;overflow:hidden}.macro-card__head{width:100%;border:0;background:#fff;padding:1.25rem;display:grid;grid-template-columns:48px 1fr auto 22px;gap:1rem;align-items:center;text-align:left;cursor:pointer}.macro-card__head h3{margin:.15rem 0 0;font-size:1.35rem}.macro-card__index{font-family:monospace;color:var(--color-shadow-grey-400)}.macro-card__progress{text-align:right}.macro-card__progress span{display:block;color:var(--color-shadow-grey-500);font-size:.8rem}.macro-card__body{border-top:1px solid var(--color-shadow-grey-100);padding:1rem}
.bulk-assign{display:grid;grid-template-columns:1fr minmax(190px,1.2fr) 160px auto;gap:.65rem;align-items:center;padding:1rem;border-radius:14px;background:var(--color-tropical-teal-50);margin-bottom:.75rem}.bulk-assign b{display:block}.project-task-row{display:grid;grid-template-columns:minmax(220px,2fr) 145px 110px minmax(230px,1fr) auto;align-items:center;gap:1rem;padding:1rem .5rem;border-top:1px solid var(--color-shadow-grey-100)}.project-task-row.is-critical{border-left:3px solid var(--color-tomato-jam-500);padding-left:.9rem}.project-task-row__main{display:flex;align-items:flex-start;gap:.6rem}.project-task-row__main small,.project-task-row__schedule small{display:block;color:var(--color-shadow-grey-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:360px}.project-task-row__schedule span,.project-task-row__links span{font-size:.74rem;font-weight:750}.project-task-row__links{display:flex;flex-direction:column;color:var(--color-tropical-teal-700)}.task-assign{display:flex;gap:.45rem}.critical-marker{display:inline-flex;align-items:center;gap:.25rem;background:var(--color-tomato-jam-50);color:var(--color-tomato-jam-700);font-size:.68rem;font-weight:850;padding:.3rem .45rem;border-radius:7px;white-space:nowrap}.critical-marker svg{width:.75rem;height:.75rem}
.modal-shell{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:1rem}.modal-backdrop{position:absolute;inset:0;background:rgba(19,17,17,.62);backdrop-filter:blur(4px)}.modal-card{position:relative;width:min(760px,100%);max-height:88vh;overflow:auto;background:var(--surface-card);border-radius:20px;box-shadow:0 28px 70px rgba(19,17,17,.25)}.modal-card>header{display:flex;justify-content:space-between;padding:1.25rem;border-bottom:1px solid var(--color-shadow-grey-100)}.modal-card>header h2{margin:.2rem 0}.modal-card>header button{border:0;background:none;cursor:pointer}.modal-card__body{padding:1.25rem}.admin-step{display:grid;grid-template-columns:32px 1fr auto;gap:.75rem;padding:.75rem 0;border-bottom:1px solid var(--color-shadow-grey-100)}.admin-step small{display:block;color:var(--color-shadow-grey-500)}.step-create{display:grid;grid-template-columns:1fr 1fr 110px;gap:.65rem;margin-top:1rem}.step-create label,.step-create button{align-self:center}
.operator-workspace .page-heading{align-items:center}.operator-filter{max-width:220px}.next-task-card{display:grid;grid-template-columns:58px 1fr auto;gap:1rem;align-items:center;background:var(--color-shadow-grey-900);color:#fff;border-radius:22px;padding:1.35rem;margin-bottom:1.25rem}.next-task-card__icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--color-vanilla-custard-400);color:var(--color-shadow-grey-900)}.next-task-card h2{margin:.15rem 0}.next-task-card p{margin:0;color:var(--color-shadow-grey-300)}.project-work-card{border:1px solid var(--color-shadow-grey-200);background:#fff;border-radius:20px;overflow:hidden;margin-bottom:1rem}.project-work-card__head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;border:0;background:#fff;padding:1.25rem;text-align:left;cursor:pointer}.project-work-card__head h2{margin:.15rem 0}.project-work-card__summary{display:flex;align-items:center;gap:1rem;color:var(--color-shadow-grey-500)}.project-work-card__body{border-top:1px solid var(--color-shadow-grey-100);padding:1rem}.macro-work+ .macro-work{margin-top:1.25rem}.macro-work>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.macro-work h3{margin:.15rem 0}.macro-work>header>span{font-weight:800}.operator-task{display:grid;grid-template-columns:auto 1fr auto;gap:.7rem;align-items:center;padding:.85rem;border-top:1px solid var(--color-shadow-grey-100);color:inherit;text-decoration:none}.operator-task:hover{background:var(--color-linen-50)}.operator-task small{display:block;color:var(--color-shadow-grey-500)}.operator-task__meta{display:flex;align-items:center;gap:.8rem;font-size:.75rem}.operator-task__meta svg{width:1rem}
.task-breadcrumb{display:flex;gap:.4rem;align-items:center;font-size:.78rem;color:var(--color-shadow-grey-500)}.task-breadcrumb svg{width:.8rem}.task-focus__state{display:flex;gap:.5rem}.task-sequence{display:grid;grid-template-columns:1fr auto 1fr;gap:1.25rem;align-items:center;background:var(--color-linen-50);border-radius:18px;padding:1.25rem;margin-bottom:1.25rem}.task-sequence ul{list-style:none;padding:0;margin:.45rem 0 0}.task-sequence li{display:flex;gap:.4rem;align-items:center}.task-sequence li svg{width:.9rem}.task-sequence__arrow{color:var(--color-tomato-jam-500)}.task-focus__grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,.7fr);gap:1rem}.task-checklist>header{display:flex;justify-content:space-between;align-items:end;margin-bottom:1rem}.task-checklist h2{margin:.2rem 0}.task-checklist>header strong{font-size:1.7rem}.check-step{display:grid;grid-template-columns:34px 1fr auto;gap:.75rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--color-shadow-grey-100)}.check-step__number{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--color-shadow-grey-100);font-weight:800}.check-step small{display:block;color:var(--color-shadow-grey-500)}.check-step.is-complete strong{text-decoration:line-through;color:var(--color-shadow-grey-400)}.task-action-panel{background:var(--color-shadow-grey-900);color:#fff;border-radius:18px;padding:1.25rem;height:max-content}.task-action-panel h2{margin:.2rem 0 1rem}.task-action-panel form+form{margin-top:.6rem}.task-action-panel dl{margin:1.5rem 0 0;border-top:1px solid var(--color-shadow-grey-700)}.task-action-panel dl div{display:flex;justify-content:space-between;padding:.8rem 0;border-bottom:1px solid var(--color-shadow-grey-700)}.task-action-panel dt{color:var(--color-shadow-grey-400)}
@media(max-width:1024px){.project-kpi-grid{grid-template-columns:repeat(2,1fr)}.bulk-assign{grid-template-columns:1fr 1fr}.project-task-row{grid-template-columns:1fr auto}.project-task-row__links,.project-task-row__schedule{display:none}.task-assign{grid-column:1/2}.task-focus__grid{grid-template-columns:1fr}}
@media(max-width:680px){.project-control__hero,.task-focus__header,.page-heading,.section-heading{align-items:flex-start;flex-direction:column}.project-control__actions{justify-content:flex-start}.project-kpi-grid{grid-template-columns:1fr}.bulk-assign{grid-template-columns:1fr}.macro-card__head{grid-template-columns:34px 1fr 20px}.macro-card__progress{display:none}.project-task-row{grid-template-columns:1fr}.task-assign{grid-column:auto;flex-wrap:wrap}.next-task-card{grid-template-columns:44px 1fr}.next-task-card>a{grid-column:1/-1}.operator-task{grid-template-columns:1fr}.operator-task>.critical-marker{width:max-content}.operator-task__meta{justify-content:space-between}.task-sequence{grid-template-columns:1fr}.task-sequence__arrow{transform:rotate(90deg)}.step-create{grid-template-columns:1fr}}

/* ==========================================================================
   SISTEMA NOCTURNO + DESGLOSE OPERATIVO V7
   ========================================================================== */
:root {
    --surface-page:#f8f6f3;
    --surface-card:#ffffff;
    --surface-raised:#ffffff;
    --surface-subtle:#f3f1f2;
    --surface-tint:#eef6f7;
    --surface-inset:#ebe8e7;
    --ink-strong:#1b1819;
    --ink-body:#363031;
    --ink-muted:#6c6063;
    --line-soft:#e7e4e5;
    --line-strong:#cfc9ca;
    --focus-ring:rgba(82,167,173,.28);
    --card-shadow:0 12px 34px rgba(27,24,25,.07);
    --card-shadow-hover:0 18px 46px rgba(27,24,25,.12);
}

html[data-theme="dark"] {
    --surface-page:#0b0e0f;
    --surface-card:#15191b;
    --surface-raised:#1a1f21;
    --surface-subtle:#202527;
    --surface-tint:#172629;
    --surface-inset:#101416;
    --ink-strong:#faf7f4;
    --ink-body:#e7e1dd;
    --ink-muted:#aaa2a4;
    --line-soft:#2c3336;
    --line-strong:#424a4e;
    --focus-ring:rgba(116,185,190,.3);
    --card-shadow:0 14px 38px rgba(0,0,0,.28);
    --card-shadow-hover:0 22px 52px rgba(0,0,0,.42);
}

::selection { color:#fff; background:var(--tomato-jam-600); }
html[data-theme="dark"] ::selection { color:#101416; background:var(--tropical-teal-300); }
html[data-theme="dark"] { scrollbar-color:#525b5e #101416; }
html[data-theme="dark"] body { background-color:var(--surface-page); }
html[data-theme="dark"] body::before {
    content:"";
    position:fixed;
    inset:0;
    z-index:-1;
    pointer-events:none;
    background:
        radial-gradient(circle at 12% 6%,rgba(82,167,173,.13),transparent 31rem),
        radial-gradient(circle at 88% 18%,rgba(203,75,52,.08),transparent 28rem),
        linear-gradient(180deg,#101517 0%,#0b0e0f 34rem);
}

::view-transition-old(root),
::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
::view-transition-old(root) { z-index:1; }
::view-transition-new(root) { z-index:9999; }

.theme-toggle { position:relative; isolation:isolate; overflow:hidden; }
.theme-toggle::before {
    content:"";
    position:absolute;
    inset:4px;
    z-index:-1;
    border-radius:inherit;
    background:radial-gradient(circle,rgba(232,192,74,.28),transparent 68%);
    opacity:0;
    transform:scale(.55);
    transition:opacity .24s ease,transform .32s cubic-bezier(.2,.8,.2,1);
}
.theme-toggle:hover::before { opacity:1; transform:scale(1); }
.theme-toggle__icon { position:absolute; transition:opacity .2s ease,transform .38s cubic-bezier(.2,.8,.2,1); }
.theme-toggle__icon--moon { opacity:1; transform:rotate(0) scale(1); }
.theme-toggle__icon--sun { display:inline; opacity:0; transform:rotate(-80deg) scale(.45); }
html[data-theme="dark"] .theme-toggle__icon--moon { display:inline; opacity:0; transform:rotate(80deg) scale(.45); }
html[data-theme="dark"] .theme-toggle__icon--sun { opacity:1; transform:rotate(0) scale(1); }

.page-shell { color:var(--ink-body); }
.page-shell h1,.page-shell h2,.page-shell h3,.page-shell h4,.page-shell strong { color:var(--ink-strong); }
.page-heading p,.project-control__hero p,.task-focus__header p,.section-heading p { color:var(--ink-muted); }
.back-link { color:var(--ink-muted); }
.back-link:hover { color:var(--role-accent-dark,var(--tomato-jam-700)); }

.breakdown-actions { display:flex; align-items:center; justify-content:flex-end; gap:.55rem; flex-wrap:wrap; }
.breakdown-chevron,.details-chevron {
    width:1.1rem;
    flex:0 0 auto;
    color:var(--ink-muted);
    transition:transform .24s cubic-bezier(.2,.8,.2,1),color .2s ease;
}
.breakdown-chevron.is-open { color:var(--role-accent); transform:rotate(180deg); }
details[open] > summary .details-chevron { color:var(--role-accent); transform:rotate(180deg); }

.feedback-banner {
    color:var(--ink-body);
    background:var(--surface-raised);
    border:1px solid var(--line-soft);
    box-shadow:var(--card-shadow);
}
.feedback-banner--success { color:#236a47; background:#edf8f2; border-color:#c4e7d3; }
.feedback-banner--error { color:var(--tomato-jam-700); background:var(--tomato-jam-50); border-color:var(--tomato-jam-100); }
html[data-theme="dark"] .feedback-banner--success { color:#9bd3b4; background:rgba(45,106,79,.2); border-color:rgba(105,190,147,.3); }
html[data-theme="dark"] .feedback-banner--error { color:#ef9b8d; background:rgba(162,60,42,.18); border-color:rgba(224,147,133,.28); }

.project-kpi-grid { background:var(--line-soft); border-color:var(--line-soft); box-shadow:var(--card-shadow); }
.project-kpi-grid article { color:var(--ink-body); background:var(--surface-card); }
.project-kpi-grid article > span,.project-kpi-grid article > small { color:var(--ink-muted); }
.project-kpi-grid .needs-attention { background:var(--vanilla-custard-50); }
html[data-theme="dark"] .project-kpi-grid .needs-attention {
    background:linear-gradient(145deg,rgba(226,177,29,.12),var(--surface-card));
}
.progress-track { background:var(--surface-inset); }

.project-breakdown-heading { align-items:flex-end; }
.project-breakdown-heading > div:first-child { max-width:52rem; }
.project-breakdown-heading p { margin:.45rem 0 0; }

.macro-stack { gap:.85rem; }
.macro-card {
    color:var(--ink-body);
    background:var(--surface-card);
    border-color:var(--line-soft);
    box-shadow:var(--card-shadow);
    transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.macro-card:hover { border-color:var(--line-strong); box-shadow:var(--card-shadow-hover); }
.macro-card__head {
    grid-template-columns:2.3rem minmax(0,1fr) auto 1.2rem;
    min-height:6.4rem;
    color:var(--ink-body);
    background:var(--surface-card);
    border:0;
}
.macro-card__head:hover { background:color-mix(in srgb,var(--surface-card) 88%,var(--role-soft)); }
.macro-card__head:focus-visible,
.project-work-card__head:focus-visible,
.macro-work__head:focus-visible,
.activity-card__summary:focus-visible,
.work-index summary:focus-visible {
    outline:3px solid var(--focus-ring);
    outline-offset:-3px;
}
.macro-card__index { color:var(--ink-muted); font-size:.72rem; }
.macro-card__identity,.project-work-card__identity,.macro-work__identity {
    min-width:0;
    display:flex;
    align-items:center;
    gap:.85rem;
}
.macro-card__identity > span:last-child,
.project-work-card__identity > span:last-child,
.macro-work__identity > span:last-child { min-width:0; }

/* Ventana programada del bloque (fechas + ruta critica / holgura). Va debajo del
   nombre del macrocomponente y se apoya en tokens, no en colores fijos, para que
   funcione igual en tema claro y oscuro. */
.macro-card__window {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.4rem;
    margin-top:.35rem;
    color:var(--ink-muted);
    font-size:.78rem;
    line-height:1.3;
}
.macro-card__window .macro-window__label { font-weight:700; color:var(--ink-strong); }
.macro-card__window .badge-status { font-size:.68rem; padding:.15rem .45rem; }
.macro-card__identity strong,.project-work-card__identity strong,.macro-work__identity strong {
    display:block;
    overflow:hidden;
    color:var(--ink-strong);
    font-family:var(--font-display);
    font-size:1.25rem;
    line-height:1.15;
    text-overflow:ellipsis;
}
.macro-card__identity small:last-child,
.project-work-card__identity small:last-child,
.macro-work__identity small:last-child { display:block; margin-top:.2rem; color:var(--ink-muted); }
.macro-card__icon,.project-work-card__icon,.macro-work__icon,.work-index-project__icon {
    width:2.65rem;
    height:2.65rem;
    flex:0 0 auto;
    display:grid;
    place-items:center;
    color:var(--role-accent-dark);
    background:var(--role-soft);
    border:1px solid color-mix(in srgb,var(--role-accent) 25%,transparent);
    border-radius:.8rem;
}
.macro-card__icon svg,.project-work-card__icon svg,.macro-work__icon svg,.work-index-project__icon svg { width:1.2rem; }
.macro-card__status { display:flex; align-items:center; justify-content:flex-end; gap:.8rem; }
.macro-progress-dial {
    --macro-progress:0%;
    width:3.35rem;
    height:3.35rem;
    flex:0 0 auto;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:
        radial-gradient(circle closest-side,var(--surface-card) 76%,transparent 78% 100%),
        conic-gradient(var(--role-accent) var(--macro-progress),var(--surface-inset) 0);
}
.macro-progress-dial strong { font-family:var(--font-sans); font-size:.7rem; }
.macro-card__counts b,.macro-card__counts small { display:block; }
.macro-card__counts b { color:var(--ink-strong); font-size:.8rem; }
.macro-card__counts small { margin-top:.2rem; color:var(--ink-muted); font-size:.68rem; }
.macro-card__counts small span + span::before { content:" · "; color:var(--ink-muted); }
.macro-card__counts .is-critical,.work-summary-stat .is-critical { color:var(--tomato-jam-500); }
.macro-card__body { padding:1rem 1.15rem 1.2rem; background:var(--surface-subtle); border-color:var(--line-soft); }

.macro-overview {
    display:grid;
    grid-template-columns:minmax(210px,.8fr) minmax(360px,1.2fr);
    gap:1.4rem;
    align-items:center;
    margin-bottom:.8rem;
    padding:.85rem 1rem;
    background:var(--surface-card);
    border:1px solid var(--line-soft);
    border-radius:14px;
}
.macro-overview__progress > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.45rem; }
.macro-overview__progress span { color:var(--ink-muted); font-size:.75rem; }
.macro-overview__stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin:0; }
.macro-overview__stats div { padding:.15rem .8rem; border-left:1px solid var(--line-soft); }
.macro-overview__stats dt { color:var(--ink-muted); font-size:.65rem; text-transform:uppercase; letter-spacing:.08em; }
.macro-overview__stats dd { margin:.2rem 0 0; color:var(--ink-strong); font-family:var(--font-display); font-size:1.15rem; font-weight:700; }

.bulk-assign {
    position:relative;
    color:var(--ink-body);
    background:var(--surface-tint);
    border:1px solid color-mix(in srgb,var(--tropical-teal-500) 24%,var(--line-soft));
}
.bulk-assign__empty { grid-column:2/-1; color:var(--ink-muted); }

.activity-list { display:grid; gap:.55rem; }
.activity-card {
    overflow:hidden;
    color:var(--ink-body);
    background:var(--surface-card);
    border:1px solid var(--line-soft);
    border-radius:14px;
    transition:border-color .2s ease,box-shadow .2s ease;
}
.activity-card:hover { border-color:var(--line-strong); }
.activity-card.is-critical { border-left:3px solid var(--tomato-jam-500); }
.activity-card__summary {
    width:100%;
    display:grid;
    grid-template-columns:2rem minmax(220px,1fr) minmax(150px,220px) 1.1rem;
    gap:.85rem;
    align-items:center;
    padding:.85rem 1rem;
    color:var(--ink-body);
    text-align:left;
    background:transparent;
    border:0;
    cursor:pointer;
}
.activity-card__summary:hover { background:color-mix(in srgb,var(--surface-card) 82%,var(--role-soft)); }
.activity-card__signal,.work-index-activity__signal,.operator-task__signal {
    width:1.8rem;
    height:1.8rem;
    display:grid;
    place-items:center;
    color:var(--ink-muted);
    background:var(--surface-subtle);
    border-radius:50%;
}
.activity-card.is-critical .activity-card__signal,
.work-index-activity.is-critical .work-index-activity__signal,
.operator-task.is-critical .operator-task__signal { color:var(--tomato-jam-500); background:rgba(203,75,52,.1); }
.activity-card__signal svg,.work-index-activity__signal svg,.operator-task__signal svg { width:.9rem; }
.activity-card__title { min-width:0; }
.activity-card__title strong,.activity-card__title > small:last-child { display:block; }
.activity-card__title strong { overflow:hidden; color:var(--ink-strong); text-overflow:ellipsis; white-space:nowrap; }
.activity-card__title > small:last-child { overflow:hidden; margin-top:.18rem; color:var(--ink-muted); font-size:.72rem; text-overflow:ellipsis; white-space:nowrap; }
.critical-label {
    display:inline-flex;
    width:max-content;
    margin-bottom:.2rem;
    color:var(--tomato-jam-600);
    font-size:.6rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
html[data-theme="dark"] .critical-label { color:var(--tomato-jam-300); }
.activity-card__progress { display:grid; grid-template-columns:auto 2.6rem; align-items:center; gap:.25rem .55rem; }
.activity-card__progress .progress-track { grid-column:1/-1; }
.activity-progress-value { color:var(--ink-strong); font-size:.72rem; font-weight:800; text-align:right; }
.activity-card__detail { padding:0 1rem 1rem 3.85rem; border-top:1px solid var(--line-soft); }
.activity-detail-grid { display:grid; grid-template-columns:minmax(220px,1.2fr) minmax(300px,1fr); gap:1.5rem; padding:1rem 0; }
.activity-detail-grid p { margin:.35rem 0 0; color:var(--ink-muted); font-size:.82rem; line-height:1.6; }
.activity-detail-grid dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; margin:0; }
.activity-detail-grid dl div { padding:.65rem .75rem; background:var(--surface-subtle); border-radius:10px; }
.activity-detail-grid dt { color:var(--ink-muted); font-size:.62rem; letter-spacing:.05em; text-transform:uppercase; }
.activity-detail-grid dd { margin:.25rem 0 0; color:var(--ink-strong); font-size:.72rem; font-weight:700; }
.activity-card__actions { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; padding-top:.85rem; border-top:1px solid var(--line-soft); }
.activity-card__actions .task-assign { flex:1; align-items:flex-end; }
.activity-card__actions .task-assign label { min-width:220px; }
.activity-card__actions .task-assign label > span { display:block; margin-bottom:.3rem; color:var(--ink-muted); font-size:.68rem; }

.operator-work-toolbar {
    position:sticky;
    top:74px;
    z-index:8;
    display:grid;
    grid-template-columns:minmax(230px,.75fr) minmax(520px,1.25fr);
    gap:.8rem;
    margin-bottom:1rem;
    padding:.7rem;
    background:color-mix(in srgb,var(--surface-card) 91%,transparent);
    border:1px solid var(--line-soft);
    border-radius:16px;
    box-shadow:var(--card-shadow);
    backdrop-filter:blur(14px);
}
.operator-search { position:relative; display:flex; align-items:center; color:var(--ink-muted); }
.operator-search > svg { position:absolute; left:.8rem; width:1rem; pointer-events:none; }
.operator-search input {
    width:100%;
    min-height:2.65rem;
    padding:.65rem 2.5rem;
    color:var(--ink-strong);
    background:var(--surface-subtle);
    border:1px solid transparent;
    border-radius:11px;
    outline:none;
}
.operator-search input:focus { border-color:var(--role-accent); box-shadow:0 0 0 3px var(--focus-ring); }
.operator-search button { position:absolute; right:.4rem; display:grid; place-items:center; padding:.35rem; color:var(--ink-muted); background:transparent; border:0; cursor:pointer; }
.operator-search button svg { width:.9rem; }
.operator-filter-tabs { display:flex; justify-content:flex-end; gap:.25rem; overflow-x:auto; }
.operator-filter-tabs button {
    display:inline-flex;
    align-items:center;
    gap:.4rem;
    padding:.55rem .7rem;
    color:var(--ink-muted);
    white-space:nowrap;
    background:transparent;
    border:1px solid transparent;
    border-radius:10px;
    cursor:pointer;
}
.operator-filter-tabs button:hover { color:var(--ink-strong); background:var(--surface-subtle); }
.operator-filter-tabs button.is-active { color:var(--ink-strong); background:var(--role-soft); border-color:color-mix(in srgb,var(--role-accent) 28%,transparent); }
.operator-filter-tabs button span { min-width:1.25rem; padding:.12rem .3rem; color:inherit; background:color-mix(in srgb,var(--surface-card) 72%,transparent); border-radius:999px; font-size:.62rem; font-weight:800; }

.next-task-card {
    position:relative;
    overflow:hidden;
    color:#f7f2ee;
    background:
        radial-gradient(circle at 92% 10%,rgba(232,192,74,.2),transparent 14rem),
        linear-gradient(135deg,#171a1b,#25200f);
    border:1px solid rgba(232,192,74,.18);
    box-shadow:0 18px 45px rgba(19,17,17,.2);
}
.next-task-card h2 { color:#fff; }
.next-task-card .eyebrow { color:var(--vanilla-custard-300); }
.next-task-card p { color:#cfc9ca; }

.project-work-card {
    color:var(--ink-body);
    background:var(--surface-card);
    border-color:var(--line-soft);
    box-shadow:var(--card-shadow);
}
.project-work-card__head {
    min-height:6.2rem;
    padding:1rem 1.15rem;
    color:var(--ink-body);
    background:var(--surface-card);
}
.project-work-card__head:hover { background:color-mix(in srgb,var(--surface-card) 86%,var(--role-soft)); }
.project-work-card__summary { display:flex; align-items:center; gap:1rem; color:var(--ink-muted); }
.work-summary-stat { min-width:3.8rem; padding-right:.8rem; border-right:1px solid var(--line-soft); text-align:right; }
.work-summary-stat small,.work-summary-stat b { display:block; }
.work-summary-stat small { color:var(--ink-muted); font-size:.62rem; }
.work-summary-stat b { margin-top:.1rem; color:var(--ink-strong); font-size:1rem; }
.project-progress-compact { width:7.5rem; }
.project-progress-compact strong { display:block; margin-bottom:.28rem; font-size:.78rem; text-align:right; }
.project-work-card__body { padding:.8rem; background:var(--surface-subtle); border-color:var(--line-soft); }
.macro-work { overflow:hidden; background:var(--surface-card); border:1px solid var(--line-soft); border-radius:14px; }
.macro-work + .macro-work { margin-top:.65rem; }
.macro-work__head {
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    padding:.85rem 1rem;
    color:var(--ink-body);
    text-align:left;
    background:transparent;
    border:0;
    cursor:pointer;
}
.macro-work__head:hover { background:color-mix(in srgb,var(--surface-card) 84%,var(--role-soft)); }
.macro-work__summary { display:flex; align-items:center; gap:1rem; }
.macro-work__summary > span { min-width:3rem; text-align:right; }
.macro-work__summary b,.macro-work__summary small { display:block; }
.macro-work__summary b { color:var(--ink-strong); font-size:.82rem; }
.macro-work__summary small { color:var(--ink-muted); font-size:.6rem; }
.operator-task-list { border-top:1px solid var(--line-soft); }
.operator-task {
    grid-template-columns:2rem minmax(220px,1fr) minmax(170px,230px) 1.1rem;
    min-height:4.8rem;
    padding:.75rem 1rem;
    color:var(--ink-body);
    background:var(--surface-card);
    border-color:var(--line-soft);
}
.operator-task:hover { color:var(--ink-body); background:color-mix(in srgb,var(--surface-card) 82%,var(--role-soft)); }
.operator-task.is-critical { box-shadow:inset 3px 0 var(--tomato-jam-500); }
.operator-task__copy { min-width:0; }
.operator-task__copy strong,.operator-task__copy > small:last-child { display:block; }
.operator-task__copy strong { overflow:hidden; color:var(--ink-strong); text-overflow:ellipsis; white-space:nowrap; }
.operator-task__copy > small:last-child { overflow:hidden; margin-top:.15rem; color:var(--ink-muted); text-overflow:ellipsis; white-space:nowrap; }
.operator-task__state { display:flex; align-items:center; justify-content:flex-end; gap:.7rem; }
.operator-task__progress { width:7.5rem; display:grid; grid-template-columns:1fr 2.3rem; gap:.45rem; align-items:center; }
.operator-task__progress b { color:var(--ink-strong); font-size:.68rem; text-align:right; }
.operator-task__arrow { width:1rem; color:var(--ink-muted); transition:transform .2s ease,color .2s ease; }
.operator-task:hover .operator-task__arrow { color:var(--role-accent); transform:translate(2px,-2px); }
.operator-no-results { margin-top:1rem; }

.work-index__list { display:grid; gap:.8rem; }
.work-index-project,.work-index-macro {
    overflow:hidden;
    color:var(--ink-body);
    background:var(--surface-card);
    border:1px solid var(--line-soft);
    border-radius:18px;
    box-shadow:var(--card-shadow);
}
.work-index summary { list-style:none; cursor:pointer; }
.work-index summary::-webkit-details-marker { display:none; }
.work-index-project > summary {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    min-height:6rem;
    padding:1rem 1.15rem;
}
.work-index-project > summary:hover,.work-index-macro > summary:hover { background:color-mix(in srgb,var(--surface-card) 86%,var(--role-soft)); }
.work-index-project__identity { min-width:0; display:flex; align-items:center; gap:.85rem; }
.work-index-project__identity strong,.work-index-project__identity small { display:block; }
.work-index-project__identity strong { color:var(--ink-strong); font-family:var(--font-display); font-size:1.25rem; }
.work-index-project__identity small:last-child { color:var(--ink-muted); }
.work-index-project__summary { display:grid; grid-template-columns:auto auto 7rem 1.1rem; gap:.8rem; align-items:center; }
.work-index-project__summary > span:nth-child(2) { text-align:right; }
.work-index-project__summary b,.work-index-project__summary small { display:block; }
.work-index-project__summary small { color:var(--ink-muted); font-size:.62rem; }
.work-index-project__body { display:grid; gap:.6rem; padding:.75rem; background:var(--surface-subtle); border-top:1px solid var(--line-soft); }
.work-index-macro { border-radius:13px; box-shadow:none; }
.work-index-macro > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.8rem 1rem; }
.work-index-macro__summary { display:flex; align-items:center; gap:.8rem; }
.work-index-activities { border-top:1px solid var(--line-soft); }
.work-index-activity {
    display:grid;
    grid-template-columns:2rem minmax(220px,1fr) auto minmax(140px,190px);
    gap:.8rem;
    align-items:center;
    min-height:4.25rem;
    padding:.7rem 1rem;
    border-bottom:1px solid var(--line-soft);
}
.work-index-activity:last-child { border-bottom:0; }
.work-index-activity.is-critical { box-shadow:inset 3px 0 var(--tomato-jam-500); }
.work-index-activity__copy { min-width:0; }
.work-index-activity__copy strong,.work-index-activity__copy small { display:block; }
.work-index-activity__copy strong { overflow:hidden; color:var(--ink-strong); text-overflow:ellipsis; white-space:nowrap; }
.work-index-activity__copy small { overflow:hidden; color:var(--ink-muted); text-overflow:ellipsis; white-space:nowrap; }
.work-index-activity__progress { display:grid; grid-template-columns:1fr 2.4rem; gap:.45rem; align-items:center; }
.work-index-activity__progress b { color:var(--ink-strong); font-size:.68rem; text-align:right; }
.work-index-project__footer { display:flex; justify-content:flex-end; padding:.2rem; }

.modal-card,.task-action-panel,.task-checklist,.admin-step {
    color:var(--ink-body);
    background:var(--surface-raised);
    border-color:var(--line-soft);
}
.modal-card { box-shadow:0 30px 80px rgba(0,0,0,.36); }
.modal-card header { border-color:var(--line-soft); }
.admin-step { background:var(--surface-subtle); }

html[data-theme="dark"] .card-clean,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .table-shell,
html[data-theme="dark"] .invoice-ledger,
html[data-theme="dark"] .attention-grid > *,
html[data-theme="dark"] .recent-project,
html[data-theme="dark"] .alert-panel,
html[data-theme="dark"] .planning-macro-card,
html[data-theme="dark"] .planning-project-hero,
html[data-theme="dark"] .tracking-result,
html[data-theme="dark"] .equipment-card {
    color:var(--ink-body);
    background:var(--surface-card) !important;
    border-color:var(--line-soft);
    box-shadow:var(--card-shadow);
}
html[data-theme="dark"] .card-clean header,
html[data-theme="dark"] .invoice-ledger summary,
html[data-theme="dark"] .recent-project,
html[data-theme="dark"] .alert-panel a { border-color:var(--line-soft); }
html[data-theme="dark"] .table-clean { color:var(--ink-body); background:var(--surface-card); }
html[data-theme="dark"] .table-clean th { color:#d5ced0; background:#1b2729; }
html[data-theme="dark"] .table-clean td { color:var(--ink-body); background:transparent; }
html[data-theme="dark"] .table-clean tbody tr:hover td { background:rgba(82,167,173,.08); }
html[data-theme="dark"] .absolute.bg-white,
html[data-theme="dark"] .profile-dropdown { color:var(--ink-body); background:var(--surface-raised) !important; border:1px solid var(--line-soft); }
html[data-theme="dark"] .input-minimal,
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
    color:var(--ink-strong);
    background-color:var(--surface-inset);
    border-color:var(--line-strong);
}
html[data-theme="dark"] input[type="date"] { color-scheme:dark; }
html[data-theme="dark"] .btn-outline {
    color:var(--role-accent-dark);
    background:transparent;
    border-color:color-mix(in srgb,var(--role-accent) 46%,var(--line-strong));
}
html[data-theme="dark"] .btn-ghost { color:var(--ink-muted); }
html[data-theme="dark"] .btn-ghost:hover { color:var(--ink-strong); background:var(--surface-subtle); }
html[data-theme="dark"] .badge-status.secondary { color:#d8d1d3; background:#2b3235; border-color:#3b4448; }
html[data-theme="dark"] .site-footer { border-top-color:#2a3032; }
html[data-theme="dark"] .auth-form-panel {
    color:var(--ink-body);
    background:
        radial-gradient(circle at 100% 0,rgba(82,167,173,.1),transparent 22rem),
        linear-gradient(180deg,#151a1c,#101416);
}
html[data-theme="dark"] .auth-form-wrap h2 { color:var(--ink-strong); }
html[data-theme="dark"] .auth-form-intro,
html[data-theme="dark"] .auth-enrollment,
html[data-theme="dark"] .auth-back-link { color:var(--ink-muted); }
html[data-theme="dark"] .auth-form-wrap label { color:#d2cbcd; }
html[data-theme="dark"] .auth-help-link { color:var(--tropical-teal-300); }
html[data-theme="dark"] .auth-input-wrap > svg { color:#858e91; }
html[data-theme="dark"] .auth-password-toggle { color:#b9b2b4; }
html[data-theme="dark"] .auth-feedback--error { color:#ef9b8d; background:rgba(162,60,42,.16); border-color:rgba(224,147,133,.28); }
html[data-theme="dark"] .auth-feedback--success { color:#97cace; background:rgba(65,134,139,.15); border-color:rgba(116,185,190,.28); }
.theme-toggle.theme-toggle--standalone { position:fixed; top:1rem; right:1rem; left:auto; z-index:40; }

@media(max-width:980px) {
    .macro-overview { grid-template-columns:1fr; }
    .macro-overview__stats div:first-child { border-left:0; }
    .operator-work-toolbar { position:static; grid-template-columns:1fr; }
    .operator-filter-tabs { justify-content:flex-start; }
    .activity-card__summary { grid-template-columns:2rem minmax(180px,1fr) minmax(130px,180px) 1rem; }
    .activity-detail-grid { grid-template-columns:1fr; }
    .activity-card__actions { align-items:stretch; flex-direction:column; }
    .work-index-project__summary { grid-template-columns:auto auto 1.1rem; }
    .work-index-project__summary .progress-track { display:none; }
}

@media(max-width:720px) {
    .breakdown-actions { justify-content:flex-start; }
    .macro-card__head { grid-template-columns:1.8rem minmax(0,1fr) 1rem; min-height:5.4rem; padding:.9rem; }
    .macro-card__status { display:none; }
    .macro-card__body { padding:.7rem; }
    .macro-overview__stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .macro-overview__stats div:nth-child(3) { border-left:0; }
    .bulk-assign { grid-template-columns:1fr; }
    .bulk-assign__empty { grid-column:1; }
    .activity-card__summary { grid-template-columns:1.8rem minmax(0,1fr) 1rem; }
    .activity-card__progress { grid-column:2; grid-template-columns:auto 2.5rem; }
    .activity-card__detail { padding:0 .8rem .8rem; }
    .activity-detail-grid dl { grid-template-columns:1fr; }
    .activity-card__actions .task-assign { align-items:stretch; flex-direction:column; }
    .activity-card__actions .task-assign label { min-width:0; }
    .project-work-card__head { align-items:flex-start; flex-direction:column; }
    .project-work-card__summary { width:100%; justify-content:space-between; }
    .work-summary-stat { display:none; }
    .macro-work__head { align-items:flex-start; }
    .macro-work__summary > span:first-child { display:none; }
    .operator-task { grid-template-columns:1.8rem minmax(0,1fr) 1rem; }
    .operator-task__state { grid-column:2; justify-content:flex-start; }
    .operator-task__progress { flex:1; }
    .operator-filter-tabs { padding-bottom:.2rem; }
    .work-index-project > summary { align-items:flex-start; flex-direction:column; }
    .work-index-project__summary { width:100%; grid-template-columns:auto 1fr 1rem; }
    .work-index-project__summary > span:nth-child(2) { text-align:left; }
    .work-index-activity { grid-template-columns:1.8rem minmax(0,1fr) auto; }
    .work-index-activity__progress { grid-column:2/-1; }
}

@media(prefers-reduced-motion:reduce) {
    .breakdown-chevron,.details-chevron,.operator-task__arrow,.theme-toggle__icon { transition:none !important; }
}
/* DASHBOARD ADMIN V6 */
.admin-command .page-heading{align-items:center}.attention-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-bottom:1rem}.attention-grid>a{display:grid;grid-template-columns:auto 1fr;gap:.45rem .7rem;border:1px solid var(--color-shadow-grey-200);border-radius:17px;padding:1rem;color:inherit;text-decoration:none;background:var(--surface-card);transition:.2s}.attention-grid>a:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(19,17,17,.08)}.attention-grid>a>svg{grid-row:1/4;width:1.15rem;color:var(--color-shadow-grey-400)}.attention-grid span,.attention-grid small{color:var(--color-shadow-grey-500)}.attention-grid strong{font-family:'Baloo Bhaijaan 2';font-size:1.55rem}.attention-grid .is-active{border-color:var(--color-tropical-teal-300);background:var(--color-tropical-teal-50)}.attention-grid .is-urgent{border-color:var(--color-tomato-jam-300);background:var(--color-tomato-jam-50)}.dashboard-chart-grid,.dashboard-lower{display:grid;grid-template-columns:1.35fr 1fr;gap:1rem;margin-bottom:1rem}.dashboard-chart-grid article>header,.dashboard-lower article>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.dashboard-chart-grid h2,.dashboard-lower h2{margin:.15rem 0}.dashboard-chart-grid header>strong{font-size:1.8rem}.chart-frame{height:280px}.chart-empty{height:100%;display:grid;place-items:center;text-align:center;padding:1rem;color:var(--color-shadow-grey-500);font-size:.9rem}.recent-project{display:grid;grid-template-columns:minmax(160px,1fr) minmax(100px,.8fr) auto auto;gap:1rem;align-items:center;padding:.85rem 0;border-top:1px solid var(--color-shadow-grey-100);color:inherit;text-decoration:none}.recent-project small{display:block;color:var(--color-shadow-grey-500)}.recent-project>i{width:1rem}.alert-panel>a{display:flex;gap:.65rem;align-items:center;padding:.85rem 0;border-top:1px solid var(--color-shadow-grey-100);color:inherit;text-decoration:none}.alert-panel>a svg{width:1rem;color:var(--color-tomato-jam-500)}
/* Fix Fase 1: el nombre largo del proyecto empujaba la barra de avance. Las celdas
   del grid deben poder encogerse (min-width:0) y el texto recortarse con ellipsis. */
.recent-project { min-width:0; }
.recent-project > * { min-width:0; }
.recent-project strong, .recent-project small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media(max-width:900px){.attention-grid{grid-template-columns:repeat(2,1fr)}.dashboard-chart-grid,.dashboard-lower{grid-template-columns:1fr}}@media(max-width:560px){.attention-grid{grid-template-columns:1fr}.recent-project{grid-template-columns:1fr auto}.recent-project .progress-track{display:none}}
/* CATALOGOS CRUD V6 */
.catalog-header{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:1.5rem}.catalog-header h1{font-size:clamp(2.2rem,5vw,4rem);line-height:1;margin:.2rem 0}.catalog-header p{margin:0;color:var(--color-shadow-grey-500)}.catalog-header>div:last-child{display:flex;gap:.6rem;flex-wrap:wrap}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.catalog-card{border:1px solid var(--color-shadow-grey-200);background:var(--surface-card);border-radius:18px;padding:1.1rem;display:flex;flex-direction:column;min-height:240px}.catalog-card.is-inactive{opacity:.64;background:var(--color-shadow-grey-50)}.catalog-card>header{display:flex;justify-content:space-between;gap:1rem}.catalog-card h2{margin:.2rem 0;font-size:1.35rem}.status-dot{width:11px;height:11px;border-radius:50%;background:var(--color-shadow-grey-300);box-shadow:0 0 0 4px var(--color-shadow-grey-100)}.status-dot.is-on{background:var(--color-tropical-teal-600);box-shadow:0 0 0 4px var(--color-tropical-teal-100)}.catalog-card>p{color:var(--color-shadow-grey-500)}.catalog-card dl{margin:auto 0 .8rem}.catalog-card dl div{display:flex;justify-content:space-between;gap:1rem;padding:.4rem 0;border-bottom:1px solid var(--color-shadow-grey-100)}.catalog-card dt{color:var(--color-shadow-grey-500);font-size:.78rem}.catalog-card dd{margin:0;text-align:right;font-weight:650}.catalog-card>footer{display:flex;gap:.45rem;align-items:center;flex-wrap:wrap;padding-top:.7rem}.modal-form-grid{padding:1.25rem;display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.modal-form-grid label{display:grid;gap:.35rem;font-size:.78rem;font-weight:750}.modal-form-grid .span-2{grid-column:1/-1}
@media(max-width:980px){.catalog-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.catalog-header{align-items:flex-start;flex-direction:column}.catalog-grid{grid-template-columns:1fr}.modal-form-grid{grid-template-columns:1fr}.modal-form-grid .span-2{grid-column:auto}}
/* REPORTES CLIENTE V6 */
.client-reports-page .page-kicker{color:var(--color-tomato-jam-600);text-transform:uppercase;letter-spacing:.14em;font-weight:800;font-size:.7rem}.client-reports-page h2{display:flex;align-items:center;gap:.55rem;font-size:clamp(2rem,4vw,3.4rem);margin:.2rem 0}.client-reports-page h2 svg{width:1.8rem}.report-projects{display:grid;gap:1rem}.report-project{border:1px solid var(--line-soft);border-radius:20px;background:var(--surface-card);overflow:hidden}.report-project__toggle{width:100%;display:grid;grid-template-columns:minmax(220px,1.4fr) 1fr 170px auto;gap:1rem;align-items:center;padding:1.25rem;border:0;background:var(--surface-card);color:inherit;text-align:left;cursor:pointer}.report-project__identity>span{font-family:monospace;color:var(--color-shadow-grey-400);font-size:.75rem}.report-project__identity h3{margin:.15rem 0;font-size:1.35rem}.report-project__meta{display:flex;align-items:flex-start;gap:.45rem;flex-wrap:wrap}.report-extra-flag,.report-current-label{display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .45rem;border-radius:7px;background:var(--color-vanilla-custard-100);color:var(--color-vanilla-custard-800);font-size:.68rem;font-weight:800}.report-extra-flag svg{width:.75rem}.report-project__progress>span{display:block;text-align:right;font-weight:800}.report-project__progress>div,.report-entry__bar{height:6px;border-radius:999px;background:var(--color-shadow-grey-100);overflow:hidden}.report-project__progress i,.report-entry__bar i{display:block;height:100%;background:var(--color-tropical-teal-600)}.report-chevron{width:1.1rem;transition:transform .2s}.report-chevron.is-open{transform:rotate(180deg)}.report-project__body{border-top:1px solid var(--line-soft);padding:1.25rem;background:var(--surface-card)}.report-next{display:grid;grid-template-columns:auto auto 1fr;gap:.8rem;align-items:center;padding:1rem;border-radius:14px;background:var(--surface-subtle);margin-bottom:.8rem}.report-next>svg{color:var(--color-tomato-jam-500)}.report-next span{display:block;color:var(--color-shadow-grey-500);font-size:.72rem}.report-next p{margin:0 0 0 auto;color:var(--color-shadow-grey-500);max-width:520px}.report-entry{display:grid;grid-template-columns:70px minmax(180px,1fr) minmax(100px,.7fr) auto;align-items:center;gap:1rem;padding:.9rem;border-top:1px solid var(--line-soft)}.report-entry--current{background:var(--color-tropical-teal-50);border-radius:12px;border-top-color:transparent}.report-entry__date{border-right:1px solid var(--color-shadow-grey-200)}.report-entry__date strong{font-size:1.55rem}.report-entry__date span,.report-entry__copy small{display:block;color:var(--color-shadow-grey-500);font-size:.7rem}.report-entry__copy h4{margin:.15rem 0}
@media(max-width:800px){.report-project__toggle{grid-template-columns:1fr auto}.report-project__meta,.report-project__progress{grid-column:1/-1}.report-project__progress>span{text-align:left}.report-entry{grid-template-columns:60px 1fr auto}.report-entry__bar{grid-column:1/-1}.report-next{grid-template-columns:auto 1fr}.report-next p{grid-column:1/-1}}


/* ===========================================================================
   Tema oscuro — Reportes del cliente (/cliente/reportes).
   Esta seccion se agrego con el rediseno sin ninguna regla dark, por lo que en
   modo oscuro quedaban tarjetas blancas, textos ilegibles y badges apagados.
   =========================================================================== */
html[data-theme="dark"] .report-project { background:var(--surface-card); border-color:var(--line-soft); box-shadow:var(--card-shadow); }
html[data-theme="dark"] .report-project__toggle { background:var(--surface-card); color:var(--ink-body); }
html[data-theme="dark"] .report-project__toggle:hover { background:var(--surface-raised); }
html[data-theme="dark"] .report-project__identity h3 { color:var(--ink-strong); }
html[data-theme="dark"] .report-project__identity > span { color:var(--ink-muted); }
html[data-theme="dark"] .report-project__body { background:var(--surface-card); border-top-color:var(--line-soft); }
html[data-theme="dark"] .report-project__progress > span { color:var(--ink-strong); }
html[data-theme="dark"] .report-project__progress > div,
html[data-theme="dark"] .report-entry__bar { background:var(--surface-inset); }
html[data-theme="dark"] .report-chevron { color:var(--ink-muted); }

/* Aviso del proximo reporte */
html[data-theme="dark"] .report-next { background:var(--surface-subtle); }
html[data-theme="dark"] .report-next span,
html[data-theme="dark"] .report-next p { color:var(--ink-muted); }
html[data-theme="dark"] .report-next strong { color:var(--ink-strong); }

/* Renglones del historial */
html[data-theme="dark"] .report-entry { border-top-color:var(--line-soft); }
html[data-theme="dark"] .report-entry__date { border-right-color:var(--line-soft); }
html[data-theme="dark"] .report-entry__date strong,
html[data-theme="dark"] .report-entry__copy h4 { color:var(--ink-strong); }
html[data-theme="dark"] .report-entry__date span,
html[data-theme="dark"] .report-entry__copy small { color:var(--ink-muted); }
/* El reporte mas reciente se resalta con un tinte teal legible en oscuro */
html[data-theme="dark"] .report-entry--current { background:rgba(65,134,139,.18); }

/* Etiquetas (partida extra / reporte actual) */
html[data-theme="dark"] .report-extra-flag,
html[data-theme="dark"] .report-current-label { background:rgba(226,177,29,.18); color:var(--vanilla-custard-300); }

/* Boton de descarga del PDF visible en oscuro */
html[data-theme="dark"] .report-entry .btn-outline { color:var(--ink-strong); border-color:var(--line-strong); }
html[data-theme="dark"] .report-entry .btn-outline:hover { background:var(--surface-subtle); color:var(--ink-strong); }

/* Estados vacios cuidados en ambos temas */
html[data-theme="dark"] .client-reports-page .empty-state { background:var(--surface-card); border-color:var(--line-soft); color:var(--ink-muted); }
html[data-theme="dark"] .client-reports-page .text-graphite-500 { color:var(--ink-muted); }

/* ===========================================================================
   Tema oscuro y pulido — Catalogos (equipos, materiales, operadores).
   Fase 5 del plan V4.1: los tres catalogos comparten .catalog-card pero no
   tenian ninguna regla dark, y sus espaciados diferian ligeramente entre si.
   =========================================================================== */
.catalog-card { transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.catalog-card:hover { border-color:var(--line-strong); box-shadow:var(--shadow-soft); transform:translateY(-2px); }
/* Espaciado consistente entre los tres catalogos */
.catalog-card > footer { gap:.5rem; padding-top:.85rem; margin-top:auto; border-top:1px solid var(--line-soft); }

html[data-theme="dark"] .catalog-header p { color:var(--ink-muted); }
html[data-theme="dark"] .catalog-header h1 { color:var(--ink-strong); }
html[data-theme="dark"] .catalog-card { background:var(--surface-card); border-color:var(--line-soft); color:var(--ink-body); }
html[data-theme="dark"] .catalog-card:hover { border-color:var(--line-strong); }
html[data-theme="dark"] .catalog-card h2 { color:var(--ink-strong); }
html[data-theme="dark"] .catalog-card > p,
html[data-theme="dark"] .catalog-card dt { color:var(--ink-muted); }
html[data-theme="dark"] .catalog-card dd { color:var(--ink-body); }
html[data-theme="dark"] .catalog-card dl div { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .catalog-card > footer { border-top-color:var(--line-soft); }
html[data-theme="dark"] .catalog-card .eyebrow { color:var(--ink-muted); }

/* Indicador de estado: contraste suficiente sobre fondo oscuro */
html[data-theme="dark"] .status-dot { background:var(--shadow-grey-600); box-shadow:0 0 0 4px rgba(255,255,255,.06); }
html[data-theme="dark"] .status-dot.is-on { background:var(--tropical-teal-400); box-shadow:0 0 0 4px rgba(116,185,190,.18); }

/* Modales de edicion de los catalogos */
html[data-theme="dark"] .modal-form-grid label { color:var(--ink-body); }
html[data-theme="dark"] .modal-form-grid .input-minimal,
html[data-theme="dark"] .modal-form-grid select,
html[data-theme="dark"] .modal-form-grid textarea {
    color:var(--ink-strong); background:var(--surface-subtle); border-color:var(--line-soft);
}
html[data-theme="dark"] .modal-form-grid .input-minimal::placeholder { color:var(--ink-muted); }

/* Estados vacios de los catalogos, cuidados en ambos temas */
.catalog-page .empty-state { padding:3rem 1.5rem; text-align:center; color:var(--text-muted); background:var(--surface-card); border:1px dashed var(--line-strong); border-radius:18px; }
.catalog-page .empty-state svg { width:2rem; height:2rem; opacity:.7; margin-bottom:.5rem; }
html[data-theme="dark"] .catalog-page .empty-state { background:var(--surface-card); border-color:var(--line-strong); color:var(--ink-muted); }
html[data-theme="dark"] .catalog-page .empty-state h2 { color:var(--ink-strong); }

/* ===========================================================================
   Tema oscuro — Facturacion (/admin/facturacion).
   Los KPIs, filtros, tarjetas de factura, desglose y complementarias usaban
   fondos blancos fijos sin ninguna regla dark.
   =========================================================================== */
html[data-theme="dark"] .billing-kpis article { background:var(--surface-card); border-color:var(--line-soft); color:var(--ink-body); }
html[data-theme="dark"] .billing-kpis article span { color:var(--ink-muted); }
html[data-theme="dark"] .billing-kpis article strong { color:var(--ink-strong); }
html[data-theme="dark"] .billing-kpis article svg { color:var(--ink-muted); opacity:.5; }
html[data-theme="dark"] .billing-filters { background:var(--surface-subtle); border-color:var(--line-soft); }
html[data-theme="dark"] .billing-filters label { color:var(--ink-muted); }
html[data-theme="dark"] .billing-filters .input-minimal,
html[data-theme="dark"] .billing-filters select { color:var(--ink-strong); background:var(--surface-card); border-color:var(--line-soft); }

/* Tarjeta de factura (raiz) */
html[data-theme="dark"] .invoice-family { background:var(--surface-card); border-color:var(--line-soft); box-shadow:var(--card-shadow); }
html[data-theme="dark"] .invoice-family__identity h3,
html[data-theme="dark"] .invoice-family strong { color:var(--ink-strong); }
html[data-theme="dark"] .invoice-family small,
html[data-theme="dark"] .invoice-family span { color:var(--ink-muted); }

/* Desglose de partidas e historial de pagos */
html[data-theme="dark"] .invoice-breakdown { border-top-color:var(--line-soft); background:var(--surface-card); }
html[data-theme="dark"] .invoice-line { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .invoice-line span { color:var(--ink-muted); }
html[data-theme="dark"] .invoice-line p,
html[data-theme="dark"] .invoice-line strong { color:var(--ink-body); }
html[data-theme="dark"] .invoice-empty-lines { color:var(--ink-muted); }

/* Facturas complementarias */
html[data-theme="dark"] .invoice-children { background:var(--surface-subtle); border-top-color:var(--line-soft); }
html[data-theme="dark"] .invoice-child { background:var(--surface-card); border-color:var(--line-soft); }
html[data-theme="dark"] .invoice-child h4 { color:var(--ink-strong); }
html[data-theme="dark"] .invoice-child span { color:var(--ink-muted); }
html[data-theme="dark"] .invoice-child strong { color:var(--ink-body); }
html[data-theme="dark"] .invoice-child__lines { border-top-color:var(--line-soft); }
html[data-theme="dark"] .invoice-kind--extra { background:rgba(226,177,29,.18); color:var(--vanilla-custard-300); }

/* Modal de pago sobre fondo oscuro */
html[data-theme="dark"] .modal-card__body label { color:var(--ink-body); }
html[data-theme="dark"] .modal-card__body .input-minimal,
html[data-theme="dark"] .modal-card__body select,
html[data-theme="dark"] .modal-card__body textarea { color:var(--ink-strong); background:var(--surface-subtle); border-color:var(--line-soft); }
html[data-theme="dark"] .modal-card > footer { background:var(--surface-subtle); border-top-color:var(--line-soft); }

/* ===========================================================================
   Desglose de factura: pestanas Partidas / Historial de pagos.
   =========================================================================== */
.invoice-tabs { display:flex; gap:.4rem; padding:.6rem 0 .8rem; border-bottom:1px solid var(--border-light); }
.invoice-tabs button {
    display:inline-flex; align-items:center; gap:.4rem; padding:.45rem .8rem;
    color:var(--text-muted); background:transparent; border:1px solid transparent;
    border-radius:.6rem; font-size:.8rem; font-weight:650; cursor:pointer;
    transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.invoice-tabs button svg { width:.9rem; height:.9rem; }
.invoice-tabs button:hover { color:var(--text-dark); background:var(--surface-subtle); }
.invoice-tabs button.is-active { color:var(--text-dark); background:var(--surface-subtle); border-color:var(--border-light); }
.invoice-tabs__count {
    min-width:1.3rem; padding:0 .3rem; text-align:center; border-radius:999px;
    background:var(--shadow-grey-100); color:var(--shadow-grey-600); font-size:.68rem;
}

/* Renglon de pago del historial */
.invoice-payment {
    min-height:3.2rem; padding:.65rem .4rem; display:grid;
    grid-template-columns:minmax(8rem,.6fr) minmax(10rem,1.4fr) auto;
    align-items:center; gap:1rem; border-bottom:1px solid var(--border-light);
}
.invoice-payment__date strong { display:block; font-size:.9rem; }
.invoice-payment__date span { display:block; color:var(--text-muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; }
.invoice-payment__ref span { display:block; font-size:.85rem; }
.invoice-payment__ref small { display:block; color:var(--text-muted); font-size:.72rem; }
.invoice-payment__amount { font-family:var(--font-display); font-size:1.05rem; color:#2d6a4f; }
.invoice-payment-summary { display:flex; justify-content:flex-end; gap:2rem; padding:.8rem .4rem .2rem; }
.invoice-payment-summary span { display:block; color:var(--text-muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.04em; }
.invoice-payment-summary strong { font-family:var(--font-display); font-size:1.1rem; }

html[data-theme="dark"] .invoice-tabs { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .invoice-tabs button { color:var(--ink-muted); }
html[data-theme="dark"] .invoice-tabs button:hover,
html[data-theme="dark"] .invoice-tabs button.is-active { color:var(--ink-strong); background:var(--surface-subtle); border-color:var(--line-soft); }
html[data-theme="dark"] .invoice-tabs__count { background:var(--surface-inset); color:var(--ink-muted); }
html[data-theme="dark"] .invoice-payment { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .invoice-payment__date strong,
html[data-theme="dark"] .invoice-payment__ref span { color:var(--ink-body); }
html[data-theme="dark"] .invoice-payment__date span,
html[data-theme="dark"] .invoice-payment__ref small { color:var(--ink-muted); }
html[data-theme="dark"] .invoice-payment__amount { color:#9bd3b4; }
html[data-theme="dark"] .invoice-payment-summary span { color:var(--ink-muted); }
html[data-theme="dark"] .invoice-payment-summary strong { color:var(--ink-strong); }

@media(max-width:650px){
    .invoice-payment { grid-template-columns:1fr auto; }
    .invoice-payment__ref { grid-column:1/-1; }
    .invoice-payment-summary { justify-content:space-between; gap:1rem; }
}

/* ===========================================================================
   Dashboard — "Avance por proyecto" y "Carga por operador" en HTML/CSS.
   Sustituyen las graficas de barras de Chart.js: mas legibles, sin dependencia
   externa y con soporte nativo de tema claro/oscuro via tokens.
   =========================================================================== */
.progress-list, .workload-list { display:flex; flex-direction:column; gap:.15rem; max-height:280px; overflow-y:auto; padding-right:.2rem; }

/* --- Avance por proyecto --- */
.progress-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(90px,.9fr) 3.2rem; align-items:center; gap:.9rem; padding:.6rem .15rem; border-bottom:1px solid var(--border-light); }
.progress-row:last-of-type { border-bottom:0; }
.progress-row__label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.88rem; font-weight:600; color:var(--text-dark); }
.progress-row__track { height:8px; border-radius:999px; background:var(--surface-inset); overflow:hidden; }
.progress-row__track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--vanilla-custard-500),var(--tomato-jam-500)); transition:width .45s ease; }
.progress-row__track i.is-complete { background:linear-gradient(90deg,var(--tropical-teal-400),var(--tropical-teal-600)); }
.progress-row__track i.is-low { background:linear-gradient(90deg,var(--shadow-grey-300),var(--shadow-grey-500)); }
.progress-row b { text-align:right; font-family:var(--font-display); font-size:.95rem; color:var(--text-dark); }

/* --- Carga por operador (ranking) --- */
.workload-row { display:grid; grid-template-columns:2rem minmax(0,1fr) 2.2rem; align-items:center; gap:.8rem; padding:.55rem .15rem; border-bottom:1px solid var(--border-light); }
.workload-row:last-of-type { border-bottom:0; }
.workload-row__avatar { width:2rem; height:2rem; display:grid; place-items:center; border-radius:50%; background:var(--tropical-teal-100); color:var(--tropical-teal-700); font-weight:800; font-size:.85rem; text-transform:uppercase; }
.workload-row__body { min-width:0; display:flex; flex-direction:column; gap:.3rem; }
.workload-row__name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.85rem; font-weight:600; color:var(--text-dark); }
.workload-row__track { height:6px; border-radius:999px; background:var(--surface-inset); overflow:hidden; }
.workload-row__track i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--tropical-teal-500),var(--tropical-teal-700)); transition:width .45s ease; }
.workload-row b { text-align:right; font-family:var(--font-display); font-size:1rem; color:var(--text-dark); }

/* --- Tema oscuro --- */
html[data-theme="dark"] .progress-row,
html[data-theme="dark"] .workload-row { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .progress-row__label,
html[data-theme="dark"] .workload-row__name,
html[data-theme="dark"] .progress-row b,
html[data-theme="dark"] .workload-row b { color:var(--ink-strong); }
html[data-theme="dark"] .progress-row__track,
html[data-theme="dark"] .workload-row__track { background:var(--surface-inset); }
html[data-theme="dark"] .workload-row__avatar { background:rgba(65,134,139,.25); color:var(--tropical-teal-300); }

@media(max-width:650px){
    .progress-row { grid-template-columns:minmax(0,1fr) 3rem; }
    .progress-row__track { grid-column:1/-1; order:3; }
}

/* ===========================================================================
   DASHBOARD ADMIN — rediseno completo (operacion + comercial, SIN importes).
   =========================================================================== */
.dash-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; margin-bottom:1.6rem; }
.dash-hero__intro h1 { font-size:clamp(2rem,4vw,3rem); line-height:1.05; margin:.2rem 0; }
.dash-hero__intro p { margin:0; color:var(--text-muted); }
.dash-hero__pulse { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }

/* Anillo de avance global del portafolio */
.dash-pulse { display:flex; align-items:center; gap:.85rem; padding:.7rem 1.1rem .7rem .7rem; background:var(--surface-card); border:1px solid var(--border-light); border-radius:1rem; box-shadow:var(--shadow-soft); }
.dash-pulse__ring { position:relative; width:3.6rem; height:3.6rem; display:grid; place-items:center; border-radius:50%;
    background:conic-gradient(var(--tropical-teal-500) var(--avance,0%), var(--surface-inset) 0); }
.dash-pulse__ring::after { content:""; position:absolute; inset:5px; border-radius:50%; background:var(--surface-card); }
.dash-pulse__ring b { position:relative; z-index:1; font-family:var(--font-display); font-size:.85rem; color:var(--text-dark); }
.dash-pulse strong { display:block; font-size:.95rem; }
.dash-pulse small { color:var(--text-muted); font-size:.75rem; }

/* Secciones y columnas */
.dash-section { margin-bottom:1.6rem; display:flex; flex-direction:column; gap:.9rem; }
.dash-section__head { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.dash-section__head h2 { display:flex; align-items:center; gap:.5rem; margin:0; font-size:1.15rem; }
.dash-section__head h2 svg { width:1.05rem; height:1.05rem; color:var(--accent-blue); }
.dash-section__hint { color:var(--text-muted); font-size:.78rem; }
.dash-section__link { color:var(--accent-blue); font-size:.82rem; font-weight:650; text-decoration:none; }
.dash-section__link:hover { text-decoration:underline; }
.dash-columns { display:grid; grid-template-columns:1.15fr 1fr; gap:1.4rem; align-items:start; }

/* Tarjetas de atencion */
.dash-attention { display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
.dash-attention__card { display:grid; gap:.15rem; padding:1.05rem; color:inherit; text-decoration:none;
    background:var(--surface-card); border:1px solid var(--border-light); border-left:3px solid var(--border-light);
    border-radius:1rem; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.dash-attention__card:hover { transform:translateY(-3px); box-shadow:var(--shadow-soft); }
.dash-attention__card svg { width:1.1rem; height:1.1rem; color:var(--text-muted); }
.dash-attention__card strong { font-family:var(--font-display); font-size:1.9rem; line-height:1.1; }
.dash-attention__card span { font-size:.85rem; font-weight:650; }
.dash-attention__card small { color:var(--text-muted); font-size:.72rem; }
.dash-attention__card.is-active { border-left-color:var(--tropical-teal-500); }
.dash-attention__card.is-active svg { color:var(--tropical-teal-600); }
.dash-attention__card.is-urgent { border-left-color:var(--tomato-jam-500); background:var(--tomato-jam-50); }
.dash-attention__card.is-urgent svg,
.dash-attention__card.is-urgent strong { color:var(--tomato-jam-600); }

/* Cabecera y pie de tarjeta */
.dash-card__head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.9rem; }
.dash-card__head h3 { margin:.1rem 0 0; font-size:1.15rem; }
.dash-card__foot { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-top:.9rem; padding-top:.75rem; border-top:1px solid var(--border-light); color:var(--text-muted); font-size:.78rem; }
.dash-card__foot b { color:var(--text-dark); font-weight:750; }

/* Estado vacio en linea. Se usaba en cinco plantillas (dashboard, tareas,
   modelos, macrocomponentes, detalle de tarea del operador) sin ninguna regla
   que lo definiera: el texto salia pegado al borde y sin jerarquia visual. */
.empty-inline { display:flex; align-items:center; justify-content:center; gap:.55rem;
    margin:0; padding:1.5rem 1rem; text-align:center; color:var(--text-muted);
    font-size:.88rem; line-height:1.5; }
.empty-inline i, .empty-inline svg { width:18px; height:18px; flex:0 0 auto; opacity:.6; }
.empty-inline a { color:var(--accent-blue); }
html[data-theme="dark"] .empty-inline { color:var(--ink-muted); }

/* Embudo comercial */
.dash-funnel { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.2rem; counter-reset:paso; }
.dash-funnel li { display:grid; grid-template-columns:1.8rem 1fr auto; align-items:center; gap:.85rem; padding:.7rem .2rem; border-bottom:1px solid var(--border-light); }
.dash-funnel li:last-child { border-bottom:0; }
.dash-funnel__step { width:1.8rem; height:1.8rem; display:grid; place-items:center; border-radius:50%; background:var(--surface-subtle); color:var(--text-muted); font-size:.75rem; font-weight:800; }
.dash-funnel li div { display:flex; align-items:baseline; gap:.6rem; }
.dash-funnel li strong { font-family:var(--font-display); font-size:1.35rem; }
.dash-funnel li span { color:var(--text-muted); font-size:.85rem; }
.dash-funnel li a { color:var(--text-muted); display:grid; place-items:center; }
.dash-funnel li a:hover { color:var(--accent-blue); }

/* --- Tema oscuro --- */
html[data-theme="dark"] .dash-hero__intro h1 { color:var(--ink-strong); }
html[data-theme="dark"] .dash-hero__intro p { color:var(--ink-muted); }
html[data-theme="dark"] .dash-pulse { background:var(--surface-card); border-color:var(--line-soft); }
html[data-theme="dark"] .dash-pulse__ring::after { background:var(--surface-card); }
html[data-theme="dark"] .dash-pulse__ring b,
html[data-theme="dark"] .dash-pulse strong { color:var(--ink-strong); }
html[data-theme="dark"] .dash-pulse small { color:var(--ink-muted); }
html[data-theme="dark"] .dash-section__head h2 { color:var(--ink-strong); }
html[data-theme="dark"] .dash-section__hint { color:var(--ink-muted); }
html[data-theme="dark"] .dash-attention__card { background:var(--surface-card); border-color:var(--line-soft); border-left-color:var(--line-soft); color:var(--ink-body); }
html[data-theme="dark"] .dash-attention__card strong { color:var(--ink-strong); }
html[data-theme="dark"] .dash-attention__card small { color:var(--ink-muted); }
html[data-theme="dark"] .dash-attention__card.is-active { border-left-color:var(--tropical-teal-400); }
html[data-theme="dark"] .dash-attention__card.is-urgent { background:rgba(162,60,42,.16); border-left-color:var(--tomato-jam-400); }
html[data-theme="dark"] .dash-attention__card.is-urgent strong,
html[data-theme="dark"] .dash-attention__card.is-urgent svg { color:#ef9b8d; }
html[data-theme="dark"] .dash-card__head h3 { color:var(--ink-strong); }
html[data-theme="dark"] .dash-card__foot { border-top-color:var(--line-soft); color:var(--ink-muted); }
html[data-theme="dark"] .dash-card__foot b { color:var(--ink-strong); }
html[data-theme="dark"] .dash-funnel li { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .dash-funnel__step { background:var(--surface-inset); color:var(--ink-muted); }
html[data-theme="dark"] .dash-funnel li strong { color:var(--ink-strong); }
html[data-theme="dark"] .dash-funnel li span { color:var(--ink-muted); }

@media(max-width:1100px){ .dash-columns { grid-template-columns:1fr; } .dash-attention { grid-template-columns:repeat(2,1fr); } }
@media(max-width:620px){ .dash-attention { grid-template-columns:1fr; } .dash-hero { flex-direction:column; align-items:flex-start; } }

/* ===========================================================================
   PERFIL DEL ADMINISTRADOR (/admin/perfil)
   =========================================================================== */
.profile-grid { display:grid; grid-template-columns:320px 1fr; gap:1.4rem; align-items:start; }
.profile-summary { text-align:center; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.profile-avatar { width:5rem; height:5rem; display:grid; place-items:center; border-radius:50%;
    background:linear-gradient(135deg,var(--tropical-teal-500),var(--tropical-teal-700));
    color:#fff; font-family:var(--font-display); font-size:2.1rem; text-transform:uppercase; }
.profile-summary h2 { margin:.3rem 0 0; font-size:1.25rem; }
.profile-summary dl { width:100%; margin:1rem 0 0; text-align:left; }
.profile-summary dl div { display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; border-bottom:1px solid var(--border-light); }
.profile-summary dl div:last-child { border-bottom:0; }
.profile-summary dt { color:var(--text-muted); font-size:.76rem; }
.profile-summary dd { margin:0; text-align:right; font-size:.82rem; font-weight:650; word-break:break-word; }
.profile-forms { display:flex; flex-direction:column; gap:1.2rem; }
.profile-form__head { margin-bottom:1rem; }
.profile-form__head h2 { margin:.1rem 0 0; font-size:1.2rem; }
.field-error { margin:.35rem 0 0; color:#c0392b; font-size:.75rem; }
.field-hint { display:flex; align-items:center; gap:.35rem; margin:.5rem 0 0; color:var(--text-muted); font-size:.75rem; }
.field-hint svg { width:.85rem; height:.85rem; }

html[data-theme="dark"] .profile-summary h2 { color:var(--ink-strong); }
html[data-theme="dark"] .profile-summary dl div { border-bottom-color:var(--line-soft); }
html[data-theme="dark"] .profile-summary dt,
html[data-theme="dark"] .field-hint { color:var(--ink-muted); }
html[data-theme="dark"] .profile-summary dd { color:var(--ink-body); }
html[data-theme="dark"] .profile-form__head h2 { color:var(--ink-strong); }
html[data-theme="dark"] .field-error { color:#ef9b8d; }

@media(max-width:900px){ .profile-grid { grid-template-columns:1fr; } }