/* Formulario de registro de movilidad: usa los tokens de estilos.css */
.fwrap{max-width:820px;margin:0 auto;padding-inline:16px}
.fhero{position:relative;overflow:hidden;padding-block:44px 40px;background:linear-gradient(180deg,var(--sky) 0%,var(--sky-2) 55%,var(--bg) 100%)}
.fhero h1{font:800 clamp(32px,5.4vw,48px)/1.04 var(--f-display);letter-spacing:-.02em;margin:12px 0 10px;color:var(--navy);text-wrap:balance}
:root[data-theme="dark"] .fhero h1{color:var(--ink)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .fhero h1{color:var(--ink)}}
.fhero .lede{font-size:17px;color:var(--ink);max-width:60ch;margin:0}
.meta{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.meta li{font:600 13px var(--f-body);background:color-mix(in srgb,var(--surface) 80%,transparent);border:1px solid var(--line);border-radius:999px;padding:5px 12px;color:var(--ink)}
.meta li::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;vertical-align:1px;background:var(--hilo-verde)}
.meta li:nth-child(2)::before{background:var(--hilo-cian)} .meta li:nth-child(3)::before{background:var(--hilo-coral)}

.fbody{padding-block:26px 64px;display:grid;gap:18px}
.preview{background:var(--warn-soft);border-left:5px solid var(--hilo-amarillo);border-radius:12px;padding:12px 16px;font-size:14.5px}
.preview b{color:var(--warn)}

/* Pasos */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;counter-reset:none}
.steps li{display:flex;align-items:center;gap:8px;min-width:0;color:var(--faint);font:600 13.5px var(--f-body)}
.steps .n{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line);background:var(--surface);font:700 13px var(--f-display);color:var(--faint);transition:all .2s ease}
.steps .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.steps li.hecho .n{background:var(--c);border-color:var(--c);color:#fff}
.steps li.actual{color:var(--ink)}
.steps li.actual .n{border-color:var(--c);color:var(--ink);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 25%,transparent)}
.steps li:nth-child(1){--c:var(--accent)} .steps li:nth-child(2){--c:var(--hilo-verde)} .steps li:nth-child(3){--c:var(--hilo-cian)} .steps li:nth-child(4){--c:var(--hilo-coral)} .steps li:nth-child(5){--c:var(--hilo-amarillo)}
.bar{height:6px;border-radius:999px;background:var(--grid);overflow:hidden}
.bar span{display:block;height:100%;width:20%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--hilo-verde),var(--hilo-cian),var(--hilo-coral),var(--hilo-amarillo));background-size:820px 100%;transition:width .35s ease}
@media (max-width:620px){.steps .t{display:none}.steps li{justify-content:center}.steps li.actual .t{display:inline;position:absolute;left:-9999px}}

/* Preguntas */
form{display:grid;gap:18px}
.step{border:0;margin:0;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:18px;display:grid;gap:22px;min-width:0}
.sh{font:800 22px/1.2 var(--f-display);color:var(--ink);padding:0;margin:0 0 -6px;float:left;width:100%}
.sh+*{clear:both}
.vol{font:600 12px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--t-cian);background:color-mix(in srgb,var(--hilo-cian) 18%,transparent);padding:3px 8px;border-radius:999px;vertical-align:4px;margin-left:6px}
.q{display:grid;gap:9px;min-width:0}
.ql{font:600 16px/1.35 var(--f-body);color:var(--ink);margin:0;display:block}
.req,.opc{font:600 11px var(--f-body);letter-spacing:.06em;text-transform:uppercase;margin-left:8px;vertical-align:1px;white-space:nowrap}
.req{color:var(--t-coral)} .opc{color:var(--faint)}
.help{margin:-4px 0 0;color:var(--muted);font-size:14.5px;max-width:65ch}
.q.big .ql{font-size:18px}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:18px 22px}
.err{margin:0;color:var(--t-coral);font-size:13.5px;font-weight:600;min-height:0}
.err:empty{display:none}
.q.mal input[type=text],.q.mal input[type=email],.q.mal input[type=month],.q.mal select{border-color:var(--t-coral)}
.q.mal .opts .opt span{border-color:color-mix(in srgb,var(--hilo-coral) 60%,var(--line))}

input[type=text],input[type=email],input[type=month],select,textarea{font:inherit;font-size:16px;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:12px;padding:11px 14px;width:100%;min-width:0;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;line-height:1.45}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
select{border-radius:12px;appearance:auto}

/* Opciones como píldoras */
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative;display:inline-flex;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.opt span{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);font:600 14.5px/1.25 var(--f-body);color:var(--ink);transition:background .15s,border-color .15s,color .15s,transform .1s}
.opt span::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;border:1.5px solid var(--faint);background:var(--surface);transition:all .15s}
.opt input[type=checkbox]+span::before{border-radius:5px}
.opt:hover span{border-color:var(--accent)}
.opt input:checked+span{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.opt input:checked+span::before{border-color:var(--accent);background:var(--accent);box-shadow:inset 0 0 0 3px var(--surface)}
.opt input[type=checkbox]:checked+span::before{box-shadow:none;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.opt input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.opt:active span{transform:scale(.98)}

/* Facultades con los colores UASD */
.facs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:8px}
.facs .opt span{border-radius:12px;width:100%;padding:11px 14px}
.facs .opt span::before{border:0;width:12px;height:12px;background:var(--fc);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 18%,transparent)}
.facs .opt input:checked+span{background:color-mix(in srgb,var(--fc) 14%,var(--surface));border-color:var(--fc);color:var(--ink)}
.facs .opt input:checked+span::before{background:var(--fc);box-shadow:0 0 0 3px color-mix(in srgb,var(--fc) 35%,transparent)}

