/* Componentes propios (desplegable, selector de mes, calendario). Usan las variables de cada página. */
.ui-dd{position:relative;display:block;width:100%}
.ui-hidden{position:absolute!important;opacity:0;pointer-events:none;width:1px;height:1px;left:0;bottom:0;border:0;padding:0}
.ui-btn{width:100%;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;font:inherit;font-size:16px;cursor:pointer;text-align:left}
.ui-btn:hover,.ui-btn[aria-expanded=true]{border-color:var(--ink)}
.ui-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ui-car{font-size:11px;color:var(--muted);flex:none}
.ui-lab{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-pop{position:absolute;top:calc(100% + 6px);left:0;min-width:100%;z-index:40;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.2);padding:6px;max-height:320px;overflow:auto}
.ui-pop[hidden]{display:none}
.ui-opt{padding:10px 12px;border-radius:9px;cursor:pointer;font-weight:600;font-size:15px;white-space:nowrap;display:flex;justify-content:space-between;gap:14px}
.ui-opt:hover,.ui-opt.act{background:var(--soft)}
.ui-opt[aria-selected=true]{background:var(--ink);color:var(--bg)}
.ui-cal{padding:12px;min-width:280px;max-height:none;overflow:visible}
.ui-cal-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.ui-cal-h b{font-weight:800;font-size:15px}
.ui-nav{border:1px solid var(--line);background:var(--card);color:var(--ink);width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:16px;font-family:inherit}
.ui-nav:hover{border-color:var(--ink)}
.ui-grid{display:grid;gap:4px}
.ui-grid.m{grid-template-columns:repeat(3,1fr)}
.ui-grid.d{grid-template-columns:repeat(7,1fr)}
.ui-wd{font-size:12px;font-weight:700;color:var(--muted);text-align:center;padding:4px 0}
.ui-cell{border:0;background:none;color:var(--ink);font:inherit;font-weight:600;font-size:14px;padding:9px 0;border-radius:9px;cursor:pointer;text-align:center}
.ui-cell:hover{background:var(--soft)}
.ui-cell.today{box-shadow:inset 0 0 0 1.5px var(--muted)}
.ui-cell[aria-pressed=true]{background:var(--ink);color:var(--bg)}
.ui-cell:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.ui-cell.blank{visibility:hidden}
.ui-foot{display:flex;justify-content:flex-end;margin-top:8px}
.ui-link{border:0;background:none;color:var(--ink);font:inherit;font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline}

/* Caja de usuario en el header: "Hola, X" + icono de cerrar sesión */
.userbox{display:flex;align-items:center;gap:10px;font-size:15px;flex:none}
.ub-hi{color:var(--muted);font-weight:600}
.ub-hi strong{color:var(--ink);font-weight:800}
.ub-out{width:40px;height:40px;display:grid;place-items:center;padding:0;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:12px;cursor:pointer}
.ub-out:hover{border-color:var(--ink);background:var(--ink);color:var(--bg)}
.ub-out:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media(max-width:560px){.ub-hi{display:none}}

/* Botón de modo claro/oscuro: circular, el sol se vuelve luna, y al pasar el cursor gira (como en Chilcano Web) */
:root{--curva:cubic-bezier(.4,0,.2,1);--curva-salto:cubic-bezier(.34,1.4,.64,1);--accent:var(--ink)}
.themebtn{width:40px;height:40px;display:grid;place-items:center;padding:0;flex:none;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:50%;cursor:pointer;transition:border-color .2s ease,transform .3s var(--curva-salto)}
.themebtn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.sol-y-luna{width:20px;height:20px;stroke-width:2;stroke-linecap:round;fill:none}
.sol-y-luna-sol{fill:currentColor;stroke:none}
.sol-y-luna-luna circle{transform:translateX(0);transition:transform .5s var(--curva)}
.sol-y-luna-sol{transform-origin:50% 50%;transition:transform .5s var(--curva-salto)}
.sol-y-luna-rayos{transform-origin:50% 50%;transition:transform .5s var(--curva-salto),opacity .2s ease}
:root[data-theme="dark"] .sol-y-luna-luna circle{transform:translateX(-8px)}
:root[data-theme="dark"] .sol-y-luna-sol{transform:scale(1.12)}
:root[data-theme="dark"] .sol-y-luna-rayos{opacity:0;transform:rotate(-60deg) scale(.4)}
.themebtn.floating{position:fixed!important;top:16px;right:16px;z-index:40}

/* Botones: al pasar el cursor, un relleno gris crece en círculo desde la esquina inferior izquierda hacia la superior derecha */
:root{--hv-solid:#4a4a4a;--hv-soft:#d6d6d6}
:root[data-theme="dark"]{--hv-solid:#a3a3a3;--hv-soft:#2c2c2c}
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go){position:relative;overflow:hidden;isolation:isolate}
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go)::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--hv-soft);clip-path:circle(0% at 0% 100%);transition:clip-path .5s ease;pointer-events:none}
:is(.btn:not(.ghost),button.primary,#go)::before{background:var(--hv-solid)}
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go):not(:disabled):hover::before{clip-path:circle(150% at 0% 100%);transition:clip-path .95s cubic-bezier(.4,0,.2,1)}
/* el fondo de siempre se mantiene: solo cambia el relleno que crece */
:is(.mark,.dl,.ub-out,.themebtn,.iconbtn,.btn.ghost,.ui-nav,.linkrow button):hover{background:var(--card)!important;color:var(--ink)!important}
@media (prefers-reduced-motion:reduce){:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go)::before{transition:none}}

