:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#f5f8ff;background:#0d1424;--cyan:#35d9ed;--yellow:#ffe448;--magenta:#f147ab;--ink:#0d1424}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,a{font:inherit}button{cursor:pointer}.experience{position:relative;width:100%;height:100dvh;min-height:480px;overflow:hidden;background:#0b1324;isolation:isolate}.sky{position:absolute;inset:0;background:radial-gradient(circle at 50% 68%,#395575 0,#182a43 32%,#0a1324 75%);z-index:-2}.sky:after{content:"";position:absolute;inset:52% 0 0;background:linear-gradient(#1c3048,#090d16)}.viewport{position:absolute;inset:0;overflow:hidden;perspective:900px;perspective-origin:50% 49%;touch-action:none}.world{position:absolute;left:50%;top:49%;width:0;height:0;transform-style:preserve-3d;will-change:transform}.world *{backface-visibility:visible}.plane,.shelf,.fixture,.product-object,.light-panel{position:absolute;transform-style:preserve-3d}.plane{border:1px solid #ffffff12}.exterior-floor{background:repeating-linear-gradient(0deg,transparent 0 82px,#4e60701a 83px 85px),repeating-linear-gradient(90deg,#293d4b 0 82px,#55687d1c 83px 85px);box-shadow:inset 0 0 180px #03070d}.floor{background:repeating-linear-gradient(0deg,transparent 0 115px,#86b8d013 117px 119px),repeating-linear-gradient(90deg,transparent 0 115px,#86b8d013 117px 119px),linear-gradient(110deg,#1a2a3b,#243a4e 45%,#152439);box-shadow:inset 0 0 240px #050b16}.ceiling{background:linear-gradient(135deg,#0b1322,#1b2a3b)}.wall{background:linear-gradient(115deg,#172539,#1d3042 40%,#122235);box-shadow:inset 0 0 100px #050a18;border:8px solid #2c445c}.wall:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 175px,#85adbd0c 176px 178px)}.facade-wing{background:linear-gradient(100deg,#13253a,#2d4d61 60%,#122039);border:12px solid #39596c;box-shadow:0 0 35px #051424}.facade-wing:after{content:"";position:absolute;inset:10px;border:2px solid #80bac42b;background:repeating-linear-gradient(90deg,#97b7c409 0 65px,#07223522 66px 70px)}.door-header{background:linear-gradient(#1b3749,#101e30);border:10px solid #45697a;box-shadow:0 0 24px #39d8eb55}.door-beam{background:linear-gradient(90deg,#243f52,#4c7d89,#203b4d);box-shadow:0 0 13px #45d9e854}.door-threshold{background:linear-gradient(90deg,#00aeca,#f037a9,#ffe04b);box-shadow:0 0 22px #49e0ef88}.store-sign{display:flex;align-items:center;justify-content:center;gap:22px;background:linear-gradient(120deg,#080d1b,#111e36 65%,#050b18);border:4px solid #62dcea;border-radius:22px;box-shadow:0 0 22px #33def071,inset 0 0 30px #20c8e83b;color:white}.store-sign img{width:112px;height:112px;object-fit:contain}.store-sign span{display:block;font-size:43px;line-height:1;font-weight:950;letter-spacing:-.055em;text-shadow:0 0 18px #64bfff}.store-sign span b{color:var(--yellow)}.store-sign small{display:block;color:#b9d9eb;letter-spacing:.27em;font-size:11px;font-weight:700;margin-top:11px}.entry-word{display:flex;align-items:center;justify-content:center;background:#071728cc;border:2px solid #67ddeb66;box-shadow:0 0 20px #2ee9fe37;color:#bce9f1;font-weight:900;letter-spacing:.3em;font-size:17px}.entry-arrow{font-size:28px;color:var(--yellow);margin-left:15px}.light-panel{background:linear-gradient(90deg,transparent,#c0faff 35%,#fff 50%,#c0faff 65%,transparent);box-shadow:0 0 45px 17px #50dcf568;border-radius:999px}.floor-decal{display:flex;align-items:center;justify-content:center;color:#dceef0;opacity:.6;border:4px solid #79d8e56b;letter-spacing:.28em;font-size:32px;font-weight:950;text-shadow:0 0 20px #52cfe1}.back-mural{background:url('../assets/explosion-fondo.webp') center/cover;opacity:.75;border:5px solid #7be7ee42;box-shadow:0 0 30px #47d2e72e}.mural-caption{font-weight:900;color:white;letter-spacing:.2em;text-shadow:0 3px 14px #000;background:#06121fb3;padding:12px;text-align:center}
.shelf{width:560px;height:355px;margin-left:-280px;margin-top:-177px;border:8px solid #385970;border-radius:13px;background:linear-gradient(145deg,#122438,#0a1424);box-shadow:inset 0 0 28px #07111e,0 13px 25px #020712bd;color:white;transition:filter .3s,border-color .3s}.shelf.near{border-color:var(--accent);filter:drop-shadow(0 0 16px var(--glow))}.shelf:before{content:"";position:absolute;inset:0;border-radius:5px;background:repeating-linear-gradient(90deg,transparent 0 90px,#9ec8e20d 91px 93px);pointer-events:none}.shelf-header{position:absolute;left:12px;right:12px;top:10px;height:56px;display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,var(--accent),#22344a 66%);padding:0 16px;border-radius:6px;font-size:22px;font-weight:950;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 7px #09111e;box-shadow:0 0 18px var(--glow)}.shelf-header small{font-size:10px;letter-spacing:.18em;opacity:.9;margin-left:auto;white-space:nowrap}.shelf-ledges{position:absolute;inset:86px 12px 7px;display:grid;grid-template-columns:repeat(var(--shelf-columns,4),minmax(0,1fr));gap:9px;align-items:end}.shelf-ledges:after{content:"";position:absolute;left:0;right:0;bottom:7px;height:10px;background:linear-gradient(#789aab,#244258);box-shadow:0 6px 7px #0008;pointer-events:none}.product-object{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:end;height:220px;min-width:0;border:0;border-radius:5px 5px 0 0;background:linear-gradient(160deg,#294050,#0d1a29);color:white;padding:5px 5px 20px;box-shadow:inset -8px 0 #020a1299,0 6px 11px #0008;transition:transform .24s,box-shadow .24s,background .24s;cursor:default;text-align:center}.product-object:before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--accent)}.product-object:after{content:"";position:absolute;top:5px;right:-7px;width:7px;height:calc(100% - 5px);background:#0a1521;transform:skewY(-33deg);transform-origin:left top}.product-object .object-label{display:flex;align-items:center;justify-content:center;min-height:47px;width:100%;font-size:13px;line-height:1.05;font-weight:900;text-shadow:0 2px 5px #000}.product-object .object-art{width:min(96px,100%);height:112px;object-fit:cover;object-position:center;background:#a7b8c5;box-shadow:0 3px 10px #0008;opacity:.12;filter:grayscale(.7);transition:opacity .35s,filter .35s,transform .35s,border-color .35s;border:2px solid #a8c4cc55}.product-object .object-index{font:900 11px/1 monospace;color:var(--accent);letter-spacing:.14em;margin-top:8px}.shelf.near .product-object{cursor:pointer;background:linear-gradient(160deg,#354e5d,#142a3b)}.shelf.near .product-object .object-art{opacity:1;filter:none;transform:translateY(-14px) translateZ(58px) scale(1.07);border-color:#fffd;box-shadow:0 18px 34px #000e,0 0 24px var(--glow)}.shelf.near .product-object:hover,.shelf.near .product-object:focus-visible{transform:translateZ(35px) translateY(-6px);outline:2px solid var(--yellow);box-shadow:0 0 25px var(--glow)}.shelf .empty-slot{position:relative;opacity:.4}.shelf .empty-slot:after{content:"✦";font-size:36px;color:var(--accent);text-align:center;display:block;padding-bottom:38px}.shelf-tag{position:absolute;left:20px;bottom:-35px;font-weight:900;font-size:14px;letter-spacing:.2em;color:#bdd4da;text-shadow:0 3px 9px #000}
.topbar{position:absolute;left:0;right:0;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px clamp(18px,3vw,44px);background:linear-gradient(#07101fe8,#07101f7d,transparent);pointer-events:none}.topbar>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:950;letter-spacing:-.04em}.brand img{width:42px;height:42px;object-fit:contain}.brand b{color:var(--yellow)}.brand small{display:block;letter-spacing:.18em;font-size:9px;font-weight:700;color:#9fc0d2;text-transform:uppercase}.prototype-tag{font:900 10px/1 monospace;letter-spacing:.24em;border:1px solid #84dceb80;color:#d2f7fc;padding:10px 13px;border-radius:99px;background:#0c2638af}.back-link{color:#e0f6fb;text-decoration:none;border:1px solid #ffffff65;border-radius:99px;padding:10px 16px;font-weight:800;font-size:12px;background:#0c1828b8}.back-link:hover{background:#1d455b}.welcome{position:absolute;left:0;top:0;bottom:0;width:min(48vw,690px);z-index:10;display:flex;align-items:center;padding:95px clamp(30px,6vw,100px);background:linear-gradient(90deg,#08111ff5 0%,#08111fe9 70%,#08111f00 100%);transition:opacity .7s,visibility .7s}.welcome.hidden{opacity:0;visibility:hidden;pointer-events:none}.welcome-copy{max-width:500px}.eyebrow{color:var(--cyan);font-size:11px;font-weight:950;letter-spacing:.23em;text-transform:uppercase}.welcome h1{font-size:clamp(36px,4.5vw,76px);line-height:.98;letter-spacing:-.07em;margin:18px 0 23px;max-width:510px;text-wrap:balance}.welcome h1 em{font-style:normal;color:var(--yellow)}.welcome-copy>p:not(.eyebrow){font-size:clamp(14px,1.3vw,18px);line-height:1.6;color:#c4d6e4;max-width:420px;margin-bottom:28px}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;background:var(--yellow);color:#101725;border:0;border-radius:99px;padding:15px 24px;text-decoration:none;font-weight:950;box-shadow:0 10px 30px #ffe54a35}.primary-button:hover{background:#fff17e;transform:translateY(-2px)}.welcome-hint{display:block;font-size:11px;color:#8da7b9;margin-top:14px}.film-grain,.vignette{position:absolute;inset:0;pointer-events:none}.film-grain{z-index:7;opacity:.11;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E")}.vignette{z-index:8;box-shadow:inset 0 0 150px 15px #020814ab}.crosshair{position:absolute;left:50%;top:49%;width:12px;height:12px;border:1px solid #ffffffe0;border-radius:50%;transform:translate(-50%,-50%);z-index:9;opacity:0;transition:opacity .5s;pointer-events:none}.playing .crosshair{opacity:.7}.crosshair:after{content:"";position:absolute;left:4px;top:4px;width:2px;height:2px;border-radius:50%;background:var(--yellow)}.compass{position:absolute;right:34px;top:84px;display:flex;align-items:center;justify-content:center;flex-direction:column;width:70px;height:70px;border:1px solid #ffffff50;background:#0b1b2cbf;border-radius:50%;box-shadow:0 8px 20px #0007;z-index:13;opacity:0;transition:opacity .4s}.playing .compass{opacity:1}.compass span{color:var(--yellow);font-size:23px;line-height:1}.compass b{font-size:10px;color:#d6ebf3}.proximity{position:absolute;bottom:98px;left:50%;transform:translateX(-50%);z-index:12;min-width:0;max-width:min(500px,90vw);text-align:center;color:#ecfbff;background:#0b1b2be8;border:1px solid #76dbea66;border-radius:99px;padding:10px 18px;font-size:12px;font-weight:800;opacity:0;transition:opacity .25s;pointer-events:none}.proximity:not(:empty){opacity:1}.guide{position:absolute;bottom:23px;left:50%;transform:translateX(-50%);z-index:12;display:flex;gap:21px;align-items:center;justify-content:center;white-space:nowrap;border:1px solid #ffffff2e;background:#071320d9;border-radius:99px;padding:10px 20px;color:#c6d9e5;font-size:11px;opacity:0;transition:opacity .4s}.playing .guide{opacity:1}.guide kbd{border:1px solid #7da2b8;padding:1px 4px;margin-right:2px;border-radius:3px;color:white}.touch-controls{display:none;position:absolute;bottom:28px;left:20px;z-index:15}.touch-controls>div{display:flex;gap:6px}.touch-controls button{background:#0d263ecf;color:white;border:1px solid #a5e5ee8a;border-radius:12px;width:49px;height:49px;font-size:20px;font-weight:900;touch-action:none;box-shadow:0 4px 12px #0009}.touch-controls>button{margin-left:55px;margin-bottom:5px}.touch-controls button:active{background:var(--cyan);color:#112}
.product-dialog{position:fixed;z-index:30;max-width:min(650px,calc(100vw - 34px));width:650px;max-height:min(650px,calc(100dvh - 60px));padding:0;border:1px solid #8be4ec7d;border-radius:20px;background:#101e30;color:white;box-shadow:0 30px 90px #000d;overflow:auto}.product-dialog::backdrop{background:#030913b8;backdrop-filter:blur(6px)}.product-dialog>img{width:100%;height:280px;object-fit:cover;display:block}.dialog-copy{padding:23px 29px 29px}.dialog-copy h2{font-size:32px;line-height:1.06;margin:10px 0 12px;letter-spacing:-.04em}.dialog-copy>p:not(.eyebrow){color:#b9d0df;line-height:1.5}.dialog-copy small{display:block;margin-top:11px;color:#92aec1}.dialog-close{position:absolute;right:13px;top:13px;z-index:2;border:0;width:43px;height:43px;background:#071421e8;color:white;border-radius:50%;font-size:25px}
@media(max-width:850px){.welcome{width:100%;background:linear-gradient(90deg,#08111feb,#08111fc2 70%,#08111f55);padding:80px 8vw}.prototype-tag{display:none}.topbar{padding:14px 17px}.brand{font-size:15px}.brand img{width:35px;height:35px}.back-link{font-size:11px;padding:8px 10px}.guide{bottom:15px;font-size:10px;gap:8px;padding:8px 12px}.guide span:last-child{display:none}.compass{right:16px;top:76px;width:55px;height:55px}.product-dialog>img{height:210px}}
@media(pointer:coarse){.playing .touch-controls{display:block}.guide{left:auto;right:16px;bottom:28px;transform:none}.guide span:first-child{display:none}.guide span:last-child{display:none}.proximity{bottom:140px}.welcome-hint{display:none}}
@media(max-width:480px){.welcome h1{font-size:clamp(42px,12vw,58px)}.welcome-copy>p:not(.eyebrow){font-size:15px}.back-link{max-width:115px;text-align:center}.brand small{font-size:8px}.guide{max-width:115px;white-space:normal;text-align:center}.dialog-copy{padding:18px}.dialog-copy h2{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
.entry-floor-arrow{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:linear-gradient(135deg,#ffe450e8,#f49d43e8);border:7px solid #fff4ad;border-radius:30px;box-shadow:0 0 52px #ffe64fba,inset 0 0 22px #fff8;color:#152033;font-size:21px;font-weight:1000;letter-spacing:.08em;text-align:center;cursor:pointer;animation:entry-pulse 1.6s ease-in-out infinite;backface-visibility:visible}.entry-floor-arrow .arrow-symbol{font-size:110px;line-height:.75;text-shadow:0 3px #ffffff80}.entry-floor-arrow:hover,.entry-floor-arrow:focus-visible{background:#fff189;outline:8px solid #56e7ee;outline-offset:8px}.playing .entry-floor-arrow{opacity:.16;pointer-events:none;animation:none}@keyframes entry-pulse{50%{box-shadow:0 0 82px #ffe64fff,inset 0 0 22px #fff8}}
.shelf-header{cursor:pointer;user-select:none}.shelf-header:hover,.shelf-header:focus-visible{filter:brightness(1.25);outline:3px solid var(--yellow);outline-offset:2px}.product-object,.product-object *{user-select:none;-webkit-user-select:none}.product-object img{pointer-events:none;-webkit-user-drag:none}.viewport{cursor:grab}.viewport:active{cursor:grabbing}.entry-floor-arrow,.shelf-header,.product-object{cursor:pointer}
@media(pointer:coarse){.guide{left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 24px);white-space:normal;text-align:center;border-radius:16px;padding:9px 13px}.guide span{display:none!important}.guide:after{content:"1 dedo: mirar · 2 dedos: abrir para avanzar y cerrar para retroceder · toca un estante para acercarte"}.proximity{bottom:84px}}
.world *{backface-visibility:hidden}.shelf-header,.shelf-ledges,.shelf-tag{transform:translateZ(3px)}.shelf:before{transform:translateZ(1px)}
.exit-floor-arrow{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#36d7e5da,#256c91e8);border:7px solid #c3ffff;border-radius:27px;box-shadow:0 0 28px #5fe4f19b;color:#071b30;font-size:21px;font-weight:1000;letter-spacing:.08em;text-align:center;cursor:pointer;opacity:0;pointer-events:none}.exit-floor-arrow .floor-label{display:flex;flex-direction:column;align-items:center;gap:6px;transform:rotate(180deg)}.exit-floor-arrow .arrow-symbol{font-size:105px;line-height:.75}.playing .exit-floor-arrow{opacity:1;pointer-events:auto}.exit-floor-arrow:hover,.exit-floor-arrow:focus-visible{background:#9df7ff;outline:7px solid var(--yellow);outline-offset:6px}
@media(pointer:coarse){.film-grain{display:none}.vignette{box-shadow:inset 0 0 80px 5px #0208146b}.shelf.near{filter:none;box-shadow:inset 0 0 28px #07111e,0 0 14px var(--glow)}.light-panel{box-shadow:0 0 18px 7px #50dcf540}.product-object .object-art{transition:none}.shelf.near .product-object .object-art{transform:translateY(-9px) translateZ(30px) scale(1.02)}}
.facade-upper{background:linear-gradient(120deg,#142639,#233b4d,#101b2d);border:10px solid #385a6d;box-shadow:inset 0 0 95px #030b17}.store-sign{padding:9px;background:#10192b;border-color:#77e4ef;box-shadow:0 0 36px #33def091,inset 0 0 32px #20c8e83b}.store-sign img{display:block;width:100%;height:100%;object-fit:contain}.ceiling-brand{background:#101627 url('../assets/catalogo-inmersivo-letrero.webp') center/contain no-repeat;border:15px solid #6ddce486;box-shadow:0 0 34px #4fe5ed85,inset 0 0 30px #000}
.product-object .object-art{opacity:1;filter:none;border-color:#d3e9f1a0}.product-object{cursor:pointer}.product-dialog>img{object-fit:contain;background:#071422;height:min(390px,46dvh)}
@media(max-width:850px){.product-dialog>img{height:min(320px,42dvh)}}
.exterior-guide{position:absolute;left:50%;bottom:22px;z-index:12;transform:translateX(-50%);padding:10px 18px;border:1px solid #ffe96b83;border-radius:99px;background:#091829e8;color:#ffeb83;font-size:13px;font-weight:850;text-align:center;white-space:nowrap;pointer-events:none}
.playing .exterior-guide{display:none}
@media(max-width:600px){.exterior-guide{white-space:normal;width:max-content;max-width:calc(100vw - 30px);font-size:12px}}
.exterior-guide .mobile-guide{display:none}
@media(max-width:600px),(pointer:coarse){.exterior-guide .desktop-guide{display:none}.exterior-guide .mobile-guide{display:inline}}