/* Bloques de movilidad */
#movs{display:grid;gap:16px}
.mov{border:1.5px solid var(--line);border-top:5px solid var(--mc,var(--hilo-cian));border-radius:16px;padding:18px;display:grid;gap:20px;background:var(--bg)}
#movs>.mov:nth-child(4n+1){--mc:var(--hilo-cian)} #movs>.mov:nth-child(4n+2){--mc:var(--hilo-verde)} #movs>.mov:nth-child(4n+3){--mc:var(--hilo-coral)} #movs>.mov:nth-child(4n+4){--mc:var(--hilo-amarillo)}
.mov-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mov-t{font:800 18px var(--f-display);margin:0;color:var(--ink)}
.quitar{appearance:none;border:0;background:none;color:var(--muted);font:600 14px var(--f-body);cursor:pointer;padding:6px 10px;border-radius:999px}
.quitar:hover{background:var(--sunk);color:var(--t-coral)}
.mov .opt span{background:var(--surface)}
.btn.add{justify-self:start;border-style:dashed;border-color:var(--accent);color:var(--accent);background:transparent;padding:11px 18px}
.btn.add:hover{background:var(--accent-soft)}
.mas{border-top:1px dashed var(--line);padding-top:12px}
.mas summary{cursor:pointer;font:600 15px var(--f-body);color:var(--accent);list-style:none;display:flex;align-items:center;gap:8px}
.mas summary::-webkit-details-marker{display:none}
.mas summary::before{content:"+";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--accent);font-weight:700;line-height:1}
.mas[open] summary::before{content:"–"}
.mas[open]{display:grid;gap:18px}

/* Cuadrícula de dificultad */
.grid-dif{display:grid;gap:10px}
.dif{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:8px 14px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--grid)}
.dif:last-child{border-bottom:0}
.dif .dl{font-weight:600;font-size:15px}
.dif .opts{gap:6px}
.dif .opt span{padding:7px 12px;font-size:13.5px}
.dif .opt span::before{width:13px;height:13px}
@media (max-width:620px){.dif{grid-template-columns:1fr}}

/* Navegación */
.nav-f{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;bottom:0;padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--bg) 30%)}
.nav-f .btn{padding:12px 24px;font-size:15.5px}
.nav-f #sig{margin-left:auto}
.pasotxt{font:500 12.5px var(--f-mono);color:var(--muted)}
.btn[disabled]{opacity:.6;cursor:progress}

/* Resumen y fin */
.resumen{background:var(--accent-soft);border-radius:14px;padding:14px 16px;font-size:15px;display:grid;gap:6px}
.resumen b{color:var(--accent)}
.resumen ul{margin:0;padding-left:18px}
.done,.nohizo{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:34px 24px;display:grid;gap:14px;justify-items:center;text-align:center}
.done h2,.nohizo h2{font:800 clamp(24px,4vw,32px)/1.15 var(--f-display);margin:0;color:var(--ink);text-wrap:balance}
.done p,.nohizo p{margin:0;max-width:52ch;color:var(--muted);font-size:16px}
.done-mark{display:flex;gap:10px;margin-bottom:4px}
.done-mark i{width:18px;height:18px;border-radius:50%;background:var(--hilo-verde);animation:pop .5s ease both}
.done-mark i:nth-child(2){background:var(--hilo-cian);animation-delay:.08s} .done-mark i:nth-child(3){background:var(--hilo-coral);animation-delay:.16s} .done-mark i:nth-child(4){background:var(--hilo-amarillo);animation-delay:.24s}
@keyframes pop{from{transform:scale(.4);opacity:.3}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.done-mark i{animation:none}.bar span{transition:none}}
.done-acts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:6px}
.done-acts .btn{text-decoration:none;padding:11px 20px}
.copiado{font-size:14px;color:var(--t-verde)!important;min-height:1em}
.enviado{width:100%;text-align:left;margin-top:8px;border-top:1px solid var(--line);padding-top:12px}
.enviado summary{cursor:pointer;font-weight:600;color:var(--accent)}
.enviado table{min-width:560px;margin-top:10px}
.enviado td:first-child{color:var(--muted);white-space:nowrap}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media (max-width:520px){.step{padding:18px 14px}.mov{padding:14px}.nav-f .btn{padding:11px 16px}}
.nav-f{pointer-events:none}.nav-f>*{pointer-events:auto}
.done>*,.nohizo>*{max-width:100%;min-width:0}.enviado .tablewrap{max-width:100%}