:root{--negro:#0D0D0D;--crema:#FAF6EF;--arena:#F0E6D3;--borde:#E8DCC8;--oro:#C19A6B;--oro-osc:#7A5A30;--verde:#3D7A72;--verde-osc:#2C5B55;--texto:#1A1A1A;--gris:#4A4A4A;--gris2:#6B6B6B}
*{box-sizing:border-box}
html,body{margin:0;background:var(--crema);color:var(--texto);font-family:Montserrat,system-ui,sans-serif;font-size:17px;line-height:1.5;-webkit-text-size-adjust:100%}
button,input,select{font-family:inherit;font-size:inherit}
.cargando,.vacio{padding:40px 20px;text-align:center;color:var(--gris2)}
header.barra{background:var(--negro);color:#fff;padding:14px 16px;display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:5}
header.barra h1{margin:0;font-size:20px;font-weight:800}
header.barra .sub{color:var(--oro);font-size:14px;font-weight:600}
.volver{width:44px;height:44px;border:0;background:none;color:var(--arena);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:10px}
main{padding:18px 16px 40px;max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
h2{margin:6px 0 0;font-size:22px;font-weight:800}
h3{margin:0;font-size:18px;font-weight:800}
p{margin:0}
.muted{color:var(--gris)}
.small{font-size:15px}
.card{background:#fff;border:1px solid var(--borde);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px}
.card.oscura{background:var(--negro);color:var(--arena);border:0}
.card.oscura h3{color:#fff}
.card.aviso{background:var(--arena);border:2px solid var(--oro)}
.etiqueta{font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--verde)}
.card.oscura .etiqueta{color:var(--oro)}
.chip{align-self:flex-start;background:var(--oro);color:var(--negro);font-size:13px;font-weight:800;padding:5px 10px;border-radius:10px}
.btn{min-height:56px;border-radius:14px;border:2px solid var(--verde);background:var(--verde);color:#fff;font-weight:800;font-size:18px;padding:12px 18px;cursor:pointer;width:100%;text-align:center}
.btn:disabled{opacity:.5;cursor:default}
.btn.sec{background:#fff;color:var(--texto);border-color:var(--borde)}
.btn.oro{background:var(--oro);border-color:var(--oro);color:var(--negro)}
.btn.peq{min-height:46px;font-size:16px;padding:8px 14px}
.fila{display:flex;gap:10px}
.fila > *{flex:1}
.opcion{min-height:56px;border-radius:14px;border:2px solid var(--borde);background:#fff;font-weight:700;font-size:18px;text-align:left;padding:12px 16px;cursor:pointer;color:var(--texto)}
.opcion.sel{background:var(--verde);border-color:var(--verde);color:#fff}
.dias{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dias .opcion{text-align:center;padding:12px 0;font-size:16px}
.sesion{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--borde);cursor:pointer;text-align:left;width:100%;color:var(--texto)}
.sesion.hoy{background:var(--verde);color:#fff;border-color:var(--verde)}
.sesion .dia{font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;opacity:.8}
.sesion .tit{font-size:19px;font-weight:800}
.sesion .ok{width:34px;height:34px;border-radius:17px;background:var(--verde);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sesion.hoy .ok{background:#fff;color:var(--verde)}
.video{position:relative;padding-top:56.25%;border-radius:12px;overflow:hidden;background:#1a1a1a}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vbtn{display:flex;align-items:center;gap:10px;border:0;background:var(--arena);border-radius:12px;padding:10px 14px;font-weight:700;color:var(--oro-osc);cursor:pointer;min-height:48px;font-size:16px}
.series{display:flex;flex-direction:column;gap:8px}
.serie{display:grid;grid-template-columns:44px 1fr 1fr 52px;gap:8px;align-items:center}
.serie.cab{font-size:12px;font-weight:700;letter-spacing:1px;color:var(--gris2)}
.serie .n{font-size:19px;font-weight:800;text-align:center}
.serie input{height:52px;border-radius:12px;border:2px solid var(--borde);background:#fff;text-align:center;font-size:20px;font-weight:700;width:100%;color:var(--texto)}
.check{width:52px;height:52px;border-radius:26px;border:2px solid var(--borde);background:#fff;color:#B8AA92;display:flex;align-items:center;justify-content:center;cursor:pointer}
.check.on{background:var(--verde);border-color:var(--verde);color:#fff}
.nota{background:var(--arena);border-left:4px solid var(--oro);border-radius:0 12px 12px 0;padding:12px 14px;font-size:16px}
.cambio{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--borde);font-size:16px}
.barras{display:flex;align-items:flex-end;gap:8px;height:150px;padding-top:10px}
.barras .b{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px}
.barras .b div{width:100%;background:var(--verde);border-radius:6px 6px 0 0}
.error{background:#fbebeb;border:2px solid #d9a3a3;border-radius:14px;padding:14px;color:#6b1f1f}
.pasos{display:flex;gap:6px}
.pasos span{flex:1;height:6px;border-radius:3px;background:var(--borde)}
.pasos span.on{background:var(--verde)}
label.campo{display:flex;flex-direction:column;gap:6px;font-weight:700}
label.campo input{height:52px;border-radius:12px;border:2px solid var(--borde);padding:0 14px;font-size:18px;background:#fff}
.toast{position:fixed;left:16px;right:16px;bottom:20px;background:var(--negro);color:#fff;border-radius:14px;padding:14px 16px;font-weight:600;z-index:20;text-align:center}
/* Aviso de respuesta de Javi: amarillo para que se vea nada más entrar */
.aviso-javi{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;cursor:pointer;background:#FFE03D;border:2px solid #E6B800;border-radius:16px;padding:16px 18px;margin-bottom:14px;color:#1A1A1A;font-family:inherit;box-shadow:0 0 0 0 rgba(255,214,0,.7);animation:latido 2s ease-out 3}
.aviso-javi .dia{font-size:14px;font-weight:800;letter-spacing:1px;text-transform:uppercase}
.aviso-javi .tit{font-size:19px;font-weight:800;margin-top:2px}
.aviso-javi .ver{background:#1A1A1A;color:#FFE03D;font-weight:800;font-size:15px;padding:8px 14px;border-radius:10px;white-space:nowrap}
@keyframes latido{0%{box-shadow:0 0 0 0 rgba(255,214,0,.7)}70%{box-shadow:0 0 0 14px rgba(255,214,0,0)}100%{box-shadow:0 0 0 0 rgba(255,214,0,0)}}
