/* ==========================================================================
   Bienestar y Formación · Gestión Idónea S.A.S.
   Identidad: azul #114A77 · verde lima #B3CF3A · "Trabajo Inteligente"
   ========================================================================== */

:root{
  --azul:#114A77; --azul-osc:#0C3557; --azul-cla:#1C6BA8; --azul-ola:#07649D;
  --verde:#B3CF3A; --verde-osc:#7E9424; --verde-cla:#E8F0D0;
  --tinta:#16202B; --texto:#2A3644; --suave:#5C6B7A; --tenue:#8894A2;
  --fondo:#F4F7FA; --panel:#FFFFFF; --panel-2:#F8FAFC;
  --linea:#E3E8ED; --linea-2:#EEF2F5;
  --ok:#2E7D4F; --ok-bg:#E8F4EC;
  --alerta:#B5761F; --alerta-bg:#FDF4E3;
  --error:#B3352F; --error-bg:#FBECEB;
  --info:#1C6BA8; --info-bg:#E9F1F8;
  --r:12px; --r-s:8px; --r-l:18px;
  --sombra:0 1px 2px rgba(17,74,119,.05), 0 2px 8px rgba(17,74,119,.05);
  --sombra-alta:0 4px 20px rgba(17,74,119,.12);
  --fuente:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --max:1180px;
}

@media (prefers-color-scheme:dark){
  :root:not([data-tema="claro"]){
    --tinta:#EEF3F8; --texto:#D3DDE7; --suave:#94A3B2; --tenue:#75828F;
    --fondo:#0D1620; --panel:#152130; --panel-2:#1B2937;
    --linea:#25354A; --linea-2:#1F2E40;
    --azul-cla:#4E9BD8; --verde-cla:#2B3A1B;
    --ok-bg:#16301F; --alerta-bg:#33270F; --error-bg:#361A18; --info-bg:#132A3E;
    --sombra:0 1px 2px rgba(0,0,0,.3), 0 2px 8px rgba(0,0,0,.25);
    --sombra-alta:0 6px 24px rgba(0,0,0,.45);
  }
}
:root[data-tema="oscuro"]{
  --tinta:#EEF3F8; --texto:#D3DDE7; --suave:#94A3B2; --tenue:#75828F;
  --fondo:#0D1620; --panel:#152130; --panel-2:#1B2937;
  --linea:#25354A; --linea-2:#1F2E40;
  --azul-cla:#4E9BD8; --verde-cla:#2B3A1B;
  --ok-bg:#16301F; --alerta-bg:#33270F; --error-bg:#361A18; --info-bg:#132A3E;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--fondo);color:var(--texto);
  font-family:var(--fuente);font-size:15px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,svg{max-width:100%;height:auto;vertical-align:middle}
a{color:var(--azul-cla);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--tinta);margin:0 0 .5em;line-height:1.25;letter-spacing:-.01em}
h1{font-size:clamp(23px,4.4vw,31px);font-weight:700}
h2{font-size:clamp(18px,3vw,22px);font-weight:700}
h3{font-size:16.5px;font-weight:650}
h4{font-size:14px;font-weight:650}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.25em}
li{margin-bottom:.35em}
hr{border:0;border-top:1px solid var(--linea);margin:24px 0}
small{font-size:12.5px}
:focus-visible{outline:2px solid var(--azul-cla);outline-offset:2px;border-radius:4px}

/* ---------------------------------------------------------------- layout */
.contenedor{max-width:var(--max);margin:0 auto;padding:0 18px}
.contenedor.angosto{max-width:780px}
.contenedor.medio{max-width:960px}
.pagina{padding:26px 0 96px}
@media(min-width:900px){.pagina{padding:32px 0 60px}}

.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.fila{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.fila.entre{justify-content:space-between}
.fila.fin{justify-content:flex-end}
.fila.arriba{align-items:flex-start}
.crece{flex:1;min-width:0}
.sep{height:1px;background:var(--linea);margin:20px 0}
.centro{text-align:center}
.mt0{margin-top:0}.mb0{margin-bottom:0}
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}
.mb8{margin-bottom:8px}.mb16{margin-bottom:16px}.mb24{margin-bottom:24px}
.oculto{display:none !important}
@media(max-width:699px){.solo-ancho{display:none !important}}
@media(min-width:700px){.solo-angosto{display:none !important}}

