/* ═══════════════════════════════════════════════════════════════════════
   CRETUM DESK · CSS base (antes vivía en línea en el <head> de index.html)
   Se sacó el 2026-11-04 para que el navegador lo guarde en caché (inmutable,
   con ?v= en index.html) en vez de volver a bajar 380 KB con cada visita.
   Orden de la cascada intacto: index.html lo enlaza en el mismo lugar, ANTES
   de mobile.css y desk.css. Los <style> chicos del <body> siguen ahí.
   Al cambiar este archivo: subir app.css?v= en index.html (por patrón).
   ═══════════════════════════════════════════════════════════════════════ */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --navy:#1a3a6b;--navy-dark:#112850;--navy-mid:#2a4f8f;--navy-light:#3b65b0;
  --navy-pale:#e8eef7;--navy-ghost:#f0f4fa;
  --white:#fff;--gray-50:#f8f9fc;--gray-100:#eef0f5;--gray-200:#dde1ec;
  --gray-300:#c4cad8;--gray-400:#9aa3b5;--gray-500:#6b7589;--gray-700:#3d4559;--gray-900:#1a1f2e;
  --green:#1a8c5b;--green-bg:#e8f7f0;
  --amber:#b07d20;--amber-bg:#fdf3dc;
  --red:#c0392b;--red-bg:#fcecea;
  --blue:#2980b9;--blue-bg:#e8f3fb;
  /* Alias que usa el módulo Fund Rising (otra convención de nombres). Apuntan a
     variables que YA voltean en modo oscuro, así el módulo se adapta solo. */
  --card:var(--white);--border:var(--gray-200);--muted:var(--gray-500);
  /* Alias de la zona de Campañas/Listas (otra convención de nombres, heredada).
     Se usaban como var(--ink,#223) sin estar definidos: en oscuro el fallback
     claro ganaba y el texto quedaba casi invisible. Apuntados a tokens que YA
     voltean con el tema, los 190+ usos se arreglan de una vez. */
  --ink:var(--gray-900);--ink-soft:var(--gray-500);--line:var(--gray-200);
  --r-sm:5px;--r-md:8px;--r-lg:12px;--r-xl:16px;
  --font:'DM Sans',sans-serif;--mono:'DM Mono',monospace;
  --shadow-sm:0 1px 4px rgba(26,58,107,.08);--shadow-md:0 4px 16px rgba(26,58,107,.12);
}
html,body{min-height:100%;font-family:var(--font);background:var(--gray-50);color:var(--gray-900);font-size:14px;-webkit-text-size-adjust:100%;text-size-adjust:100%;transition:background-color .25s ease, color .25s ease}
/* Evita el scroll horizontal de toda la página (al deslizar derecha salía
   un espacio en blanco). 'clip' recorta sin crear contenedor de scroll, así
   que NO rompe el sticky ni el scroll interno de tablas (.db-list-wrap). */
html,body{overflow-x:clip;max-width:100%}

