/* SimulacroUES — modo examen de noche */
:root{
  --fondo:#0E1420; --panel:#16202F; --borde:#223047; --borde2:#2C3B55;
  --tinta:#F2F5FA; --tinta2:#B7C0CE; --gris:#8A94A6; --gris2:#5C6673;
  --verde:#2EE6A8; --verde-tinta:#06251A; --ambar:#FFC24B; --rojo:#FF5C5C;
  --verde-panel:#12301F; --verde-borde:#1F5C3D;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--tinta);
  font-family:"Archivo",-apple-system,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.disp{font-family:"Archivo Black",Impact,sans-serif;font-weight:400;letter-spacing:.005em}
.mono{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums}
.wrap{max-width:430px;margin:0 auto;padding:0 20px 40px}
a{color:var(--verde)}
.top{display:flex;justify-content:space-between;align-items:center;padding-top:22px}
.logo{font-family:"Archivo Black",Impact,sans-serif;font-size:18px;color:var(--tinta);text-decoration:none}
.logo b{color:var(--verde);font-weight:400}
.top .mono{font-size:11px;color:var(--gris)}
.aviso{margin-top:18px;display:flex;align-items:center;gap:8px;background:var(--panel);
  border:1px solid var(--borde);border-radius:6px;padding:9px 12px;font-size:12.5px;font-weight:600;color:var(--ambar)}
.aviso svg{flex:none}
h1{font-family:"Archivo Black",Impact,sans-serif;font-weight:400;font-size:clamp(28px,8.6vw,34px);line-height:1.12;margin:24px 0 0}
h1 .r{color:var(--rojo)} h1 .v{color:var(--verde)}
.sub{margin:14px 0 0;font-size:15px;color:var(--tinta2)}
.card{margin-top:22px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;padding:16px}
.card .k{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--gris);text-transform:uppercase}
.btn{display:block;width:100%;border:0;border-radius:10px;padding:16px;text-align:center;
  font-family:inherit;font-size:16px;font-weight:700;cursor:pointer;text-decoration:none;color:var(--tinta)}
.btn.v{background:var(--verde);color:var(--verde-tinta)}
.btn.o{background:transparent;border:1px solid var(--borde2);font-size:14px;padding:14px}
.btn:active{transform:translateY(1px)}
.nota{text-align:center;font-size:11.5px;color:var(--gris);margin:10px 0 0}
.confianza{margin-top:26px;display:flex;flex-direction:column;gap:10px}
.confianza .fila{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:var(--gris)}
.confianza .fila b{color:var(--tinta2)}
.legal{text-align:center;font-size:10px;color:var(--gris2);line-height:1.45}
.barra{height:8px;border-radius:4px;background:var(--fondo);position:relative;overflow:hidden;border:1px solid var(--borde)}
.barra .fill{position:absolute;left:0;top:0;bottom:0;border-radius:4px}
.barra .corte{position:absolute;left:50%;top:-2px;bottom:-2px;width:2px;background:var(--verde)}
.leyenda{display:flex;justify-content:space-between;font-size:10px;color:var(--gris);margin-top:5px}
/* quiz */
.qhead{display:flex;justify-content:space-between;align-items:center;margin-top:20px;font-size:12px;color:var(--gris)}
.qhead .tiempo{font-size:15px;color:var(--tinta)}
.qhead .tiempo.rojo{color:var(--rojo)}
.progreso{height:4px;background:var(--panel);border-radius:2px;margin-top:10px;overflow:hidden}
.progreso div{height:100%;background:var(--verde);transition:width .2s}
.materia-tag{display:inline-block;margin-top:18px;font-size:10.5px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gris);border:1px solid var(--borde2);border-radius:999px;padding:4px 10px}
.pregunta{font-size:17.5px;line-height:1.5;margin:12px 0 18px;font-weight:500;white-space:pre-line}
.ops{display:flex;flex-direction:column;gap:10px}
.op{background:var(--panel);border:1px solid var(--borde2);border-radius:10px;padding:13px 14px;
  font-size:15px;line-height:1.45;cursor:pointer;text-align:left;color:var(--tinta);font-family:inherit;display:flex;gap:10px}
.op .letra{font-family:"JetBrains Mono",monospace;color:var(--gris);flex:none}
.op.sel{border-color:var(--verde);background:var(--verde-panel)}
.op.ok{border-color:var(--verde);background:var(--verde-panel)}
.op.mal{border-color:var(--rojo);background:#331119}
.explica{margin-top:14px;background:var(--panel);border:1px solid var(--borde);border-left:3px solid var(--verde);
  border-radius:0 8px 8px 0;padding:12px 14px;font-size:13.5px;color:var(--tinta2);line-height:1.5}
.acciones{margin-top:18px;display:flex;gap:10px}
.acciones .btn{flex:1}
/* resultado */
.resultado{margin-top:26px;background:linear-gradient(180deg,var(--verde-panel) 0%,var(--panel) 70%);
  border:1px solid var(--verde-borde);border-radius:14px;padding:26px 20px 22px;text-align:center}
.resultado.ambar{background:linear-gradient(180deg,#33280F 0%,var(--panel) 70%);border-color:#5C4A1A}
.resultado.rojo{background:linear-gradient(180deg,#331119 0%,var(--panel) 70%);border-color:#5C2430}
.resultado .num{font-family:"JetBrains Mono",monospace;font-weight:700;font-size:88px;line-height:1}
.resultado .num.v{color:var(--verde)} .resultado .num.a{color:var(--ambar)} .resultado .num.r{color:var(--rojo)}
.banda{display:inline-block;border-radius:999px;padding:7px 18px;font-size:13px;font-weight:700;letter-spacing:.06em;margin-top:12px}
.banda.v{background:var(--verde);color:var(--verde-tinta)}
.banda.a{background:var(--ambar);color:#33280F}
.banda.r{background:var(--rojo);color:#33111A}
.comparativa{margin-top:22px;display:flex;flex-direction:column;gap:12px;text-align:left}
.comparativa .fila .titulos{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px}
.comparativa .fila .titulos .quien{color:var(--gris)}
.comparativa .barra{height:10px}
.desglose{margin-top:20px;text-align:left}
.desglose .fila{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--borde);font-size:13.5px}
.desglose .fila:last-child{border:0}
.consejo{margin-top:16px;background:var(--panel);border:1px solid var(--borde);border-radius:10px;
  padding:12px 14px;font-size:13px;color:var(--tinta2);text-align:left;line-height:1.5}
.codigo-input{width:100%;background:var(--fondo);border:1px solid var(--borde2);border-radius:8px;
  color:var(--tinta);font-family:"JetBrains Mono",monospace;font-size:16px;letter-spacing:.15em;
  padding:13px;text-align:center;text-transform:uppercase}
.codigo-input:focus{outline:2px solid var(--verde);border-color:var(--verde)}
.error-msg{color:var(--rojo);font-size:12.5px;text-align:center;margin-top:8px}
.oculto{display:none !important}
@media (min-width:700px){ .wrap{max-width:520px} }