:root{--fondo:#000;--texto:#f2f2ec;--borde:#5a605c;--acento:#5fd0ba;--crema:#f6f3dc;--sombra-crema:#d9d2b0;--acero:#a8b3c3}*{box-sizing:border-box}html,body{height:100%}body{background:var(--fondo);color:var(--texto);margin:0;font:1rem/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.solo-lectores{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.pantalla{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;height:100dvh;display:grid;position:fixed;inset:0}.cara{width:100%;height:100%;position:absolute;inset:0}.cara *{transform-box:fill-box;transform-origin:50%}:focus-visible{outline:3px solid var(--acento);outline-offset:2px}.visor{fill:var(--acero);stroke:#000;stroke-width:10px}.visor-interior{fill:#000}.halo{fill:none;stroke:var(--acento);stroke-width:6px;opacity:0}.ojo{fill:var(--crema)}.sombra-ojo{fill:var(--sombra-crema)}.pupila{fill:#000}.parpado{fill:#000;transform-origin:top}.dientes{fill:var(--crema)}.rejilla{stroke:#000;stroke-width:9px;vector-effect:non-scaling-stroke}.contorno-boca{fill:none;stroke:#000;stroke-width:10px;vector-effect:non-scaling-stroke}.punto{fill:var(--crema);opacity:0}.cara[data-estado=reposo] .parpado{transform:scaleY(.38)}.cara[data-estado=reposo] .boca{transform:scale(.9,.5)}.cara[data-estado=escuchando] .parpado{transform:scaleY(0)}.cara[data-estado=escuchando] .ojos{transform:scale(1.05)}.cara[data-estado=escuchando] .pupila{transform:scale(.85)}.cara[data-estado=escuchando] .boca{transform:scale(.85,.45)}.cara[data-estado=escuchando] .halo{opacity:.7}.cara[data-estado=pensando] .parpado-izq{transform:scaleY(.12)}.cara[data-estado=pensando] .parpado-der{transform:scaleY(.5)}.cara[data-estado=pensando] .mirada{transform:translate(-45px,-55px)}.cara[data-estado=pensando] .boca{transform:translate(70px,12px)rotate(-5deg)scale(.55,.4)}.cara[data-estado=pensando] .punto{opacity:1}.cara[data-estado=hablando] .parpado{transform:scaleY(.08)}.cara[data-estado=hablando] .boca{transform:scaleY(.8)}.cara[data-parpadeo=true] .parpado{transform:scaleY(1)}@media (prefers-reduced-motion:no-preference){.parpado{transition:transform .12s ease-in}.ojos,.pupila,.boca,.halo,.punto{transition:transform .3s,opacity .3s}.cara[data-estado=reposo] .mirada,.cara[data-estado=hablando] .mirada{animation:14s ease-in-out infinite vagar}.cara[data-estado=reposo] .boca{animation:5s ease-in-out infinite respirar}.cara[data-estado=escuchando] .halo{animation:1.6s ease-out infinite latido}.cara[data-estado=pensando] .mirada{animation:5s ease-in-out infinite pensar}.cara[data-estado=pensando] .punto{animation:1.2s ease-in-out infinite saltar}.cara[data-estado=pensando] .punto:nth-child(2){animation-delay:.2s}.cara[data-estado=pensando] .punto:nth-child(3){animation-delay:.4s}.cara[data-estado=hablando] .boca{animation:.9s ease-in-out infinite hablar}}@keyframes vagar{0%,to{transform:translate(0)}12%{transform:translate(-30px,6px)}30%{transform:translate(24px,-8px)}48%{transform:translate(38px,10px)}66%{transform:translate(-18px,-14px)}82%{transform:translateY(12px)}}@keyframes respirar{0%,to{transform:scale(.9,.5)}50%{transform:scale(.9,.56)}}@keyframes latido{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.06,1.12)}}@keyframes pensar{0%,40%,to{transform:translate(-45px,-55px)}55%,85%{transform:translate(45px,-50px)}}@keyframes saltar{0%,to{opacity:.4;transform:translateY(0)}50%{opacity:1;transform:translateY(-14px)}}@keyframes hablar{0%,to{transform:scaleY(.25)}20%{transform:scale(1)}40%{transform:scaleY(.45)}60%{transform:scaleY(.95)}80%{transform:scaleY(.3)}}.flotante{bottom:max(16px, env(safe-area-inset-bottom));width:48px;height:48px;color:var(--texto);opacity:.35;cursor:pointer;touch-action:manipulation;background:#ffffff14;border:0;border-radius:50%;padding:11px;position:absolute}.silencio{right:max(16px, env(safe-area-inset-right))}.sesion{left:max(16px, env(safe-area-inset-left))}.flotante:hover,.flotante:focus-visible,.flotante[aria-pressed=true]{opacity:.9}.flotante[aria-pressed=true]{background:#ffffff2e}.flotante svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%;display:block}.silencio .tachado{stroke-width:2.5px}.dialogo-sesion,.dialogo-sesion *{-webkit-user-select:text;user-select:text;touch-action:auto}.dialogo-sesion{border:1px solid var(--borde);width:min(92vw,22rem);color:var(--texto);background:#111;border-radius:12px;padding:1.25rem}.dialogo-sesion::backdrop{background:#000000bf}.dialogo-sesion h2{margin:0 0 1rem;font-size:1.25rem}.dialogo-sesion label{margin-bottom:.25rem;display:block}.dialogo-sesion input{border:1px solid var(--borde);width:100%;min-height:44px;color:var(--texto);font:inherit;background:#000;border-radius:8px;padding:.5rem .75rem;display:block}.dialogo-sesion input[aria-invalid=true]{border-color:#ff8a80}.error-sesion{color:#ff8a80;min-height:1.5rem;margin:.5rem 0}.acciones-sesion{justify-content:flex-end;gap:.75rem;display:flex}.acciones-sesion button{border:1px solid var(--borde);min-width:6rem;min-height:44px;color:var(--texto);font:inherit;cursor:pointer;background:#1c1f1d;border-radius:8px;padding:.5rem 1rem}.acciones-sesion button[type=submit]{border-color:var(--acento)}.acciones-sesion button:disabled{opacity:.6;cursor:progress}
