*,*:before,*:after{margin:0;padding:0}:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#experience{position:fixed;inset:0;overflow:hidden}#experience-canvas{width:100%;height:100%}#instructionsWASD,#instructionsTeleport{pointer-events:none}#loading-screen{position:fixed;inset:0;background:#0a0a0a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:2;transition:opacity .3s ease 1.5s}#loading-screen.hidden{opacity:0;pointer-events:none}.spinner{width:60px;height:60px;border:2px solid #222;border-top-color:#888;border-radius:50%;animation:spin .9s linear infinite}.loading-label{font-family:Google Sans Flex,sans-serif;font-size:14px;font-weight:700;font-style:normal;font-variation-settings:"slnt" -10;letter-spacing:.2em;text-transform:uppercase;color:#555;min-width:4ch}.loading-counter{font-family:Google Sans Flex,sans-serif;font-size:32px;font-weight:600;font-style:normal;font-variation-settings:"slnt" -5;color:#666;min-width:4ch;text-align:center}@keyframes spin{to{transform:rotate(360deg)}}#transition{position:fixed;inset:0;z-index:4;display:flex;flex-direction:column;pointer-events:none;transform:scaleX(0) scaleY(.02);transform-origin:center}#transition.animateScale{animation:growXY 1s cubic-bezier(.76,0,.24,1) forwards}.transSplit{width:100%;height:50%;background:#c00}#topSplit{display:flex;align-items:flex-end;justify-content:center;padding-bottom:4px}#topSplit.splitOut{animation:flyUp .6s cubic-bezier(.76,0,.24,1) forwards}#bottomSplit.splitOut{animation:flyDown .6s cubic-bezier(.76,0,.24,1) forwards}@keyframes growXY{0%{transform:scaleX(0) scaleY(.005)}45%{transform:scaleX(1) scaleY(.015)}55%{transform:scaleX(1) scaleY(.02)}to{transform:scaleX(1) scaleY(1)}}@keyframes flyUp{0%{transform:translateY(0)}to{transform:translateY(-100%)}}@keyframes flyDown{0%{transform:translateY(0)}to{transform:translateY(100%)}}.logo{display:flex;flex-direction:column;align-items:center;gap:4px;transform:scale(0);transform-origin:center}.logo.animateIn{animation:bounceIn .25s cubic-bezier(.34,1.56,.64,1) .5s forwards}#logoFill{width:120px}#textLogo{width:120px;height:20px;background:url(/ui/TypoLogo.svg) no-repeat}#instructionsWASD{position:fixed;bottom:32px;right:32px;z-index:80;display:grid;grid-template-areas:". w ." "a s d";gap:6px;transform:scale(0);transform-origin:center}#instructionsTeleport{position:fixed;bottom:32px;left:32px;z-index:80;transform:scale(0);transform-origin:center}#instructionsTeleport>img{transform:scale(.4);transform-origin:bottom center;opacity:.4}#instructionsWASD.animateIn,#instructionsTeleport.animateIn{animation:bounceIn .3s cubic-bezier(.34,1.56,.64,1) forwards}#wW{grid-area:w}#aA{grid-area:a}#sS{grid-area:s}#dD{grid-area:d}.marco{width:36px;height:36px;border:1px solid rgba(0,0,0,.6);border-radius:6px;display:flex;align-items:center;justify-content:center;background:#0006;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.instructText{font-family:Google Sans Flex,sans-serif;font-size:11px;font-weight:600;font-style:normal;font-variation-settings:"slnt" -5;letter-spacing:.1em;text-transform:uppercase;color:#fff9;min-width:4ch;text-align:center}#color-panel{position:fixed;bottom:-40px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:12px;background:#0006;border:.5px solid rgba(255,255,255,.6);border-radius:40px;padding:15px 30px 75px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.panel-divider{width:.5px;height:24px;background:#ffffff26;flex-shrink:0}#color-buttons{transform:scale(0);transform-origin:center}#color-buttons.animateIn{animation:bounceIn .3s cubic-bezier(.34,1.56,.64,1) forwards}.color-btn{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;margin:0 2px;transition:transform .15s,border-color .15s,box-shadow .15s}.icon-btn{width:60px;height:60px;border-radius:100%;border:.5px solid rgba(255,255,255,.15);background:#ffffff14;cursor:pointer;display:inline-block;align-items:center;justify-content:center;transition:background .2s,transform .15s;filter:brightness(2.25);margin-right:15px;margin-left:15px;margin-bottom:20px}.icon-btn:hover{background:#ffffff40;transform:translateY(-1px)}.icon-btn.active{background:#fff6;border-color:#ffffff80}.icon-btn img{width:22px;height:22px;opacity:1;mix-blend-mode:multiply}.color-btn:hover{transform:scale(1.18)}.color-btn.active{border-color:#ffffffb3;box-shadow:0 0 0 1px #fff3}.other-buttons{display:flex;gap:2px}.other-buttons.animateIn{animation:bounceIn .3s cubic-bezier(.34,1.56,.64,1) forwards}.anim-btn img{width:100%;height:100%;object-fit:contain}.anim-btn.active{outline:2px solid white}.anim-info{background:#0006;border:.5px solid rgba(0,0,0,.6);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:18px;overflow:hidden;opacity:0;pointer-events:none;z-index:10;width:420px;display:flex;gap:.75rem;flex-direction:column;position:fixed;padding:40px 16px 16px}.anim-info img{width:100%;height:160px;object-fit:cover;border:1.5px solid rgba(0,0,0,.1);border-radius:10px;flex-shrink:0;display:block}.anim-info p{font-family:Google Sans Flex,sans-serif;font-size:.75rem;line-height:1.6;color:#fffc;padding:.75rem 1rem}@keyframes bounceIn{0%{transform:scale(0)}to{transform:scale(1)}}.top-ui{position:fixed;top:12px;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:999}.ui-btn:hover{background:#ffffff38;transform:translateY(-1px)}.ui-btn.active{background:#00ffb459}#product-panel{position:fixed;bottom:8rem;left:50%;transform:translate(-50%) scale(1);z-index:100;min-width:380px;text-align:center;background:#0006;border:.5px solid rgba(0,0,0,.6);border-radius:20px;padding:2rem;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:opacity .25s ease,transform .3s cubic-bezier(.34,1.56,.64,1)}#product-panel.hidden{opacity:0;pointer-events:none;transform:translate(-50%) scale(.85)}.panel-close{position:absolute;top:10px;right:12px;background:#ffffff14;border:.5px solid rgba(255,255,255,.15);color:#ffffffb3;font-size:1.1rem;width:32px;height:32px;border-radius:50%;cursor:pointer;transition:background .15s;display:flex;align-items:center;justify-content:center}.panel-close:hover{background:#ffffff26}.panel-name{font-family:Google Sans Flex,sans-serif;font-size:1.5rem;font-weight:700;font-variation-settings:"slnt" -5;color:#fff;margin:.25rem 0 .3rem}.panel-subtitle{font-family:Google Sans Flex,sans-serif;font-size:1.1 rem;font-weight:400;color:#fff9;letter-spacing:.02em;margin-bottom:2rem}.panel-btn{display:inline-block;background:#e31837;color:#fff;font-family:Google Sans Flex,sans-serif;font-weight:600;font-size:.9rem;padding:.55rem 1.6rem;border-radius:12px;text-decoration:none;border:.5px solid rgba(255,255,255,.15);transition:background .15s,transform .15s}.panel-btn:hover{background:#ff2040;transform:translateY(-1px)}.anim-info-close{position:absolute;top:6px;right:8px;background:#ffffff14;border:.5px solid rgba(255,255,255,.15);color:#ffffffb3;font-size:1.1rem;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}.anim-info-close:hover{background:#fff3}#moto-drawer{position:fixed;top:50%;right:0;transform:translateY(-50%) translate(calc(100% - 28px));z-index:200;display:flex;flex-direction:row;align-items:center;transition:transform .35s cubic-bezier(.76,0,.24,1)}#moto-drawer.open{transform:translateY(-50%) translate(0)}#moto-drawer-tab{width:28px;height:56px;background:#fff6;border:.5px solid rgba(255,255,255,.6);border-right:none;border-radius:10px 0 0 10px;color:#ffffffb3;font-size:1.2rem;cursor:pointer;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}#moto-drawer-tab:hover{background:#ffffff26}#moto-drawer-content{width:200px;max-height:70vh;overflow-y:auto;background:#0a0a0ee0;border:.5px solid rgba(255,255,255,.15);border-right:none;border-radius:12px 0 0 12px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:12px 0;display:flex;flex-direction:column}#moto-drawer-content::-webkit-scrollbar{width:4px}#moto-drawer-content::-webkit-scrollbar-track{background:transparent}#moto-drawer-content::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:2px}.drawer-title{font-family:Google Sans Flex,sans-serif;font-size:.65rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#ffffff4d;padding:0 16px 8px}.drawer-item{font-family:Google Sans Flex,sans-serif;font-size:.82rem;font-weight:500;color:#ffffffb3;background:none;border:none;text-align:left;padding:9px 16px;cursor:pointer;transition:background .12s,color .12s;border-left:2px solid transparent}.drawer-item:hover{background:#ffffff12;color:#fff}.drawer-item.active{color:#fff;border-left-color:#e31837;background:#e3183714;font-weight:700}#qr-popup{display:none;position:fixed;inset:0;z-index:9999}#qr-popup.active{display:flex;align-items:center;justify-content:center}#qr-backdrop{position:absolute;inset:0;background:#000000a6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}#qr-content{padding:35px;position:relative;z-index:1;display:flex;flex-direction:column;background:#0a0a0eeb;border:.5px solid rgba(255,255,255,.12);border-radius:20px;overflow:hidden;box-shadow:0 32px 80px #0009;width:300px}#qr-iframe-col{width:300px;height:300px;overflow:hidden;flex-shrink:0;position:relative}#qr-iframe-col iframe{width:100%;height:100%;border:none;display:block}#qr-info-col{display:flex;flex-direction:column;padding:20px 20px 22px;gap:12px;border-top:.5px solid rgba(255,255,255,.08)}.qr-title{font-family:Barlow,sans-serif;font-size:1rem;font-weight:500;font-variation-settings:"slnt" -5;color:#fff;line-height:1.3;margin:0;text-align:center}.qr-divider{height:.5px;background:#ffffff14}.qr-instructions{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px}.qr-instructions li{display:flex;align-items:flex-start;gap:8px}.qr-icon{font-size:.9rem;flex-shrink:0;margin-top:1px}.qr-instructions span:last-child{font-family:Barlow,sans-serif;font-weight:300;font-size:.85rem;color:#ffffffa6;line-height:1.5}#qr-close{position:absolute;top:10px;right:10px;background:#0006;border:.5px solid rgba(255,255,255,.15);color:#ffffffb3;font-size:1rem;width:28px;height:28px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;z-index:2}#qr-close:hover{background:#ffffff26}.anim-btn-label{font-family:Google Sans Flex,sans-serif;font-size:.57rem;line-height:1.6;color:#fffc;margin-top:3px;align-self:center;display:inline-block;position:relative;padding-top:5px}#side-menu{position:fixed;top:50%;right:20px;transform:translateY(-50%);z-index:150;display:flex;flex-direction:column;gap:10px;background:#0006;border:.5px solid rgba(255,255,255,.6);border-radius:20px;padding:14px 10px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.side-menu-item{width:64px;background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border-radius:12px;cursor:pointer;transition:background .2s,transform .15s}.side-menu-item:hover{background:#ffffff14;transform:translateY(-1px)}.side-menu-item.active{background:#ffffff2e}.side-menu-item img{width:40px;height:40px;opacity:1}.side-menu-item h2{font-family:Google Sans Flex,sans-serif;font-size:.6rem;font-weight:600;font-style:normal;letter-spacing:.04em;color:#ffffffbf;margin:0;text-transform:none;white-space:nowrap}.side-menu-item.active h2{color:#fff}#sub-panel{position:fixed;bottom:0;left:50%;transform:translate(-50%) translateY(100%);z-index:140;display:flex;align-items:center;justify-content:center;gap:12px;min-width:280px;background:#0006;border:.5px solid rgba(255,255,255,.6);border-radius:40px 40px 0 0;padding:18px 30px 28px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:transform .4s cubic-bezier(.34,1.2,.4,1);pointer-events:none}#sub-panel.open{transform:translate(-50%) translateY(0);pointer-events:auto}.subpanel-content{display:none;align-items:center;gap:12px}.subpanel-content.visible{display:flex}@media(max-width:640px){#side-menu{right:10px;gap:6px;padding:10px 6px}.side-menu-item{width:48px;padding:6px 2px}.side-menu-item img{width:24px;height:24px}.side-menu-item h2{font-size:.5rem}#sub-panel{width:94vw;max-width:94vw;padding:14px 16px 22px;border-radius:24px 24px 0 0;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch}#sub-panel::-webkit-scrollbar{display:none}.subpanel-content{gap:8px;flex-wrap:nowrap;overflow-x:auto;width:100%;justify-content:center}.icon-btn{width:46px;height:46px;margin-left:6px;margin-right:6px;margin-bottom:8px;flex-shrink:0}.icon-btn img{width:18px;height:18px}.color-btn{width:30px;height:30px;flex-shrink:0}.anim-info{width:88vw;max-width:360px;inset:12px auto auto 50%;transform:translate(-50%);padding-top:36px}.anim-info img{height:110px}.anim-info p{font-size:.68rem;padding:.5rem .75rem}#qr-content{padding:16px;max-width:80vw}#qr-content img{width:70vw;max-width:220px;height:auto}#product-panel{min-width:unset;width:90vw;padding:1.5rem 1.25rem}.panel-name{font-size:1.2rem}}@media(max-width:380px){.side-menu-item{width:44px}.side-menu-item img{width:20px;height:20px}.side-menu-item h2{font-size:.44rem}.icon-btn{width:40px;height:40px}#qr-content{width:100%}}