:root{color-scheme:dark;--pink:#ff3fa4;--violet:#8b4dff;--blue:#2aa9ff;--ink:#07050d;--white:#fff;--muted:#c7bfd2;--gradient:linear-gradient(110deg,#ff7652 0%,#ee2cad 38%,#8a4dff 72%,#2aa9ff 100%);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0}body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--ink);color:var(--white)}button,input{font:inherit}

/* Acceso */
.access-mode{min-height:100vh;display:grid;place-items:center;padding:24px;overflow:hidden;background:radial-gradient(circle at 20% 20%,#641d6b 0,transparent 35%),radial-gradient(circle at 85% 80%,#153b81 0,transparent 38%),#080610}.access-mode:before{content:"";position:fixed;inset:-50%;background:conic-gradient(from 30deg,transparent,#ff3fa411,transparent,#3e8cff16,transparent);animation:spin 20s linear infinite}.access-card{position:relative;width:min(500px,100%);padding:clamp(32px,6vw,58px);text-align:center;border:1px solid #ffffff20;border-radius:34px;background:#100d19d9;box-shadow:0 35px 100px #0009,0 0 70px #bc2d8c1f;backdrop-filter:blur(24px)}.access-card>img{filter:none}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.24em;color:#ff83c5}.access-card h1{font-size:clamp(30px,7vw,48px);line-height:1;margin:15px 0}.access-card h1 span,.waiting-message h1 span{background:var(--gradient);background-clip:text;color:transparent}.access-card>p:not(.eyebrow){color:var(--muted)}.access-card form{display:grid;gap:12px;text-align:left;margin-top:30px}.access-card label{font-size:13px;font-weight:700}.access-card input{width:100%;padding:16px 18px;border:1px solid #ffffff2e;border-radius:14px;background:#080610;color:#fff;font-size:24px;letter-spacing:.25em;text-align:center;outline:0}.access-card input:focus{border-color:#ec3bae;box-shadow:0 0 0 4px #ec3bae20}.access-card button{border:0;border-radius:14px;padding:16px;color:#fff;font-weight:800;background:var(--gradient);cursor:pointer;box-shadow:0 12px 35px #c72f9844}.form-error{color:#ff9acb;font-size:13px;text-align:center;margin:0}

/* Escena */
.screen-mode{height:100vh;overflow:hidden}.live-screen{position:relative;height:100%;min-height:420px;isolation:isolate;overflow:hidden;background:#080610}.photo-background{position:absolute;z-index:-5;inset:-6%;background:center/cover no-repeat;filter:blur(60px) brightness(.22) saturate(1.4);opacity:0;transform:scale(1.22);transition:opacity var(--background-duration,2000ms) ease}.photo-background.visible{opacity:.70}.live-screen:after{content:"";position:absolute;z-index:-3;inset:0;background:linear-gradient(180deg,#07050df2 0%,#07050d4d 24%,#07050d28 63%,#07050df7 100%),linear-gradient(90deg,#07050db8,transparent 20%,transparent 80%,#07050db8)}.ambient{position:absolute;z-index:-2;width:48vw;height:48vw;border-radius:50%;filter:blur(75px);opacity:.2;animation:drift 13s ease-in-out infinite alternate}.ambient-a{left:-18vw;top:-20vw;background:#ef279d}.ambient-b{right:-16vw;bottom:-22vw;background:#275fff;animation-delay:-6s}.noise{position:absolute;z-index:-1;inset:0;opacity:.045;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}

/* Branding superior */
.screen-header{position:absolute;z-index:100;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:clamp(18px,2.5vw,36px) clamp(24px,4vw,64px);pointer-events:none}.brand-lockup{display:flex;align-items:center;gap:14px}.brand-lockup img{width:clamp(50px,4.7vw,72px);height:auto}.brand-lockup strong{display:block;font-size:clamp(21px,2.1vw,32px);font-weight:800;line-height:1;letter-spacing:-.03em}.brand-lockup strong span{color:#f04aad}.brand-lockup small{display:block;margin-top:6px;color:#bdb4c9;font-size:clamp(9px,1vw,12px);letter-spacing:.08em}.collaboration{text-align:right}.collaboration small{display:block;color:#bdb4c9;font-size:clamp(8px,.8vw,11px);letter-spacing:.2em}.collaboration strong{display:block;margin-top:4px;font-size:clamp(22px,2.5vw,38px);font-weight:700;line-height:1;background:var(--gradient);background-clip:text;color:transparent}

/* Live Wall */
.stage{position:absolute;inset:clamp(90px,11vh,130px) 0 clamp(62px,8vh,90px)}.photo-wall{position:absolute;inset:0;overflow:hidden}.wall-photo{position:absolute;left:var(--x,50%);top:var(--y,50%);z-index:var(--z,10);width:clamp(170px,19vw,370px);height:clamp(120px,23vh,255px);margin:0;border-radius:clamp(10px,1.2vw,20px);overflow:hidden;background:#100c18;opacity:var(--opacity,0);filter:blur(var(--blur,0));transform:translate(-50%,-50%) scale(var(--scale,.5)) rotate(var(--rotate,0));box-shadow:0 18px 48px #0009,0 0 0 1px #ffffff12;transition:left 1250ms var(--ease),top 1250ms var(--ease),width 1250ms var(--ease),height 1250ms var(--ease),transform 1250ms var(--ease),opacity 900ms ease,filter 1250ms ease,box-shadow 1250ms ease;border:1px solid #ffffff0f;will-change:transform,left,top,opacity}.wall-photo img{width:100%;height:100%;display:block;object-fit:cover}.wall-photo.is-main{--x:50%;--y:50%;--scale:1;--rotate:0deg;--opacity:1;--blur:0px;--z:50;width:min(62vw,1080px);height:min(65vh,690px);border-color:#ffffff24;box-shadow:0 34px 100px #000d,0 0 50px #a6329d24}.wall-photo.is-main img{object-fit:contain;background:#08060d}.wall-photo.is-secondary{opacity:var(--opacity)}.wall-photo.is-hidden{opacity:0;transform:translate(-50%,-46%) scale(.35) rotate(var(--rotate,0));pointer-events:none}.wall-photo.is-incoming{animation:incoming 900ms var(--ease) both;box-shadow:0 20px 60px #000a,0 0 38px #d938b94a}.ambient-floating .wall-photo.is-secondary{animation:float-photo 9s ease-in-out var(--float-delay,0ms) infinite alternate}.wall-photo figcaption{position:absolute;left:8px;bottom:8px;padding:4px 7px;border-radius:6px;background:#000c;color:#fff;font-size:10px}.collage-title{position:absolute;z-index:42;left:50%;top:50%;display:grid;gap:5px;text-align:center;translate:-50% -50%;opacity:0;transform:scale(.9);transition:.7s var(--ease);pointer-events:none;text-shadow:0 3px 24px #000}.collage-title small{font-size:clamp(9px,1vw,13px);letter-spacing:.32em;color:#ff78c1}.collage-title strong{font-size:clamp(20px,2.7vw,42px)}.collage-mode .collage-title{opacity:1;transform:scale(1)}.collage-mode .wall-photo{filter:blur(0);opacity:min(var(--opacity),.72)}

/* Espera */
.has-photos .waiting-message{display:none}.waiting-message{position:absolute;left:50%;top:50%;translate:-50% -50%;text-align:center;width:min(90vw,900px)}.waiting-message>img{width:clamp(135px,15vw,190px);height:auto;filter:none;animation:float 4s ease-in-out infinite}.waiting-message h1{font-size:clamp(34px,5vw,78px);font-weight:800;line-height:1.02;letter-spacing:-.04em;margin:14px 0 20px}.waiting-message>p:not(.eyebrow){color:var(--muted);font-size:clamp(14px,1.4vw,20px)}.waiting-pulse{display:flex;justify-content:center;gap:9px;margin-top:30px}.waiting-pulse i{width:8px;height:8px;border-radius:50%;background:#ff4cad;animation:pulse 1.2s ease-in-out infinite}.waiting-pulse i:nth-child(2){animation-delay:.2s}.waiting-pulse i:nth-child(3){animation-delay:.4s}

/* UI inferior y avisos */
.screen-footer{position:absolute;z-index:100;left:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px);bottom:clamp(19px,3vw,38px);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;color:#d6cfdd;font-size:11px;font-weight:700;letter-spacing:.12em}.screen-footer p{margin:0}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;background:#ff3fa4;box-shadow:0 0 14px #ff3fa4;animation:live-pulse 2s ease-in-out infinite}.progress{height:2px;background:#ffffff1a;overflow:hidden}.progress i{display:block;width:0;height:100%;background:var(--gradient);box-shadow:0 0 10px #e12eb9}.progress.running i{animation:progress var(--progress-duration,8000ms) linear forwards}.fullscreen-button{position:absolute;z-index:120;right:22px;top:50%;width:44px;height:44px;border:1px solid #ffffff20;border-radius:50%;color:#fff;background:#0c0913a8;cursor:pointer;opacity:.35;transition:.2s}.fullscreen-button:hover{opacity:1;transform:scale(1.08)}.connection-status,.live-notice{position:absolute;z-index:110;left:50%;bottom:76px;translate:-50% 15px;margin:0;padding:9px 15px;border-radius:40px;background:#170e1fe8;color:#ffc4e4;font-size:12px;letter-spacing:.12em;opacity:0;transition:.35s}.connection-status.visible,.live-notice.visible{opacity:1;translate:-50% 0}.live-notice{bottom:auto;top:clamp(88px,11vh,125px);display:flex;align-items:center;gap:8px;font-weight:800}.live-notice i{width:7px;height:7px;border-radius:50%;background:#ff3fa4;box-shadow:0 0 14px #ff3fa4}

@keyframes spin{to{transform:rotate(1turn)}}@keyframes drift{to{transform:translate(7vw,5vw) scale(1.16)}}@keyframes float{50%{transform:translateY(-10px)}}@keyframes float-photo{from{translate:0 -2px}to{translate:2px 3px}}@keyframes pulse{50%{opacity:.25;transform:scale(.72)}}@keyframes live-pulse{50%{opacity:.55;transform:scale(.94)}}@keyframes progress{to{width:100%}}@keyframes incoming{from{opacity:0;transform:translate(-50%,calc(-50% + 30px)) scale(.35) rotate(calc(var(--rotate) - 3deg))}to{opacity:var(--opacity);transform:translate(-50%,-50%) scale(var(--scale)) rotate(var(--rotate))}}

@media(max-width:900px){.wall-photo{width:clamp(130px,24vw,240px);height:clamp(100px,20vh,190px)}.wall-photo.is-main{width:min(68vw,760px);height:min(62vh,580px)}}
@media(max-width:700px){.screen-header{padding:14px 16px}.brand-lockup{gap:8px}.brand-lockup small,.collaboration small{display:none}.stage{inset:78px 0 62px}.wall-photo{width:34vw;height:18vh}.wall-photo.is-main{width:76vw;height:58vh}.screen-footer{left:18px;right:18px;grid-template-columns:auto 1fr}.photo-count{display:none}.fullscreen-button{right:12px;top:auto;bottom:61px}.waiting-message h1{font-size:clamp(32px,9vw,52px)}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:250ms!important}.wall-photo{--rotate:0deg!important}.ambient-floating .wall-photo{animation:none!important}}

/* Las creatividades del evento incluyen canal alfa: se muestran sin marco rectangular. */
.wall-photo{overflow:visible;background:transparent;border:0;box-shadow:none}
.wall-photo img,.wall-photo.is-main img{background:transparent;filter:drop-shadow(0 18px 35px #000a)}
.wall-photo.is-main{border:0;box-shadow:none}