@font-face{font-family:'DDZ Native Handwriting';src:url('assets/fonts/ddz-native-headings.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'DDZ Rounded TC';src:url('assets/fonts/ddz-rounded-tc.woff2?v=2') format('woff2');font-style:normal;font-weight:400;font-display:swap;unicode-range:U+2E80-9FFF,U+FF00-FFEF}
:root{--paper:#f4eddc;--red:#852e2c;--green:#354e40;--ink:#373b30;--line:#b4aa96;--yellow:#ddba56}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DDZ Rounded TC','PingFang TC','Noto Sans TC',sans-serif}body:after{content:'';position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.075;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='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.8' filter='url(%23n)'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #d49d2d;outline-offset:5px}header{height:92px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:var(--paper);position:relative;z-index:5}.brand{display:flex;gap:9px;align-items:center;font-family:'DDZ Rounded TC',serif;font-size:27px;font-weight:900;color:var(--red)}.brand img{width:48px;height:48px;border-radius:50%}.brand small{display:block;font:9px 'DDZ Rounded TC',sans-serif;letter-spacing:2px;margin-top:3px}nav{display:flex;gap:35px;font-size:13px}nav a:hover{color:var(--red)}.hero{min-height:760px;position:relative;overflow:hidden;padding:30px 7% 0}.eyebrow{font:10px 'DDZ Rounded TC','Courier New',monospace;letter-spacing:2px}.hero-copy{position:relative;z-index:2;margin-top:60px}.tiny{font-size:13px;letter-spacing:3px}h1,h2,h3,p,figure{margin:0}h1{font-family:'DDZ Rounded TC','Songti TC','Noto Serif TC',serif;font-size:clamp(48px,6.4vw,90px);line-height:1.15;letter-spacing:-3px;color:var(--red);font-weight:900;margin:24px 0}h1 span{color:var(--green)}h1 em{font-style:normal;position:relative}h1 em:after{content:'';position:absolute;left:0;bottom:-5px;width:100%;height:7px;background:var(--yellow);transform:rotate(-2deg);z-index:-1}.sub{font-size:13px;line-height:2;color:#666650;margin-bottom:28px}.pill{display:inline-flex;gap:45px;align-items:center;background:var(--red);color:var(--paper);border:1px solid var(--red);padding:15px 25px;border-radius:40px;font-size:13px;transition:.25s}.pill:hover{transform:translateY(-3px);background:var(--green)}.collage{position:absolute;width:50%;right:3%;top:70px;height:580px}.photo{background:#fffaf0;padding:13px 13px 38px;box-shadow:4px 12px 23px #3d2d272b;position:relative}.photo img{width:100%;display:block;aspect-ratio:1/1;object-fit:cover}.photo figcaption{font-family:'DDZ Rounded TC','Songti TC',serif;text-align:center;font-size:12px;margin-top:14px}.shop{position:absolute;width:60%;right:3%;top:0;transform:rotate(8deg);animation:float 7s ease-in-out infinite}.memory{position:absolute;width:48%;left:0;top:228px;transform:rotate(-12deg);animation:float2 8s ease-in-out infinite}.shop:before,.story-art .photo:before{content:'';position:absolute;width:95px;height:27px;background:#d9c593a8;top:-12px;left:35%;transform:rotate(-7deg)}.stamp{position:absolute;right:2%;top:400px;border:2px solid var(--red);border-radius:50%;width:130px;height:130px;text-align:center;padding-top:22px;color:var(--red);font:10px 'DDZ Rounded TC',monospace;transform:rotate(14deg);outline:1px solid var(--red);outline-offset:5px}.stamp b{font-size:30px;line-height:1.5}.handnote{position:absolute;left:0;top:65px;transform:rotate(-10deg);font:18px/1.7 'DDZ Rounded TC','Songti TC',serif;color:var(--red)}.heart{position:absolute;font-size:70px;left:45%;top:115px;transform:rotate(15deg);color:var(--red)}.hero-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:60px;border-top:1px solid var(--line);height:65px;font-size:10px;letter-spacing:1px}.textbtn{background:none;border:0;font-size:11px;color:var(--red)}.ticker{background:var(--red);color:var(--paper);padding:16px 0;overflow:hidden;font:17px 'DDZ Rounded TC','Songti TC',serif;letter-spacing:4px}.ticker div{white-space:nowrap;width:max-content;animation:marquee 32s linear infinite}.section{padding:110px 8%}.story{display:grid;grid-template-columns:1fr 1fr;gap:12%;align-items:center}.story-art{position:relative}.story-art .photo{width:86%;transform:rotate(-6deg)}.round-note{position:absolute;bottom:-25px;right:0;width:110px;height:110px;background:var(--yellow);border-radius:50%;display:grid;place-content:center;text-align:center;line-height:1.7;transform:rotate(12deg)}h2{font:700 clamp(32px,4vw,57px)/1.35 'DDZ Rounded TC','Songti TC',serif;color:var(--red);margin:23px 0 30px;letter-spacing:1px}.story-copy p,.event-copy p{font-size:14px;line-height:2.15;margin-bottom:18px}.story-steps{border-top:1px solid var(--line);padding-top:24px;display:flex;gap:22px;font-size:10px;margin-top:30px}.menus{border-top:1px solid var(--line);background:#eae2cf}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.section-head p{font-size:12px;line-height:1.9}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.menu-card{padding:30px 36px 26px;color:var(--paper);overflow:hidden}.red{background:var(--red)}.green{background:var(--green)}.menu-no{font:10px 'DDZ Rounded TC',monospace;letter-spacing:2px;opacity:.75}.menu-visual{height:330px;display:grid;place-items:center}.menu-visual .photo{width:65%;transform:rotate(-7deg);padding:10px 10px 25px;color:var(--ink)}.menu-visual .photo figcaption{margin-top:8px;font-style:italic}.menu-card h3{font:32px 'DDZ Rounded TC',Georgia,'Songti TC',serif;margin:15px 0}.menu-card p{font-size:13px;line-height:1.9;opacity:.85}.menu-open{background:none;color:inherit;border:0;border-top:1px solid #f4eddc70;display:flex;justify-content:space-between;width:100%;margin-top:25px;padding:19px 0 0;text-align:left;font-size:13px}.menu-open span{font-size:22px}.strip{width:48%;background:#faf1d9;padding:10px 10px 16px;transform:rotate(8deg);color:var(--red);box-shadow:5px 10px 20px #0003}.strip img{width:100%;display:block}.strip span{font:8px 'DDZ Rounded TC',monospace;letter-spacing:2px;display:block;text-align:center;margin-top:12px}.booth{position:relative}.booth-note{position:absolute;left:2%;top:95px;font:22px/1.5 'DDZ Rounded TC','Songti TC',serif;transform:rotate(-12deg);color:#e7c775}.draft-note{font-size:10px;color:#726d60;margin-top:25px}.events{background:var(--green);color:var(--paper);display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.events h2{color:var(--paper)}.envelope{position:relative;transform:rotate(5deg)}.envelope img{width:100%;border:12px solid #f4eddc;box-shadow:10px 15px 15px #0002}.event-note{display:block;background:var(--yellow);color:var(--red);width:fit-content;padding:12px 20px;position:absolute;bottom:-15px;right:-15px;transform:rotate(-10deg);font:italic 17px 'DDZ Rounded TC',Georgia,serif}.tags{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0}.tags span{border:1px solid #e8dec580;padding:7px 12px;font-size:11px;border-radius:20px}.light{background:var(--paper);color:var(--green);border:0}.light:hover{background:var(--yellow)}.visit{text-align:center}.visit h2{font-size:clamp(45px,5vw,70px)}.visit-info{display:grid;grid-template-columns:1fr 1fr;gap:70px;max-width:800px;margin:55px auto 0;text-align:left}.visit-info h3{font:23px 'DDZ Rounded TC','Songti TC',serif;margin-bottom:18px}.visit-info p{font-size:13px;line-height:2}.muted{color:#787567;font-size:11px!important;margin-top:14px}.visit-links{display:grid;gap:15px}.visit-links a{border-bottom:1px solid var(--line);padding:10px 0;font-size:13px}.visit-links a:hover{color:var(--red)}footer{background:var(--red);color:var(--paper);padding:50px 8%;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}.footer-brand{font:50px 'DDZ Rounded TC','Songti TC',serif}footer p{font-size:14px}footer small,footer a{font-size:10px;opacity:.8}dialog{max-width:520px;width:calc(100% - 36px);border:1px solid var(--red);padding:45px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#17271fe0;backdrop-filter:blur(5px)}dialog h2{font-size:32px}dialog p{font-size:14px;line-height:1.9;margin-bottom:20px}.close{position:absolute;right:16px;top:10px;background:none;border:0;font-size:30px;color:var(--red)}.intro{position:fixed;inset:0;z-index:100;background:var(--green);color:var(--paper);display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .8s,visibility .8s;overflow:hidden}.intro.done{opacity:0;visibility:hidden;pointer-events:none}.intro-label{position:absolute;top:9%;font:10px 'DDZ Rounded TC',monospace;letter-spacing:4px}.intro-camera{width:260px;height:170px;border-radius:18px;background:#d6c9ad;border:9px solid #9b8d72;position:relative;transform:translateY(-70px);box-shadow:10px 12px 0 #0002;animation:camera-in 1s both}.camera-top{background:var(--red);height:43px;color:var(--paper);font:14px 'DDZ Rounded TC',Georgia;padding:10px}.lens{width:75px;height:75px;border-radius:50%;background:#21312c;position:absolute;left:83px;top:54px;border:10px solid #52564b;box-shadow:0 0 0 4px #c3bda8}.lens:after{content:'';position:absolute;width:13px;height:13px;border-radius:50%;background:#eee8d1;top:8px;left:8px}.slot{position:absolute;bottom:4px;left:15px;right:15px;height:9px;background:#262e27}.print{position:absolute;width:190px;left:26px;top:150px;background:var(--paper);padding:9px 9px 22px;transform-origin:top;animation:print 2.5s .8s both;box-shadow:4px 12px 20px #0003}.print > img{width:100%;height:150px;object-fit:cover;animation:develop 2s 1.7s both}.print > span{display:block;color:var(--red);font-size:10px;text-align:center;margin-top:9px}.intro-caption{position:absolute;bottom:15%;font:20px 'DDZ Rounded TC','Songti TC',serif;animation:appear 1s 2s both}#skip{position:absolute;right:6%;bottom:7%;background:none;color:inherit;border:0;border-bottom:1px solid #fff7;padding:8px;font-size:11px}.reveal{opacity:1;transform:none}.js-ready .reveal{opacity:0;transform:translateY(25px);transition:opacity .8s,transform .8s}.js-ready .reveal.seen{opacity:1;transform:translateY(0)}@keyframes print{from{clip-path:inset(0 0 100% 0);transform:translateY(-160px)}to{clip-path:inset(0);transform:translateY(0)}}@keyframes develop{from{filter:brightness(1.8) saturate(0);opacity:.1}to{filter:none;opacity:1}}@keyframes camera-in{from{opacity:0;transform:translateY(0) scale(.7)}to{opacity:1;transform:translateY(-70px) scale(1)}}@keyframes appear{from{opacity:0}to{opacity:1}}@keyframes float{50%{transform:translateY(-10px) rotate(6deg)}}@keyframes float2{50%{transform:translateY(10px) rotate(-9deg)}}@keyframes marquee{to{transform:translateX(-45%)}}@media(max-width:700px){header{height:76px;padding:0 5%}.brand{font-size:22px}.brand img{width:38px;height:38px}nav{gap:15px;font-size:11px}nav a:first-child{display:none}.hero{min-height:940px;padding:25px 7% 0}.hero .eyebrow{font-size:8px;letter-spacing:1px}.hero-copy{margin-top:35px}h1{font-size:54px}.sub{font-size:12px}.hero .pill{padding:12px 23px}.collage{top:480px;right:5%;width:87%;height:390px}.shop{width:55%;right:4%;top:0}.memory{width:45%;top:100px;left:3%}.handnote{top:0;font-size:14px}.stamp{width:90px;height:90px;top:240px;right:5%;padding-top:12px;font-size:7px}.stamp b{font-size:23px}.heart{top:190px;left:auto;right:10%;font-size:50px}.hero-bottom{position:absolute;bottom:0;left:7%;right:7%;margin:0;height:55px}.hero-bottom>span:first-child{display:none}.hero-bottom>span{font-size:8px}.section{padding:75px 7%}.story{grid-template-columns:1fr;gap:65px}.story-art{padding:0 10%}.story-art .photo{width:100%}.round-note{right:4%;width:90px;height:90px;font-size:13px}.story-copy h2{font-size:42px}.section-head{display:block}.section-head h2{font-size:34px}.section-head p{margin:10px 0 30px}.menu-grid{grid-template-columns:1fr}.menu-card{padding:25px}.menu-visual{height:300px}.menu-card h3{font-size:30px}.events{grid-template-columns:1fr;gap:50px}.envelope{margin:10px}.visit-info{grid-template-columns:1fr;gap:30px}.visit h2{font-size:48px}footer{grid-template-columns:1fr}.footer-brand{font-size:40px}.intro-caption{font-size:17px}.intro-label{font-size:8px}dialog{padding:38px 24px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.intro{display:none}.js-ready .reveal{opacity:1;transform:none}}

/* The developed print flies towards the viewer, then passes the lens. */
body.intro-playing,body.intro-transition{overflow:hidden}
body.intro-playing header,body.intro-playing .hero .eyebrow,body.intro-playing .hero-copy,body.intro-playing .memory,body.intro-playing .stamp,body.intro-playing .handnote,body.intro-playing .heart,body.intro-playing .hero-bottom{opacity:0}
.intro.behind-photo{opacity:0;visibility:hidden;transition:none;pointer-events:none}
.print.intro-traveller{position:fixed;z-index:101;margin:0;animation:none;clip-path:none;transform-origin:center;pointer-events:none;will-change:transform;backface-visibility:hidden}
.print.intro-traveller > img{animation:none;filter:none;opacity:1;height:auto;aspect-ratio:172/150}
@media(prefers-reduced-motion:reduce){body.intro-playing{overflow:auto}body.intro-playing header,body.intro-playing .hero .eyebrow,body.intro-playing .hero-copy,body.intro-playing .memory,body.intro-playing .stamp,body.intro-playing .handnote,body.intro-playing .heart,body.intro-playing .hero-bottom{opacity:1}}

html:has(body.intro-playing),html:has(body.intro-transition){overflow:hidden}
.intro.done{transition:none}

/* Photographic camera, with a masked paper path aligned to its exit mouth. */
.intro{background:radial-gradient(ellipse at 50% 37%,#465b4c 0%,#263b30 48%,#13251e 100%)}
.intro-label{color:#dfd0af;opacity:.8;letter-spacing:5px}
.intro-camera{width:min(400px,84vw);height:auto;aspect-ratio:1374/1145;border:0;border-radius:0;background:none;box-shadow:none;isolation:isolate;transform:translateY(-100px);animation:camera-product-in .8s cubic-bezier(.16,1,.3,1) both}
.camera-product{position:relative;z-index:2;display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 24px 28px #0007);pointer-events:none;user-select:none}
.intro-camera .print{z-index:1;left:20px;top:0;border-radius:1px;background:#f8f3e9;box-shadow:0 14px 24px #0005}
.intro-caption{bottom:11%;letter-spacing:2px;color:#ede2ca;text-shadow:0 2px 16px #0004}
@keyframes camera-product-in{from{opacity:0;transform:translateY(-80px) scale(.94)}to{opacity:1;transform:translateY(-100px) scale(1)}}
@media(max-width:700px){.intro-label{letter-spacing:3px}.intro-caption{bottom:12%;font-size:15px;letter-spacing:1px}}
@media(max-height:580px) and (min-width:701px){.intro-camera{width:min(340px,60vw)}.intro-caption{bottom:7%;font-size:16px}.intro-label{top:5%}}

/* A restrained lift and backwards tilt accompanies the motor-driven ejection. */
.camera-rig{position:relative;width:100%;height:100%;transform-origin:50% 72%;animation:camera-eject-lift 3.2s .8s cubic-bezier(.4,0,.2,1) both}
@keyframes camera-eject-lift{
  0%{transform:perspective(1100px) translateY(0) rotateX(0deg) scale(1)}
  22%{transform:perspective(1100px) translateY(-9px) rotateX(5deg) scale(1.012)}
  68%{transform:perspective(1100px) translateY(-7px) rotateX(4deg) scale(1.008)}
  100%{transform:perspective(1100px) translateY(0) rotateX(0deg) scale(1)}
}
.print{border:1px solid #e1dacb;background:linear-gradient(118deg,#fffdf6,#f0e9da);box-shadow:0 1px 0 #d1c8b7,0 3px 0 #ebe3d3,2px 5px 0 #c9bfac,0 14px 26px #0005}
.intro-camera .print{background:linear-gradient(118deg,#fffdf6,#f0e9da);box-shadow:0 1px 0 #d1c8b7,0 3px 0 #ebe3d3,2px 5px 0 #c9bfac,0 14px 26px #0005}
.print > img{display:block;height:auto;aspect-ratio:172/150;box-shadow:inset 0 0 0 1px #0002}
.print:after{content:'';position:absolute;inset:9px 9px 48px;pointer-events:none;background:linear-gradient(125deg,#fff2,transparent 42%,#fff1 70%,transparent);border:1px solid #0001}
.print > span{font-family:'DDZ Rounded TC','Songti TC',serif;letter-spacing:.8px;color:#754133}

/* The camera mouth is the clipping boundary: concealed paper moves through it. */
.print-path{position:absolute;z-index:3;top:86.5%;left:calc(50% - 115px);width:230px;height:245px;overflow:hidden;pointer-events:none}
.print-path:after{content:'';position:absolute;z-index:2;top:0;left:20px;width:190px;height:6px;background:linear-gradient(#0007,transparent);pointer-events:none}
@keyframes print{from{clip-path:none;transform:translateY(-130%)}to{clip-path:none;transform:translateY(0)}}

/* Replays also start opaque, with no flash of the page behind the camera. */
.intro{transition:none}

/* Responsive page rhythm: every content block owns its space. */
header{padding-inline:6%;gap:28px;min-height:92px;height:auto}
.brand{flex-shrink:0}nav{gap:26px;align-items:center}nav a{display:inline-flex;min-height:44px;align-items:center;white-space:nowrap}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px 64px;min-height:0;max-width:1480px;margin-inline:auto;padding:36px 6% 0;overflow:visible}
.hero>.eyebrow,.hero-bottom{grid-column:1/-1}
.hero>.heart{display:none}
.hero-copy{grid-column:1;grid-row:2;align-self:center;margin:0;padding:20px 0 30px;min-width:0}
h1{font-size:clamp(44px,5.3vw,76px);line-height:1.25;letter-spacing:-2px;margin:24px 0 30px}
.sub{font-size:14px;line-height:2.1;margin-bottom:30px}
.collage{position:relative;grid-column:2;grid-row:2;inset:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;width:100%;height:auto;padding:24px 10px;align-items:center;min-width:0}
.collage .photo{position:relative;inset:auto;width:100%;padding:10px 10px 24px;animation:none}
.shop{grid-column:2;grid-row:1;transform:rotate(4deg);align-self:start}
.memory{grid-column:1;grid-row:1;transform:rotate(-4deg);margin-top:108px;align-self:start}
.photo figcaption{line-height:1.6;font-size:12px;overflow-wrap:anywhere}
.handnote{position:relative;inset:auto;grid-column:1;grid-row:2;transform:rotate(-4deg);font-size:16px;line-height:1.8}
.stamp{position:relative;inset:auto;grid-column:2;grid-row:2;justify-self:center;width:98px;height:98px;padding-top:14px;font-size:8px;transform:rotate(8deg)}
.stamp b{font-size:25px}
.hero-bottom{position:relative;inset:auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;height:auto;min-height:76px;margin:0;padding:20px 0;line-height:1.7}
.textbtn{min-height:44px;padding:10px 0}
.section{padding:100px max(6%,calc((100vw - 1280px)/2));}
.story{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px}
.story-art{display:flex;flex-direction:column;gap:28px;padding:10px 16px;min-width:0}
.story-art .photo{width:100%;max-width:420px;align-self:center;transform:rotate(-3deg)}
.round-note{position:relative;inset:auto;align-self:flex-end;margin:0 5% 0 0;width:96px;height:96px;font-size:13px;flex-shrink:0}
.story-copy,.event-copy{min-width:0}
.story-copy p,.event-copy p{font-size:15px;line-height:2.1}
h2{font-size:clamp(32px,3.8vw,54px)}
.story-steps{flex-wrap:wrap;gap:12px 20px;font-size:11px;line-height:1.8}
.section-head{gap:28px;align-items:flex-end;margin-bottom:36px}
.section-head h2{margin-bottom:0}.section-head>p{flex-shrink:0;font-size:13px}
.menu-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.menu-card{display:flex;flex-direction:column;padding:32px;min-width:0}
.menu-visual{height:auto;min-height:320px;padding:24px 8px;flex-shrink:0}
.menu-visual .photo{width:min(76%,260px);transform:rotate(-4deg)}
.menu-card h3{font-size:clamp(26px,2.6vw,34px);line-height:1.4;margin:18px 0 14px}
.menu-card p{font-size:14px;line-height:1.9;margin-bottom:24px}
.menu-open{margin-top:auto;min-height:58px;align-items:center;padding-top:16px}
.booth{display:flex;justify-content:center;align-items:center;gap:24px}
.strip{width:142px;max-width:52%;flex-shrink:0;transform:rotate(4deg)}
.strip img{height:230px;object-fit:contain}
.booth-note{position:relative;inset:auto;font-size:18px;line-height:1.6;transform:rotate(-5deg)}
.draft-note{line-height:1.8;margin-top:24px}
.events{grid-template-columns:repeat(2,minmax(0,1fr));gap:80px}
.envelope{margin:10px 12px;min-width:0;transform:rotate(-2deg)}
.envelope img{display:block}
.event-note{position:relative;inset:auto;margin:22px 0 0 auto;transform:rotate(2deg);font-size:16px;line-height:1.5}
.visit-info{gap:60px;margin-top:44px}.visit-info p{font-size:14px}
.visit-links a{min-height:48px;line-height:1.7}
footer{padding:48px 6%;gap:24px 40px}footer p{line-height:1.8}
@media(max-width:1000px){
  .hero{gap:28px 40px}.hero-copy h1{font-size:clamp(40px,5.1vw,54px)}
  .collage{gap:24px 18px;padding-inline:4px}.memory{margin-top:72px}.handnote{font-size:14px}
  .story,.events{gap:48px}.menu-card{padding:26px}.booth{gap:16px}.booth-note{font-size:16px}
}
@media(max-width:760px){
  header{flex-wrap:wrap;justify-content:center;gap:4px 24px;padding:18px 6% 10px;min-height:0}
  .brand{font-size:25px}.brand img{width:42px;height:42px}
  nav{width:100%;justify-content:center;gap:clamp(14px,4vw,30px);font-size:12px}nav a:first-child{display:inline-flex}
  .hero{grid-template-columns:minmax(0,1fr);gap:24px;padding:28px 7% 0}
  .hero>.eyebrow{font-size:9px;line-height:1.8;letter-spacing:1px}
  .hero-copy{grid-column:1;grid-row:auto;padding:8px 0 0}
  .hero-copy h1{font-size:clamp(40px,10.8vw,62px);letter-spacing:-1.5px;line-height:1.24}
  .tiny{font-size:12px;letter-spacing:2px}.sub{font-size:13px}
  .hero .pill{padding:14px 24px;font-size:13px}
  .collage{grid-column:1;grid-row:auto;width:100%;max-width:520px;justify-self:center;padding:30px 8px 18px;gap:24px 20px}
  .memory{margin-top:52px}.handnote{font-size:14px}.stamp{width:84px;height:84px;font-size:7px;padding-top:10px}.stamp b{font-size:22px}
  .hero-bottom{grid-column:1;justify-content:space-between;padding:16px 0;min-height:70px;gap:8px 16px}
  .hero-bottom>span:first-child{display:none}.hero-bottom>span{font-size:8px}
  .section{padding:72px 7%}
  .story,.events{grid-template-columns:minmax(0,1fr);gap:44px}
  .story-art{padding:10px 12px;gap:24px}.story-art .photo{max-width:380px}
  .round-note{width:84px;height:84px;margin-right:0;font-size:12px}
  .story-copy h2{font-size:40px}.story-copy p,.event-copy p{font-size:14px}
  .section-head{display:block;margin-bottom:32px}.section-head h2{font-size:34px;line-height:1.4}.section-head>p{margin:20px 0 0}
  .menu-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .menu-card{padding:28px}.menu-visual{min-height:300px;padding-inline:4px}
  .menu-card h3{font-size:30px}.booth{gap:28px}.booth-note{font-size:18px}
  .envelope{margin:4px 8px}.event-note{font-size:14px;padding:10px 14px}
  .visit h2{font-size:46px}.visit-info{grid-template-columns:minmax(0,1fr);gap:32px;margin-top:36px}
  footer{grid-template-columns:minmax(0,1fr);padding:40px 7%;gap:20px}.footer-brand{font-size:40px}
  dialog{padding:40px 24px}dialog h2{font-size:28px}
}
@media(max-width:360px){
  nav{gap:12px;font-size:11px}.hero-copy h1{font-size:36px}
  .collage{gap:20px 16px;padding-inline:4px}.collage .photo{padding:7px 7px 18px}.collage .photo figcaption{font-size:10px}
  .handnote{font-size:12px}.menu-card{padding:22px}.menu-card h3{font-size:26px}.booth{gap:16px}.booth-note{font-size:16px}.strip{width:124px}
  .section-head h2{font-size:29px}.visit h2{font-size:40px}
}

/* A quiet memory card unfolds into the live homepage. */
.print.memory-card{width:190px;height:250px;padding:0;border:0;border-radius:2px;background:var(--paper);overflow:hidden;box-shadow:0 2px 1px #b7ac94,0 14px 26px #0005}
.print.memory-card:after{display:none}
.card-brand{position:absolute;top:11px;left:14px;right:14px;display:flex;align-items:center;justify-content:space-between;color:var(--red);font:10px 'DDZ Rounded TC',Georgia,serif;letter-spacing:.3px}
.card-brand span{font:6px 'DDZ Rounded TC',sans-serif;letter-spacing:.5px}
.card-photo{position:absolute;left:36px;top:34px;width:118px;height:174px;margin:0;padding:0;background:transparent;transform:rotate(-2deg);transform-origin:center;box-shadow:none}
.card-photo img{width:100%;height:auto;aspect-ratio:auto;object-fit:cover;object-position:center;animation:develop 1.6s 1.3s both}
.card-photo figcaption{font:7px/1.6 'DDZ Rounded TC','Songti TC',serif;margin-top:6px;text-align:center}
.card-tagline{position:absolute;left:14px;right:14px;bottom:15px;margin:0;color:var(--red);font:700 16px/1.4 'DDZ Rounded TC','Songti TC',serif;text-align:center;letter-spacing:.5px}
.memory-card .card-heading{position:absolute;z-index:2;padding:0;pointer-events:none}
.intro-traveller .card-photo img{animation:none;filter:none;opacity:1}
.intro-camera .memory-card{left:20px;top:0;background:var(--paper)}

/* All display headings use native LXGW WenKai TC Bold glyphs. */
html body :is(h1,h2,h3,.brand>span,.footer-brand,.intro-caption,.card-tagline){font-family:'DDZ Native Handwriting',serif;font-weight:700;font-synthesis:none}

/* Official wordmark: clip transparent canvas padding without changing the supplied artwork. */
.brand .brand-lockup{display:flex;flex-direction:column;align-items:center;gap:6px;line-height:1}
.brand .brand-wordmark{display:block;position:relative;overflow:hidden;width:96px;aspect-ratio:554 / 190}
.brand .brand-lockup .brand-wordmark img{position:absolute;display:block;left:-58.30325%;top:-266.84211%;width:216.6065%;height:auto;max-width:none;border-radius:0}
.brand .brand-lockup small{margin:0;font-size:8px;letter-spacing:1.8px;line-height:1.2}
@media(max-width:600px){.brand .brand-wordmark{width:88px}.brand .brand-lockup{gap:5px}.brand .brand-lockup small{font-size:7px;letter-spacing:1.6px}}

/* Homepage tagline: one native handwriting face, including 氹 and punctuation. */
html body .hero h1.hero-tagline{font-family:'DDZ Native Handwriting',serif;font-weight:700;font-synthesis:none}

/* The printed card and its travelling headline keep the same handwriting face. */
html body :is(.card-brand,.card-brand span,.card-photo figcaption,.card-heading){font-family:'DDZ Native Handwriting',serif;font-weight:700;font-synthesis:none}

/* Canva Sweet Heart title artwork preserves the exact exported stroke shapes. */
.sweet-art{font-style:normal;letter-spacing:0}
.sweet-art svg{display:inline-block;height:1.2em;overflow:visible;vertical-align:-.24em;fill:currentColor;max-width:none}
.sweet-readable{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

html body h1 :is(.sweet-art,.sweet-readable){color:inherit}

/* Keep both supplied hero photographs in their full portrait composition. */
.hero .collage .photo img{aspect-ratio:auto;height:auto;object-position:center}

/* Three menu entrances share one comfortable rhythm. */
.menu-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.menu-card{padding:28px 24px}.menu-card h3{font-size:clamp(23px,2vw,29px)}
.menu-visual{min-height:280px}.menu-visual.booth{gap:12px}.menu-visual.booth .strip{width:124px}.menu-visual .booth-note{font-size:16px}
.menu-card.cafe{background:var(--yellow);color:var(--red)}.cafe .menu-open{border-color:#852e2c60}
.cafe-visual{display:flex;justify-content:center;align-items:center;gap:5px}
.cafe-visual img{width:48%;height:auto;max-height:230px;object-fit:contain;box-shadow:3px 6px 12px #3d2d272b;transform:rotate(-7deg)}
.cafe-visual img+img{transform:rotate(7deg);margin-top:35px}
@media(min-width:761px) and (max-width:1100px){.menu-grid{grid-template-columns:1fr}.menu-card{display:grid;grid-template-columns:42% 1fr;column-gap:30px}.menu-no{grid-column:1/-1}.menu-visual{grid-row:2/5}.menu-card h3{align-self:end;font-size:30px}.menu-card p{margin-bottom:15px}.menu-open{margin-top:0}}
@media(max-width:760px){.menu-grid{grid-template-columns:1fr}.menu-card{padding:28px}.menu-card h3{font-size:28px}.menu-visual{min-height:300px}.cafe-visual img{max-height:255px}}
@media(max-width:360px){.menu-card{padding:22px}.menu-card h3{font-size:25px}}

@media(min-width:1101px){.menu-grid .menu-visual{height:320px;min-height:320px}.menu-grid .menu-visual .photo{max-width:230px}.menu-grid .menu-visual .strip{max-width:124px}}

/* Keep the opening slogan below the fully ejected paper, with footer breathing room. */
.intro-caption{bottom:max(24px,3.5svh);left:6%;right:6%;text-align:center;line-height:1.5}
@media(max-height:680px){
  .intro-camera{--intro-camera-y:-140px;transform:translateY(var(--intro-camera-y))}
  @keyframes camera-product-in{from{opacity:0;transform:translateY(calc(var(--intro-camera-y) + 20px)) scale(.94)}to{opacity:1;transform:translateY(var(--intro-camera-y)) scale(1)}}
}
@media(max-height:520px){.intro-camera{--intro-camera-y:-185px}.intro-caption{bottom:18px}}

/* Unannounced Photo Booth: graphic placeholders, without unconfirmed products. */
.booth-preview-strip{width:124px;padding:10px 10px 14px;background:#faf1d9;color:var(--green);display:grid;gap:8px;box-shadow:5px 10px 20px #0003;transform:rotate(7deg);flex-shrink:0}
.booth-preview-strip i{display:grid;place-items:center;aspect-ratio:1.65;background:#d6d9c9;font-style:normal;color:#738675;font-size:22px;border:1px solid #354e4015}
.strip-kicker,.strip-signature{font-size:7px;letter-spacing:1px;text-align:center;line-height:1.6}.strip-signature{margin-top:3px}.booth-pending{display:flex;justify-content:center;gap:28px}.booth-pending .booth-note{position:static;color:var(--yellow);font-size:18px;line-height:1.7;transform:rotate(-8deg)}

/* UI arrows are vector artwork, so mobile systems cannot substitute emoji glyphs. */
svg.ui-arrow{display:inline-block;width:1em;height:1em;flex-shrink:0;overflow:visible;vertical-align:-.13em;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
svg.ui-arrow-curved{width:1.25em;height:1.25em;vertical-align:-.2em}
.bp-deck-controls button svg.ui-arrow{width:1.1em;height:1.1em}

/* Decorative and control symbols use the same vector outlines on every platform. */
svg.ui-symbol{display:inline-block;width:1em;height:1em;vertical-align:-.13em;overflow:visible;flex-shrink:0;pointer-events:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
svg.ui-symbol-heart{width:1.06em;height:1.2em;vertical-align:-.24em;fill:currentColor;stroke:none}
svg.ui-symbol-triangle{fill:currentColor;stroke:none}
svg.ui-symbol-pause{stroke-width:3}