:root { --verde:#0f766e; --verde-osc:#115e59; --txt:#0f172a; --gris:#64748b; --borde:#cbd5e1; --fondo:#f1f5f9; --rojo:#b91c1c; --ambar:#b45309; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; font:17px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--txt); background:var(--fondo); padding-bottom:env(safe-area-inset-bottom); }
[hidden] { display:none !important; }
.top { position:sticky; top:0; z-index:5; display:flex; justify-content:space-between; align-items:center; background:var(--verde); color:#fff; padding:14px 16px; padding-top:calc(14px + env(safe-area-inset-top)); }
.top h1 { margin:0; font-size:1.15rem; }
.red { background:#fde68a; color:#78350f; border-radius:99px; padding:2px 10px; font-size:.8rem; font-weight:600; }
main { max-width:560px; margin:0 auto; padding:16px; }
form { display:flex; flex-direction:column; gap:14px; }
label { display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:.95rem; }
small { font-weight:400; color:var(--gris); }
input:not([type=radio]):not([type=file]), select, textarea { font:inherit; font-weight:400; padding:12px; border:1.5px solid var(--borde); border-radius:10px; background:#fff; width:100%; min-height:48px; }
input:focus, select:focus, textarea:focus { outline:3px solid #99f6e4; border-color:var(--verde); }
.fila { display:grid; grid-template-columns:1.4fr 1fr; gap:10px; }
fieldset { border:0; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; min-width:0; }
legend { font-weight:600; font-size:.95rem; padding:0; margin-bottom:6px; }
.opciones { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.op { position:relative; flex-direction:row; }
.op input { position:absolute; opacity:0; inset:0; }
.op span { flex:1; text-align:center; padding:13px 8px; border:1.5px solid var(--borde); border-radius:10px; background:#fff; font-weight:600; }
.op input:checked + span { background:var(--verde); border-color:var(--verde); color:#fff; }
.op input:focus-visible + span { outline:3px solid #99f6e4; }
.boton { display:flex; justify-content:center; align-items:center; background:var(--verde); color:#fff; border:0; border-radius:12px; padding:15px; font:inherit; font-weight:700; cursor:pointer; text-align:center; }
.boton:active { background:var(--verde-osc); }
.boton[disabled] { opacity:.6; }
.boton.sec { background:#fff; color:var(--verde); border:2px solid var(--verde); }
.enlace { color:var(--verde); text-decoration:underline; font-weight:600; align-items:center; cursor:pointer; }
.miniaturas { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.miniaturas:empty { display:none; }
.mini { position:relative; aspect-ratio:1; border-radius:8px; overflow:hidden; background:#e2e8f0; }
.mini img { width:100%; height:100%; object-fit:cover; display:block; }
.mini button { position:absolute; top:3px; right:3px; width:28px; height:28px; border-radius:50%; border:0; background:rgba(15,23,42,.8); color:#fff; font-size:1rem; line-height:1; }
.aviso-foto { margin:0; padding:8px 10px; border-radius:8px; background:#fef3c7; color:#78350f; font-size:.9rem; }
.ayuda { margin:0; color:var(--gris); font-size:.9rem; }
.error { margin:0; padding:10px 12px; border-radius:10px; background:#fee2e2; color:var(--rojo); font-weight:600; }
.aviso { margin-bottom:12px; padding:10px 12px; border-radius:10px; background:#fef3c7; color:#78350f; font-weight:600; }
.listo { text-align:center; padding:32px 8px; display:flex; flex-direction:column; align-items:center; gap:10px; }
.listo .check { width:84px; height:84px; border-radius:50%; background:var(--verde); color:#fff; font-size:3rem; display:grid; place-items:center; }
.listo.espera .check { background:var(--ambar); }
.listo .boton { width:100%; margin-top:12px; }