/* Hover: el botón se levanta un poco y proyecta una sombra suave */
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go){transition:transform .3s ease,box-shadow .3s ease,border-color .2s ease}
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go):not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.16)}
:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go):not(:disabled):active{transform:translateY(0);box-shadow:0 2px 6px rgba(0,0,0,.16);transition-duration:.08s}
:root[data-theme="dark"] :is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go):not(:disabled):hover{box-shadow:0 10px 24px rgba(0,0,0,.65)}
@media (prefers-reduced-motion:reduce){:is(.btn,.mark,.dl,.ub-out,.themebtn,.iconbtn,.ui-nav,button.primary,.linkrow button,#go):hover{transform:none}}

/* Texto de los botones en peso normal (sin negrita) */
:is(.btn,.mark,.dl,button.primary,#go,.linkrow button,.seg button,.again,#copy,.ui-link){font-weight:400!important}

/* ═════════ Modo oscuro al estilo Chilcano Web: fondos negro-violeta, bordes lila y cian como acento ═════════ */
:root[data-theme="dark"]{
  --bg:#0A0B14; --card:#111323; --soft:#181B33; --line:#25294A;
  --ink:#FFFFFF; --muted:#BABBBD; --accent:#00FFFF;
  --hv-soft:#1E2242; --hv-solid:#302C2D;
}
:root[data-theme="dark"] input:focus-visible,:root[data-theme="dark"] button:focus-visible,:root[data-theme="dark"] a:focus-visible,
:root[data-theme="dark"] .ui-btn:focus-visible,:root[data-theme="dark"] .ui-cell:focus-visible{outline-color:var(--accent)}
:root[data-theme="dark"] .item a.open{border-bottom-color:var(--accent)}
:root[data-theme="dark"] .status.prog{border-color:var(--accent);color:var(--accent)}
:root[data-theme="dark"] .live i{background:var(--accent)}
:root[data-theme="dark"] .bar i{background:var(--accent)}
:root[data-theme="dark"] .drop:hover,:root[data-theme="dark"] .drop.over{border-color:var(--accent);color:var(--accent)}
:root[data-theme="dark"] .site-f{background:#07080F;border-top-color:var(--line)}

/* ─── Hovers que rotan y crecen (solo en modo oscuro, como en Chilcano Web) ─── */
:root[data-theme="dark"] :is(.ub-out svg,.site-f-logo,.brands img,.fthumb,.logos img,.kpi .n,.navlinks a){transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
:root[data-theme="dark"] .ub-out:hover svg{transform:translateX(3px) scale(1.1)}
:root[data-theme="dark"] .ub-out:hover{border-color:var(--accent)!important}
:root[data-theme="dark"] .brands a:hover img{transform:rotate(-4deg) scale(1.12);opacity:1}
:root[data-theme="dark"] .site-f-logo:hover{transform:rotate(-3deg) scale(1.07)}
:root[data-theme="dark"] .logos img:hover,:root[data-theme="dark"] .site-h-in img:hover{transform:rotate(-2deg) scale(1.05)}
:root[data-theme="dark"] .fthumb:hover{transform:rotate(-7deg) scale(1.1);border-color:var(--accent)}
:root[data-theme="dark"] .kpi{transition:transform .35s cubic-bezier(.34,1.56,.64,1),border-color .25s ease,box-shadow .35s ease}
:root[data-theme="dark"] .kpi:hover .n{transform:rotate(-3deg) scale(1.08);transform-origin:left center}
:root[data-theme="dark"] .navlinks a:hover{transform:rotate(-2deg);color:var(--ink)}
:root[data-theme="dark"] .navlinks a[aria-current=page]:hover{transform:none}
:root[data-theme="dark"] :is(.card.item,.kpi,.panel){transition:transform .35s cubic-bezier(.34,1.56,.64,1),border-color .25s ease,box-shadow .35s ease}
:root[data-theme="dark"] :is(.card.item,.kpi,.panel):hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 14px 34px rgba(0,255,255,.07),0 10px 30px rgba(0,0,0,.55)}
@media (prefers-reduced-motion:reduce){
  :root[data-theme="dark"] :is(.themebtn:hover svg,.ub-out:hover svg,.brands a:hover img,.site-f-logo:hover,.logos img:hover,.fthumb:hover,.kpi:hover .n,.navlinks a:hover,.card.item:hover,.kpi:hover,.panel:hover){transform:none}
}

/* Relleno más oscuro (gris carbón): en los botones claros del modo oscuro el texto pasa a blanco al llenarse */
:root[data-theme="dark"] :is(.btn:not(.ghost),button.primary,#go):not(:disabled):hover{color:#fff;transition:transform .3s ease,box-shadow .3s ease,border-color .2s ease,color .3s ease .4s}

/* El botón de tema gira en lugar de levantarse (como el de Chilcano Web) */
.themebtn::before{display:none!important}
.themebtn:hover{transform:rotate(18deg)!important;box-shadow:none!important;border-color:var(--accent)!important;background:transparent!important}
.themebtn:active{transform:rotate(36deg)!important}
@media (prefers-reduced-motion:reduce){.themebtn:hover{transform:none!important}}

/* Carga sin saltos: el contenido aparece con un fundido cuando todo está listo; el header y el footer están siempre */
main{transition:opacity .3s ease}
html:not(.ready) main{opacity:0}
.userbox{min-height:40px;min-width:132px;justify-content:flex-end}
@media(max-width:560px){.userbox{min-width:40px}}
@media (prefers-reduced-motion:reduce){main{transition:none}}

/* Header: texto de los botones de navegación en peso normal y un poco más pequeño */
.navlinks a{font-weight:400!important;font-size:14px!important}
.ub-hi{font-size:14px}
.ub-hi strong{font-weight:600}

/* Botones con colores menos intensos (sin negro/blanco puros) */
:root{--btn-fill:#27272c;--btn-on:#f1f1f3;--btn-line:#c9c9cf;--btn-text:#3d3d44}
:root[data-theme="dark"]{--btn-fill:#4A4F8C;--btn-on:#F1F2FA;--btn-line:#363B66;--btn-text:#D2D4E6}
:is(.btn:not(.ghost),button.primary,#go){background:var(--btn-fill);border-color:var(--btn-fill);color:var(--btn-on)}
:is(.btn.ghost,.mark,.dl,.ub-out,.iconbtn,.ui-nav,#copy,.themebtn){border-color:var(--btn-line);color:var(--btn-text)}
:is(.btn.ghost,.mark,.dl,.ub-out,.iconbtn,.ui-nav,#copy):hover{border-color:var(--btn-text)!important}
.seg button[aria-pressed=true],.navlinks a[aria-current=page]{background:var(--btn-fill);color:var(--btn-on)}
.mark.undo{color:var(--btn-text);opacity:.85}

/* "Subiendo…": el degradé de Update (cian → violeta → magenta) se desplaza de lado a lado mientras dura la carga.
   Va por especificidad (#send) y NO con !important: lo importante anula las animaciones. */
#send.uploading,#send.uploading:disabled{opacity:1;cursor:progress;color:#000;border-color:transparent;
  background:linear-gradient(90deg,#29D7FC 0%,#6D95F7 18%,#B053F3 36%,#F411EE 50%,#B053F3 64%,#6D95F7 82%,#29D7FC 100%);background-size:300% 100%;animation:upload-sweep 2.6s ease-in-out infinite alternate}
@keyframes upload-sweep{from{background-position:0% 50%}to{background-position:100% 50%}}
@media (prefers-reduced-motion:reduce){#send.uploading{animation:none}}

/* Enviar: más oscuro también cuando está desactivado (antes se veía muy lavado) */
button.primary:disabled:not(.uploading){opacity:.72}

/* Reloj de arena clásico en "Subiendo…": la arena cae y, al vaciarse, el reloj se voltea */
.hg{width:22px;height:22px;vertical-align:-6px;margin-right:9px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;animation:hg-flip 3s cubic-bezier(.65,0,.25,1) infinite}
.hg-top,.hg-bottom{fill:currentColor;stroke:none;transform-box:view-box}
.hg-top{transform-origin:12px 11.4px;animation:hg-top 3s linear infinite}
.hg-bottom{transform-origin:12px 18.6px;animation:hg-bottom 3s linear infinite}
.hg-stream{stroke-width:1.2;stroke-dasharray:2 2;animation:hg-stream 3s linear infinite,hg-fall .5s linear infinite}
@keyframes hg-top{0%{transform:scale(1)}80%,100%{transform:scale(0)}}
@keyframes hg-bottom{0%{transform:scaleY(0)}80%,100%{transform:scaleY(1)}}
@keyframes hg-stream{0%,76%{opacity:1}82%,100%{opacity:0}}
@keyframes hg-fall{to{stroke-dashoffset:-4}}
@keyframes hg-flip{0%,84%{transform:rotate(0)}100%{transform:rotate(180deg)}}
@media (prefers-reduced-motion:reduce){.hg,.hg-top,.hg-bottom,.hg-stream{animation:none}}

/* ─── Colores de estado, de la paleta de Update: Pendiente magenta · En curso cian · Procesado violeta ─── */
:root{--st-pend:#C90EC4;--st-curso:#0A86A8;--st-proc:#6C4FE0}
.status{background:var(--st-pend)!important;color:#fff!important;font-weight:400!important;border:1.5px solid transparent!important}
.status.prog{background:var(--st-curso)!important}
.status.done{background:var(--st-proc)!important}
.status.st-inc{background:transparent!important;color:var(--muted)!important;border:1.5px dashed var(--muted)!important}
.ui-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:-1px;flex:none}
.ui-dot:last-of-type{margin-right:8px}
.ui-dot--pend{background:var(--st-pend)}
.ui-dot--curso{background:var(--st-curso)}
.ui-dot--proc{background:var(--st-proc)}
.ui-opt-l{display:inline-flex;align-items:center}
.ui-lab{display:flex;align-items:center}
.seg .ui-dot{margin-right:6px;vertical-align:0}

/* Logo pequeño de la empresa en lugar del chip de texto */
.co-logo-w{display:inline-flex;align-items:center;margin-right:2px}
.co-logo{height:15px;width:auto;display:block}
/* Esqueleto mientras llegan los datos: la pantalla se ve de inmediato */
.skel{display:grid;gap:12px}
.skel>div{height:104px;border-radius:18px;background:var(--soft);position:relative;overflow:hidden}
.skel>div::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(128,128,150,.18),transparent);transform:translateX(-100%);animation:skel 1.3s ease-in-out infinite}
@keyframes skel{to{transform:translateX(100%)}}
.skel[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.skel>div::after{animation:none}}

/* Encargado: icono de usuario y un azul propio (distinto de los colores de estado) */
:root{--encargado:#2F5FD0;--encargado-bg:rgba(47,95,208,.10)}
:root[data-theme="dark"]{--encargado:#8FB3FF;--encargado-bg:rgba(143,179,255,.14)}
.who-tag{display:inline-flex;align-items:center;gap:5px;color:var(--encargado);background:var(--encargado-bg);border-radius:99px;padding:1px 10px 1px 7px;font-weight:600;line-height:1.5;vertical-align:baseline}
.who-tag svg{flex:none}
.ui-uico{display:inline-flex;color:var(--encargado);margin-right:8px}

/* Datos con icono: fecha, archivos y peso */
.item-m.meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
.mi{display:inline-flex;align-items:center;gap:6px}
.mi svg{flex:none;opacity:.8}

/* Botón de Drive: fondo suave + icono de Google Drive */
:root{--drive-bg:#EEF3FF;--drive-line:#D3E0FA;--drive-hv:#D7E5FF;--drive-line-hv:#9DBBF2}
:root[data-theme="dark"]{--drive-bg:#182141;--drive-line:#2A3866;--drive-hv:#243476;--drive-line-hv:#4A62B8}
.drive-btn{display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border-radius:12px;background:var(--drive-bg);border:1px solid var(--drive-line);color:var(--ink);text-decoration:none;font-size:14px;font-weight:400;position:relative;overflow:hidden;isolation:isolate;transition:transform .3s ease,box-shadow .3s ease,border-color .2s ease}
.drive-btn svg{flex:none}
.drive-btn::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--drive-hv);clip-path:circle(0% at 0% 100%);transition:clip-path .5s ease;pointer-events:none}
.drive-btn:hover::before{clip-path:circle(150% at 0% 100%);transition:clip-path .95s cubic-bezier(.4,0,.2,1)}
.drive-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(38,80,170,.20);border-color:var(--drive-line-hv)}
:root[data-theme="dark"] .drive-btn:hover{box-shadow:0 10px 24px rgba(0,0,0,.6),0 0 0 1px rgba(74,98,184,.25)}
.drive-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.drive-btn:hover{transform:none}}

/* Resumen con círculos de color (pendientes / en curso / procesados) */
.sum-i{display:inline-flex;align-items:center;gap:5px}
.sum-i .ui-dot{margin-right:3px}
.kpi .l .ui-dot{margin-right:7px;vertical-align:0}

/* Botones con contorno: al pasar el cursor el círculo se llena de NEGRO y la letra pasa a BLANCO */
:is(.btn.ghost,.mark,.dl,.ub-out,.iconbtn,.ui-nav,.linkrow button,#copy)::before{background:#000!important}
:is(.btn.ghost,.mark,.dl,.ub-out,.iconbtn,.ui-nav,.linkrow button,#copy):not(:disabled):hover{color:#fff!important;border-color:#000!important}
:root[data-theme="dark"] :is(.btn.ghost,.mark,.dl,.iconbtn,.ui-nav,.linkrow button,#copy):not(:disabled):hover{border-color:#5B63B0!important}

/* "En vivo" en turquesa */
:root{--turq:#18BFAE;--turq-text:#0E8F82}
:root[data-theme="dark"]{--turq:#2DD4BF;--turq-text:#2DD4BF}
.live{color:var(--turq-text)!important}
.live i{background:var(--turq)!important;animation:pulse-turq 2s infinite!important}
.live.off{color:var(--muted)!important}
.live.off i{background:var(--muted)!important;animation:none!important}
@keyframes pulse-turq{0%{box-shadow:0 0 0 0 rgba(24,191,174,.55)}70%{box-shadow:0 0 0 7px rgba(24,191,174,0)}100%{box-shadow:0 0 0 0 rgba(24,191,174,0)}}

/* "En vivo": chip junto al título, con el punto y sus ondas */
:root{--turq-bg:rgba(24,191,174,.12);--turq-line:rgba(24,191,174,.38)}
:root[data-theme="dark"]{--turq-bg:rgba(45,212,191,.12);--turq-line:rgba(45,212,191,.40)}
.titlebar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 4px}
.titlebar h1{margin:0}
.live-chip{display:inline-flex;align-items:center;gap:10px;padding:5px 14px 5px 12px;border-radius:99px;background:var(--turq-bg);border:1px solid var(--turq-line);color:var(--turq-text);font-size:13px;font-weight:400;line-height:1.4}
.live-chip i{position:relative;width:9px;height:9px;border-radius:50%;background:var(--turq);flex:none}
.live-chip i::before,.live-chip i::after{content:'';position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--turq);opacity:0;animation:onda 2.4s ease-out infinite}
.live-chip i::after{animation-delay:1.2s}
@keyframes onda{0%{transform:scale(1);opacity:.75}100%{transform:scale(3.4);opacity:0}}
.live-chip.off{color:var(--muted);background:transparent;border-color:var(--line)}
.live-chip.off i{background:var(--muted)}
.live-chip.off i::before,.live-chip.off i::after{animation:none;opacity:0}
@media (prefers-reduced-motion:reduce){.live-chip i::before,.live-chip i::after{animation:none}}

/* Botones de marcar estado: el relleno del hover llena más rápido */
.mark::before{transition:clip-path .3s ease!important}
.mark:not(:disabled):hover::before{transition:clip-path .35s cubic-bezier(.3,0,.2,1)!important}

/* Botones de acción: icono contextual y color suave de su estado (en curso cian · procesado violeta · pendiente magenta) */
.mark{display:inline-flex;align-items:center;gap:8px}
.mark svg{flex:none}
.mark.undo{opacity:1}
:root{--mk-curso:#0A6F8C;--mk-curso-bg:rgba(10,134,168,.09);--mk-curso-ln:rgba(10,134,168,.38);
      --mk-proc:#5B3FD0;--mk-proc-bg:rgba(108,79,224,.09);--mk-proc-ln:rgba(108,79,224,.38);
      --mk-pend:#B10EAD;--mk-pend-bg:rgba(201,14,196,.08);--mk-pend-ln:rgba(201,14,196,.36)}
:root[data-theme="dark"]{--mk-curso:#6FDCF5;--mk-curso-bg:rgba(41,215,252,.10);--mk-curso-ln:rgba(41,215,252,.38);
      --mk-proc:#BDB0FF;--mk-proc-bg:rgba(142,116,245,.14);--mk-proc-ln:rgba(142,116,245,.42);
      --mk-pend:#FF8CF7;--mk-pend-bg:rgba(244,17,238,.12);--mk-pend-ln:rgba(244,17,238,.40)}
.mark.mk-en_curso{color:var(--mk-curso);background:var(--mk-curso-bg);border-color:var(--mk-curso-ln)}
.mark.mk-procesado{color:var(--mk-proc);background:var(--mk-proc-bg);border-color:var(--mk-proc-ln)}
.mark.mk-pendiente{color:var(--mk-pend);background:var(--mk-pend-bg);border-color:var(--mk-pend-ln)}

/* Botón Descargar de cada archivo, con su icono */
.dl{display:inline-flex;align-items:center;gap:7px}
.dl svg{flex:none}

/* Todos los botones llenan el hover a la misma velocidad (rápida) */
:is(.btn,.mark,.dl,.ub-out,.iconbtn,.ui-nav,button.primary,.linkrow button,#go,.drive-btn)::before{transition:clip-path .3s ease!important}
:is(.btn,.mark,.dl,.ub-out,.iconbtn,.ui-nav,button.primary,.linkrow button,#go,.drive-btn):not(:disabled):hover::before{transition:clip-path .35s cubic-bezier(.3,0,.2,1)!important}
:root[data-theme="dark"] :is(.btn:not(.ghost),button.primary,#go):not(:disabled):hover{transition:transform .3s ease,box-shadow .3s ease,border-color .2s ease,color .25s ease .1s}

/* Tarjetas colapsables: nacen minimizadas, con la indicación de hacer clic para ver el detalle */
.item-head{cursor:pointer;border-radius:12px;margin:-8px -10px;padding:8px 10px;transition:background .2s ease}
.item-head:hover{background:var(--soft)}
.item-head:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.item-head .item-m{margin-bottom:0}
.item-hint{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.item-hint svg{transition:transform .3s ease}
.item-head:hover .item-hint{color:var(--ink)}
.item.open .item-hint svg{transform:rotate(180deg)}
.item-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease}
.item.open .item-body{grid-template-rows:1fr}
.item-body-in{overflow:hidden;min-height:0}
.item-body-in>:first-child{margin-top:16px}
@media (prefers-reduced-motion:reduce){.item-body,.item-hint svg{transition:none}}

/* Footer un poco más alto */
.site-f-in{padding-top:12px;padding-bottom:12px}
body{padding-bottom:78px}
#toast{bottom:96px}
@media(max-width:700px){.site-f-in{padding-top:9px;padding-bottom:9px}body{padding-bottom:66px}}

/* Indicadores del Reporte: números más pequeños */
.kpi{padding:14px 16px}
.kpi .n{font-size:clamp(20px,2.3vw,26px);letter-spacing:-.01em}
.kpi .l{font-size:13px;margin-top:2px}

/* Iconos en etiquetas, opciones de desplegables y títulos */
.lab-ico{display:inline-flex;vertical-align:-3px;margin-right:6px;color:var(--ink)}
.ui-oico{display:inline-flex;margin-right:10px;color:currentColor;flex:none}
.ui-opt-l{display:inline-flex;align-items:center}
.item-t .t-ico{display:inline-flex;vertical-align:-3px;margin-right:9px;color:var(--ink)}

/* Anuncio centrado de sistema + vista previa */
.ui-dlg-back{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.5);backdrop-filter:blur(3px);display:grid;place-items:center;padding:16px;animation:dlg-in .18s ease}
.ui-dlg-back.out{opacity:0;transition:opacity .16s ease}
.ui-dlg{width:100%;max-width:420px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:26px 24px 20px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.35);animation:dlg-pop .22s cubic-bezier(.34,1.3,.64,1)}
.ui-dlg-ico{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--soft,#eee);color:var(--ink);margin-bottom:10px}
.ui-dlg-t{margin:0 0 6px;font-size:19px;font-weight:700}
.ui-dlg-m{color:var(--muted);font-size:15px;line-height:1.5;margin-bottom:16px}
.ui-dlg-l{display:block;text-align:left;font-weight:700;font-size:13px;margin:6px 0 6px}
.ui-dlg-ta{width:100%;font:inherit;font-size:15px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink);resize:vertical}
.ui-dlg-err{min-height:18px;color:#c62828;font-size:13px;text-align:left;margin:4px 0 8px}
.ui-dlg-a{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.ui-dlg-a .btn{min-width:120px;justify-content:center}
.ui-pv{width:min(1100px,100%);height:min(86vh,860px);background:var(--card);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.4);animation:dlg-pop .22s ease}
.ui-pv-bar{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line)}
.ui-pv-t{flex:1;font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ui-pv-x{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:50%;cursor:pointer}
.ui-pv-f{flex:1;border:0;width:100%;background:#fff}
@keyframes dlg-in{from{opacity:0}to{opacity:1}}@keyframes dlg-pop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.ui-dlg,.ui-pv,.ui-dlg-back{animation:none}}
/* Estado anulado y archivos reemplazados */
.status.st-anul{background:#6b6b6b!important;color:#fff!important}
.ui-dot--anul{background:#8a8a8a}
.fl-old{margin-top:8px}
.fl-old>summary{font-size:13px;color:var(--muted);cursor:pointer;padding:6px 0}
.files li.is-old{opacity:.6}
.files li .ftag{font-size:11.5px;padding:2px 8px;border-radius:999px;background:var(--soft,#eee);color:var(--muted);margin-left:8px;white-space:nowrap}
.files li .fact{display:inline-flex;gap:6px;margin-left:auto}
.eyebtn,.iconact{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:10px;padding:7px 10px;font:inherit;font-size:13.5px;cursor:pointer;text-decoration:none}
.eyebtn[disabled]{opacity:.4;cursor:not-allowed}
.void-note{font-size:14px;color:var(--muted);margin:6px 0}
.owner-acts{display:flex;gap:8px;flex-wrap:wrap}
.ev-list{list-style:none;margin:0;padding:0;text-align:left;max-height:240px;overflow:auto}
.ev-list li{padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--ink)}
.ev-list li div{color:var(--muted);margin-top:2px}
.ev-list li:last-child{border-bottom:0}
a.mark{text-decoration:none}

/* Acciones del dueño del requerimiento: un color por acción */
:root{--mk-add:#0B7A55;--mk-add-bg:rgba(14,160,110,.09);--mk-add-ln:rgba(14,160,110,.38);
      --mk-void:#C62828;--mk-void-bg:rgba(198,40,40,.08);--mk-void-ln:rgba(198,40,40,.36);
      --mk-rep:#A15C00;--mk-rep-bg:rgba(230,140,0,.10);--mk-rep-ln:rgba(230,140,0,.40)}
:root[data-theme="dark"]{--mk-add:#6EE7B7;--mk-add-bg:rgba(52,211,153,.11);--mk-add-ln:rgba(52,211,153,.40);
      --mk-void:#FF8A80;--mk-void-bg:rgba(255,82,82,.11);--mk-void-ln:rgba(255,82,82,.40);
      --mk-rep:#FFC46B;--mk-rep-bg:rgba(255,170,40,.11);--mk-rep-ln:rgba(255,170,40,.42)}
.mark.mk-add{color:var(--mk-add);background:var(--mk-add-bg);border-color:var(--mk-add-ln)}
.mark.mk-void{color:var(--mk-void);background:var(--mk-void-bg);border-color:var(--mk-void-ln)}
.iconact.ic-rep{color:var(--mk-rep);background:var(--mk-rep-bg);border-color:var(--mk-rep-ln)}
.iconact.ic-rm{color:var(--mk-void);background:var(--mk-void-bg);border-color:var(--mk-void-ln)}

/* Iconos del menú del header */
.navlinks a{display:inline-flex;align-items:center;gap:8px;padding:9px 14px}
.nav-ic{flex:none}
@media(max-width:1000px){.bar-in,.site-h-in{flex-wrap:wrap}.navlinks{order:3;width:100%;margin-left:0!important;flex-wrap:wrap}.bar-in .userbox,.site-h-in .userbox{margin-left:auto}}   /* con iconos el menú ya no cabe en una línea en pantallas angostas */
.navlinks a:not([aria-current]){color:var(--ink)}   /* menú en negro (blanco en modo oscuro) */
/* "Nuevo upload" solo para Cissac: oculto hasta saber el rol (el rol se recuerda de la visita anterior) */
.navlinks a[href="./"]{display:none}
html.role-cissac .navlinks a[href="./"]{display:inline-flex}
/* Header idéntico en todas las páginas: mismas medidas y sin saltos cuando aparece o no la barra de desplazamiento */
html{scrollbar-gutter:stable}
.site-h-in,.bar-in{box-sizing:border-box!important;width:100%;max-width:1040px!important;margin:0 auto!important;padding:14px 20px!important;gap:16px!important}
.site-h-in .sep{margin:0 2px!important;height:24px!important;width:1px}   /* mismo espacio entre logos que en Requerimientos y Reporte */
/* Desplegable en 2 columnas, cada opción con borde de tarjeta (Período) */
.ui-pop.ui-grid2:not([hidden]){display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;min-width:360px}
.ui-grid2 .ui-opt{border:1px solid var(--line);border-radius:12px;padding:11px 12px;justify-content:flex-start}
.ui-grid2 .ui-opt:hover,.ui-grid2 .ui-opt.act{border-color:var(--ink)}
.ui-grid2 .ui-opt[aria-selected=true]{border-color:var(--ink)}
.ui-grid2 .ui-opt:last-child:nth-child(odd){grid-column:1 / -1}   /* la última (Rango de fechas) ocupa todo el ancho si queda sola */
.ui-pop.ui-grid2{left:50%!important;transform:translateX(-50%);max-width:calc(100vw - 24px)}   /* centrado bajo su selector */
.ui-grid2 .ui-opt{font-size:13.5px;padding:9px 11px}
.ui-pop.ui-grid2:not([hidden]){min-width:320px}
.ui-grid2 .ui-oico svg{width:15px;height:15px}
.ui-grid2 .ui-opt{font-size:12.5px!important;font-weight:400!important;padding:8px 10px!important}
.ui-grid2 .ui-opt .ui-opt-l{font-weight:400}

/* ===== Tantalus v2: compositor de cambios ===== */
.steps{margin:0 0 12px;padding-left:20px;font-size:14px;line-height:1.55;color:var(--ink)}
.steps li{margin:6px 0}.steps em{font-style:normal;font-weight:700}
.sub.tip{margin-top:10px!important}
.changes{margin-top:4px}
.chg-title{font-size:17px;margin:16px 0 10px;font-weight:700}
.sec{display:block;margin:18px 0 0;font-weight:700;font-size:14px}.sec span{font-weight:400;color:var(--muted)}
.chg{border:1px solid var(--line);border-radius:14px;background:var(--card);margin:0 0 12px;overflow:visible}
.chg.err{border-color:#C62828;box-shadow:0 0 0 3px rgba(198,40,40,.12)}
.chg-h{display:grid;grid-template-columns:auto 150px minmax(0,1.5fr) minmax(0,1fr);gap:10px 12px;align-items:end;padding:12px 14px;border-bottom:1px solid var(--line);position:relative}
.chg-n{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:13px;font-weight:700;align-self:center}
.fld label{display:block;font-size:12px;font-weight:700;margin:0 0 4px;color:var(--ink)}
.fld .ui-btn{padding:9px 10px;font-size:14px}
.zsel{position:relative}
.zbtn{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 10px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;font:inherit;font-size:14px;cursor:pointer}
.zbtn i{font-style:normal;font-size:11px}
.zpop{position:absolute;z-index:50;left:0;top:calc(100% + 6px);width:min(420px,86vw);max-height:360px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.22);padding:6px}
.zopt{display:grid;grid-template-columns:auto 64px 1fr;gap:10px;align-items:center;padding:8px 8px;border-radius:10px;cursor:pointer;margin:0;font-weight:400}
.zopt:hover{background:var(--soft,rgba(128,128,128,.1))}
.zopt input{width:16px;height:16px;margin:0;accent-color:var(--ink)}
.zth{color:var(--muted);display:block}
.ztx b{display:block;font-size:14px;font-weight:700}.ztx small{display:block;font-size:12px;color:var(--muted);line-height:1.3}
.zchips{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.zchip{font-size:12px;padding:2px 9px;border-radius:999px;background:var(--ink);color:var(--bg)}
.zempty{font-size:12px;color:var(--muted)}
.chg-rm{grid-column:1/-1;justify-self:end;border:0;background:none;color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;padding:0}
.chg-rm:hover{color:#C62828}
.chg-b{padding:12px 14px 14px}
.chg-hint{margin:0 0 10px;font-size:13px;color:var(--muted)}
.pair{display:grid;grid-template-columns:1fr auto 1fr auto;gap:10px;align-items:center;margin:0 0 10px}
.pair-x{font-weight:800;font-size:18px;color:var(--ink)}
.pair-rm{border:0;background:none;color:var(--muted);cursor:pointer;font-size:15px}.pair-rm:hover{color:#C62828}
.slot{position:relative;min-height:112px;border:2px dashed var(--line);border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:10px;background:var(--bg);color:var(--muted);font-size:12.5px;cursor:pointer;outline:none;overflow:hidden}
.slot.on{border-color:var(--ink);color:var(--ink)}.slot.over{border-color:var(--ink);background:var(--soft,rgba(128,128,128,.12))}
.slot.has{padding:0;border-style:solid;min-height:0;background:#000}
.slot.has img{display:block;width:100%;max-height:230px;object-fit:contain;background:var(--bg)}
.slot-l{position:absolute;left:8px;top:6px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--ink);color:var(--bg);border-radius:6px;padding:1px 7px}
.slot-ph{margin-top:14px}
.slot-pick{border:0;background:none;color:inherit;font:inherit;text-decoration:underline;cursor:pointer;padding:0}
.slot-x{position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff;cursor:pointer;font-size:12px}
.singles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.chg-add,.chg-addrow{border:1px dashed var(--line);background:transparent;color:var(--ink);border-radius:12px;font:inherit;font-size:14px;padding:9px 14px;cursor:pointer}
.chg-add:hover,.chg-addrow:hover{border-color:var(--ink)}
.chg-addrow{width:100%;margin-top:2px}
.chg-ta,.chg-in,.chg-note,.doc-t{width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;font:inherit;font-size:14px;padding:10px 12px;box-sizing:border-box;text-transform:none;letter-spacing:0;text-align:left}
.chg-note{margin-top:10px;font-size:13.5px}
.bad{border-color:#C62828!important}
.chg-err{margin-top:8px;color:#C62828;font-size:13px;font-weight:600}
.docdrop{border:2px dashed var(--line);border-radius:12px;padding:18px;text-align:center;color:var(--muted);cursor:pointer;font-size:14px}.docdrop.over{border-color:var(--ink)}
.doc{display:grid;grid-template-columns:1fr 1.3fr auto;gap:8px;align-items:center;margin-top:8px}.doc-n{font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recap{margin-top:12px;border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--bg)}
.recap-t{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}
.recap-l{font-size:13.5px;margin:3px 0;color:var(--ink)}
@media(max-width:700px){.chg-h{grid-template-columns:1fr}.pair{grid-template-columns:1fr}.pair-x{display:none}}

/* ===== Tantalus v2: vista de cambios ===== */
.cv{margin:6px 0 14px}
.cv-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px}.cv-top>b{font-size:15px}
.cv-prog{font-size:13px;color:var(--muted)}.cv-bar{flex:1;min-width:120px;max-width:260px;height:6px;border-radius:99px;background:var(--line);overflow:hidden}.cv-bar i{display:block;height:100%;background:var(--ink);border-radius:99px;transition:width .3s}
.cv-c{border:1px solid var(--line);border-radius:14px;background:var(--bg);padding:12px 14px;margin:0 0 10px}
.cv-h{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.cv-n{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--bg);font-size:12px;font-weight:700}
.cv-tg{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.cv-t{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:6px 10px;font:inherit;font-size:13.5px;cursor:default;text-align:left}
button.cv-t{cursor:pointer}button.cv-t:hover{border-color:var(--ink)}
.cv-t.on{background:rgba(14,160,110,.12);border-color:rgba(14,160,110,.45)}
.cv-ck{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:5px;border:1.5px solid var(--muted);font-style:normal;font-size:12px;line-height:1}
.cv-t.on .cv-ck{background:#0B7A55;border-color:#0B7A55;color:#fff}
.cv-t small{color:var(--muted);font-size:11.5px}
.cv-pair{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin:0 0 10px}
.cv-x{font-weight:800;font-size:18px}
.cv-cell{position:relative}
.cv-l{position:absolute;left:8px;top:6px;z-index:1;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--ink);color:var(--bg);border-radius:6px;padding:1px 7px}
.cv-l.nu{background:#0B7A55;color:#fff}
.cv-th{display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card);cursor:zoom-in;min-height:90px}
.cv-th img{display:block;width:100%;max-height:260px;object-fit:contain;background:#f1f1f1}
.cv-ext{display:grid;place-items:center;height:90px;font-weight:800;color:var(--muted)}
.cv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.cv-doc{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin:0 0 8px;background:var(--card)}
.cv-doc b{flex:1;min-width:140px}.cv-doc small{color:var(--muted);flex-basis:100%;order:3}
.cv-btn{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:9px;padding:6px 12px;font:inherit;font-size:13px;text-decoration:none;cursor:pointer}
.cv-text{border:1px solid var(--line);border-radius:10px;background:var(--card);padding:10px 12px}.cv-text pre{white-space:pre-wrap;margin:0 0 8px;font:inherit;font-size:14px}
.cv-url{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.cv-url img{width:160px;border-radius:10px}.cv-url a{color:var(--ink);word-break:break-all;font-size:14px}
.cv-note{margin:8px 0 0;font-size:13.5px;color:var(--muted)}
@media(max-width:700px){.cv-pair{grid-template-columns:1fr}.cv-x{display:none}}

/* ===== Tantalus v2: más ancho, nombre automático, filas compactas y colapsables ===== */
.site-h-in,.bar-in,.site-f-in{max-width:1480px!important}
main,main.two{max-width:1480px!important}
@media(min-width:900px){main.two{grid-template-columns:300px minmax(0,1fr)!important;gap:28px!important}}
.autoname{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;border:1px dashed var(--line);border-radius:12px;padding:9px 14px;margin:6px 0 4px;background:var(--bg)}
.autoname span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.autoname b{font-size:14.5px;font-weight:600}
.chg-h{grid-template-columns:auto minmax(150px,1fr) minmax(190px,1.2fr) minmax(130px,.8fr) auto!important;align-items:end;padding:10px 14px!important;gap:8px 12px!important}
.chg-tools{display:flex;gap:4px;align-self:center}
.chg-tg,.chg-rm{border:0;background:none;color:var(--muted);cursor:pointer;font:inherit;font-size:16px;width:30px;height:30px;border-radius:8px}
.chg-tg:hover,.chg-rm:hover{background:var(--soft,rgba(128,128,128,.12));color:var(--ink)}.chg-rm:hover{color:#C62828}
.fld.off .ui-btn{opacity:.5}
.zbtn{min-height:40px}.zbtn:disabled{opacity:.55;cursor:not-allowed}
.zlab{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}.zlab.ph{color:var(--muted)}
.zpop{width:min(680px,92vw)!important;max-height:440px;padding:10px 12px!important}
.zgrp{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:10px 4px 6px}.zgrp:first-child{margin-top:2px}
.zgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
@media(max-width:600px){.zgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.zcard{position:relative;display:flex;flex-direction:column;gap:4px;text-align:left;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;padding:9px 10px;font:inherit;cursor:pointer;min-height:96px}
.zcard:hover{border-color:var(--ink)}.zcard.on{border-color:var(--ink);background:var(--soft,rgba(128,128,128,.12));box-shadow:inset 0 0 0 1px var(--ink)}
.zcard .zth svg{width:48px;height:33px}.zcard b{font-size:13px;font-weight:600;line-height:1.25}.zcard small{font-size:11.5px;color:var(--muted);line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.zck{position:absolute;right:8px;top:8px;display:grid;place-items:center;width:18px;height:18px;border-radius:5px;border:1.5px solid var(--muted);font-size:12px;line-height:1;font-style:normal}
.zcard.on .zck{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chg.shut .chg-h{border-bottom:0}
.chg-sm{display:flex;align-items:center;gap:8px;padding:0 14px 10px;cursor:pointer}
.chg-sml{flex:1;font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chg-sm img{width:34px;height:24px;object-fit:cover;border-radius:5px;border:1px solid var(--line)}
.chg-b{padding:10px 14px 12px!important}.chg-hint{margin:0 0 8px!important}
.slot{min-height:92px!important}.slot.has img{max-height:190px!important}
.chg-addnote{border:0;background:none;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;padding:4px 0;margin-top:6px;text-decoration:underline}
@media(max-width:900px){.chg-h{grid-template-columns:auto 1fr auto!important}.chg-h .fld{grid-column:1/-1}}

/* ===== Tantalus v2: elección segmentada (¿Dónde?) ===== */
.chg-h{display:block!important;position:relative;padding:10px 14px 12px!important}
.chg-h>.chg-n{position:absolute;left:14px;top:12px}
.chg-seg{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 10px 38px;padding-right:76px}
.chg-segl{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-right:4px}
.seg{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;padding:6px 13px;font:inherit;font-size:13.5px;cursor:pointer;white-space:nowrap}
.seg:hover{border-color:var(--ink)}.seg.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.chg-l2{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px 12px;align-items:end;margin-left:38px}
.chg-l2 .fld[hidden]{display:none}
.chg-only{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--soft,rgba(128,128,128,.1));font-size:14px;font-weight:600}
.chg-h .chg-tools{position:absolute;right:10px;top:8px}
@media(max-width:700px){.chg-seg,.chg-l2{margin-left:0}.chg-h>.chg-n{position:static;margin-bottom:6px}.chg-seg{padding-right:0}}

/* Agregar / Retirar: una imagen grande y centrada (más si hacen falta) */
.singles{display:flex!important;flex-wrap:wrap;justify-content:center;gap:12px}
.singles .slot{flex:1 1 300px;max-width:560px;min-height:150px!important}
.singles.one .slot{flex:0 1 640px;max-width:640px;min-height:190px!important}
.singles .slot.has img{max-height:340px!important}
.singles .slot-ph{font-size:14px}
.singles-add{display:flex;justify-content:center;margin-top:10px}

/* Vista de cambios: el material primero y los destinos después, con su propio título */
.cv-parn{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:2px 0 6px}
.cv-dh{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:12px 0 6px;padding-top:10px;border-top:1px dashed var(--line)}
.cv-dh b{font-size:13.5px}.cv-dh span{font-size:12.5px;color:var(--muted)}
.cv-tg{margin:0 0 2px!important}
/* Compositor: aviso cuando una fila va en varias piezas */
.chg-multi{display:flex;gap:8px;align-items:flex-start;margin:0 0 10px;padding:8px 12px;border-radius:10px;background:var(--soft,rgba(128,128,128,.1));font-size:13px;line-height:1.4}
.chg-multi b{font-weight:700}

/* ===== Gestión de Update: acciones siempre visibles ===== */
.gest{position:sticky;top:98px;z-index:6;display:grid;grid-template-columns:1fr auto;gap:8px 16px;align-items:center;padding:12px 16px;margin:0 0 14px;border:1px solid var(--ink);border-radius:14px;background:var(--card);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.gest-l{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.gest-l b{font-size:15px}
.gest-p{font-size:13.5px;color:var(--ink);font-weight:600}
.gest-bar{flex:1;min-width:110px;max-width:240px;height:7px;border-radius:99px;background:var(--line);overflow:hidden}.gest-bar i{display:block;height:100%;background:#0B7A55;border-radius:99px;transition:width .3s}
.gest .acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.gest .mark{padding:10px 16px!important;font-size:14.5px!important}
.gest-h{grid-column:1/-1;font-size:12.5px;color:var(--muted)}
@media(max-width:800px){.gest{grid-template-columns:1fr}.gest .acts{justify-content:flex-start}}
/* lugares de cada cambio: acción explícita junto a cada uno */
.cv-places{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.cv-ph{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:8px}
.cv-dest{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--line);border-radius:10px;margin:0 0 6px;background:var(--bg)}
.cv-dest.on{background:rgba(14,160,110,.10);border-color:rgba(14,160,110,.45)}
.cv-dn{flex:1;min-width:160px;font-size:14.5px;font-weight:700}
.cv-do{border:0;background:var(--ink);color:var(--bg);border-radius:9px;padding:8px 16px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.cv-do:hover{opacity:.85}
.cv-ok{font-size:13px;color:#0B7A55;font-weight:600}:root[data-theme="dark"] .cv-ok{color:#6EE7B7}
.cv-undo{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:8px;padding:5px 11px;font:inherit;font-size:12.5px;cursor:pointer}
.cv-pend{font-size:13px;color:var(--muted)}

/* ===== Tantalus v2: vista de gestión más compacta ===== */
.gest{top:100px!important;padding:9px 14px!important;margin:0 0 18px!important;gap:6px 14px!important;border-width:1px!important}
.gest.ready{border-color:#0B7A55;box-shadow:0 6px 18px rgba(14,160,110,.18)}
.gest-l b{font-size:14px}.gest-p{font-size:13px}
.gest .mark{padding:7px 13px!important;font-size:13.5px!important}
.gest-h{font-size:12.5px;color:#0B7A55;font-weight:600}
.cv-top{margin:2px 0 10px!important}
.cv-c{padding:10px 12px!important}
.cv-places{padding:8px 10px!important;margin:0 0 10px!important}
.cv-ph{text-transform:none!important;letter-spacing:0!important;font-size:12.5px!important;margin-bottom:6px!important}
.cv-dest{padding:5px 10px!important;margin:0 0 5px!important;gap:10px!important}
.cv-dn{font-size:14px!important;min-width:140px!important}
.cv-do{background:transparent!important;color:var(--ink)!important;border:1px solid var(--ink)!important;padding:5px 12px!important;font-size:13px!important;font-weight:600}
.cv-do:hover{background:var(--ink)!important;color:var(--bg)!important;opacity:1!important}
.cv-pair{max-width:900px;margin:0 auto 10px!important;gap:8px!important}
.cv-th{min-height:0!important}.cv-th img{max-height:230px!important}
.cv-parn{max-width:900px;margin:2px auto 4px!important}
.cv-grid{grid-template-columns:repeat(auto-fill,minmax(220px,300px))!important;justify-content:center}
.cv-note{max-width:900px;margin:6px auto 0!important}
.gest{top:calc(var(--hh,96px) + 6px)!important}

/* ===== Tantalus v2: aire entre los bloques ===== */
.cv{margin:14px 0 18px!important}
.cv-top{margin:0 0 14px!important}
.gest{margin:0 0 22px!important;padding:12px 16px!important;box-shadow:0 12px 0 0 var(--card),0 16px 22px rgba(0,0,0,.10)!important}   /* el borde de abajo tapa lo que pasa por detrás al desplazarse */
.cv-c{margin:0 0 18px!important;padding:14px 16px!important}
.cv-h{margin-bottom:12px!important}
.cv-places{margin:0 0 16px!important;padding:12px 14px!important}
.cv-ph{margin-bottom:10px!important}
.cv-dest{margin:0 0 8px!important;padding:8px 12px!important}
.cv-dest:last-child{margin-bottom:0!important}
.cv-pair{margin:0 auto 14px!important;gap:12px!important}
.cv-parn{margin:4px auto 8px!important}
.cv-note{margin:10px auto 0!important}
.item-b>*{margin-top:0}

/* El contenedor del detalle recortaba con overflow:hidden, y eso rompe el panel fijo (lo desplazaba hacia abajo).
   overflow:clip recorta igual para la animación pero no crea un contenedor de desplazamiento. */
.item-body-in{overflow:clip!important;min-height:0}
.gest{border-color:var(--line)!important}
.gest.ready{border-color:#0B7A55!important}

/* Referencia (solo para mirar) frente a lo que se va a usar (descargable) */
.cv-cell.ref .cv-th{opacity:.92;cursor:zoom-in}
.cv-cell.ref .cv-l{background:var(--muted)}
.cv-l.nu{background:#0B7A55!important;color:#fff!important}
.cv-dl{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:var(--bg);border-radius:9px;padding:7px 13px;font-size:13px;font-weight:600;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.cv-dl:hover{opacity:.88}

/* Ritmo vertical de la tarjeta: el detalle respira debajo del encabezado y sin marco pesado */
.item-head,.item-head:focus,.item-head:focus-visible{outline:none!important;margin:0!important;padding:4px 0!important}
.item-head:hover{background:transparent!important}
.item-body-in{padding-top:20px!important}
.item-body-in>*+*{margin-top:0}
.cv{margin:20px 0 22px!important}
.cv-top{margin:0 0 16px!important}
.cv-c{margin:0 0 22px!important}
.fl,.item-f{margin-top:18px!important}
.gest{box-shadow:0 3px 10px rgba(0,0,0,.08)!important}   /* una sola sombra: sin el «segundo fondo» de antes */
.gest.ready{box-shadow:0 3px 12px rgba(14,160,110,.2)!important}

.mi-drive{text-decoration:none;color:inherit}.mi-drive:hover{color:var(--ink);text-decoration:underline}
.mi-drive svg{width:14px;height:14px}

.cv-undo{border:1.5px solid var(--ink)!important;background:var(--card)!important;color:var(--ink)!important;font-weight:700!important;font-size:13.5px!important;padding:7px 15px!important;border-radius:9px!important}
.cv-undo:hover{background:var(--ink)!important;color:var(--bg)!important}

/* ===== Tantalus v2: detalle en dos zonas (cambios | archivos para usar) ===== */
.split2{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
.col-main{min-width:0}
.col-main .cv{margin-top:0!important}
.col-side{position:sticky;top:calc(var(--hh,96px) + 86px);border:1px solid var(--line);border-radius:14px;background:var(--card);padding:14px 14px 12px}
.side-h{display:flex;align-items:center;gap:10px;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.side-h b{font-size:14.5px}.side-n{margin-left:auto;display:grid;place-items:center;min-width:24px;height:24px;border-radius:99px;background:var(--ink);color:var(--bg);font-size:12.5px;font-weight:700;padding:0 7px}
.side-empty{font-size:13px;color:var(--muted);margin:6px 0}
.col-side .files{margin:0;padding:0}
.col-side .files li{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 0}
.col-side .files li .fmain{flex:1;min-width:110px}
.col-side .files li .eyebtn,.col-side .files li .dl{padding:6px 11px;font-size:13px}
.col-side .files li .fthumb{width:44px;height:44px}
@media(max-width:1000px){.split2{grid-template-columns:1fr}.col-side{position:static}}

/* Archivos para usar: Vista previa y Descargar como iconos notorios, en la misma línea del nombre */
.col-side .files li{flex-wrap:nowrap!important}
.col-side .files li .eyebtn span,.col-side .files li .dl span{display:none}
.col-side .files li .eyebtn,.col-side .files li .dl{width:38px;height:38px;padding:0!important;display:grid;place-items:center;border-radius:10px;flex:none}
.col-side .files li .eyebtn svg,.col-side .files li .dl svg{width:19px;height:19px}
.col-side .files li .dl{background:var(--ink)!important;color:var(--bg)!important;border-color:var(--ink)!important}
.col-side .files li .eyebtn:hover,.col-side .files li .dl:hover{opacity:.85}
.col-side .files li .fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.col-side .files li .fmain{min-width:0!important}
/* Ver (cian) y Descargar (violeta): dos colores suaves y parejos, ninguno pesa más que el otro */
.col-side .files li .eyebtn{background:var(--mk-curso-bg)!important;color:var(--mk-curso)!important;border:1.5px solid var(--mk-curso-ln)!important}
.col-side .files li .dl{background:var(--mk-proc-bg)!important;color:var(--mk-proc)!important;border:1.5px solid var(--mk-proc-ln)!important}
.col-side .files li .eyebtn:hover{background:var(--mk-curso)!important;color:#fff!important;opacity:1!important}
.col-side .files li .dl:hover{background:var(--mk-proc)!important;color:#fff!important;opacity:1!important}
.col-side .files li .eyebtn:hover svg,.col-side .files li .dl:hover svg{color:#fff}

/* Datos de la cabecera: texto negro, iconos de color */
.item-m.meta .mi{color:var(--ink)}
.item-m.meta .mi svg{opacity:1}
.mi-calendar svg{color:var(--mk-pend)}
.mi-list svg{color:var(--mk-proc)}
.mi-file svg{color:var(--mk-curso)}
.mi-disk svg{color:var(--mk-rep)}

/* Avance en la cabecera del requerimiento */
.mini-av{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.mini-bar{width:90px;height:7px;border-radius:99px;background:var(--line);overflow:hidden;display:inline-block}
.mini-bar i{display:block;height:100%;background:#0B7A55;border-radius:99px}

/* «Ver detalle» separado del chip de estado */
.item-hint{position:relative;top:8px}
.item-hint{color:var(--mk-curso)!important;font-weight:500}
.item-head:hover .item-hint{color:var(--mk-proc)!important}
.mini-av{padding-left:16px;margin-left:4px;border-left:1px solid var(--line-strong,#c9c9c9)}
.mini-t{font-weight:600;font-size:13px}
.mini-t{display:inline-flex;align-items:center;gap:6px}.mini-t svg{color:#0B7A55}
/* Panel de gestión compacto: solo las acciones, a la izquierda */
.gest{grid-template-columns:1fr!important;padding:8px 12px!important}
.gest .acts{justify-content:flex-start!important}
/* Acciones de estado en la misma línea que «Procesado por…» */
.item-m.meta .acts{display:inline-flex;gap:8px;margin-left:8px;flex-wrap:wrap}
.item-m.meta .acts .mark{padding:6px 12px!important;font-size:13px!important}
.item-body-in>.item-m.meta{margin-bottom:18px}
.item-body-in>.item-m.meta{font-size:13px!important;color:var(--ink)!important}
/* Botones de estado: un poco más de intensidad */
.mark.mk-en_curso{color:var(--mk-curso)!important;background:rgba(10,134,168,.16)!important;border-color:rgba(10,134,168,.6)!important}
.mark.mk-pendiente{color:var(--mk-pend)!important;background:rgba(201,14,196,.14)!important;border-color:rgba(201,14,196,.55)!important}
.mark.mk-procesado{color:var(--mk-proc)!important;background:rgba(108,79,224,.15)!important;border-color:rgba(108,79,224,.6)!important}
.who-iso{width:16px;height:16px;object-fit:contain;flex:none}
.mi .tm{font-size:11.5px;color:var(--muted);margin-left:-2px}
.mi .tm{color:var(--ink)!important;opacity:.8}
.mi-calendar{font-size:12.5px}.mi .tm{font-size:11px}
.mi-calendar,.mi .tm{color:#000!important;opacity:1!important}
:root[data-theme="dark"] .mi-calendar,:root[data-theme="dark"] .mi .tm{color:#fff!important}
.item-m.meta .mi{font-size:12.5px}
.mini-av,.mini-t,.item-hint{font-size:12.5px}
/* Nombres: negro, sin negrita y pequeños */
.item-m.meta .who-tag{color:var(--ink)!important;font-weight:400!important;font-size:12.5px}
.mini-st{display:inline-flex;align-items:center;gap:8px;padding-left:14px;margin-left:4px;border-left:1px solid var(--line-strong,#c9c9c9)}
.item-hint{margin-left:12px!important;top:0!important}
.item-hint>span{display:none}.item-hint{margin-left:6px!important}
.item-hint{display:none!important}
.item.is-done{opacity:1!important}
/* Todas las tarjetas con la misma estructura: título · datos · gestión y estado (siempre en su propia línea) */
.item-m.meta{row-gap:6px}
.mini-av{flex-basis:100%;border-left:0!important;padding-left:0!important;margin-left:0!important}
.mini-st{font-size:11px}
/* Todo en una sola línea */
.item-head .item-m.meta{flex-wrap:nowrap!important;gap:12px!important;white-space:nowrap}
.mini-av{flex-basis:auto!important;padding-left:12px!important;margin-left:0!important;border-left:1px solid var(--line-strong,#c9c9c9)!important;gap:6px}
.mini-bar{width:56px}
.mini-st{padding-left:12px;margin-left:0;gap:6px}
.item-head .item-m.meta .mi{gap:4px}
.item-head .item-m.meta{gap:10px!important}
.mini-av,.mini-st{padding-left:10px}
.mini-t{font-size:0;gap:0}.mini-t svg{font-size:12.5px}
.item-head .mi-drive{font-size:0;gap:0}.item-head .mi-drive svg{width:16px;height:16px}
.mini-bar{width:44px}
@media(max-width:940px){.item-head .item-m.meta{flex-wrap:wrap!important;white-space:normal}}
/* Menos aire entre los datos de la cabecera */
.item-head .item-m.meta{gap:7px!important}
.mini-av,.mini-st{padding-left:7px!important}
.item-head .item-m.meta .mi{gap:3px}
.mi .tm{margin-left:4px!important}
/* Chip de estado centrado verticalmente en la cabecera */
.item-head{position:relative}
@media(min-width:1240px){.item-head .badges{position:absolute;right:10px;top:50%;transform:translateY(-50%)}}   /* con espacio de sobra, centrado en la tarjeta; en pantallas medias queda en la línea del título para no pisar los datos */
.item:not(.open) .item-body-in{padding-top:0!important}.item-body-in{transition:padding .3s ease}
.item-head .item-h{margin-bottom:8px!important}
.mark:disabled{opacity:.45;cursor:not-allowed}
.col-side{top:calc(var(--hh,96px) + 12px)!important}
/* Cada cambio se colapsa con un clic en su título */
.cv-h{cursor:pointer;margin-bottom:0!important;border-radius:10px}
.cv-h:hover{background:var(--soft)}
.cv-h:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.cv-sum{margin-left:auto;font-size:12px;color:var(--ink);background:var(--soft);border-radius:99px;padding:2px 9px}
.cv-chev{display:inline-flex;color:var(--muted);transition:transform .2s}
.cv-c.collapsed .cv-chev{transform:rotate(-90deg)}
.cv-b{padding-top:12px}
.cv-c.collapsed .cv-b{display:none}
.cv-top{display:flex;align-items:center;gap:12px}
.cv-all{margin-left:auto;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:4px 12px;font-size:12.5px;font-weight:400;cursor:pointer}
.cv-all:hover{background:var(--soft)}
/* Indicador de avance de cada cambio: color suave según el estado */
.cv-sum.none{color:var(--mk-pend)!important;background:var(--mk-pend-bg)!important;box-shadow:inset 0 0 0 1px var(--mk-pend-ln)}
.cv-sum.part{color:var(--mk-curso)!important;background:var(--mk-curso-bg)!important;box-shadow:inset 0 0 0 1px var(--mk-curso-ln)}
.cv-sum.all{color:var(--mk-add)!important;background:var(--mk-add-bg)!important;box-shadow:inset 0 0 0 1px var(--mk-add-ln)}
.cv-sum{font-weight:500}
/* Copiar enlace: solo icono, para no ensuciar */
.cv-ico{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1.5px solid var(--mk-curso-ln);background:var(--mk-curso-bg);color:var(--mk-curso);cursor:pointer;flex:none}
.cv-ico:hover{background:var(--mk-curso);color:#fff}
.cv-ico.ok{border-color:var(--mk-add-ln);background:var(--mk-add-bg);color:var(--mk-add)}
.all-cards{margin-left:auto;margin-right:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:5px 14px;font-size:12.5px;font-weight:400;cursor:pointer}
.all-cards:hover{background:var(--soft)}
.all-cards[hidden]{display:none}
/* Iconos de acción con color (aprendizaje visual) */
.act-cambiar,.cv-ai.act-cambiar,.ui-oico.act-cambiar{--ac:#0A6F8C}
.act-agregar,.cv-ai.act-agregar,.ui-oico.act-agregar{--ac:#0B7A55}
.act-retirar,.cv-ai.act-retirar,.ui-oico.act-retirar{--ac:#C62828}
.act-texto,.cv-ai.act-texto,.ui-oico.act-texto{--ac:#A15C00}
.act-enlace,.cv-ai.act-enlace,.ui-oico.act-enlace{--ac:#5B3FD0}
.act-documento,.cv-ai.act-documento,.ui-oico.act-documento{--ac:#B10EAD}
.cv-ai,.ui-oico[class*="act-"]{color:var(--ac)!important}
.cv-ai{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;background:color-mix(in srgb,var(--ac) 12%,transparent);flex:none}
:root[data-theme="dark"] .act-cambiar{--ac:#6FDCF5}:root[data-theme="dark"] .act-agregar{--ac:#6EE7B7}:root[data-theme="dark"] .act-retirar{--ac:#FF8A80}:root[data-theme="dark"] .act-texto{--ac:#FFC46B}:root[data-theme="dark"] .act-enlace{--ac:#BDB0FF}:root[data-theme="dark"] .act-documento{--ac:#FF8CF7}
/* El número queda fuera de la caja gris, en el margen izquierdo */
.cv-c{margin-left:36px!important}
.cv-c>.cv-h{position:relative}
.cv-c>.cv-h>.cv-n{position:absolute;left:-50px;top:50%;transform:translateY(-50%)}
/* Documentos: título y archivo en una sola línea, texto negro */
.cv-doc{flex-wrap:nowrap!important;padding:8px 12px!important;gap:12px}
.cv-doc b{flex:none;min-width:0!important;font-weight:600;color:var(--ink)}
.cv-doc small{order:0!important;flex:1 1 auto!important;flex-basis:auto!important;min-width:0;color:var(--ink)!important;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-doc .cv-btn{flex:none}
.cv-doc small::before{content:"·";margin-right:10px}
/* Tipo de archivo en cada documento */
.cv-ft{flex:none;display:inline-grid;place-items:center;min-width:38px;height:26px;padding:0 6px;border-radius:7px;font-size:10.5px;font-weight:600;letter-spacing:.03em;color:var(--ft);background:color-mix(in srgb,var(--ft) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ft) 35%,transparent)}
.ft-pdf{--ft:#C62828}.ft-doc{--ft:#1F5FBF}.ft-xls{--ft:#0B7A55}.ft-ppt{--ft:#C2570C}.ft-zip{--ft:#7A5AC8}.ft-oth{--ft:#666}
:root[data-theme="dark"] .ft-pdf{--ft:#FF8A80}:root[data-theme="dark"] .ft-doc{--ft:#8AB4FF}:root[data-theme="dark"] .ft-xls{--ft:#6EE7B7}:root[data-theme="dark"] .ft-ppt{--ft:#FFB070}:root[data-theme="dark"] .ft-zip{--ft:#BDB0FF}:root[data-theme="dark"] .ft-oth{--ft:#bbb}
.cv-doc small::before{content:none!important}
.cv-doc small{display:inline-flex;align-items:center;gap:5px}
.cv-doc small svg{flex:none;color:var(--muted)}
/* Enlace con fondo blanco e icono contextual (YouTube u otro) */
.cv-link{display:flex;align-items:center;gap:12px;min-width:0;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 10px 8px 12px}
.cv-link-i{display:inline-grid;place-items:center;flex:none;color:var(--muted)}
.cv-link a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none!important;color:var(--ink);font-size:13.5px}
.cv-link a:hover{text-decoration:underline!important}
.cv-link .cv-ico{width:30px;height:30px}
/* Panel de archivos filtrado por el cambio abierto */
.side-f{font-size:12px;color:var(--ink);background:var(--soft);border-radius:8px;padding:6px 10px;margin:0 0 6px}
.side-f button{border:0;background:none;color:var(--mk-curso);cursor:pointer;padding:0;font-size:12px;text-decoration:underline}
.col-side .files>li[hidden]{display:none!important}
.zcard small.zh{color:var(--ink);opacity:.75}
.cv-reftext{max-width:280px;margin:0 0 10px}
.zq{width:100%;box-sizing:border-box;margin:0 0 10px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit;font-size:13.5px}
.zq:focus{outline:2px solid var(--ink);outline-offset:1px}
.zcard[hidden],.zgrid[hidden],.zgrp[hidden]{display:none!important}
/* Guía lateral más delgada, texto pequeño y ocultable */
@media(min-width:900px){main.two{grid-template-columns:230px minmax(0,1fr)!important;gap:22px!important}
  main.two.sb-off{grid-template-columns:minmax(0,1fr)!important}}
main.two.sb-off .intro{display:none}
main.two .intro{padding:16px!important}
main.two .intro h1{font-size:17px!important;line-height:1.3;margin-bottom:8px!important}
main.two .steps{font-size:12.5px;line-height:1.5;padding-left:18px}
main.two .steps li{margin:5px 0}
main.two .intro .sub{font-size:12px!important;line-height:1.5}
.as{display:flex;align-items:center;gap:10px}
.sbtog{display:inline-grid;place-items:center;width:32px;height:32px;flex:none;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--muted);cursor:pointer}
.sbtog:hover{color:var(--ink);background:var(--soft)}
.sbtog[aria-pressed="true"]{color:var(--ink)}
@media(max-width:899px){.sbtog{display:none}}
.site-h{z-index:60!important}
/* El icono de panel vive en la guía (izquierda); al ocultarla queda uno pequeño en el borde para reabrirla */
main.two .intro{position:relative}
main.two .intro .sbtog{position:absolute;top:12px;right:12px}
main.two .intro h1{padding-right:34px}
main.two .sbopen{position:static;align-self:start;grid-column:1;grid-row:1}
.sbopen[hidden]{display:none!important}
main.two.sb-off{position:relative}
main.two.sb-off .sbopen{position:absolute;left:20px;top:28px;z-index:5}
main.two.sb-off .panel{margin-left:42px}
@media(max-width:899px){.sbopen{display:none!important}}
main.two.sb-off .panel{margin-left:48px!important}
main.two.sb-off .panel{margin-left:58px!important}
main.two.sb-off .panel{margin-left:70px!important}
/* Guía oculta: botón pegado al borde izquierdo y el panel gana ancho */
main.two.sb-off{padding-left:10px!important}
main.two.sb-off .sbopen{left:10px!important}
main.two.sb-off .panel{margin-left:46px!important}
/* «Enviando como» y el nombre del requerimiento: dos cajas en una sola línea, cada una con su icono */
.topline{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap;margin:0 0 10px}
.topline .as,.topline .autoname{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:12px;background:var(--bg);padding:9px 14px;margin:0}
.topline .autoname{border-style:dashed;flex:1;min-width:0}
.topline .as{flex:none}
.bx-ic{display:inline-grid;place-items:center;flex:none;color:var(--muted)}
.bx-ic .who-iso{width:18px;height:18px}
.topline .an-l{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);flex:none}
.topline .autoname b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:14.5px;font-weight:600}
.topline .autoname[hidden]{display:none}
@media(max-width:700px){.topline .autoname{flex-basis:100%}}
.topline .as,.topline .autoname{height:44px;box-sizing:border-box;padding-top:0!important;padding-bottom:0!important;margin:0!important;line-height:1.2}
.topline .autoname{align-items:center!important}
.topline .as,.topline .autoname{height:38px!important}
/* Selector de piezas como ventana centrada */
#zback{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:190}
body.z-open{overflow:hidden}
.zpop.zmodal{position:fixed!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%);width:min(960px,94vw)!important;max-height:86vh!important;z-index:200;padding:0 18px 18px!important;border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.zhead{display:none}
.zpop.zmodal .zhead{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:2;background:var(--card);padding:16px 0 10px}
.zhead b{font-size:16px}
.zx{border:1px solid var(--line);background:var(--card);color:var(--ink);width:32px;height:32px;border-radius:9px;cursor:pointer;font-size:14px}
.zx:hover{background:var(--soft)}
.zpop.zmodal .zq{position:sticky;top:58px;z-index:2}
.zpop.zmodal .zgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:720px){.zpop.zmodal .zgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.zfoot{display:none}
.zpop.zmodal .zfoot{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;bottom:-18px;background:var(--card);padding:12px 0 14px;margin-top:6px;border-top:1px solid var(--line)}
.zfoot small{font-size:12px;color:var(--muted)}
.zok{border:0;background:var(--ink);color:var(--bg);border-radius:10px;padding:9px 16px;font-size:13.5px;font-weight:400;cursor:pointer}
.zt{display:flex;flex-direction:column;gap:2px}
.zt small{font-size:12.5px;color:var(--muted)}
.zpop.zmodal .zfoot{justify-content:flex-end}
.zpop.zmodal .zq{top:72px}
/* Glosario de piezas (Reglas de uso) */
.glos-g{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:14px 0 6px}
.glos-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.glos-c{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;background:var(--bg);padding:10px 12px}
.glos-t svg{width:52px;height:36px;flex:none;color:var(--muted)}
.glos-c b{font-size:13px;font-weight:600;line-height:1.25}
.glos-c p{margin:2px 0 0;font-size:12px;color:var(--ink)}
.glos-c small{display:block;margin-top:3px;font-size:11.5px;color:var(--muted)}
@media(max-width:700px){.glos-grid{grid-template-columns:1fr}}
/* Testimonio: foto + frase, nombre y proyecto */
.tm-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.cv-tm{display:grid;grid-template-columns:minmax(180px,260px) 1fr;gap:14px;align-items:start}
.cv-tm .cv-text{margin:0}
@media(max-width:700px){.tm-row,.cv-tm{grid-template-columns:1fr}}
.singles.tm-photo{max-width:260px!important;margin:0 0 8px!important}.singles.tm-photo .slot{min-height:0}
/* Panel del cambio en dos: material a la izquierda, nota a la derecha, cada uno con su fondo */
.chg-split{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:12px;padding:12px 14px 14px;border-top:1px solid var(--line)}
.chg-split>.chg-b,.chg-split>.chg-side{background:var(--soft);border:1px solid var(--line);border-radius:12px}
.chg-split>.chg-b{padding:12px 14px 14px!important}
.chg-side{padding:12px 14px 14px;display:flex;flex-direction:column;gap:8px}
.chg-side-l{font-size:12px;font-weight:600;color:var(--ink)}
.chg-side .chg-note{width:100%;box-sizing:border-box;flex:1;min-height:90px;resize:vertical;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;padding:9px 11px}
@media(max-width:900px){.chg-split{grid-template-columns:1fr}}
/* Icono de imagen en los huecos para pegar o arrastrar */
.slot-ic{display:inline-grid;place-items:center;color:var(--muted);margin-bottom:6px;opacity:.8}
.slot:hover .slot-ic,.slot.on .slot-ic,.slot.over .slot-ic{color:var(--ink);opacity:1}
/* El separador entre «actual» y «nueva» es un icono de cambio (no una X, que se confunde con cerrar) */
.pair-x,.cv-x{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--mk-curso-bg);color:var(--mk-curso);box-shadow:inset 0 0 0 1px var(--mk-curso-ln)}
.pair-x svg,.cv-x svg{width:20px;height:20px}
.pair-rm{border:1px solid var(--line)!important;border-radius:9px;width:30px;height:30px}
/* Estructura unificada: captura (izquierda) → archivo a usar (derecha) */
.mat{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center}
.mat-c{display:flex;flex-direction:column;gap:8px;min-width:0}
.mat-fld{display:flex;flex-direction:column;gap:8px}
.slot-l2{display:inline-block;align-self:flex-start;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--ink);color:var(--bg);border-radius:7px;padding:3px 9px}
.mat .slot{min-height:150px}
.mat .chg-ta{min-height:150px}
.chg-nofile{margin:8px 0 0;font-size:12.5px;color:var(--muted)}
.cv-pair.solo{grid-template-columns:minmax(0,520px)!important}
@media(max-width:800px){.mat{grid-template-columns:1fr}.mat .pair-x{display:none}}
.mat .slot{min-height:150px!important}.mat .slot-ph{margin-top:6px}
.mat .slot,.pair .slot,.singles .slot{padding-top:36px!important}
/* Rótulos suaves sobre los huecos (en lugar de etiquetas negras) */
.slot-w{display:flex;flex-direction:column;gap:6px;min-width:0}
.slot-cap{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:12.5px;line-height:1.2}
.slot-cap b{font-weight:500;color:var(--ink)}
.slot-cap span{color:var(--muted);font-size:12px}
.slot .slot-l{display:none}
.mat .slot,.pair .slot,.singles .slot{padding-top:10px!important}
.singles .slot-w{flex:1 1 300px;max-width:560px}
.pair .slot-w{min-width:0}
.pair,.mat{align-items:center}.pair .pair-x,.mat .pair-x{align-self:center;margin-top:22px}
/* Rótulos de cada caja: centrados, con icono y etiqueta que declara qué va */
.slot-cap{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;font-size:14px;line-height:1.2;margin:0 0 2px}
.slot-cap b{font-size:14px;font-weight:600;color:var(--ink)}
.slot-cap-i{display:inline-grid;place-items:center;color:var(--muted)}
.slot-cap.use .slot-cap-i{color:var(--mk-curso)}
.slot-tag{font-size:12px;color:var(--muted);background:var(--soft);border:1px solid var(--line);border-radius:99px;padding:2px 10px}
.slot-cap.use .slot-tag{color:var(--mk-curso);background:var(--mk-curso-bg);border-color:var(--mk-curso-ln)}
.slot-cap span:not(.slot-cap-i):not(.slot-tag){color:var(--muted)}
.slot-file{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px;text-align:center;min-width:0}
.slot-file b{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--mk-curso);background:var(--mk-curso-bg);border:1px solid var(--mk-curso-ln);border-radius:8px;padding:6px 14px}
.slot-file span{font-size:12.5px;color:var(--ink);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slot-w{align-items:stretch}
.recap:empty{display:none}
/* Nota propia de cada par o archivo */
.pair.has-note{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) minmax(170px,.62fr) auto;align-items:start}
.pair.has-note .pair-x{align-self:center}
.pair-note{width:100%;box-sizing:border-box;min-height:150px;resize:vertical;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;padding:10px 12px}
.chg-split.solo{grid-template-columns:1fr}
.cv-pairnote{margin:-2px 0 12px;padding:8px 12px;border-left:3px solid var(--line);font-size:13px;color:var(--ink);background:var(--soft);border-radius:0 10px 10px 0}
@media(max-width:1100px){.pair.has-note{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto}.pair.has-note .slot-w:nth-child(4){grid-column:1/-1}}
@media(max-width:700px){.pair.has-note{grid-template-columns:1fr}}
/* Bordes de la interfaz un poco más oscuros */
:root{--line:#cdcdcd}
:root[data-theme="dark"]{--line:#3a3a3a}
/* Etiquetas suaves con color: captura (violeta), archivo (cian), nota (ámbar) */
.slot-cap.cap .slot-cap-i{color:var(--mk-proc)}
.slot-cap.cap .slot-tag{color:var(--mk-proc);background:var(--mk-proc-bg);border-color:var(--mk-proc-ln)}
.slot-cap.note .slot-cap-i{color:var(--mk-rep)}
.slot-cap.note .slot-tag{color:var(--mk-rep);background:var(--mk-rep-bg);border-color:var(--mk-rep-ln)}
/* Barra de cada cambio: mismo patrón que las tarjetas de Requerimientos (clic en la barra contrae/expande; título negro con icono) */
.chg{overflow:visible}
.chg-bar{display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;border-radius:14px;transition:background .2s ease}
.chg-bar:hover{background:var(--soft)}
.chg-bar:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.chg.open>.chg-bar{border-bottom:1px solid var(--line);border-radius:14px 14px 0 0}
.chg-bt{flex:0 1 auto;min-width:0;font-size:15px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chg-bm{font-size:12px;color:var(--ink);background:var(--soft);border:1px solid var(--line);border-radius:99px;padding:2px 10px;white-space:nowrap}
.chg-rm2{margin-left:auto;border:1px solid var(--line);background:var(--card);color:var(--muted);width:30px;height:30px;border-radius:9px;cursor:pointer;font-size:13px;flex:none}
.chg-rm2:hover{color:#C62828;border-color:#C62828}
.chg-bar>.chg-n{position:static!important;flex:none}
.chg-ctrl{padding:14px 14px 6px}
.chg-ctrl .chg-seg{margin:0 0 12px!important;padding-right:0!important}
.chg-ctrl .chg-l2{margin-left:0!important}
.chg-sm{padding:0 14px 12px 52px!important}
.chg-titlerow{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 4px}
.chg-titlerow .chg-title{margin:0}
.chg-all{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:5px 14px;font:inherit;font-size:12.5px;font-weight:400;cursor:pointer}
.chg-all:hover{background:var(--soft)}
.chg-all[hidden]{display:none}
/* Cajas de una fila con el mismo alto por defecto (la nota se puede estirar) */
.pair.has-note .pair-note{height:176px;min-height:0}
.pair .slot{min-height:150px!important;box-sizing:border-box}
.pair.has-note .pair-note{height:150px!important;box-sizing:border-box}
.recap{display:none!important}
.cv-retire{margin-top:10px}
/* Desplegables centrados en pantalla */
#ui-bk{position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:190}
.ui-pop.ui-center{position:fixed!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;width:min(440px,92vw)!important;min-width:0!important;max-width:92vw!important;max-height:78vh!important;overflow:auto!important;z-index:210!important;border-radius:16px!important;box-shadow:0 24px 70px rgba(0,0,0,.35)!important;padding:8px!important}
.ui-pop.ui-center.ui-grid2:not([hidden]){width:min(560px,94vw)!important}
.ui-ptitle{position:sticky;top:-8px;z-index:1;background:var(--card);padding:10px 12px 8px;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);margin:-8px -8px 6px}
/* Menús emergentes: sin scroll de fondo, ancho ajustado al contenido y hover visible */
body.ui-open,body.z-open{overflow:hidden}
.ui-pop.ui-center{width:max-content!important;min-width:min(280px,92vw)!important;max-width:min(520px,92vw)!important}
.ui-pop.ui-center.ui-grid2:not([hidden]){width:max-content!important;min-width:min(360px,92vw)!important;max-width:min(560px,94vw)!important}
.ui-pop.ui-center .ui-opt:hover{background:var(--soft);box-shadow:inset 0 0 0 1px var(--line)}
.ui-pop.ui-center .ui-opt[aria-selected=true]:hover{background:var(--ink);box-shadow:none}
.zpop.zmodal{width:min(calc(var(--zcols,3) * 310px + 44px),94vw)!important}
.zpop.zmodal .zgrid{grid-template-columns:repeat(var(--zcols,3),minmax(0,1fr))!important}
@media(max-width:720px){.zpop.zmodal .zgrid{grid-template-columns:repeat(min(var(--zcols,3),2),minmax(0,1fr))!important}}
/* Opciones de los desplegables: hover gris clarísimo y un bullet pequeño (sin bullet si la opción ya lleva icono o punto) */
.ui-opt{position:relative}
.ui-opt:not([aria-selected=true]):hover,.ui-opt.act:not([aria-selected=true]){background:color-mix(in srgb,var(--ink) 4.5%,transparent)!important;box-shadow:none!important}
.ui-opt[aria-selected=true]{background:var(--ink)!important;color:var(--bg)!important;box-shadow:none!important}
.ui-opt-l:not(:has(.ui-oico,.ui-uico,.ui-dot))::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted);opacity:.55;margin-right:11px;flex:none}
.ui-opt[aria-selected=true] .ui-opt-l::before{background:currentColor;opacity:.9}
.ui-grid2 .ui-opt-l::before{display:none!important}
/* Lista con buscador */
.ui-phead{position:sticky;top:-8px;z-index:2;background:var(--card);margin:-8px -8px 6px;padding:0 0 8px;border-bottom:1px solid var(--line)}
.ui-phead .ui-ptitle{position:static;border-bottom:0;margin:0;padding:12px 14px 6px}
.ui-psearch{display:block;width:calc(100% - 20px);box-sizing:border-box;margin:2px 10px 0;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);font:inherit;font-size:14px}
.ui-psearch:focus{outline:2px solid var(--ink);outline-offset:1px}
.ui-opt[hidden]{display:none}
.ui-pempty{padding:14px;text-align:center;font-size:13px;color:var(--muted)}
/* Filas de documentos, enlaces y testimonios */
.pair.no-note{grid-template-columns:minmax(0,1fr) auto minmax(0,1.4fr) auto;align-items:start}
.pair-right{display:flex;flex-direction:column;gap:8px;min-width:0}
.pair.has-note .pair-right{min-width:0}
.cv-docw{margin:0 0 10px}
.cv-docw .cv-reftext{max-width:240px;margin:0 0 6px}
/* Fila de documento: título y nota en la misma columna */
.pair-meta{gap:6px}
.pair-meta .chg-in{width:100%;box-sizing:border-box}
.pair.has-note .pair-meta .pair-note{height:64px!important}
/* Separador suave entre filas de un mismo cambio */
.chg-b .pair{margin:0 0 12px}
.chg-b .pair + .pair{border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);padding-top:12px}
.chg-b .pair:last-of-type{margin-bottom:8px}
/* Lista «Archivos para usar»: nombre muy pequeño y acciones del dueño como iconos en una segunda línea */
.col-side .files li{flex-wrap:wrap!important;row-gap:6px}
.col-side .files li .fmain{min-width:0;flex:1 1 90px}
.col-side .files li .fname{font-size:11px!important;line-height:1.25;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal!important;overflow-wrap:anywhere}
.col-side .files li .sz{font-size:10.5px!important}
.col-side .files li .fact{flex:0 0 100%;display:flex;gap:6px;justify-content:flex-end;padding-left:54px}
.col-side .files li .fact .iconact{display:inline-grid;place-items:center;width:30px;height:30px;padding:0!important;border-radius:9px}
.col-side .files li .fact .iconact span{display:none!important}
.col-side .files li .fact .ic-rep{background:var(--mk-rep-bg)!important;color:var(--mk-rep)!important;border:1.5px solid var(--mk-rep-ln)!important}
.col-side .files li .fact .ic-rm{background:var(--mk-void-bg)!important;color:var(--mk-void)!important;border:1.5px solid var(--mk-void-ln)!important}
.col-side .files li .fact .ic-rep:hover{background:var(--mk-rep)!important;color:#fff!important}
.col-side .files li .fact .ic-rm:hover{background:var(--mk-void)!important;color:#fff!important}
/* Archivos para usar: los cuatro iconos en una sola línea, más pequeños y con menos fondo */
.col-side .files li{flex-wrap:nowrap!important;gap:6px!important}
.col-side .files li .fthumb{width:38px!important;height:38px!important}
.col-side .files li .fact{flex:0 0 auto!important;padding-left:0!important;gap:4px!important}
.col-side .files li .eyebtn,.col-side .files li .dl,.col-side .files li .fact .iconact{width:26px!important;height:26px!important;border-radius:8px!important;border-width:1px!important;flex:none}
.col-side .files li .eyebtn svg,.col-side .files li .dl svg,.col-side .files li .fact .iconact svg{width:14px;height:14px}
.col-side .files li .eyebtn{background:color-mix(in srgb,var(--mk-curso) 7%,transparent)!important}
.col-side .files li .dl{background:color-mix(in srgb,var(--mk-proc) 7%,transparent)!important}
.col-side .files li .fact .ic-rep{background:color-mix(in srgb,var(--mk-rep) 8%,transparent)!important}
.col-side .files li .fact .ic-rm{background:color-mix(in srgb,var(--mk-void) 7%,transparent)!important}
/* Ayuda emergente del sistema */
.ui-tip{position:fixed;z-index:400;max-width:260px;padding:6px 10px;border-radius:8px;background:#0a0a0a;color:#fff;font-size:12px;line-height:1.3;font-weight:400;pointer-events:none;box-shadow:0 6px 18px rgba(0,0,0,.28);white-space:normal}
.ui-tip::after{content:"";position:absolute;left:var(--ax,50%);bottom:-4px;width:8px;height:8px;background:#0a0a0a;transform:translateX(-50%) rotate(45deg);border-radius:1px}
.ui-tip.below::after{bottom:auto;top:-4px}
:root[data-theme="dark"] .ui-tip{background:#f2f2f2;color:#0a0a0a}
:root[data-theme="dark"] .ui-tip::after{background:#f2f2f2}
.ui-tip[hidden]{display:none}
/* Icono de reemplazo animado de forma continua (flechas que se cruzan) */
@keyframes swA{0%,100%{transform:translateX(-1.6px)}50%{transform:translateX(1.6px)}}
@keyframes swB{0%,100%{transform:translateX(1.6px)}50%{transform:translateX(-1.6px)}}
.pair-x .sw1,.cv-x .sw1{animation:swA 1.5s ease-in-out infinite}
.pair-x .sw2,.cv-x .sw2{animation:swB 1.5s ease-in-out infinite}
@keyframes repWiggle{0%,100%{transform:translateX(-1.4px)}50%{transform:translateX(1.4px)}}
.col-side .files li .fact .ic-rep svg{animation:repWiggle 1.5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.pair-x .sw1,.cv-x .sw1,.pair-x .sw2,.cv-x .sw2,.col-side .files li .fact .ic-rep svg{animation:none}}
/* Versión anterior anidada junto a la versión a usar */
.cv-prev{display:flex;align-items:center;gap:8px;margin:8px 0 0;padding:6px 8px;border:1px dashed var(--line);border-radius:10px;background:var(--soft);width:fit-content;max-width:100%}
.cv-prev-l{font-size:11px;color:var(--muted);white-space:nowrap}
.cv-prev .cv-th.mini{width:34px;height:26px;min-width:0;border-radius:6px;overflow:hidden;opacity:.85}
.cv-prev small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px}
.col-side .files li.is-nested{margin-left:18px;padding-left:10px;border-left:2px solid var(--line);opacity:.82}
.col-side .files li.is-nested .fthumb{width:30px!important;height:30px!important}
/* Novedades de Cissac: chip en la tarjeta, franja dentro y contador */
.chip-news{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:5px 11px;border-radius:99px;color:var(--mk-rep);background:var(--mk-rep-bg);border:1px solid var(--mk-rep-ln);white-space:nowrap}
.chip-news svg{animation:bellRing 2.4s ease-in-out infinite;transform-origin:50% 0}
@keyframes bellRing{0%,86%,100%{transform:rotate(0)}90%{transform:rotate(14deg)}94%{transform:rotate(-12deg)}97%{transform:rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.chip-news svg{animation:none}}
.news-strip{margin:0 0 16px;padding:12px 14px;border:1px solid var(--mk-rep-ln);border-radius:12px;background:var(--mk-rep-bg)}
.news-h{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink)}
.news-i{display:inline-grid;color:var(--mk-rep)}
.news-ok{margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--mk-add-ln);background:var(--mk-add-bg);color:var(--mk-add);border-radius:9px;padding:5px 11px;font:inherit;font-size:12.5px;font-weight:400;cursor:pointer}
.news-ok:hover{background:var(--mk-add);color:#fff}
.news-strip ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.news-strip li{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:13px}
.news-t{font-size:11.5px;padding:2px 9px;border-radius:99px;border:1px solid var(--mk-rep-ln);color:var(--mk-rep);background:var(--card);white-space:nowrap}
.news-d{color:var(--ink)}
.news-strip time{margin-left:auto;font-size:11.5px;color:var(--muted)}
.sum-i .ui-dot--news{background:var(--mk-rep)}
/* Etiquetas de versión: color suave distinto + icono pequeño */
.files li .ftag{display:inline-flex;align-items:center;gap:4px;width:fit-content;align-self:flex-start;margin-left:0}
.files li .ftag-new{background:#e8f6ee;color:#2f7d54}
.files li .ftag-prev{background:#fdf2e0;color:#a8691b}
.files li .ftag-quit{background:#fbe9e9;color:#a63d3d}
/* Cambiar texto por filas */
.cv-trow{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;margin:6px 0}
.cv-trow .cv-text{flex:1 1 220px;min-width:0}
.cv-trow .cv-text.old{background:var(--soft);border-style:dashed}
.cv-trow .cv-text.old pre{color:var(--muted);margin:0}
.cv-trow .cv-text{position:relative;padding-top:30px}
.cv-trow .cv-text .cv-l{top:8px;left:10px}
/* Descarga optimizada (Update): WebP (azul) y AVIF (verde), suaves y con el mismo icono de imagen */
.dl-fmt{display:inline-flex;align-items:center;gap:5px;border-radius:9px;font:inherit;font-size:12.5px;cursor:pointer;border:1.5px solid;padding:6px 10px}
.dl-fmt svg{flex:none}
.dl-fmt.dl-webp{background:#e8f0fe;color:#1d5fd1;border-color:#b6cdf7}
.dl-fmt.dl-avif{background:#e3f5ec;color:#1b8553;border-color:#b3e0c6}
:root[data-theme="dark"] .dl-fmt.dl-webp{background:#162a4d;color:#8db5ff;border-color:#2b4f8f}
:root[data-theme="dark"] .dl-fmt.dl-avif{background:#123a28;color:#7fd7a8;border-color:#23694a}
.dl-fmt.busy{opacity:.6;pointer-events:none}
.col-side .files li .dl.dl-fmt{width:44px;height:38px;flex-direction:column;gap:1px;justify-content:center;border-radius:10px;padding:0!important;font-size:9.5px;line-height:1}
.col-side .files li .dl.dl-fmt .dl-t{display:block!important}
.col-side .files li .dl.dl-fmt svg{width:16px;height:16px}
.col-side .files li .dl.dl-webp{background:#e8f0fe!important;color:#1d5fd1!important;border-color:#b6cdf7!important}
.col-side .files li .dl.dl-avif{background:#e3f5ec!important;color:#1b8553!important;border-color:#b3e0c6!important}
:root[data-theme="dark"] .col-side .files li .dl.dl-webp{background:#162a4d!important;color:#8db5ff!important;border-color:#2b4f8f!important}
:root[data-theme="dark"] .col-side .files li .dl.dl-avif{background:#123a28!important;color:#7fd7a8!important;border-color:#23694a!important}
/* dentro del cambio: original + WebP + AVIF agrupados abajo a la derecha de la miniatura */
.cv-dl{background:none!important;box-shadow:none!important;padding:0!important;gap:6px}
.cv-dl-o{display:inline-flex;align-items:center;gap:6px;background:var(--ink);color:var(--bg);border-radius:9px;padding:6px 11px;font-size:12.5px;text-decoration:none;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.cv-dl .dl-fmt{box-shadow:0 4px 12px rgba(0,0,0,.18)}
/* en la lista compacta (26 px): icono + nombre del formato en una sola línea */
.col-side .files li .dl.dl-fmt{width:auto!important;height:26px!important;flex-direction:row!important;gap:3px!important;padding:0 6px!important;border-radius:8px!important;border-width:1px!important;font-size:10px!important;display:inline-flex!important;align-items:center}
.col-side .files li .dl.dl-fmt svg{width:13px!important;height:13px!important}