/* ============================================================
   FEMA Colegios — mismo lineamiento que FEMA CMS y FEMA Remote:
   Outfit · azul #1e169c · violeta #6b1ea7 · rojo #ff203c · fondo blanco sobrio.
   Cada tipo de elemento tiene su propio efecto al pasar el mouse
   (nunca el "saltito" hacia arriba).
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

:root{
  --azul:#1e169c; --azul-2:#3b2bd9; --violeta:#6b1ea7; --rojo:#ff203c;
  --grad:linear-gradient(135deg,#1e169c 0%,#6b1ea7 50%,#ff203c 100%);
  --bg:#ffffff; --bg-2:#f7f8fa; --bg-3:#f1f2f6; --lateral:#fafbfc;
  --linea:#ececef; --linea-2:#e2e3ea;
  --ink-1:#0a0e27; --ink-2:#4f5563; --ink-3:#6b6f7d;
  --ok:#14874a; --ok-bg:#e7f6ee; --ojo:#b45309; --ojo-bg:#fff6e6; --mal:#c8102e; --mal-bg:#fff0f2; --pend-bg:#eef0ff;
  --font:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --ease:cubic-bezier(.16,1,.3,1); --radio:12px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink-1);font-family:var(--font);font-size:16px;-webkit-font-smoothing:antialiased}
a{color:var(--azul)}
button,input,select,textarea{font:inherit;color:inherit}
svg{flex:none}
.muted{color:var(--ink-3)}
.hidden{display:none!important}
.num{text-align:right;font-variant-numeric:tabular-nums}
.txt-mal{color:var(--mal)}
.cinta-testeo{position:fixed;top:0;left:50%;transform:translateX(-50%);z-index:90;background:var(--grad);color:#fff;font-size:12px;font-weight:600;letter-spacing:.04em;padding:4px 14px;border-radius:0 0 10px 10px}

/* ---------- Logo FEMA con el destello que cruza las letras ---------- */
.marca{position:relative;display:inline-block;line-height:0}
.marca img{display:block;height:var(--alto-logo,40px);width:auto}
.marca::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0) 42%,rgba(255,255,255,.95) 50%,rgba(255,255,255,0) 58%);
  background-size:300% 100%;background-repeat:no-repeat;
  -webkit-mask-image:url('logo-fema.png');mask-image:url('logo-fema.png');-webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;animation:brilloLogo 3s linear infinite}
@keyframes brilloLogo{0%{background-position:130% 0}70%,100%{background-position:-30% 0}}
@keyframes barrido{0%{left:-100%}100%{left:200%}}
@media (prefers-reduced-motion:reduce){.marca::after{display:none}*{animation-duration:0s!important;transition-duration:0s!important}}

