.mq{aspect-ratio:450/330;-webkit-mask-composite:source-in;width:100%;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 9% 91%,#0000),linear-gradient(#0000,#000 8% 92%,#0000);mask-image:linear-gradient(90deg,#0000,#000 9% 91%,#0000),linear-gradient(#0000,#000 8% 92%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect;container-type:inline-size}.mq-camera{--u:calc(100cqw / 450);width:0;height:0;perspective:calc(2600 * var(--u));position:absolute;top:50%;left:50%}@property --cam{syntax:"<angle>";inherits:true;initial-value:-45deg}@property --tilt{syntax:"<angle>";inherits:false;initial-value:54deg}@property --zoom{syntax:"<number>";inherits:false;initial-value:1.15}@property --fx{syntax:"<number>";inherits:false;initial-value:0}@property --fy{syntax:"<number>";inherits:false;initial-value:0}@property --fz{syntax:"<number>";inherits:false;initial-value:30}.mq-scene{left:calc(-160 * var(--u));top:calc(-125 * var(--u));width:calc(320 * var(--u));height:calc(250 * var(--u));transform-style:preserve-3d;transform-origin:50% 50% 0;transform:rotateX(var(--tilt)) rotateZ(var(--cam)) scale3d(var(--zoom), var(--zoom), var(--zoom)) translate3d(calc(var(--fx) * var(--u) * -1), calc(var(--fy) * var(--u) * -1), calc(var(--fz) * var(--u) * -1));position:absolute}.mq-group,.mq-box,.mq-floor{left:calc(var(--x) * var(--u));top:calc(var(--y) * var(--u));transform-style:preserve-3d;transform:translateZ(calc(var(--z,0) * var(--u)));position:absolute}.mq-group{width:0;height:0}.mq-box{width:calc(var(--w) * var(--u));height:calc(var(--d) * var(--u));--top:color-mix(in oklab, var(--c), white 20%);--front:var(--c);--side:color-mix(in oklab, var(--c), black 22%)}.mq-face{backface-visibility:hidden;transform-style:preserve-3d;display:block;position:absolute}.mq-top{inset:calc(-.2 * var(--u));border-radius:calc(.5 * var(--u));transform:translateZ(calc(var(--h) * var(--u)));background:var(--top)}.mq-front{width:100%;left:0;top:calc((var(--d) - var(--h)) * var(--u));height:calc(var(--h) * var(--u));transform-origin:bottom;background:linear-gradient(to top, #00000014, transparent 60%), var(--front);transform:rotateX(-90deg)}.mq-back{width:100%;height:calc(var(--h) * var(--u));transform-origin:top;background:var(--side);top:0;left:0;transform:rotateX(90deg)}.mq-left{width:calc(var(--h) * var(--u));transform-origin:0;background:var(--side);height:100%;top:0;left:0;transform:rotateY(-90deg)}.mq-right{top:0;left:calc((var(--w) - var(--h)) * var(--u));width:calc(var(--h) * var(--u));transform-origin:100%;background:var(--side);height:100%;transform:rotateY(90deg)}.mq-cut>.mq-top{background:#33373b}.mq-glass>.mq-face{background:0 0}.mq-glass>.mq-front{backface-visibility:visible;box-shadow:inset 0 0 0 calc(1.6 * var(--u)) #1f1a12;background:linear-gradient(160deg,#aacdd742,#253b461a 70%);overflow:hidden}.mq-glass>.mq-top{background:#1f1a12}.mq-door>.mq-front:after{content:"";width:calc(1.4 * var(--u));background:#1f1a12;position:absolute;top:0;bottom:0;left:50%}.mq-shine{background:linear-gradient(90deg,#0000,#ede6d699,#0000);width:40%;position:absolute;top:-20%;bottom:-20%;left:-60%;transform:skew(-20deg)}.mq-floor{width:calc(var(--w) * var(--u));height:calc(var(--d) * var(--u));pointer-events:none}.mq-shadow{border-radius:calc(6 * var(--u));filter:blur(calc(3 * var(--u)));background:#1f1a1240}.mq-shadow-store{transform:translateZ(calc(12.3 * var(--u)));filter:blur(calc(5 * var(--u)))}.mq-glow{background:radial-gradient(at 50% 40%,#ffd28c73,#ffd28c00 70%)}.mq-billboard{transform-style:preserve-3d;transform:rotateZ(calc(var(--cam) * -1)) rotateX(-90deg);position:absolute;top:0;left:0}.mq-billboard>div{transform-origin:bottom;position:absolute}.mq-front>span{display:block;position:absolute}.mq-sign{left:calc(14 * var(--u));bottom:calc(8 * var(--u));width:calc(132 * var(--u));height:calc(14 * var(--u));border-bottom:calc(.8 * var(--u)) solid #b8915f;place-items:center;display:grid!important}.mq-sign-text{font-family:var(--font-title), Georgia, serif;font-size:calc(8.5 * var(--u));letter-spacing:.12em;color:#f3d9a6;text-shadow:0 0 calc(3 * var(--u)) #b8915f, 0 0 calc(8 * var(--u)) #b8915fb3;white-space:nowrap;font-weight:600;line-height:1}.mq-awning{left:calc(-2 * var(--u));width:calc(170 * var(--u));height:calc(16 * var(--u));transform-origin:top;border-bottom:calc(1.6 * var(--u)) solid #b8915f;background:linear-gradient(#3d4246,#2a2e31);top:100%;transform:rotateX(86deg)}.mq-slats>.mq-front{background:repeating-linear-gradient(90deg, #2c241647 0 calc(.8 * var(--u)), transparent calc(.8 * var(--u)) calc(4.5 * var(--u))), linear-gradient(180deg, #e0c9a4, #cbb089)}.mq-shelves{inset:calc(4 * var(--u));background:repeating-linear-gradient(to bottom, transparent 0 calc(15 * var(--u)), #2c2416 calc(15 * var(--u)) calc(17 * var(--u))), repeating-linear-gradient(90deg, #253b46 0 calc(8 * var(--u)), #ede6d6 calc(8 * var(--u)) calc(14 * var(--u)), #b8915f calc(14 * var(--u)) calc(21 * var(--u)), transparent calc(21 * var(--u)) calc(26 * var(--u)));opacity:.9}.mq-plant{left:calc(-11 * var(--u));bottom:calc(-1 * var(--u));width:calc(22 * var(--u));height:calc(24 * var(--u));background:radial-gradient(circle at 50% 30%, #6b8a72 0, #3e5f55 calc(6 * var(--u)), transparent calc(8 * var(--u))), radial-gradient(circle at 28% 62%, #5c7c66 0, #2f4c4a calc(6 * var(--u)), transparent calc(7.8 * var(--u))), radial-gradient(circle at 72% 62%, #4f6e5f 0, #253b46 calc(6 * var(--u)), transparent calc(7.8 * var(--u)))}.mq-plant-out{left:calc(-9 * var(--u));width:calc(18 * var(--u));height:calc(20 * var(--u))}.mq-brick>.mq-front{background:repeating-linear-gradient(to top, #2c241659 0 calc(.5 * var(--u)), transparent calc(.5 * var(--u)) calc(5 * var(--u))), repeating-linear-gradient(90deg, #2c241640 0 calc(.5 * var(--u)), transparent calc(.5 * var(--u)) calc(10 * var(--u))), linear-gradient(160deg, #a3907a, #8a7763)}.mq-old-door{left:calc(8 * var(--u));right:calc(8 * var(--u));height:calc(56 * var(--u));box-shadow:inset 0 0 0 calc(1.2 * var(--u)) #2c2416;background:linear-gradient(90deg,#5a4f3e,#4a3f30);bottom:0}.mq-tile{box-shadow:inset 0 0 0 calc(.4 * var(--u)) #5a4f3e59;background:#ddc7a3}.mq-plate{left:calc(46 * var(--u));bottom:calc(9 * var(--u));width:calc(160 * var(--u));height:calc(40 * var(--u));place-content:center;column-gap:calc(5 * var(--u));transform:translateZ(calc(.8 * var(--u)));border-radius:calc(1.5 * var(--u));box-shadow:inset 0 0 0 calc(1.6 * var(--u)) #b8915f, inset 0 0 0 calc(2.8 * var(--u)) #f4eee2, inset 0 0 0 calc(3.3 * var(--u)) #b8915f, 0 calc(1.5 * var(--u)) calc(3 * var(--u)) #00000059;white-space:nowrap;background:linear-gradient(#f4eee2,#e6dcc8);grid-template-rows:auto auto;grid-template-columns:auto auto;line-height:1;display:grid!important}.mq-plate-brand{padding-right:calc(5 * var(--u));border-right:calc(.8 * var(--u)) solid #b8915f;font-family:var(--font-title), Georgia, serif;font-size:calc(21 * var(--u));letter-spacing:.04em;color:#253b46;grid-row:1/3;align-self:center;font-weight:700}.mq-plate-name{font-family:var(--font-title), Georgia, serif;font-size:calc(10.5 * var(--u));letter-spacing:.14em;text-transform:uppercase;color:#b8915f;align-self:end;font-weight:700}.mq-plate-note{margin-top:calc(2 * var(--u));font-family:var(--font-body), Arial, sans-serif;font-size:calc(4.6 * var(--u));letter-spacing:.22em;text-transform:uppercase;color:#5a4f3e;align-self:start;font-weight:700}.mq-tapume .mq-front{background:linear-gradient(to bottom, #b8915f 0 calc(3.5 * var(--u)), transparent calc(3.5 * var(--u))), repeating-linear-gradient(90deg, #00000024 0 calc(.6 * var(--u)), transparent calc(.6 * var(--u)) calc(42 * var(--u))), #253b46}.mq-puff{left:calc(-13 * var(--u));width:calc(26 * var(--u));height:calc(26 * var(--u));opacity:0;background:radial-gradient(circle,#ede6d6e6,#ede6d600 68%);border-radius:50%;bottom:0}@media (prefers-reduced-motion:no-preference){.mq:not(.is-playing) *{animation-play-state:paused!important}}.mq-camera{transition:opacity .5s;animation:.6s ease-out both mq-rise}.mq.is-ending .mq-camera{opacity:0}.mq-scene{animation:26s linear both mq-camera}.mq-puff{animation:2s ease-out 1.3s both mq-puff}.mq-puff-1{animation-delay:9.6s}.mq-old{animation:.6s cubic-bezier(.5,0,.8,.6) 3.2s both mq-demolish}.mq-rubble{animation:.6s ease-out 3.4s both mq-pop,.5s ease-in 4.6s forwards mq-vanish}.mq-works-in .mq-face{animation:.6s 4.4s both mq-fade-out}.mq-tile{animation:.45s cubic-bezier(.3,.8,.3,1) 5.1s both mq-lay}.mq-enter,.mq-furniture{animation:.8s cubic-bezier(.3,.8,.3,1) 7.1s both mq-build}.mq-f2{animation-delay:7.5s}.mq-f3{animation-delay:7.9s}.mq-tapume{animation:1s cubic-bezier(.5,0,.7,1) 9.1s both mq-sink}.mq-works .mq-face{animation:.8s 9.1s both mq-fade-out}.mq-shine{animation:1s ease-in-out 11.4s both mq-shine!important}.mq-bench{animation:.6s cubic-bezier(.3,1.3,.5,1) 10.4s both mq-pop}.mq-roof{animation:1s cubic-bezier(.25,.8,.3,1) 13.4s both mq-close}.mq-awning{animation:.9s cubic-bezier(.3,.7,.3,1) 15.2s both mq-unroll}.mq-sign{animation:.6s 15.4s both mq-fade-in}.mq-sign-text{animation:.9s 15.7s both mq-glow}.mq-plant{animation:1s cubic-bezier(.3,1.4,.5,1) 16s both mq-grow}.mq-glow{animation:1.2s 16.2s both mq-fade-in}@keyframes mq-camera{0%{--cam:-34deg;--tilt:62deg;--zoom:1.75;--fx:0;--fy:72;--fz:26}9.23%{--cam:-34deg;--tilt:62deg;--zoom:1.75;--fx:0;--fy:72;--fz:26}11.54%{--cam:-40deg;--tilt:30deg;--zoom:1.6;--fx:20;--fy:-27;--fz:20}17.69%{--cam:-40deg;--tilt:30deg;--zoom:1.6;--fx:20;--fy:-27;--fz:20}19.62%{--cam:-44deg;--tilt:26deg;--zoom:1.45;--fx:0;--fy:-20;--fz:5}25.38%{--cam:-44deg;--tilt:26deg;--zoom:1.45;--fx:0;--fy:-20;--fz:5}27.31%{--cam:-50deg;--tilt:34deg;--zoom:1.55;--fx:0;--fy:-45;--fz:25}32.69%{--cam:-50deg;--tilt:34deg;--zoom:1.55;--fx:0;--fy:-45;--fz:25}35%{--cam:-28deg;--tilt:62deg;--zoom:1.75;--fx:-15;--fy:57;--fz:38}44.23%{--cam:-28deg;--tilt:62deg;--zoom:1.75;--fx:-15;--fy:57;--fz:38}46.15%{--cam:-62deg;--tilt:58deg;--zoom:1.55;--fx:-112;--fy:-17;--fz:58}50%{--cam:-62deg;--tilt:58deg;--zoom:1.55;--fx:-112;--fy:-17;--fz:58}52.31%{--cam:-45deg;--tilt:50deg;--zoom:1.25;--fx:0;--fy:-20;--fz:55}56.15%{--cam:-45deg;--tilt:50deg;--zoom:1.25;--fx:0;--fy:-20;--fz:55}58.08%{--cam:-32deg;--tilt:60deg;--zoom:1.7;--fx:5;--fy:61;--fz:75}65.38%{--cam:-30deg;--tilt:60deg;--zoom:1.7;--fx:5;--fy:61;--fz:75}76.92%{--cam:-14deg;--tilt:56deg;--zoom:1.35;--fx:0;--fy:-5;--fz:45}89.23%{--cam:-72deg;--tilt:54deg;--zoom:1.35;--fx:0;--fy:-15;--fz:45}to{--cam:-34deg;--tilt:62deg;--zoom:1.75;--fx:0;--fy:72;--fz:26}}@keyframes mq-demolish{99%{visibility:visible}to{visibility:hidden;transform:translateZ(calc(var(--z) * var(--u))) scaleZ(.001)}}@keyframes mq-pop{0%{transform:translateZ(calc(var(--z) * var(--u))) scale(0)}}@keyframes mq-vanish{to{visibility:hidden;transform:translateZ(calc(var(--z) * var(--u))) scale(0)}}@keyframes mq-lay{0%{opacity:0;transform:translateZ(calc((var(--z) + 10) * var(--u)))}}@keyframes mq-close{0%{visibility:hidden;transform:translateZ(calc((var(--z) + 80) * var(--u)))}1%{visibility:visible}}@keyframes mq-rise{0%{opacity:0;transform:translateY(calc(20 * var(--u)))}}@keyframes mq-puff{0%{opacity:0;transform:translateY(0)scale(.5)}30%{opacity:.8}to{opacity:0;transform:translateY(calc(-34 * var(--u))) scale(1.6)}}@keyframes mq-sink{99%{visibility:visible}to{visibility:hidden;transform:translateZ(calc(-58 * var(--u)))}}@keyframes mq-fade-out{to{opacity:0}}@keyframes mq-fade-in{0%{opacity:0}}@keyframes mq-shine{0%{left:-60%}to{left:130%}}@keyframes mq-build{0%{visibility:hidden;transform:translateZ(calc(var(--z) * var(--u))) scaleZ(.001)}1%{visibility:visible}}@keyframes mq-unroll{0%{transform:rotateX(86deg)scaleY(0)}}@keyframes mq-glow{0%{color:#7d6a4c;text-shadow:none}}@keyframes mq-grow{0%{transform:scale(0)}}@media (prefers-reduced-motion:reduce){.mq-scene{--cam:-38deg;--tilt:56deg;--zoom:1.3;--fx:0;--fy:-10;--fz:45;animation:none!important}.mq *{animation-duration:1ms!important;animation-play-state:running!important;animation-delay:0s!important}}
