*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:#222;font-family:Comfortaa,sans-serif;color:#fff}.main-content{text-align:center;margin:2.5em auto;max-width:1000px;padding:0 1rem 3rem}.page-title{font-size:1.2rem;font-weight:400;margin-bottom:1.5em}.map-wrapper{position:relative;width:100%;display:flex;justify-content:center}.hint{margin-top:1.5rem;font-size:.9rem;opacity:.85}.admin-link{position:fixed;top:12px;right:12px;z-index:10050;background:#ffffff1f;border:1px solid rgba(255,255,255,.22);color:#fff;padding:10px 12px;border-radius:12px;text-decoration:none;font-size:.9rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.admin-link:active{transform:scale(.98)}.map-base{width:min(92vw,360px);aspect-ratio:306 / 600;height:auto;background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/9.png) center center / cover;position:relative;display:inline-block;transform-origin:top center;cursor:pointer;-webkit-tap-highlight-color:transparent}@media(min-width:1100px){.map-base{transform:scale(1.1)}}.map-base:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent,rgba(0,0,0,.15));opacity:0;transition:opacity .45s ease .2s;z-index:15}.map-base.active:after{opacity:1}.map-base.active{width:min(100vw,1200px)!important;aspect-ratio:1000 / 600;height:auto;transform:none!important}.map-wrapper{align-items:flex-start}.menu-panel{position:absolute;inset:8% 4%;background:#f8e9c8db;border-radius:14px;border:1px solid rgba(80,52,26,.4);box-shadow:0 6px 16px #0006;padding:.8rem 1rem;overflow:hidden;color:#3b2414;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transform:scale(.96);transition:opacity .45s ease .3s,transform .45s ease .3s;z-index:40}.map-base.active .menu-panel{opacity:1;pointer-events:auto;transform:scale(1);left:50%!important;right:auto!important;transform:translate(-50%) scale(1);width:min(100%,1400px);max-width:1400px;padding:1.1rem}.menu-panel-inner{height:100%;overflow:auto;-webkit-overflow-scrolling:touch;display:block;grid-template-columns:repeat(4,minmax(220px,1fr));gap:1.1rem;min-width:920px;padding-bottom:12px}.map-base.active .menu-panel{overflow-x:auto;overflow-y:hidden}.muted-loading{color:#3b2414;font-size:.95rem;opacity:.9}.menu-column h2{font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid rgba(80,52,26,.55);margin:0 0 .35rem;padding-bottom:.18rem}.cat-desc{font-size:.72rem;opacity:.85;margin:0 0 .35rem}.menu-subtitle{font-size:.8rem;margin:.55rem 0 .25rem;text-transform:uppercase;letter-spacing:.06em}.menu-list{list-style:none;margin:.25rem 0 .75rem;padding:0}.menu-list li{display:flex;align-items:baseline;gap:.25rem;font-size:.78rem;margin:.1rem 0}.item-left{flex:0 1 auto;min-width:0;max-width:72%}.item-name{font-weight:600}.item-desc{font-size:.7rem;opacity:.85;margin-top:2px}.dots{flex:1 1 auto;border-bottom:1px dotted rgba(80,52,26,.55);margin:0 .25rem;transform:translateY(-2px)}.price{flex:0 0 auto;font-weight:700;white-space:nowrap}.menu-note{margin-top:.6rem;font-size:.72rem}.map-flap{transform-style:preserve-3d;position:absolute;width:100%;height:25%;margin:auto;left:0;right:0;transition:.5s ease;top:25%}.map-flap__front,.map-flap__back{backface-visibility:hidden;width:100%;height:100%;position:absolute}.map-flap__back{transform:scale(-1) rotateY(180deg)}.flap--1{box-shadow:0 -1px 6px #61534980}.flap--1 .map-flap__front{background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/mini-1.png) center left / cover}.flap--1 .map-flap__back{background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/mini-3.png) -3px 0/ cover}.flap--2{box-shadow:0 1px 6px #61534980;top:50%}.flap--2 .map-flap__front{background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/mini-2.png) center left / cover}.flap--2 .map-flap__back{background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/mini-4.png) -3px 0/ cover}.map-side{height:100%;width:50%;position:absolute;transform-style:preserve-3d;transition:.3s ease;top:0}.map-side .front,.map-side .back{width:100%;height:100%;position:absolute;background-repeat:no-repeat;background-position:left top;background-size:cover;background-image:var(--image);backface-visibility:hidden}.map-side .back{background-image:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/back.png)}.side-1{left:0;margin-left:1.5px}.side-2{left:50%;margin-left:-2px}.side-3{left:0;margin-left:3px}.side-4{left:50%;margin-left:-1px}.side-5{left:0}.side-6{left:50%}.side-3 .back,.side-4 .back{transform:rotateY(180deg)}.side-5 .back{background-image:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/1.png)}.side-6 .front{background-size:99.5%}.side-6 .back{background-image:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/17.png)}.scroll-name{position:absolute;bottom:105px;left:-60px;width:150px;height:30px;font:15px Satisfy,cursive;text-align:center;background:url(https://meowlivia.s3.us-east-2.amazonaws.com/codepen/map/scroll.svg) center center / cover;z-index:10;color:#615349;cursor:default;opacity:0}.footstep{position:absolute;background:#615349;width:6px;height:12px;border-radius:80% 80% 70% 70%/130% 130% 25% 25%;z-index:10;opacity:0}.footstep:before{content:"";position:absolute;width:5px;height:5px;top:110%;left:0;background:#615349;border-radius:0 0 100% 100%}.footstep.left{transform:rotate(5deg)}.footstep.right{transform:rotate(-3deg) translateY(15px) translate(10px)}.footsteps-1 .footstep.left{bottom:150px;left:18px;transform:rotate(35deg)}.footsteps-1 .footstep.right{bottom:150px;left:28px;transform:rotate(30deg)}.footsteps-2 .footstep.left{bottom:285px;left:280px;transform:rotate(-90deg)}.footsteps-2 .footstep.right{bottom:275px;left:285px;transform:rotate(-85deg)}.footsteps-2 .scroll-name{bottom:300px;left:220px}.map-base.active .flap--1{transform:rotateX(180deg);transform-origin:top center;transition:.6s transform 1.5s}.map-base.active .flap--2{transform:rotateX(180deg);transform-origin:bottom center;transition:.6s transform 1.8s}.map-base.active .side-1{transform-origin:center left;transform:rotateY(180deg) skewY(2deg);transition:.5s all ease-in-out .6s}.map-base.active .side-1 .front{transform:rotateY(180deg)}.map-base.active .side-2{transform:rotateY(180deg) skewY(-2deg);transform-origin:center right;transition:.5s all ease-in-out .6s}.map-base.active .side-2 .front{transform:rotateY(180deg)}.map-base.active .side-3{left:-50%;transform:skewY(2deg) translate(-100%);top:8px;transition:.5s transform ease .8s,.3s left ease .8s,.5s top ease .8s}.map-base.active .side-4{left:100%;transform:skewY(-2deg) translate(100%);top:8px;margin-left:-7px;transition:.5s transform ease .8s,.3s left ease .8s,.5s top ease .8s,.5s margin .8s}.map-base.active .side-5{left:-100%;transform-origin:center left;transform:rotateY(180deg);transition:.5s transform,.7s left .8s,.2s margin .8s;top:0;margin-left:4px}.map-base.active .side-5 .front{transform:rotateY(180deg);transition:.1s transform}.map-base.active .side-6{left:150%;transform:rotateY(180deg);transform-origin:center right;margin-left:-8px;transition:.5s transform .3s,.7s left .8s,.5s top .8s,.5s margin .8s}.map-base.active .side-6 .front{transform:rotateY(180deg);transition:.1s transform}.map-base.active .footstep,.map-base.active .scroll-name{opacity:1;transition:.5s opacity 2.5s}@media(max-width:700px){html,body{overflow-x:hidden}body{background:#141414}.main-content{margin:0;padding:0;max-width:100%}.page-title,.hint{display:none}.map-wrapper{height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;width:100vw}.map-wrapper.is-open{overflow-x:auto;overflow-y:hidden;justify-content:flex-start;-webkit-overflow-scrolling:touch;padding:0 10vw;scroll-snap-type:x mandatory}.map-base{width:min(92vw,420px);aspect-ratio:306 / 600;height:auto;transform:none!important;flex:0 0 auto}.map-base.active{width:260vw!important;max-width:none!important;aspect-ratio:1000 / 600;height:min(92vh,156vw);transform:none!important;scroll-snap-align:center}.map-base.active .menu-panel{top:6%;bottom:6%;left:50%!important;right:auto!important;transform:translate(-50%);width:min(92vw,780px);max-width:92vw;border-radius:14px;padding:.9rem .85rem;overflow-x:auto;overflow-y:hidden}.map-base.active .menu-panel-inner{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;min-width:920px;height:100%;overflow:auto;-webkit-overflow-scrolling:touch;padding-bottom:12px}.map-base.active .menu-column h2{font-size:.72rem}.map-base.active .menu-list li,.map-base.active .menu-note{font-size:.66rem}}@media(max-width:700px){.map-wrapper.is-open{overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;-webkit-overflow-scrolling:touch;padding:0 10vw}.map-base.active{width:260vw!important;max-width:none!important;position:relative}.map-base.active .map-side{position:absolute!important;top:0!important;height:100%!important;width:50vw!important;transition:none!important}.map-base.active .side-5{left:0vw!important}.map-base.active .side-3{left:52vw!important}.map-base.active .side-1{left:104vw!important}.map-base.active .side-2{left:156vw!important}.map-base.active .side-4{left:208vw!important}.map-base.active .side-6{left:234vw!important}.map-base.active .menu-panel{left:50%!important;right:auto!important;transform:translate(-50%)!important}}@media(max-width:700px){:root{--vh: 1vh}@supports (height: 100dvh){:root{--vh: 1dvh}}.main-content{margin:0!important;padding:0!important;max-width:100%!important}.page-title,.hint{display:none!important}.map-wrapper{height:calc(100 * var(--vh))!important;width:100vw!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important}.map-base{height:calc(92 * var(--vh))!important;width:auto!important;max-width:96vw!important;transform:none!important}.map-wrapper.is-open{overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;-webkit-overflow-scrolling:touch;padding:0 8vw!important}.map-base.active{height:calc(92 * var(--vh))!important;width:calc((92 * var(--vh)) * (1000 / 600))!important;max-width:none!important;aspect-ratio:auto!important}.map-base.active .menu-panel{left:50%!important;right:auto!important;transform:translate(-50%)!important;width:min(92vw,780px);max-width:92vw}}.menu-column h2{text-align:center;font-weight:700}.menu-list li{align-items:flex-start;text-align:left}.item-left{max-width:none;text-align:left}.item-name{font-weight:800!important;text-align:left}.item-desc{text-align:left}.dots{margin-top:.35rem}.price{text-align:right;min-width:4.5rem}.menu-list li{display:grid;grid-template-columns:1fr auto auto;column-gap:10px}.dots{align-self:center;margin-top:0}.map-base.active{margin-left:320px!important}.footsteps{position:absolute;inset:0;pointer-events:none;z-index:21}.footstep{position:absolute;width:clamp(5px,.8vw,7px);height:clamp(10px,1.6vw,14px);border-radius:80% 80% 70% 70%/130% 130% 25% 25%;background:#615349d9;opacity:0;filter:blur(.1px);transform:translate(-50%,-50%) rotate(var(--rot, 0deg)) scale(1);will-change:opacity,transform}.footstep:before{content:"";position:absolute;width:clamp(4px,.7vw,6px);height:clamp(4px,.7vw,6px);top:110%;left:0;background:#615349d9;border-radius:0 0 100% 100%}.footstep.left{transform:translate(-50%,-50%) rotate(calc(var(--rot, 0deg) + 10deg))}.footstep.right{transform:translate(-50%,-50%) rotate(calc(var(--rot, 0deg) - 10deg))}@keyframes footprintPulse{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--rot,0deg)) scale(.98)}10%{opacity:.95;transform:translate(-50%,-50%) rotate(var(--rot,0deg)) scale(1)}55%{opacity:.95}to{opacity:0}}.map-base.active .footstep{animation:footprintPulse var(--dur, 3.2s) linear infinite;animation-delay:calc(var(--i, 0) * var(--step, .22s))}.map-base.active .footsteps-1 .footstep{--dur: 3.2s;--step: .18s}.map-base.active .footsteps-2 .footstep{--dur: 3.8s;--step: .22s}.map-base.active .scroll-name{opacity:1;transition:opacity .6s ease .8s}.menu-panel{overflow:auto!important}.menu-panel-inner{overflow:auto!important;min-width:0!important}.menu-column{min-width:0}.item-left{max-width:none!important;min-width:0}.item-name,.item-desc{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word}.menu-list li{grid-template-columns:minmax(0,1fr) auto auto}.payment-block{grid-column:1 / -1;margin-top:28px;text-align:center;font-size:14px;line-height:1.6;padding:14px 10px;border-top:1px dashed rgba(0,0,0,.25)}.payment-text strong{font-weight:700}.map-base.active .menu-panel{background:#f8e9c8eb;box-shadow:0 14px 38px #00000073;border:1px solid rgba(80,52,26,.45)}#menuGrid>div{padding:6px 2px;gap:1.4rem!important}.menu-column{background:#ffffff59;border:1px solid rgba(80,52,26,.18);border-radius:14px;padding:14px 14px 10px;box-shadow:0 6px 14px #0000001f;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.menu-column h2{font-size:.95rem;font-weight:800;text-align:left;letter-spacing:.08em;margin:0 0 8px;padding:0 0 8px;border-bottom:2px solid rgba(80,52,26,.28)}.cat-desc{margin:0 0 12px;padding:8px 10px;border-radius:10px;background:#50341a14;border:1px dashed rgba(80,52,26,.25);font-size:.74rem;line-height:1.35;color:#3b2414e6}.menu-list{margin:0;padding:0}.menu-list li{padding:8px 0;margin:0;border-bottom:1px solid rgba(80,52,26,.14)}.menu-list li:last-child{border-bottom:none}.item-name{font-weight:900!important;font-size:.8rem;color:#28180cf2}.item-desc{margin-top:3px;font-size:.7rem;line-height:1.25;color:#3b2414b8}.dots{border-bottom:1px dotted rgba(80,52,26,.35);transform:translateY(-1px)}.price{font-weight:900;padding-left:6px;color:#28180cf2}.menu-panel-inner{gap:1.4rem!important}