:root{--bg:#0C0C0E;--bg2:#1A1A1D;--oro:#F0DC96;--oro2:#C9A961;--ok:#2ECC8F;--am:#F5B942;--rojo:#E5484D;--tx:#F6F1E6;--mut:#B9B2A2}
*{box-sizing:border-box}body{margin:0;min-height:100vh;font:16px/1.4 Roboto,system-ui,sans-serif;color:var(--tx);background-color:#000;background-image:radial-gradient(ellipse at 88% 6%,rgba(201,169,97,.26) 0%,rgba(201,169,97,0) 46%),linear-gradient(180deg,#1A1A1D 0%,#0C0C0E 48%,#000 100%);background-attachment:fixed;padding:16px;padding-block:max(16px,env(safe-area-inset-top))}
h1{font-size:1.1rem;letter-spacing:.12em;text-transform:uppercase;font-weight:800;margin:0 0 12px}h1 span{color:var(--oro);font-weight:300}
.card{background:rgba(255,255,255,.035);border:1px solid rgba(201,169,97,.40);border-radius:14px;padding:16px;margin-bottom:14px}
input,button,select{font:inherit;border-radius:10px;border:1px solid rgba(240,220,150,.5);padding:12px 14px;background:rgba(0,0,0,.35);color:#fff;max-width:100%}
button{background:var(--oro);color:#0a0a0a;font-weight:700;border:0;cursor:pointer}button.sec{background:transparent;color:var(--oro);border:1px solid var(--oro2)}button:disabled{opacity:.5}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.mut{color:var(--mut)}.big{font-size:2rem;font-weight:800}
.res{border-radius:14px;padding:18px;text-align:center;border:2px solid}.res.ok{background:rgba(46,204,143,.18);border-color:var(--ok)}.res.am{background:rgba(245,185,66,.18);border-color:var(--am)}.res.rojo{background:rgba(229,72,77,.18);border-color:var(--rojo)}
table{width:100%;border-collapse:collapse;font-size:.9rem}th,td{text-align:left;padding:6px 8px;border-bottom:1px solid rgba(255,255,255,.12)}.scroll{overflow-x:auto}
video{display:none;width:100%;max-height:50vh;border-radius:12px;background:#000;object-fit:cover}
.bar{height:14px;background:rgba(255,255,255,.15);border-radius:8px;overflow:hidden}.bar i{display:block;height:100%;background:var(--oro)}
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.kpi div{text-align:center}.kpi b{display:block;font-size:2.2rem;color:var(--oro)}
.estado{display:flex;gap:10px;align-items:center;background:rgba(0,0,0,.35);border:1px solid rgba(240,220,150,.3);border-radius:12px;padding:10px 12px;margin-bottom:12px}
.estado b{display:block;font-size:.95rem}.estado small{color:var(--mut)}.estado button{margin-left:auto;padding:8px 12px;white-space:nowrap}
.dot{width:12px;height:12px;border-radius:50%;flex:none;background:var(--ok)}.dot.am{background:var(--am)}.dot.rojo{background:var(--rojo)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.7);display:grid;place-items:center;padding:16px;z-index:10}.modal .card{width:min(420px,100%);margin:0}
.res .off{display:inline-block;margin-top:8px;font-size:.85rem;color:var(--mut)}
button:focus-visible,input:focus-visible{outline:3px solid var(--oro);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){.res{animation:in .18s ease-out}@keyframes in{from{transform:scale(.97);opacity:0}}}
/* kiosco (tótem): negro y dorado, ocupa toda la pantalla y se adapta a vertical u horizontal */
.kiosco{display:flex;flex-direction:column;align-items:center;text-align:center;height:calc(100dvh - 32px);gap:clamp(8px,2.5vmin,40px)}.kiosco[hidden]{display:none}
.kiosco #barra{width:100%;flex:none}.kiosco #barra .estado{margin-bottom:0}
.k-logo{flex:none;padding-top:clamp(4px,2vmin,40px)}.k-logo svg{width:clamp(140px,34vmin,520px);height:auto;display:block}
.k-ttl{flex:none;font-size:clamp(1.8rem,8vmin,7rem);font-weight:800;letter-spacing:-.02em;line-height:1.05;text-transform:none;margin:0}.k-ttl span{color:var(--oro);font-weight:800}
.k-zona{flex:1 1 0;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.k-marco{position:relative;height:100%;max-width:100%;aspect-ratio:4/3;border:clamp(2px,.4vmin,6px) solid var(--oro);border-radius:clamp(16px,3vmin,48px);padding:clamp(6px,1vmin,16px);background:radial-gradient(circle at 50% 40%,#242427,#09090b);display:flex;align-items:center;justify-content:center;overflow:hidden}
@media (orientation:portrait){.k-marco{height:auto;width:100%;max-height:100%;aspect-ratio:3/4}.k-logo svg{width:clamp(160px,46vmin,640px)}.k-ttl{font-size:clamp(1.8rem,9vmin,8rem)}.k-sub{font-size:clamp(1rem,4vmin,2.6rem)}}
.k-marco video{width:100%;height:100%;max-height:none;border-radius:clamp(10px,2vmin,36px);object-fit:cover}
.k-marco #cam{font-size:clamp(1rem,3.5vmin,2.4rem);padding:.6em 1.4em}
.k-sub{flex:none;color:var(--mut);margin:0 0 clamp(4px,2vmin,40px);font-size:clamp(1rem,3vmin,2.2rem)}
.kiosco video{transform:scaleX(-1)}
.k-ayuda{flex:none;margin:calc(-1*clamp(4px,1.5vmin,24px)) 0 0;color:var(--mut);font-size:clamp(1rem,3.2vmin,2.4rem)}
.k-guia{position:absolute;inset:0;margin:auto;width:60%;aspect-ratio:1;pointer-events:none}
.k-guia i{position:absolute;width:22%;aspect-ratio:1;border:0 solid var(--oro);filter:drop-shadow(0 0 6px rgba(240,220,150,.6))}
.k-guia i:nth-child(1){top:0;left:0;border-top-width:clamp(4px,.8vmin,10px);border-left-width:clamp(4px,.8vmin,10px);border-top-left-radius:18%}
.k-guia i:nth-child(2){top:0;right:0;border-top-width:clamp(4px,.8vmin,10px);border-right-width:clamp(4px,.8vmin,10px);border-top-right-radius:18%}
.k-guia i:nth-child(3){bottom:0;left:0;border-bottom-width:clamp(4px,.8vmin,10px);border-left-width:clamp(4px,.8vmin,10px);border-bottom-left-radius:18%}
.k-guia i:nth-child(4){bottom:0;right:0;border-bottom-width:clamp(4px,.8vmin,10px);border-right-width:clamp(4px,.8vmin,10px);border-bottom-right-radius:18%}
@media (prefers-reduced-motion:no-preference){.k-guia{animation:k-late 1.8s ease-in-out infinite}@keyframes k-late{50%{transform:scale(1.04)}}}
.k-res{position:fixed;inset:0;display:grid;place-items:center;padding:24px;z-index:20;background:rgba(0,0,0,.9);overflow:hidden}.k-res[hidden]{display:none}
.k-res.ok{background:radial-gradient(circle at 50% 45%,rgba(201,169,97,.38) 0%,rgba(201,169,97,.08) 38%,rgba(0,0,0,0) 62%),linear-gradient(180deg,#141416,#000);animation:k-fondo .35s ease-out both}
.k-ok{position:relative;text-align:center;max-width:94vw}
.k-check{width:clamp(110px,26vmin,320px);height:auto;fill:none;stroke:var(--oro);stroke-linecap:round;stroke-linejoin:round;--glow:drop-shadow(0 0 18px rgba(240,220,150,.55));filter:var(--glow)}
.k-check circle{stroke-width:4;stroke-dasharray:340;stroke-dashoffset:0}.k-check path{stroke-width:8;stroke-dasharray:80;stroke-dashoffset:0}
.k-ok .et{color:var(--oro);text-transform:uppercase;letter-spacing:.28em;font-weight:500;font-size:clamp(.9rem,3vmin,2.2rem);margin-top:3vmin}
.k-ok .nom{color:var(--tx);font-size:clamp(2.4rem,10vmin,9rem);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin-top:1.5vmin}
.k-ok .frase{margin-top:3vmin;font-size:clamp(1.5rem,6vmin,5rem);font-weight:300;font-style:italic;line-height:1.15;color:var(--oro);background:linear-gradient(100deg,#C9A961 0%,#F0DC96 30%,#FFF7DD 50%,#F0DC96 70%,#C9A961 100%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.k-brillos{position:absolute;inset:0;pointer-events:none}
.k-brillos i{position:absolute;width:calc(max(10px,1.6vmin)*var(--s));aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#FFF7DD 0,#F0DC96 35%,rgba(240,220,150,0) 70%);opacity:0}
.k-brillos i.e{width:calc(max(18px,3vmin)*var(--s));border-radius:0;background:#F0DC96;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%)}
.k-aviso{width:min(92vw,110vmin);border-radius:clamp(20px,4vmin,60px);padding:clamp(28px,7vmin,110px) clamp(20px,4vmin,60px);text-align:center;background:#111113;border:clamp(3px,.6vmin,8px) solid var(--am);color:var(--tx)}
.k-aviso.rojo{border-color:var(--rojo)}
.k-aviso .ic{display:inline-grid;place-items:center;width:clamp(80px,20vmin,220px);aspect-ratio:1;border-radius:50%;background:var(--am);color:#111;font-size:clamp(3rem,12vmin,9rem);font-weight:800;line-height:1}.k-aviso.rojo .ic{background:var(--rojo);color:#fff}
.k-aviso .et{font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-top:3vmin;font-size:clamp(1.1rem,4vmin,3rem)}.k-aviso .nom{font-size:clamp(2rem,8vmin,7rem);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin-top:1.5vmin}.k-aviso .tx{font-size:clamp(1.1rem,4vmin,3rem);margin-top:2vmin;color:var(--mut)}
@media (prefers-reduced-motion:no-preference){
.k-check circle{stroke-dashoffset:340;animation:k-trazo .7s ease-out .1s forwards}.k-check path{stroke-dashoffset:80;animation:k-trazo .4s ease-out .65s forwards}
/* El resplandor del tilde entra recién cuando terminó de dibujarse: un filtro sobre algo que se mueve se repinta en cada cuadro. */
.k-check{filter:none;animation:k-pop .6s cubic-bezier(.2,.9,.3,1.3) both,k-glow .3s ease-out 1.05s forwards}
.k-ok .et{animation:k-sube .5s ease-out .5s both}.k-ok .nom{animation:k-sube .55s ease-out .65s both}
.k-ok .frase{animation:k-sube .6s ease-out .85s both,k-brillo-txt 1.4s ease-in-out 1s 1}
.k-brillos i{will-change:transform,opacity;animation:k-destello 2.1s ease-in-out var(--d) infinite}
.k-aviso{animation:k-pop .35s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes k-trazo{to{stroke-dashoffset:0}}@keyframes k-pop{from{transform:scale(.6);opacity:0}}@keyframes k-sube{from{transform:translateY(3vh);opacity:0}}
@keyframes k-brillo-txt{to{background-position:-250% 0}}@keyframes k-fondo{from{opacity:0}}@keyframes k-glow{to{filter:var(--glow)}}
@keyframes k-destello{0%{opacity:0;transform:translateY(0) scale(.3) rotate(0)}35%{opacity:1;transform:translateY(-2vh) scale(1) rotate(45deg)}100%{opacity:0;transform:translateY(-8vh) scale(.4) rotate(90deg)}}}
@media (prefers-reduced-motion:reduce){.k-brillos i{opacity:.8}}
#login .card{max-width:420px;margin:12vh auto 0}
/* kiosco · entrar con el legajo (13/11/2026, Figma 162:2). Horizontal (all in one): cámara a la izquierda, textos y botón a la derecha.
   Vertical: todo en columna, el título arriba de la cámara como antes. */
.k-cuerpo{flex:1 1 0;min-height:0;width:100%;display:flex;flex-direction:column;align-items:center;gap:clamp(8px,2.5vmin,40px)}
.k-lado{display:contents}.k-lado .k-ttl,.k-lado .k-ayuda{order:-1}.k-sep{display:none}
.k-leg{display:flex;align-items:center;gap:.4em;white-space:nowrap;max-width:100%;font-size:clamp(1rem,3.8vmin,2.6rem);font-weight:400;padding:.8em 1.1em;border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.3);touch-action:manipulation}
.k-leg b{font-weight:700}.k-leg span{margin-left:auto;padding-left:.6em;font-size:1.4em;line-height:0}
.kiosco .k-sub{margin-bottom:0}
@media (orientation:landscape){
  .k-logo{align-self:flex-start;padding-left:4vw}
  .k-cuerpo{flex-direction:row;justify-content:center;gap:6vmin;padding:0 4vw clamp(8px,3vmin,48px)}
  .k-zona{flex:0 1 42%;min-width:0;height:100%}.k-zona .k-marco{aspect-ratio:1/1;height:auto;width:100%;max-height:100%}
  .k-lado{display:flex;flex-direction:column;align-items:flex-start;text-align:left;flex:1 1 0;min-width:0;max-width:48vw;gap:2vmin}
  .k-lado .k-ttl{font-size:clamp(1.8rem,8.5vmin,6.5rem)}.k-lado .k-ayuda{margin:0}
  .k-sep{display:block;width:80px;height:2px;background:var(--mut);opacity:.5;margin:3vmin 0 1vmin}
}
.k-tec{position:fixed;inset:0;z-index:15;display:flex;align-items:center;justify-content:center;gap:6vmin;padding:4vmin 5vw;background:radial-gradient(circle at 30% 20%,#1c1c20 0%,#09090b 60%);text-align:left;user-select:none;-webkit-user-select:none}.k-tec[hidden]{display:none}
.k-tec-izq{flex:1;max-width:46vw}
.k-tec h2{font-size:clamp(1.6rem,7.5vmin,5.5rem);font-weight:700;letter-spacing:-.02em;margin:0}.k-tec h2 span{color:var(--oro)}
.k-tec .k-ayuda{margin:1.5vmin 0 0}
.k-caja{display:flex;align-items:center;height:clamp(64px,15vmin,170px);margin-top:4vmin;border:4px solid var(--oro);border-radius:14px;background:#121214;color:#fff;font-size:clamp(2rem,8.5vmin,6.5rem);font-weight:700;letter-spacing:.12em;padding:0 .45em;overflow:hidden;white-space:nowrap}
.k-caja::after{content:"";width:4px;height:.9em;margin-left:.08em;background:var(--oro);animation:k-cursor 1s steps(1) infinite}
@keyframes k-cursor{50%{opacity:0}}
.k-acc{display:flex;gap:2vmin;margin-top:3.5vmin}
.k-acc button{flex:1;font-size:clamp(1.1rem,3.8vmin,2.8rem);padding:.9em .4em;border-radius:12px;touch-action:manipulation}.k-acc button.sec{flex:.8;font-weight:500;color:var(--tx);border:2px solid currentColor}
.k-tec .k-sub{margin-top:2.5vmin;font-size:clamp(.9rem,2.4vmin,1.6rem)}
.k-pad{flex:none;display:grid;grid-template-columns:repeat(3,clamp(72px,17vmin,210px));grid-auto-rows:clamp(60px,14.5vmin,175px);gap:clamp(8px,1.8vmin,22px)}
.k-pad button{font-size:clamp(1.6rem,6.2vmin,4.6rem);font-weight:500;padding:0;border-radius:14px;background:#1d1d21;color:#fff;border:2px solid rgba(240,220,150,.28);box-shadow:0 6px 16px rgba(0,0,0,.25);touch-action:manipulation}
.k-pad button.chico{font-size:clamp(.8rem,2.4vmin,1.7rem);line-height:1.2}
.k-pad button:active{transform:scale(.95);background:#2a2a30}
@media (orientation:portrait){.k-tec{flex-direction:column;justify-content:center}.k-tec-izq{flex:none;max-width:none;width:100%}.k-pad{grid-template-columns:repeat(3,clamp(72px,24vmin,240px));grid-auto-rows:clamp(60px,18vmin,190px)}}
.k-aviso button{margin-top:3vmin;font-size:clamp(1.1rem,3.4vmin,2.4rem);padding:.8em 1.6em;border-radius:12px}