/* ---------- Botones ---------- */
.btn-primary,.btn-accion{position:relative;overflow:hidden;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:9px;border:0;cursor:pointer;text-decoration:none;
  background:var(--grad);color:#fff;font-weight:700;border-radius:10px;box-shadow:0 6px 18px rgba(30,22,156,.25);transition:box-shadow .3s var(--ease)}
.btn-primary{width:100%;padding:15px 24px;font-size:17px}
.btn-accion{padding:11px 20px;font-size:15px}
.btn-primary::before,.btn-accion::before{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;z-index:2;pointer-events:none;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.2) 40%,rgba(255,255,255,.45) 50%,rgba(255,255,255,.2) 60%,transparent)}
.btn-primary:hover::before,.btn-accion:hover::before{animation:barrido .9s ease-out forwards}
.btn-primary:hover,.btn-accion:hover{box-shadow:0 10px 26px rgba(255,32,60,.35);color:#fff}
.btn-primary svg,.btn-accion svg{width:18px;height:18px;position:relative;z-index:3}
.btn-primary span{position:relative;z-index:3}
.btn-sec{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:10px;border:1.5px solid var(--linea-2);background:#fff;color:var(--ink-1);font-weight:600;font-size:15px;text-decoration:none;cursor:pointer;
  transition:border-color .2s,background .2s,color .2s}
.btn-sec svg{width:17px;height:17px;color:var(--ink-3);transition:color .2s}
.btn-sec:hover{border-color:var(--azul);background:#f5f4fe;color:var(--azul)}
.btn-sec:hover svg{color:var(--azul)}
.btn-link{position:relative;background:none;border:0;padding:2px 0;color:var(--azul);font-weight:600;font-size:14.5px;cursor:pointer;text-decoration:none}
.btn-link::after{content:'';position:absolute;left:0;bottom:-1px;height:1.5px;width:0;background:currentColor;transition:width .25s var(--ease)}
.btn-link:hover::after{width:100%}
.btn-link.es-peligro{color:var(--mal)}
.btn-peligro{padding:10px 18px;border-radius:10px;border:0;background:var(--mal);color:#fff;font-weight:700;cursor:pointer;transition:background .2s}
.btn-peligro:hover{background:#9e0b24}
.btn-x{width:30px;height:30px;border-radius:8px;border:0;background:none;color:var(--ink-3);font-size:20px;cursor:pointer;transition:background .2s,color .2s}
.btn-x:hover{background:var(--mal-bg);color:var(--mal)}
.enlace{color:var(--azul);font-weight:600;text-decoration:none;border-bottom:1.5px solid rgba(30,22,156,.25);transition:border-color .2s}
.enlace:hover{border-color:var(--azul)}
.enlace-flecha{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-weight:600;text-decoration:none}
.enlace-flecha svg{width:16px;height:16px;transition:transform .25s var(--ease)}
.enlace-flecha:hover svg{transform:translateX(5px)}

/* ---------- Campos ---------- */
label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--ink-2)}
label small{font-weight:400;color:var(--ink-3)}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{width:100%;padding:11px 13px;border:1.5px solid var(--linea-2);border-radius:10px;background:#fff;font-size:15.5px;color:var(--ink-1);
  transition:border-color .2s,box-shadow .2s;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--violeta);box-shadow:0 0 0 4px rgba(107,30,167,.12)}
textarea{resize:vertical;line-height:1.5}
label.check{flex-direction:row;align-items:flex-start;gap:10px;font-weight:500;cursor:pointer;color:var(--ink-1)}
label.check input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--azul);flex:none}
.grilla-form{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px 18px}
.grilla-form .ancho{grid-column:1/-1}
.bloque-form{border:1px solid var(--linea);border-radius:var(--radio);padding:20px 22px 22px;margin:0 0 18px;background:#fff}
.bloque-form legend{padding:0 8px;font-weight:700;font-size:15px;color:var(--ink-1)}
.bloque-form > label{margin-bottom:14px}
.form-acciones{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.form-panel{max-width:920px}
.etq{display:block;font-size:14px;font-weight:600;color:var(--ink-2);margin-bottom:8px}
.archivo{position:relative;display:inline-flex;flex-direction:row;align-items:center}
.archivo input{position:absolute;inset:0;opacity:0;cursor:pointer}
.archivo span{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:1.5px dashed var(--linea-2);border-radius:10px;background:var(--bg-2);color:var(--ink-1);transition:border-color .2s,background .2s}
.archivo span svg{width:18px;height:18px}
.archivo:hover span{border-color:var(--violeta);background:#f6f0fb}
.chips-check{display:flex;flex-wrap:wrap;gap:8px}
.chip-check{padding:0}
.chip-check input{position:absolute;opacity:0}
.chip-check span{padding:8px 15px;border-radius:999px;border:1.5px solid var(--linea-2);transition:all .2s;font-weight:600}
.chip-check input:checked + span{background:var(--azul);border-color:var(--azul);color:#fff}

/* ---------- Avisos y chips ---------- */
.aviso{display:flex;gap:10px;align-items:flex-start;padding:13px 16px;border-radius:12px;margin:0 0 18px;font-size:15px;line-height:1.45}
.aviso svg{width:19px;height:19px;margin-top:1px}
.aviso.es-ok{background:var(--ok-bg);color:#0d5c32}
.aviso.es-error{background:var(--mal-bg);color:#8d0b21}
.chip{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;font-style:normal;font-size:13px;font-weight:600;background:var(--bg-3);color:var(--ink-2);white-space:nowrap;text-decoration:none}
.chip svg{width:14px;height:14px}
.chip.es-bien{background:var(--ok-bg);color:var(--ok)}
.chip.es-mal{background:var(--mal-bg);color:var(--mal)}
.chip.es-ojo{background:var(--ojo-bg);color:var(--ojo)}
.chip.es-pendiente{background:var(--pend-bg);color:var(--azul)}
.chip-quitar{transition:background .2s}
.chip-quitar:hover{background:#ffe7c2}
.msg-error{color:var(--mal);font-size:14.5px;margin:4px 0 0}

/* ---------- Armazón del panel ---------- */
.armazon{display:grid;grid-template-columns:268px 1fr;min-height:100vh}
.lateral{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;background:var(--lateral);border-right:1px solid var(--linea);padding:22px 14px 16px;overflow-y:auto}
.colegio-marca{display:flex;align-items:center;gap:12px;padding:4px 8px 20px;text-decoration:none;color:var(--ink-1);border-bottom:1px solid var(--linea);margin-bottom:14px}
.colegio-marca img{width:44px;height:44px;object-fit:contain;border-radius:10px;background:#fff}
.colegio-marca b{display:block;font-size:15.5px;line-height:1.2}
.colegio-marca small{color:var(--ink-3);font-size:12.5px}
.escudo{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--grad);color:#fff;font-weight:800;font-size:20px;flex:none}
.escudo.grande{width:72px;height:72px;font-size:30px}
.nav{display:flex;flex-direction:column;gap:2px;flex:1}
.nav-item{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--ink-2);text-decoration:none;font-weight:500;font-size:15px;transition:color .2s,background .2s}
.nav-item svg{width:20px;height:20px;transition:transform .3s var(--ease)}
.nav-item::before{content:'';position:absolute;left:0;top:20%;bottom:20%;width:3px;border-radius:3px;background:var(--grad);transform:scaleY(0);transition:transform .25s var(--ease)}
.nav-item:hover{color:var(--azul);background:#f2f1fd}
.nav-item:hover::before{transform:scaleY(1)}
.nav-item:hover svg{transform:rotate(-6deg)}
.nav-item.es-activo{background:#fff;color:var(--azul);font-weight:700;box-shadow:0 1px 3px rgba(10,14,39,.07),0 0 0 1px var(--linea)}
.nav-item.es-activo::before{transform:scaleY(1)}
.lateral-pie{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 8px 10px;border-top:1px solid var(--linea);margin-top:14px}
.yo{display:flex;align-items:center;gap:10px;min-width:0}
.yo b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
.yo small{color:var(--ink-3);font-size:12.5px}
.yo-ini{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--bg-3);color:var(--azul);font-weight:700}
.salir{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;color:var(--ink-3);transition:background .2s,color .2s}
.salir svg{width:19px;height:19px;transition:transform .25s var(--ease)}
.salir:hover{background:var(--mal-bg);color:var(--mal)}
.salir:hover svg{transform:translateX(3px)}
.fema-firma{display:flex;align-items:center;gap:8px;padding:6px 8px 0;text-decoration:none;color:var(--ink-3);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.principal{padding:30px clamp(18px,3vw,44px) 60px;min-width:0}
.cabecera{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:24px}
.cabecera h1{margin:0;font-size:clamp(26px,3vw,34px);font-weight:800;letter-spacing:-.03em}
.cabecera p{margin:6px 0 0;color:var(--ink-3)}
.cabecera-acciones{display:flex;gap:10px;flex-wrap:wrap}
.abrir-menu{display:none}
.velo{display:none}

/* ---------- Tarjetas, KPIs ---------- */
.tarjeta{background:#fff;border:1px solid var(--linea);border-radius:16px;padding:20px 22px;margin-bottom:18px}
.tarjeta-cab{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.tarjeta-cab h2{margin:0;font-size:18px;font-weight:700;letter-spacing:-.01em;flex:1}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:18px}
.kpi{position:relative;display:flex;flex-direction:column;gap:2px;padding:18px 20px;border-radius:16px;border:1px solid var(--linea);background:#fff;text-decoration:none;color:var(--ink-1);transition:border-color .25s,box-shadow .25s}
.kpi-ic{position:absolute;top:16px;right:16px;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--bg-3);color:var(--azul);transition:background .3s,color .3s,transform .4s var(--ease)}
.kpi-ic svg{width:20px;height:20px}
.kpi-tit{font-size:14px;color:var(--ink-3);font-weight:500}
.kpi-num{font-size:34px;font-weight:800;letter-spacing:-.03em;margin-top:4px}
.kpi small{color:var(--ink-3);font-size:13px}
.kpi:hover{border-color:#cfcaf5;box-shadow:0 8px 24px rgba(30,22,156,.08)}
.kpi:hover .kpi-ic{background:var(--grad);color:#fff;transform:rotate(-8deg)}
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.dos-col > .tarjeta{margin-bottom:0}
.dos-col + *{margin-top:18px}
.vacio-chico{color:var(--ink-3);margin:6px 0;display:flex;align-items:center;gap:6px}
.vacio-chico svg{width:17px;height:17px;color:var(--ok)}
.vacio{text-align:center;padding:56px 20px;border:1.5px dashed var(--linea-2);border-radius:18px;background:var(--bg-2)}
.vacio h2{margin:0 0 8px;font-size:21px}
.vacio p{margin:0;color:var(--ink-3)}
.vacio-acciones{display:flex;justify-content:center;gap:10px;margin-top:18px;flex-wrap:wrap}
.fila-curso,.fila-alerta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;margin:0 -8px;border-radius:12px;text-decoration:none;color:var(--ink-1);
  background:linear-gradient(90deg,#f3f2fd,#f3f2fd) no-repeat left/0 100%;transition:background-size .35s var(--ease)}
.fila-curso:hover,.fila-alerta:hover{background-size:100% 100%}
.fila-curso + .fila-curso,.fila-alerta + .fila-alerta{border-top:1px solid var(--linea-soft,#f3f3f5)}
.curso-nom{font-weight:700;font-size:16px}
.curso-nom small,.fila-alerta small{display:block;font-weight:400;color:var(--ink-3);font-size:13px}
.accesos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.acceso{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;background:var(--bg-2);text-decoration:none;color:var(--ink-1);border:1px solid transparent;transition:border-color .25s,background .25s}
.acceso > svg{width:24px;height:24px;color:var(--violeta);transition:transform .35s var(--ease)}
.acceso b{display:block}
.acceso small{color:var(--ink-3)}
.acceso:hover{background:#fff;border-color:var(--linea-2)}
.acceso:hover > svg{transform:translateX(4px) scale(1.08)}

/* ---------- Filtros y tablas ---------- */
.filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.filtros select,.filtros input[type=date],.filtros input[type=month]{width:auto!important;min-width:200px}
.buscador{position:relative;flex:1;min-width:240px;max-width:440px;flex-direction:row}
.buscador svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--ink-3)}
.buscador input{padding-left:40px!important}
.segmentos{display:inline-flex;background:var(--bg-3);border-radius:11px;padding:4px}
.segmentos a{padding:8px 14px;border-radius:8px;text-decoration:none;color:var(--ink-2);font-weight:600;font-size:14.5px;transition:color .2s}
.segmentos a:hover{color:var(--azul)}
.segmentos a.es-activo{background:#fff;color:var(--azul);box-shadow:0 1px 3px rgba(10,14,39,.1)}
.tabla-caja{overflow-x:auto;border:1px solid var(--linea);border-radius:14px;background:#fff}
.tabla{width:100%;border-collapse:collapse;font-size:15px}
.tabla th{text-align:left;font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);font-weight:700;padding:12px 16px;border-bottom:1px solid var(--linea);background:var(--bg-2);white-space:nowrap}
.tabla td{padding:12px 16px;border-bottom:1px solid var(--linea);vertical-align:middle}
.tabla tbody tr:last-child td{border-bottom:0}
.tabla tbody tr{transition:background .15s}
.tabla tbody tr:hover{background:#faf9ff}
.tabla tr.apagada td{opacity:.55}
.tabla .sub{display:block;color:var(--ink-3);font-size:13px}
.tabla select{padding:7px 10px;font-size:14px;width:auto}
.enlace-fila{color:var(--ink-1);font-weight:600;text-decoration:none;background:linear-gradient(var(--azul),var(--azul)) no-repeat left bottom/0 1.5px;transition:background-size .3s var(--ease),color .2s}
.enlace-fila:hover{color:var(--azul);background-size:100% 1.5px}
.acciones-fila{text-align:right;white-space:nowrap}
.acciones-fila form{display:inline;margin-left:12px}
.pie-tabla{color:var(--ink-3);font-size:13.5px;margin:10px 4px}

/* ---------- Alumno ---------- */
.ficha{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.datos{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px 18px}
.dato span{display:block;font-size:12.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.dato b{font-weight:600}
.nota-salud{display:flex;gap:8px;margin-top:16px;padding:11px 14px;border-radius:10px;background:var(--ojo-bg);color:#7a3e05;font-size:14.5px}
.nota-salud svg{width:18px;height:18px}
.obs{color:var(--ink-2);margin:14px 0 0;line-height:1.5}
.mini-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:10px;margin-bottom:12px}
.mini-kpis div{background:var(--bg-2);border-radius:12px;padding:12px;text-align:center}
.mini-kpis b{display:block;font-size:24px;font-weight:800}
.mini-kpis span{font-size:12.5px;color:var(--ink-3)}
.mini-kpis .es-mal{background:var(--mal-bg)}
.mini-kpis .es-mal b{color:var(--mal)}
.lista-asis{list-style:none;padding:0;margin:0}
.lista-asis li{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--linea);font-size:14.5px;flex-wrap:wrap}
.lista-asis li span{min-width:86px;color:var(--ink-2)}
.lista-asis small{color:var(--ink-3);width:100%}
.estado{font-style:normal;font-size:13px;font-weight:700;padding:3px 9px;border-radius:7px;background:var(--bg-3);color:var(--ink-2)}
.estado.es-ausente{background:var(--mal-bg);color:var(--mal)}
.estado.es-tarde{background:var(--ojo-bg);color:var(--ojo)}
.estado.es-retiro{background:#f3ecfb;color:var(--violeta)}
.estado.es-justificado{background:#eef4ff;color:#1d4fb8}
.estado.es-presente{background:var(--ok-bg);color:var(--ok)}
.tutor{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--linea);flex-wrap:wrap}
.tutor b{display:block}
.tutor small{color:var(--ink-3)}
.tutor-datos{display:flex;gap:14px;flex-wrap:wrap;margin-top:4px;font-size:14px}
.tutor-datos a{text-decoration:none}
.tutor-der{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.tutor-acc{display:flex;gap:14px}
.desplegable{margin-top:14px;border-radius:14px}
.desplegable > summary{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-weight:600;color:var(--azul);list-style:none;padding:8px 2px}
.desplegable > summary::-webkit-details-marker{display:none}
.desplegable > summary svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.desplegable[open] > summary svg{transform:rotate(45deg)}
.desplegable > form{margin-top:12px;padding:18px;border:1px solid var(--linea);border-radius:14px;background:var(--bg-2)}
.zona-peligro > summary{color:var(--mal)}
.zona-peligro form{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}
.zona-peligro p{width:100%;margin:0;color:var(--ink-2)}
.en-linea{flex-direction:row;align-items:center;gap:10px}
.en-linea select{width:auto}
.copiar-enlace{display:flex;align-items:center;gap:10px;padding:12px 14px;margin-bottom:18px;border-radius:14px;background:#f5f4fe;border:1px solid #dcd9f7;flex-wrap:wrap}
.copiar-enlace span{display:flex;align-items:center;gap:6px;font-weight:600;color:var(--azul)}
.copiar-enlace svg{width:17px;height:17px}
.copiar-enlace input{flex:1;min-width:220px;font-size:13.5px!important;padding:8px 10px!important}
.pasos-import{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pasos-import .tarjeta{position:relative;padding-top:26px}
.pasos-import h2{margin:6px 0 8px;font-size:19px}
.pasos-import p{color:var(--ink-2);line-height:1.5}
.pasos-import form{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.paso-num{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800}

/* ---------- Cursos ---------- */
.nivel{margin-bottom:24px}
.nivel-tit{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--ink-3);margin:0 0 12px}
.cursos-grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.curso-card{display:flex;align-items:center;gap:14px;padding:16px;border-radius:16px;border:1px solid var(--linea);background:#fff;text-decoration:none;color:var(--ink-1);transition:border-color .25s}
.curso-grande{font-size:30px;font-weight:800;letter-spacing:-.04em;line-height:1;min-width:58px;transition:color .25s}
.curso-grande i{font-style:normal;font-size:18px;color:var(--violeta);margin-left:2px}
.curso-info b{display:block;font-size:15px}
.curso-info small{color:var(--ink-3)}
.curso-card:hover{border-color:var(--azul)}
.curso-card:hover .curso-grande{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.materias{list-style:none;padding:0;margin:0}
.materia{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--linea)}
.materia-nom{flex:1;font-weight:600}
.materia-doc select{padding:7px 10px;font-size:14px;max-width:200px}
.materia-nueva{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.materia-nueva input{flex:2;min-width:180px}
.materia-nueva select{flex:1;min-width:150px;width:auto}
.atajos{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.atajo{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--bg-2);text-decoration:none;color:var(--ink-1);font-weight:600;transition:background .25s,color .25s}
.atajo svg{width:20px;height:20px;color:var(--violeta)}
.atajo:hover{background:var(--azul);color:#fff}
.atajo:hover svg{color:#fff}

/* ---------- Asistencia ---------- */
.lista-cab{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.estado-lista{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--azul);background:var(--pend-bg);padding:6px 12px;border-radius:999px;font-size:14px}
.estado-lista.es-tomada{background:var(--ok-bg);color:var(--ok)}
.estado-lista svg{width:16px;height:16px}
.leyenda{display:flex;gap:12px;color:var(--ink-3);font-size:13px;flex:1;flex-wrap:wrap}
.lista-alumnos{list-style:none;margin:0;padding:0;border:1px solid var(--linea);border-radius:16px;background:#fff}
.alumno-lista{display:grid;grid-template-columns:34px 1fr auto;grid-template-areas:"n nom est" ". nota nota";gap:4px 12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--linea);transition:background .2s}
.alumno-lista:last-child{border-bottom:0}
.alumno-lista.con-marca{background:#fffafb}
.alumno-lista .n{grid-area:n;color:var(--ink-3);font-size:14px}
.al-nom{grid-area:nom}
.al-nom b{display:block}
.al-nom small{color:var(--ink-3);font-size:12.5px}
.estados{grid-area:est;display:flex;gap:6px}
.opc{position:relative;cursor:pointer}
.opc input{position:absolute;opacity:0}
.opc span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 8px;border-radius:11px;border:1.5px solid var(--linea-2);font-weight:800;font-size:14.5px;color:var(--ink-3);transition:background .15s,border-color .15s,color .15s}
.opc:hover span{border-color:var(--ink-3);color:var(--ink-1)}
.opc.es-presente input:checked + span{background:var(--ok);border-color:var(--ok);color:#fff}
.opc.es-ausente input:checked + span{background:var(--mal);border-color:var(--mal);color:#fff}
.opc.es-tarde input:checked + span{background:#e08a00;border-color:#e08a00;color:#fff}
.opc.es-retiro input:checked + span{background:var(--violeta);border-color:var(--violeta);color:#fff}
.opc.es-justificado input:checked + span{background:#1d4fb8;border-color:#1d4fb8;color:#fff}
.opc input:focus-visible + span{box-shadow:0 0 0 3px rgba(107,30,167,.3)}
.al-nota{grid-area:nota;display:none}
.alumno-lista.con-marca .al-nota{display:block;padding:8px 11px!important;font-size:14px!important;margin-top:4px}
.barra-guardar{position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px 16px;margin-top:14px;border-radius:14px;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border:1px solid var(--linea);box-shadow:0 -6px 24px rgba(10,14,39,.06)}
.planilla{max-height:70vh}
.tabla-mes th,.tabla-mes td{padding:8px 6px;font-size:13.5px}
.tabla-mes .dia{text-align:center;min-width:30px}
.tabla-mes td.dia.es-ausente{background:var(--mal-bg);color:var(--mal);font-weight:700}
.tabla-mes td.dia.es-tarde{background:var(--ojo-bg);color:var(--ojo);font-weight:700}
.tabla-mes td.dia.es-retiro{background:#f3ecfb;color:var(--violeta);font-weight:700}
.tabla-mes td.dia.es-justificado{background:#eef4ff;color:#1d4fb8;font-weight:700}
.tabla-mes td.dia.es-presente{color:var(--ok)}
.tabla-mes .sticky{position:sticky;left:0;background:#fff;z-index:1;white-space:nowrap;padding-left:14px}
.tabla-mes thead .sticky{background:var(--bg-2)}

/* ---------- Notas ---------- */
.tabla-notas td{padding:8px 12px}
.tabla-notas th.num{text-align:center}
.tabla-notas td:has(.nota){text-align:center}
.tabla-notas td.num:last-child,.tabla-notas th.num:last-child{text-align:right}
.nota{width:84px!important;text-align:center;font-weight:700;font-size:16px!important;padding:8px!important}
.nota.es-mal{color:var(--mal);border-color:#f5b5c0!important;background:var(--mal-bg)!important}

/* ---------- Comunicados ---------- */
.comunicados{border:1px solid var(--linea);border-radius:16px;background:#fff;overflow:hidden}
.comunicado-fila{display:flex;align-items:center;gap:18px;padding:16px 20px;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--ink-1);position:relative;transition:padding-left .3s var(--ease)}
.comunicado-fila::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad);opacity:0;transition:opacity .3s}
.comunicado-fila:hover{padding-left:26px}
.comunicado-fila:hover::before{opacity:1}
.comunicado-fila:last-child{border-bottom:0}
.com-txt{flex:1;min-width:0}
.com-txt b{display:block;font-size:16px}
.com-txt small{color:var(--ink-3)}
.com-lectura{width:200px;text-align:right}
.com-lectura small{color:var(--ink-3);font-size:13px}
.barra{display:block;height:7px;border-radius:9px;background:var(--bg-3);overflow:hidden;margin-bottom:6px}
.barra i{display:block;height:100%;background:var(--grad);border-radius:9px}
.destinos{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-bottom:14px}
.destino-opc{flex-direction:row;cursor:pointer}
.destino-opc input{position:absolute;opacity:0}
.destino-opc span{flex:1;padding:14px 16px;border-radius:12px;border:1.5px solid var(--linea-2);transition:border-color .2s,background .2s}
.destino-opc b{display:block;color:var(--ink-1)}
.destino-opc small{font-weight:400}
.destino-opc:hover span{border-color:#b9b4ef}
.destino-opc input:checked + span{border-color:var(--azul);background:#f5f4fe;box-shadow:inset 0 0 0 1px var(--azul)}
.destino-ref{display:none;max-width:420px}
.destino-ref.es-visible{display:block}
.texto-com{line-height:1.65;color:var(--ink-1);font-size:16px}
.com-meta{margin:16px 0 0;font-size:14px}

/* ---------- Configuración y personal ---------- */
.config-grilla{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.config-grilla .tarjeta{margin:0}
.logo-campo{display:flex;align-items:center;gap:16px}
.logo-prev{width:72px;height:72px;object-fit:contain;border-radius:14px;border:1px solid var(--linea);background:#fff}
.plan-info{margin-top:18px;padding:14px 16px;border-radius:12px;background:var(--bg-2);display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.plan-info span{font-size:13px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.plan-info small{color:var(--ink-3)}
.roles-ayuda{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:22px}
.roles-ayuda div{padding:14px 16px;border-radius:12px;background:var(--bg-2)}
.roles-ayuda b{display:block;margin-bottom:4px}
.roles-ayuda span{font-size:14px;color:var(--ink-2)}

/* ---------- Pantallas sueltas (ingreso): misma línea que FEMA CRM y FEMA CMS ---------- */
body.suelta{min-height:100vh;margin:0;display:flex;flex-direction:column;
  background:radial-gradient(900px 620px at 8% 0%,rgba(109,92,240,.16),transparent 64%),radial-gradient(760px 560px at 100% 12%,rgba(255,32,60,.11),transparent 62%),radial-gradient(700px 500px at 60% 110%,rgba(107,30,167,.08),transparent 60%),#f4f5fb}
.acc-barra{display:flex;justify-content:center;align-items:center;padding:20px 24px;background:#fff}
.acc-marca{display:flex;align-items:center;gap:20px;text-decoration:none}
.acc-marca > i{width:1px;height:34px;background:var(--linea-2)}
.acc-marca > b{font-size:24px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--rojo)}
.acc-escena{flex:1;width:100%;max-width:1180px;margin:0 auto;padding:clamp(28px,6vh,72px) 24px;display:grid;grid-template-columns:1fr minmax(0,560px);gap:clamp(30px,5vw,70px);align-items:center}
.acc-escena.es-ancha{grid-template-columns:minmax(0,720px);justify-content:center}

/* La tarjeta del formulario, con borde de degradado */
.acc-caja{position:relative;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box;border:5px solid transparent;border-radius:28px;padding:clamp(28px,4vw,46px);box-shadow:0 40px 80px -46px rgba(30,22,156,.55)}
.acc-colegio{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.acc-colegio img{width:34px;height:34px;object-fit:contain;border-radius:8px}
.acc-colegio .escudo{width:34px;height:34px;font-size:15px;border-radius:10px}
.suelta-tit{font-size:clamp(28px,3.4vw,38px);font-weight:800;letter-spacing:-.035em;margin:0 0 6px;color:var(--azul);line-height:1.1}
.suelta-txt{color:var(--ink-3);margin:0 0 22px;line-height:1.5;font-size:16px}
.acc-info{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;margin-bottom:20px;border-radius:12px;background:#f5f4fe;border:1px solid #dcd9f7;color:var(--azul);font-size:14.5px;line-height:1.55}
.acc-info > svg{width:18px;height:18px;margin-top:2px}
.acc-roles{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.acc-roles button{border:1.5px solid #cfcaf5;background:#fff;color:var(--azul);border-radius:999px;padding:5px 13px;font-size:13.5px;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.acc-roles button:hover,.acc-roles button.es-elegido{background:var(--azul);border-color:var(--azul);color:#fff}
.form-suelta{display:flex;flex-direction:column;gap:16px;text-align:left}
.form-suelta label{color:var(--ink-1);font-size:15px}
.form-suelta input:not([type=checkbox]):not([type=radio]){padding:13px 15px;font-size:16px}
.campo-clave{position:relative;display:block}
.campo-clave input{padding-right:48px!important}
.ver-clave{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:9px;background:none;color:var(--ink-3);cursor:pointer;display:grid;place-items:center;transition:color .2s,background .2s}
.ver-clave:hover{color:var(--azul);background:#f2f1fd}
.ver-clave svg{width:19px;height:19px}
.form-suelta .btn-primary{margin-top:4px;background:var(--azul);box-shadow:0 12px 26px -14px rgba(30,22,156,.9)}
.form-suelta .btn-primary:hover{background:linear-gradient(115deg,#1e169c,#6b1ea7 55%,#ff203c);box-shadow:0 14px 30px -14px rgba(255,32,60,.6)}
.suelta-ayuda{font-size:14px;color:var(--ink-3);margin:20px 0 0;padding-top:16px;border-top:1px solid var(--linea);line-height:1.5;text-align:center}
.suelta-pie{font-size:12.5px;color:var(--ink-3);margin:18px 0 0;text-align:center}
.suelta-pie a{color:var(--ink-3)}
.acc-caja > .btn-sec{margin-top:6px}

/* Al costado: las funciones del sistema, con sus avisos llegando */
.acc-demo{position:relative;min-height:520px;max-width:520px;justify-self:end;width:100%}
.acc-esc{position:absolute;inset:0 0 34px 0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility .6s}
.acc-esc.es-activa{opacity:1;visibility:visible}
.acc-titular{display:inline-block;background:#fff;border-radius:18px;padding:18px 22px;box-shadow:0 22px 44px -28px rgba(10,14,39,.45);margin-bottom:16px;transform:translateY(14px);opacity:0;transition:transform .7s var(--ease),opacity .7s}
.acc-titular span{display:block;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--rojo);margin-bottom:6px}
.acc-titular b{font-size:clamp(20px,2vw,25px);font-weight:800;letter-spacing:-.03em;color:var(--ink-1)}
.acc-titular em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.acc-esc.es-activa .acc-titular{transform:none;opacity:1}
/* Cada escena tiene su propia animación; arrancan cada vez que la escena se muestra */
.an{background:#fff;border-radius:18px;padding:18px 20px;box-shadow:0 26px 50px -32px rgba(10,14,39,.5);max-width:440px}
.an header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.an header b{font-size:15.5px}
.an header small{color:var(--ink-3);font-size:12.5px}
/* 1 · lista: las marcas se encienden una por una */
.an-lista ul{list-style:none;margin:0;padding:0}
.an-lista li{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #f0f1f5;font-size:14px;color:var(--ink-2)}
.an-lista em{font-style:normal;width:32px;height:28px;border-radius:8px;display:grid;place-items:center;font-weight:800;font-size:12.5px;background:#eef0f5;color:transparent}
.acc-esc.es-activa .an-lista em{animation:anMarca .35s var(--ease) forwards;animation-delay:calc(.6s + var(--i) * .45s)}
.an-lista em.es-p{--c:#14874a}.an-lista em.es-a{--c:#c8102e}.an-lista em.es-t{--c:#e08a00}
@keyframes anMarca{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1);background:var(--c);color:#fff}}
.an-lista-pie{display:flex;align-items:center;gap:8px;margin-top:12px;padding:10px 12px;border-radius:10px;background:var(--ok-bg);color:var(--ok);font-size:13.5px;font-weight:600;opacity:0}
.an-lista-pie svg{width:16px;height:16px}
.acc-esc.es-activa .an-lista-pie{animation:anAparece .5s 3.1s var(--ease) forwards}
@keyframes anAparece{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* 2 · boletín: las notas se escriben y el promedio crece */
.an-boletin table{width:100%;border-collapse:collapse;font-size:13.5px}
.an-boletin th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);font-weight:700;padding:4px;text-align:center}
.an-boletin td{padding:7px 4px;border-top:1px solid #f0f1f5;text-align:center;color:var(--ink-1)}
.an-boletin td:first-child{text-align:left;color:var(--ink-2)}
.an-boletin td span{display:inline-block;font-weight:800;opacity:0;filter:blur(4px)}
.acc-esc.es-activa .an-boletin td span{animation:anNota .3s ease forwards;animation-delay:calc(.5s + var(--i) * .16s)}
@keyframes anNota{to{opacity:1;filter:none}}
.an-boletin td i{display:block;height:7px;border-radius:7px;background:#eef0f5;position:relative;overflow:hidden;min-width:60px}
.an-boletin td i::after{content:'';position:absolute;inset:0 auto 0 0;width:0;background:var(--grad);border-radius:7px}
.acc-esc.es-activa .an-boletin td i::after{animation:anBarra 1s 2.6s var(--ease) forwards}
@keyframes anBarra{to{width:var(--w)}}
/* 3 · firmas: avatares que entran y anillo que se llena */
@property --pct{syntax:'<percentage>';inherits:false;initial-value:0%}
.an-firma-msg{display:flex;gap:12px;align-items:center;padding-bottom:14px;border-bottom:1px solid #f0f1f5}
.an-firma-msg > svg{width:36px;height:36px;padding:8px;border-radius:11px;background:#f2f1fd;color:var(--azul)}
.an-firma-msg b{display:block;font-size:15px}.an-firma-msg small{color:var(--ink-3);font-size:12.5px}
.an-firma-cuerpo{display:flex;gap:18px;align-items:center;padding-top:14px}
.an-anillo{--pct:0%;width:76px;height:76px;border-radius:50%;flex:none;display:grid;place-items:center;background:conic-gradient(#6b1ea7 var(--pct),#eef0f5 0)}
.an-anillo span{width:58px;height:58px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:800;font-size:16px;color:var(--azul);opacity:0}
.acc-esc.es-activa .an-anillo{animation:anAnillo 2.6s .6s var(--ease) forwards}
.acc-esc.es-activa .an-anillo span{animation:anAparece .4s 3s forwards}
@keyframes anAnillo{to{--pct:87%}}
.an-avatares{display:flex;margin-bottom:8px}
.an-avatares i{width:30px;height:30px;border-radius:50%;margin-right:-8px;border:2px solid #fff;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;color:#fff;background:var(--grad);transform:scale(0)}
.acc-esc.es-activa .an-avatares i{animation:anPop .35s var(--ease) forwards;animation-delay:calc(.5s + var(--i) * .28s)}
@keyframes anPop{60%{transform:scale(1.2)}to{transform:scale(1)}}
.an-firma small{color:var(--ink-3);font-size:13px}
/* 4 · pago: se toca el botón y la tarjeta da vuelta al comprobante */
.an-pago{background:none;box-shadow:none;padding:0}
.an-pago-tarjeta{position:relative;overflow:hidden;background:#fff;border-radius:18px;padding:20px;box-shadow:0 26px 50px -32px rgba(10,14,39,.5);max-width:300px}
.an-pago-tarjeta > small{display:block;color:var(--ink-3);font-size:12.5px}
.an-pago-tarjeta > b{display:block;font-size:28px;font-weight:800;letter-spacing:-.03em;margin:4px 0 14px}
.an-pago-btn{display:block;text-align:center;padding:11px;border-radius:11px;color:#fff;font-weight:700;font-size:14px;background:linear-gradient(115deg,#1e169c,#6b1ea7 55%,#ff203c)}
.acc-esc.es-activa .an-pago-btn{animation:anToque .5s 1.1s ease}
@keyframes anToque{50%{transform:scale(.94);filter:brightness(1.15)}}
.an-pago-ok{position:absolute;inset:0;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;clip-path:circle(0% at 50% 85%)}
.an-pago-ok svg{width:52px;height:52px;fill:none;stroke:#14874a;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.an-pago-ok circle{stroke-dasharray:145;stroke-dashoffset:145}
.an-pago-ok path{stroke-dasharray:40;stroke-dashoffset:40}
.an-pago-ok b{font-size:18px;color:var(--ok)}.an-pago-ok small{color:var(--ink-3);font-size:12.5px}
.acc-esc.es-activa .an-pago-ok{animation:anRevela .6s 1.6s var(--ease) forwards}
.acc-esc.es-activa .an-pago-ok circle{animation:anTrazo .6s 2s ease forwards}
.acc-esc.es-activa .an-pago-ok path{animation:anTrazo .4s 2.5s ease forwards}
@keyframes anRevela{to{clip-path:circle(150% at 50% 85%)}}
@keyframes anTrazo{to{stroke-dashoffset:0}}
.an-pago-factura{display:flex;gap:12px;align-items:center;margin:12px 0 0 60px;padding:12px 14px;background:#fff;border-radius:14px;box-shadow:0 18px 40px -30px rgba(10,14,39,.5);max-width:280px;opacity:0;transform:translateX(30px)}
.an-pago-factura svg{width:20px;height:20px;color:var(--violeta)}
.an-pago-factura b{display:block;font-size:14px}.an-pago-factura small{color:var(--ink-3);font-size:12px}
.acc-esc.es-activa .an-pago-factura{animation:anDesliza .6s 3.2s var(--ease) forwards}
@keyframes anDesliza{to{opacity:1;transform:none}}
/* 5 · tablero de inscripciones: la ficha cruza de columna */
.an-tablero{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px;height:190px}
.an-col{background:#f6f7fb;border-radius:12px;padding:10px;display:flex;justify-content:space-between;align-items:flex-start;font-size:12.5px}
.an-col b{color:var(--ink-2)}
.an-col i{font-style:normal;font-weight:800;color:var(--azul);background:#fff;border-radius:6px;padding:1px 7px}
.an-ficha{position:absolute;left:22px;top:62px;min-width:0;width:calc((100% - 64px) / 3);display:flex;gap:8px;align-items:center;background:#fff;border-radius:11px;padding:9px;box-shadow:0 12px 26px -14px rgba(30,22,156,.5);border:1.5px solid #dcd9f7}
.an-ficha > div{min-width:0}
.an-ficha span{width:26px;height:26px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:800;font-size:12px;background:var(--grad)}
.an-ficha b{display:block;font-size:12px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.an-ficha small{font-size:10.5px;color:var(--ink-3)}
.acc-esc.es-activa .an-ficha{animation:anCruza 4.2s .6s var(--ease) forwards}
@keyframes anCruza{0%,15%{transform:none}35%,55%{transform:translateX(calc(100% + 10px)) rotate(-2deg)}75%,100%{transform:translateX(calc(200% + 20px));border-color:#14874a}}
/* 6 · campus: el archivo cae en la tarea y aparece el sello */
.an-tarea{position:relative}
.an-tarea > small{color:var(--ink-3);font-size:12.5px}
.an-tarea > b{display:block;font-size:16px;margin:2px 0 12px}
.an-tarea-zona{height:70px;border:2px dashed #dcd9f7;border-radius:12px;display:grid;place-items:center;position:relative}
.an-archivo{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:10px;background:#f2f1fd;color:var(--azul);font-weight:700;font-size:13px;opacity:0;transform:translate(120px,-90px) rotate(14deg)}
.an-archivo svg{width:16px;height:16px}
.acc-esc.es-activa .an-archivo{animation:anCae .9s .7s cubic-bezier(.3,1.4,.5,1) forwards}
@keyframes anCae{to{opacity:1;transform:none}}
.an-sello{position:absolute;right:10px;bottom:6px;padding:4px 12px;border:2.5px solid #14874a;border-radius:8px;color:#14874a;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.08em;opacity:0;transform:scale(2.2) rotate(-14deg)}
.acc-esc.es-activa .an-sello{animation:anSello .35s 1.9s ease-in forwards}
@keyframes anSello{to{opacity:1;transform:scale(1) rotate(-10deg)}}
.an-tarea-barra{height:7px;border-radius:7px;background:#eef0f5;margin:14px 0 6px;overflow:hidden}
.an-tarea-barra i{display:block;height:100%;width:0;background:var(--grad)}
.acc-esc.es-activa .an-tarea-barra i{animation:anBarraT 1.4s 2.3s var(--ease) forwards}
@keyframes anBarraT{to{width:80%}}
.an-tarea-pie{color:var(--ink-3);font-size:12.5px}
.acc-puntos{position:absolute;left:0;bottom:0;display:flex;gap:8px}
.acc-puntos i{width:8px;height:8px;border-radius:50%;background:#d6d8e4;transition:width .4s var(--ease),background .4s}
.acc-puntos i.es-activo{width:26px;border-radius:5px;background:var(--grad)}
@media (max-width:980px){
  .acc-escena{grid-template-columns:minmax(0,560px);justify-content:center}
  .acc-demo{display:none}
}
@media (max-width:600px){
  .acc-barra{padding:14px}
  .acc-marca{gap:12px}
  .acc-marca .marca{--alto-logo:34px!important}
  .acc-marca > b{font-size:18px}
  .acc-escena{padding:22px 14px}
  .acc-caja{border-width:4px;border-radius:22px}
}
@media (prefers-reduced-motion:reduce){.acc-esc,.acc-titular{transition:none}.acc-esc *{animation-duration:.01s!important;animation-delay:0s!important}}

/* ---------- App de familias ---------- */
body.familia{background:var(--bg-2);min-height:100vh;padding-bottom:84px}
.fam-cabecera{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.fam-colegio{display:flex;align-items:center;gap:12px}
.fam-colegio img{width:40px;height:40px;object-fit:contain;border-radius:10px}
.fam-colegio .escudo{width:40px;height:40px;font-size:18px}
.fam-colegio b{display:block;font-size:15px}
.fam-colegio small{color:var(--ink-3)}
.fam-principal{max-width:620px;margin:0 auto;padding:18px 16px}
.fam-bloque{background:#fff;border-radius:18px;padding:16px 16px 10px;margin-bottom:16px;border:1px solid var(--linea)}
.fam-bloque h2{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-3)}
.fam-aviso{display:flex;align-items:center;gap:12px;padding:13px 4px;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--ink-1)}
.fam-aviso:last-child{border-bottom:0}
.fam-aviso > span:nth-child(2){flex:1}
.fam-aviso b{display:block}
.fam-aviso small{color:var(--ink-3)}
.fam-aviso > svg{width:18px;height:18px;color:var(--ink-3);transition:transform .25s var(--ease),color .2s}
.fam-aviso:hover > svg{transform:translateX(4px);color:var(--azul)}
.fam-aviso.es-leido b{font-weight:500;color:var(--ink-2)}
.punto{width:10px;height:10px;border-radius:50%;background:var(--rojo);box-shadow:0 0 0 4px rgba(255,32,60,.15);flex:none}
.punto.es-leido{background:var(--linea-2);box-shadow:none}
.hijo-card{display:flex;align-items:center;gap:14px;padding:14px 4px;border-bottom:1px solid var(--linea);text-decoration:none;color:var(--ink-1)}
.hijo-card:last-of-type{border-bottom:0}
.hijo-ini{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;font-size:20px;flex:none;transition:transform .5s var(--ease)}
.hijo-card:hover .hijo-ini{transform:rotate(-12deg)}
.hijo-txt{flex:1;min-width:0}
.hijo-txt b{display:block;font-size:16.5px}
.hijo-txt small{color:var(--ink-3)}
.hijo-hoy{text-align:right}
.hijo-hoy small{display:block;color:var(--ink-3);font-size:12.5px;margin-top:4px}
.fam-tabs{position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;justify-content:space-around;background:#fff;border-top:1px solid var(--linea);padding:8px 8px calc(8px + env(safe-area-inset-bottom))}
.tab{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 18px;border-radius:12px;text-decoration:none;color:var(--ink-3);font-size:12.5px;font-weight:600;transition:color .2s}
.tab svg{width:23px;height:23px;transition:transform .3s var(--ease)}
.tab:hover svg{transform:scale(1.1)}
.tab.es-activo{color:var(--azul)}
.tab.es-activo::after{content:'';position:absolute;top:-8px;left:30%;right:30%;height:3px;border-radius:0 0 3px 3px;background:var(--grad)}
.burbuja{position:absolute;top:2px;right:12px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--rojo);color:#fff;font-style:normal;font-size:11px;font-weight:800;display:grid;place-items:center}
.fam-seg{display:flex;margin-bottom:14px}
.fam-seg a{flex:1;text-align:center}
.faltas-grande{text-align:center;padding:10px 0 16px}
.faltas-grande b{display:block;font-size:48px;font-weight:800;letter-spacing:-.04em}
.faltas-grande > span{color:var(--ink-3)}
.faltas-grande .barra{margin:14px auto 6px;max-width:300px}
.faltas-grande small{color:var(--ink-3);font-size:13px}
.faltas-grande.es-mal b{color:var(--mal)}
.fam-comunicado{background:#fff;border-radius:18px;padding:22px 20px;border:1px solid var(--linea)}
.fam-comunicado h1{margin:0 0 4px;font-size:22px;letter-spacing:-.02em}
.form-firma{margin-top:22px;padding-top:18px;border-top:1px solid var(--linea)}
.form-firma p{color:var(--ink-2);font-size:14.5px;line-height:1.5}
.firmado{display:flex;align-items:center;gap:10px;margin-top:22px;padding:14px;border-radius:12px;background:var(--ok-bg);color:var(--ok);font-weight:700}
.firmado svg{width:22px;height:22px}
.instalar{text-align:center}
.boletin-movil .boletin{box-shadow:none;border:1px solid var(--linea);border-radius:18px;padding:16px;margin:0}
.boletin-movil .bol-tabla{font-size:13.5px}

/* ---------- Boletín (pantalla e impresión) ---------- */
body.impresion{background:var(--bg-3);padding:20px}
.barra-imprimir{max-width:820px;margin:0 auto 16px;display:flex;align-items:center;gap:14px;justify-content:space-between;flex-wrap:wrap;color:var(--ink-2);font-size:14px}
.boletin{max-width:820px;margin:0 auto 24px;background:#fff;padding:34px 38px;border-radius:6px;box-shadow:0 10px 30px rgba(10,14,39,.08);page-break-after:always}
.bol-cab{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:3px solid transparent;border-image:var(--grad) 1}
.bol-cab img{width:64px;height:64px;object-fit:contain}
.bol-cab h1{margin:0;font-size:21px}
.bol-cab p{margin:2px 0 0;color:var(--ink-3);font-size:13.5px}
.bol-cab > div:nth-child(2){flex:1}
.bol-tit{text-align:right;font-size:13px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em}
.bol-tit b{display:block;color:var(--ink-1);font-size:15px;letter-spacing:0;text-transform:none}
.bol-alumno{display:grid;grid-template-columns:2fr 1fr 1.5fr;gap:12px;margin:18px 0}
.bol-alumno span{display:block;font-size:12px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.bol-tabla{width:100%;border-collapse:collapse;font-size:14.5px}
.bol-tabla th{background:var(--bg-2);font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);padding:9px 10px;border:1px solid var(--linea-2)}
.bol-tabla td{padding:9px 10px;border:1px solid var(--linea-2);text-align:center}
.bol-tabla td.mat{text-align:left;font-weight:600}
.bol-asis{display:flex;gap:18px;flex-wrap:wrap;margin:16px 0;font-size:14px;color:var(--ink-2)}
.bol-firmas{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:56px}
.bol-firmas div{border-top:1px solid var(--ink-3);padding-top:6px;text-align:center;font-size:12.5px;color:var(--ink-3)}
.bol-pie{margin:22px 0 0;font-size:11.5px;color:var(--ink-3);text-align:right}
@media print{
  body.impresion{background:#fff;padding:0}
  .no-imprimir,.cinta-testeo{display:none!important}
  .boletin{box-shadow:none;margin:0;padding:10mm 8mm;max-width:none;border-radius:0}
  .bol-tabla th{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- Celular ---------- */
@media (max-width:980px){
  .armazon{grid-template-columns:1fr}
  .lateral{position:fixed;left:0;top:0;z-index:60;width:280px;transform:translateX(-100%);transition:transform .35s var(--ease);box-shadow:20px 0 40px rgba(10,14,39,.12)}
  body.menu-abierto .lateral{transform:none}
  body.menu-abierto .velo{display:block;position:fixed;inset:0;z-index:50;background:rgba(10,14,39,.35)}
  .abrir-menu{display:inline-flex;flex-direction:column;gap:4px;justify-content:center;align-items:center;width:42px;height:42px;border-radius:11px;border:1px solid var(--linea);background:#fff;margin-bottom:14px;cursor:pointer}
  .abrir-menu span{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink-1)}
  .principal{padding-top:18px}
  .dos-col,.ficha,.config-grilla,.pasos-import{grid-template-columns:1fr}
  .dos-col > .tarjeta{margin-bottom:0}
}
@media (max-width:600px){
  .cinta-testeo{position:static;transform:none;display:block;text-align:center;border-radius:0;font-size:11px;padding:3px 8px}
  .alumno-lista{grid-template-columns:28px 1fr;grid-template-areas:"n nom" "est est" "nota nota"}
  .estados{justify-content:space-between}
  .opc{flex:1}
  .opc span{min-width:0;width:100%}
  .leyenda{display:none}
  .comunicado-fila{flex-direction:column;align-items:stretch;gap:8px}
  .com-lectura{width:auto;text-align:left}
  .filtros > select,.filtros > input{flex:1 1 150px;min-width:0!important}
  .filtros > .segmentos{flex:1 1 100%}
  .filtros > .segmentos a{flex:1;text-align:center}
  .boletin{padding:18px 14px}
  .bol-alumno{grid-template-columns:1fr}
  .bol-cab{flex-wrap:wrap}
  .bol-tit{text-align:left;width:100%}
  .kpi-num{font-size:28px}
}

/* ============================================================
   Etapas 2 y 3: cuotas, facturas, inscripciones, campus, horarios, informes
   ============================================================ */
.subnav{margin-bottom:18px}
.kpis-2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.kpis-3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
div.kpi{cursor:default}
.chip-link{text-decoration:none;transition:background .2s,color .2s}
.chip-link:hover{background:var(--azul);color:#fff}
.chips-filtro{gap:8px}
.chips-filtro .chip{text-decoration:none;padding:7px 13px;font-size:13.5px;transition:box-shadow .2s}
.chips-filtro .chip:hover{box-shadow:inset 0 0 0 1.5px currentColor}
.trampa{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}
.lista-simple{list-style:none;margin:0;padding:0}
.lista-simple li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--linea);font-size:15px}
.lista-simple li:last-child{border-bottom:0}
.lista-simple li span small{display:block;color:var(--ink-3);font-size:12.5px}
.sugerencia{display:flex;align-items:center;gap:14px;padding:14px 18px;margin-bottom:18px;border-radius:14px;background:linear-gradient(90deg,#f5f4fe,#fff5f7);border:1px solid #e3dff8;text-decoration:none;color:var(--ink-1)}
.sugerencia > svg:first-child{width:22px;height:22px;color:var(--violeta)}
.sugerencia span{flex:1}
.sugerencia small{display:block;color:var(--ink-3)}
.sugerencia > svg:last-child{width:18px;height:18px;color:var(--azul);transition:transform .3s var(--ease)}
.sugerencia:hover > svg:last-child{transform:translateX(6px)}

/* Cobro en el panel */
tr.es-vencida td{background:#fffafb}
.tabla td label.check{font-weight:600}
.barra-cobro{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-top:16px;padding:16px;border-radius:14px;background:var(--bg-2)}
.barra-cobro label{flex:1;min-width:160px}
.barra-cobro label small{display:inline}
.tabla td.num{white-space:nowrap}
.total-cobro{display:flex;flex-direction:column;align-items:flex-end;margin-left:auto}
.total-cobro span{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.total-cobro b{font-size:26px;font-weight:800;letter-spacing:-.02em}
.barra-generar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:14px;padding:14px 16px;border-radius:14px;background:var(--bg-2);color:var(--ink-2);font-size:14px}
.barra-generar span{flex:1;min-width:260px}
.desplegable.en-fila{display:inline-block;margin:0 0 0 12px;text-align:left}
.desplegable.en-fila > summary{padding:0;font-size:14.5px}
.desplegable.en-fila > summary svg{width:15px;height:15px}
.form-mini{position:absolute;right:20px;z-index:5;display:flex;flex-direction:column;gap:10px;width:260px;padding:16px!important;box-shadow:0 18px 40px rgba(10,14,39,.14);background:#fff!important}
.acciones-fila{position:relative}

/* Cuotas en la app de familias */
.cuota{display:flex;flex-direction:row;align-items:center;gap:12px;padding:14px 4px;border-bottom:1px solid var(--linea);cursor:pointer;font-weight:400;color:var(--ink-1)}
.cuota input{width:20px;height:20px;accent-color:var(--azul);flex:none}
.cuota-txt{flex:1;min-width:0}
.cuota-txt b{display:block;font-size:15.5px}
.cuota-txt small{color:var(--ink-3);font-size:13px}
.cuota-monto{font-size:16px;white-space:nowrap}
.cuota.es-vencida .cuota-txt small{color:var(--mal)}
.pagar-pie{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:16px 0 8px}
.pagar-pie .total-cobro{flex-direction:row;justify-content:space-between;align-items:baseline;margin:0}
.pagar-pie small{text-align:center;color:var(--ink-3)}
.fam-ok,.fam-info,.al-dia{display:flex;gap:12px;align-items:flex-start;padding:16px;border-radius:16px;margin-bottom:16px}
.fam-ok{background:var(--ok-bg);color:#0d5c32}
.fam-info{background:var(--pend-bg);color:var(--azul)}
.al-dia{margin:0;color:var(--ok)}
.fam-ok svg,.fam-info svg,.al-dia svg{width:26px;height:26px;flex:none}
.fam-ok b,.fam-info b,.al-dia b{display:block;font-size:16px}
.fam-ok span,.fam-info span,.al-dia span{color:var(--ink-2);font-size:14.5px}
.fam-cuota{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink-1);padding:16px!important}
.fam-cuota .kpi-ic{position:static;background:var(--pend-bg)}
.fam-cuota > span:nth-child(2){flex:1}
.fam-cuota small{display:block;color:var(--ink-3)}
.fam-cuota.es-vencida{border-color:#f5b5c0;background:#fffafb}
.fam-cuota.es-vencida .kpi-ic{background:var(--mal-bg);color:var(--mal)}
.fam-cuota:hover .btn-link::after{width:100%}
.reinsc-fila{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--linea)}
.reinsc-fila b{display:block}
.reinsc-fila small{color:var(--ink-3)}
.fam-bloque.es-hoy{border-color:#cfcaf5;box-shadow:inset 3px 0 0 var(--violeta)}

/* Documentos imprimibles: recibo, factura, constancia, acta */
.bol-tabla tfoot td{background:var(--bg-2);font-weight:700}
.fac-cab{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:start;padding-bottom:16px;border-bottom:2px solid var(--ink-1)}
.fac-cab h1{margin:0 0 4px;font-size:19px}
.fac-cab h2{margin:0 0 6px;font-size:22px}
.fac-cab p{margin:2px 0;font-size:13.5px;color:var(--ink-2)}
.fac-cab > div:last-child{text-align:right}
.fac-letra{display:flex;flex-direction:column;align-items:center;justify-content:center;width:64px;height:64px;border:2px solid var(--ink-1);border-radius:6px}
.fac-letra b{font-size:34px;line-height:1}
.fac-letra small{font-size:10.5px}
.fac-pie{display:flex;gap:20px;align-items:center;margin-top:22px;padding-top:16px;border-top:1px solid var(--linea-2)}
.fac-pie p{margin:3px 0;font-size:14px}
.qr{width:120px;height:120px;flex:none}
.qr svg{width:100%;height:100%;display:block}
.qr-tfa{width:170px;height:170px;margin:12px 0;padding:10px;background:#fff;border:1px solid var(--linea);border-radius:12px}
.const-tit{text-align:center;font-size:22px;margin:40px 0 28px;letter-spacing:.02em;text-transform:uppercase}
.const-txt{font-size:16.5px;line-height:1.9;text-align:justify;margin:0 0 18px}
.firmas-dos{grid-template-columns:repeat(2,1fr);margin-top:90px}

/* Factura electrónica: pasos */
.pasos-arca{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:16px;color:var(--ink-2);line-height:1.5}
.pasos-arca li::marker{color:var(--violeta);font-weight:800}
.pasos-arca b{color:var(--ink-1)}
.pasos-arca form{margin-top:8px}
.pasos-arca code{background:var(--bg-3);padding:2px 6px;border-radius:6px;font-size:13.5px}

/* Inscripciones */

.form-inscripcion fieldset{border:1px solid var(--linea);border-radius:14px;padding:16px 18px 18px;margin:0}
.form-inscripcion legend{padding:0 8px;font-weight:700}
.inscribir{margin-top:22px;padding-top:18px;border-top:1px solid var(--linea);display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.inscribir h3{margin:0}
.inscribir p{margin:0}
.inscribir label{width:100%}
.reinsc{padding:0;overflow:hidden}
.reinsc > summary{display:grid;grid-template-columns:200px 1fr 90px;align-items:center;gap:16px;padding:16px 20px;cursor:pointer;list-style:none;transition:background .2s}
.reinsc > summary::-webkit-details-marker{display:none}
.reinsc > summary:hover{background:#faf9ff}
.reinsc > summary .barra{margin:0}
.reinsc > summary > span:last-child{text-align:right;color:var(--ink-3);font-size:14px}
.lista-reinsc{list-style:none;margin:0;padding:6px 20px 14px;columns:2;column-gap:28px}
.lista-reinsc li{display:flex;align-items:center;gap:8px;padding:6px 0;break-inside:avoid;font-size:14.5px;color:var(--ink-3)}
.lista-reinsc li.es-ok{color:var(--ink-1)}
.lista-reinsc li svg{width:16px;height:16px;color:var(--ok)}
.lista-reinsc li small{margin-left:auto;color:var(--ink-3)}

/* Campus */
.materia-card{gap:12px}
.materia-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--pend-bg);color:var(--azul);flex:none;transition:background .3s,color .3s}
.materia-ic svg{width:22px;height:22px}
.materia-ic.chico{width:36px;height:36px;border-radius:10px}
.materia-ic.chico svg{width:18px;height:18px}
.materia-card:hover .materia-ic{background:var(--grad);color:#fff}
.nueva-pub > summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:700;color:var(--azul);list-style:none}
.nueva-pub > summary::-webkit-details-marker{display:none}
.nueva-pub > summary svg{width:18px;height:18px;transition:transform .3s var(--ease)}
.nueva-pub[open] > summary{margin-bottom:16px}
.nueva-pub[open] > summary svg{transform:rotate(45deg)}
.segmentos-radio{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.publicacion{position:relative;background:#fff;border:1px solid var(--linea);border-radius:16px;padding:18px 22px;margin-bottom:14px;overflow:hidden}
.publicacion::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--pend-bg)}
.publicacion.es-tarea::before{background:var(--grad)}
.publicacion header{display:flex;justify-content:space-between;align-items:center;color:var(--ink-3);font-size:13px}
.pub-tipo{display:inline-flex;align-items:center;gap:6px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--violeta)}
.pub-tipo svg{width:16px;height:16px}
.publicacion h3{margin:8px 0;font-size:19px}
.publicacion h3 a{color:var(--ink-1);text-decoration:none;background:linear-gradient(var(--azul),var(--azul)) no-repeat left bottom/0 2px;transition:background-size .3s var(--ease)}
.publicacion h3 a:hover{background-size:100% 2px}
.pub-cuerpo{color:var(--ink-2);line-height:1.6}
.pub-adj{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.adjunto{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:10px;background:var(--bg-2);color:var(--ink-1);text-decoration:none;font-size:14px;font-weight:600;border:1px solid var(--linea);transition:border-color .2s,color .2s}
.adjunto svg{width:16px;height:16px;color:var(--violeta)}
.adjunto:hover{border-color:var(--violeta);color:var(--violeta)}
.publicacion footer{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--linea)}
.publicacion footer .enlace-flecha{margin:0}
.publicacion footer form{margin-left:auto}
.tabla-entregas td{vertical-align:top}
.tabla-entregas textarea{min-width:220px;font-size:14px!important}
.entrega-txt{max-width:420px;font-size:14px;color:var(--ink-2);line-height:1.5;margin-bottom:6px}
.devolucion{margin-top:18px;padding:14px 16px;border-radius:12px;background:var(--ok-bg);color:#0d5c32}
.devolucion p{margin:6px 0 0;color:var(--ink-1)}

/* Horarios */
.tabla-horario th{text-align:center}
.tabla-horario td{padding:6px;text-align:center}
.tabla-horario td.hora{white-space:nowrap;font-weight:600;color:var(--ink-2);text-align:left;padding-left:14px}
.tabla-horario td.hora input{width:122px!important;padding:6px 8px!important;font-size:13.5px!important;display:inline-block;margin:2px}
.tabla-horario select{width:100%;min-width:120px;padding:8px!important;font-size:13.5px!important;color:var(--ink-3)}
.tabla-horario select.con-materia{background:#f5f4fe;border-color:#cfcaf5;color:var(--azul);font-weight:600}
.modulo{display:block;padding:8px;border-radius:9px;background:#f5f4fe;color:var(--azul);font-weight:600;font-size:14px}
.modulo + .modulo{margin-top:4px}
.modulo small{display:block;color:var(--ink-3);font-weight:500;font-size:12px}

/* Informes */
.barra-tabla{width:160px;margin:0}

@media (max-width:600px){
  .reinsc > summary{grid-template-columns:1fr 70px}
  .reinsc > summary .barra{grid-column:1/-1;grid-row:2}
  .lista-reinsc{columns:1}
  .segmentos-radio{grid-template-columns:1fr}
  .fac-cab{grid-template-columns:1fr auto}
  .fac-cab > div:last-child{grid-column:1/-1;text-align:left}
  .barra-cobro label{min-width:100%}
  .total-cobro{margin-left:0;align-items:flex-start}
  .form-mini{position:static;width:auto}
}
@media print{ .qr svg{width:110px;height:110px} }
body.suelta .cinta-testeo{position:static;transform:none;display:block;text-align:center;border-radius:0}