/* ═══════════════════════════════════════════
   MODO OSCURO — negro + acentos según org
═══════════════════════════════════════════ */
[data-theme="dark"]{
  --navy:#5d8ff5; --navy-dark:#3b65b0; --navy-mid:#4a76dc; --navy-light:#7ba8ff;
  --navy-pale:rgba(93,143,245,.15); --navy-ghost:rgba(93,143,245,.07);
  --brand-text:#5d8ff5;
  /* Navy-charcoal por capas: fondo(#0c0f16) < superficie(#161b24) < elevado.
     Texto casi-blanco (no #fff puro) y grises con leve tinte navy = premium. */
  --white:#161b24;
  --gray-50:#0c0f16; --gray-100:#242b37; --gray-200:#2f3744;
  --gray-300:#3c4655; --gray-400:#828b9e; --gray-500:#a4adbe;
  --gray-700:#d3d8e1; --gray-900:#eceff4;
  --green:#4ade80; --green-bg:rgba(74,222,128,.14);
  --amber:#f5b842; --amber-bg:rgba(245,184,66,.14);
  --red:#e87b6a;   --red-bg:rgba(232,123,106,.14);
  --blue:#5cb3e8;  --blue-bg:rgba(92,179,232,.12);
  --shadow-sm:0 1px 3px rgba(0,0,0,.45);
  --shadow-md:0 10px 30px -8px rgba(0,0,0,.55);
}
[data-theme="dark"][data-org="mvp"]{
  --navy:#F89540; --navy-dark:#c9651f; --navy-mid:#ED7824; --navy-light:#fbb27a;
  --navy-pale:rgba(237,120,36,.18); --navy-ghost:rgba(237,120,36,.08);
  --brand-text:#F89540;
  /* MVP en oscuro: negro CÁLIDO / anaranjado (identidad naranja), no navy */
  --white:#181410; --gray-50:#0d0a07;
  --gray-100:#2f271d; --gray-200:#3d3428; --gray-300:#4e4436;
  --gray-400:#948976; --gray-500:#b3a893; --gray-700:#ded7ca; --gray-900:#f4f0e8;
  --card:#1f1810;   /* tarjetas camp-* (var(--card,#1a2030)) en cálido */
}
/* MVP en oscuro: superficies hardcodeadas en versión cálida (el tema base es navy) */
[data-theme="dark"][data-org="mvp"] .header{background:#0d0a07}
[data-theme="dark"][data-org="mvp"] .login-box{background:#1a1610}
[data-theme="dark"][data-org="mvp"] .fi,
[data-theme="dark"][data-org="mvp"] .f-inp,
[data-theme="dark"][data-org="mvp"] .f-sel{background:#120e0a;border-color:#3d3428}
[data-theme="dark"][data-org="mvp"] .li-prog-bar,
[data-theme="dark"][data-org="mvp"] .kb-prog{background:#3d3428}
[data-theme="dark"][data-org="mvp"] .modal-box,
[data-theme="dark"][data-org="mvp"] .task-modal-box{background:#1c1712}
[data-theme="dark"][data-org="mvp"] .modal-cancel{background:#3a3126}
[data-theme="dark"][data-org="mvp"] .modal-cancel:hover{background:#46392c}
[data-theme="dark"][data-org="mvp"] .kb-col{background:#12100a}
[data-theme="dark"][data-org="mvp"] .kb-col-head{background:#1a1610}
[data-theme="dark"][data-org="mvp"] .nav-drawer{background:#181410;border-right-color:rgba(255,255,255,.07)}
/* MVP oscuro: tablas de Base de Datos (hexes fríos → cálidos) */
[data-theme="dark"][data-org="mvp"] .db-list-wrap,
[data-theme="dark"][data-org="mvp"] .db-table th,
[data-theme="dark"][data-org="mvp"] .db-table tr.db-total-row td,
[data-theme="dark"][data-org="mvp"] .db-filter-sel{background:#17110b}
[data-theme="dark"][data-org="mvp"] .db-list-table th{background:#100b06}
[data-theme="dark"][data-org="mvp"] .db-list-table td{border-color:#29200f}
[data-theme="dark"][data-org="mvp"] .db-filter-sel.active{background:var(--navy-pale);color:var(--navy-light)}
/* MVP oscuro: Portal de clientes (tints azules → cálidos) */
[data-theme="dark"][data-org="mvp"] .pt-sharebar{background:var(--navy-ghost);border-color:var(--navy-pale)}
[data-theme="dark"][data-org="mvp"] .pt-file-drop:hover{background:var(--navy-ghost)}

[data-theme="dark"] .header{background:#0c1119}
[data-theme="dark"] .login-box{background:#171d27;color:var(--gray-900)}
[data-theme="dark"] .fi{background:#0e131c;color:var(--gray-900);border-color:#2a323e}
[data-theme="dark"] .fi::placeholder{color:var(--gray-400)}
[data-theme="dark"] .li-prog-bar,[data-theme="dark"] .kb-prog{background:#2a323e}
[data-theme="dark"] .modal-box,[data-theme="dark"] .task-modal-box{background:#1a212c}
[data-theme="dark"] .modal-cancel{background:#2a323e;color:var(--gray-700)}
[data-theme="dark"] .modal-cancel:hover{background:#333d4b}
[data-theme="dark"] .tl-items{border-left-color:#242b37}
[data-theme="dark"] .tl-item::before{border-color:#161b24}
[data-theme="dark"] .settings-pop{background:rgba(24,24,27,.78);border-color:rgba(255,255,255,.09);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 18px 44px -12px rgba(0,0,0,.6),0 6px 14px -8px rgba(0,0,0,.4)}
[data-theme="dark"] .settings-row:hover{background:rgba(255,255,255,.05)}
[data-theme="dark"] .settings-logout:hover{background:rgba(232,123,106,.18)}
[data-theme="dark"] .settings-userhead-av{background:rgba(93,143,245,.18);color:var(--navy-light)}
[data-theme="dark"][data-org="mvp"] .settings-userhead-av{background:rgba(237,120,36,.18);color:var(--navy-light)}
[data-theme="dark"] .toggle-track::after{background:#e8eef7}
[data-theme="dark"] .kb-col{background:#0f141d}
[data-theme="dark"] .kb-col-head{background:#161d28}
[data-theme="dark"] .f-inp,[data-theme="dark"] .f-sel{background:#0e131c;color:var(--gray-900);border-color:#2a323e}
[data-theme="dark"] .f-inp::placeholder{color:var(--gray-400)}
[data-theme="dark"] .drawer-btn{background:#161616}
[data-theme="dark"] .drawer-btn:hover{background:#222222}
[data-theme="dark"] input[type=number]{background:#0a0a0a;color:var(--gray-900);border-color:#2a2a2a}
[data-theme="dark"] .header-user{background:rgba(255,255,255,.08)}
[data-theme="dark"] .header-user:hover{background:rgba(255,255,255,.14)}
[data-theme="dark"] .modal-backdrop{background:rgba(0,0,0,.7)}

/* Títulos en color de marca (dark) */
[data-theme="dark"] .home-greeting,
[data-theme="dark"] .selector-greeting{color:var(--navy)}
[data-theme="dark"] .db-detail-name{color:var(--navy)}
[data-theme="dark"] .type-tab{background:#0f131e;border-color:var(--gray-200);color:var(--gray-500)}
[data-theme="dark"] .type-tab.on{background:var(--navy);border-color:var(--navy);color:#0f131e}
[data-theme="dark"] .type-tab:not(.on):hover{background:#1a2238;color:var(--gray-700)}
[data-theme="dark"] .assign-body{background:#1a2238}
[data-theme="dark"] .assign-btn{background:rgba(245,184,66,.12);color:var(--amber)}
[data-theme="dark"] .li-chk{background:#0f131e;border-color:var(--gray-300)}
[data-theme="dark"] .li-chk.on{background:var(--navy);border-color:var(--navy);color:#0f131e}
[data-theme="dark"]{color-scheme:dark}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{background:var(--gray-200);border-radius:3px}
button,input,select{font-family:var(--font)}
/* Desplegables homogéneos: chevron propio (no el nativo del SO), mismo look que los inputs */
select.camp-f-inp,select.form-input,.camp-resp-sel,.f-row select,select.lst-add-inp{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%238893a5' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:12px;
}
select.camp-f-inp::-ms-expand,select.form-input::-ms-expand{display:none}
[data-theme="dark"] select.camp-f-inp,[data-theme="dark"] select.form-input,[data-theme="dark"] .camp-resp-sel,[data-theme="dark"] .f-row select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%23aab4c4' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* Se repiten aquí porque las reglas oscuras de .form-input, .camp-f-inp,
     .camp-resp-sel y .lst-add-inp usan el shorthand `background:` (más
     específico que select.X), que resetea repeat/position/size: la flecha
     salía en mosaico por todo el control en modo oscuro (visto en Fund Rising
     móvil). Con esto gana esta regla en los tres y la flecha vuelve a ser una. */
  background-repeat:no-repeat;background-position:right 13px center;background-size:12px;
}

/* ── HEADER ── */
.header{
  background:var(--navy);color:white;
  padding:0 24px;height:56px;
  display:flex;align-items:center;gap:12px;
  /* fixed (no sticky): visible SIEMPRE al scrollear, en todas las vistas */
  position:fixed;top:0;left:0;right:0;z-index:10;
}
.header-brand{
  display:flex;align-items:center;gap:9px;
  background:white;border:none;border-radius:var(--r-md);
  padding:4px 14px 4px 4px;flex-shrink:0;margin-right:auto;   /* empuja el grupo derecho (System/Noticias/cuenta) a la derecha */
  font-family:var(--font);cursor:pointer;
  transition:box-shadow .15s,transform .12s;
}
.header-brand:hover{box-shadow:0 0 0 2px rgba(255,255,255,.5)}
.header-brand:active{transform:scale(.98)}
.header-brand:disabled{cursor:default}
.header-brand:disabled:hover{box-shadow:none}
.header-brand:disabled:active{transform:none}
.header-mark{
  width:34px;height:34px;border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;
  padding:4px;overflow:hidden;flex-shrink:0;
}
.header-logo{width:100%;height:100%;object-fit:contain;display:block}
.header-title{font-size:14px;font-weight:500;color:var(--brand-text,#1a3a6b);letter-spacing:.3px;white-space:nowrap;flex:1}

/* ═══════════════════════════════════════════
   ORG MVP — override de colores a naranja
═══════════════════════════════════════════ */
[data-org="mvp"]{
  --navy:        #ED7824;
  --navy-dark:   #c9651f;
  --navy-mid:    #d96e1f;
  --navy-light:  #F89540;
  --navy-pale:   rgba(237,120,36,.12);
  --navy-ghost:  rgba(237,120,36,.05);
  --brand-text:  #ED7824;
}
.header-user{
  display:flex;align-items:center;gap:9px;font-size:13px;color:white;
  background:rgba(255,255,255,.08);border:none;cursor:pointer;
  padding:5px 12px 5px 5px;border-radius:24px;
  font-family:var(--font);
  transition:background .15s,transform .15s;
}
.header-user:hover{background:rgba(255,255,255,.16)}
.header-user .chev{transition:transform .2s}
.header-user.open .chev{transform:rotate(180deg)}
.header-av{
  width:28px;height:28px;border-radius:50%;
  background:rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:500;
}
/* Indicador de sincronizado: puntito flotante abajo-izquierda (el FAB usa la
   esquina derecha). Solo el dot; el estado va en el tooltip. Clic = sincronizar. */
.header-sync{
  /* apilado ENCIMA del botón Reportar (que va abajo-izquierda) para no taparse */
  position:fixed;bottom:calc(72px + env(safe-area-inset-bottom,0px));left:20px;z-index:40;
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--white);border:1px solid var(--gray-200);
  box-shadow:0 2px 8px rgba(15,23,42,.10);
  cursor:pointer;transition:transform .12s cubic-bezier(.23,1,.32,1),border-color .15s;
}
.header-sync:hover{transform:scale(1.08);border-color:var(--navy)}
.header-sync:active{transform:scale(.94)}
.header-sync span{display:none}   /* solo el puntito */
.header-sync .sync-dot{width:8px;height:8px}
/* Botones "System"/"Noticias": solo icono; el texto se revela al hover
   (grid-template-columns 0fr→1fr: plegado animable sin thrash) */
.header-sys{
  display:flex;align-items:center;font-size:11px;
  background:rgba(255,255,255,.12);padding:6px 10px;border-radius:20px;
  cursor:pointer;transition:background .15s;color:inherit;border:0;font-family:inherit;
}
.header-sys:hover{background:rgba(255,255,255,.22)}
.header-sys i{font-size:11px}
/* ── Centro de notificaciones (campana + panel) ── */
.notif-bell{position:relative;padding:6px 9px}
.notif-bell i{font-size:13px}
.notif-dot{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--red,#dc2626);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;font-variant-numeric:tabular-nums;box-shadow:0 0 0 2px var(--navy,#1a3a6b)}
.notif-dot[hidden]{display:none}
.notif-panel{position:fixed;top:62px;right:14px;width:min(360px,94vw);max-height:min(70vh,520px);overflow-y:auto;background:var(--white);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-md);z-index:2500;display:flex;flex-direction:column;
  /* despliegue: escala desde la campana (arriba-derecha), ease-out ~180ms */
  transform-origin:top right;opacity:0;transform:scale(.96) translateY(-6px);visibility:hidden;pointer-events:none;
  transition:opacity .18s ease-out,transform .18s cubic-bezier(.23,1,.32,1),visibility 0s linear .18s}
.notif-panel.show{opacity:1;transform:none;visibility:visible;pointer-events:auto;transition:opacity .18s ease-out,transform .18s cubic-bezier(.23,1,.32,1),visibility 0s}
.notif-panel.show .notif-item{animation:notifItemIn .24s cubic-bezier(.23,1,.32,1) both}
.notif-panel.show .notif-item:nth-child(1){animation-delay:.02s}
.notif-panel.show .notif-item:nth-child(2){animation-delay:.06s}
.notif-panel.show .notif-item:nth-child(3){animation-delay:.10s}
.notif-panel.show .notif-item:nth-child(4){animation-delay:.14s}
.notif-panel.show .notif-item:nth-child(n+5){animation-delay:.17s}
@keyframes notifItemIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .notif-panel,.notif-panel.show{transform:none;transition:opacity .15s ease-out,visibility 0s}
  .notif-panel:not(.show){transition:opacity .15s ease-out,visibility 0s linear .15s}
  .notif-panel.show .notif-item{animation:none}
}
.notif-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--white);border-radius:14px 14px 0 0}
.notif-head-title{font-size:14px;font-weight:600;color:var(--gray-900)}
.notif-head-actions{display:flex;align-items:center;gap:8px}
.notif-clear{border:0;background:none;color:var(--muted);font:500 12px var(--font);cursor:pointer;padding:4px 6px;border-radius:7px;transition:background .12s,color .12s}
.notif-clear:hover{background:var(--gray-100);color:var(--gray-900)}
.notif-list{display:flex;flex-direction:column}
.notif-item{position:relative;display:flex;gap:11px;align-items:flex-start;padding:12px 16px;border-bottom:1px solid var(--gray-100);transition:background .12s}
.notif-item:last-child{border-bottom:0}
.notif-item:hover{background:var(--gray-50)}
.notif-item.unread{background:var(--navy-ghost)}
.notif-item.unread:hover{background:var(--navy-pale,var(--navy-ghost))}
.notif-main{flex:1;min-width:0;display:flex;gap:11px;align-items:flex-start;border:0;background:none;cursor:pointer;text-align:left;font-family:var(--font);padding:0}
.notif-ic{flex:none;width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:13px}
.notif-item-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.notif-item-title{font-size:13px;font-weight:600;color:var(--gray-900)}
.notif-item-by{font-size:11px;color:var(--muted);margin-top:1px}
.notif-actions{flex:none;display:flex;gap:2px;align-items:center;opacity:0;transition:opacity .12s}
.notif-item:hover .notif-actions,.notif-item:focus-within .notif-actions{opacity:1}
.notif-act{width:26px;height:26px;border:0;background:none;border-radius:7px;color:var(--gray-400);cursor:pointer;font-size:11px;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
.notif-act:hover{background:var(--gray-100);color:var(--gray-700)}
.notif-act.del:hover{background:var(--red-bg);color:var(--red)}
@media (hover:none){.notif-actions{opacity:1}}
.notif-item.unread .notif-item-title::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--navy);margin-left:7px;vertical-align:middle}
.notif-item-text{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.notif-empty{padding:34px 16px;text-align:center;color:var(--muted);font-size:13px}
.notif-empty i{font-size:22px;display:block;margin-bottom:8px;opacity:.55}
.notif-pub{display:inline-flex;align-items:center;gap:6px;border:0;background:var(--navy-ghost);color:var(--navy);font:600 12px var(--font);padding:6px 11px;border-radius:20px;cursor:pointer;transition:background .12s}
.notif-pub:hover{background:var(--navy-pale,var(--navy-ghost))}
.notif-pub i{font-size:10px}
/* Selector de tipo del modal de aviso */
.ann-type{display:flex;gap:8px;margin-bottom:4px}
.ann-type-opt{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--border);background:var(--white);color:var(--muted);font:500 13px var(--font);padding:9px 10px;border-radius:var(--r-md);cursor:pointer;transition:border-color .12s,background .12s,color .12s}
.ann-type-opt i{font-size:12px}
.ann-type-opt.on{border-color:var(--navy);background:var(--navy-ghost);color:var(--navy)}
.ann-type-opt[data-t="importante"].on{border-color:var(--red);background:var(--red-bg);color:var(--red)}
.ann-textarea{resize:vertical;min-height:72px;font:400 14px var(--font);line-height:1.5}
.hs-tx{display:grid;grid-template-columns:0fr;transition:grid-template-columns .22s cubic-bezier(.23,1,.32,1)}
.hs-tx>span{
  overflow:hidden;white-space:nowrap;min-width:0;
  opacity:0;margin-left:0;
  transition:opacity .16s ease,margin-left .22s cubic-bezier(.23,1,.32,1);
}
@media (hover:hover) and (pointer:fine){
  .header-sys:hover .hs-tx,.header-sys:focus-visible .hs-tx{grid-template-columns:1fr}
  .header-sys:hover .hs-tx>span,.header-sys:focus-visible .hs-tx>span{opacity:1;margin-left:6px}
}
@media (prefers-reduced-motion:reduce){.hs-tx,.hs-tx>span{transition:opacity .15s ease}}
/* Fila "Instalar app": clickable; se oculta si ya corre instalada (standalone) */
.settings-row-install{border-radius:10px;transition:background .15s}
.settings-row-install:hover{background:var(--navy-ghost)}
[data-theme="dark"] .settings-row-install:hover{background:rgba(255,255,255,.05)}
@media (display-mode: standalone){ #installRow{display:none} }
.sync-dot{width:6px;height:6px;border-radius:50%;background:#4ade80;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.sync-dot.saving{background:var(--amber);animation:none}
.sync-dot.error{background:var(--red);animation:none}

/* Aviso "hay versión nueva" (lo crea appShowUpdatePill) */
.upd-pill{position:fixed;left:50%;bottom:28px;translate:-50% 0;z-index:2550;display:flex;align-items:center;gap:12px;
  padding:9px 10px 9px 18px;border-radius:999px;background:var(--navy);color:var(--white);font-size:13px;font-weight:500;
  box-shadow:0 12px 32px rgba(0,0,0,.25);max-width:calc(100vw - 32px);animation:slideUp .3s cubic-bezier(.23,1,.32,1)}
.upd-pill>i{opacity:.85}
.upd-pill-go{border:0;border-radius:999px;padding:7px 14px;background:var(--white);color:var(--navy);font-family:var(--font);font-size:12.5px;font-weight:600;cursor:pointer;transition:transform .12s ease}
.upd-pill-go:active{transform:scale(.96)}
.upd-pill-x{border:0;background:rgba(255,255,255,.16);color:inherit;width:26px;height:26px;border-radius:50%;cursor:pointer;display:grid;place-items:center;font-size:12px}
@media (max-width:768px){.upd-pill{bottom:calc(112px + env(safe-area-inset-bottom,0px))}}

/* Pantalla de carga tras Actualizar (html.booting la muestra y esconde el login) */
.app-boot{display:none;position:fixed;inset:0;z-index:5000;flex-direction:column;align-items:center;justify-content:center;gap:28px;background:#f4f6fa;color:#6b7890;font-size:14px;transition:opacity .25s ease}
html.booting .app-boot{display:flex}
html.booting #loginWrap{visibility:hidden}
.app-boot.out{opacity:0;pointer-events:none}
/* Loader: anillo triple (el de Angel). --lc = color de marca con alpha; .sm = versión inline chica.
   Color por empresa: azul Cretum / naranja MVP (en el arranque, por el hash de la pestaña). */
.loader{--lc:rgba(26,58,107,.6);--b:8px;width:50px;aspect-ratio:1;border-radius:50%;border:var(--b) solid #0000;border-right-color:var(--lc);position:relative;animation:l24 1s infinite linear;flex:none}
.loader::before,.loader::after{content:"";position:absolute;inset:calc(-1*var(--b));border-radius:50%;border:inherit;animation:inherit;animation-duration:2s}
.loader::after{animation-duration:4s}
@keyframes l24{100%{transform:rotate(1turn)}}
.loader.sm{--b:3px;width:18px;display:inline-block;vertical-align:-4px;margin-right:6px}
[data-org="mvp"] .loader,html.boot-mvp .loader{--lc:rgba(237,120,36,.65)}
[data-theme="dark"] .loader{--lc:rgba(93,143,245,.7)}
[data-theme="dark"][data-org="mvp"] .loader,[data-theme="dark"].boot-mvp .loader{--lc:rgba(248,149,64,.7)}
@media (prefers-reduced-motion:reduce){.loader,.loader::before,.loader::after{animation-duration:3s}}
[data-theme="dark"] .app-boot{background:#0c0f16;color:#98a2b3}

/* ── Silueta de arranque ──────────────────────────────────────────────────
   Se pinta desde el primer cuadro: el hash y el tema ya están en <html> antes
   de que corra app.js, así que no hay parpadeo ni espera. */
.boot-skel{display:none}
html.boot-app .app-boot{justify-content:flex-start;gap:0;padding:0}
html.boot-app .boot-skel{display:block;position:absolute;inset:0}
html.boot-app .loader{display:none}
html.boot-app .app-boot-txt{position:absolute;left:0;right:0;bottom:28px;text-align:center;font-size:13px}
.bs-header{height:56px;background:#1a3a6b}
html.boot-mvp .bs-header{background:#ED7824}
[data-theme="dark"] .bs-header{background:#0c1119}
[data-theme="dark"].boot-mvp .bs-header{background:#0d0a07}
.bs-body{max-width:1180px;margin:0 auto;padding:30px 24px 0}
.bs-bar{background:#e6eaf2;border-radius:8px;animation:bsPulse 1.5s ease-in-out infinite}
[data-theme="dark"] .bs-bar{background:#171d27}
.bs-title{width:min(260px,52%);height:26px}
.bs-sub{width:min(400px,74%);height:13px;margin-top:12px}
.bs-cards{display:flex;gap:14px;margin-top:28px;flex-wrap:wrap}
.bs-card{flex:1 1 180px;min-width:150px;height:96px;border-radius:12px;background:#e6eaf2;animation:bsPulse 1.5s ease-in-out infinite}
[data-theme="dark"] .bs-card{background:#171d27}
.bs-row{height:44px;margin-top:12px;border-radius:10px}
.bs-row:nth-of-type(odd){opacity:.8}
.bs-cards .bs-card:nth-child(2){animation-delay:.1s}
.bs-cards .bs-card:nth-child(3){animation-delay:.2s}
@keyframes bsPulse{0%,100%{opacity:1}50%{opacity:.55}}
@media (prefers-reduced-motion:reduce){.bs-bar,.bs-card{animation:none}}
@media (max-width:768px){.bs-body{padding:22px 16px 0}.bs-card{height:84px}}

/* ── Variantes por sección ────────────────────────────────────────────────
   Agrupadas por FORMA, no una por pantalla: 9 de las 20 secciones comparten
   la misma barra de herramientas (.db-toolbar), así que esa es la silueta por
   defecto y solo se desvían las que de verdad se ven distintas. */
.bs-hero,.bs-grid,.bs-cols,.bs-split{display:none}
.bs-busca{display:none}

/* Barra de herramientas: ícono, título a la izquierda, botones a la derecha */
.bs-tool{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.bs-ico{flex:none;width:38px;height:38px;border-radius:10px}
.bs-tool-txt{flex:1;min-width:0}
.bs-tool-txt .bs-title{width:min(220px,46%);height:19px}
.bs-tool-txt .bs-sub{width:min(320px,62%);height:11px;margin-top:9px}
.bs-tool-acts{display:flex;gap:9px;flex:none}
.bs-btn{width:104px;height:36px;border-radius:9px}
.bs-ico,.bs-btn{background:#e6eaf2;animation:bsPulse 1.5s ease-in-out infinite}
[data-theme="dark"] .bs-ico,[data-theme="dark"] .bs-btn{background:#171d27}
@media (max-width:768px){.bs-btn{width:44px}.bs-tool{gap:10px}}
/* El color y el latido viven aquí una sola vez; las variantes solo deciden
   qué se ve y de qué tamaño. Así el override de oscuro aplica a todo. */
.bs-hero,.bs-col,.bs-side,.bs-main{background:#e6eaf2;animation:bsPulse 1.5s ease-in-out infinite}
[data-theme="dark"] .bs-hero,[data-theme="dark"] .bs-col,
[data-theme="dark"] .bs-side,[data-theme="dark"] .bs-main{background:#171d27}
.bs-col{flex:1;min-width:0;height:300px;border-radius:12px}
.bs-cols .bs-col:nth-child(2){animation-delay:.1s}
.bs-cols .bs-col:nth-child(3){animation-delay:.2s}
.bs-grid .bs-card:nth-child(3n+2){animation-delay:.1s}
.bs-grid .bs-card:nth-child(3n){animation-delay:.2s}

/* Inicio: saludo grande y retícula de módulos */
.boot-v-home .bs-hero{display:block;height:132px;border-radius:14px}
.boot-v-home .bs-title,.boot-v-home .bs-sub,.boot-v-home .bs-cards,.boot-v-home .bs-rows{display:none}
.boot-v-home .bs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}
.boot-v-home .bs-grid .bs-card{height:124px}

/* Tareas: encabezado propio y después lista o tablero, según cómo lo dejó */
.boot-v-tasks .bs-hero{display:block;height:104px;border-radius:14px}
.boot-v-tasks .bs-title,.boot-v-tasks .bs-sub,.boot-v-tasks .bs-cards{display:none}
.boot-v-tasks .bs-rows{margin-top:22px}
.boot-v-tasks.boot-kanban .bs-rows{display:none}
.boot-v-tasks.boot-kanban .bs-cols{display:flex;gap:14px;margin-top:22px}
/* Inicio y Tareas no llevan barra de herramientas: tienen encabezado propio */
.boot-v-home .bs-tool,.boot-v-tasks .bs-tool{display:none}

/* Notas: carpetas a la izquierda, nota a la derecha */
.boot-v-notes .bs-tool,.boot-v-notes .bs-cards,.boot-v-notes .bs-rows{display:none}
.boot-v-notes .bs-split{display:flex;gap:14px;margin-top:4px}
.boot-v-notes .bs-side{flex:0 0 210px;height:440px;border-radius:12px}
.boot-v-notes .bs-main{flex:1;min-width:0;height:440px;border-radius:12px}

/* Dropbox: buscador arriba y lista de archivos */
.boot-v-dropbox .bs-cards{display:none}
.boot-v-dropbox .bs-busca{display:block;height:40px;border-radius:10px;margin-bottom:16px}
.boot-v-dropbox .bs-tool-acts .bs-btn:nth-child(2){display:none}

/* Trackers, Campaña DF y Fund Raising: vuelta atrás, portada y tarjetas */
.boot-v-fundTrackers .bs-hero,.boot-v-campanaDF .bs-hero,.boot-v-fundraising .bs-hero{display:block;height:118px;border-radius:14px}
.boot-v-fundTrackers .bs-tool,.boot-v-campanaDF .bs-tool,.boot-v-fundraising .bs-tool{display:none}
.boot-v-fundTrackers .bs-rows,.boot-v-campanaDF .bs-rows,.boot-v-fundraising .bs-rows{display:none}
.boot-v-fundTrackers .bs-grid,.boot-v-campanaDF .bs-grid,.boot-v-fundraising .bs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.boot-v-fundTrackers .bs-cards,.boot-v-campanaDF .bs-cards,.boot-v-fundraising .bs-cards{display:none}

@media (max-width:768px){
  .boot-v-home .bs-grid{grid-template-columns:1fr}
  .boot-v-home .bs-hero{height:116px}
  .boot-v-tasks.boot-kanban .bs-cols .bs-col:nth-child(n+2){display:none}
  .boot-v-notes .bs-side{display:none}
  .boot-v-fundTrackers .bs-grid,.boot-v-campanaDF .bs-grid,.boot-v-fundraising .bs-grid{grid-template-columns:1fr}
}


/* ── Esqueleto de módulo: la misma silueta, dentro de la página ──────────
   La primera visita a una sección que baja bajo demanda (/mod/) se veía en
   blanco y luego aparecía todo de golpe. Mientras llega el archivo, la página
   esconde su contenido y muestra la silueta de su vista (cargarVista en
   app.js clona .bs-body y le pone .boot-v-X; por eso las variantes de arriba
   van sin "html." — sirven al arranque y aquí). */
.page.mod-loading>:not(.mod-skel){display:none}
.mod-skel .bs-body{max-width:none;padding:0}
/* ── Subtareas: editor del modal, checklist en fila y en detalle ── */
.fs-list{display:flex;flex-direction:column;gap:6px}
.fs-row{display:flex;align-items:center;gap:8px}
.fs-row .fs-grip{color:var(--gray-300);font-size:11px;width:12px;text-align:center;flex:none}
.fs-row .form-input{flex:1;min-width:0;padding:8px 10px;font-size:13px}
.fs-row .fs-x{border:0;background:transparent;color:var(--gray-300);cursor:pointer;width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-size:12px;transition:color .15s,background .15s}
.fs-row .fs-x:hover{color:var(--red);background:var(--red-bg)}
.fs-foot{display:flex;align-items:center;gap:14px;margin-top:8px;flex-wrap:wrap}
.fs-add{border:1px dashed var(--gray-300);background:transparent;color:var(--gray-500);border-radius:var(--r-sm);padding:6px 10px;font-family:var(--font);font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:border-color .15s,color .15s}
.fs-add:hover{border-color:var(--navy);color:var(--navy)}
.fs-seq{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--gray-600);cursor:pointer;margin-left:auto}
.fs-seq input{accent-color:var(--navy);width:15px;height:15px;margin:0}
.fs-seq-hint{color:var(--gray-400);font-size:11px}
/* Checklist de subtareas (desplegable bajo la fila / sección del detalle) */
.li-subs{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--gray-500);white-space:nowrap}
.li-subs i{font-size:11px}
.li-subs.all{color:var(--green)}
.li-subtog{border:0;background:transparent;color:var(--gray-400);cursor:pointer;width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font-size:11px;flex:none;transition:transform .2s cubic-bezier(.23,1,.32,1),background .15s,color .15s}
.li-subtog:hover{background:var(--gray-100);color:var(--gray-700)}
.li-wrap.subs-open .li-subtog{transform:rotate(90deg)}
.li-subs-list{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s cubic-bezier(.23,1,.32,1)}
.li-subs-list>div{min-height:0;overflow:hidden}
.li-wrap.subs-open .li-subs-list{grid-template-rows:1fr}
.sub-row{display:flex;align-items:center;gap:10px;padding:7px 14px 7px 44px;font-size:13px;color:var(--gray-700)}
.sub-row.done{color:var(--gray-400);text-decoration:line-through}
.sub-row.locked{color:var(--gray-400)}
.sub-row.locked .sub-chk{border-style:dashed;cursor:not-allowed}
.sub-row .sub-lock{margin-left:auto;font-size:10px;color:var(--gray-300)}
.sub-chk{width:16px;height:16px;border-radius:5px;border:1.5px solid var(--gray-300);background:var(--white);flex:none;cursor:pointer;display:grid;place-items:center;font-size:9px;color:transparent;transition:transform .14s cubic-bezier(.23,1,.32,1),background .14s,border-color .14s,color .14s}
.sub-chk:hover{border-color:var(--navy);transform:scale(1.08)}
.sub-chk.on{background:var(--navy);border-color:var(--navy);color:#fff}
.sub-chk:active{transform:scale(.9)}
.sub-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sub-seq-note{font-size:11px;color:var(--gray-400);padding:2px 14px 6px 44px;display:flex;align-items:center;gap:6px}
.td-subs .sub-row{padding-left:0;padding-right:0}
.td-subs .sub-seq-note{padding-left:0}
.td-subs-add{display:flex;align-items:center;gap:8px;margin-top:8px}
.td-subs-add .form-input{flex:1;padding:8px 10px;font-size:13px}
.td-subs-add button{border:0;background:var(--navy);color:var(--white);border-radius:var(--r-sm);padding:8px 12px;font-family:var(--font);font-size:12px;font-weight:500;cursor:pointer}
.td-subs-add button:active{transform:scale(.96)}
@media (prefers-reduced-motion:reduce){.li-subs-list,.li-subtog,.sub-chk{transition:none}}

/* ── LAYOUT ── */
.page{max-width:900px;margin:0 auto;padding:24px}
/* La BD tiene tablas anchas (lista + detalle del inversionista) — más espacio */
.page.page-db{max-width:1200px}
/* Campañas maneja tablas/listas anchas — usa más pantalla */
#pageCampaigns.page-db{max-width:1560px}
/* Fund Rising: tabla ancha (notas y próximos pasos respiran) */
#pageFundraising{max-width:1200px}

/* ── LOGIN ── */
#loginWrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#0a1929 0%,#0f2e5c 30%,#1a3a6b 60%,#2a4f8f 100%);
  background-size:300% 300%;
  animation:loginGradient 22s ease-in-out infinite;
  position:relative;overflow:hidden;padding:20px;
}
@keyframes loginGradient{
  0%,100%{background-position:0% 50%}
  50%{background-position:100% 50%}
}
/* Patrón de puntos sutil para textura */
#loginWrap::before{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px);
  background-size:28px 28px;
  -webkit-mask-image:radial-gradient(ellipse at center, black 25%, transparent 75%);
  mask-image:radial-gradient(ellipse at center, black 25%, transparent 75%);
}

/* Shapes decorativas flotantes */
.login-bg-shape{
  position:absolute;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.08),transparent 70%);
  filter:blur(40px);pointer-events:none;
}
.login-bg-1{width:480px;height:480px;top:-150px;left:-150px;animation:loginFloat1 14s ease-in-out infinite}
.login-bg-2{width:380px;height:380px;bottom:-120px;right:-100px;background:radial-gradient(circle,rgba(123,168,255,.14),transparent 70%);animation:loginFloat2 17s ease-in-out infinite}
.login-bg-3{width:260px;height:260px;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(93,143,245,.16),transparent 70%);animation:loginFloat3 12s ease-in-out infinite}
@keyframes loginFloat1{0%,100%{transform:translate(0,0)}50%{transform:translate(80px,60px)}}
@keyframes loginFloat2{0%,100%{transform:translate(0,0)}50%{transform:translate(-70px,-40px)}}
@keyframes loginFloat3{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.25)}}

.login-box{
  position:relative;z-index:2;
  width:380px;max-width:100%;
  background:rgba(255,255,255,.97);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  backdrop-filter:blur(20px) saturate(180%);
  border-radius:20px;
  padding:38px 36px 28px;
  box-shadow:
    0 30px 70px rgba(0,0,0,.55),
    0 8px 24px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,255,255,.4),
    inset 0 1px 0 rgba(255,255,255,.85);
}
/* Línea decorativa superior dentro del card */
.login-box::before{
  content:'';position:absolute;top:0;left:30px;right:30px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(26,58,107,.4), transparent);
}

.login-logo{
  height:auto; /* los <img> traen width/height intrínsecos para reservar espacio (CLS); el alto lo da la proporción */
  width:190px;max-width:100%;display:block;margin:4px auto 22px;
  filter:drop-shadow(0 4px 12px rgba(26,58,107,.14));
}

.login-title{
  font-size:26px;font-weight:500;color:var(--navy);margin-bottom:4px;
  letter-spacing:-.3px;text-align:center;
}
.login-sub{
  font-size:13px;color:var(--gray-400);margin-bottom:26px;
  text-align:center;
}

.login-field{position:relative;margin-bottom:11px}
.login-field-ico{
  position:absolute;left:14px;top:50%;transform:translateY(-50%);
  color:var(--gray-300);font-size:13px;
  pointer-events:none;transition:color .2s;z-index:1;
}
.login-field:focus-within .login-field-ico{color:var(--navy)}

.fi{
  width:100%;padding:11px 14px 11px 40px;
  border:1.5px solid var(--gray-200);
  border-radius:var(--r-md);font-size:14px;color:var(--gray-900);
  background:var(--white);
  outline:none;transition:border-color .2s,box-shadow .2s;
  font-family:var(--font);
}
.fi:hover{border-color:var(--gray-300)}
.fi:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(26,58,107,.1)}
.fi::placeholder{color:var(--gray-300)}
/* Campo de contraseña con ojo para mostrar/ocultar */
.fi-pass{padding-right:44px}
.login-eye{
  position:absolute;right:6px;top:50%;transform:translateY(-50%);
  background:none;border:none;color:var(--gray-300);font-size:14px;
  cursor:pointer;padding:7px 10px;z-index:2;transition:color .2s;line-height:1;
}
.login-eye:hover{color:var(--navy)}
/* Oculta el ojo/equis nativo de Edge para no duplicar el control */
.fi-pass::-ms-reveal,.fi-pass::-ms-clear{display:none}

.btn-login{
  position:relative;overflow:hidden;
  width:100%;padding:13px 16px;margin-top:6px;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  border:none;
  border-radius:var(--r-md);color:white;
  font-size:14px;font-weight:500;font-family:var(--font);cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:0 8px 20px rgba(26,58,107,.4), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .22s cubic-bezier(.4,0,.2,1),opacity .22s cubic-bezier(.4,0,.2,1),color .22s cubic-bezier(.4,0,.2,1),background-color .22s cubic-bezier(.4,0,.2,1),border-color .22s cubic-bezier(.4,0,.2,1),box-shadow .22s cubic-bezier(.4,0,.2,1);
}
/* Destello que cruza el botón al hacer hover */
.btn-login::before{
  content:'';position:absolute;top:0;left:-120%;width:80%;height:100%;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.32) 50%, transparent 100%);
  transform:skewX(-25deg);
  transition:left .7s cubic-bezier(.4,0,.2,1);
}
.btn-login:hover::before{left:120%}
.btn-login > span,.btn-login > i{position:relative;z-index:1}
.btn-login:hover{transform:translateY(-1px);box-shadow:0 12px 28px rgba(26,58,107,.5), inset 0 1px 0 rgba(255,255,255,.22)}
.btn-login:active{transform:translateY(0) scale(.98);box-shadow:0 4px 14px rgba(26,58,107,.3)}
.btn-arrow{font-size:11px;transition:transform .25s cubic-bezier(.23,1,.32,1)}
.btn-login:hover .btn-arrow{transform:translateX(5px)}

.login-foot{
  text-align:center;font-size:10.5px;color:var(--gray-300);
  margin-top:22px;letter-spacing:.3px;
  display:flex;align-items:center;justify-content:center;gap:6px;
}
.login-foot i{font-size:10px;color:var(--gray-400)}
/* Casilla de aceptación del aviso de privacidad y términos (habilita "Entrar").
   Toda la etiqueta es pulsable; en teléfono mide ≥44px de alto con sus dos líneas. */
.login-legal{
  display:flex;align-items:flex-start;gap:10px;text-align:left;
  margin:14px 0 2px;padding:4px 0;cursor:pointer;
  font-size:12.5px;line-height:1.45;color:var(--gray-600);
}
.login-legal[hidden]{display:none}
.login-legal input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--navy);cursor:pointer}
.login-legal a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.login-legal a:hover{color:var(--navy-light)}
.btn-login:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}
.btn-login:disabled::before{display:none}
[data-theme="dark"] .login-legal a{color:var(--brand-text,var(--navy))}
.login-foot a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.login-foot a:hover{color:var(--navy)}

.login-err{
  font-size:12px;color:var(--red);background:var(--red-bg);
  border-radius:var(--r-md);padding:10px 13px;margin-bottom:14px;display:none;
  align-items:center;gap:7px;
}
.login-err.show{display:flex}
.login-err i{font-size:13px;flex-shrink:0}

[data-theme="dark"] .login-box{
  background:rgba(15,22,38,.92);
  box-shadow:
    0 30px 70px rgba(0,0,0,.75),
    0 8px 24px rgba(0,0,0,.4),
    0 0 0 1px rgba(255,255,255,.08),
    inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] .login-box::before{
  background:linear-gradient(90deg, transparent, rgba(123,168,255,.4), transparent);
}
[data-theme="dark"] .login-title{color:#7ba8ff}
[data-theme="dark"] .login-foot{color:rgba(255,255,255,.3)}
[data-theme="dark"] .fi{background:#0a0a0a;border-color:#2a2a2a;color:#fff}
[data-theme="dark"] .fi:focus{box-shadow:0 0 0 3px rgba(93,143,245,.18)}

/* ── APP (hidden until login) ── */
/* padding-top compensa el header fixed (56px desktop / 52px móvil) */
#app{display:none;padding-top:56px}

/* ── TOPBAR ── */
.tk-topbar{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.tk-toggle{position:relative;display:flex;gap:2px;background:var(--gray-100);border-radius:var(--r-md);padding:3px}
/* Pill blanca que se desliza tras el botón activo (la mueve JS: tkMoveSlider) */
.tk-tog-slider{
  position:absolute;top:3px;bottom:3px;left:0;width:0;
  background:var(--white);border-radius:var(--r-sm);box-shadow:var(--shadow-sm);
  transition:transform .18s cubic-bezier(.4,0,.2,1),width .18s cubic-bezier(.4,0,.2,1);
  will-change:transform;z-index:0;pointer-events:none;
}
.tk-tog-btn{
  position:relative;z-index:1;
  padding:7px 16px;border-radius:var(--r-sm);border:none;
  background:transparent;font-size:13px;color:var(--gray-500);
  cursor:pointer;display:flex;align-items:center;gap:6px;transition:color .15s;
}
.tk-tog-btn.on{color:var(--navy)}   /* el fondo blanco lo da el slider deslizante */
.tk-new-btn{
  display:flex;align-items:center;gap:7px;
  padding:8px 16px;border:none;border-radius:var(--r-md);
  background:var(--navy);color:white;font-size:13px;font-weight:500;
  font-family:var(--font);cursor:pointer;
  box-shadow:0 2px 8px rgba(26,58,107,.18);
  transition:transform .18s cubic-bezier(.4,0,.2,1),opacity .18s cubic-bezier(.4,0,.2,1),color .18s cubic-bezier(.4,0,.2,1),background-color .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1);
}
.tk-new-btn:hover{background:var(--navy-mid);box-shadow:0 6px 18px rgba(26,58,107,.3);transform:translateY(-1px)}
.tk-new-btn:active{transform:translateY(0) scale(.99)}
.tk-new-btn i{font-size:12px}
/* Vistas agrupadas en un desplegable + botón aparte "Notas Personales" */
.tk-view-toggle{display:flex;align-items:center;gap:8px;margin-left:auto}
.tk-view-picker{position:relative}
.tk-view-pick-btn,.tk-notes-btn{
  display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--gray-200);
  border-radius:var(--r-md);padding:8px 13px;font-family:var(--font);font-size:13px;font-weight:500;
  color:var(--gray-700);cursor:pointer;transition:border-color .15s,background .15s,color .15s;white-space:nowrap;
}
.tk-view-pick-btn:hover,.tk-notes-btn:hover{border-color:var(--navy-light,var(--navy))}
.tk-view-pick-btn .tk-view-chev{font-size:10px;color:var(--gray-400);margin-left:2px;transition:transform .2s cubic-bezier(.23,1,.32,1)}
.tk-view-pick-btn[aria-expanded="true"] .tk-view-chev{transform:rotate(180deg)}
.tk-view-pick-btn.active{border-color:var(--navy);color:var(--navy)}
.tk-view-pick-btn .tk-view-lead{color:var(--navy)}
.tk-view-menu{
  position:absolute;top:calc(100% + 6px);left:0;min-width:180px;z-index:50;
  background:var(--white);border:1px solid var(--gray-200);border-radius:var(--r-lg);box-shadow:var(--shadow-md);padding:5px;
  opacity:0;transform:translateY(-6px) scale(.98);pointer-events:none;transform-origin:top left;
  transition:opacity .15s ease,transform .15s cubic-bezier(.23,1,.32,1);
}
.tk-view-menu.open{opacity:1;transform:none;pointer-events:auto}
.tk-view-opt{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:0;border-radius:8px;
  padding:9px 11px;font-family:var(--font);font-size:13px;color:var(--gray-700);cursor:pointer;transition:background .13s
}
.tk-view-opt i{width:16px;text-align:center;color:var(--gray-400)}
.tk-view-opt:hover{background:var(--gray-50)}
.tk-view-opt.on{background:var(--navy-ghost);color:var(--navy);font-weight:500}
.tk-view-opt.on i{color:var(--navy)}

/* ── To Do: botón Vaciar (toolbar, todas las vistas) ── */
.tk-clear-btn{
  display:none;align-items:center;gap:6px;
  background:none;border:1px solid var(--gray-200);color:var(--gray-600);
  padding:8px 12px;border-radius:var(--r-md);cursor:pointer;
  font-family:var(--font);font-size:13px;
  transition:background .12s,border-color .12s,color .12s;
}
.tk-clear-btn:hover{background:var(--red-ghost,rgba(220,38,38,.08));border-color:var(--red,#dc2626);color:var(--red,#dc2626)}
.tk-clear-btn .tk-clear-n{
  font-size:11px;font-variant-numeric:tabular-nums;
  background:var(--gray-100);color:var(--gray-600);padding:1px 7px;border-radius:10px;
}
.tk-clear-btn:hover .tk-clear-n{background:var(--red,#dc2626);color:#fff}

/* ── To Do: barra lateral (buscar + vistas + carpetas) en PC · chips (móvil) ── */
.tk-body{display:flex;gap:16px;align-items:flex-start}
.tk-main{flex:1;min-width:0}
.tk-projects{
  flex:0 0 196px;width:196px;align-self:flex-start;
  position:sticky;top:8px;
  display:flex;flex-direction:column;gap:2px;
  max-height:calc(100vh - 150px);overflow-y:auto;padding-right:2px;
}
.tk-side-desk{display:flex;flex-direction:column;gap:14px}
.tk-proj-list{display:flex;flex-direction:column;gap:2px}
.tk-proj-item{
  display:flex;align-items:center;gap:9px;width:100%;
  padding:8px 10px;border:none;background:none;cursor:pointer;
  border-radius:var(--r-md);font-family:var(--font);font-size:13px;
  color:var(--gray-600);text-align:left;transition:background .12s,color .12s;
}
.tk-proj-item i{width:15px;flex:none;text-align:center;color:var(--gray-400);font-size:13px}
.tk-proj-item:hover{background:var(--gray-50)}
.tk-proj-item.on{background:var(--navy-ghost);color:var(--navy);font-weight:500}
.tk-proj-item.on i{color:var(--navy)}
.tk-proj-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-proj-count{
  flex:none;font-size:11px;font-variant-numeric:tabular-nums;
  color:var(--gray-400);background:var(--gray-100);padding:1px 7px;border-radius:10px;
}
.tk-proj-item.on .tk-proj-count{background:var(--navy);color:#fff}

@media (max-width:860px){
  .tk-body{flex-direction:column;gap:10px}
  .tk-side-desk{display:none}   /* la barra lateral (buscar/vistas) es de escritorio; el teléfono va en otra fase */
  .tk-projects{
    flex:none;width:auto;position:static;max-height:none;overflow:visible;padding:0;
  }
  .tk-proj-list{
    flex-direction:row;overflow-x:auto;overflow-y:hidden;gap:6px;
    padding:0 0 4px;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  .tk-proj-list::-webkit-scrollbar{display:none}
  .tk-proj-item{width:auto;flex:0 0 auto;white-space:nowrap;border:1px solid var(--gray-200);padding:7px 12px}
  .tk-proj-name{max-width:130px}
}
.tk-notes-btn.active{background:var(--navy);border-color:var(--navy);color:#fff}
.tk-notes-btn.active i{color:#fff}
@media (prefers-reduced-motion:reduce){.tk-view-menu,.tk-view-pick-btn .tk-view-chev{transition:none}}

/* ── STATS ── */
/* Stats esbeltas: número + etiqueta en una línea, completadas atenuadas */
.tk-stats{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.tk-stat{flex:1 1 calc(33.333% - 6px);min-width:120px;display:flex;align-items:baseline;gap:8px;background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-md);padding:9px 13px}
.tk-stat-n{font-size:18px;font-weight:400;color:var(--navy);font-family:var(--mono);line-height:1}
.tk-stat-l{font-size:10px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.4px}
.tk-stat-done .tk-stat-n{color:var(--gray-400)}   /* las completadas, de lado */

/* Estados vacíos amables */
.tk-empty{padding:40px 20px;text-align:center;color:var(--gray-400)}
.tk-empty.mini{padding:22px 16px}
.tk-empty i{font-size:30px;opacity:.5;display:block;margin-bottom:10px}
.tk-empty p{margin:0;font-size:13px}

/* Sección de completadas (colapsable, al fondo) */
.tk-done-sec{margin-top:16px;border-top:1px dashed var(--gray-200);padding-top:12px}
.tk-done-head{display:flex;align-items:center;gap:8px}
.tk-done-toggle{flex:1;display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font-family:var(--font);font-size:12px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px;padding:4px 2px;text-align:left}
.tk-done-toggle:hover{color:var(--navy)}
.tk-done-chev{font-size:10px;transition:transform .18s}
.tk-done-sec.open .tk-done-chev{transform:rotate(90deg)}
.tk-done-clear{background:none;border:1px solid var(--gray-200);border-radius:var(--r-sm);color:var(--gray-400);font-size:11px;font-family:var(--font);cursor:pointer;padding:5px 10px;display:flex;align-items:center;gap:6px;transition:border-color .15s,color .15s}
.tk-done-clear:hover{border-color:var(--red);color:var(--red)}
.tk-done-body{margin-top:10px}

/* Banner de limpieza mensual */
.tk-clear-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;margin-bottom:14px;border:1px solid var(--navy-pale);background:var(--navy-ghost);border-radius:var(--r-lg)}
.tk-clear-txt{font-size:13px;color:var(--gray-700);flex:1;min-width:200px}
.tk-clear-txt i{color:var(--navy);margin-right:6px}
.tk-clear-acts{display:flex;gap:8px}
.tk-clear-acts .sm-btn{padding:7px 14px;font-size:12px;font-weight:500}
.tk-clear-acts .sm-btn:not(.sm-solid){background:var(--white);border:1px solid var(--gray-200);color:var(--gray-500)}
.tk-clear-acts .sm-btn:not(.sm-solid):hover{border-color:var(--navy);color:var(--navy)}

/* ── INVITES ── */
.tk-invite{
  padding:11px 14px;border:1px solid var(--amber);border-radius:var(--r-lg);
  background:var(--amber-bg);margin-bottom:8px;display:flex;align-items:center;gap:10px;
}
.tk-invite-info{flex:1}
.tk-invite-from{font-size:11px;font-weight:500;color:var(--amber);margin-bottom:2px}
.tk-invite-name{font-size:13px;color:var(--gray-700)}
.tk-invite-due{font-size:11px;color:var(--gray-400);margin-top:2px}
.inv-accept{padding:6px 14px;background:var(--navy);border:none;border-radius:var(--r-sm);color:white;font-size:11px;cursor:pointer}
.inv-decline{padding:6px 10px;background:none;border:1px solid var(--gray-200);border-radius:var(--r-sm);color:var(--gray-400);font-size:11px;cursor:pointer}
.inv-decline:hover{border-color:var(--red);color:var(--red)}

/* ── LISTA — agrupada por horizonte, filas con divisor (no tarjeta por ítem) ── */
.tk-list{display:flex;flex-direction:column;gap:20px}
.tk-group-label{
  display:flex;align-items:center;gap:8px;margin:0 2px 8px;
  font-size:11px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.6px;
}
.tk-group-label.od{color:var(--red)}
.tk-group-label.tk-proj-none{color:var(--gray-400)}
.tk-proj-ico{font-size:11px;opacity:.6}
.tk-group-n{font-family:var(--mono);font-size:11px;font-weight:500;color:var(--gray-400);background:var(--gray-100);border-radius:10px;padding:0 7px;line-height:18px}
.tk-group-label.od .tk-group-n{color:var(--red);background:var(--red-bg)}
.tk-rows{background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);overflow:hidden}
.li-wrap{position:relative}   /* contenedor para el fondo de acción del swipe (móvil) */
.list-item{
  display:flex;align-items:center;gap:11px;padding:11px 14px;
  border-bottom:1px solid var(--gray-100);transition:background .15s;
}
.tk-rows .li-wrap:last-child .list-item{border-bottom:none}
.list-item:hover{background:var(--gray-50)}
.list-item.done-item{opacity:.55}
.list-item.done-item .li-name{text-decoration:line-through;color:var(--gray-400)}
.li-chk{
  width:17px;height:17px;border-radius:4px;border:1.5px solid var(--gray-300);
  flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;font-size:10px;color:transparent;background:white;
}
.li-chk.on{background:var(--navy);border-color:var(--navy);color:white}
.li-name{flex:1;font-size:13px;color:var(--gray-700);line-height:1.4}
.tk-open{cursor:pointer;transition:color .12s}
.tk-open:hover{color:var(--navy)}
.li-meta{display:flex;align-items:center;gap:6px;flex-shrink:0;flex-wrap:wrap}
.li-due{font-size:11px;color:var(--gray-500);display:flex;align-items:center;gap:3px}
.li-due.od{color:var(--red);background:var(--red-bg);padding:2px 8px;border-radius:10px;font-weight:500}
.li-prio{font-size:10px;padding:2px 8px;border-radius:10px}
.lp-a{background:var(--red-bg);color:var(--red)}
.lp-m{background:var(--amber-bg);color:var(--amber)}
.lp-b{background:var(--green-bg);color:var(--green)}
.li-tag{font-size:10px;padding:2px 8px;border-radius:10px;background:var(--navy-pale);color:var(--navy)}
/* Estado de un reporte (tomado / resuelto / sin tomar) — visible en tarjetas y detalle */
.rep-badge{font-size:10px;padding:2px 8px;border-radius:10px;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;font-weight:500}
.rep-badge i{font-size:10px}
.rep-badge.new{background:var(--gray-100);color:var(--gray-500)}
.rep-badge.wip{background:var(--amber-bg);color:var(--amber)}
.rep-badge.ok{background:var(--green-bg);color:var(--green)}
.td-report-badge{margin-top:8px}
/* Mini label de fecha de creación (informativa, discreta) */
.li-created{font-size:10px;color:var(--gray-400);display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.li-created i{font-size:9px}
.li-prog{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--gray-500)}
.li-prog-bar{width:60px;height:5px;background:var(--gray-100);border-radius:3px;overflow:hidden}
.li-prog-fill{height:100%;background:var(--navy);border-radius:3px}
/* Avance rápido en la fila (design 4a): +1/+5/+10 + "otra cantidad" */
.li-inc{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.li-inc-q{border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700);font:600 12px var(--font);padding:5px 9px;border-radius:var(--r-sm);cursor:pointer;transition:background .12s,border-color .12s,color .12s,transform .1s}
.li-inc-q:hover{border-color:var(--navy-light,var(--navy));color:var(--gray-900)}
.li-inc-q:active{transform:scale(.96)}
.li-inc-1{background:var(--navy-ghost);border-color:transparent;color:var(--navy)}
[data-org="mvp"] .li-inc-1{background:var(--amber-bg);color:var(--amber)}
.li-inc-in{width:52px;padding:5px 7px;border:1px solid var(--gray-200);border-radius:var(--r-sm);font-size:12px;text-align:center;outline:none;background:var(--white);color:var(--gray-900)}
.li-inc-in:focus{border-color:var(--navy)}
.li-del{background:none;border:none;color:var(--gray-300);font-size:13px;cursor:pointer;transition:color .15s;flex-shrink:0}
.li-del:hover{color:var(--red)}
.li-edit{background:none;border:none;color:var(--gray-300);font-size:12px;cursor:pointer;transition:color .15s;flex-shrink:0;padding:0 2px}
.li-edit:hover{color:var(--navy)}

/* ── Estatus de 3 estados (Pendiente / En progreso / Completo) para tareas simples ── */
.tk-status-seg{display:inline-flex;align-items:center;gap:1px;flex-shrink:0}
.tk-seg{background:none;border:none;cursor:pointer;font-size:15px;line-height:1;padding:1px 3px;color:var(--gray-300);border-radius:6px;transition:color .15s,transform .12s,background .15s;font-family:inherit}
.tk-seg:hover{background:var(--gray-100);color:var(--gray-500)}
.tk-seg:active{transform:scale(.86)}
.tk-seg.sg-pen.on{color:var(--gray-600)}
.tk-seg.sg-prog.on{color:var(--amber)}
.tk-seg.sg-done.on{color:var(--green)}
/* Versión grande con etiqueta, dentro del modal de edición */
.tk-status-seg.tk-seg-lg{display:flex;gap:6px;width:100%}
.tk-seg-lg .tk-seg{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:500;padding:8px 6px;border:1px solid var(--gray-200);color:var(--gray-500);background:var(--white)}
.tk-seg-lg .tk-seg .tk-seg-dot{width:8px;height:8px;border-radius:50%;background:var(--gray-300);flex-shrink:0;transition:background .15s}
.tk-seg-lg .tk-seg:hover{border-color:var(--gray-300);background:var(--gray-50)}
.tk-seg-lg .tk-seg.on{border-color:var(--navy);color:var(--navy);background:var(--navy-pale)}
.tk-seg-lg .tk-seg.sg-pen.on .tk-seg-dot{background:var(--gray-400)}
.tk-seg-lg .tk-seg.sg-prog.on .tk-seg-dot{background:var(--amber)}
.tk-seg-lg .tk-seg.sg-done.on .tk-seg-dot{background:var(--green)}
/* Indicador de notas en la tarjeta (abre el editor) */
.tk-note-ind{background:none;border:none;cursor:pointer;color:var(--gray-400);font-size:11px;padding:1px 4px;border-radius:5px;transition:color .15s,background .15s;flex-shrink:0}
.tk-note-ind:hover{color:var(--navy);background:var(--navy-pale)}
/* Acciones del modal en modo edición: convertir a progreso / asignar a compañero */
.tk-edit-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.tk-ghost-btn{flex:1;min-width:130px;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 12px;font-size:12px;font-weight:500;color:var(--gray-600);background:var(--white);border:1px solid var(--gray-200);border-radius:var(--r-md);cursor:pointer;transition:border-color .15s,color .15s,background .15s;font-family:inherit}
.tk-ghost-btn:hover{border-color:var(--navy-light);color:var(--navy);background:var(--navy-pale)}
/* ── Crear tarea: recordatorio + asignar con buscador ── */
.tk-remind-seg{display:flex;flex-wrap:wrap;gap:6px}
.tk-rem{flex:1 1 auto;min-width:64px;padding:8px 10px;border:1px solid var(--gray-200);background:var(--white);color:var(--gray-600);border-radius:var(--r-md);font-family:var(--font);font-size:12.5px;font-weight:500;cursor:pointer;white-space:nowrap;transition:border-color .15s,color .15s,background .15s,transform .12s cubic-bezier(.23,1,.32,1)}
.tk-rem:hover{border-color:var(--navy-light);color:var(--navy)}
.tk-rem:active{transform:scale(.97)}
.tk-rem.on{background:var(--navy);border-color:var(--navy);color:#fff}
.tk-rem-hint{display:block;font-size:11.5px;color:var(--gray-400);margin-top:6px}
.tk-assign{display:flex;flex-direction:column;gap:8px}
.tk-assign-chips{display:flex;flex-wrap:wrap;gap:6px}
.tk-assign-chips:empty{display:none}
.tk-chip{display:inline-flex;align-items:center;gap:7px;padding:4px 8px 4px 4px;border:1px solid var(--gray-200);border-radius:999px;background:var(--gray-50);font-size:12.5px;color:var(--gray-800)}
.tk-chip-av{width:22px;height:22px;border-radius:50%;background:var(--navy);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:9.5px;font-weight:600;flex-shrink:0}
.tk-chip-x{border:0;background:none;color:var(--gray-400);cursor:pointer;font-size:12px;padding:0 2px;line-height:1;border-radius:50%}
.tk-chip-x:hover{color:var(--red)}
.tk-assign-add{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border:1px dashed var(--gray-300);border-radius:var(--r-md);background:var(--white);color:var(--navy);font-family:var(--font);font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .15s,background .15s,transform .12s cubic-bezier(.23,1,.32,1)}
.tk-assign-add:hover{border-color:var(--navy);background:var(--navy-pale)}
.tk-assign-add:active{transform:scale(.98)}
.tk-pop{position:fixed;z-index:1500;width:280px;max-width:92vw;background:var(--white);border:1px solid var(--gray-200);border-radius:var(--r-md);box-shadow:0 14px 40px -8px rgba(15,23,42,.28),0 4px 10px -6px rgba(15,23,42,.2);padding:8px;transform-origin:top left;animation:etPopIn .15s cubic-bezier(.23,1,.32,1)}
.tk-pop[hidden]{display:none}
.tk-pop-search{width:100%;box-sizing:border-box;border:1px solid var(--gray-200);border-radius:var(--r-sm);padding:8px 11px;font-family:var(--font);font-size:13px;color:var(--gray-900);background:var(--gray-50);outline:none;margin-bottom:6px}
.tk-pop-search:focus{border-color:var(--navy)}
.tk-pop-list{max-height:244px;overflow-y:auto;display:flex;flex-direction:column;gap:1px}
.tk-pop-item{display:flex;align-items:center;gap:9px;padding:7px 8px;border:0;background:none;border-radius:var(--r-sm);cursor:pointer;font-family:var(--font);text-align:left;width:100%;transition:background .12s}
.tk-pop-item:hover{background:var(--gray-100)}
.tk-pop-av{width:26px;height:26px;border-radius:50%;background:var(--navy-pale);color:var(--navy);display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:600;flex-shrink:0}
.tk-pop-nm{flex:1;min-width:0;font-size:13px;color:var(--gray-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-pop-ck{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--gray-300);flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:transparent}
.tk-pop-item.on .tk-pop-ck{background:var(--navy);border-color:var(--navy);color:#fff}
.tk-pop-empty{padding:14px;text-align:center;color:var(--gray-400);font-size:12.5px}
@media (prefers-reduced-motion:reduce){.tk-rem:active,.tk-assign-add:active{transform:none}.tk-pop{animation:none}}
[data-theme="dark"] .tk-rem,[data-theme="dark"] .tk-assign-add,[data-theme="dark"] .tk-pop{background:#181818;border-color:#333;color:#ccc}
[data-theme="dark"] .tk-chip{background:#222;border-color:#333;color:#ddd}
[data-theme="dark"] .tk-pop-search{background:#0f0f0f;border-color:#2a2a2a;color:#eee}
[data-theme="dark"] .tk-pop-item:hover{background:#242424}
/* Notas del receptor, visibles para quien asignó la tarea (vista Equipo) */
.team-note{margin-top:6px;font-size:11.5px;color:var(--gray-600);background:var(--gray-50);border:1px solid var(--gray-100);border-radius:var(--r-sm);padding:6px 9px;display:flex;gap:6px;line-height:1.45}
.team-note i{color:var(--amber);margin-top:2px;flex-shrink:0}
.team-note span{white-space:pre-wrap;overflow-wrap:anywhere}

/* ═══ Plantillas de correos (Ventas) ═══ */
:root{--et-ease:cubic-bezier(.23,1,.32,1)}
/* Biblioteca */
#ventasPlantillas{position:relative;min-height:66vh}
.et-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.et-top-r{display:flex;align-items:center;gap:12px;margin-left:auto}
.et-count{font-size:12px;color:var(--gray-400)}
/* Overlay al arrastrar un .html sobre la biblioteca */
.et-dropzone{position:absolute;inset:0;z-index:6;display:none;align-items:center;justify-content:center;border:2.5px dashed var(--navy);border-radius:var(--r-lg);background:var(--navy-pale);pointer-events:none}
#ventasPlantillas.et-dragging .et-dropzone{display:flex;animation:etPopIn .14s var(--et-ease)}
.et-dropzone-in{text-align:center;color:var(--navy);font-weight:600;font-size:15px;padding:0 20px}
.et-dropzone-in i{font-size:36px;display:block;margin-bottom:12px}
[data-theme="dark"] .et-dropzone{background:rgba(93,143,245,.14);border-color:var(--navy-light)}
[data-theme="dark"] .et-dropzone-in{color:var(--navy-light)}
.et-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.et-card{border:1px solid var(--gray-200);border-radius:var(--r-lg);background:var(--white);overflow:hidden;display:flex;flex-direction:column;transition:border-color .16s,box-shadow .16s,transform .16s var(--et-ease);animation:etCardIn .17s var(--et-ease) both}
.et-card:hover{border-color:var(--navy-light);box-shadow:0 8px 24px rgba(26,58,107,.10);transform:translateY(-2px)}
@keyframes etCardIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.et-card:nth-child(1){animation-delay:0ms}.et-card:nth-child(2){animation-delay:45ms}.et-card:nth-child(3){animation-delay:90ms}.et-card:nth-child(4){animation-delay:135ms}.et-card:nth-child(5){animation-delay:180ms}.et-card:nth-child(6){animation-delay:225ms}.et-card:nth-child(n+7){animation-delay:260ms}
.et-card-prev{height:154px;background:#fff;position:relative;overflow:hidden;border-bottom:1px solid var(--gray-100);cursor:pointer}
.et-card-prev iframe{position:absolute;top:0;left:0;width:250%;height:385px;border:0;transform:scale(.4);transform-origin:top left;pointer-events:none;background:#fff}
.et-card-prev::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(255,255,255,.06));pointer-events:none}
.et-card-prev .et-openpill{position:absolute;right:9px;bottom:9px;display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:#fff;background:rgba(17,26,45,.72);padding:4px 9px;border-radius:999px;opacity:0;transform:translateY(4px);transition:opacity .18s,transform .18s var(--et-ease);backdrop-filter:blur(4px)}
.et-card:hover .et-openpill{opacity:1;transform:translateY(0)}
.et-card-body{padding:12px 14px 4px}
.et-card-title{font-size:14.5px;font-weight:600;color:var(--gray-900);margin:0 0 3px;line-height:1.3;word-break:break-word}
.et-card-meta{font-size:11.5px;color:var(--gray-400)}
.et-card-status{font-size:11px;margin-top:6px;display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;font-weight:500}
.et-card-status i{font-size:10px}
.et-card-status.ok{color:#16a34a;background:rgba(22,163,74,.10)}
.et-card-status.warn{color:#c2410c;background:rgba(234,88,12,.12)}
/* Progreso circular al optimizar imágenes */
.et-upload-ovl{position:fixed;inset:0;z-index:500;align-items:center;justify-content:center;background:rgba(15,23,42,.55);backdrop-filter:blur(3px)}
.et-upload-ovl:not([hidden]){display:flex}
.et-upload-card{background:var(--white,#fff);border-radius:16px;padding:30px 40px;text-align:center;box-shadow:0 16px 48px rgba(0,0,0,.28)}
.et-upload-ringwrap{position:relative;width:120px;height:120px;margin:0 auto}
.et-upload-ring{width:120px;height:120px;transform:rotate(-90deg)}
.et-ring-bg{fill:none;stroke:var(--gray-200,#e5e7eb);stroke-width:9}
.et-ring-fg{fill:none;stroke:var(--navy,#1a3a6b);stroke-width:9;stroke-linecap:round;stroke-dasharray:326.7;stroke-dashoffset:326.7;transition:stroke-dashoffset .3s ease}
.et-upload-pct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:600;color:var(--navy,#1a3a6b);font-variant-numeric:tabular-nums}
.et-upload-lbl{margin-top:16px;font-size:13px;color:var(--gray-600,#555)}
.et-card-foot{display:flex;gap:8px;padding:12px 14px;align-items:center}
.et-copy{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13px;font-weight:600;padding:9px 12px;border-radius:var(--r-md);border:0;background:var(--navy);color:#fff;cursor:pointer;font-family:var(--font);transition:filter .15s,transform .12s var(--et-ease)}
.et-copy:hover{filter:brightness(1.08)}
.et-copy:active{transform:scale(.97)}
.et-kebab{flex:0 0 auto;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-md);border:1px solid var(--gray-200);background:var(--white);color:var(--gray-500);cursor:pointer;font-size:15px;transition:color .15s,border-color .15s,background .15s,transform .12s var(--et-ease)}
.et-kebab:hover{color:var(--navy);border-color:var(--navy-light);background:var(--navy-pale)}
.et-kebab:active{transform:scale(.95)}
.et-empty{grid-column:1/-1;text-align:center;color:var(--gray-500);padding:56px 20px;line-height:1.6}
.et-empty .et-empty-ico{font-size:34px;color:var(--navy-light);margin-bottom:12px;opacity:.85}
.et-empty h3{font-size:16px;font-weight:600;color:var(--gray-800);margin:0 0 4px}
.et-empty p{font-size:13.5px;color:var(--gray-400);margin:0 auto 16px;max-width:44ch}

/* ═══ HTML's MVP (Ventas · solo MVP) — reusa el estilo de Plantillas ═══ */
#ventasHtmls{position:relative;min-height:66vh}
#ventasHtmls.et-dragging .et-dropzone{display:flex;animation:etPopIn .14s var(--et-ease)}
/* Modal: crear pegando código */
.mh-modal{width:min(620px,94vw)}
.mh-form{padding:14px 18px 18px;display:flex;flex-direction:column;gap:12px}
.mh-input{border:1px solid var(--gray-200);border-radius:var(--r-md);padding:10px 12px;font-family:var(--font);font-size:14px;color:var(--gray-900);background:var(--gray-50);outline:none;transition:border-color .15s}
.mh-input:focus{border-color:var(--navy)}
.mh-code{min-height:280px;resize:vertical;border:1px solid var(--gray-200);border-radius:var(--r-md);padding:12px 14px;font-family:var(--mono,monospace);font-size:12.5px;line-height:1.55;color:var(--gray-800);background:var(--white);outline:none;white-space:pre;overflow:auto}
.mh-code:focus{border-color:var(--navy)}
.mh-actions{display:flex;justify-content:flex-end;gap:8px}
/* Descargar = acción principal (naranja de marca, más grande); Copiar = secundario */
.mh-download-primary{flex:1.7;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:600;padding:12px 14px;border-radius:var(--r-md);border:0;background:var(--navy);color:#fff;cursor:pointer;font-family:var(--font);transition:filter .15s,transform .12s var(--et-ease)}
.mh-download-primary:hover{filter:brightness(1.08)}
.mh-download-primary:active{transform:scale(.97)}
.mh-download-primary i{font-size:14px}
.mh-copy-secondary{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:13px;font-weight:600;padding:9px 12px;border-radius:var(--r-md);border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700);cursor:pointer;font-family:var(--font);transition:color .15s,border-color .15s,background .15s,transform .12s var(--et-ease)}
.mh-copy-secondary:hover{border-color:var(--navy-light);color:var(--navy);background:var(--navy-pale)}
.mh-copy-secondary:active{transform:scale(.97)}
/* Flecha ↗ (abrir en otra pestaña a pantalla completa) — esquina superior derecha */
.mh-tab{position:absolute;top:8px;right:8px;z-index:3;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-sm);border:1px solid var(--gray-200);background:var(--white);color:var(--gray-500);cursor:pointer;font-size:12px;transition:color .15s,border-color .15s,background .15s,transform .12s var(--et-ease)}
.mh-tab:hover{color:var(--navy);border-color:var(--navy-light);background:var(--navy-pale)}
.mh-tab:active{transform:scale(.94)}
/* Tarjeta desplegable: compacta = solo el nombre; el preview se revela al hover
   deslizándose de abajo hacia arriba. Solo hover-devices colapsan; en táctil
   (sin hover) el preview queda visible. */
#mhGrid{align-items:start}
.mh-card{position:relative;border:1px solid var(--gray-200);border-radius:var(--r-lg);background:var(--white);overflow:hidden;display:flex;flex-direction:column;transition:border-color .16s,box-shadow .16s;animation:etCardIn .17s var(--et-ease) both}
.mh-card:hover{border-color:var(--navy-light);box-shadow:0 8px 24px rgba(26,58,107,.10)}
.mh-top{display:flex;align-items:center;gap:11px;width:100%;text-align:left;background:none;border:0;padding:13px 44px 13px 14px;cursor:pointer;font-family:var(--font)}
.mh-top-ico{flex:0 0 auto;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-sm);background:var(--navy-pale);color:var(--navy);font-size:14px}
.mh-top-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mh-top-title{font-size:14px;font-weight:600;color:var(--gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mh-top-meta{font-size:11.5px;color:var(--gray-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mh-top-eye{flex:0 0 auto;color:var(--gray-300);font-size:13px;transition:color .18s,transform .18s var(--et-ease)}
.mh-card:hover .mh-top-eye{color:var(--navy-light);transform:translateY(-1px)}
.mh-reveal{height:0;overflow:hidden;position:relative;background:#fff;transition:height .32s var(--et-ease)}
.mh-reveal-frame{position:absolute;left:0;bottom:0;width:250%;height:420px;border:0;transform:scale(.4) translateY(16px);transform-origin:bottom left;opacity:0;pointer-events:none;background:#fff;transition:transform .34s var(--et-ease),opacity .26s ease}
@media (hover:hover){
  .mh-card:hover .mh-reveal{height:168px;border-top:1px solid var(--gray-100)}
  .mh-card:hover .mh-reveal-frame{transform:scale(.4) translateY(0);opacity:1}
}
@media (hover:none){
  .mh-reveal{height:168px;border-top:1px solid var(--gray-100)}
  .mh-reveal-frame{transform:scale(.4) translateY(0);opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .mh-reveal{transition:height .12s linear}
  .mh-reveal-frame,.mh-card:hover .mh-reveal-frame{transition:opacity .12s linear;transform:scale(.4)}
}
/* Vista previa a pantalla completa (solo lectura) */
.mh-prev-backdrop{z-index:1300}
.mh-prev-box{background:var(--gray-50);border-radius:var(--r-lg);width:min(900px,96vw);height:min(88vh,900px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 18px 52px rgba(0,0,0,.28);transform:scale(.97) translateY(10px);transition:transform .3s var(--et-ease)}
.mh-prev-backdrop.show .mh-prev-box{transform:none}
.mh-prev-bar{display:flex;align-items:center;gap:10px;padding:11px 14px;background:var(--white);border-bottom:1px solid var(--gray-200);flex-shrink:0}
.mh-prev-title{flex:1;min-width:0;font-size:15px;font-weight:600;color:var(--gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mh-prev-bar-r{display:flex;align-items:center;gap:7px;flex-shrink:0}
.mh-prev-frame{flex:1;border:0;background:#fff;width:100%;min-height:0}

/* Popover genérico (menús / color / enlace) — fixed para no recortarse */
.et-pop{position:fixed;z-index:1500;background:var(--white);border:1px solid var(--gray-200);border-radius:var(--r-md);box-shadow:0 14px 40px -8px rgba(15,23,42,.28),0 4px 10px -6px rgba(15,23,42,.2);padding:5px;min-width:190px;transform-origin:top right;animation:etPopIn .15s var(--et-ease)}
.et-pop[hidden]{display:none}   /* gana al display:grid de .et-colorpop, etc. */
@keyframes etPopIn{from{opacity:0;transform:scale(.95) translateY(-4px)}to{opacity:1;transform:scale(1) translateY(0)}}
.et-pop button.et-mi{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:none;border:0;border-radius:var(--r-sm);padding:9px 11px;font-family:var(--font);font-size:13px;color:var(--gray-700);cursor:pointer;transition:background .12s}
.et-pop button.et-mi i{width:15px;text-align:center;color:var(--gray-400)}
.et-pop button.et-mi:hover{background:var(--gray-100)}
.et-pop button.et-mi.danger{color:var(--red)}
.et-pop button.et-mi.danger i{color:var(--red)}
.et-pop button.et-mi.danger:hover{background:var(--red-bg)}
.et-colorpop{min-width:0;display:grid;grid-template-columns:repeat(6,1fr);gap:7px;padding:10px}
.et-colorpop button{width:24px;height:24px;border-radius:50%;border:2px solid rgba(0,0,0,.06);cursor:pointer;padding:0;transition:transform .12s var(--et-ease)}
.et-colorpop button:hover{transform:scale(1.15)}
.et-linkpop{min-width:280px;padding:10px}
.et-linkpop-row{display:flex;gap:8px}
.et-linkpop-row input{flex:1;border:1px solid var(--gray-200);border-radius:var(--r-sm);padding:8px 10px;font-family:var(--font);font-size:13px;color:var(--gray-900);background:var(--gray-50);outline:none}
.et-linkpop-row input:focus{border-color:var(--navy)}

/* Editor a pantalla completa */
.et-editor{position:fixed;inset:0;z-index:1250;background:var(--gray-50);display:flex;flex-direction:column;animation:etEditorIn .3s var(--et-ease)}
.et-editor[hidden]{display:none}   /* el atributo hidden debe ganarle al display:flex */
@keyframes etEditorIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.et-ebar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--white);border-bottom:1px solid var(--gray-200);flex-shrink:0}
.et-etitle{flex:1;min-width:0;border:1px solid transparent;border-radius:var(--r-md);padding:8px 11px;font-family:var(--font);font-size:15px;font-weight:600;color:var(--gray-900);background:transparent;outline:none;transition:background .15s,border-color .15s}
.et-etitle:hover{background:var(--gray-50)}
.et-mode-label{flex:1;min-width:0;display:flex;align-items:center;gap:8px;font-family:var(--font);font-size:15px;font-weight:600;color:var(--navy);padding:8px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.et-mode-label i{color:var(--navy)}
.et-etitle:focus{background:var(--gray-50);border-color:var(--navy)}
.et-ebar-r{display:flex;align-items:center;gap:7px;flex-shrink:0}
.et-name-hint{flex-shrink:0;display:inline-flex;align-items:center;gap:5px;font-family:var(--font);font-size:12px;font-weight:600;color:var(--amber);white-space:nowrap}
.et-etitle.et-need-name{border-color:var(--amber)}
.et-ebtn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;padding:8px 13px;border-radius:var(--r-md);border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700);cursor:pointer;font-family:var(--font);transition:color .15s,border-color .15s,background .15s,transform .12s var(--et-ease)}
.et-ebtn:hover{border-color:var(--navy-light);color:var(--navy);background:var(--navy-pale)}
.et-ebtn:active{transform:scale(.97)}
.et-ebtn.primary{background:var(--navy);color:#fff;border-color:var(--navy)}
.et-ebtn.primary:hover{filter:brightness(1.08);color:#fff}
.et-ebtn.ghost{border-color:transparent;background:none;color:var(--gray-500);width:38px;height:38px;justify-content:center;padding:0}
.et-ebtn.ghost:hover{background:var(--gray-100);color:var(--gray-800)}

/* ── Botones del header de HTML's MVP: par primario/secundario coherente ──
   Primario (acento MVP) = Subir HTML, a la derecha; secundario = Nuevo HTML. */
.mh-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:150px;padding:10px 20px;border-radius:10px;
  font-family:var(--font);font-size:13px;font-weight:600;letter-spacing:.1px;
  cursor:pointer;white-space:nowrap;
  transition:transform .16s cubic-bezier(.23,1,.32,1),box-shadow .18s ease,
             background-color .15s,border-color .15s,color .15s,filter .15s;
}
.mh-btn i{font-size:12px}
.mh-btn:active{transform:scale(.97)}
.mh-primary{border:none;background:var(--navy);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.mh-primary:hover{filter:brightness(1.07);box-shadow:0 5px 16px rgba(237,120,36,.28)}
.mh-sec{border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700)}
.mh-sec:hover{border-color:var(--navy-light);color:var(--navy);background:var(--navy-ghost)}
[data-theme="dark"] .mh-sec{background:#181818;border-color:#333;color:#ccc}
[data-theme="dark"] .mh-sec:hover{color:var(--navy);border-color:var(--navy)}
/* MVP oscuro: el acento se aclara demasiado para texto blanco → naranja de marca fijo */
[data-theme="dark"][data-org="mvp"] .mh-primary{background:#ED7824;color:#fff}
/* Móvil: los dos botones en su propia fila, mitad y mitad, target ≥44px */
@media (max-width:640px){
  #ventasHtmls .et-top-r{flex-wrap:wrap;flex-basis:100%;gap:10px}
  #ventasHtmls .et-count{flex-basis:100%}
  .mh-btn{flex:1 1 0;min-width:0;padding:13px 12px;font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){.mh-btn:active{transform:none}}
.et-tools{display:flex;align-items:center;gap:3px;padding:8px 14px;background:var(--white);border-bottom:1px solid var(--gray-200);flex-shrink:0;overflow-x:auto;scrollbar-width:thin}
.et-tool{flex:0 0 auto;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--r-sm);border:0;background:none;color:var(--gray-600);cursor:pointer;font-size:13px;transition:background .12s,color .12s,transform .12s var(--et-ease)}
.et-tool:hover{background:var(--gray-100);color:var(--navy)}
.et-tool:active{transform:scale(.9)}
.et-tsep{flex:0 0 auto;width:1px;height:20px;background:var(--gray-200);margin:0 4px}
.et-size{flex:0 0 auto}
.et-size select{border:0;background:none;font-family:var(--font);font-size:12.5px;color:var(--gray-600);cursor:pointer;padding:6px 4px;border-radius:var(--r-sm);outline:none}
.et-font select{max-width:140px}
.et-line select{max-width:128px}
.et-px select{max-width:86px}
.et-tool.et-tool-on{background:var(--navy);color:#fff}
.et-size select:hover{background:var(--gray-100)}
.et-import{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 16px;border-radius:999px;background:var(--navy);color:#fff;font-family:var(--font);font-size:12.5px;font-weight:600;white-space:nowrap;cursor:pointer;transition:filter .15s,transform .12s var(--et-ease)}
.et-import:hover{filter:brightness(1.1)}
.et-import:active{transform:scale(.97)}
.et-import i{font-size:12px}
.et-stage{flex:1 1 auto;min-height:0;position:relative;padding:16px;display:flex;justify-content:center;overflow:auto}
.et-canvas{width:100%;max-width:840px;height:100%;border:1px solid var(--gray-200);border-radius:var(--r-md);background:#fff;box-shadow:0 6px 24px -12px rgba(15,23,42,.25)}
.et-codearea{width:100%;max-width:840px;height:100%;resize:none;border:1px solid var(--gray-200);border-radius:var(--r-md);padding:14px 16px;font-family:var(--mono,monospace);font-size:12.5px;line-height:1.55;color:var(--gray-800);background:var(--white);outline:none;white-space:pre;overflow:auto}
.et-codearea:focus{border-color:var(--navy)}
/* Edición de imágenes: caja de selección + mini-barra flotante (tema fijo oscuro) */
.et-img-selbox{position:fixed;z-index:1290;border:2px solid #3b82f6;border-radius:3px;pointer-events:none;box-shadow:0 0 0 3px rgba(59,130,246,.18)}
.et-imgbar{position:fixed;z-index:1300;display:flex;align-items:center;gap:2px;padding:5px 6px;background:#1f2937;border-radius:10px;box-shadow:0 10px 30px -8px rgba(0,0,0,.5)}
.et-imgbar[hidden]{display:none}   /* el atributo hidden debe ganarle al display:flex */
.et-imgbar button{width:32px;height:32px;border:0;background:none;color:#e5e9f0;border-radius:7px;cursor:pointer;font-size:13px;display:inline-flex;align-items:center;justify-content:center;transition:background .12s,color .12s}
.et-imgbar button:hover{background:rgba(255,255,255,.14)}
.et-imgbar .et-imgbar-del:hover{background:#e5484d;color:#fff}
.et-imgbar-sep{width:1px;height:20px;background:rgba(255,255,255,.18);margin:0 3px}
.et-hint{position:absolute;left:50%;top:34px;transform:translateX(-50%);max-width:min(520px,86vw);text-align:center;font-size:13px;color:var(--gray-400);line-height:1.6;pointer-events:none}
.et-hint i{color:var(--navy-light)}

/* Historial */
.et-vmodal{background:var(--white);border-radius:var(--r-lg);width:min(540px,94vw);max-height:88vh;display:flex;flex-direction:column;box-shadow:0 18px 52px rgba(0,0,0,.28);transform:scale(.96) translateY(12px);transition:transform .3s cubic-bezier(.23,1,.32,1);overflow:hidden}
.notes-modal.show .et-vmodal{transform:none}
.et-vmodal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 18px;border-bottom:1px solid var(--gray-100)}
.et-vnote{font-size:12px;color:var(--gray-500);padding:12px 18px 4px;line-height:1.5}
.et-vlist{padding:8px 14px 16px;overflow-y:auto}
.et-vrow{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--gray-100);border-radius:var(--r-md);margin-bottom:8px}
.et-vrow-info{flex:1;min-width:0}
.et-vrow-when{font-size:13px;color:var(--gray-800);font-weight:500}
.et-vrow-who{font-size:11.5px;color:var(--gray-400)}
.et-vempty{color:var(--gray-400);font-size:13px;text-align:center;padding:24px;line-height:1.6}

@media (max-width:640px){
  .et-grid{grid-template-columns:1fr;gap:13px}
  .et-ebtn .et-ebtn-tx{display:none}
  .et-ebtn{padding:8px 11px}
  .et-stage{padding:10px}
  .et-etitle{font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  .et-card,.et-editor,.et-pop{animation:none}
  .et-copy:active,.et-ebtn:active,.et-tool:active,.et-kebab:active{transform:none}
}
[data-theme="dark"] .et-card,[data-theme="dark"] .et-vmodal,[data-theme="dark"] .et-pop{background:#181818;border-color:#2a2a2a}
[data-theme="dark"] .et-editor{background:#0d0d0d}
[data-theme="dark"] .et-ebar,[data-theme="dark"] .et-tools{background:#161616;border-color:#262626}
[data-theme="dark"] .et-card-prev,[data-theme="dark"] .et-canvas{background:#fff}
[data-theme="dark"] .et-kebab,[data-theme="dark"] .et-ebtn{background:#181818;border-color:#333;color:#ccc}
[data-theme="dark"] .et-codearea{background:#0f0f0f;border-color:#2a2a2a;color:#eee}
[data-theme="dark"] .et-pop button.et-mi{color:#ddd}
[data-theme="dark"] .et-pop button.et-mi:hover{background:#242424}
[data-theme="dark"] .et-linkpop-row input{background:#0f0f0f;border-color:#2a2a2a;color:#eee}

/* Completar / reabrir: la fila sale desvaneciéndose y entra en su nuevo lugar
   con un breve destello del acento. Solo transform/opacity (GPU). */
@keyframes tkLeave{to{opacity:0;transform:translateX(10px) scale(.98)}}
.list-item.tk-leaving{animation:tkLeave .18s cubic-bezier(.23,1,.32,1) forwards;pointer-events:none}
@keyframes tkEnter{from{opacity:0;transform:translateY(-7px);background:var(--navy-pale)}to{opacity:1;transform:translateY(0);background:transparent}}
.list-item.tk-entering{animation:tkEnter .26s cubic-bezier(.23,1,.32,1)}
@keyframes tkBump{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}
.tk-group-n.tk-bump{display:inline-block;animation:tkBump .32s cubic-bezier(.23,1,.32,1)}

/* Accesibilidad de movimiento: honra prefers-reduced-motion en toda la app
   (PRODUCT.md lo pide). Vuelve transiciones/animaciones casi instantáneas. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}

/* ── KANBAN ── */
.kanban-view{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:start}
.kb-col{background:var(--gray-50);border:1px solid var(--gray-100);border-radius:var(--r-lg);overflow:hidden}
.kb-col-head{padding:10px 14px;border-bottom:1px solid var(--gray-100);display:flex;align-items:center;gap:8px;background:var(--white)}
.kb-col-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.kb-col-title{font-size:12px;font-weight:500;color:var(--gray-700);flex:1}
.kb-col-count{font-size:10px;font-family:var(--mono);color:var(--gray-400);background:var(--gray-100);padding:1px 7px;border-radius:10px}
.kb-cards{padding:10px;display:flex;flex-direction:column;gap:7px;min-height:60px}
.kb-card{position:relative;background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-md);padding:11px 12px;padding-right:46px;transition:border-color .15s,box-shadow .15s}
.kb-card:hover{border-color:var(--navy-light);box-shadow:var(--shadow-sm)}
.kb-card-actions{position:absolute;top:6px;right:6px;display:flex;gap:1px}
.kb-edit{background:none;border:none;color:var(--gray-300);font-size:11px;cursor:pointer;padding:3px 6px;border-radius:3px;transition:color .15s,background .15s;opacity:0}
.kb-card:hover .kb-edit{opacity:1}
.kb-edit:hover{color:var(--navy);background:var(--navy-pale)}
.kb-del{position:static;background:none;border:none;color:var(--gray-300);font-size:11px;cursor:pointer;padding:3px 6px;border-radius:3px;transition:color .15s,background .15s;opacity:0}
.kb-card:hover .kb-del{opacity:1}
.kb-del:hover{color:var(--red);background:var(--red-bg)}
@media (hover:none){.kb-card .kb-edit,.kb-card .kb-del{opacity:1}}
.kb-card.done-card{opacity:.5}
.kb-card-name{font-size:12px;color:var(--gray-700);line-height:1.5;margin-bottom:8px}
.kb-card-name.struck{text-decoration:line-through;color:var(--gray-400)}
.kb-card-foot{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.kb-due{font-size:10px;color:var(--gray-400);display:flex;align-items:center;gap:2px}
.kb-due.od{color:var(--red)}
.kb-prio{font-size:10px;padding:2px 7px;border-radius:10px}
.kb-prog{width:100%;height:4px;background:var(--gray-100);border-radius:2px;margin-bottom:6px;overflow:hidden}
.kb-prog-fill{height:100%;background:var(--navy);border-radius:2px;transition:width .3s}
.kb-prog-fill.complete{background:var(--green)}
.kb-prog-label{font-size:10px;color:var(--gray-500);margin-bottom:4px}
.kb-action{
  width:100%;padding:9px 12px;
  background:var(--navy);border:none;
  border-radius:var(--r-sm);font-size:12px;color:white;font-weight:500;
  font-family:var(--font);cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:7px;
  margin-bottom:8px;
  box-shadow:0 1px 3px rgba(26,58,107,.18);
  transition:transform .18s cubic-bezier(.4,0,.2,1),opacity .18s cubic-bezier(.4,0,.2,1),color .18s cubic-bezier(.4,0,.2,1),background-color .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1);
}
.kb-action:hover{background:var(--navy-mid);box-shadow:0 4px 12px rgba(26,58,107,.3);transform:translateY(-1px)}
.kb-action:active{transform:translateY(0) scale(.99)}
.kb-action i{font-size:11px}

/* ── NOTAS PERSONALES (por blocs) ── */
.notes-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 16px;flex-wrap:wrap}
.notes-title{font-size:15px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:9px}
.notes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.note-block{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow .16s ease-out,border-color .16s;animation:noteIn .15s ease-out both}
.note-block:hover{box-shadow:var(--shadow-md);border-color:var(--gray-200)}
.note-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--gray-100)}
.note-title{flex:1;min-width:0;border:0;background:none;font-family:var(--font);font-size:14px;font-weight:600;color:var(--gray-900);outline:none}
.note-title::placeholder{color:var(--gray-400)}
.note-del{background:none;border:0;color:var(--gray-400);cursor:pointer;padding:5px 7px;border-radius:7px;font-size:12px;transition:color .15s,background .15s}
.note-del:hover{color:var(--red);background:var(--red-bg)}
.note-body{border:0;background:none;resize:vertical;min-height:150px;padding:12px;font-family:var(--font);font-size:13.5px;color:var(--gray-700);line-height:1.55;outline:none}
.note-body[contenteditable]{overflow-wrap:anywhere}
.note-body[contenteditable]:empty::before{content:attr(data-ph);color:var(--gray-300)}
.note-body::placeholder{color:var(--gray-400)}
.note-foot{padding:5px 12px 9px;min-height:20px;display:flex;justify-content:flex-end}
.note-saved{font-size:11px;color:var(--gray-400)}
.notes-empty{grid-column:1/-1;padding:44px 20px;text-align:center;color:var(--gray-500);font-size:13.5px;border:1px dashed var(--gray-200);border-radius:var(--r-lg)}
@keyframes noteIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.note-block{animation:none} .note-collapse i,.notes-back i{transition:none}}
.notes-back{display:inline-flex;align-items:center;gap:7px;background:none;border:0;color:var(--gray-500);font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;padding:6px 4px;transition:color .15s}
.notes-back:hover{color:var(--navy)}
.notes-back i{transition:transform .15s}
.notes-back:hover i{transform:translateX(-2px)}
.notes-bar .notes-title{flex:1}
.note-collapse{background:none;border:0;color:var(--gray-400);cursor:pointer;padding:4px 6px;border-radius:6px;font-size:12px;transition:color .15s,background .15s}
.note-collapse:hover{color:var(--navy);background:var(--gray-50)}
.note-collapse i{transition:transform .2s cubic-bezier(.23,1,.32,1)}
.note-block.collapsed .note-collapse i{transform:rotate(-90deg)}
.note-block.collapsed .note-body,.note-block.collapsed .note-foot{display:none}
.note-block.collapsed .note-head{border-bottom:0}
.note-share{background:none;border:0;color:var(--gray-400);cursor:pointer;padding:5px 7px;border-radius:7px;font-size:12px;transition:color .15s,background .15s}
.note-share:hover{color:var(--navy);background:var(--navy-ghost)}
/* Modal: compartir nota */
.ns-list{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow:auto;border:1px solid var(--gray-200);border-radius:var(--r-md);padding:5px}
.ns-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;color:var(--gray-900)}
.ns-item:hover{background:var(--gray-50)}
.ns-av{width:26px;height:26px;flex-shrink:0;border-radius:50%;background:var(--navy-pale);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600}

/* ── Botón flotante de reporte (abajo-izquierda, en cada sección) ── */
.report-fab{position:fixed;left:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:900;
  display:inline-flex;align-items:center;gap:8px;padding:10px 15px;border-radius:999px;
  background:var(--white);color:var(--gray-600);border:1px solid var(--gray-200);
  box-shadow:0 6px 20px -6px rgba(15,23,42,.25);cursor:pointer;font-family:var(--font);font-size:13px;font-weight:500;
  transition:transform .18s cubic-bezier(.23,1,.32,1),box-shadow .18s,color .15s,border-color .15s,opacity .18s}
.report-fab i{font-size:14px;color:var(--gray-400);transition:color .15s}
/* Se oculta cuando hay un modal/overlay o el nav abierto (evita solaparse) */
body:has(.modal-backdrop.show,.camp-modal-backdrop.show,.home-picker-backdrop.show,.nav-drawer.open) .report-fab{opacity:0;pointer-events:none;transform:translateY(6px)}
.report-fab:hover{color:var(--navy);border-color:var(--navy-light);transform:translateY(-2px);box-shadow:0 10px 26px -6px rgba(26,58,107,.3)}
.report-fab:hover i{color:var(--navy)}
.report-fab:active{transform:translateY(0) scale(.97)}
@media (max-width:600px){.report-fab span{display:none}.report-fab{padding:12px;left:14px}}
@media (prefers-reduced-motion:reduce){.report-fab{transition:none}}
/* Modal de reporte */
.report-types{display:flex;gap:8px;margin:2px 0 12px;flex-wrap:wrap}
.report-type{flex:1;min-width:92px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:10px 8px;
  border:1px solid var(--gray-200);background:var(--white);border-radius:10px;cursor:pointer;font-family:var(--font);
  font-size:12.5px;font-weight:500;color:var(--gray-600);transition:border-color .15s,background .15s,color .15s}
.report-type i{font-size:12px}
.report-type:hover{border-color:var(--navy-light)}
.report-type.on{border-color:var(--navy);background:var(--navy-pale);color:var(--navy);font-weight:600}
.report-text{width:100%;box-sizing:border-box;border:1px solid var(--gray-200);border-radius:10px;padding:11px 12px;
  font-family:var(--font);font-size:14px;color:var(--gray-900);background:var(--gray-50);outline:none;resize:vertical;min-height:92px;line-height:1.5}
.report-text:focus{border-color:var(--navy)}
.report-text::placeholder{color:var(--gray-400)}
.ns-nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ns-hint{font-size:12px;color:var(--gray-500);margin-top:10px;line-height:1.45}
/* Botón flotante de notas (perpetuo) + drawer tipo cuaderno */
.notes-fab{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:900;
  border:none;cursor:pointer;display:none;align-items:center;gap:9px;
  padding:13px 18px;border-radius:999px;font-family:var(--font);font-size:14px;font-weight:600;
  background:var(--navy);color:#fff;box-shadow:0 8px 24px -6px rgba(26,58,107,.55);
  transition:transform .16s cubic-bezier(.23,1,.32,1),box-shadow .16s}
.notes-fab i{font-size:16px}
.notes-fab:hover{transform:translateY(-2px);box-shadow:0 12px 30px -8px rgba(26,58,107,.6)}
.notes-fab:active{transform:scale(.94)}
.notes-drawer-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(15,20,35,.45);display:none;justify-content:flex-end;opacity:0;transition:opacity .22s ease}
.notes-drawer-backdrop.show{display:flex;opacity:1}
.notes-drawer{width:min(460px,94vw);height:100%;background:var(--gray-50);display:flex;flex-direction:column;
  box-shadow:-14px 0 44px rgba(15,23,42,.25);transform:translateX(100%);transition:transform .28s cubic-bezier(.32,.72,0,1);overflow:hidden}
.notes-drawer-backdrop.show .notes-drawer{transform:none}
.notes-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 18px 12px;border-bottom:1px solid var(--gray-200);background:var(--white)}
.notes-drawer-title{font-size:16px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:9px}
.notes-drawer-date{font-size:12px;color:var(--gray-500);margin-top:3px;text-transform:capitalize}
.notes-drawer-acts{display:flex;align-items:center;gap:8px;flex-shrink:0}
.notes-drawer-x{background:none;border:0;color:var(--gray-500);font-size:18px;cursor:pointer;padding:4px 8px;border-radius:8px;transition:color .15s,background .15s}
.notes-drawer-x:hover{color:var(--navy);background:var(--gray-100)}
.notes-grid-drawer{grid-template-columns:1fr;padding:16px;overflow-y:auto;flex:1;align-content:start}
@media (prefers-reduced-motion:reduce){.notes-fab,.notes-drawer-backdrop,.notes-drawer{transition:none}}

/* ═══ Módulo de Notas — página a 3 paneles (carpetas · lista · editor) ═══ */
#pageNotes{max-width:none;padding:0;display:none}
#pageNotes.active{display:flex;flex-direction:column}
.nt-shell{display:flex;height:calc(100vh - 64px);min-height:480px;background:var(--white)}
.nt-col{display:flex;flex-direction:column;min-height:0}
.nt-col-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 16px 10px}
.nt-col-title{font-size:13px;font-weight:700;letter-spacing:.3px;color:var(--gray-700);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nt-ico{width:30px;height:30px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);background:var(--white);color:var(--gray-500);border-radius:8px;cursor:pointer;font-size:12px;transition:color .15s,border-color .15s,background .15s}
.nt-ico:hover{color:var(--navy);border-color:var(--navy-light);background:var(--navy-pale)}
.nt-ico.danger:hover{color:var(--red);border-color:var(--red);background:var(--red-bg)}
/* Botón "volver" del editor: solo visible en móvil (drill-in) */
.nt-back{display:none;width:34px;height:34px;flex:0 0 auto;align-items:center;justify-content:center;border:1px solid var(--gray-200);background:var(--white);color:var(--gray-600);border-radius:9px;cursor:pointer;font-size:14px;transition:background .15s,color .15s}
.nt-back:active{background:var(--gray-100);color:var(--navy)}
.nt-folders{flex:0 0 210px;border-right:1px solid var(--gray-100);background:var(--gray-50);overflow-y:auto}
.nt-folder-list{padding:4px 8px 16px;display:flex;flex-direction:column;gap:2px}
.nt-folder{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:8px;cursor:pointer;border:1px solid transparent;transition:background .12s;font-family:var(--font);text-align:left;background:none;width:100%}
.nt-folder:hover{background:var(--gray-100)}
.nt-folder.on{background:var(--white);border-color:var(--gray-200);box-shadow:var(--shadow-sm)}
.nt-folder-dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px;background:var(--gray-300)}
.nt-folder-nm{flex:1;min-width:0;font-size:13px;color:var(--gray-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nt-folder-ct{font-size:11px;color:var(--gray-400)}
.nt-list{flex:0 0 290px;border-right:1px solid var(--gray-100);overflow:hidden}
.nt-search{margin:0 16px 8px;display:flex;align-items:center;gap:8px;border:1px solid var(--gray-200);border-radius:var(--r-md);padding:7px 11px;background:var(--gray-50)}
.nt-search i{color:var(--gray-400);font-size:12px}
.nt-search input{flex:1;border:0;background:none;outline:none;font-family:var(--font);font-size:13px;color:var(--gray-900)}
.nt-newnote{margin:0 16px 8px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px;border:0;border-radius:var(--r-md);background:var(--navy);color:#fff;font-family:var(--font);font-size:13px;font-weight:600;cursor:pointer;transition:filter .15s,transform .12s cubic-bezier(.23,1,.32,1)}
.nt-newnote:hover{filter:brightness(1.08)}
.nt-newnote:active{transform:scale(.98)}
.nt-notes{flex:1;overflow-y:auto;padding:0 12px 16px;display:flex;flex-direction:column;gap:6px}
.nt-note{text-align:left;border:1px solid var(--gray-100);border-radius:var(--r-md);background:var(--white);padding:10px 12px 10px 14px;cursor:pointer;position:relative;transition:border-color .15s,box-shadow .15s;overflow:hidden;font-family:var(--font);width:100%}
.nt-note:hover{border-color:var(--navy-light);box-shadow:var(--shadow-sm)}
.nt-note.on{border-color:var(--navy);box-shadow:0 0 0 1px var(--navy)}
.nt-note-bar{position:absolute;left:0;top:0;bottom:0;width:4px}
.nt-note-t{font-size:13.5px;font-weight:600;color:var(--gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 0 2px}
.nt-note-x{font-size:11.5px;color:var(--gray-500);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nt-note-d{font-size:10.5px;color:var(--gray-400);margin-top:3px}
.nt-list-empty{color:var(--gray-400);font-size:12.5px;text-align:center;padding:24px 10px;line-height:1.6}
.nt-editor{flex:1;min-width:0;overflow:hidden}
.nt-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--gray-400);gap:10px;padding:24px}
.nt-empty i{font-size:38px;color:var(--navy-light);opacity:.85}
.nt-empty h3{font-size:17px;font-weight:600;color:var(--gray-700);margin:0}
.nt-empty p{font-size:13.5px;max-width:38ch;margin:0 0 8px}
.nt-doc{height:100%;display:flex;flex-direction:column;min-height:0}
.nt-doc-head{display:flex;align-items:center;gap:8px;padding:16px 22px 8px}
.nt-todo-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:7px;flex:none;white-space:nowrap;
  padding:8px 15px;border:1px solid var(--navy);border-radius:20px;background:var(--navy);color:#fff;
  font-size:12.5px;font-weight:600;font-family:inherit;cursor:pointer;transition:filter .15s,transform .08s,box-shadow .2s}
.nt-todo-btn i{font-size:12px}
.nt-todo-btn:hover{filter:brightness(1.1)}
.nt-todo-btn:active{transform:scale(.97)}
/* "Nueva función": brillo que se desliza + halo suave, hasta el primer uso */
.nt-todo-btn.nt-todo-new{box-shadow:0 0 0 3px rgba(26,58,107,.15)}
.nt-todo-btn.nt-todo-new::before{content:'';position:absolute;top:0;left:-140%;width:55%;height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);transform:skewX(-20deg);
  animation:ntShine 2.8s ease-in-out 1s infinite;pointer-events:none}
@keyframes ntShine{0%{left:-140%}55%{left:150%}100%{left:150%}}
@media (prefers-reduced-motion:reduce){.nt-todo-btn.nt-todo-new::before{animation:none}}
@media (max-width:560px){.nt-todo-btn span{display:none}.nt-todo-btn{padding:8px 11px}}
.nt-title{flex:1;min-width:0;border:0;outline:none;background:none;font-family:var(--font);font-size:22px;font-weight:600;color:var(--gray-900)}
.nt-title::placeholder{color:var(--gray-300)}
.nt-color-inp{width:28px;height:28px;padding:0;border:1px solid var(--gray-200);border-radius:8px;background:none;cursor:pointer;flex:0 0 auto}
.nt-toolbar{display:flex;align-items:center;gap:3px;flex-wrap:wrap;padding:8px 22px;border-bottom:1px solid var(--gray-100)}
.nt-sel{border:1px solid var(--gray-200);background:var(--white);border-radius:8px;font-family:var(--font);font-size:12.5px;color:var(--gray-700);padding:6px 8px;cursor:pointer;outline:none}
.nt-sel-sm{max-width:100px}
.nt-tool{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:0;background:none;color:var(--gray-600);border-radius:7px;cursor:pointer;font-size:13px;transition:background .12s,color .12s;position:relative;overflow:hidden}
.nt-tool:hover{background:var(--gray-100);color:var(--navy)}
.nt-color input[type=color]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;border:0}
.nt-tsep{width:1px;height:20px;background:var(--gray-200);margin:0 4px;flex:0 0 auto}
.nt-body-wrap{flex:1;min-height:0;overflow-y:auto;padding:18px 22px 40px}
.nt-body{max-width:760px;margin:0 auto;min-height:100%;outline:none;font-family:'DM Sans',var(--font);font-size:15px;line-height:1.7;color:var(--gray-900);word-wrap:break-word}
.nt-body:empty::before{content:'Escribe aquí…';color:var(--gray-300)}
.nt-body h1{font-size:26px;font-weight:600;margin:.6em 0 .3em;line-height:1.25}
.nt-body h2{font-size:21px;font-weight:600;margin:.6em 0 .3em;line-height:1.3}
.nt-body h3{font-size:17px;font-weight:600;margin:.6em 0 .3em}
.nt-body blockquote{border-left:3px solid var(--gray-200);margin:.5em 0;padding:.2em 0 .2em 14px;color:var(--gray-500)}
.nt-body ul,.nt-body ol{padding-left:1.4em;margin:.4em 0}
.nt-body a{color:var(--navy);text-decoration:underline}
/* Selección gris traslúcida (no el azul del navegador) y botón de la barra marcado cuando el formato está aplicado */
.nt-body ::selection,.nt-body::selection,.nt-title::selection{background:rgba(26,31,46,.14);color:inherit}
[data-theme="dark"] .nt-body ::selection,[data-theme="dark"] .nt-body::selection,[data-theme="dark"] .nt-title::selection{background:rgba(236,239,244,.22)}
.nt-tool.on{background:var(--navy-pale);color:var(--navy)}
[data-theme="dark"] .nt-tool.on{background:rgba(93,143,245,.18);color:#9fc0ee}
/* Lista de verificación dentro de la nota: <ul class="nt-checks"><li><input type="checkbox"> texto</li></ul> */
.nt-body ul.nt-checks{list-style:none;padding-left:0;margin:.4em 0}
.nt-body ul.nt-checks li{display:flex;align-items:flex-start;gap:10px;padding:2px 0}
.nt-body ul.nt-checks input[type="checkbox"]{flex:none;width:17px;height:17px;margin:4px 0 0;accent-color:var(--navy);cursor:pointer}
.nt-body ul.nt-checks li.done{color:var(--gray-400);text-decoration:line-through}
.nt-grp{font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-400);padding:8px 4px 2px}
.nt-doc-foot{padding:8px 22px 14px;min-height:22px;display:flex;align-items:center;gap:12px}
.nt-saved{font-size:11.5px;color:var(--gray-400);margin-left:auto}
.nt-save-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700);
  border-radius:999px;font-family:var(--font);font-size:12.5px;font-weight:600;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .1s}
.nt-save-btn:hover{border-color:var(--navy-light);color:var(--navy);background:var(--navy-pale)}
.nt-save-btn:active{transform:scale(.97)}
.nt-save-btn:disabled{opacity:.6;cursor:default}
.nt-save-btn.ok{background:rgba(22,163,74,.14);border-color:#16a34a;color:#16a34a}
.nt-linkpop{width:280px}
/* Popover "Mover a carpeta" */
.nt-movepop{width:230px;padding:6px}
.nt-move-h{font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--gray-400);padding:6px 8px}
.nt-move-list{display:flex;flex-direction:column;gap:2px;max-height:280px;overflow-y:auto}
.nt-move-opt{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;border:0;background:none;border-radius:8px;cursor:pointer;font-family:var(--font);font-size:13px;color:var(--gray-800);text-align:left;transition:background .12s}
.nt-move-opt:hover{background:var(--gray-100)}
.nt-move-opt.on{background:var(--navy-pale);color:var(--navy);font-weight:600}
.nt-move-dot{width:9px;height:9px;border-radius:50%;flex:0 0 9px;background:var(--gray-300)}
.nt-move-nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nt-move-check{color:var(--navy);font-size:11px;flex:0 0 auto}
/* Móvil: navegación por niveles (lista → editor a pantalla completa), tipo Notion/Evernote */
@media (max-width:860px){
  #pageNotes.active{min-height:0}
  .nt-shell{flex-direction:column;height:calc(100dvh - 52px);min-height:0;position:relative;overflow:hidden}
  /* Carpetas → tira de chips horizontal deslizable, compacta */
  .nt-folders{flex:none;max-height:none;overflow:visible;border-right:0;border-bottom:1px solid var(--gray-100);background:var(--white)}
  .nt-folders .nt-col-head{display:none}
  .nt-folders .nt-folder-list{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;padding:12px;gap:8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nt-folders .nt-folder-list::-webkit-scrollbar{display:none}
  .nt-folders .nt-folder{width:auto;flex:0 0 auto;white-space:nowrap;padding:8px 14px;border:1px solid var(--gray-200);border-radius:999px;background:var(--gray-50)}
  .nt-folders .nt-folder.on{background:var(--navy-pale);border-color:var(--navy-light);box-shadow:none}
  .nt-folders .nt-folder-ct{display:none}
  /* Lista → ocupa el resto de la pantalla, con aire */
  .nt-list{flex:1;min-height:0;max-height:none;border-right:0;border-bottom:0}
  .nt-newnote{padding:12px;font-size:14px}
  .nt-note{padding:13px 14px 13px 16px}
  .nt-note-t{font-size:15px}
  .nt-note-x{font-size:12.5px}
  /* Editor → overlay a pantalla completa que entra deslizando */
  .nt-editor{position:absolute;inset:0;z-index:5;background:var(--white);min-height:0;
    transform:translateX(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);will-change:transform}
  .nt-shell.nt-editing .nt-editor{transform:translateX(0)}
  .nt-shell.nt-editing .nt-folders,.nt-shell.nt-editing .nt-list{visibility:hidden}
  /* Cabecera del editor: volver + acciones arriba, título en su renglón */
  .nt-back{display:inline-flex}
  .nt-doc-head{flex-wrap:wrap;align-items:center;padding:12px 14px 6px;gap:8px}
  .nt-back{order:0;margin-right:auto}
  .nt-doc-head .nt-color-inp,.nt-doc-head .nt-color-btn,.nt-doc-head .nt-todo-btn,.nt-doc-head .nt-ico{order:1}
  .nt-title{order:2;flex:1 1 100%;font-size:21px;padding-top:2px}
  /* Barra de formato en una sola línea deslizable (no wrap apretado) */
  .nt-toolbar{padding:8px 14px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .nt-toolbar::-webkit-scrollbar{display:none}
  .nt-body-wrap{padding:18px 16px 60px}
  .nt-body{font-size:16px}
}
@media (max-width:860px) and (prefers-reduced-motion:reduce){.nt-editor{transition:none}}
[data-theme="dark"] .nt-shell,[data-theme="dark"] .nt-note{background:#161616}
[data-theme="dark"] .nt-folders{background:#121212;border-color:#262626}
[data-theme="dark"] .nt-folder.on,[data-theme="dark"] .nt-note{background:#1c1c1c;border-color:#2a2a2a}
[data-theme="dark"] .nt-ico,[data-theme="dark"] .nt-sel,[data-theme="dark"] .nt-color-inp{background:#1c1c1c;border-color:#333;color:#ccc}
[data-theme="dark"] .nt-search{background:#0f0f0f;border-color:#2a2a2a}
[data-theme="dark"] .nt-title,[data-theme="dark"] .nt-body,[data-theme="dark"] .nt-note-t{color:#eee}
/* Carpetas: chips + barra de carpeta activa */
.notes-folders{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px 16px 0;background:var(--white);flex-shrink:0}
.nf-chip{display:inline-flex;align-items:center;gap:7px;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:999px;padding:6px 12px;font-family:var(--font);font-size:12.5px;font-weight:500;color:var(--gray-700);cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s}
.nf-chip:hover{border-color:var(--navy-light,var(--navy))}
/* Carpeta activa: el color se muestra como halo/glow alrededor, no como relleno */
.nf-chip.active{background:var(--white);border-color:var(--fc,var(--navy));color:var(--gray-900);
  box-shadow:0 0 0 1px var(--fc,var(--navy)),
             0 0 0 4px color-mix(in srgb,var(--fc,var(--navy)) 18%,transparent),
             0 0 12px -3px var(--fc,var(--navy))}
.nf-chip .nf-dot{width:9px;height:9px;border-radius:50%;background:var(--fc,#94a3b8);flex-shrink:0}
.nf-chip.active .nf-dot{box-shadow:0 0 0 3px color-mix(in srgb,var(--fc,var(--navy)) 28%,transparent)}
.nf-add{color:var(--gray-500);border-style:dashed}
[data-theme="dark"] .nf-chip.active{background:#181818;color:#eee}
/* Lápiz para editar la carpeta activa (nombre + color) */
.nf-edit{background:var(--white);border:1px solid var(--gray-200);color:var(--gray-500);width:30px;height:30px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;flex-shrink:0;transition:color .15s,border-color .15s,background .15s}
.nf-edit:hover{color:var(--navy);border-color:var(--navy-light);background:var(--navy-pale)}
[data-theme="dark"] .nf-edit{background:#181818;border-color:#333;color:#bbb}
/* Botón de paleta por nota (muestra/oculta los swatches) */
.note-color{background:none;border:0;color:var(--gray-400);cursor:pointer;padding:5px 7px;border-radius:7px;font-size:12px;transition:color .15s,background .15s}
.note-color:hover{color:var(--navy);background:var(--navy-ghost)}
.note-colors{display:flex;gap:10px;align-items:center;padding:4px 12px 12px;flex-wrap:wrap}
/* Swatch con halo/glow — compartido por carpetas (modal) y notas */
.cm-sw{width:28px;height:28px;border-radius:50%;border:0;cursor:pointer;padding:0;background:var(--sw,#94a3b8);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:11px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);transition:transform .12s cubic-bezier(.23,1,.32,1),box-shadow .18s}
.cm-sw:hover{transform:scale(1.12)}
.cm-sw.on{box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--sw,#94a3b8)}
.cm-none{background:var(--gray-100);color:var(--gray-500);border:1px dashed var(--gray-300)}
.cm-none.on{box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--gray-400)}

/* Selector de color de la nota: botón con punto + popover propio de swatches */
.nt-color-btn{flex:0 0 auto;width:32px;height:32px;padding:0;display:grid;place-items:center;
  border:1px solid var(--gray-200);border-radius:9px;background:var(--white);cursor:pointer;
  transition:border-color .15s,transform .1s cubic-bezier(.23,1,.32,1)}
.nt-color-btn:hover{border-color:var(--navy-light)}
.nt-color-btn:active{transform:scale(.94)}
.nt-color-dot{width:18px;height:18px;border-radius:50%;background:#8b5cf6;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.nt-color-dot.none{background:
  linear-gradient(135deg,transparent 43%,var(--red,#dc2626) 43% 57%,transparent 57%),var(--gray-100)}
.nt-colorpop{position:fixed;z-index:1350;background:var(--white);border:1px solid var(--gray-200);
  border-radius:16px;padding:14px;box-shadow:0 16px 44px rgba(15,23,42,.22);
  animation:fadeIn .14s ease-out}
.nt-colorpop[hidden]{display:none}
.nt-colorpop-t{font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--gray-400);margin:0 0 10px}
.nt-colorpop-sw{display:grid;grid-template-columns:repeat(6,28px);gap:12px 12px}
[data-theme="dark"] .nt-colorpop{background:#181818;border-color:#2a2a2a}
[data-theme="dark"] .nt-color-btn{background:#1c1c1c;border-color:#333}
[data-theme="dark"] .nt-color-dot{box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
/* Modal de carpeta (crear / editar) — por encima del drawer de notas */
.notes-modal{z-index:1300}
.fm-box{background:var(--white);border-radius:var(--r-lg);padding:22px 22px 20px;width:430px;max-width:92vw;box-shadow:0 18px 52px rgba(0,0,0,.28);text-align:left;transform:scale(.94) translateY(14px);transition:transform .3s cubic-bezier(.23,1,.32,1)}
.notes-modal.show .fm-box{transform:none}
.fm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.fm-title{font-size:16px;font-weight:600;color:var(--gray-900)}
.fm-x{background:none;border:0;color:var(--gray-400);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:8px;transition:color .15s,background .15s}
.fm-x:hover{color:var(--gray-700);background:var(--gray-100)}
.fm-label{display:block;font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--gray-400);margin:0 0 8px}
.fm-input{width:100%;box-sizing:border-box;border:1px solid var(--gray-200);border-radius:var(--r-md);padding:10px 12px;font-family:var(--font);font-size:14px;color:var(--gray-900);background:var(--gray-50);outline:none;transition:border-color .15s,box-shadow .15s;margin-bottom:18px}
.fm-input:focus{border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-ghost)}
.fm-colors{display:grid;grid-template-columns:repeat(6,1fr);gap:14px 12px;margin-bottom:22px;justify-items:center}
.fm-foot{display:flex;align-items:center;gap:8px}
.fm-foot-r{display:flex;gap:8px;margin-left:auto}
.fm-del{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid var(--gray-200);color:var(--gray-500);font-size:12.5px;padding:8px 12px;border-radius:var(--r-md);cursor:pointer;font-family:var(--font);transition:color .15s,border-color .15s,background .15s}
.fm-del:hover{color:var(--red);border-color:var(--red);background:var(--red-bg)}
.fm-btn{padding:9px 18px;border-radius:var(--r-md);border:none;font-size:13px;font-weight:500;cursor:pointer;transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;font-family:var(--font)}
.fm-cancel{background:var(--gray-100);color:var(--gray-700)}
.fm-cancel:hover{background:var(--gray-200)}
.fm-save{background:var(--navy);color:#fff}
.fm-save:hover{filter:brightness(1.1)}
/* Selector de lista en "Añadir contacto" (botón +) */
.qc-lists{display:grid;gap:8px;margin-bottom:18px}
.qc-list{display:flex;align-items:center;gap:10px;padding:11px 14px;border:1px solid var(--gray-200);
  border-radius:var(--r-md);background:var(--gray-50);color:var(--gray-700);font-family:var(--font);
  font-size:13.5px;font-weight:500;cursor:pointer;text-align:left;
  transition:border-color .15s,background .15s,color .15s,transform .1s cubic-bezier(.23,1,.32,1)}
.qc-list i{width:18px;text-align:center;color:var(--gray-400)}
.qc-list:hover{border-color:var(--navy-light)}
.qc-list:active{transform:scale(.99)}
.qc-list span{flex:1}
.qc-list .qc-ck{width:auto;margin-left:auto;opacity:0;color:var(--navy);transition:opacity .15s}
.qc-list.on{border-color:var(--navy);background:var(--navy-pale);color:var(--navy)}
.qc-list.on i{color:var(--navy)}
.qc-list.on .qc-ck{opacity:1}
.qc-list:disabled{opacity:.45;cursor:not-allowed}
.qc-list:disabled:hover{border-color:var(--gray-200)}
.qc-note{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--gray-500);margin:0 0 18px;
  padding:9px 12px;border-radius:var(--r-md);background:var(--navy-ghost)}
.qc-note i{color:var(--navy);width:auto}
[data-theme="dark"] .qc-note{background:rgba(255,255,255,.04);color:var(--gray-400)}
[data-theme="dark"] .qc-list{background:#0f0f0f;border-color:#2a2a2a;color:#ccc}
[data-theme="dark"] .qc-list.on{background:var(--navy-pale);border-color:var(--navy);color:var(--navy-light)}
[data-theme="dark"] .fm-box{background:#181818}
[data-theme="dark"] .fm-input{background:#0f0f0f;border-color:#2a2a2a;color:#fff}
[data-theme="dark"] .cm-sw.on{box-shadow:0 0 0 2px #181818,0 0 0 4px var(--sw,#94a3b8)}
.notes-add{display:inline-flex;align-items:center;justify-content:center;gap:8px;align-self:flex-start;
  background:var(--navy-ghost,#f0f4fa);color:var(--navy);border:1px solid var(--navy-pale,#e2ebf8);border-radius:10px;
  padding:10px 14px;font-family:var(--font);font-size:13px;font-weight:500;cursor:pointer;transition:background .15s,transform .12s;margin-bottom:2px}
.notes-add:hover{background:var(--navy-pale,#e2ebf8)}
.notes-add:active{transform:scale(.98)}

/* ── TIMELINE ── */
.timeline-view{display:flex;flex-direction:column}
.tl-day{margin-bottom:20px}
.tl-day-label{
  font-size:11px;font-weight:500;color:var(--gray-400);text-transform:uppercase;
  letter-spacing:.7px;margin-bottom:8px;display:flex;align-items:center;gap:8px;
}
.tl-day-label::after{content:'';flex:1;height:1px;background:var(--gray-100)}
.tl-day-label.today-lbl{color:var(--navy)}
.tl-items{display:flex;flex-direction:column;gap:6px;padding-left:16px;border-left:2px solid var(--gray-100)}
.tl-item{
  display:flex;align-items:flex-start;gap:10px;padding:10px 12px;
  background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-md);
  position:relative;transition:border-color .15s;
}
.tl-item::before{content:'';position:absolute;left:-17px;top:14px;width:8px;height:8px;border-radius:50%;background:var(--gray-300);border:2px solid var(--white)}
.tl-item.ti-today::before{background:var(--navy)}
.tl-item.ti-done::before{background:var(--green)}
.tl-item.ti-done{opacity:.5}
.tl-item.ti-overdue::before{background:var(--red)}
.tl-name{flex:1;font-size:13px;color:var(--gray-700);line-height:1.4}
.tl-name.struck{text-decoration:line-through;color:var(--gray-400)}
.tl-side{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex-shrink:0}

/* ── DRAWERS ── */
.drawer{border:1px solid var(--gray-100);border-radius:var(--r-lg);overflow:hidden;margin-top:16px;box-shadow:var(--shadow-sm)}
.drawer-btn{
  display:flex;align-items:center;gap:8px;width:100%;padding:12px 16px;
  background:var(--gray-50);border:none;font-size:13px;color:var(--gray-500);
  cursor:pointer;text-align:left;transition:background .15s;
}
.drawer-btn:hover{background:var(--gray-100)}
.drawer-btn .arr{margin-left:auto;font-size:13px;transition:transform .2s}
.drawer-btn.open .arr{transform:rotate(180deg)}
.drawer-body{display:none;padding:16px;border-top:1px solid var(--gray-100)}
.drawer-body.open{display:block}
.assign-drawer{border:1px solid var(--amber);border-radius:var(--r-lg);overflow:hidden;margin-top:10px}
.assign-btn{
  display:flex;align-items:center;gap:8px;width:100%;padding:12px 16px;
  background:var(--amber-bg);border:none;font-size:13px;color:var(--amber);
  cursor:pointer;text-align:left;
}
.assign-btn .arr{margin-left:auto;font-size:13px;transition:transform .2s}
.assign-btn.open .arr{transform:rotate(180deg)}
.assign-body{display:none;padding:16px;border-top:1px solid var(--amber);background:white}
.assign-body.open{display:block}

/* ── NUEVO CREADOR DE TAREAS ── */
.form-field{margin-bottom:14px}
.form-label{
  display:block;font-size:11px;font-weight:600;color:var(--gray-500);
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;
}
.form-label-opt{
  font-size:10px;font-weight:400;color:var(--gray-300);
  text-transform:none;letter-spacing:0;margin-left:6px;
}
.form-input{
  width:100%;padding:10px 13px;
  border:1.5px solid var(--gray-200);border-radius:var(--r-md);
  background:var(--white);color:var(--gray-900);
  font-size:14px;font-family:var(--font);outline:none;
  transition:border-color .15s,box-shadow .15s,background-color .15s;
}
.form-input::placeholder{color:var(--gray-300)}
.form-input:hover{border-color:var(--gray-300)}
.form-input:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(26,58,107,.1)}
.form-input[type=date]{cursor:pointer;color:var(--gray-700)}
.form-input[type=date]:not(:focus):invalid{color:var(--gray-300)}

.form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.form-row-2 .form-field{margin-bottom:0}

.prio-group{display:flex;gap:5px}
.prio-pill{
  flex:1;padding:8px 6px;
  background:var(--white);border:1.5px solid var(--gray-200);
  border-radius:var(--r-md);
  font-size:11px;font-weight:500;color:var(--gray-500);
  cursor:pointer;font-family:var(--font);
  display:flex;align-items:center;justify-content:center;gap:5px;
  transition:transform .18s cubic-bezier(.4,0,.2,1),opacity .18s cubic-bezier(.4,0,.2,1),color .18s cubic-bezier(.4,0,.2,1),background-color .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1);
}
.prio-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex-shrink:0;opacity:.5;transition:opacity .15s}
.prio-pill:hover{border-color:var(--gray-300)}
.prio-pill.p-alta:hover .prio-dot{color:var(--red);opacity:.9}
.prio-pill.p-media:hover .prio-dot{color:var(--amber);opacity:.9}
.prio-pill.p-baja:hover .prio-dot{color:var(--green);opacity:.9}
.prio-pill.active{font-weight:600}
.prio-pill.active .prio-dot{opacity:1}
.prio-pill.active.p-alta{background:var(--red-bg);border-color:var(--red);color:var(--red)}
.prio-pill.active.p-media{background:var(--amber-bg);border-color:var(--amber);color:var(--amber)}
.prio-pill.active.p-baja{background:var(--green-bg);border-color:var(--green);color:var(--green)}
.prio-pill:active{transform:scale(.96)}

.multi-assign-wrap{
  display:flex;flex-wrap:wrap;gap:6px;
  padding:8px;border:1.5px solid var(--gray-200);border-radius:var(--r-md);
  background:var(--white);max-height:160px;overflow-y:auto;
}
.multi-assign-wrap:empty::before{
  content:'No hay otros miembros para asignar';
  font-size:12px;color:var(--gray-400);padding:6px;
}
.multi-pill{
  display:inline-flex;align-items:center;gap:7px;
  padding:5px 11px 5px 5px;
  background:var(--white);border:1.5px solid var(--gray-200);
  border-radius:999px;
  font-size:12px;font-weight:500;color:var(--gray-700);
  cursor:pointer;font-family:var(--font);
  transition:transform .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),color .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1),border-color .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1);
}
.multi-pill:hover{border-color:var(--gray-300);background:var(--gray-50)}
.multi-pill-av{
  width:22px;height:22px;border-radius:50%;
  background:var(--gray-100);color:var(--gray-700);
  font-size:10px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;letter-spacing:.3px;
}
.multi-pill.on{background:var(--navy);border-color:var(--navy);color:white}
.multi-pill.on .multi-pill-av{background:rgba(255,255,255,.2);color:white}
.multi-pill:active{transform:scale(.96)}
[data-theme="dark"] .multi-assign-wrap{background:#0f131e;border-color:var(--gray-200)}
[data-theme="dark"] .multi-pill{background:#0f131e;border-color:var(--gray-200);color:var(--gray-700)}
[data-theme="dark"] .multi-pill:hover{background:#1a2238}
[data-theme="dark"] .multi-pill.on{background:var(--navy);border-color:var(--navy);color:#0f131e}
[data-theme="dark"] .multi-pill-av{background:#1a2238;color:var(--gray-700)}
[data-theme="dark"] .multi-pill.on .multi-pill-av{background:rgba(15,19,30,.25);color:#0f131e}

.btn-primary{
  width:100%;padding:12px 16px;
  background:var(--navy);border:none;border-radius:var(--r-md);
  color:white;font-size:14px;font-weight:500;
  font-family:var(--font);cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:4px;
  box-shadow:0 1px 2px rgba(26,58,107,.15);
  transition:transform .18s cubic-bezier(.4,0,.2,1),opacity .18s cubic-bezier(.4,0,.2,1),color .18s cubic-bezier(.4,0,.2,1),background-color .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1);
}
.btn-primary:hover{background:var(--navy-mid);box-shadow:0 4px 14px rgba(26,58,107,.28);transform:translateY(-1px)}
.btn-primary:active{transform:translateY(0) scale(.99);box-shadow:0 1px 2px rgba(26,58,107,.15)}
.btn-primary i{font-size:12px}

[data-theme="dark"] .form-input{background:#0f131e;color:var(--gray-900);border-color:var(--gray-200)}
[data-theme="dark"] .form-input:focus{box-shadow:0 0 0 3px rgba(109,146,216,.18)}
[data-theme="dark"] .prio-pill{background:#0f131e;border-color:var(--gray-200)}
[data-theme="dark"] .prio-pill:not(.active){color:var(--gray-500)}
[data-theme="dark"] .btn-primary{color:#0f131e;background:var(--navy)}
[data-theme="dark"] .btn-primary:hover{background:var(--navy-light)}

@media (max-width:480px){
  .form-row-2{grid-template-columns:1fr;gap:14px;margin-bottom:14px}
  .form-input{font-size:15px;padding:11px 13px}
  .prio-pill{font-size:11px;padding:9px 6px}
  .btn-primary{padding:13px 16px;font-size:14px}
}

/* ── FORM ELEMENTS (legacy, usado por asignar) ── */
.type-tabs{display:flex;gap:6px;margin-bottom:14px}
.type-tab{padding:6px 14px;border-radius:var(--r-md);border:1px solid var(--gray-200);background:white;font-size:12px;color:var(--gray-500);cursor:pointer;transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s}
.type-tab.on{background:var(--navy);border-color:var(--navy);color:white}
.f-row{display:flex;gap:8px;margin-bottom:8px}
.f-inp{flex:1;padding:8px 11px;border:1px solid var(--gray-200);border-radius:var(--r-sm);color:var(--gray-900);font-size:13px;outline:none;background:white;transition:border-color .2s}
.f-inp:focus{border-color:var(--navy)}
.f-inp::placeholder{color:var(--gray-300)}
.f-sel{padding:8px 10px;border:1px solid var(--gray-200);border-radius:var(--r-sm);color:var(--gray-700);font-size:12px;outline:none;background:white}
.f-sel:focus{border-color:var(--navy)}
.add-btn{width:100%;padding:9px;background:var(--navy);border:none;border-radius:var(--r-sm);color:white;font-size:13px;font-weight:500;display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}
.add-btn:hover{background:var(--navy-mid)}
.add-btn.amber{background:var(--amber)}
.add-btn.amber:hover{background:#946b1a}

/* ── OTROS MIEMBROS (acordeón) ── */
.om-list{display:flex;flex-direction:column;gap:8px}
.om-member{background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);overflow:hidden;transition:border-color .15s}
.om-member.open{border-color:var(--navy-pale)}
.om-member-head{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;background:transparent;border:none;cursor:pointer;text-align:left;transition:background .12s}
.om-member-head:hover{background:var(--gray-50)}
.om-av{width:32px;height:32px;border-radius:50%;background:var(--navy-pale);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--navy);flex-shrink:0}
.om-name{flex:1;font-size:13.5px;font-weight:500;color:var(--navy);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.om-count{font-size:11px;font-weight:500;color:var(--gray-500);background:var(--gray-100);padding:3px 10px;border-radius:12px;flex-shrink:0}
.om-member.open .om-count{background:var(--navy-pale);color:var(--navy)}
.om-chev{font-size:11px;color:var(--gray-400);transition:transform .2s;flex-shrink:0}
.om-member.open .om-chev{transform:rotate(180deg)}
.om-body{padding:4px 12px 12px 12px;border-top:1px solid var(--gray-100);display:flex;flex-direction:column;gap:6px}
.om-task{padding:9px 12px;background:var(--gray-50);border-radius:var(--r-md);border:1px solid transparent}
.om-task-name{font-size:13px;font-weight:500;color:var(--navy);margin-bottom:4px}
.om-task-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:11.5px;color:var(--gray-500);align-items:center}
.om-task-meta i{font-size:10px;margin-right:3px}
.om-prio{padding:1px 8px;border-radius:10px;font-size:10.5px;font-weight:500}
.om-prio-alta{background:#fee2e2;color:#b91c1c}
.om-prio-media{background:#fef3c7;color:#92400e}
.om-prio-baja{background:#dcfce7;color:#166534}
.om-assigner{display:inline-flex;align-items:center;color:var(--gray-500)}
.om-assigner-self{color:var(--gray-400);font-style:italic}
.om-empty{padding:16px;text-align:center;color:var(--gray-400);font-size:12.5px}
.om-overdue{color:#b91c1c;font-weight:500}

/* ── EQUIPO ── */
.team-list{display:flex;flex-direction:column;gap:7px}
.team-item{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg)}
.team-av{width:28px;height:28px;border-radius:50%;background:var(--navy-pale);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;color:var(--navy);flex-shrink:0}
.team-name{font-size:13px;color:var(--gray-700);flex:1}
.team-sub{font-size:11px;color:var(--gray-400)}
.team-status{
  font-size:10px;padding:4px 10px;border-radius:12px;font-weight:500;
  display:inline-flex;align-items:center;gap:5px;flex-shrink:0;
}
.team-status i{font-size:9px}
.ts-ok{background:var(--navy-pale);color:var(--navy)}
.ts-pen{background:var(--amber-bg);color:var(--amber)}
.ts-done{background:var(--green-bg);color:var(--green)}
.ts-warn{background:var(--gray-100);color:var(--gray-500)}

.team-del{
  background:none;border:none;color:var(--gray-300);font-size:13px;
  cursor:pointer;padding:6px 9px;border-radius:var(--r-sm);
  transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;flex-shrink:0;
}
.team-del:hover{color:var(--red);background:var(--red-bg)}
.team-edit{
  background:none;border:none;color:var(--gray-300);font-size:12px;
  cursor:pointer;padding:6px 9px;border-radius:var(--r-sm);
  transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;flex-shrink:0;
}
.team-edit:hover{color:var(--navy);background:var(--navy-pale)}

.team-prog-wrap{display:flex;align-items:center;gap:8px;margin-top:7px}
.team-prog-bar{flex:1;height:5px;background:var(--gray-100);border-radius:3px;overflow:hidden;max-width:160px}
.team-prog-fill{height:100%;background:var(--navy);border-radius:3px;transition:width .35s ease}
.team-prog-lbl{font-size:10px;color:var(--gray-400);font-family:var(--mono)}

/* ── REMINDER BANNER ── */
.reminder{
  display:flex;align-items:center;gap:12px;
  background:var(--navy-pale);border:1px solid var(--navy-light);
  border-radius:var(--r-lg);padding:14px 18px;margin-bottom:18px;
}
.reminder-icon{width:36px;height:36px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;color:white;font-size:15px;flex-shrink:0}
.reminder-txt{flex:1;font-size:12px;color:var(--navy)}
.reminder-close{background:none;border:none;color:var(--navy-light);font-size:16px;cursor:pointer}

/* ── TOAST ── */
.toast{
  position:fixed;bottom:22px;right:22px;background:#22314f;color:#fff;
  border-radius:999px;padding:10px 16px;font-size:13px;font-weight:500;z-index:2600;
  width:max-content;max-width:min(90vw,480px);
  transform:translateY(60px);opacity:0;transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .25s;
  display:inline-flex;align-items:center;gap:9px;box-shadow:var(--shadow-md);
}
.toast.show{transform:translateY(0);opacity:1}
.toast .toast-ico{flex:none;font-size:15px}
.toast-code{font-family:var(--mono);font-size:11px;padding:2px 8px;border-radius:7px;
  background:rgba(255,255,255,.20);letter-spacing:.02em;white-space:nowrap}
.toast-report{
  flex:none;display:inline-flex;align-items:center;gap:5px;cursor:pointer;
  border:0;border-radius:999px;padding:5px 12px;font-family:var(--font);font-size:12px;font-weight:600;
  background:rgba(255,255,255,.22);color:inherit;transition:background .15s,transform .12s;
}
.toast-report:hover{background:rgba(255,255,255,.34)}
.toast-report:active{transform:scale(.96)}
/* Copiar / cerrar de la píldora de error */
.toast-ico-btn{flex:none;display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:50%;
  cursor:pointer;background:rgba(255,255,255,.18);color:inherit;font-size:12px;
  transition:background .15s,transform .12s}
.toast-ico-btn:hover{background:rgba(255,255,255,.34)}
.toast-ico-btn:active{transform:scale(.94)}
@media (max-width:768px){ .toast-ico-btn{width:36px;height:36px;font-size:14px} }
/* Tipos (bloques autocontenidos: fondo y texto explícitos → legibles en claro y oscuro) */
.toast.t-success{background:#16a34a;color:#fff}
.toast.t-info{background:#22314f;color:#fff}
.toast.t-warn{background:#e8a90a;color:#241c00}
.toast.t-error{background:#dc2626;color:#fff}
.toast.t-warn .toast-code,.toast.t-warn .toast-report{background:rgba(0,0,0,.15)}
.toast.t-warn .toast-report:hover{background:rgba(0,0,0,.24)}

/* Snackbar "Deshacer" (borrado por swipe) */
#undoBar{
  position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(14px);
  z-index:200;display:flex;align-items:center;gap:14px;
  background:#1a1f2e;color:#fff;padding:11px 12px 11px 18px;border-radius:12px;
  font-size:13px;box-shadow:0 12px 34px rgba(0,0,0,.3);
  opacity:0;visibility:hidden;pointer-events:none;max-width:calc(100vw - 28px);
  transition:opacity .2s ease,transform .3s cubic-bezier(.23,1,.32,1),visibility 0s linear .3s;
}
#undoBar.show{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
  transition:opacity .2s ease,transform .3s cubic-bezier(.23,1,.32,1),visibility 0s}
#undoBarBtn{background:none;border:none;color:#7ba7ff;font-weight:600;font-size:13px;
  cursor:pointer;font-family:var(--font);padding:5px 8px;border-radius:7px;flex-shrink:0}
#undoBarBtn:hover{background:rgba(255,255,255,.12)}
@media (prefers-reduced-motion:reduce){
  #undoBar{transition:opacity .15s ease,visibility 0s linear .15s;transform:translateX(-50%)}
  #undoBar.show{transform:translateX(-50%)}
}

/* ── TRIGGER "NUEVA TAREA" + MODAL ── */
.new-task-btn{
  display:flex;align-items:center;justify-content:center;gap:9px;
  width:100%;padding:14px 18px;margin-top:16px;
  background:var(--navy);border:none;border-radius:var(--r-md);
  color:white;font-size:14px;font-weight:500;
  font-family:var(--font);cursor:pointer;
  box-shadow:0 2px 8px rgba(26,58,107,.18);
  transition:transform .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),background-color .2s cubic-bezier(.4,0,.2,1),border-color .2s cubic-bezier(.4,0,.2,1),box-shadow .2s cubic-bezier(.4,0,.2,1);
}
.new-task-btn:hover{
  background:var(--navy-mid);
  box-shadow:0 6px 20px rgba(26,58,107,.32);
  transform:translateY(-1px);
}
.new-task-btn:active{transform:translateY(0) scale(.99);box-shadow:0 1px 3px rgba(26,58,107,.18)}
.new-task-btn i{font-size:12px}

.task-modal-box{
  background:var(--white);border-radius:var(--r-xl);
  width:480px;max-width:calc(100% - 28px);
  max-height:calc(100vh - 48px);overflow:auto;
  box-shadow:0 24px 60px rgba(0,0,0,.32);
  /* Modal canónico: escala desde el centro + fade, una sola curva y duración */
  transform:scale(.96);opacity:0;
  transition:transform .2s cubic-bezier(.23,1,.32,1),opacity .2s cubic-bezier(.23,1,.32,1);
  will-change:transform,opacity;
}
.task-modal-backdrop.show .task-modal-box{transform:scale(1);opacity:1}
/* Fondo (solo atenúa; sin desenfoque animado — evita repintar el blur en cada frame) */
.task-modal-backdrop{transition:opacity .18s ease,visibility 0s linear .18s}
.task-modal-backdrop.show{transition:opacity .18s ease,visibility 0s linear 0s}
.task-modal-head{
  display:flex;align-items:center;
  padding:18px 22px 6px;
}
.task-modal-title{
  flex:1;font-size:17px;font-weight:500;color:var(--gray-900);
}
.task-modal-close{
  background:none;border:none;cursor:pointer;
  color:var(--gray-400);font-size:14px;
  padding:7px 9px;border-radius:var(--r-sm);
  transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;font-family:var(--font);
}
.task-modal-close:hover{color:var(--red);background:var(--red-bg)}
.task-modal-tabs{
  display:flex;gap:6px;padding:8px 22px 14px;
}
.task-modal-tabs .type-tab{
  flex:1;padding:9px 12px;
  display:flex;align-items:center;justify-content:center;
}
.task-modal-body{padding:0 22px 22px}

[data-theme="dark"] .task-modal-box{background:#1a2238}
[data-theme="dark"] .task-modal-close:hover{background:rgba(232,123,106,.18);color:#e87b6a}

@media (max-width:480px){
  .task-modal-box{border-radius:var(--r-lg);width:calc(100% - 20px)}
  .task-modal-head{padding:16px 18px 4px}
  .task-modal-tabs{padding:8px 18px 12px}
  .task-modal-body{padding:0 18px 20px}
}

/* ── MODAL CONFIRMACIÓN ── */
.modal-backdrop{
  position:fixed;inset:0;background:rgba(11,30,61,.55);
  align-items:center;justify-content:center;
  z-index:300;display:flex;
  opacity:0;visibility:hidden;
  transition:opacity .25s ease,visibility 0s linear .25s;
}
.modal-backdrop.show{
  opacity:1;visibility:visible;
  transition:opacity .25s ease,visibility 0s linear 0s;
}
.modal-box{
  background:white;border-radius:var(--r-lg);padding:28px;
  width:380px;max-width:90vw;box-shadow:0 16px 48px rgba(0,0,0,.3);
  text-align:center;
  transform:scale(.92) translateY(20px);
  transition:transform .35s cubic-bezier(.23,1,.32,1);
}
.modal-backdrop.show .modal-box{transform:scale(1) translateY(0)}
.modal-icon{
  width:48px;height:48px;border-radius:50%;background:var(--red-bg);
  color:var(--red);display:flex;align-items:center;justify-content:center;
  font-size:20px;margin:0 auto 14px;
}
.modal-title{font-size:16px;font-weight:500;color:var(--gray-900);margin-bottom:6px}
.modal-msg{font-size:13px;color:var(--gray-500);margin-bottom:22px;line-height:1.5;word-break:break-word}
.modal-actions{display:flex;gap:8px;justify-content:center}
.modal-btn{padding:9px 22px;border-radius:var(--r-sm);border:none;font-size:13px;font-weight:500;cursor:pointer;transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;font-family:var(--font)}
.modal-cancel{background:var(--gray-100);color:var(--gray-700)}
.modal-cancel:hover{background:var(--gray-200)}
.modal-ok{background:var(--red);color:white}
.modal-ok:hover{background:#9b2d22}
/* Confirmación NO destructiva (registrar, restaurar, reabrir…): el rojo de
   peligro ahí asusta sin motivo. La clase la pone showConfirm según la
   etiqueta del botón. */
#confirmModal.confirm-ok-safe .modal-icon{background:var(--navy-pale);color:var(--navy)}
#confirmModal.confirm-ok-safe .modal-ok{background:var(--navy);color:var(--white)}
#confirmModal.confirm-ok-safe .modal-ok:hover{background:var(--navy-dark);box-shadow:0 4px 12px rgba(26,58,107,.3)}
/* ── Detalle de tarea (panel grande para leer descripción + actuar) ── */
.td-box{width:min(560px,94vw);max-height:86vh;overflow-y:auto;text-align:left;padding:0}
.td-head{display:flex;align-items:flex-start;gap:12px;padding:20px 22px 10px;position:sticky;top:0;background:var(--white);z-index:1}
.td-title{flex:1;font-size:19px;font-weight:600;color:var(--gray-900);line-height:1.3;word-break:break-word}
.td-x{flex:0 0 auto;width:32px;height:32px;border:0;background:var(--gray-100);color:var(--gray-500);border-radius:9px;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.td-x:hover{background:var(--gray-200);color:var(--gray-900)}
.td-meta{display:flex;flex-wrap:wrap;gap:6px;padding:0 22px 14px}
.td-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--gray-600);background:var(--gray-50);border:1px solid var(--gray-100);border-radius:999px;padding:4px 10px}
.td-chip.od{color:var(--red);border-color:var(--red)}
.td-status{padding:0 22px 6px}
.td-label{font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--gray-400);margin-bottom:7px}
.td-prog{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--gray-600)}
.td-prog-bar{flex:1;height:8px;background:var(--gray-100);border-radius:6px;overflow:hidden}
.td-prog-fill{height:100%;background:var(--navy);border-radius:6px}
.td-desc{padding:14px 22px 6px}
.td-desc-body{font-size:14.5px;line-height:1.65;color:var(--gray-800);word-break:break-word}
.td-empty{font-size:13px;color:var(--gray-400);font-style:italic}
/* Detalle de progreso (design 4b): ritmo + bitácora */
.td-pace{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;padding:10px 13px;background:var(--navy-ghost);border-radius:var(--r-md);font-size:13px;color:var(--navy)}
.td-pace i{font-size:12px;opacity:.8}
.td-pace-n{font-family:var(--mono);font-size:15px;font-weight:600}
.td-pace-sub{color:var(--navy);opacity:.7}
.td-pace-late{background:var(--red-bg);color:var(--red)}
[data-org="mvp"] .td-pace{background:var(--amber-bg);color:var(--amber)}
[data-org="mvp"] .td-pace-sub{color:var(--amber)}
.td-log{display:flex;flex-direction:column;gap:2px}
.td-log-row{display:flex;gap:11px;align-items:flex-start;padding:8px 2px;border-bottom:1px solid var(--gray-100)}
.td-log-row:last-child{border-bottom:0}
.td-log-n{flex:none;min-width:34px;text-align:center;font-family:var(--mono);font-size:12px;font-weight:600;color:var(--green);background:var(--green-bg);border-radius:999px;padding:2px 8px}
.td-log-n.neg{color:var(--red);background:var(--red-bg)}
.td-log-body{flex:1;min-width:0}
.td-log-note{font-size:13.5px;color:var(--gray-800);line-height:1.45}
.td-log-date{font-size:11.5px;color:var(--gray-400);margin-top:1px}
.td-log-add{display:flex;gap:6px;margin-top:12px;align-items:center;flex-wrap:wrap}
.td-log-in-n{width:56px;flex:none;padding:8px 9px;border:1px solid var(--gray-200);border-radius:var(--r-sm);font-size:13px;text-align:center;outline:none;background:var(--white);color:var(--gray-900)}
.td-log-in-note{flex:1;min-width:120px;padding:8px 11px;border:1px solid var(--gray-200);border-radius:var(--r-sm);font-size:13px;outline:none;background:var(--white);color:var(--gray-900)}
.td-log-in-n:focus,.td-log-in-note:focus{border-color:var(--navy)}
.td-log-btn{flex:none;display:inline-flex;align-items:center;gap:6px;border:0;background:var(--navy);color:var(--white);font:500 13px var(--font);padding:8px 13px;border-radius:var(--r-sm);cursor:pointer;transition:filter .12s,transform .1s}
.td-log-btn:hover{filter:brightness(1.08)}
.td-log-btn:active{transform:scale(.97)}
[data-org="mvp"] .td-log-btn{background:var(--amber)}
/* Línea de ritmo en el modal de alta (design 4c ligero) */
.p-pace-hint{display:flex;align-items:center;gap:8px;margin:2px 0 14px;padding:9px 12px;background:var(--navy-ghost);border-radius:var(--r-md);font-size:12.5px;color:var(--navy);line-height:1.4}
.p-pace-hint[hidden]{display:none}
.p-pace-hint i{font-size:12px;opacity:.8}
[data-org="mvp"] .p-pace-hint{background:var(--amber-bg);color:var(--amber)}
.td-actions{display:flex;gap:8px;padding:14px 22px 20px;flex-wrap:wrap;justify-content:flex-end}
/* Guardar: acción primaria (texto var(--white) → oscuro en dark, contrasta sobre el acento) */
.td-btn-save{background:var(--navy);border-color:var(--navy);color:var(--white)}
.td-btn-save:hover{filter:brightness(1.06)}
.td-btn-save:active{transform:scale(.97)}
.td-btn-edit{background:var(--navy-pale);color:var(--navy)}
.td-btn-edit:hover{background:var(--navy);color:#fff}
.td-btn-del{background:var(--red-bg,rgba(224,49,49,.12));color:var(--red)}
.td-btn-del:hover{background:var(--red);color:#fff}
/* Estatus del detalle: píldora segmentada (como las tablas), color por estado */
.tds-seg{width:100%}
.tds-seg .seg-btn{flex:1}
.tds-seg[data-st="pending"] .seg-ind{background:var(--gray-400)}
.tds-seg[data-st="progress"] .seg-ind{background:#c88a04}
.tds-seg[data-st="done"] .seg-ind{background:#16a34a}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ── DROPDOWN MENU ── */
.settings-pop{
  /* fixed (no absolute): el menú queda pegado al viewport bajo el botón del
     header sticky, así no se "pierde" al abrirlo con la página scrolleada. */
  position:fixed;top:62px;right:14px;
  /* Fondo glass: translúcido + blur del contenido detrás */
  background:rgba(255,255,255,.80);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  backdrop-filter:blur(14px) saturate(160%);
  border-radius:16px;
  border:1px solid rgba(255,255,255,.6);
  /* Sombra en capas: contacto + elevación (sin la sombra plana anterior) */
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset,
             0 18px 44px -12px rgba(15,23,42,.32),
             0 6px 14px -8px rgba(15,23,42,.18);
  padding:6px;width:280px;z-index:50;
  /* Nunca se sale de la pantalla: altura acotada + scroll interno */
  max-height:calc(100vh - 76px);
  max-height:calc(100dvh - 76px);
  overflow-y:auto;overscroll-behavior:contain;
  transform-origin:top right;
  opacity:0;visibility:hidden;
  transform:scale(.96) translateY(-6px);
  /* ease-out fuerte, sin rebote; salida un poco más rápida que entrada */
  transition:opacity .16s cubic-bezier(.23,1,.32,1),
             transform .18s cubic-bezier(.23,1,.32,1),
             visibility 0s linear .18s;
}
.settings-pop.show{
  opacity:1;visibility:visible;
  transform:scale(1) translateY(0);
  transition:opacity .2s cubic-bezier(.23,1,.32,1),
             transform .26s cubic-bezier(.23,1,.32,1),
             visibility 0s linear 0s;
}
/* Navegadores sin backdrop-filter: fondo sólido para conservar contraste */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .settings-pop{background:#fff;border-color:var(--gray-100)}
}
/* Stagger sutil de los ítems al abrir (cascada breve, premium) */
.settings-pop.show > *{animation:settingsItemIn .26s cubic-bezier(.23,1,.32,1) backwards}
.settings-pop.show > *:nth-child(1){animation-delay:.02s}
.settings-pop.show > *:nth-child(2){animation-delay:.05s}
.settings-pop.show > *:nth-child(3){animation-delay:.08s}
.settings-pop.show > *:nth-child(4){animation-delay:.11s}
.settings-pop.show > *:nth-child(5){animation-delay:.13s}
.settings-pop.show > *:nth-child(n+6){animation-delay:.15s}
@keyframes settingsItemIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
  .settings-pop{transition:opacity .12s ease,visibility 0s linear .12s;transform:none}
  .settings-pop.show{transform:none;transition:opacity .12s ease,visibility 0s linear 0s}
  .settings-pop.show > *{animation:none}
}

.settings-userhead{
  display:flex;align-items:center;gap:10px;padding:10px 10px 8px;
}
.settings-userhead-av{
  width:36px;height:36px;border-radius:50%;background:var(--navy-pale);
  color:var(--navy);font-size:12px;font-weight:500;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.settings-userhead-name{font-size:13px;font-weight:500;color:var(--gray-900);line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.settings-userhead-role{font-size:10px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.settings-userhead-namewrap{display:flex;align-items:center;gap:6px;min-width:0}
.settings-userhead-namewrap .settings-userhead-name{flex:1;min-width:0}
.settings-userhead-edit{
  background:none;border:none;cursor:pointer;color:var(--gray-400);
  padding:3px 5px;border-radius:4px;font-size:11px;line-height:1;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  opacity:0;transition:opacity .15s,background .15s,color .15s;
}
.settings-userhead:hover .settings-userhead-edit{opacity:1}
.settings-userhead-edit:hover{background:var(--navy-pale);color:var(--navy)}
.settings-userhead-input{
  font-size:13px;font-weight:500;color:var(--gray-900);line-height:1.3;
  background:white;border:1px solid var(--navy);border-radius:4px;
  padding:3px 6px;width:100%;outline:none;font-family:inherit;box-sizing:border-box;
}
[data-theme="dark"] .settings-userhead-input{background:#1a1a1a;color:#e8eef7;border-color:var(--navy-light)}
[data-theme="dark"] .settings-userhead-edit:hover{background:rgba(93,143,245,.18);color:var(--navy-light)}

.settings-sep{height:1px;background:var(--gray-100);margin:4px 0}

.settings-h{font-size:10px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.6px;padding:8px 10px 4px}

.settings-row{display:flex;align-items:center;gap:10px;cursor:pointer;padding:9px 10px;border-radius:var(--r-sm);transition:background .15s}
.settings-row:hover{background:var(--gray-50)}
.settings-row-lbl{font-size:13px;color:var(--gray-700);font-weight:500}
.settings-row-sub{font-size:11px;color:var(--gray-400);margin-top:2px;line-height:1.4}

/* Preferencias plegables (acordeón) */
.settings-prefs-toggle{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;
  padding:9px 10px;border-radius:var(--r-sm);cursor:pointer;font-family:var(--font);
  font-size:13px;font-weight:500;color:var(--gray-700);transition:background .15s}
.settings-prefs-toggle:hover{background:var(--gray-50)}
.settings-prefs-toggle > span{flex:1;text-align:left}
.settings-prefs-toggle > i:first-child{width:15px;text-align:center;color:var(--gray-400);font-size:13px}
.settings-prefs-chev{font-size:11px;color:var(--gray-400);transition:transform .25s cubic-bezier(.4,0,.2,1)}
.settings-prefs-toggle[aria-expanded="true"] .settings-prefs-chev{transform:rotate(180deg)}
.settings-prefs-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s cubic-bezier(.4,0,.2,1)}
.settings-prefs-wrap.open{grid-template-rows:1fr}
.settings-prefs-inner{overflow:hidden;min-height:0}
@media (prefers-reduced-motion:reduce){.settings-prefs-wrap,.settings-prefs-chev{transition:none}}

/* Toggle switch animado */
.toggle{position:relative;display:inline-block;width:36px;height:20px;flex-shrink:0}
.toggle input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.toggle-track{
  position:absolute;inset:0;background:var(--gray-200);border-radius:11px;
  transition:background .3s cubic-bezier(.4,0,.2,1);
}
.toggle-track::after{
  content:'';position:absolute;top:2px;left:2px;
  width:16px;height:16px;background:var(--white);border-radius:50%;
  box-shadow:0 1px 3px rgba(0,0,0,.25),0 0 0 .5px rgba(0,0,0,.05);
  transition:transform .3s cubic-bezier(.23,1,.32,1),background .25s;
}
.toggle input:checked + .toggle-track{background:var(--navy)}
.toggle input:checked + .toggle-track::after{transform:translateX(16px)}
.toggle:hover .toggle-track{box-shadow:0 0 0 4px rgba(26,58,107,.08)}
.toggle:active .toggle-track::after{width:18px}

.settings-reminder-cfg{
  padding:6px 10px 12px;display:none;
  animation:fadeIn .25s ease;
}
.settings-reminder-cfg.show{display:block}
.reminder-cfg-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0}
.reminder-cfg-lbl{font-size:12px;color:var(--gray-500);font-weight:500;flex-shrink:0}
.reminder-cfg-sel{
  flex:1;max-width:180px;padding:7px 28px 7px 11px;
  border:1.5px solid var(--gray-200);border-radius:var(--r-sm);
  font-size:12px;color:var(--gray-700);background:var(--white) url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239aa3b5' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  font-family:var(--font);cursor:pointer;outline:none;
  appearance:none;-webkit-appearance:none;
  transition:border-color .15s;
}
.reminder-cfg-sel:hover{border-color:var(--gray-300)}
.reminder-cfg-sel:focus{border-color:var(--navy)}
.reminder-cfg-note{
  font-size:10.5px;color:var(--gray-400);
  margin-top:8px;padding:8px 10px;
  background:var(--gray-50);border-radius:var(--r-sm);
  display:flex;align-items:flex-start;gap:7px;line-height:1.4;
}
.reminder-cfg-note i{font-size:11px;margin-top:1px;color:var(--gray-400);flex-shrink:0}

[data-theme="dark"] .reminder-cfg-sel{background-color:#0f131e;color:var(--gray-700)}
[data-theme="dark"] .reminder-cfg-note{background:rgba(255,255,255,.04)}

.settings-action{
  display:flex;align-items:center;gap:11px;width:100%;
  padding:9px 10px;background:transparent;border:none;
  font-family:var(--font);cursor:pointer;text-align:left;
  border-radius:var(--r-sm);transition:background .15s;
}
.settings-action:hover{background:var(--gray-50)}
.settings-action:disabled{opacity:.6;cursor:not-allowed}
.role-switch{display:flex;gap:6px;padding:2px 10px 4px}
.role-switch-btn{flex:1;padding:7px 6px;border:1.5px solid var(--gray-200,#e0e3eb);background:var(--white,#fff);border-radius:8px;font-size:12px;font-weight:600;color:var(--gray-500,#667);cursor:pointer;font-family:var(--font)}
.role-switch-btn:hover{border-color:var(--navy);color:var(--navy)}
.role-switch-btn.on{background:var(--navy);border-color:var(--navy);color:#fff}
.role-switch-note{font-size:10.5px;color:var(--gray-400,#889);padding:4px 10px 6px;line-height:1.45}
[data-theme="dark"] .role-switch-btn{background:rgba(255,255,255,.05)}
/* Toggle de idioma ES/EN en ajustes */
.lang-switch{display:inline-flex;gap:2px;background:var(--gray-100);border-radius:8px;padding:2px;flex-shrink:0}
.lang-btn{border:0;background:transparent;padding:6px 12px;border-radius:6px;font-size:12px;font-weight:600;color:var(--gray-500);cursor:pointer;font-family:var(--mono);letter-spacing:.5px;transition:color .15s,background .15s}
.lang-btn.active{background:var(--navy);color:#fff}
[data-theme="dark"] .lang-switch{background:rgba(255,255,255,.06)}
.settings-action > i{
  width:32px;height:32px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--navy-pale);color:var(--navy);border-radius:50%;
  font-size:12px;
}
.settings-action.sending > i{animation:spin 1s linear infinite}
[data-theme="dark"] .settings-action:hover{background:rgba(255,255,255,.05)}
[data-theme="dark"] .settings-action > i{background:rgba(109,146,216,.18);color:var(--navy-light)}

.settings-logout{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:11px 12px;background:var(--red-bg);border:1px solid transparent;
  font-size:13px;font-weight:600;color:var(--red);cursor:pointer;font-family:var(--font);
  border-radius:var(--r-md);transition:transform .18s cubic-bezier(.4,0,.2,1),opacity .18s cubic-bezier(.4,0,.2,1),color .18s cubic-bezier(.4,0,.2,1),background-color .18s cubic-bezier(.4,0,.2,1),border-color .18s cubic-bezier(.4,0,.2,1),box-shadow .18s cubic-bezier(.4,0,.2,1);text-align:left;
}
.settings-logout:hover{background:var(--red);color:white;border-color:var(--red);box-shadow:0 3px 10px rgba(192,57,43,.28)}
.settings-logout:active{transform:scale(.98)}
.settings-logout i{font-size:12px;width:14px}

/* small inline btns */
.sm-btn{padding:3px 9px;font-size:10px;border-radius:var(--r-sm);border:none;cursor:pointer;transition:transform .15s cubic-bezier(.4,0,.2,1),opacity .15s cubic-bezier(.4,0,.2,1),color .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1),border-color .15s cubic-bezier(.4,0,.2,1),box-shadow .15s cubic-bezier(.4,0,.2,1)}
.sm-btn:active{transform:scale(.94)}
.sm-navy{background:var(--navy-pale);color:var(--navy)}
.sm-navy:hover{background:#d8e2f2}
.sm-red{background:var(--red-bg);border:1px solid var(--red);color:var(--red)}
.sm-red:hover{background:#f8d8d3}
.sm-solid{background:var(--navy);color:white}
.sm-solid:hover{background:var(--navy-mid)}

/* ═══════════════════════════════════════════
   HAMBURGUESA + NAV DRAWER
═══════════════════════════════════════════ */
.hamburger,.header-back{
  background:none;border:none;color:white;cursor:pointer;
  padding:8px 10px;border-radius:var(--r-sm);
  display:flex;align-items:center;justify-content:center;font-size:15px;
  transition:background .15s,transform .15s;
}
.hamburger:hover,.header-back:hover{background:rgba(255,255,255,.12)}
.hamburger:active,.header-back:active{transform:scale(.94)}
.header-back{animation:fadeIn .2s ease}

.nav-backdrop{
  position:fixed;inset:0;background:rgba(11,30,61,.34);
  z-index:90;opacity:0;pointer-events:none;
  transition:opacity .24s ease;   /* solo opacidad — sin filtros = máximo rendimiento */
}
.nav-backdrop.show{opacity:1;pointer-events:auto}

/* Panel sólido y limpio: se DESLIZA solo con transform (GPU) = fluido, sin
   filtros que repinten. Curva iOS, corto. */
.nav-drawer{
  position:fixed;top:0;left:0;bottom:0;width:284px;
  background:var(--white);
  border-right:1px solid var(--gray-100);
  box-shadow:8px 0 40px rgba(15,23,42,.14);
  z-index:100;transform:translateX(-100%);
  transition:transform .28s cubic-bezier(.32,.72,0,1);
  will-change:transform;
  display:flex;flex-direction:column;
}
.nav-drawer.open{transform:translateX(0)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .nav-drawer{background:var(--white)}
}

.nav-head{
  padding:22px 22px 14px;border-bottom:1px solid rgba(15,23,42,.08);
  background:transparent;
}
.nav-logo{width:140px;max-width:100%;display:block}

.nav-list{display:flex;flex-direction:column;gap:3px;padding:14px 10px;flex:1}
.nav-item{
  display:flex;align-items:center;gap:11px;
  padding:11px 14px;background:transparent;border:none;
  font-size:14px;color:var(--gray-700);cursor:pointer;
  border-radius:var(--r-md);font-family:var(--font);text-align:left;
  transition:background .15s,color .15s;
}
.nav-item i{width:18px;color:var(--gray-400);font-size:14px;transition:color .15s}
.nav-item:hover{background:rgba(15,23,42,.05)}
.nav-item:hover i{color:var(--navy)}
.nav-item.active{background:var(--navy-pale);color:var(--navy);font-weight:500}
.nav-item.active i{color:var(--navy)}

.nav-sep{height:1px;background:var(--gray-100);margin:4px 14px}
.nav-item-foot{margin:4px 10px 12px;color:var(--gray-500)}
.nav-item-foot i{color:var(--gray-400)}
[data-theme="dark"] .nav-sep{background:var(--gray-200)}
/* "Usuarios" sin duplicar por viewport: móvil (≤768px) → solo en el nav izquierdo;
   PC (>768px) → solo en el menú de perfil (derecha). Ambos siguen siendo admin-only. */
@media (min-width:769px){ #navList .nav-item[data-view="usuarios"]{display:none} }
@media (max-width:768px){ #usersBtn,#usersSep{display:none} }

.nav-footer{padding:14px 18px;border-top:1px solid rgba(15,23,42,.08);text-align:right}
.nav-close{
  background:none;border:none;color:var(--gray-400);cursor:pointer;
  padding:6px 10px;border-radius:var(--r-sm);font-size:14px;
  transition:background .15s,color .15s;
}
.nav-close:hover{background:var(--gray-100);color:var(--gray-700)}

[data-theme="dark"] .nav-drawer{background:#1a2238;border-right-color:rgba(255,255,255,.08)}
[data-theme="dark"] .nav-head{background:transparent;border-color:rgba(255,255,255,.09)}
[data-theme="dark"] .nav-item:hover{background:rgba(255,255,255,.06)}
[data-theme="dark"] .nav-item.active{background:rgba(109,146,216,.2)}
[data-theme="dark"] .nav-footer{border-top-color:rgba(255,255,255,.09)}
[data-theme="dark"] .nav-backdrop{background:rgba(0,0,0,.5)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  [data-theme="dark"] .nav-drawer{background:#1a2238}
}
@media (prefers-reduced-motion:reduce){.nav-drawer{transition:transform .18s ease}}

/* ═══════════════════════════════════════════
   SELECTOR DE EMPRESA — landing pre-home
═══════════════════════════════════════════ */
.page-selector{display:none}
.page-selector.active{display:block;animation:fadeIn .3s ease}
/* Selector en modo oscuro: fondo totalmente negro (solo esta pantalla) */
[data-theme="dark"]:has(#pageSelector.active),
[data-theme="dark"] body:has(#pageSelector.active){background:#000}
[data-theme="dark"] body:has(#pageSelector.active) .header{background:#000;border-bottom-color:#151515}

.selector-hero{text-align:center;padding:24px 22px 30px;margin-bottom:14px}
.selector-greeting{font-size:24px;font-weight:500;color:var(--navy);margin-bottom:6px;letter-spacing:-.3px}
.selector-question{font-size:14px;color:var(--gray-500)}

.selector-cards{
  display:flex;flex-wrap:wrap;justify-content:center;gap:18px;
  margin:0 auto;max-width:560px;
}
.selector-card{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:16px;
  width:230px;height:230px;padding:24px 18px;
  background:var(--white);border:1px solid var(--gray-100);
  border-radius:var(--r-xl);
  cursor:pointer;font-family:var(--font);text-align:center;
  transition:transform .25s cubic-bezier(.4,0,.2,1),box-shadow .25s,border-color .15s;
  position:relative;
}
.selector-card:hover{transform:translateY(-5px);border-color:transparent}
.selector-card:active{transform:translateY(-1px)}

.sel-cretum:hover{box-shadow:0 14px 38px rgba(26,58,107,.28)}
.sel-mvp:hover{box-shadow:0 14px 38px rgba(237,120,36,.32)}

.selector-card-logo{
  height:auto; /* los <img> traen width/height intrínsecos para reservar espacio (CLS); el alto lo da la proporción */
  width:96px;max-height:64px;object-fit:contain;
  /* Hover crujiente: ease-out fuerte y rápido (antes era un rebote lento de .35s) */
  transition:transform .22s cubic-bezier(.23,1,.32,1),filter .26s cubic-bezier(.23,1,.32,1);
  will-change:transform;
}
/* Logo alterno por tema: claro por defecto, versión oscura en modo oscuro */
.selector-card-logo.sel-logo-dark{display:none}
[data-theme="dark"] .selector-card-logo.sel-logo-light{display:none}
[data-theme="dark"] .selector-card-logo.sel-logo-dark{display:inline}
/* Cretum en oscuro es el mosaico horizontal: tamaño similar al ícono original */
.sel-cretum-word{width:auto;max-width:112px;max-height:46px}
/* Sin halo en reposo: el glow solo aparece en hover (abajo) */
.sel-cretum .selector-card-logo,
.sel-mvp .selector-card-logo{filter:none}
/* Escala/lift + glow solo con mouse real (sin falso hover al tocar en táctil) */
@media (hover:hover) and (pointer:fine){
  .selector-card:hover .selector-card-logo{transform:scale(1.12) translateY(-3px)}
  .selector-card:active .selector-card-logo{transform:scale(1.05) translateY(-1px)}
  .sel-cretum:hover .selector-card-logo{filter:drop-shadow(0 0 32px rgba(61,125,240,.75)) drop-shadow(0 0 10px rgba(61,125,240,.55))}
  .sel-mvp:hover .selector-card-logo{filter:drop-shadow(0 0 30px rgba(237,120,36,.65)) drop-shadow(0 0 8px rgba(237,120,36,.45))}
}
@media (prefers-reduced-motion:reduce){
  .selector-card-logo{transition:filter .2s ease}
  .selector-card:hover .selector-card-logo,
  .selector-card:active .selector-card-logo{transform:none}
}

.selector-card-name{font-size:22px;font-weight:500;letter-spacing:-.2px;line-height:1.1}
.sel-cretum .selector-card-name{color:#1a3a6b}
.sel-mvp .selector-card-name{color:#ED7824}

.selector-card-sub{font-size:11px;letter-spacing:1.4px;text-transform:uppercase;font-weight:500}
.sel-cretum .selector-card-sub{color:rgba(26,58,107,.55)}
.sel-mvp .selector-card-sub{color:rgba(237,120,36,.7)}

[data-theme="dark"] .selector-card{background:#151515;border-color:#262626}
[data-theme="dark"] .sel-cretum .selector-card-name{color:#7ba8ff}
[data-theme="dark"] .sel-mvp .selector-card-name{color:#F89540}
[data-theme="dark"] .sel-cretum .selector-card-sub{color:rgba(123,168,255,.55)}
[data-theme="dark"] .sel-mvp .selector-card-sub{color:rgba(248,149,64,.65)}
@media (max-width:600px){
  .selector-hero{padding:14px 14px 22px}
  .selector-greeting{font-size:20px}
  .selector-cards{gap:14px}
  .selector-card{width:160px;height:200px;padding:18px 12px;gap:10px}
  .selector-card-logo{width:64px;max-height:50px}
  .sel-cretum-word{width:auto;max-width:92px;max-height:38px}
  .sel-cretum .selector-card-logo{padding:6px 10px}
  .selector-card-name{font-size:18px}
  .selector-card-sub{font-size:10px}
}
@media (max-width:360px){
  .selector-cards{flex-direction:column;align-items:center}
  .selector-card{width:80%;max-width:240px}
}

/* ═══════════════════════════════════════════
   INICIO — landing page
═══════════════════════════════════════════ */
.page-home{display:none}
.page-home.active{display:block;animation:fadeIn .3s ease}

.home-hero{
  text-align:center;padding:38px 22px 30px;margin-bottom:24px;
  background:linear-gradient(135deg,var(--navy-pale),var(--navy-ghost));
  border:1px solid var(--gray-100);border-radius:var(--r-lg);
}
.home-greeting{font-size:26px;font-weight:500;color:var(--navy);margin-bottom:6px;letter-spacing:-.3px}
.home-question{font-size:14px;color:var(--gray-500)}

/* Panel ejecutivo (resumen del negocio) en el Home */
.home-kpis{margin-bottom:24px}
.home-kpis-title{font-size:13px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}
.home-kpis-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px}
.home-kpi{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:16px 18px}
[data-theme="dark"] .home-kpi{background:var(--gray-50)}
.home-kpi-l{font-size:11px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.home-kpi-v{font-size:23px;font-weight:700;color:var(--gray-900);font-variant-numeric:tabular-nums;line-height:1.05}
.home-kpi-v.accent{color:var(--navy)}
.home-top{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:16px 18px}
[data-theme="dark"] .home-top{background:var(--gray-50)}
.home-top-h{font-size:12px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:.3px;margin-bottom:12px}
.home-top-row{display:flex;align-items:center;gap:12px;margin-bottom:9px;font-size:13px}
.home-top-row:last-child{margin-bottom:0}
.home-top-name{flex:0 0 38%;color:var(--gray-900);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-top-bar{flex:1;height:8px;background:var(--gray-100);border-radius:6px;overflow:hidden}
.home-top-fill{height:100%;background:var(--navy);border-radius:6px}
.home-top-val{flex:0 0 auto;color:var(--gray-700);font-weight:600;font-variant-numeric:tabular-nums}
.home-kpis-load,.home-kpis-err{font-size:13px;color:var(--gray-500);padding:8px 2px}

/* ── Tablero del equipo (home MVP): digest de Slack + notas manuales ── */
.home-board{margin-bottom:24px}
.hb-card{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:18px 20px 16px}
[data-theme="dark"] .hb-card{background:var(--gray-50)}
/* Cabecera clicable: botón naranja (acento MVP) con texto blanco y flecha */
.hb-toggle{
  display:flex;align-items:center;gap:10px;width:100%;
  border:0;background:var(--navy);color:#fff;
  padding:11px 15px;margin:0;border-radius:10px;
  font-family:var(--font);cursor:pointer;text-align:left;
  transition:filter .15s,transform .16s cubic-bezier(.23,1,.32,1);
}
.hb-toggle:hover{filter:brightness(1.08)}
.hb-toggle:active{transform:scale(.99)}
.hb-chev{
  flex:0 0 auto;font-size:11px;color:rgba(255,255,255,.9);
  transition:transform .22s cubic-bezier(.23,1,.32,1);
}
.hb-card.collapsed .hb-chev{transform:rotate(-90deg)}
.hb-title{font-size:13px;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}
.hb-desc{font-size:12px;color:rgba(255,255,255,.8);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* En MVP oscuro el acento (--navy) se aclara demasiado para texto blanco: fija el naranja de marca */
[data-theme="dark"][data-org="mvp"] .hb-toggle{background:#ED7824}
/* Cuerpo colapsable (grid-template-rows: animable sin layout thrash) */
.hb-wrap{
  display:grid;grid-template-rows:1fr;
  transition:grid-template-rows .24s cubic-bezier(.23,1,.32,1);
}
.hb-card.collapsed .hb-wrap{grid-template-rows:0fr}
.hb-inner{overflow:hidden;min-width:0}
@media (prefers-reduced-motion: reduce){.hb-wrap{transition:none}.hb-chev{transition:color .15s}}
.hb-sub{display:flex;align-items:center;gap:10px;margin:12px 0 12px;flex-wrap:wrap}
.hb-upd{font-size:11px;color:var(--gray-400)}
.hb-add{
  margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  padding:6px 13px;border:1px solid var(--gray-200);border-radius:999px;
  background:transparent;color:var(--gray-700);font-size:12px;font-weight:500;
  font-family:var(--font);cursor:pointer;
  transition:border-color .15s,color .15s,transform .16s cubic-bezier(.23,1,.32,1);
}
.hb-add:hover{border-color:var(--navy);color:var(--navy)}
.hb-add:active{transform:scale(.97)}
.hb-grid{display:grid;grid-template-columns:1fr 264px;gap:6px 30px;align-items:start}
@media(max-width:760px){.hb-grid{grid-template-columns:1fr;gap:18px}}
.hb-col-h{font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--gray-400);margin-bottom:6px}
.hb-item{
  display:flex;gap:10px;align-items:flex-start;position:relative;
  padding:9px 26px 9px 10px;margin:0 -10px;border-radius:9px;
  transition:background .15s;
  animation:hbIn .3s cubic-bezier(.23,1,.32,1) both;
}
.hb-item:nth-child(2){animation-delay:40ms}
.hb-item:nth-child(3){animation-delay:80ms}
.hb-item:nth-child(4){animation-delay:120ms}
.hb-item:nth-child(5){animation-delay:160ms}
.hb-item:nth-child(n+6){animation-delay:200ms}
@keyframes hbIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion: reduce){.hb-item{animation:none}}
.hb-item:hover{background:var(--gray-50)}
[data-theme="dark"] .hb-item:hover{background:var(--gray-100)}
.hb-chip{
  flex:0 0 auto;margin-top:2px;font-size:9.5px;font-weight:600;
  letter-spacing:.4px;text-transform:uppercase;border-radius:999px;padding:3px 8px;
}
.hb-chip.aviso{background:var(--amber-bg);color:var(--amber)}
.hb-chip.noticia{background:var(--blue-bg);color:var(--blue)}
.hb-chip.evento{background:var(--green-bg);color:var(--green)}
.hb-txt{min-width:0;flex:1}
.hb-t{font-size:13.5px;line-height:1.45;color:var(--gray-900);word-break:break-word}
a.hb-t{text-decoration:none;transition:color .15s}
a.hb-t:hover{color:var(--navy)}
.hb-m{font-size:11px;color:var(--gray-500);margin-top:2px;display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.hb-m i{font-size:9px}
.hb-del{
  position:absolute;top:9px;right:6px;border:0;background:transparent;
  color:var(--gray-300);font-size:12px;cursor:pointer;padding:3px 5px;border-radius:6px;
  opacity:0;transition:opacity .15s,color .15s;
}
.hb-item:hover .hb-del{opacity:1}
.hb-del:hover{color:var(--red)}
@media(pointer:coarse){.hb-del{opacity:1}}
.hb-ev{display:flex;gap:11px;align-items:center;padding:7px 0}
.hb-ev + .hb-ev{border-top:1px dashed var(--gray-100)}
.hb-ev-d{
  flex:0 0 42px;text-align:center;border:1px solid var(--gray-200);
  border-radius:9px;padding:5px 0 4px;background:var(--white);
}
.hb-ev-day{font-family:var(--mono);font-size:15px;font-weight:500;color:var(--gray-900);line-height:1.15}
.hb-ev-mon{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.6px;color:var(--navy)}
.hb-ev-t{font-size:12.5px;line-height:1.4;color:var(--gray-900);word-break:break-word}
.hb-ev-m{font-size:10.5px;color:var(--gray-500);margin-top:1px}
.hb-more{
  border:0;background:transparent;color:var(--navy);font-size:12px;font-weight:500;
  font-family:var(--font);cursor:pointer;padding:7px 0 2px;
  transition:opacity .15s;
}
.hb-more:hover{opacity:.75}
.hb-empty{font-size:12.5px;color:var(--gray-400);padding:6px 0 2px;line-height:1.55}
.hb-err{font-size:12.5px;color:var(--red);padding:6px 0 2px}
/* Eventos Cretum (Outlook) */
.cal-cta{padding:6px 0 4px}
.cal-cta-tx{font-size:13px;color:var(--gray-500);line-height:1.5;margin:0 0 12px;max-width:52ch}
.cal-connect{display:inline-flex;align-items:center;gap:9px;font-family:var(--font);font-size:13px;font-weight:500;color:#fff;background:var(--navy);border:0;border-radius:var(--r-md);padding:10px 16px;cursor:pointer;transition:filter .15s,transform .12s ease}
.cal-connect:hover{filter:brightness(1.08)}
.cal-connect:active{transform:scale(.98)}
.cal-connect i{font-size:14px}
.cal-cta-btns{display:flex;gap:9px;flex-wrap:wrap}
.cal-connect-g{background:var(--white);color:var(--gray-800);border:1px solid var(--gray-200)}
.cal-connect-g:hover{filter:none;border-color:var(--navy);color:var(--navy);background:var(--navy-pale)}
[data-theme="dark"] .cal-connect-g{background:var(--gray-100)}
.cal-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px dashed var(--gray-100)}
.cal-who{font-size:11.5px;color:var(--gray-500);display:inline-flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.cal-who i{color:var(--gray-400)}
.cal-x{border:0;background:none;color:var(--gray-400);cursor:pointer;font-size:10px;line-height:1;padding:2px 3px;border-radius:4px}
.cal-x:hover{color:var(--red);background:var(--red-bg)}
.cal-mini{font-family:var(--font);font-size:12px;font-weight:500;color:var(--gray-500);background:none;border:0;cursor:pointer;padding:4px 6px;border-radius:6px;display:inline-flex;align-items:center;gap:6px;transition:color .15s,background .15s}
.cal-mini:hover{color:var(--navy);background:var(--navy-pale)}
.cal-viewall{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:12px;padding:10px 12px;font-family:var(--font);font-size:12.5px;font-weight:600;color:var(--navy);background:var(--navy-pale);border:0;border-radius:var(--r-md);cursor:pointer;transition:filter .15s,transform .12s ease}
.cal-viewall:hover{filter:brightness(.97)}
.cal-viewall:active{transform:scale(.98)}
.cal-viewall i{font-size:11px;transition:transform .15s ease}
.cal-viewall:hover i{transform:translateX(2px)}
/* Página Calendario (agenda) */
.cal-page{max-width:920px}
.cal-card{padding:16px 18px}
/* Cuadrícula mensual (estilo Outlook) */
.cg-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.cg-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cg-navbtn{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--gray-200);background:var(--gray-100);color:var(--gray-600);border-radius:8px;cursor:pointer;font-size:12px;transition:border-color .15s,color .15s,background .15s}
.cg-navbtn:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-pale)}
.cg-month{font-size:16px;font-weight:600;color:var(--gray-900);text-transform:capitalize;min-width:130px;text-align:center}
.cg-today{font-family:var(--font);font-size:12.5px;font-weight:600;color:var(--navy);background:var(--navy-pale);border:0;border-radius:8px;padding:8px 13px;cursor:pointer;transition:filter .15s}
.cg-today:hover{filter:brightness(.97)}
.cg-loading{color:var(--navy-light);font-size:12px}
.cg-err{font-size:11.5px;color:var(--red)}
.cg-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.cg-dow{font-size:11px;font-weight:600;color:var(--gray-400);text-transform:uppercase;letter-spacing:.03em;text-align:center;padding:6px 2px}
.cg-body{gap:1px;background:var(--gray-200);border:1px solid var(--gray-200);border-radius:10px;overflow:hidden}
.cg-cell{background:#fff;min-height:96px;padding:5px 6px;display:flex;flex-direction:column;gap:3px;min-width:0;cursor:pointer;transition:filter .12s}
@media (hover:hover){.cg-cell:hover{filter:brightness(.97)}}
.cg-cell:active{filter:brightness(.94)}
.cg-cell.out{background:var(--gray-50)}
[data-theme="dark"] .cg-cell{background:#1a1a1a}
[data-theme="dark"] .cg-cell.out{background:#111}
.cg-daynum{font-size:12px;font-weight:600;color:var(--gray-700);width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex:0 0 auto}
.cg-cell.out .cg-daynum{color:var(--gray-400)}
.cg-cell.today .cg-daynum{background:var(--navy);color:#fff}
.cg-evs{display:flex;flex-direction:column;gap:2px;min-width:0;overflow:hidden}
.cg-ev{font-size:11px;line-height:1.35;color:var(--navy);background:rgba(26,58,107,.10);border-radius:4px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;display:block}
.cg-ev:hover{background:rgba(26,58,107,.18)}
.cg-ev.allday{color:var(--green);background:rgba(26,140,91,.12)}
.cg-ev-h{font-variant-numeric:tabular-nums;opacity:.7}
.cg-more{font-size:10.5px;color:var(--gray-400);padding:0 4px}
/* Detalle de un día (modal) */
.cal-day-modal{width:min(460px,94vw)}
#calDayTitle{text-transform:capitalize}
.cdm-list{padding:6px 18px 18px;overflow-y:auto;max-height:70vh}
.cdm-ev{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-top:1px solid var(--gray-100)}
.cdm-ev:first-child{border-top:0}
.cdm-ev-time{flex:0 0 auto;width:104px;font-size:12.5px;color:var(--gray-500);font-variant-numeric:tabular-nums;padding-top:1px}
.cdm-ev-body{flex:1;min-width:0}
.cdm-ev-t{font-size:14px;font-weight:600;color:var(--gray-900);line-height:1.35;word-break:break-word}
.cdm-ev-loc{font-size:12px;color:var(--gray-400);margin-top:3px;display:flex;align-items:center;gap:5px}
.cdm-ev-loc i{font-size:10px}
.cdm-open{flex:0 0 auto;font-size:12px;font-weight:600;color:var(--navy);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:5px;padding-top:2px}
.cdm-open:hover{text-decoration:underline}
@media (max-width:640px){
  .cg-cell{min-height:58px;padding:3px}
  .cg-ev{font-size:9.5px;padding:1px 3px}
  .cg-ev-h{display:none}
  .cg-daynum{width:18px;height:18px;font-size:11px}
  .cg-dow{font-size:9.5px}
  .cal-card{padding:12px 10px}
}
/* Composer de nota manual */
.hb-comp{text-align:left;width:400px}
.hb-kinds{display:flex;gap:6px;margin:14px 0 12px}
.hb-kind-btn{
  flex:1;padding:7px 0;border:1px solid var(--gray-200);border-radius:999px;
  background:transparent;color:var(--gray-500);font-size:12px;font-weight:500;
  font-family:var(--font);cursor:pointer;
  transition:border-color .15s,color .15s,background-color .15s,transform .16s cubic-bezier(.23,1,.32,1);
}
.hb-kind-btn:active{transform:scale(.97)}
.hb-kind-btn.on{border-color:var(--navy);color:var(--navy);background:var(--navy-ghost)}
.hb-inp{
  width:100%;padding:9px 12px;border:1px solid var(--gray-200);border-radius:var(--r-md);
  background:var(--white);color:var(--gray-900);font-size:13.5px;font-family:var(--font);
  margin-bottom:10px;transition:border-color .15s;
}
.hb-inp:focus{outline:none;border-color:var(--navy)}
.hb-ta{resize:vertical;min-height:64px;line-height:1.5}
.hb-f-label{display:block;font-size:11px;font-weight:600;color:var(--gray-500);margin-bottom:5px}
.hb-pub{background:var(--navy);color:#fff}
.hb-pub:hover{filter:brightness(1.08)}
.hb-pub:active{transform:scale(.97)}
[data-theme="dark"] .hb-ev-d{background:var(--gray-100)}
[data-theme="dark"][data-org="mvp"] .hb-card{background:#1a1610}
[data-theme="dark"][data-org="mvp"] .hb-inp{background:#120e0a;border-color:#3d3428}
[data-theme="dark"][data-org="mvp"] .hb-ev-d{background:#12100a;border-color:#3d3428}

/* ── Home modular (Cretum): ventanas redimensionables ──
   El switch Principal/Modular vive en el menú del perfil (Preferencias). */
.hv-btn{font-family:var(--font);letter-spacing:.1px}
/* Filas finas de 8px + flow dense: las ventanas ocupan N filas según su alto
   y los huecos de la retícula se rellenan solos (empacado tipo dashboard). */
.home-modular{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:8px;grid-auto-flow:dense;gap:14px;margin-bottom:24px}
.hw{position:relative;display:flex;flex-direction:column;min-width:0;overflow:hidden;background:#fff;border:1px solid var(--gray-200);border-radius:14px}
[data-theme="dark"] .hw{background:var(--gray-50)}
[data-theme="dark"][data-org="mvp"] .hw{background:#1a1610}
[data-theme="dark"][data-org="mvp"] .hw-menu .cdd-panel{background:#1a1610;border-color:#3d3428}
.hw.resizing{border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-pale)}
.hw-head{display:flex;align-items:center;gap:8px;padding:11px 16px 8px;flex:0 0 auto;cursor:grab;touch-action:none}
.hw-head:active{cursor:grabbing}
.hw.hw-dragging{opacity:.6;pointer-events:none;border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-pale),0 12px 32px rgba(0,0,0,.16)}
body.hw-noselect{cursor:grabbing}
.hw-hico{font-size:12px;color:var(--navy)}
.hw-title{font-size:12px;font-weight:600;color:var(--gray-700);text-transform:uppercase;letter-spacing:.5px}
.hw-acts{margin-left:auto;display:flex;gap:2px}
.hw-act{border:0;background:transparent;color:var(--gray-400);width:28px;height:28px;border-radius:7px;cursor:pointer;font-size:12px;display:flex;align-items:center;justify-content:center;transition:background-color .15s,color .15s}
.hw-act:hover{background:var(--gray-100);color:var(--gray-800)}
.hw-act.on{color:var(--navy)}
.hw-body{flex:1;min-height:0;overflow:auto;padding:2px 16px 14px}
/* Grip de resize: esquina inferior derecha, rayas diagonales */
.hw-grip{position:absolute;right:0;bottom:0;width:20px;height:20px;cursor:nwse-resize;touch-action:none;
  background:linear-gradient(135deg,transparent 55%,var(--gray-300) 55%,var(--gray-300) 62%,transparent 62%,transparent 72%,var(--gray-300) 72%,var(--gray-300) 79%,transparent 79%);
  border-bottom-right-radius:13px;opacity:.75;transition:opacity .15s}
.hw-grip:hover{opacity:1}
.hw-noselect{user-select:none!important}
/* Candado: fija el diseño (oculta toda la edición) */
.hw-lockbar{grid-column:1/-1;grid-row:span 2;display:flex;justify-content:flex-end;align-items:center}
.hw-lock{
  border:1px solid var(--gray-200);background:var(--white);color:var(--gray-500);
  padding:6px 14px;border-radius:999px;cursor:pointer;
  font-family:var(--font);font-size:12px;font-weight:500;
  display:inline-flex;align-items:center;gap:7px;
  transition:color .15s,border-color .15s,background-color .15s,transform .16s cubic-bezier(.23,1,.32,1);
}
.hw-lock i{font-size:11px}
.hw-lock:hover{border-color:var(--navy-light);color:var(--navy)}
.hw-lock:active{transform:scale(.94)}
.hw-lock.locked{background:var(--navy);border-color:var(--navy);color:#fff}
.home-modular.locked .hw-head{cursor:default}
/* Edición de módulos (lápiz): ✕ para quitar, + para reactivar (atenuados) */
.hw-mod.hw-editing{border-style:dashed}
.hw-mod.hw-off-mod{opacity:.45}
.hw-mod.hw-off-mod:hover{opacity:.85}
.hw-mod-x{
  position:absolute;top:4px;right:4px;width:17px;height:17px;border-radius:50%;
  background:var(--red-bg);color:var(--red);font-size:8.5px;
  display:flex;align-items:center;justify-content:center;pointer-events:none;
}
.hw-mod-x.add{background:var(--navy-pale);color:var(--navy)}
/* Chips para reactivar ventanas ocultas */
.hw-off-row{grid-column:1/-1;grid-row:span 3;display:flex;gap:8px;flex-wrap:wrap;align-content:flex-start}
.hw-off{display:inline-flex;align-items:center;gap:6px;border:1px dashed var(--gray-300);background:transparent;color:var(--gray-500);font-size:12px;font-weight:500;font-family:var(--font);padding:7px 13px;border-radius:999px;cursor:pointer;transition:border-color .15s,color .15s}
.hw-off:hover{border-color:var(--navy-light);color:var(--navy)}
/* Módulos compactos dentro de la ventana (con o sin iconos) */
.hw-mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.hw-mods.noico{grid-template-columns:repeat(auto-fill,minmax(128px,1fr))}
.hw-mod{position:relative;display:flex;align-items:center;gap:9px;padding:9px 11px;border:1px solid var(--gray-100);border-radius:10px;background:var(--white);cursor:pointer;font-family:var(--font);text-align:left;min-width:0;transition:border-color .15s,background-color .15s,transform .16s cubic-bezier(.23,1,.32,1)}
.hw-mod:hover{border-color:var(--navy-light);background:var(--navy-ghost)}
.hw-mod:active{transform:scale(.97)}
[data-theme="dark"] .hw-mod{background:var(--gray-100);border-color:var(--gray-200)}
.hw-mod-ico{width:28px;height:28px;border-radius:8px;background:var(--navy-pale);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:12px;flex:0 0 auto}
.hw-mod-t{font-size:12.5px;font-weight:500;color:var(--gray-900);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hw-mod-pulse{position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--red)}
/* Diseño Lista: filas a lo ancho en vez de cuadrícula */
.hw-mods.list{display:flex;flex-direction:column;gap:6px}
.hw-mods.list .hw-mod{width:100%}
/* Desplegable de opciones de la ventana Módulos */
.hw-menu .cdd-panel{min-width:212px;transform-origin:top right;padding:5px 0}
.hw-mi-h{padding:7px 14px 3px;font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--gray-400)}
.hw-mi{
  display:flex;align-items:center;gap:9px;width:100%;
  border:0;background:none;text-align:left;padding:8px 14px;
  font-family:var(--font);font-size:12.5px;color:var(--gray-700);cursor:pointer;
  transition:background-color .12s,color .12s;
}
.hw-mi:hover{background:var(--navy-ghost);color:var(--navy)}
.hw-mi.on{color:var(--navy);font-weight:600}
.hw-mi i{width:15px;font-size:11px;color:var(--gray-400);text-align:center}
.hw-mi.on i,.hw-mi:hover i{color:var(--navy)}
.hw-mi .hw-mi-check{margin-left:auto;font-size:10px;width:auto}
.hw-mi-sep{height:1px;background:var(--gray-100);margin:5px 0}
[data-theme="dark"] .hw-mi-sep{background:#262626}
[data-theme="dark"] .hw-menu .cdd-panel{background:#1a1a1a;border-color:#2a2a2a}
/* Solo iconos: tiles cuadrados; al hover el icono sube y el nombre aparece dentro */
.hw-mods.ico-only{grid-template-columns:repeat(auto-fill,minmax(66px,1fr))}
.hw-mod-io{flex-direction:column;justify-content:center;gap:0;aspect-ratio:1;padding:6px}
.hw-mod-io .hw-mod-ico{transition:transform .2s cubic-bezier(.23,1,.32,1)}
.hw-mod-io-t{
  position:absolute;left:5px;right:5px;bottom:7px;
  font-size:9.5px;font-weight:600;color:var(--navy);text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  opacity:0;transform:translateY(5px);
  transition:opacity .2s ease,transform .2s cubic-bezier(.23,1,.32,1);
}
@media (hover:hover) and (pointer:fine){
  .hw-mod-io:hover .hw-mod-ico{transform:translateY(-8px) scale(.9)}
  .hw-mod-io:hover .hw-mod-io-t{opacity:1;transform:translateY(0)}
}
/* Touch: sin hover no hay reveal → nombre mini siempre visible */
@media (hover:none){
  .hw-mod-io .hw-mod-ico{transform:translateY(-7px) scale(.9)}
  .hw-mod-io-t{opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion:reduce){
  .hw-mod-io .hw-mod-ico{transition:none}
  .hw-mod-io-t{transition:opacity .15s ease;transform:none}
  .hw-mod-io:hover .hw-mod-ico{transform:none}
}
/* Tamaños del modo solo iconos */
.hw-mods.ico-only.sz2{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}
.hw-mods.ico-only.sz2 .hw-mod-io-t{font-size:10.5px}
.hw-mods.ico-only.sz3{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
.hw-mods.ico-only.sz3 .hw-mod-io-t{font-size:11.5px;bottom:9px}
.hw-mods.ico-only.sz3 .hw-mod-io:hover .hw-mod-ico{transform:translateY(-11px) scale(.9)}

/* Tamaños de los módulos (botón lupa del header): sz2 mediano, sz3 grande */
.hw-mods.sz2{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.hw-mods.sz2 .hw-mod{padding:12px 14px;gap:11px}
.hw-mods.sz2 .hw-mod-ico{width:38px;height:38px;font-size:16px;border-radius:10px}
.hw-mods.sz2 .hw-mod-t{font-size:13.5px}
.hw-mods.sz3{grid-template-columns:repeat(auto-fill,minmax(214px,1fr));gap:12px}
.hw-mods.sz3 .hw-mod{padding:15px 16px;gap:13px}
.hw-mods.sz3 .hw-mod-ico{width:46px;height:46px;font-size:20px;border-radius:13px}
.hw-mods.sz3 .hw-mod-t{font-size:14.5px}
.hw-mods.noico.sz2{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.hw-mods.noico.sz3{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
/* Cuadrícula con iconos y nombres: tarjeta vertical, eco de la vista Principal */
.hw-mods.vcards{grid-template-columns:repeat(auto-fill,minmax(128px,1fr))}
.hw-mods.vcards .hw-mod{flex-direction:column;justify-content:center;gap:9px;padding:16px 10px 13px;text-align:center}
.hw-mods.vcards .hw-mod-ico{width:38px;height:38px;font-size:16px;border-radius:11px;transition:transform .28s cubic-bezier(.23,1,.32,1)}
.hw-mods.vcards .hw-mod-t{white-space:normal;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Mantener presionado un módulo → burbuja con su descripción (bloque autocontenido: se lee igual en ambos temas) */
[data-desc]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.mod-desc-tip{position:fixed;z-index:2400;max-width:min(260px,calc(100vw - 20px));padding:10px 12px;border-radius:12px;background:#151b26;color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.22);font-size:12.5px;line-height:1.4;pointer-events:none;opacity:0;transform:translateY(4px) scale(.97);transform-origin:50% 100%;transition:opacity .16s cubic-bezier(.23,1,.32,1),transform .16s cubic-bezier(.23,1,.32,1)}
.mod-desc-tip.below{transform:translateY(-4px) scale(.97);transform-origin:50% 0}
.mod-desc-tip.on{opacity:1;transform:none}
.mod-desc-tip strong{display:block;font-weight:600;margin-bottom:2px}
.mod-desc-tip span{color:rgba(255,255,255,.78)}
@media (prefers-reduced-motion:reduce){.mod-desc-tip{transition:opacity .12s;transform:none}}
@media (hover:hover) and (pointer:fine){.hw-mods.vcards .hw-mod:hover .hw-mod-ico{transform:scale(1.1) rotate(-5deg)}}
@media (prefers-reduced-motion:reduce){.hw-mods.vcards .hw-mod-ico{transition:none}.hw-mods.vcards .hw-mod:hover .hw-mod-ico{transform:none}}
.hw-mods.vcards.sz2{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))}
.hw-mods.vcards.sz2 .hw-mod{padding:18px 10px 14px}
.hw-mods.vcards.sz2 .hw-mod-ico{width:44px;height:44px;font-size:19px;border-radius:12px}
.hw-mods.vcards.sz2 .hw-mod-t{font-size:13.5px}
.hw-mods.vcards.sz3{grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
.hw-mods.vcards.sz3 .hw-mod{padding:20px 12px 16px;gap:11px}
.hw-mods.vcards.sz3 .hw-mod-ico{width:46px;height:46px;font-size:20px;border-radius:13px}
.hw-mods.vcards.sz3 .hw-mod-t{font-size:14px}
/* Calendario mensual compacto dentro de una ventana modular */
.hw-cal-mes .cg-cell{min-height:52px;padding:3px 4px}
.hw-cal-mes .cg-top{margin-bottom:6px}
/* Móvil: apilado a lo ancho, sin resize (el alto elegido se respeta con scroll interno) */
@media (max-width:760px){
  .home-modular{grid-template-columns:1fr;gap:12px}
  .home-modular .hw{grid-column:span 1!important}
  .hw-grip{display:none}
}

/* Botón + modal Full LATAM MVP Snapshot */
.db-snap-btn{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border:none;border-radius:10px;background:var(--navy);color:#fff;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:filter .15s}
.db-snap-btn:hover{filter:brightness(1.08)}
.sxt-veh{border:1px solid #e5e7eb;border-radius:12px;padding:12px 14px;margin:10px 0;background:#fff}
.sxt-veh-h{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:700;font-size:14px}
.sxt-dot{width:12px;height:12px;border-radius:50%;flex:none}
.sxt-dot.g{background:#16a34a}.sxt-dot.y{background:#f59e0b}.sxt-dot.r{background:#dc2626}
.sxt-kpis{display:flex;gap:14px;flex-wrap:wrap;margin-left:auto;font-size:12px;font-weight:600;color:#374151}
.sxt-kpis b{font-size:14px;color:#111827}
.sxt-list{margin-top:10px;font-size:12.5px;display:none}
.sxt-veh.open .sxt-list{display:block}
.sxt-row{display:grid;grid-template-columns:1.6fr .7fr .7fr .9fr .6fr .6fr 1.6fr;gap:8px;padding:5px 0;border-top:1px solid #f3f4f6}
.sxt-row a{color:var(--navy);text-decoration:underline}
.sxt-row small{color:var(--gray-400);font-size:10px}
.sxt-row.h{font-weight:700;color:#6b7280;border-top:none;font-size:11px;text-transform:uppercase;letter-spacing:.4px}
.sxt-st{display:inline-block;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:700}
.sxt-st.aplicada{background:#dcfce7;color:#166534}.sxt-st.carta{background:#fef3c7;color:#92400e}.sxt-st.notice{background:#dbeafe;color:#1e40af}
.sxt-st.pendiente{background:#fee2e2;color:#991b1b}.sxt-st.explicado{background:#e5e7eb;color:#374151}
.sxt-note{font-size:12px;color:#6b7280;margin:4px 0 10px}
.sxt-tr-h{font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:#6b7280;margin:14px 0 6px}
.sxt-tbl{width:100%;border-collapse:collapse;font-size:13px}
.sxt-tbl th{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:#6b7280;padding:6px 8px;border-bottom:2px solid #e5e7eb;text-align:center;vertical-align:bottom}
.sxt-tbl th small{display:block;text-transform:none;letter-spacing:0;font-weight:500;font-size:10.5px}
.sxt-tbl td{padding:9px 8px;border-bottom:1px solid #f3f4f6;text-align:center;vertical-align:middle}
.sxt-r{cursor:pointer}.sxt-r:hover td{background:#f9fafb}
.sxt-tbl td.ok{color:#166534;font-weight:700}.sxt-tbl td.warn{color:#b45309;font-weight:700}.sxt-bad{color:#dc2626;font-weight:700;font-size:11px}
.sxt-tbl .sxt-dot{display:inline-block;vertical-align:middle;margin-right:8px}
.sxt-bar{height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-bottom:2px}.sxt-bar div{height:100%;background:#16a34a}
.sxt-det{display:none}.sxt-det.open{display:table-row}.sxt-det td{text-align:left;background:#fafafa;padding:4px 14px 10px}
.sxt-det .sxt-list{display:block}
.sxt-row{grid-template-columns:1.6fr .9fr .9fr 2.2fr}
.mvp-snap-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px}
.mvp-snap-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(2px)}
.mvp-snap-card{position:relative;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.28);width:min(880px,100%);max-height:88vh;overflow:auto}
/* ── Snapshot enriquecido ── */
.snap-sec-h{font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--gray-500,#6b7280);margin:20px 0 10px;display:flex;align-items:center;gap:6px}
.snap-kpi-sub{font-size:10.5px;color:var(--gray-500,#8a93a6);margin-top:2px}
.snap-mix{margin:12px 0 4px}
.snap-mix-bar{display:flex;height:16px;border-radius:8px;overflow:hidden;background:var(--gray-100,#eef1f7)}
.snap-mix-slim{height:12px;margin-bottom:8px}
.snap-mix-seg{height:100%}
.snap-mix-nav{background:var(--accent,#ED7824)}
.snap-mix-dist{background:#2E9E5B}
.snap-mix-dir{background:#4F5866}
.snap-mix-leg{display:flex;gap:18px;flex-wrap:wrap;font-size:11.5px;color:var(--gray-700,#475066);margin-top:7px}
.snap-dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:middle}
i.snap-dot.snap-mix-nav{background:var(--accent,#ED7824)}
i.snap-dot.snap-mix-dist{background:#2E9E5B}
i.snap-dot.snap-mix-dir{background:#4F5866}
.snap-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px}
@media(max-width:700px){.snap-grid2{grid-template-columns:1fr}}
.snap-panel{border:1px solid var(--gray-150,#e5e9f2);border-radius:12px;padding:14px 16px;background:var(--card,#fff)}
.snap-panel-h{font-size:12px;font-weight:800;margin-bottom:10px;display:flex;align-items:center;gap:6px}
.snap-row{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;color:var(--gray-700,#475066);padding:5px 0;border-top:1px dashed var(--gray-100,#eef1f7)}
.snap-row:first-of-type{border-top:0}
.snap-row b{font-size:13px}
.snap-row b.accent{color:var(--accent,#ED7824)}
.snap-donut-row{display:flex;gap:20px;align-items:center}
@media(max-width:700px){.snap-donut-row{flex-direction:column}}
.snap-donut-big{font-size:15px;font-weight:800;fill:var(--gray-900,#1a1f2e)}
.snap-donut-cap{font-size:8.5px;letter-spacing:1px;fill:var(--gray-500,#8a93a6)}
.snap-sw{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:7px;flex:none}
.snap-pct{display:block;font-size:9.5px;color:var(--gray-500,#9aa3b5);font-weight:400;text-align:right}
.snap-bucket{display:grid;grid-template-columns:52px 1fr 86px;gap:9px;align-items:center;padding:3.5px 0}
.snap-bucket-l{font-size:11px;font-weight:700;color:var(--gray-700,#475066)}
.snap-bucket-bar{background:var(--gray-100,#eef1f7);border-radius:6px;height:12px;overflow:hidden}
.snap-bucket-fill{height:100%;border-radius:6px;background:var(--gray-300,#c4cbd6)}
.snap-bucket-fill.pos{background:#2E9E5B}
.snap-bucket-fill.neg{background:#C0392B}
.snap-bucket-v{font-size:11px;font-weight:700;text-align:right}
.snap-years{display:flex;gap:14px;align-items:stretch;height:130px;padding:4px 2px 0}
.snap-year{flex:1;display:flex;flex-direction:column;align-items:center;min-width:0}
.snap-year-col{flex:1;width:100%;max-width:54px;display:flex;align-items:flex-end}
.snap-year-fill{width:100%;background:linear-gradient(180deg,#34b071,#2E9E5B);border-radius:6px 6px 0 0;min-height:2px}
.snap-year-v{font-size:10px;font-weight:700;margin-top:5px;white-space:nowrap}
.snap-year-l{font-size:10px;color:var(--gray-500,#8a93a6)}
.snap-foot{font-size:10.5px;color:var(--gray-500,#8a93a6);line-height:1.5;margin-top:16px;border-top:1px solid var(--gray-100,#eef1f7);padding-top:10px}
.mvp-snap-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--gray-100);position:sticky;top:0;background:#fff;z-index:1}
.mvp-snap-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:var(--navy)}
.mvp-snap-close{border:none;background:var(--gray-100);color:var(--gray-700);width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:15px}
.mvp-snap-close:hover{background:var(--gray-200)}
.mvp-snap-body{padding:22px}

/* Panel admin "Control de precios" (fuente de pps/valuación por empresa) */
.price-ctl-note{font-size:12px;color:var(--gray-500);margin-bottom:14px}
.price-ctl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px;margin-bottom:22px}
.price-ctl-card{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
[data-theme="dark"] .price-ctl-card{background:var(--gray-50)}
.price-ctl-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.price-ctl-name{font-size:15px;font-weight:700;color:var(--gray-900);line-height:1.25}
.price-ctl-chip{font-size:10px;font-weight:700;padding:3px 10px;border-radius:999px;white-space:nowrap;text-transform:uppercase;letter-spacing:.2px}
.price-ctl-chip-green{background:#e3f6ea;color:#1f8a4c}
.price-ctl-chip-blue{background:var(--navy-pale);color:var(--navy)}
.price-ctl-chip-gray{background:var(--gray-100);color:var(--gray-700)}
.price-ctl-chip-orange{background:#fdead9;color:#c45a11}
.price-ctl-chip-purple{background:#eee6fb;color:#6b3fb8}
.price-ctl-chip-red{background:#fde3e3;color:#c0392b}
.price-ctl-vals{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.price-ctl-valbox{background:var(--gray-50);border-radius:11px;padding:10px 12px;display:flex;flex-direction:column;gap:3px}
[data-theme="dark"] .price-ctl-valbox{background:var(--gray-100)}
.price-ctl-vl{font-size:10px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px}
.price-ctl-vv{font-size:18px;font-weight:700;color:var(--gray-900);font-variant-numeric:tabular-nums}
.price-ctl-vv-now{color:var(--accent,#ED7824)}
.price-ctl-meta{font-size:11.5px;color:var(--gray-500);display:flex;justify-content:space-between;gap:8px}

/* Vista 360 del LP (Base de Datos) */
.lp-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 4px}
.lp-kpi{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:12px;padding:12px 14px}
[data-theme="dark"] .lp-kpi{background:var(--gray-100)}
.lp-kpi-l{font-size:10.5px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px;margin-bottom:5px}
.lp-kpi-v{font-size:20px;font-weight:700;color:var(--gray-900);font-variant-numeric:tabular-nums}
.lp-expo{display:grid;grid-template-columns:1.4fr .9fr;gap:22px;align-items:center}
@media(max-width:760px){.lp-expo{grid-template-columns:1fr;gap:18px}}
.lp-expo-sub{font-size:11px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px;margin-bottom:10px}
.lp-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:12.5px}
.lp-bar-name{flex:0 0 34%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--gray-900);font-weight:500}
.lp-bar{flex:1;height:8px;background:var(--gray-100);border-radius:6px;overflow:hidden}
.lp-bar-fill{height:100%;background:var(--navy);border-radius:6px}
.lp-bar-val{flex:0 0 auto;color:var(--gray-700);font-weight:600;font-variant-numeric:tabular-nums}
.lp-expo-donut{display:flex;flex-direction:column;align-items:center}
.lp-lock-next{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray-900);background:var(--navy-pale);border-radius:10px;padding:10px 14px;margin-bottom:12px}
.lp-lock-next i{color:var(--navy)}
.lp-lock-done{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:13px;color:#1e5a2a;background:#eef7ee;border-radius:10px;padding:10px 14px;margin-bottom:12px}
.lp-lock-done i{color:#2e8b57}
.lp-lock-block{padding:10px 0;border-top:1px solid var(--gray-100)}
.lp-lock-block:first-of-type{border-top:none;padding-top:0}
.lp-lock-scope{font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:3px}
.lp-lock-sum{font-size:12.5px;color:var(--gray-700);line-height:1.5}
.lp-events-note{font-size:11px;color:var(--gray-500);margin-top:10px}
.lp-distdetail{margin-top:12px;border-top:1px solid var(--gray-100);padding-top:10px}
.lp-distdetail>summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--navy);list-style:none;display:flex;align-items:center;gap:8px;user-select:none}
.lp-distdetail>summary::-webkit-details-marker{display:none}
.lp-distdetail[open]>summary{margin-bottom:12px}
.lp-dd-struct{margin-bottom:18px}
.lp-dd-struct:last-child{margin-bottom:0}
.lp-dd-h{font-size:13px;font-weight:700;color:var(--gray-900);margin-bottom:3px}
.lp-dd-applies{font-size:12px;font-weight:600;color:var(--navy);margin-bottom:6px}
.lp-dd-sum{font-size:12.5px;color:var(--gray-700);line-height:1.5;margin-bottom:8px}
.lp-dd-glabel{font-size:12px;font-weight:600;color:var(--gray-700);margin:10px 0 4px}
.lp-phase{width:100%;border-collapse:collapse;margin-bottom:6px}
.lp-phase th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.3px;color:var(--gray-500);font-weight:600;padding:5px 8px;border-bottom:1px solid var(--gray-200)}
.lp-phase td{font-size:12px;color:var(--gray-700);padding:6px 8px;border-bottom:1px solid var(--gray-100);vertical-align:top}
.lp-phase-pct{font-weight:700;color:var(--gray-900);white-space:nowrap}
.lp-dd-nota{font-size:11px;color:var(--gray-500);margin-top:5px;font-style:italic}

/* Widget de noticias del portafolio (home Cretum) — al final, header azul, desplegable */
.home-news{margin-top:10px;border:1px solid var(--gray-200);border-radius:14px;overflow:hidden;background:var(--card,#fff)}
.hn-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:13px 18px;background:var(--navy);color:#fff;border:none;cursor:pointer;font-family:inherit;transition:filter .15s}
.hn-bar:hover{filter:brightness(1.08)}
/* Dark: el acento se aclara (#5d8ff5) → texto oscuro, como .btn-primary en dark */
[data-theme="dark"] .hn-bar{color:#0b1220}
[data-theme="dark"] .hn-count{background:rgba(11,18,32,.16)}
.hn-bar-title{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.hn-bar-title i{opacity:.92}
.hn-bar-right{display:flex;align-items:center;gap:10px}
.hn-count{font-size:11px;font-weight:700;background:rgba(255,255,255,.22);padding:2px 8px;border-radius:999px}
.hn-chev{font-size:12px;transition:transform .28s cubic-bezier(.23,1,.32,1)}
.home-news.collapsed .hn-chev{transform:rotate(-90deg)}
.hn-body{display:grid;grid-template-rows:1fr;transition:grid-template-rows .3s cubic-bezier(.23,1,.32,1)}
.home-news.collapsed .hn-body{grid-template-rows:0fr}
.hn-inner{overflow:hidden;min-height:0;padding:16px 18px 18px}
@media (prefers-reduced-motion:reduce){.hn-body,.hn-chev{transition:none}}
.hn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:12px}
.hn-card{display:flex;flex-direction:column;gap:9px;border:1px solid var(--gray-200);border-radius:12px;padding:13px 14px;background:var(--white,#fff);transition:border-color .16s,transform .16s}
[data-theme="dark"] .hn-card{background:rgba(255,255,255,.04);border-color:#2a2a2a}
.hn-card:hover{border-color:var(--navy-pale);transform:translateY(-2px)}
.hn-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hn-co{font-size:11px;font-weight:600;color:var(--navy);background:var(--navy-pale);padding:2px 8px;border-radius:999px;white-space:nowrap}
.hn-time{font-size:10.5px;color:var(--gray-500);white-space:nowrap}
.hn-text{font-size:13px;line-height:1.4;font-weight:600;color:var(--gray-900);flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.hn-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hn-src{font-size:11px;color:var(--gray-500);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hn-btn{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--navy);background:var(--navy-pale);padding:5px 10px;border-radius:8px;text-decoration:none;white-space:nowrap;flex:0 0 auto;transition:background .15s,color .15s}
.hn-btn:hover{background:var(--navy);color:#fff}
[data-theme="dark"] .hn-btn:hover{color:#0b1220}
.hn-more{display:flex;justify-content:center;margin-top:14px}
.hn-viewall{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--navy);background:var(--navy-pale);border:none;padding:9px 16px;border-radius:9px;cursor:pointer;font-family:inherit;transition:background .15s,color .15s}
.hn-viewall:hover{background:var(--navy);color:#fff}
[data-theme="dark"] .hn-viewall:hover{color:#0b1220}
@media (max-width:600px){.hn-grid{grid-template-columns:1fr 1fr}.hn-text{-webkit-line-clamp:2}}
@media (max-width:400px){.hn-grid{grid-template-columns:1fr}}

.home-modules{
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px;
  margin-bottom:24px;
}
.home-module{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:10px;
  width:170px;height:170px;padding:18px 14px;
  background:var(--white);border:1px solid var(--gray-100);
  border-radius:var(--r-lg);
  cursor:pointer;font-family:var(--font);
  transition:transform .22s cubic-bezier(.4,0,.2,1),box-shadow .22s,border-color .15s;
  box-shadow:var(--shadow-sm);
}
.home-module:hover{
  transform:translateY(-3px);
  box-shadow:0 10px 24px rgba(26,58,107,.16);
  border-color:var(--navy-light);
}
.home-module:active{transform:translateY(-1px)}

.home-module-ico{
  width:46px;height:46px;border-radius:13px;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;
  /* Ícono homogéneo al acento de la empresa: azul en Cretum, naranja en MVP */
  background:var(--navy-pale);color:var(--navy);
  transition:transform .28s cubic-bezier(.23,1,.32,1);
}
.home-module:hover .home-module-ico{transform:scale(1.1) rotate(-5deg)}

/* ── Personalización del home (reordenar / quitar / agregar) ── */
.home-cust-bar{display:flex;align-items:center;gap:12px;max-width:740px;margin:0 auto 12px;padding:0 4px}
.home-cust-hint{flex:1;font-size:12px;color:var(--gray-400)}
.home-cust-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:7px;background:none;border:1px solid var(--gray-200);
  color:var(--gray-600);font-family:var(--font);font-size:12.5px;font-weight:500;padding:6px 13px;border-radius:999px;
  cursor:pointer;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.home-cust-btn:hover{border-color:var(--navy-light);color:var(--navy)}
.home-modules.editing .home-cust-btn{background:var(--navy);border-color:var(--navy);color:#fff}
/* Brillo "nueva función" en Personalizar y +Agregar (hasta el primer uso) */
.home-cust-btn.shine-new{box-shadow:0 0 0 3px var(--navy-pale)}
.home-cust-btn.shine-new::before,
.home-module-add.shine-new::before{content:'';position:absolute;top:0;left:-140%;width:55%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);
  animation:ntShine 2.8s ease-in-out 1s infinite;pointer-events:none;z-index:1}
.home-module-add.shine-new{overflow:hidden;box-shadow:0 0 0 3px var(--navy-pale);border-color:var(--navy-light)}
@media (prefers-reduced-motion:reduce){.home-cust-btn.shine-new::before,.home-module-add.shine-new::before{animation:none}}
/* Globo de ayuda "nueva función" apuntando al botón Personalizar */
.home-cust-tip{display:none;align-items:center;position:relative;font-size:11.5px;font-weight:500;color:#fff;
  background:var(--navy);padding:5px 11px;border-radius:9px;white-space:nowrap;
  box-shadow:0 6px 16px -6px rgba(26,58,107,.55);animation:homeTipFloat 2.4s ease-in-out infinite}
.home-cust-tip.on{display:inline-flex}
.home-cust-tip::after{content:'';position:absolute;right:-4px;top:50%;transform:translateY(-50%) rotate(45deg);
  width:9px;height:9px;background:var(--navy);border-radius:2px}
@keyframes homeTipFloat{0%,100%{transform:translateX(0)}50%{transform:translateX(-3px)}}
@media (max-width:560px){.home-cust-tip{display:none!important}}
@media (prefers-reduced-motion:reduce){.home-cust-tip{animation:none}}
.home-module.editing{cursor:grab;border-style:dashed;border-color:var(--gray-300)}
.home-module.editing:hover{transform:none;box-shadow:var(--shadow-sm);border-color:var(--gray-300)}
.home-module.editing:active{cursor:grabbing}
.home-module.editing.dragging{opacity:.4}
.home-module.editing .home-module-ico{transform:none}
.home-module-x{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:999px;
  background:var(--gray-100);border:0;color:var(--gray-600);cursor:pointer;display:flex;align-items:center;
  justify-content:center;font-size:12px;transition:background .15s,color .15s;z-index:2}
.home-module-x:hover{background:#e5484d;color:#fff}
.home-module-add{border-style:dashed;border-color:var(--gray-300);background:transparent}
.home-module-add:hover{border-color:var(--navy-light)}
.home-module-add-ico{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:19px;background:var(--gray-100);color:var(--gray-500);transition:background .2s,color .2s}
.home-module-add:hover .home-module-add-ico{background:var(--navy-pale);color:var(--navy)}
.home-module-add-lbl{font-size:13px;font-weight:500;color:var(--gray-500)}
.home-module-add:hover .home-module-add-lbl{color:var(--navy)}
/* Picker "Agregar módulos" */
.home-picker-backdrop{position:fixed;inset:0;z-index:1300;background:rgba(15,20,35,.45);display:none;
  align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .2s ease}
.home-picker-backdrop.show{display:flex;opacity:1}
.home-picker{width:min(460px,96vw);max-height:80vh;overflow-y:auto;background:var(--white);
  border:1px solid var(--gray-100);border-radius:16px;box-shadow:var(--shadow-md);padding:6px}
.home-picker-head{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 8px}
.home-picker-title{font-size:15px;font-weight:600;color:var(--gray-900)}
.home-picker-x{background:none;border:0;color:var(--gray-500);font-size:18px;cursor:pointer;padding:4px 8px;border-radius:8px}
.home-picker-x:hover{background:var(--gray-100);color:var(--gray-900)}
.home-picker-empty{padding:24px 16px;text-align:center;color:var(--gray-500);font-size:13px}
.home-picker-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;transition:background .15s}
.home-picker-item:hover{background:var(--gray-50)}
.home-picker-ico{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;background:var(--navy-pale);color:var(--navy)}
.home-picker-info{flex:1;min-width:0}
.home-picker-nm{font-size:13.5px;font-weight:500;color:var(--gray-800)}
.home-picker-sub{font-size:11.5px;color:var(--gray-400);margin-top:1px;line-height:1.35}
.home-picker-add{display:inline-flex;align-items:center;gap:6px;background:var(--navy);color:#fff;border:0;border-radius:999px;
  padding:6px 12px;font-family:var(--font);font-size:12px;font-weight:600;cursor:pointer;flex-shrink:0;transition:background .15s}
.home-picker-add:hover{background:var(--navy-light)}
@media (prefers-reduced-motion:reduce){.home-picker-backdrop{transition:none}}

/* En MVP: tono dorado/ámbar cálido para combinar con el naranja del resto */
/* En MVP: tono terracota cálido (combina con el naranja, distinto de db/trackers/reportes) */
/* ── Fund Rising Tracker ── */
.dbx-btn.primary{background:var(--accent,#ED7824);border-color:var(--accent,#ED7824);color:#fff}
/* El :hover generico de .dbx-btn pinta el texto de var(--navy), y gana por
   venir despues con la misma especificidad. Sobre el naranja del boton
   primario eso es ilegible, y en MVP --navy ES naranja: texto naranja sobre
   fondo naranja. El primario reafirma su color propio, como ya hacia .spx. */
.dbx-btn.primary:hover{filter:brightness(1.06);color:#fff;border-color:#ED7824}
[data-org="mvp"] .dbx-btn.primary{background:#ED7824;border-color:#ED7824}
.fr-hero-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.fr-kpis,.fr-det-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:14px 0 22px}
.fr-kpi{background:var(--card,#fff);border:1px solid var(--border,#e5e9f2);border-radius:14px;padding:14px 18px}
.fr-kpi-v{font-size:22px;font-weight:800}
.fr-kpi-l{font-size:11.5px;color:var(--muted,#8a93a6);margin-top:3px}
.fr-kpi-warn .fr-kpi-v{color:#C0392B}
.fr-sec-title{font-weight:800;font-size:15px;margin:26px 0 10px;display:flex;align-items:center;gap:10px}
.fr-collapsible{cursor:pointer;user-select:none}
.fr-count{background:var(--border,#e5e9f2);border-radius:999px;font-size:11px;padding:2px 9px}
.fr-card{cursor:pointer}
.fr-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.fr-type{font-size:10px;letter-spacing:.8px;text-transform:uppercase;background:rgba(237,120,36,.13);color:#ED7824;border-radius:999px;padding:3px 10px;font-weight:700}
.fr-deadline{font-size:10.5px;color:var(--muted,#8a93a6)}
.fr-dl-soon{color:#B07D20;font-weight:700}
.fr-dl-over{color:#C0392B;font-weight:700}
.fr-progress{background:var(--border,#eef1f7);border-radius:6px;height:8px;margin:10px 0 6px;overflow:hidden}
.fr-progress-bar{height:100%;background:#2E9E5B;border-radius:6px;transition:width .5s}
[data-org="mvp"] .fr-progress-bar{background:#ED7824}
.fr-card-nums{font-size:12.5px;color:var(--muted,#6a7386)}
.fr-card-nums b{color:inherit;font-size:14px}
.fr-card-chips{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.fr-chip{font-size:11px;font-weight:800;border-radius:999px;padding:2px 9px}
.fr-chip-empty{font-size:11px;color:var(--muted,#9aa3b5)}
.fr-s1{background:rgba(46,158,91,.16);color:#217346}
.fr-s2{background:rgba(240,200,60,.22);color:#8a6d1a}
.fr-s3{background:rgba(70,130,220,.15);color:#2d5fa8}
.fr-s4{background:rgba(237,120,36,.15);color:#b35a12}
.fr-s5{background:rgba(192,57,43,.13);color:#a03024}
.fr-card-closed{font-size:12.5px;color:var(--muted,#6a7386);margin-top:8px}
.fr-det-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;flex-wrap:wrap;margin-bottom:6px}
.fr-det-actions{display:flex;gap:8px;flex-wrap:wrap}
.fr-closed-badge{font-size:10px;letter-spacing:1.2px;background:rgba(192,57,43,.12);color:#a03024;border-radius:999px;padding:3px 10px;font-weight:800;margin-left:8px}
.fr-opp-notes{font-size:12.5px;color:var(--muted,#6a7386);margin-top:6px;max-width:640px}
.fr-stage-block{margin-bottom:22px}
.fr-stage-head{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:12px 12px 0 0;font-size:13px}
.fr-stage-num{width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.10);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:11.5px}
.fr-stage-desc{font-size:11.5px;opacity:.75}
.fr-stage-sub{margin-left:auto;font-weight:800}
.fr-table{width:100%;border-collapse:collapse;background:var(--card,#fff);border:1px solid var(--border,#e5e9f2);border-top:0;border-radius:0 0 12px 12px;overflow:hidden;font-size:12.5px}
.fr-table th{font-size:10px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted,#8a93a6);text-align:left;padding:8px 10px;border-bottom:1px solid var(--border,#e5e9f2)}
.fr-table td{padding:8px 10px;border-bottom:1px solid var(--border,#eef1f7);vertical-align:middle}
.fr-table tr:last-child td{border-bottom:0}
.fr-table .n{text-align:right;white-space:nowrap}
.fr-table th.n{text-align:right}
.fr-td-name{font-weight:700}
.fr-lp{font-size:9px;letter-spacing:.5px;background:rgba(46,158,91,.16);color:#217346;border-radius:5px;padding:1.5px 6px;font-weight:800;vertical-align:middle}
.fr-late{color:#C0392B;font-weight:700}
.fr-td-notes{color:var(--muted,#8a93a6);max-width:180px}
.fr-td-act{white-space:nowrap;text-align:right}
.fr-stage-sel{font-size:11px;border:1px solid var(--border,#dfe4ee);border-radius:8px;padding:3px 5px;background:var(--card,#fff);margin-right:6px}
.fr-ico-btn{border:none;background:none;cursor:pointer;color:var(--muted,#8a93a6);padding:4px 6px;border-radius:7px}
.fr-ico-btn:hover{background:var(--border,#eef1f7);color:inherit}
.fr-ico-del:hover{color:#C0392B}
.fr-empty-line{color:var(--muted,#8a93a6);font-size:13px;padding:16px 4px}
.fr-log{background:var(--card,#fff);border:1px solid var(--border,#e5e9f2);border-radius:12px;padding:12px 16px;margin-bottom:20px;max-height:260px;overflow:auto}
.fr-log-row{font-size:12px;padding:5px 0;border-bottom:1px dashed var(--border,#eef1f7)}
.fr-log-row:last-child{border-bottom:0}
.fr-log-ts{color:var(--muted,#9aa3b5);font-size:11px;margin-right:8px}
/* Modo oscuro: los textos de estado/badges estaban fijos en tonos oscuros
   (pensados para fondo claro). Los aclaramos para que tengan contraste. */
[data-theme="dark"] .fr-late,
[data-theme="dark"] .fr-dl-over,
[data-theme="dark"] .fr-kpi-warn .fr-kpi-v,
[data-theme="dark"] .fr-ico-del:hover{color:var(--red)}
[data-theme="dark"] .fr-dl-soon{color:var(--amber)}
[data-theme="dark"] .fr-type{color:var(--navy-light)}
[data-theme="dark"] .fr-s1,[data-theme="dark"] .fr-lp{color:#5fd39a}
[data-theme="dark"] .fr-s2{color:#e6c860}
[data-theme="dark"] .fr-s3{color:#7bb0ee}
[data-theme="dark"] .fr-s4{color:#f0975a}
[data-theme="dark"] .fr-s5,[data-theme="dark"] .fr-closed-badge{color:#e87b6a}
[data-theme="dark"] .fr-stage-num{background:rgba(255,255,255,.14)}

.home-module-content{flex:0;min-width:0;width:100%}
.home-module-title{font-size:13px;font-weight:500;color:var(--gray-900);margin-bottom:3px;line-height:1.25}
.home-module-desc{font-size:10.5px;color:var(--gray-500);line-height:1.4;padding:0 2px}
.home-module-arrow{display:none}

/* Módulo deshabilitado — "próximamente" en formato grande */
.home-module.disabled{
  position:relative;
  background:var(--gray-50);
  border:1px dashed var(--gray-200);
  cursor:not-allowed;
  box-shadow:none;
}
.home-module.disabled:hover{
  transform:none;
  box-shadow:none;
  border-color:var(--gray-200);
}
.home-module.disabled .home-module-title{color:var(--gray-400)}
.home-module.disabled .home-module-desc{color:var(--gray-300)}
.home-module-badge{
  position:absolute;top:8px;right:8px;
  font-size:9px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;
  color:var(--gray-400);background:var(--white);
  border:1px solid var(--gray-200);
  padding:2px 7px;border-radius:99px;
}
[data-theme="dark"] .home-module.disabled{background:rgba(255,255,255,.02)}
[data-theme="dark"] .home-module-badge{background:rgba(255,255,255,.04)}
/* Insignia "Beta" (funciones en prueba) */
.home-module-badge.beta{color:#a15c00;background:#fdefd6;border-color:#f6d9a8}
[data-theme="dark"] .home-module-badge.beta{color:#f0b27a;background:rgba(237,120,36,.16);border-color:rgba(237,120,36,.3)}
.beta-tag{margin-left:auto;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:#a15c00;background:#fdefd6;border:1px solid #f6d9a8;padding:1px 6px;border-radius:99px}
[data-theme="dark"] .beta-tag{color:#f0b27a;background:rgba(237,120,36,.16);border-color:rgba(237,120,36,.3)}
/* Aviso 2FA (temporal) — usa tokens del tema para verse bien en los 3 modos */
.aviso2fa-h{font-size:12px;color:var(--gray-500);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin:16px 0 8px}
.aviso2fa-apps{display:flex;flex-direction:column;gap:8px}
.aviso2fa-app{display:flex;align-items:center;gap:11px;padding:11px 14px;border:1px solid var(--gray-200);border-radius:10px;color:var(--gray-800);text-decoration:none;font-size:13.5px;font-weight:500;background:var(--white);transition:border-color .15s,background .15s}
.aviso2fa-app:hover{border-color:var(--navy);background:var(--navy-ghost)}
.aviso2fa-app i{color:var(--navy);width:18px;text-align:center;font-size:15px}

/* Pulso de notificación en el módulo To Do: avisa que hay invitaciones de
   tarea por aceptar. Aro que late (radar), sutil, ease-out sin rebote.
   Usa var(--navy) → sigue el acento del org (navy/naranja) y el tema. */
.home-module-pulse{
  position:absolute;top:13px;right:13px;
  width:11px;height:11px;border-radius:999px;
  background:var(--navy);
  box-shadow:0 1px 3px rgba(26,58,107,.35);
  z-index:2;pointer-events:none;
  animation:tkPulseIn .3s cubic-bezier(.23,1,.32,1);
}
.home-module-pulse::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:var(--navy);
  animation:tkPulseRing 2.2s cubic-bezier(.23,1,.32,1) infinite;
}
@keyframes tkPulseIn{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes tkPulseRing{0%{transform:scale(1);opacity:.55}70%,100%{transform:scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){
  .home-module-pulse{animation:none}
  .home-module-pulse::after{display:none}
}

.home-soon{margin-top:8px}
.home-soon-h{
  font-size:11px;font-weight:600;color:var(--gray-400);
  text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px;
}
.home-soon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
.home-soon-item{
  display:flex;align-items:center;gap:8px;
  padding:11px 14px;
  background:var(--gray-50);border:1px dashed var(--gray-200);
  border-radius:var(--r-md);
  font-size:12px;color:var(--gray-400);
}
.home-soon-item i{font-size:13px;opacity:.7}

[data-theme="dark"] .home-hero{
  background:linear-gradient(135deg,#1f2a3d,#161e2e);
  border-color:var(--gray-200);
}
[data-theme="dark"] .home-greeting{color:var(--navy-light)}
[data-theme="dark"] .home-soon-item{background:rgba(255,255,255,.03);border-color:var(--gray-200)}

/* Hero con fondo de marca solo en modo oscuro */
[data-theme="dark"][data-org="cretum"] .home-hero{
  background:#1a3a6b;
  border-color:#2a4f8f;
}
[data-theme="dark"][data-org="cretum"] .home-greeting{color:#fff}
[data-theme="dark"][data-org="cretum"] .home-question{color:rgba(255,255,255,.75)}

[data-theme="dark"][data-org="mvp"] .home-hero{
  background:#c25f1c;
  border-color:#e0781f;
}
[data-theme="dark"][data-org="mvp"] .home-greeting{color:#fff}
[data-theme="dark"][data-org="mvp"] .home-question{color:rgba(255,255,255,.85)}

@media (max-width:600px){
  .home-hero{padding:30px 18px 24px}
  .home-greeting{font-size:21px}
  .home-modules{gap:10px}
  .home-module{width:150px;height:150px;padding:16px 12px;gap:9px}
  .home-module-ico{width:42px;height:42px;font-size:18px;border-radius:12px}
  .home-module-title{font-size:12.5px}
  .home-module-desc{font-size:10px}
}

/* ═══════════════════════════════════════════
   DROPBOX — explorador de archivos
═══════════════════════════════════════════ */
.page-dbx{display:none}
.page-dbx.active{display:block;animation:fadeIn .16s ease-out}

.dbx-toolbar{
  display:flex;align-items:center;gap:10px;
  margin-bottom:14px;flex-wrap:wrap;
}
.dbx-search{
  position:relative;flex:1;min-width:200px;
}
.dbx-search i{
  position:absolute;left:13px;top:50%;transform:translateY(-50%);
  color:var(--gray-400);font-size:13px;pointer-events:none;
}
.dbx-search input{
  width:100%;padding:10px 14px 10px 36px;
  background:var(--white);border:1px solid var(--gray-200);
  border-radius:var(--r-md);font-size:13.5px;color:var(--gray-900);
  outline:none;transition:border-color .15s,box-shadow .15s;
  font-family:var(--font);
}
.dbx-search input:focus{border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-pale)}
.dbx-search-clear{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  background:none;border:none;color:var(--gray-400);cursor:pointer;
  width:24px;height:24px;border-radius:50%;
  display:none;align-items:center;justify-content:center;font-size:11px;
  transition:background .15s;
}
.dbx-search-clear:hover{background:var(--gray-100);color:var(--gray-700)}
.dbx-search-clear.show{display:flex}

.dbx-view-toggle{display:flex;gap:2px;background:var(--gray-100);border-radius:var(--r-md);padding:3px}
.dbx-view-btn{
  padding:7px 12px;border-radius:var(--r-sm);border:none;
  background:transparent;color:var(--gray-400);cursor:pointer;transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;
}
.dbx-view-btn.on{background:var(--white);color:var(--navy);box-shadow:var(--shadow-sm)}

/* Botones de acción del toolbar (Actividad / Subir) */
.dbx-tool-btn{
  display:inline-flex;align-items:center;gap:7px;
  padding:8px 13px;border-radius:var(--r-md);cursor:pointer;
  border:1px solid var(--gray-200);background:var(--white);color:var(--gray-600);
  font-family:var(--font);font-size:12.5px;font-weight:500;
  transition:color .15s,background-color .15s,border-color .15s,box-shadow .15s;
}
.dbx-tool-btn:hover{color:var(--navy);border-color:var(--gray-300);box-shadow:var(--shadow-sm)}
.dbx-tool-btn.primary{background:var(--accent,#1a3a6b);border-color:var(--accent,#1a3a6b);color:#fff}
.dbx-tool-btn.primary:hover{opacity:.92;color:#fff}
.dbx-tool-btn:disabled{opacity:.55;cursor:default;box-shadow:none}
[data-theme="dark"] .dbx-tool-btn{background:#161616;border-color:#2a2a2a;color:#bbb}
[data-theme="dark"] .dbx-tool-btn:hover{color:#eee}
@media (max-width:600px){ .dbx-tool-btn .dbx-tool-lbl{display:none} }

/* Eliminar archivo: mismo botón de acción, en rojo solo al pasar el cursor */
.dbx-act.danger:hover{color:#e74c3c}

/* Modal: actividad de subidas */
.dbx-act-list{max-height:min(52vh,420px);overflow-y:auto;margin-top:10px;text-align:left}
.dbx-act-row{
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
  padding:8px 4px;border-bottom:1px solid var(--gray-100);font-size:12.5px;
}
.dbx-act-row:last-child{border-bottom:none}
.dbx-act-who{font-weight:500;color:var(--gray-900)}
.dbx-act-file{color:var(--navy);word-break:break-all}
.dbx-act-meta{color:var(--gray-400);font-size:11.5px;margin-left:auto;white-space:nowrap}
.dbx-act-pending{color:var(--gray-400);font-style:italic}
.dbx-act-path{
  background:none;border:none;padding:0;cursor:pointer;
  font-family:var(--font);font-size:inherit;color:var(--navy);
  text-align:left;word-break:break-all;
}
.dbx-act-path:hover{text-decoration:underline}
[data-theme="dark"] .dbx-act-path{color:#8fb4e8}
[data-theme="dark"] .dbx-act-row{border-color:#222}
[data-theme="dark"] .dbx-act-who{color:#eee}

.dbx-breadcrumb{
  display:flex;align-items:center;gap:4px;flex-wrap:wrap;
  font-size:13px;color:var(--gray-500);margin-bottom:14px;
}
.dbx-crumb{
  cursor:pointer;padding:4px 8px;border-radius:var(--r-sm);
  transition:background .15s,color .15s;
  background:none;border:none;font-family:var(--font);font-size:13px;color:inherit;
}
.dbx-crumb:hover{background:var(--gray-100);color:var(--navy)}
.dbx-crumb.last{color:var(--gray-900);font-weight:500;cursor:default}
.dbx-crumb.last:hover{background:transparent}
.dbx-crumb-sep{color:var(--gray-300);font-size:11px}

.dbx-status{
  text-align:center;padding:60px 20px;color:var(--gray-400);font-size:13px;
}
.dbx-status i{display:block;font-size:28px;margin-bottom:10px;opacity:.5}
.dbx-status.error{color:var(--red)}

/* GRID view */
.dbx-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:12px;
}
.dbx-card{
  background:var(--white);border:1px solid var(--gray-100);
  border-radius:var(--r-lg);padding:14px 12px;
  cursor:pointer;text-align:center;font-family:var(--font);
  transition:transform .18s cubic-bezier(.4,0,.2,1),box-shadow .18s,border-color .15s;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  position:relative;overflow:hidden;
}
.dbx-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(26,58,107,.12);
  border-color:var(--navy-light);
}
.dbx-card-thumb{
  width:100%;aspect-ratio:1;border-radius:var(--r-md);
  background:var(--gray-50);
  display:flex;align-items:center;justify-content:center;
  font-size:36px;color:var(--gray-300);
  overflow:hidden;position:relative;
}
.dbx-card-thumb img{
  width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .3s;
}
.dbx-card-thumb img.loaded{opacity:1}
.dbx-card-name{
  font-size:12px;color:var(--gray-900);font-weight:500;
  line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;word-break:break-word;
}
.dbx-card-meta{font-size:10.5px;color:var(--gray-400)}
.dbx-card-folder .dbx-card-thumb{
  background:linear-gradient(135deg,var(--navy-pale),var(--navy-ghost));
  color:var(--navy);
}

/* LIST view */
.dbx-list{display:flex;flex-direction:column;gap:2px}
.dbx-row{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;border-radius:var(--r-md);
  cursor:pointer;font-family:var(--font);
  transition:background .15s;
  border:1px solid transparent;
}
.dbx-row:hover{background:var(--gray-50);border-color:var(--gray-100)}
.dbx-row-ico{
  width:36px;height:36px;border-radius:var(--r-md);
  background:var(--gray-50);
  display:flex;align-items:center;justify-content:center;
  font-size:16px;color:var(--gray-400);flex-shrink:0;
  overflow:hidden;position:relative;
}
.dbx-row-ico img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s}
.dbx-row-ico img.loaded{opacity:1}
.dbx-row-folder .dbx-row-ico{
  background:var(--navy-pale);color:var(--navy);
}
.dbx-row-name{flex:1;min-width:0;font-size:13px;color:var(--gray-900);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}
.dbx-row-meta{font-size:11px;color:var(--gray-400);flex-shrink:0}

/* Acciones rápidas por archivo: copiar enlace / descargar a la PC */
.dbx-acts{display:flex;gap:3px}
.dbx-row .dbx-acts{flex-shrink:0;opacity:0;transition:opacity .15s}
.dbx-row:hover .dbx-acts{opacity:1}
.dbx-card .dbx-acts{position:absolute;top:7px;right:7px;z-index:2;opacity:0;transition:opacity .15s}
.dbx-card:hover .dbx-acts{opacity:1}
.dbx-act{background:var(--white);border:1px solid var(--gray-200);color:var(--gray-500);
  width:29px;height:29px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;font-size:12px;box-shadow:var(--shadow-sm);
  transition:color .15s,border-color .15s,background .15s,transform .12s}
.dbx-act:hover{color:var(--navy);border-color:var(--navy-light);background:var(--navy-pale)}
.dbx-act:active{transform:scale(.9)}
@media (hover:none){.dbx-row .dbx-acts,.dbx-card .dbx-acts{opacity:1}}
[data-theme="dark"] .dbx-act{background:#181818;border-color:#333;color:#bbb}
[data-theme="dark"] .dbx-act:hover{background:#22314d;border-color:var(--navy-light);color:#fff}

[data-theme="dark"] .dbx-search input{background:#0a0a0a;border-color:#2a2a2a;color:#fff}
[data-theme="dark"] .dbx-card{background:#181818;border-color:#262626}
[data-theme="dark"] .dbx-card-name{color:#eee}
[data-theme="dark"] .dbx-card-thumb{background:#0f0f0f}
[data-theme="dark"] .dbx-row:hover{background:rgba(255,255,255,.03);border-color:#262626}
[data-theme="dark"] .dbx-row-name{color:#eee}
[data-theme="dark"] .dbx-row-ico{background:#0f0f0f}

@media (max-width:600px){
  .dbx-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
  .dbx-card{padding:12px 10px}
  .dbx-toolbar{gap:8px}
  .dbx-view-toggle{order:2}
}

/* ── PREVIEW MODAL ── */
.dbx-preview{
  position:fixed;inset:0;background:rgba(0,0,0,.85);
  z-index:400;display:flex;flex-direction:column;
  opacity:0;visibility:hidden;
  transition:opacity .25s ease,visibility 0s linear .25s;
}
.dbx-preview.show{
  opacity:1;visibility:visible;
  transition:opacity .25s ease,visibility 0s linear 0s;
}
.dbx-preview-head{
  display:flex;align-items:center;gap:12px;
  padding:14px 18px;color:#fff;
  background:rgba(0,0,0,.5);backdrop-filter:blur(8px);
  flex-shrink:0;
}
.dbx-preview-name{flex:1;font-size:14px;font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dbx-preview-btn{
  background:rgba(255,255,255,.1);border:none;color:#fff;
  padding:8px 14px;border-radius:var(--r-md);cursor:pointer;
  font-size:13px;font-family:var(--font);
  display:flex;align-items:center;gap:7px;
  transition:background .15s;
}
.dbx-preview-btn:hover{background:rgba(255,255,255,.2)}
.dbx-preview-btn.icon-only{padding:8px 11px}
.dbx-preview-body{
  flex:1;display:flex;align-items:center;justify-content:center;
  overflow:auto;padding:20px;
}
.dbx-preview-body img,
.dbx-preview-body video{
  max-width:100%;max-height:100%;
  border-radius:var(--r-md);box-shadow:0 12px 40px rgba(0,0,0,.4);
}
.dbx-preview-body iframe{
  width:100%;height:100%;min-height:500px;
  background:#fff;border:none;border-radius:var(--r-md);
  box-shadow:0 12px 40px rgba(0,0,0,.4);
}
/* Visor de PDF por canvas (PDF.js) — se usa en móvil, donde el iframe no
   renderiza PDFs. Un contenedor con scroll propio que apila las páginas. */
.dbx-preview-body .dbx-pdf-scroll{
  align-self:stretch;width:100%;
  overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  padding:2px 0 20px;
}
.dbx-preview-body .dbx-pdf-scroll canvas{
  display:block;background:#fff;border-radius:6px;
  box-shadow:0 8px 30px rgba(0,0,0,.45);max-width:100%;
}
.dbx-preview-loading{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  color:rgba(255,255,255,.7);font-size:13px;
}
.dbx-preview-spinner{
  width:32px;height:32px;border:3px solid rgba(255,255,255,.2);
  border-top-color:#fff;border-radius:50%;
  animation:spin 1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.dbx-preview-unsupported{
  text-align:center;color:rgba(255,255,255,.7);
  padding:40px;max-width:380px;
}
.dbx-preview-unsupported i{font-size:42px;margin-bottom:14px;opacity:.5;display:block}
.dbx-preview-unsupported h3{color:#fff;font-size:16px;font-weight:500;margin-bottom:8px}
.dbx-preview-unsupported p{font-size:13px;line-height:1.5;margin-bottom:18px}

@media (max-width:600px){
  .dbx-preview-head{padding:12px 14px}
  .dbx-preview-btn span{display:none}
  .dbx-preview-btn{padding:8px 11px}
  .dbx-preview-body{padding:10px}
  .dbx-preview-body iframe{min-height:400px}
}

/* ═══════════════════════════════════════════
   BASE DE DATOS — vista
═══════════════════════════════════════════ */
.page-db{display:none}
.page-db.active{display:block;animation:fadeIn .16s ease-out}

/* ── MVP FUND TRACKERS ─────────────────────────────────────────── */
.page-ft{display:none}
.page-ft.active{display:block;animation:fadeIn .3s ease}
.ft-hero{
  background:linear-gradient(135deg, var(--navy-pale), var(--navy-ghost));
  border-radius:14px;padding:24px 28px;margin-bottom:20px;
  border:1px solid var(--gray-200);
}
.ft-hero-title{font-size:22px;font-weight:600;color:var(--navy);margin-bottom:6px}
.ft-hero-sub{font-size:13px;color:var(--gray-500);line-height:1.5}
.ft-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.ft-card{
  background:#fff;border:1px solid var(--gray-200);border-radius:14px;
  padding:22px 20px;cursor:pointer;transition:transform .18s ease,opacity .18s ease,color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease;
  display:flex;flex-direction:column;gap:12px;text-align:left;
}
.ft-card:hover{transform:translateY(-2px);border-color:var(--navy);box-shadow:0 6px 20px rgba(26,58,107,.08)}
.ft-card.disabled{cursor:default;opacity:.55}
.ft-card.disabled:hover{transform:none;border-color:var(--gray-200);box-shadow:none}
.ft-card-head{display:flex;align-items:center;gap:12px}
.ft-card-ico{
  width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:rgba(176,125,32,.14);color:var(--amber);font-size:18px;
}
[data-org="mvp"] .ft-card-ico{background:rgba(237,120,36,.14);color:#ED7824}
.ft-card-title{font-size:15px;font-weight:600;color:var(--gray-900)}
.ft-card-badge{
  display:inline-block;font-size:10px;font-weight:600;padding:2px 8px;border-radius:6px;
  background:var(--gray-100);color:var(--gray-500);text-transform:uppercase;letter-spacing:.4px;
}
.ft-card-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--gray-500)}
.ft-card-meta-i{display:flex;flex-direction:column;gap:1px}
.ft-card-meta-l{font-size:10.5px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.4px}
.ft-card-meta-v{font-size:13px;font-weight:500;color:var(--gray-900)}
[data-theme="dark"] .ft-card{background:var(--gray-50)}

/* Detalle del fondo — rompe el max-width del .page para que las tablas
   muestren todas las columnas sin scroll horizontal */
/* ── Direct Opportunities ── */
.do-search{max-width:340px;margin:14px 0 12px}
.do-live{font-size:9px;letter-spacing:.6px;background:rgba(46,158,91,.14);color:#217346;border-radius:999px;padding:2.5px 9px;font-weight:800;vertical-align:middle;text-transform:uppercase}
.do-live-day{background:rgba(138,147,166,.16);color:#5a6377}
.do-chip{font-size:10px;font-weight:800;border-radius:999px;padding:2px 9px}
.do-chip-a{background:rgba(46,158,91,.14);color:#217346}
.do-chip-t{background:rgba(138,147,166,.18);color:#5a6377}
.do-term td{color:var(--gray-500,#8a93a6)}
.do-dim{color:var(--gray-500,#8a93a6);font-size:11px}
.do-foot{font-size:10.5px;color:var(--gray-500,#8a93a6);line-height:1.5;margin-top:14px}
.do-back{margin-bottom:12px}
.do-logo{background:#fff;border:1px solid var(--gray-150,#e5e9f2);overflow:hidden;display:flex;align-items:center;justify-content:center}
.do-logo img{width:70%;height:70%;object-fit:contain}
.do-name-row{display:flex;align-items:center;gap:12px}
.do-name-row .ft-card-ico{width:40px;height:40px;flex:none}
.do-sec-h{font-size:13px;font-weight:800;margin:20px 0 10px;display:flex;align-items:center;gap:8px}
.do-sec-term{color:var(--gray-500,#6b7280)}
.do-count{background:var(--gray-100,#eef1f7);border-radius:999px;font-size:11px;padding:2px 9px;font-weight:700}
.do-card-term{opacity:.82}
.do-card-term .ft-card-ico{background:var(--gray-100,#eef1f7);color:var(--gray-500,#8a93a6)}
.ft-detail{display:none}
.ft-detail.show{display:block}
.ft-detail{
  width:min(1240px, calc(100vw - 40px));
  position:relative;left:50%;transform:translateX(-50%);
}
.ft-header{
  background:#fff;border:1px solid var(--gray-200);border-radius:14px;
  padding:20px 24px;margin:14px 0 18px;
}
[data-theme="dark"] .ft-header{background:var(--gray-50)}
.ft-name{font-size:20px;font-weight:600;color:var(--navy);margin-bottom:4px}
.ft-sub{font-size:12px;color:var(--gray-500);margin-bottom:14px}
.ft-stats{display:flex;gap:24px;flex-wrap:wrap}
.ft-stat-l{font-size:10.5px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
.ft-stat-v{font-size:17px;font-weight:600;color:var(--gray-900)}
.ft-header-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ft-export-btn{
  display:inline-flex;align-items:center;gap:8px;border:none;cursor:pointer;
  background:#1D6F42;color:#fff;font-family:inherit;font-size:12.5px;font-weight:600;
  padding:9px 16px;border-radius:9px;transition:background .15s;white-space:nowrap;
}
.ft-export-btn:hover{background:#175a35}
.ft-export-btn:disabled{opacity:.6;cursor:wait}
.ft-export-grp{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.ft-export-btn-pdf{background:#c0392b}
.ft-export-btn-pdf:hover{background:#a93226}
.ft-export-btn-alt{background:#6b7589;color:#fff;border:none}
.ft-export-btn-alt:hover{background:#566072}
.ft-empty{
  background:var(--gray-50);border:1px dashed var(--gray-300);border-radius:12px;
  padding:48px 24px;text-align:center;color:var(--gray-500);font-size:14px;
}
.ft-empty-ico{font-size:36px;color:var(--gray-300);margin-bottom:14px}
.ft-empty-h{font-size:16px;font-weight:600;color:var(--gray-700);margin-bottom:6px}
.moic-pos{color:#1b8a3a;font-weight:600}
.moic-neg{color:#c0392b;font-weight:600}
.moic-flat{color:var(--gray-700)}

/* Estructura de cards en selector */
.ft-card{flex-direction:row;align-items:center}
.ft-card-body{flex:1;display:flex;flex-direction:column;gap:8px}
.ft-card-sub{font-size:12px;color:var(--gray-500)}
.ft-card-chev{color:var(--gray-300);font-size:16px;transition:color .18s ease,transform .18s ease}
.ft-card:hover .ft-card-chev{color:var(--navy);transform:translateX(2px)}
.ft-card-placeholder{opacity:.7}
.ft-card-placeholder .ft-card-meta{font-style:italic}

/* Secciones y tabla del detalle */
.ft-section{
  background:#fff;border:1px solid var(--gray-200);border-radius:14px;
  padding:18px 20px;margin-bottom:18px;
}
[data-theme="dark"] .ft-section{background:var(--gray-50)}
.ft-section-title{
  font-size:13px;font-weight:600;color:var(--gray-700);
  text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;
}
.ft-table-wrap{overflow-x:auto;margin:0 -4px}
.ft-table{
  width:100%;border-collapse:collapse;font-size:12.5px;
}
.ft-table th{
  text-align:left;padding:10px 10px;font-weight:600;color:var(--gray-500);
  font-size:11px;text-transform:uppercase;letter-spacing:.3px;
  border-bottom:1px solid var(--gray-200);background:var(--gray-50);
  position:sticky;top:0;
}
[data-theme="dark"] .ft-table th{background:var(--gray-100)}
.ft-table th.ft-num,.ft-table td.ft-num{text-align:right;font-variant-numeric:tabular-nums}
.ft-co-cell{display:flex;align-items:center;gap:8px;white-space:nowrap}
.ft-row-logo{width:20px;height:20px;border-radius:5px;object-fit:contain;background:#fff;border:1px solid var(--gray-200);padding:1px;flex:none}
[data-theme="dark"] .ft-row-logo{background:#fff;border-color:var(--gray-300)}
.ft-table td{
  padding:8px 10px;border-bottom:1px solid var(--gray-100);color:var(--gray-900);
  white-space:nowrap;
}
.ft-table tr:hover td{background:rgba(26,58,107,.03)}
.ft-table .ft-total td{
  font-weight:600;background:var(--gray-50);border-top:2px solid var(--gray-200);
  border-bottom:none;
}
[data-theme="dark"] .ft-table .ft-total td{background:var(--gray-100)}
.ft-total-lbl{color:var(--navy)}

/* Pestañas del detalle de tracker + tarjetas de empresa */
.ft-tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--gray-200);flex-wrap:wrap}
.ft-tab{
  appearance:none;background:none;border:none;cursor:pointer;font-family:inherit;
  font-size:13px;font-weight:600;color:var(--gray-500);padding:9px 14px;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  display:inline-flex;align-items:center;gap:7px;transition:color .15s,border-color .15s;
}
.ft-tab:hover{color:var(--gray-700)}
.ft-tab.active{color:var(--navy);border-bottom-color:var(--navy)}
.ft-co-note{font-size:12px;color:var(--gray-500);margin-bottom:14px}
.ft-co-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:16px}
.ft-co-card{background:#fff;border:1px solid var(--gray-200);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column}
[data-theme="dark"] .ft-co-card{background:var(--gray-50)}
.ft-co-head{display:flex;align-items:center;gap:13px;margin-bottom:12px}
.ft-co-headtext{min-width:0}
.ft-co-name{font-size:16px;font-weight:700;color:var(--gray-900);line-height:1.25}
.ft-co-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.ft-co-tag{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap}
.ft-co-tag-cat{background:var(--navy-pale);color:var(--navy)}
.ft-co-tag-stage{background:var(--gray-100);color:var(--gray-700)}
.ft-co-tagline{font-size:13.5px;color:var(--gray-700);line-height:1.5;margin:0 0 14px}
.ft-co-logo{
  position:relative;flex:0 0 auto;width:52px;height:52px;border-radius:13px;
  background:#fff;border:1px solid var(--gray-200);overflow:hidden;
  display:flex;align-items:center;justify-content:center;
}
[data-theme="dark"] .ft-co-logo{background:var(--gray-100)}
.ft-co-mono{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:17px;font-weight:700;color:var(--navy);background:var(--navy-pale);letter-spacing:.5px;
}
.ft-co-logo-img{
  position:relative;width:100%;height:100%;object-fit:contain;padding:8px;
  background:#fff;border-radius:13px;
}
[data-theme="dark"] .ft-co-logo-img{background:#fff}
.ft-co-vals{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}
.ft-co-valbox{background:var(--gray-50);border-radius:11px;padding:11px 14px;display:flex;flex-direction:column;gap:3px}
[data-theme="dark"] .ft-co-valbox{background:var(--gray-100)}
.ft-co-vl{font-size:10.5px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px}
.ft-co-vv{font-size:21px;font-weight:700;color:var(--gray-900);font-variant-numeric:tabular-nums;line-height:1.1}
.ft-co-vv-now{color:var(--navy)}
.ft-co-vnote{display:flex;align-items:flex-start;gap:7px;font-size:12px;color:var(--gray-500);line-height:1.45}
.ft-co-vnote i{margin-top:2px;color:var(--gray-400)}
.ft-co-div{border:none;border-top:1px solid var(--gray-100);margin:14px 0}
.ft-co-sec{display:flex;gap:12px;margin-bottom:14px}
.ft-co-sec:last-child{margin-bottom:0}
.ft-co-sec-ico{flex:0 0 auto;width:22px;text-align:center;color:var(--navy);font-size:15px;padding-top:1px}
.ft-co-sec-body{min-width:0}
.ft-co-sec-h{font-size:14px;font-weight:700;color:var(--gray-900);margin-bottom:4px}
.ft-co-sec-t{font-size:13px;color:var(--gray-700);line-height:1.5}
.ft-co-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.ft-co-chip{font-size:12px;font-weight:500;color:var(--gray-700);background:var(--gray-100);padding:4px 11px;border-radius:999px}
.ft-co-news{display:flex;flex-direction:column;gap:8px}
.ft-co-news-it{display:block;text-decoration:none}
.ft-co-news-t{display:block;font-size:12.5px;color:var(--gray-900);line-height:1.35;font-weight:500}
.ft-co-news-it:hover .ft-co-news-t{color:var(--orange,#e8650d)}
.ft-co-news-m{display:block;font-size:11px;color:var(--gray-500);margin-top:1px}

.db-toolbar{
  display:flex;align-items:center;gap:14px;margin-bottom:16px;flex-wrap:wrap;
}
.db-title-block{
  display:flex;align-items:center;gap:8px;
  font-size:14px;font-weight:500;color:var(--navy);
  padding:7px 14px 7px 0;
}
.db-title-block i{color:var(--navy);font-size:14px}

/* Selector de columnas — checkbox list dentro del cdd panel */
.db-cols-cdd .cdd-opt{
  display:flex;align-items:center;gap:9px;
  padding:8px 12px;cursor:pointer;font-size:12.5px;
  color:var(--gray-700);user-select:none;
}
.db-cols-cdd .cdd-opt:hover{background:var(--gray-50);padding-left:12px}
.db-cols-cdd .cdd-opt input[type="checkbox"]{
  width:14px;height:14px;cursor:pointer;accent-color:var(--navy);
  margin:0;flex-shrink:0;
}
.db-cols-cdd .cdd-opt.locked{color:var(--gray-400);cursor:default}
.db-cols-cdd .cdd-opt.locked:hover{background:transparent}

/* Toolbar del column picker dentro del detalle del inversionista */
.db-pos-toolbar{
  display:flex;align-items:center;gap:12px;
  margin:18px 0 10px;
  padding-bottom:6px;
}
.db-pos-toolbar-label{
  font-size:11px;color:var(--gray-500);
  text-transform:uppercase;letter-spacing:.5px;
  flex:1;
}

/* Menú de exportar */
.db-export-cdd .cdd-opt{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--gray-700)}
.db-export-cdd .cdd-opt:hover{background:var(--gray-50);padding-left:12px}
.db-export-cdd .cdd-opt i{width:15px;text-align:center;font-size:13px}
.db-export-cdd .cdd-opt .fa-file-pdf{color:#c0392b}
.db-export-cdd .cdd-opt .fa-file-csv{color:#1d8f4e}
.db-export-cdd .cdd-opt .fa-file-excel{color:#1d6f42}

/* ── Tabla de inversionistas (vista lista con columnas) ── */
.db-list-wrap{
  background:var(--white);
  border:1px solid var(--gray-100);
  border-radius:var(--r-lg);
  overflow-x:auto;          /* scroll horizontal si las columnas no caben */
  overflow-y:visible;
  box-shadow:var(--shadow-sm);
  -webkit-overflow-scrolling:touch;
}
.db-list-table{
  width:100%;
  min-width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:13px;
  table-layout:auto;
}
.db-list-table th{
  background:var(--gray-50);
  font-weight:600;color:var(--gray-500);
  font-size:10.5px;letter-spacing:.5px;text-transform:uppercase;
  padding:11px 18px;text-align:left;
  border-bottom:1px solid var(--gray-100);
  white-space:nowrap;
  position:sticky;top:0;z-index:1;
}
.db-list-table th.num{text-align:right}
.db-list-table td{
  padding:13px 18px;
  border-bottom:1px solid var(--gray-50);
  color:var(--gray-700);
  white-space:nowrap;        /* sin truncar; si no cabe, scroll horizontal */
  vertical-align:middle;
}
.db-list-table tbody tr{cursor:pointer;transition:background .12s}
.db-list-table tbody tr:hover td{background:var(--gray-50)}
.db-list-table tbody tr:last-child td{border-bottom:none}
.db-list-table .col-name{font-weight:500;color:var(--gray-900);min-width:200px}
.db-list-table .num{
  text-align:right;font-family:var(--mono);
  color:var(--navy);font-weight:500;
}
.db-list-table .num.muted{color:var(--gray-700);font-weight:400}
.db-list-table .col-arrow{
  width:36px;text-align:center;color:var(--gray-300);font-size:11px;
  padding-left:8px;padding-right:14px;
}
.db-list-table tbody tr:hover .col-arrow{color:var(--navy)}

/* Pills dentro de las celdas */
.db-cell-pill{
  display:inline-block;
  background:var(--navy-pale);color:var(--navy);
  padding:3px 10px;border-radius:11px;
  font-size:11px;font-weight:500;
  white-space:nowrap;
}
.db-cell-pill.muted{background:var(--gray-100);color:var(--gray-700)}
.db-cell-empty{color:var(--gray-300);font-size:12px}

.db-list-empty{
  padding:36px 18px;text-align:center;
  color:var(--gray-400);font-size:13px;
}

[data-theme="dark"] .db-list-wrap{background:#0f131e;border-color:#262626}
[data-theme="dark"] .db-list-table th{background:#0a0e18;color:var(--gray-500);border-color:#262626}
[data-theme="dark"] .db-list-table td{border-color:#1a1f2e;color:var(--gray-700)}
[data-theme="dark"] .db-list-table tbody tr:hover td{background:rgba(255,255,255,.03)}
[data-theme="dark"] .db-cell-pill.muted{background:rgba(255,255,255,.05)}

.db-search{
  position:relative;flex:1;min-width:200px;
  display:flex;align-items:center;gap:10px;
}
.db-search-ico{
  position:absolute;left:11px;top:50%;transform:translateY(-50%);
  color:var(--gray-400);font-size:12px;pointer-events:none;
}
.db-search-inp{
  flex:1;padding:9px 11px 9px 32px;border:1px solid var(--gray-200);
  border-radius:var(--r-md);font-size:13px;background:var(--white);
  outline:none;color:var(--gray-900);font-family:var(--font);transition:border-color .15s;
}
.db-search-inp:focus{border-color:var(--navy)}
.db-search-inp::placeholder{color:var(--gray-300)}
.db-count{font-size:11px;color:var(--gray-400);white-space:nowrap;font-family:var(--mono);margin-left:auto}

.db-filters{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;
}

/* ── Custom dropdown (cdd) ── */
.cdd{position:relative}
.cdd-btn{
  display:flex;align-items:center;gap:7px;
  padding:0 11px;height:34px;min-width:0;max-width:220px;
  background:var(--white);border:1.5px solid var(--gray-200);
  border-radius:9px;
  font-size:12.5px;font-weight:500;color:var(--gray-700);font-family:var(--font);
  cursor:pointer;outline:none;
}
.cdd-btn:hover{border-color:var(--navy);color:var(--navy);background:var(--navy-ghost)}
.cdd.open .cdd-btn{border-color:var(--navy);color:var(--navy);background:var(--navy-ghost);box-shadow:0 0 0 3px var(--navy-pale)}
.cdd.active .cdd-btn{background:var(--navy-pale);border-color:var(--navy);color:var(--navy);font-weight:600}
.cdd-ico{font-size:11px;color:var(--gray-400);flex-shrink:0;transition:color .15s}
.cdd-btn:hover .cdd-ico,.cdd.open .cdd-ico,.cdd.active .cdd-ico{color:var(--navy)}
.cdd-label{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdd-chev{
  margin-left:4px;font-size:9px;color:var(--gray-400);
  transition:transform .2s cubic-bezier(.23,1,.32,1),color .15s;
}
.cdd.open .cdd-chev{transform:rotate(180deg);color:var(--navy)}

/* ═══ Pulido global de botones — reactivos al color de la empresa ═══
   Usan var(--navy), que MVP remapea a naranja, así un solo estilo sirve
   para ambas. Hover se tiñe del acento; al presionar se "ilumina" con un
   aro del color; foco por teclado con el mismo aro. */
.cdd-btn,.dbx-btn,.ft-export-btn,.camp-fchip,.role-switch-btn,.btn-primary,.btn-login,.camp-tab{
  transition:border-color .15s,background .15s,color .15s,box-shadow .15s,transform .08s;
}
.cdd-btn:hover,.ft-export-btn:hover{border-color:var(--navy);color:var(--navy)}
.cdd-btn:active,.dbx-btn:active,.ft-export-btn:active,.camp-fchip:active,.role-switch-btn:active{
  background:var(--navy-pale);border-color:var(--navy);color:var(--navy);
  box-shadow:0 0 0 3px var(--navy-pale);transform:translateY(1px);
}
/* El botón de borrar mantiene su rojo al presionar (no se tiñe de azul/naranja) */
.camp-btn-danger:active{
  background:rgba(192,57,43,.12);border-color:#c0392b;color:#c0392b;
  box-shadow:0 0 0 3px rgba(192,57,43,.15);transform:translateY(1px);
}
.btn-primary:active,.btn-login:active{transform:translateY(1px);filter:brightness(1.06)}
.settings-action:active{background:var(--navy-pale)}
.cdd-btn:focus-visible,.dbx-btn:focus-visible,.ft-export-btn:focus-visible,.camp-fchip:focus-visible,
.role-switch-btn:focus-visible,.btn-primary:focus-visible,.btn-login:focus-visible{
  outline:none;box-shadow:0 0 0 3px var(--navy-pale);border-color:var(--navy);
}

.cdd-panel{
  position:absolute;top:calc(100% + 6px);left:0;min-width:100%;
  background:var(--white);border:1px solid var(--gray-100);
  border-radius:11px;
  box-shadow:0 10px 30px rgba(15,23,42,.14),0 2px 8px rgba(15,23,42,.05);
  max-height:280px;overflow-y:auto;
  z-index:60;
  transform-origin:top left;          /* escala desde el trigger (Emil) */
  opacity:0;visibility:hidden;
  transform:scale(.96) translateY(-6px);
  transition:opacity .15s ease,
             transform .18s cubic-bezier(.23,1,.32,1),
             visibility 0s linear .18s;
}
.cdd.open .cdd-panel{
  opacity:1;visibility:visible;
  transform:scale(1) translateY(0);
  transition:opacity .15s ease,
             transform .18s cubic-bezier(.23,1,.32,1),
             visibility 0s linear 0s;
}
.cdd-opt{
  padding:9px 14px;
  font-size:12px;color:var(--gray-700);
  cursor:pointer;
  transition:background .12s,color .12s,padding-left .18s cubic-bezier(.23,1,.32,1);
  white-space:nowrap;
}
.cdd-opt:hover{background:var(--navy-ghost);color:var(--navy);padding-left:18px}
.cdd-opt.selected{background:var(--navy-pale);color:var(--navy);font-weight:500}
.cdd-opt.selected:hover{background:var(--navy-pale)}
/* Dropdowns de filtro con selección múltiple: checkbox a la izquierda */
.cdd-multi .cdd-opt{display:flex;align-items:center;gap:9px}
.cdd-multi .cdd-opt::before{content:'';width:15px;height:15px;flex:0 0 auto;border:1.5px solid var(--gray-300);border-radius:4px;background:#fff;transition:background .12s,border-color .12s}
.cdd-multi .cdd-opt.selected::before{background:var(--navy);border-color:var(--navy);content:'\2713';color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1}
.cdd-multi .cdd-opt[data-value=""]::before{display:none}
.cdd-multi .cdd-opt:hover{padding-left:14px}
[data-theme="dark"] .cdd-multi .cdd-opt::before{border-color:#3a3a3a;background:#0a0a0a}
[data-theme="dark"] .cdd-multi .cdd-opt.selected::before{background:var(--navy);border-color:var(--navy)}
/* Buscador dentro de un desplegable de filtro */
.cdd-search{position:sticky;top:0;background:var(--white,#fff);padding:8px;border-bottom:1px solid var(--gray-100,#eef0f5);display:flex;align-items:center;gap:6px;z-index:1}
.cdd-search i{color:var(--gray-400,#9aa3b5);font-size:11px}
.cdd-search input{border:1px solid var(--gray-200,#e0e3eb);border-radius:6px;padding:5px 8px;font-size:12.5px;width:100%;outline:none;background:var(--white,#fff);color:var(--gray-900,#1a1f2e)}
.cdd-search input:focus{border-color:var(--navy)}
.cdd-noopt{padding:10px 14px;font-size:12px;color:var(--gray-400,#9aa3b5)}
[data-theme="dark"] .cdd-search{background:#1a1a1a;border-color:#262626}
[data-theme="dark"] .cdd-search input{background:#0a0a0a;border-color:#2a2a2a;color:#ddd}

[data-theme="dark"] .cdd-btn{background:#0a0a0a;color:var(--gray-700);border-color:#2a2a2a}

/* Filtros de BD (escritorio Y móvil): botón CUADRADO con solo el ícono; al
   abrir (o cuando hay filtro activo) se expande revelando el tipo/valor del
   filtro. La etiqueta anima su max-width → la expansión se siente fluida. */
.db-cdd .cdd-btn{padding:0 11px;height:34px;gap:7px;min-width:0;max-width:none}
.db-cdd .cdd-ico{font-size:12px}
.db-cdd .cdd-label{flex:0 1 auto}            /* nombre corto, pastilla a su medida */
.db-cdd .cdd-chev{margin-left:2px}
/* Badge de conteo: aparece solo cuando el filtro está activo */
.cdd-count{
  display:none;min-width:18px;height:18px;padding:0 5px;border-radius:9px;
  background:var(--navy);color:#fff;font-size:10.5px;font-weight:700;
  font-family:var(--mono);align-items:center;justify-content:center;line-height:1;
}
.cdd.active .cdd-count{display:inline-flex}
[data-theme="dark"] .cdd-count{color:#0a0a0a}
[data-theme="dark"] .cdd.active .cdd-btn{background:var(--navy-pale)}
[data-theme="dark"] .cdd-panel{background:#1a1a1a;border-color:#262626}
[data-theme="dark"] .cdd-opt:hover{background:rgba(255,255,255,.05)}
.db-filter{
  position:relative;display:flex;align-items:center;
}
.db-filter-ico{
  position:absolute;left:11px;top:50%;transform:translateY(-50%);
  color:var(--gray-400);font-size:11px;pointer-events:none;z-index:1;
}
.db-filter-sel{
  appearance:none;-webkit-appearance:none;
  padding:8px 32px 8px 30px;border:1px solid var(--gray-200);
  border-radius:var(--r-md);font-size:12px;background:var(--white) url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%239aa3b5' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 11px center;
  color:var(--gray-700);outline:none;font-family:var(--font);cursor:pointer;
  min-width:160px;max-width:230px;
  transition:border-color .15s,background-color .15s;
}
.db-filter-sel:hover{border-color:var(--gray-300)}
.db-filter-sel:focus{border-color:var(--navy)}
.db-filter-sel.active{border-color:var(--navy);background-color:var(--navy-pale);color:var(--navy);font-weight:500}

.db-clear{
  background:none;border:1px solid var(--gray-200);color:var(--gray-500);
  padding:8px 12px;border-radius:var(--r-md);cursor:pointer;
  font-size:11px;font-family:var(--font);
  display:flex;align-items:center;gap:5px;
  transition:transform .15s,opacity .15s,color .15s,background-color .15s,border-color .15s,box-shadow .15s;
}
.db-clear:hover{border-color:var(--red);color:var(--red);background:var(--red-bg)}

[data-theme="dark"] .db-filter-sel{background-color:#0f131e;color:var(--gray-700)}
[data-theme="dark"] .db-filter-sel.active{background-color:rgba(109,146,216,.15);color:var(--navy-light)}

@media (max-width:600px){
  .db-filters{gap:8px}
  .db-filter-sel{flex:1;min-width:0;font-size:11px}
  .db-count{flex-basis:100%;text-align:right;margin-left:0;margin-top:2px}
}

.db-list{display:flex;flex-direction:column;gap:6px}
.db-row{
  display:flex;align-items:center;gap:14px;padding:12px 16px;
  background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);
  cursor:pointer;transition:transform .15s,border-color .15s,box-shadow .15s;
}
.db-row:hover{transform:translateX(3px);border-color:var(--navy-light);box-shadow:var(--shadow-sm)}
.db-row-name{flex:1;font-size:13px;font-weight:500;color:var(--gray-700);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.db-row-meta{display:flex;align-items:center;gap:14px;flex-shrink:0;font-size:11px;color:var(--gray-500)}
.db-row-amt{font-family:var(--mono);color:var(--navy);font-size:12px;font-weight:500}
.db-row-pos{background:var(--navy-pale);color:var(--navy);padding:2px 9px;border-radius:10px;font-size:10px;font-weight:500}
.db-row-tag{background:var(--green-bg);color:var(--green);padding:2px 9px;border-radius:10px;font-size:10px;font-weight:500}
.db-row-tag.priv{background:var(--amber-bg);color:var(--amber)}
.db-row-arrow{color:var(--gray-300);font-size:11px}
.db-row:hover .db-row-arrow{color:var(--navy)}

.db-loading,.db-empty,.db-error{padding:32px;text-align:center;color:var(--gray-400);font-size:13px}
.db-error{color:var(--red)}

/* Detalle */
.db-detail{display:none}
.db-detail.show{display:block;animation:fadeIn .3s ease}
.db-back{
  background:none;border:none;color:var(--navy);cursor:pointer;
  font-size:13px;padding:6px 0;margin-bottom:14px;
  display:flex;align-items:center;gap:7px;font-family:var(--font);
  transition:transform .15s;
}
.db-back:hover{transform:translateX(-3px)}
.db-detail-head{
  background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);
  padding:20px 22px;margin-bottom:14px;
}
.db-detail-name{font-size:20px;font-weight:500;color:var(--navy);margin-bottom:4px}
.db-detail-sub{font-size:12px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.5px}
.db-detail-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.db-detail-export{display:flex;gap:8px;flex-shrink:0}
.dbx-btn{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border:1.5px solid var(--gray-200,#e0e3eb);background:var(--white,#fff);color:var(--gray-700,#374151);border-radius:9px;font-size:12.5px;font-weight:600;font-family:var(--font);cursor:pointer;transition:border-color .15s,color .15s,box-shadow .15s}
.dbx-btn:hover{border-color:var(--navy);color:var(--navy);box-shadow:0 1px 5px rgba(0,0,0,.07)}
.dbx-btn.spx{background:#0f2849;border-color:#0f2849;color:#fff}
.dbx-btn.spx:hover{background:#1c4e80;border-color:#1c4e80;color:#fff}
.dbx-btn i{font-size:13px}
.dbx-btn .fa-file-excel{color:#217346}
.dbx-btn.pdf .fa-file-pdf{color:#e74c3c}
.dbx-btn.html .fa-file-code{color:#E8650D}
.db-detail-titular{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.db-detail-accounts{display:flex;align-items:center;gap:8px;margin-top:14px;flex-wrap:wrap}
.db-acct-chip{display:inline-flex;align-items:center;padding:5px 11px;border-radius:999px;background:var(--navy-pale);color:var(--navy);font-size:12.5px;font-weight:600}
.db-titular-lbl{font-size:11px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
/* Selección de inversionistas para portafolio combinado */
.db-check-col{width:34px;text-align:center;padding-left:6px!important;padding-right:0!important}
.db-row-check{width:15px;height:15px;cursor:pointer;accent-color:var(--navy)}
.db-combine-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:24px;z-index:200;display:flex;align-items:center;gap:14px;padding:11px 16px 11px 20px;background:var(--navy);color:#fff;border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.28)}
.db-combine-count{font-size:13px;font-weight:600;white-space:nowrap}
.db-combine-go{display:inline-flex;align-items:center;gap:8px;border:none;border-radius:9px;background:#fff;color:var(--navy);font-size:13px;font-weight:700;padding:8px 15px;cursor:pointer;white-space:nowrap;transition:filter .15s}
.db-combine-go:hover{filter:brightness(.95)}
.db-combine-go:disabled{opacity:.5;cursor:default}
.db-combine-clear{border:none;background:transparent;color:rgba(255,255,255,.85);font-size:12.5px;font-weight:600;cursor:pointer;padding:6px 4px}
.db-combine-clear:hover{color:#fff;text-decoration:underline}
.db-titular-inp{flex:1;min-width:200px;max-width:380px;padding:7px 11px;border:1.5px solid var(--gray-200,#e0e3eb);border-radius:8px;font-size:13.5px;color:var(--ink,#1a1f2e);background:#fff;outline:none;font-family:var(--font)}
.db-titular-inp:focus{border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-pale,rgba(26,58,107,.1))}
.db-titular-val{font-size:14px;color:var(--ink,#1a1f2e);font-weight:500}
.db-detail-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.db-stat{padding:12px 14px;background:var(--gray-50);border-radius:var(--r-md)}
.db-stat-l{font-size:10px;color:var(--gray-400);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.db-stat-v{font-size:17px;font-weight:500;color:var(--gray-900);font-family:var(--mono)}

.db-section{margin-top:18px}
.db-section-h{font-size:11px;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px}
.db-section-note{font-size:11.5px;color:var(--gray-500);line-height:1.5;margin:-4px 0 10px;max-width:780px}
/* Ficha del inversionista — reorganización 2026-10-28 */
.db-kpi-strip{grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:10px;margin:16px 0 0}
.db-kpi-strip .lp-kpi{padding:10px 12px}
.db-kpi-strip .lp-kpi-v{font-size:18px}
.lp-kpi-sub{font-size:11.5px;font-weight:500;color:var(--gray-500)}
.db-secnav{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 2px}
.db-secnav a{font-size:11.5px;padding:4px 11px;border:1px solid var(--gray-200);border-radius:999px;color:var(--gray-700);text-decoration:none;background:var(--white);transition:border-color .15s,color .15s}
.db-secnav a:hover{border-color:var(--navy);color:var(--navy)}
.db-sec-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.db-sec-row .db-section-h{margin-bottom:0}
.db-sec-row .db-pos-toolbar{margin:0;padding:0}
.db-section>.db-section-h{font-size:12px;color:var(--gray-700)}
.db-section .db-section{margin-top:10px}
.db-section .db-section>.db-section-h{font-size:11.5px;color:var(--gray-500);text-transform:none;letter-spacing:0;margin-bottom:6px}
.db-export-cdd .cdd-panel{min-width:150px;right:0;left:auto}
.db-export-cdd .cdd-opt{display:flex;align-items:center;gap:8px;padding:7px 12px;font-size:12.5px;cursor:pointer;color:var(--gray-700)}
.db-export-cdd .cdd-opt:hover{background:var(--gray-50)}
.db-export-cdd .cdd-opt i{width:14px;color:var(--gray-500)}
.db-table tr.db-row-muted td{color:var(--gray-500)}
.db-total-note{font-weight:400;font-size:10.5px;color:var(--gray-400);margin-left:6px}
/* Selector de idioma de descargables */
.xlang-ov{position:fixed;inset:0;z-index:1200;background:rgba(15,19,30,.45);display:flex;align-items:center;justify-content:center;padding:22px}
.xlang-card{background:var(--white,#fff);border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.28);padding:22px 24px;width:min(430px,100%)}
.xlang-h{font-size:12px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--gray-500);margin-bottom:14px;text-align:center}
.xlang-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.xlang-opt{border:1.5px solid var(--gray-200);background:var(--gray-50);border-radius:12px;padding:16px 12px;cursor:pointer;text-align:center;font-family:inherit;transition:border-color .15s,transform .12s}
.xlang-opt:hover{border-color:var(--accent,#E8650D);transform:translateY(-1px)}
.xlang-opt.sel{border-color:var(--accent,#E8650D);background:rgba(237,120,36,.07)}
.xlang-big{display:block;font-size:16px;font-weight:700;color:var(--gray-900);margin-bottom:3px}
.xlang-sub{display:block;font-size:11px;color:var(--gray-500)}
.info-ic{display:inline-flex;align-items:center;margin-left:5px;color:var(--gray-400);cursor:pointer;position:relative;font-size:11px;vertical-align:middle;text-transform:none;letter-spacing:0}
.info-ic:hover{color:var(--accent,#E8650D)}
.info-ic .info-pop{display:none;position:absolute;top:calc(100% + 7px);left:0;z-index:60;width:260px;max-width:78vw;background:var(--white);color:var(--gray-700);border:1px solid var(--gray-200);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.14);padding:11px 13px;font-size:11.5px;font-weight:400;line-height:1.5;text-transform:none;letter-spacing:0;white-space:normal;text-align:left}
.info-ic--right .info-pop{left:auto;right:0}
.info-ic.open .info-pop{display:block}
.info-ic .info-pop::before{content:"";position:absolute;bottom:100%;left:14px;border:6px solid transparent;border-bottom-color:var(--gray-200)}
.info-ic--right .info-pop::before{left:auto;right:14px}
[data-theme="dark"] .info-ic .info-pop{background:#1a1f2e;border-color:#2a3142;color:var(--gray-300)}
[data-theme="dark"] .info-ic .info-pop::before{border-bottom-color:#2a3142}
.db-table tr.db-total-row td{background:var(--gray-50);font-weight:600;color:var(--gray-700);border-top:1px solid var(--gray-200)}
[data-theme="dark"] .db-table tr.db-total-row td{background:#0f131e}
.db-contact{
  display:flex;align-items:center;gap:11px;padding:10px 14px;
  background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-md);margin-bottom:6px;
}
.db-contact-av{width:28px;height:28px;border-radius:50%;background:var(--navy-pale);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:500;flex-shrink:0}
.db-contact-name{font-size:13px;color:var(--gray-700);flex:1;font-weight:500}
.db-contact-mail{font-size:11px;color:var(--gray-400)}
.db-contact-inp{font-family:var(--font);border:1px solid var(--gray-200,#e0e3eb);border-radius:7px;padding:6px 9px;font-size:12.5px;color:var(--gray-700,#374151);background:var(--white,#fff);outline:none;min-width:0}
.db-contact-inp:focus{border-color:var(--navy);box-shadow:0 0 0 3px var(--navy-pale,rgba(26,58,107,.1))}
.db-contact-inp.nm{flex:1;font-weight:500}
.db-contact-inp.ml{flex:1.3}
.db-contact-del{background:none;border:none;color:var(--gray-300,#c2c8d2);cursor:pointer;font-size:13px;padding:4px 6px;flex-shrink:0}
.db-contact-del:hover{color:#c0392b}

.db-table{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;background:var(--white);border:1px solid var(--gray-100);border-radius:var(--r-lg);overflow:hidden}
.db-table th{background:var(--gray-50);font-weight:500;color:var(--gray-500);font-size:11px;text-transform:uppercase;letter-spacing:.4px;padding:10px 12px;text-align:left;border-bottom:1px solid var(--gray-100)}
.db-table td{padding:10px 12px;color:var(--gray-700);border-bottom:1px solid var(--gray-50)}
.db-table tr:last-child td{border-bottom:none}
.db-table tr:hover td{background:var(--gray-50)}
.db-table .num{text-align:right;font-family:var(--mono)}

[data-theme="dark"] .db-table tr:hover td{background:rgba(255,255,255,.03)}
[data-theme="dark"] .db-table th{background:#0f131e}

@media (max-width:600px){
  .db-toolbar{gap:10px}
  .db-search{flex-basis:100%}
  /* Los filtros usan el mismo botón cuadrado de ícono que en escritorio
     (definido abajo sin media-query); aquí solo bajamos un poco el tamaño. */
  .db-detail-stats{grid-template-columns:repeat(2,1fr)}
  .db-detail-head{padding:16px}
  .db-detail-export{width:100%}
  .db-detail-export .dbx-btn{flex:1;justify-content:center}
  .db-row{padding:11px 13px;gap:10px}
  .db-row-meta{gap:9px}
  /* La sección lleva el scroll horizontal; la tabla sigue normal (width:100%):
     se ve completa cuando es angosta y se desliza dentro de la sección cuando
     es ancha. (Volvimos de display:block, que rompía el render en móvil.) */
  .db-section{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .db-table{font-size:11px}
  /* nowrap: las celdas no se parten, la tabla se ensancha y se DESLIZA dentro
     de la sección para ver TODAS las columnas (Serie, Acciones, PPS, Carta…) */
  .db-table th,.db-table td{padding:8px 9px;white-space:nowrap}
  .db-table .hide-mobile{display:table-cell}
  /* Texto chico de etiquetas: un punto más legible en teléfono */
  .tk-stat-l,.tk-group-n,.db-stat-l{font-size:10.5px}
}

/* ═══════════════════════════════════════════
   ANIMACIONES
═══════════════════════════════════════════ */
@keyframes taskIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes slideDown{from{transform:translateY(-100%)}to{transform:translateY(0)}}
@keyframes pop{0%{transform:scale(1)}50%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(176,125,32,.4)}70%{box-shadow:0 0 0 8px rgba(176,125,32,0)}100%{box-shadow:0 0 0 0 rgba(176,125,32,0)}}

/* Header desliza desde arriba */
.header{animation:slideDown .4s cubic-bezier(.4,0,.2,1)}

/* Página fade-in — corto y sin retardo (cambio de vista es frecuente) */
.page{animation:fadeIn .16s ease-out}

/* Login box entrada elegante */
.login-box{animation:slideUp .5s cubic-bezier(.23,1,.32,1)}
.login-logo{transition:transform .35s cubic-bezier(.23,1,.32,1)}
.login-box:hover .login-logo{transform:scale(1.04)}
.login-err{animation:shake .35s cubic-bezier(.36,.07,.19,.97)}

/* Sin animación de entrada: la lista se re-renderiza en cada acción y el
   "settle" de .4s con rebote se sentía lento. Aparecen al instante. */

/* Hover lifts coherentes */
.list-item{transition:transform .18s cubic-bezier(.4,0,.2,1),box-shadow .18s,border-color .15s}
.list-item:hover{transform:translateX(3px);box-shadow:var(--shadow-sm);border-color:var(--gray-200)}
.kb-card{transition:transform .22s cubic-bezier(.4,0,.2,1),box-shadow .22s,border-color .15s}
.kb-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(26,58,107,.13);border-color:var(--navy-light)}
.tl-item{transition:transform .18s cubic-bezier(.4,0,.2,1),border-color .15s,box-shadow .18s}
.tl-item:hover{transform:translateX(3px);box-shadow:var(--shadow-sm);border-color:var(--gray-200)}

/* Stats con hover lift */
.tk-stat{transition:transform .2s cubic-bezier(.4,0,.2,1),box-shadow .2s,border-color .15s}
.tk-stat:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--navy-pale)}
.tk-stat-n{transition:color .25s}

/* Botones con press */
.add-btn,.btn-login,.modal-btn,.inv-accept,.inv-decline{transition:transform .14s cubic-bezier(.4,0,.2,1),box-shadow .14s,background .14s,filter .14s}
.add-btn:active,.btn-login:active,.modal-btn:active,.inv-accept:active,.inv-decline:active{transform:scale(.97)}
.add-btn:hover,.btn-login:hover{box-shadow:0 4px 12px rgba(26,58,107,.25)}
.modal-ok:hover{box-shadow:0 4px 12px rgba(192,57,43,.3)}
.kb-action{transition:transform .14s cubic-bezier(.4,0,.2,1),background .14s,color .14s}
.kb-action:active{transform:scale(.98)}

/* Toggle/view buttons */
.tk-tog-btn,.tk-view-btn,.type-tab{transition:color .13s,background .13s,border-color .13s,box-shadow .13s}
.type-tab:active{transform:scale(.96)}


/* Checkbox pop al marcar */
.li-chk{transition:transform .14s cubic-bezier(.4,0,.2,1),border-color .14s,background .14s}
.li-chk:hover{border-color:var(--navy);transform:scale(1.08)}
.li-chk.on{animation:pop .22s ease-out}

/* Drawer expand/collapse suave */
.drawer-body{display:block;max-height:0;overflow:hidden;padding:0 16px;border-top:0 solid var(--gray-100);transition:max-height .24s cubic-bezier(.4,0,.2,1),padding .2s ease,border-top-width .2s}
.drawer-body.open{max-height:600px;padding:16px;border-top-width:1px}
.assign-body{display:block;max-height:0;overflow:hidden;padding:0 16px;border-top:0 solid var(--amber);background:white;transition:max-height .24s cubic-bezier(.4,0,.2,1),padding .2s ease,border-top-width .2s}
.assign-body.open{max-height:600px;padding:16px;border-top-width:1px}

/* Sync indicator saving — pulse ring */
.sync-dot.saving{animation:pulseRing 1.4s infinite}

/* Settings popup: animación via transitions con transform-origin (ver arriba) */

/* Reminder banner entrada */
.reminder{animation:taskIn .2s ease-out}

/* Invite */
.tk-invite{animation:taskIn .2s ease-out;transition:transform .16s,box-shadow .16s}
.tk-invite:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}

/* Backdrop fade */
.modal-backdrop.show{backdrop-filter:blur(2px)}

/* Toast deslizamiento más suave */
.toast{transition:transform .35s cubic-bezier(.23,1,.32,1),opacity .25s}

/* Lupa de búsqueda: tinte de color al focus (sin scale) */
.db-search-ico{transition:color .3s}
.db-search:focus-within .db-search-ico{color:var(--navy)}

/* ═══════════════════════════════════════════
   TRANSICIÓN ENTRE EMPRESAS
═══════════════════════════════════════════ */
.org-transition{
  position:fixed;inset:0;z-index:500;
  display:flex;align-items:center;justify-content:center;
  pointer-events:none;opacity:0;
  clip-path:circle(0% at 50% 50%);
  transition:opacity .35s cubic-bezier(.4,0,.2,1),
             clip-path .55s cubic-bezier(.65,0,.35,1);
}
.org-transition.show{opacity:1;clip-path:circle(150% at 50% 50%)}
.org-trans-cretum{background:#fff}
.org-trans-mvp{background:#150B00}
.org-transition-logo{
  width:180px;max-width:55%;max-height:35%;
  transform:scale(.5) rotate(-12deg);
  transition:transform .5s cubic-bezier(.23,1,.32,1) .1s;
}
.org-trans-cretum .org-transition-logo{
  filter:drop-shadow(0 0 32px rgba(61,125,240,.35)) drop-shadow(0 8px 24px rgba(26,58,107,.18));
}
.org-trans-mvp .org-transition-logo{
  filter:drop-shadow(0 0 38px rgba(237,120,36,.55)) drop-shadow(0 8px 24px rgba(0,0,0,.4));
}
.org-transition.show .org-transition-logo{transform:scale(1) rotate(0)}
[data-theme="dark"] .org-trans-cretum{background:#0a0a0a}
[data-theme="dark"] .org-trans-cretum .org-transition-logo{
  filter:drop-shadow(0 0 36px rgba(123,168,255,.55)) drop-shadow(0 8px 24px rgba(0,0,0,.5));
}

/* ═══════════════════════════════════════════
   RESPONSIVE — tablets y celulares
═══════════════════════════════════════════ */

/* Touch devices: sin hover, mostrar siempre el botón de borrar */
@media (hover:none){
  /* Sin hover en táctil: revela los controles que se escondían al no poder pasar el mouse */
  .kb-del{opacity:1}
  .camp-row-acts{opacity:1}
  .camp-mth-del{opacity:.6}
  .kb-card:hover{transform:none}
  .list-item:hover,.tl-item:hover{transform:none}
  .tk-stat:hover{transform:none}
  /* Áreas de toque más grandes (los íconos eran muy chicos para el dedo) */
  .li-chk{width:22px;height:22px}
  .li-del,.camp-row-act,.ctbl-act,.db-contact-del,.kb-del{
    display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:34px;
  }
}

/* Tablets */
@media (max-width:768px){
  .page{padding:18px 16px}
  .kanban-view{grid-template-columns:1fr;gap:14px}
  .tk-stats{grid-template-columns:repeat(2,1fr)}
  .header-title{font-size:13px}
  /* Móvil: sin blur (se recalcula por frame durante el scale-in y penaliza) → fondo sólido */
  .settings-pop{right:16px;width:260px;background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}
  [data-theme="dark"] .settings-pop{background:#18181b}
}

/* ── Tareas en dispositivos táctiles (teléfono/tablet), sin depender del ancho ──
   Fila aireada estilo Todoist/Things + deslizar para completar/borrar. */
@media (pointer:coarse){
  .list-item{
    flex-wrap:wrap;align-items:flex-start;
    gap:0 12px;padding:14px 42px 14px 14px;position:relative;
    background:var(--white);z-index:1;           /* opaco: tapa el fondo de acción del swipe */
    touch-action:pan-y;   /* CLAVE: deja el scroll vertical al navegador y el gesto horizontal a la app (si no, el navegador cancela el arrastre) */
  }
  [data-theme="dark"] .list-item{background:#1a1a1a}
  .li-chk{width:24px;height:24px;border-radius:7px;font-size:12px;margin-top:1px}
  .list-item > .li-name,          /* simples */
  .list-item > .li-body{          /* progreso */
    flex:1 1 auto;min-width:0;
  }
  .li-name{font-size:14.5px;line-height:1.35;color:var(--gray-900);white-space:normal;overflow-wrap:anywhere}
  .li-meta{                       /* meta en su propia línea, bajo el título (36px = chk 24 + gap 12) */
    flex-basis:100%;justify-content:flex-start;
    margin-top:9px;padding-left:36px;gap:6px 10px;
  }
  .li-created,.li-due,.li-prio,.li-tag{font-size:11px}
  .li-prio{padding:2px 9px}
  .li-prog{margin-top:7px;font-size:12px}
  .li-prog-bar{flex:1;width:auto;max-width:200px;height:6px}
  .li-inc{flex-basis:100%;justify-content:flex-start;margin-top:2px}
  .li-inc input{width:84px!important;padding:7px 10px!important;font-size:14px!important}
  .li-inc .sm-btn{padding:7px 12px;font-size:13px}
  .li-del{position:absolute;top:11px;right:10px;font-size:16px;padding:4px;color:var(--gray-300)}

  /* Deslizar: derecha = completar (verde) · izquierda = borrar (rojo) */
  .li-wrap{overflow:hidden}
  .li-wrap.sw-right{background:var(--green)}
  .li-wrap.sw-left{background:var(--red)}
  .li-wrap.sw-right::before{
    content:"✓  Completar";position:absolute;inset:0;display:flex;align-items:center;
    padding-left:22px;color:#fff;font-weight:600;font-size:13px;letter-spacing:.2px;
  }
  .li-wrap.sw-left::after{
    content:"Eliminar  🗑";position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;
    padding-right:22px;color:#fff;font-weight:600;font-size:13px;letter-spacing:.2px;
  }
  /* La fila se desliza sobre el fondo de acción */
  .li-wrap .list-item{will-change:transform}
  /* En táctil no hay hover-nudge que estorbe el gesto */
  .list-item:hover{transform:none}
}

/* Celulares */
@media (max-width:480px){
  body{font-size:13px}

  /* Header compacto */
  .header{padding:0 14px;height:52px;gap:8px}
  #app{padding-top:52px}   /* compensa el header fixed en móvil */
  .header-mark{width:32px;height:32px;padding:4px}
  .header-brand{padding:3px 11px 3px 3px;gap:6px}
  .header-mark{width:28px;height:28px;padding:3px}
  .header-title{font-size:11px;letter-spacing:.2px;white-space:nowrap}
  .header-sync{bottom:calc(64px + env(safe-area-inset-bottom,0px));left:14px}   /* encima del Reportar (móvil) */
  .header-sys{padding:4px 9px;font-size:10px;gap:4px}
  .header-sys span{display:none}
  .header-user{padding:4px 10px 4px 4px;gap:6px}
  .header-user span{display:none}
  .header-user .chev{display:none}
  .header-av{width:26px;height:26px;font-size:10px}

  /* Página */
  .page{padding:14px 12px}

  /* Topbar: toggle arriba, vistas abajo */
  .tk-topbar{gap:8px}
  .tk-toggle{flex:1}
  .tk-tog-btn{flex:1;padding:7px 10px;font-size:12px;justify-content:center}
  .tk-view-toggle{margin-left:0;flex-basis:100%;width:100%}
  .tk-view-btn{flex:1;padding:8px}

  /* Stats 2×2 con números más pequeños */
  .tk-stats{gap:8px;margin-bottom:14px}
  .tk-stat{padding:10px 12px}
  .tk-stat-n{font-size:19px}
  .tk-stat-l{font-size:10px}

  /* Kanban una columna */
  .kanban-view{grid-template-columns:1fr;gap:12px}
  .kb-card{padding:10px 11px;padding-right:30px}
  .kb-del{opacity:1;font-size:13px;padding:4px 7px}
  .kb-card-name{font-size:13px}
  .kb-action{padding:8px}

  /* (El rediseño de la fila de tareas y el swipe viven en @media (pointer:coarse)
     para que apliquen en cualquier teléfono/tablet táctil, sin depender del ancho.) */

  /* Timeline */
  .tl-items{padding-left:14px}
  .tl-item{padding:9px 11px;flex-wrap:wrap}
  .tl-name{font-size:13px}
  .tl-side{flex-direction:row;flex-wrap:wrap;width:100%;justify-content:flex-end;margin-top:6px;gap:5px}

  /* Invites */
  .tk-invite{flex-wrap:wrap;padding:11px 13px;gap:8px}
  .tk-invite-info{flex:1 1 100%;order:1}
  .inv-accept,.inv-decline{flex:1;order:2}

  /* Login centrado y full-width */
  .login-box{width:calc(100% - 28px);max-width:380px;padding:32px 26px}
  .login-title{font-size:19px}

  /* Modal full-width con margen */
  .modal-box{width:calc(100% - 28px);padding:26px 22px}
  .modal-title{font-size:15px}
  .modal-msg{font-size:13px;margin-bottom:18px}
  .modal-btn{padding:10px 18px;flex:1}
  .modal-actions{flex-direction:row;gap:8px}

  /* Menú de cuenta en móvil: tarjeta cómoda bajo el header, ancho completo con
     márgenes; entra bajando desde arriba (no desde la esquina) y scrollea
     internamente sin arrastrar la página detrás. No invasivo. */
  .settings-pop{
    left:10px;right:10px;width:auto;top:56px;
    max-height:calc(100dvh - 66px);
    transform-origin:top center;transform:translateY(-8px) scale(.995);
    -webkit-overflow-scrolling:touch;
  }
  .settings-pop.show{transform:translateY(0) scale(1)}

  /* Drawers (forms) — apilar date + prioridad */
  .drawer-btn,.assign-btn{padding:11px 14px;font-size:12px}
  .f-row{flex-direction:column;gap:7px}
  .f-row>*{width:100% !important;flex:none !important;text-align:left !important}
  .f-row input[type=date],.f-row select{padding:9px 11px}
  .add-btn{padding:11px;font-size:13px}

  /* Team list */
  .team-item{padding:11px 13px;gap:9px}
  .team-av{width:30px;height:30px;font-size:10px}
  .team-name{font-size:12px;line-height:1.35}
  .team-sub{font-size:10px;line-height:1.3}
  .team-status{font-size:9px;padding:3px 8px;gap:4px}
  .team-status i{font-size:8px}
  .team-del{font-size:13px;padding:5px 7px}
  .team-prog-bar{max-width:110px}
  .team-prog-lbl{font-size:9px}

  /* Toast más ancho */
  .toast{bottom:14px;right:12px;left:12px;justify-content:center;font-size:12px}

  /* Reminder banner — más compacto */
  .reminder{padding:12px 14px;gap:10px}
  .reminder-icon{width:32px;height:32px;font-size:13px}
  .reminder-txt{font-size:11px;line-height:1.5}

  /* Progress bar de tarjetas kanban más corta */
  .li-prog-bar{width:50px}
}

/* Pantallas muy chicas (≤360px, iPhone SE) */
@media (max-width:360px){
  .login-box{padding:26px 20px}
  .tk-stats{grid-template-columns:repeat(2,1fr)}
  .tk-stat-n{font-size:17px}
  .kb-card-name{font-size:12px}
  .header-title{display:none}
  .header-brand{padding:3px}
}