/* ---------------------------------------------------------------- marca */
.logo-gi{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo-gi:hover{text-decoration:none}
.logo-g{width:34px;height:42px;background:var(--azul);color:#fff;display:flex;
  align-items:center;justify-content:center;font:700 25px/1 Georgia,'Times New Roman',serif;flex:none;border-radius:3px}
.logo-tx{display:flex;flex-direction:column;line-height:1.05}
.logo-tx b{font-size:15px;font-weight:800;letter-spacing:2px;color:var(--azul)}
.logo-tx span{font-size:8.5px;letter-spacing:1.5px;text-transform:uppercase;color:var(--verde-osc);margin-top:3px}
.barra-tema .logo-g{background:#fff;color:var(--azul)}
.barra-tema .logo-tx b{color:#fff}
.barra-tema .logo-tx span{color:var(--verde)}

/* ---------------------------------------------------------------- cabecera */
.cabecera{position:sticky;top:0;z-index:40;background:var(--panel);
  border-bottom:1px solid var(--linea);box-shadow:0 1px 3px rgba(17,74,119,.04)}
.cabecera .inner{max-width:var(--max);margin:0 auto;padding:10px 18px;display:flex;align-items:center;gap:14px}
.cab-nav{display:none;gap:2px;margin-left:10px}
@media(min-width:960px){.cab-nav{display:flex}}
.cab-nav a{padding:8px 13px;border-radius:var(--r-s);font-size:13.5px;font-weight:550;color:var(--suave);white-space:nowrap}
.cab-nav a:hover{background:var(--panel-2);color:var(--tinta);text-decoration:none}
.cab-nav a.on{background:var(--azul);color:#fff}
.cab-der{margin-left:auto;display:flex;align-items:center;gap:10px}

.avatar{width:36px;height:36px;border-radius:50%;background:var(--azul);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex:none;letter-spacing:.4px}
.avatar.v{background:var(--verde);color:#293b05}
.avatar.g{width:52px;height:52px;font-size:18px}
.avatar.xg{width:74px;height:74px;font-size:25px}

/* barra inferior en celular */
.nav-pie{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;
  background:var(--panel);border-top:1px solid var(--linea);padding:6px 4px
  calc(6px + env(safe-area-inset-bottom));box-shadow:0 -2px 12px rgba(17,74,119,.07)}
@media(min-width:960px){.nav-pie{display:none}}
.nav-pie a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:6px 2px;font-size:10px;font-weight:600;color:var(--tenue);border-radius:var(--r-s);text-align:center}
.nav-pie a:hover{text-decoration:none}
.nav-pie a.on{color:var(--azul)}
.nav-pie .ic{font-size:17px;line-height:1}

/* ---------------------------------------------------------------- panel/tarjeta */
.tarjeta{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:20px;box-shadow:var(--sombra)}
.tarjeta.plana{box-shadow:none}
.tarjeta.ajustada{padding:15px}
.tarjeta.holgada{padding:26px}
a.tarjeta{display:block;color:inherit;transition:border-color .15s,transform .15s,box-shadow .15s}
a.tarjeta:hover{text-decoration:none;border-color:var(--azul-cla);box-shadow:var(--sombra-alta);transform:translateY(-2px)}
.tarjeta-t{display:flex;align-items:center;gap:10px;margin:-2px 0 14px}
.tarjeta-t h3,.tarjeta-t h2{margin:0}
.tarjeta-borde{border-left:4px solid var(--azul)}
.tarjeta-borde.v{border-left-color:var(--verde)}
.tarjeta-borde.a{border-left-color:var(--alerta)}
.tarjeta-borde.e{border-left-color:var(--error)}

.kicker{font-size:10.5px;font-weight:750;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--verde-osc);margin:0 0 6px}
.kicker.azul{color:var(--azul-cla)}
.apunte{color:var(--suave);font-size:13.5px}
.tenue{color:var(--tenue)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;letter-spacing:.3px}

/* ---------------------------------------------------------------- héroe */
.heroe{background:linear-gradient(135deg,var(--azul) 0%,var(--azul-osc) 100%);
  color:#fff;border-radius:var(--r-l);padding:26px 24px;position:relative;overflow:hidden}
.heroe::after{content:'';position:absolute;right:-60px;top:-70px;width:230px;height:230px;
  border-radius:50%;background:rgba(179,207,58,.14)}
.heroe::before{content:'';position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--verde)}
.heroe h1,.heroe h2{color:#fff;margin:0 0 6px;position:relative}
.heroe p{color:rgba(255,255,255,.86);margin:0;position:relative;max-width:62ch}
.heroe .fila{position:relative}
.heroe .kicker{color:var(--verde)}

/* ---------------------------------------------------------------- etiquetas */
.eti{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:99px;
  font-size:11.5px;font-weight:650;background:var(--panel-2);color:var(--suave);
  border:1px solid var(--linea);white-space:nowrap;line-height:1.5}
.eti.azul{background:var(--info-bg);color:var(--info);border-color:transparent}
.eti.verde{background:var(--ok-bg);color:var(--ok);border-color:transparent}
.eti.ambar{background:var(--alerta-bg);color:var(--alerta);border-color:transparent}
.eti.roja{background:var(--error-bg);color:var(--error);border-color:transparent}
.eti.solida{background:var(--azul);color:#fff;border-color:transparent}
.eti.lima{background:var(--verde);color:#2B3A08;border-color:transparent}
.eti.g{font-size:13px;padding:5px 13px}
.punto{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}

/* ---------------------------------------------------------------- botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;border-radius:var(--r-s);border:1px solid transparent;
  background:var(--azul);color:#fff;font:600 14.5px/1.2 var(--fuente);cursor:pointer;
  text-decoration:none;transition:background .15s,border-color .15s,transform .05s;white-space:nowrap}
.btn:hover{background:var(--azul-osc);text-decoration:none;color:#fff}
.btn:active{transform:translateY(1px)}
.btn[disabled],.btn.inactivo{opacity:.5;pointer-events:none}
.btn.sec{background:var(--panel);color:var(--tinta);border-color:var(--linea)}
.btn.sec:hover{background:var(--panel-2);color:var(--tinta);border-color:var(--azul-cla)}
.btn.lima{background:var(--verde);color:#2B3A08}
.btn.lima:hover{background:var(--verde-osc);color:#fff}
.btn.fantasma{background:transparent;color:var(--azul-cla)}
.btn.fantasma:hover{background:var(--panel-2);color:var(--azul)}
.btn.peligro{background:var(--error)}
.btn.peligro:hover{background:#8E2A25}
.btn.wa{background:#25D366;color:#053620}
.btn.wa:hover{background:#1DAE55;color:#fff}
.btn.ch{padding:7px 13px;font-size:13px}
.btn.gr{padding:14px 28px;font-size:16px}
.btn.lleno{width:100%}
.btn-grupo{display:flex;gap:9px;flex-wrap:wrap}

/* ---------------------------------------------------------------- formularios */
.campo{margin-bottom:16px}
label{display:block;font-size:13px;font-weight:650;color:var(--tinta);margin-bottom:6px}
label .req{color:var(--error)}
.pista{font-size:12.5px;color:var(--tenue);margin-top:5px}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],
input[type=tel],input[type=search],input[type=url],input[type=time],select,textarea{
  width:100%;padding:11px 13px;border:1px solid var(--linea);border-radius:var(--r-s);
  background:var(--panel);color:var(--tinta);font:15px var(--fuente);transition:border-color .15s,box-shadow .15s}
textarea{min-height:110px;resize:vertical;line-height:1.6}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235C6B7A' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;padding-right:34px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--azul-cla);
  box-shadow:0 0 0 3px rgba(28,107,168,.14)}
input::placeholder,textarea::placeholder{color:var(--tenue)}
.campo-fila{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
fieldset{border:0;padding:0;margin:0 0 8px}
legend{padding:0;font-size:13px;font-weight:650;color:var(--tinta);margin-bottom:8px}

.chk{display:flex;align-items:flex-start;gap:10px;padding:11px 13px;border:1px solid var(--linea);
  border-radius:var(--r-s);cursor:pointer;background:var(--panel);margin-bottom:8px;transition:border-color .15s,background .15s}
.chk:hover{border-color:var(--azul-cla)}
.chk input{margin:2px 0 0;width:17px;height:17px;flex:none;accent-color:var(--azul)}
.chk span{font-size:14px;font-weight:500;color:var(--texto);line-height:1.5}
.chk.marcado{border-color:var(--azul);background:var(--info-bg)}
.chk.lineal{border:0;padding:4px 0;background:none}

.opciones{display:flex;gap:8px;flex-wrap:wrap}
.opciones label{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border:1px solid var(--linea);
  border-radius:99px;cursor:pointer;font-size:14px;font-weight:550;margin:0;background:var(--panel);transition:all .15s}
.opciones input{position:absolute;opacity:0;pointer-events:none}
.opciones label:has(input:checked){background:var(--azul);color:#fff;border-color:var(--azul)}
.opciones.lima label:has(input:checked){background:var(--verde);color:#2B3A08;border-color:var(--verde)}

.escala{display:flex;gap:7px;flex-wrap:wrap}
.escala label{flex:1;min-width:88px;flex-direction:column;gap:3px;padding:12px 8px;border-radius:var(--r-s);text-align:center;font-size:12.5px}
.escala label b{font-size:19px;font-weight:700}

/* ---------------------------------------------------------------- avisos */
.aviso{display:flex;gap:11px;padding:13px 16px;border-radius:var(--r-s);
  font-size:14px;margin-bottom:16px;border:1px solid transparent;line-height:1.55}
.aviso b{display:block;margin-bottom:2px}
.aviso.ok{background:var(--ok-bg);color:var(--ok)}
.aviso.error{background:var(--error-bg);color:var(--error)}
.aviso.alerta{background:var(--alerta-bg);color:var(--alerta)}
.aviso.info{background:var(--info-bg);color:var(--info)}
.aviso .ic{font-size:17px;line-height:1.3;flex:none}

/* ---------------------------------------------------------------- progreso */
.barra{height:8px;background:var(--linea-2);border-radius:99px;overflow:hidden}
.barra i{display:block;height:100%;background:var(--verde);border-radius:99px;transition:width .5s ease}
.barra.azul i{background:var(--azul-cla)}
.barra.fina{height:5px}
.barra.gruesa{height:11px}

.anillo{--p:0;width:64px;height:64px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:conic-gradient(var(--verde) calc(var(--p)*1%),var(--linea-2) 0)}
.anillo::before{content:'';position:absolute;width:50px;height:50px;border-radius:50%;background:var(--panel)}
.anillo b{position:relative;font-size:14px;font-weight:700;color:var(--tinta)}

.metrica{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);padding:16px 18px}
.metrica .n{font-size:28px;font-weight:750;color:var(--azul);line-height:1.1;letter-spacing:-.02em}
.metrica .n.v{color:var(--verde-osc)}
.metrica .n.a{color:var(--alerta)}
.metrica .n.e{color:var(--error)}
.metrica .t{font-size:12.5px;color:var(--suave);margin-top:4px;line-height:1.4}
.metrica .d{font-size:11.5px;color:var(--tenue);margin-top:6px}

/* ---------------------------------------------------------------- listas */
.lista{border:1px solid var(--linea);border-radius:var(--r);overflow:hidden;background:var(--panel)}
.lista > *{display:flex;gap:13px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--linea-2);
  color:inherit;text-decoration:none}
.lista > *:last-child{border-bottom:0}
a.item:hover,.lista a:hover{background:var(--panel-2);text-decoration:none}
.item-t{font-weight:600;color:var(--tinta);font-size:14.5px;margin-bottom:2px}
.item-s{font-size:12.5px;color:var(--suave)}
.flecha{margin-left:auto;color:var(--tenue);font-size:17px;flex:none}

.vacio{text-align:center;padding:44px 22px;color:var(--suave);
  border:1px dashed var(--linea);border-radius:var(--r);background:var(--panel)}
.vacio .ic{font-size:32px;margin-bottom:10px;opacity:.5}
.vacio h3{color:var(--suave);font-size:16px}
.vacio p{margin:0 auto;max-width:44ch;font-size:13.5px}

/* ---------------------------------------------------------------- tablas */
.tabla-env{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--r);background:var(--panel);
  -webkit-overflow-scrolling:touch}
table.datos{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
table.datos th{background:var(--panel-2);text-align:left;padding:11px 14px;font-size:11.5px;
  font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--suave);
  border-bottom:1px solid var(--linea);white-space:nowrap}
table.datos td{padding:11px 14px;border-bottom:1px solid var(--linea-2);vertical-align:middle}
table.datos tr:last-child td{border-bottom:0}
table.datos tbody tr:hover{background:var(--panel-2)}
table.datos td.num,table.datos th.num{text-align:right;font-variant-numeric:tabular-nums}
table.datos .principal{font-weight:600;color:var(--tinta)}

.ficha{width:100%;border-collapse:collapse;font-size:14px}
.ficha th{text-align:left;padding:9px 0;color:var(--suave);font-weight:600;width:42%;
  border-bottom:1px solid var(--linea-2);vertical-align:top;font-size:13px}
.ficha td{padding:9px 0;border-bottom:1px solid var(--linea-2);color:var(--tinta)}
.ficha tr:last-child th,.ficha tr:last-child td{border-bottom:0}

/* ---------------------------------------------------------------- filtros */
.filtros{display:flex;gap:9px;flex-wrap:wrap;align-items:flex-end;background:var(--panel);
  border:1px solid var(--linea);border-radius:var(--r);padding:14px 16px;margin-bottom:18px}
.filtros .campo{margin:0;min-width:145px;flex:1}
.filtros label{font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--suave)}
.filtros input,.filtros select{padding:9px 11px;font-size:14px}

.pestanas{display:flex;gap:4px;border-bottom:1px solid var(--linea);margin-bottom:20px;
  overflow-x:auto;-webkit-overflow-scrolling:touch}
.pestanas a{padding:10px 15px;font-size:14px;font-weight:600;color:var(--suave);
  border-bottom:2.5px solid transparent;white-space:nowrap;margin-bottom:-1px}
.pestanas a:hover{color:var(--tinta);text-decoration:none}
.pestanas a.on{color:var(--azul);border-bottom-color:var(--verde)}

.chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}
.chips a{padding:7px 14px;border-radius:99px;font-size:13px;font-weight:600;
  background:var(--panel);border:1px solid var(--linea);color:var(--suave)}
.chips a:hover{border-color:var(--azul-cla);text-decoration:none;color:var(--tinta)}
.chips a.on{background:var(--azul);color:#fff;border-color:var(--azul)}

/* ---------------------------------------------------------------- módulos del trabajador */
.mod{display:block;background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);
  padding:18px;color:inherit;position:relative;overflow:hidden;transition:all .16s}
.mod:hover{text-decoration:none;border-color:var(--azul-cla);transform:translateY(-2px);box-shadow:var(--sombra-alta)}
.mod .ic{font-size:24px;line-height:1;margin-bottom:11px;display:block}
.mod h3{font-size:16px;margin:0 0 5px}
.mod p{font-size:13px;color:var(--suave);margin:0;line-height:1.5}
.mod .franja{position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--azul)}
.mod .pie{margin-top:12px;font-size:12px;font-weight:650;color:var(--azul-cla)}
.mod .insignia{position:absolute;top:14px;right:14px}

/* ---------------------------------------------------------------- ruta / línea de tiempo */
.ruta{position:relative;padding-left:30px}
.ruta::before{content:'';position:absolute;left:9px;top:8px;bottom:8px;width:2px;background:var(--linea)}
.ruta .etapa{position:relative;padding-bottom:22px}
.ruta .etapa:last-child{padding-bottom:0}
.ruta .marca{position:absolute;left:-30px;top:2px;width:20px;height:20px;border-radius:50%;
  background:var(--panel);border:2px solid var(--linea);display:flex;align-items:center;
  justify-content:center;font-size:10px;font-weight:700;color:var(--tenue)}
.ruta .etapa.hecha .marca{background:var(--verde);border-color:var(--verde);color:#2B3A08}
.ruta .etapa.activa .marca{background:var(--azul);border-color:var(--azul);color:#fff;
  box-shadow:0 0 0 4px rgba(17,74,119,.14)}
.ruta .etapa.alerta .marca{background:var(--alerta);border-color:var(--alerta);color:#fff}
.ruta h4{margin:0 0 3px;font-size:15px}
.ruta .cuando{font-size:12.5px;color:var(--tenue)}

/* ---------------------------------------------------------------- lección */
.leccion{background:var(--panel);border:1px solid var(--linea);border-radius:var(--r);padding:22px 24px;margin-bottom:16px}
.leccion h2{margin-top:0}
.bloque{margin-bottom:20px}
.bloque:last-child{margin-bottom:0}
.bloque h4{color:var(--azul);font-size:14.5px;margin-bottom:8px;
  padding-bottom:6px;border-bottom:1px solid var(--linea-2)}
.bloque p{font-size:14.5px;margin-bottom:10px;line-height:1.68}
.bloque p:last-child{margin-bottom:0}
.cita{border-left:3px solid var(--verde);padding:6px 0 6px 16px;margin:14px 0;
  font-style:italic;color:var(--tinta);font-size:15px}
.rol-vial{border:1px solid var(--linea);border-radius:var(--r-s);padding:15px;margin-bottom:12px;background:var(--panel-2)}
.rol-vial h5{margin:0 0 9px;font-size:14px;color:var(--azul);font-weight:700}
.rol-vial .cols{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}
.rol-vial .kicker{margin-bottom:5px}
.rol-vial ul{margin:0;padding-left:17px;font-size:13.5px}

.nota-fac{background:var(--alerta-bg);border-radius:var(--r-s);padding:13px 15px;
  font-size:13.5px;color:#6B5518;margin-top:14px;border-left:3px solid var(--alerta)}

/* quiz */
.quiz{background:var(--panel-2);border:1px solid var(--linea);border-radius:var(--r);padding:20px;margin-top:18px}
.pregunta{margin-bottom:22px}
.pregunta:last-child{margin-bottom:0}
.pregunta > p{font-weight:600;color:var(--tinta);margin-bottom:11px;font-size:15px}
.pregunta .chk{background:var(--panel)}
.retro{margin-top:9px;padding:10px 13px;border-radius:var(--r-s);font-size:13.5px}
.retro.bien{background:var(--ok-bg);color:var(--ok)}
.retro.mal{background:var(--error-bg);color:var(--error)}

/* ---------------------------------------------------------------- admin */
.admin-cuerpo{display:flex;min-height:100vh}
.lateral{width:236px;flex:none;background:var(--azul-osc);color:#fff;padding:0 0 30px;
  position:sticky;top:0;height:100vh;overflow-y:auto}
.lateral .marca{padding:18px 18px 16px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:10px}
.lateral .gr{padding:14px 18px 6px;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;color:rgba(255,255,255,.42);font-weight:700}
.lateral a{display:flex;align-items:center;gap:10px;padding:9px 18px;font-size:13.5px;
  color:rgba(255,255,255,.78);font-weight:500;border-left:3px solid transparent}
.lateral a:hover{background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
.lateral a.on{background:rgba(179,207,58,.13);color:#fff;border-left-color:var(--verde);font-weight:650}
.lateral .ic{width:18px;text-align:center;font-size:14px;flex:none}
.lateral .cuenta{margin-left:auto;background:var(--verde);color:#2B3A08;border-radius:99px;
  font-size:10.5px;font-weight:700;padding:1px 7px;min-width:20px;text-align:center}
.admin-main{flex:1;min-width:0;background:var(--fondo)}
.admin-barra{background:var(--panel);border-bottom:1px solid var(--linea);padding:12px 22px;
  display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:30}
.admin-cont{padding:24px 22px 60px;max-width:1280px}
.menu-movil{display:none}
@media(max-width:959px){
  .lateral{position:fixed;left:0;top:0;bottom:0;z-index:60;transform:translateX(-100%);
    transition:transform .22s ease;box-shadow:var(--sombra-alta);height:100%}
  .lateral.abierto{transform:none}
  .menu-movil{display:inline-flex}
  .velo{position:fixed;inset:0;background:rgba(9,20,32,.5);z-index:55;display:none}
  .velo.on{display:block}
  .admin-cont{padding:18px 16px 60px}
  .admin-barra{padding:11px 16px}
}

/* ---------------------------------------------------------------- acceso */
.acceso{min-height:100vh;display:grid;grid-template-columns:1fr}
@media(min-width:940px){.acceso{grid-template-columns:1.05fr .95fr}}
.acceso-arte{background:linear-gradient(150deg,var(--azul) 0%,var(--azul-osc) 100%);
  color:#fff;padding:44px 40px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.acceso-arte::after{content:'';position:absolute;right:-110px;bottom:-110px;width:340px;height:340px;
  border-radius:50%;background:rgba(179,207,58,.13)}
.acceso-arte::before{content:'';position:absolute;left:-70px;top:-70px;width:220px;height:220px;
  border-radius:50%;background:rgba(255,255,255,.05)}
.acceso-arte > *{position:relative}
.acceso-arte h1{color:#fff;max-width:17ch;margin-top:26px}
.acceso-arte p{color:rgba(255,255,255,.84);max-width:46ch;font-size:15.5px}
.acceso-arte .puntos{margin-top:26px;display:grid;gap:13px}
.acceso-arte .puntos div{display:flex;gap:11px;align-items:flex-start;font-size:14px;color:rgba(255,255,255,.9)}
.acceso-arte .puntos b{color:var(--verde);flex:none;font-size:15px;line-height:1.4}
.acceso-form{display:flex;align-items:center;justify-content:center;padding:40px 22px;background:var(--panel)}
.acceso-form .caja{width:100%;max-width:400px}
@media(max-width:939px){
  .acceso-arte{padding:32px 22px 34px}
  .acceso-arte h1{font-size:25px;margin-top:18px}
  .acceso-arte .puntos{display:none}
}

/* ---------------------------------------------------------------- calendario */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.cal .dow{text-align:center;font-size:10.5px;font-weight:700;color:var(--tenue);
  text-transform:uppercase;letter-spacing:.6px;padding:6px 0}
.cal .dia{aspect-ratio:1;border:1px solid var(--linea);border-radius:var(--r-s);
  padding:5px 6px;background:var(--panel);display:flex;flex-direction:column;
  color:inherit;min-height:54px;position:relative;overflow:hidden}
.cal a.dia:hover{border-color:var(--azul-cla);text-decoration:none;background:var(--panel-2)}
.cal .dia.fuera{opacity:.32}
.cal .dia.hoy{border-color:var(--azul);box-shadow:inset 0 0 0 1px var(--azul)}
.cal .dia .n{font-size:12.5px;font-weight:650;color:var(--tinta)}
.cal .dia.con{background:var(--verde-cla);border-color:var(--verde)}
.cal .dia .c{margin-top:auto;font-size:10.5px;font-weight:700;color:var(--verde-osc);line-height:1.25}
.cal .dia .pastilla{background:var(--verde);color:#2B3A08;border-radius:99px;padding:0 6px;
  font-size:10px;font-weight:700;align-self:flex-start;margin-top:auto}

/* ---------------------------------------------------------------- QR y verificación */
.qr-caja{display:flex;gap:20px;align-items:center;flex-wrap:wrap;background:var(--panel-2);
  border:1px solid var(--linea);border-radius:var(--r);padding:18px}
.qr-caja svg{background:#fff;border-radius:6px;padding:6px;flex:none}
.codigo{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:16px;
  font-weight:700;letter-spacing:1.2px;color:var(--tinta)}

/* ---------------------------------------------------------------- utilidades */
.recorte{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dos-lineas{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.imprimir-solo{display:none}
@media print{
  .cabecera,.nav-pie,.lateral,.admin-barra,.btn,.filtros,.pestanas,.chips{display:none !important}
  body{background:#fff}
  .tarjeta{border:1px solid #ccc;box-shadow:none;break-inside:avoid}
  .imprimir-solo{display:block}
  .admin-cont{padding:0}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}