@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,600;12..96,700;12..96,800&family=Nunito+Sans:wght@400;500;600;700;800&display=swap');

:root{--paper:#fffaf0;--ink:#292b26;--muted:#69685c;--accent:#b65329;--peach:#ffe5c4;--line:#e5decb;--display:'Bricolage Grotesque','Arial Rounded MT Bold',sans-serif;--body:'Nunito Sans',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;font-family:var(--body);background:var(--paper);color:var(--ink);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button:focus-visible,a:focus-visible{outline:3px solid #26738a;outline-offset:6px}h1,h2,p{margin:0}button:disabled{cursor:default;opacity:.4}.skip-link{position:fixed;top:10px;left:15px;z-index:110;background:var(--ink);color:white;padding:10px 18px;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.site-header{position:fixed;inset:0 0 auto;height:82px;width:min(1152px,calc(100% - 96px));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:40;border-bottom:1px solid var(--line);background:var(--paper)}.site-header::before{content:'';position:absolute;inset:0 -100vw;z-index:-1;background:var(--paper)}.wordmark{font-family:var(--display);font-size:27px;font-weight:800;letter-spacing:-1.6px}.wordmark span{color:var(--accent)}.header-tools{display:flex;align-items:center;gap:30px}.header-date{font-size:12px;color:var(--muted)}.motion-toggle{display:flex;align-items:center;gap:8px;border:0;padding:10px 0 10px 12px;background:transparent;font-size:11px;min-height:44px}.play-path{display:none}.motion-paused .pause-path{display:none}.motion-paused .play-path{display:block}
.story-stage{height:100svh;min-height:580px;position:relative;background:var(--paper);overflow:hidden}.story-content{position:relative;width:min(1152px,calc(100% - 96px));height:100%;margin:auto}.story-copy-area{position:absolute;inset:0;z-index:3;pointer-events:none}.story-panel{position:absolute;left:0;top:49%;width:53%;visibility:hidden;opacity:0;will-change:transform,opacity}.story-panel h1,.story-panel h2{font-family:var(--display);font-weight:700;font-size:clamp(40px,4.65vw,67px);line-height:1.09;letter-spacing:-.055em}.story-panel h1{font-size:clamp(45px,5.3vw,76px)}.story-panel em{font-style:normal;color:var(--accent)}.story-panel p{font-size:19px;line-height:1.8;margin-top:30px;max-width:490px;color:#626356}.story-panel--letter h2{font-size:clamp(36px,3.9vw,54px);line-height:1.18;letter-spacing:-.045em}.story-panel--center{left:10%;width:80%;text-align:center}.story-panel--center h2{font-size:clamp(46px,5.4vw,74px)}.story-panel--center p{max-width:600px;margin-inline:auto;font-size:21px}.story-panel--quote h2{font-size:clamp(40px,4.7vw,64px)}.story-panel--quote p{font-size:24px}.hanging-ellipsis{display:inline-block;font-size:38px;vertical-align:baseline;color:var(--accent)}.story-panel--yay h2{font-size:clamp(48px,5.6vw,79px)}.yay{display:inline-block;font-weight:800;margin-top:10px}.story-panel--birthday h2{font-size:clamp(40px,4.8vw,66px)}.story-panel--finale h2{font-size:clamp(39px,4.5vw,63px)}.story-panel--finale p strong{display:block;font-family:var(--display);font-size:clamp(42px,4.9vw,69px);font-weight:800;color:var(--accent);letter-spacing:-.05em;line-height:1.15}.finale-party{pointer-events:auto;display:inline-flex;border:1px solid var(--ink);padding:10px 17px;border-radius:8px;font-size:12px;background:var(--paper);margin-top:28px;gap:9px;align-items:center}.finale-party:hover{background:var(--ink);color:var(--paper)}
.character-figure{position:absolute;width:45%;height:min(64svh,550px);right:-12px;top:50%;isolation:isolate;will-change:transform,opacity}.character-backdrop{position:absolute;inset:6% 2% 4%;background:var(--peach);border-radius:46% 54% 42% 58% / 51% 43% 57% 49%;transform:rotate(-7deg);z-index:-1}.cartoon-host{position:absolute;inset:0}.cartoon-host img,.cartoon-host canvas{display:block;width:100%;height:100%;object-fit:contain}.cartoon-host canvas{position:absolute;inset:0;opacity:0;pointer-events:none}.three-ready #cartoon-image{opacity:0}.three-ready #cartoon-canvas{opacity:1}.birthday-number{position:absolute;right:1%;top:-8%;font-family:var(--display);font-size:190px;line-height:1;font-weight:800;color:#b6532929;z-index:-1;opacity:0;letter-spacing:-15px}.story-bottom{position:absolute;bottom:29px;left:0;right:0;width:min(1152px,calc(100% - 96px));margin:auto;z-index:5}.scroll-hint{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:14px}.scroll-hint>span{font-size:19px}.gallery-active .scroll-hint{visibility:hidden}
.gallery-scene{position:absolute;inset:110px 0 95px;display:flex;align-items:center;justify-content:center;visibility:hidden;opacity:0;z-index:6}.gallery-main{display:block;position:relative;height:min(65svh,610px);width:min(44vw,490px);max-height:100%;background:#fffdf6;padding:11px;border:0;box-shadow:0 12px 45px #0004;transform:rotate(-2deg);z-index:2;overflow:hidden}.gallery-main img{display:block;width:100%;height:100%;object-fit:contain;background:#fffdf6}.gallery-side{position:absolute;width:25%;height:64%;top:17%;background:#f8f3e7;padding:9px;opacity:.68}.gallery-side img{width:100%;height:100%;object-fit:cover}.gallery-side-left{left:4%;transform:rotate(-12deg)}.gallery-side-right{right:4%;transform:rotate(11deg)}.gallery-controls{position:absolute;display:flex;gap:16px;bottom:-40px;left:50%;transform:translateX(-50%);z-index:4}.gallery-controls button{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid #d4d8c87a;background:#292b26;color:var(--paper);border-radius:50%;font-size:20px}.gallery-controls button:hover{background:#454b40}.gallery-play-path{display:none}.gallery-user-paused .gallery-pause-path{display:none}.gallery-user-paused .gallery-play-path{display:block}.gallery-status{color:var(--paper);position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;font-size:14px;text-align:center;padding:30px;z-index:3;background:var(--ink)}.gallery-status[hidden]{display:none}.gallery-status button{border:1px solid #ddd;background:transparent;color:var(--paper);padding:9px 16px;border-radius:6px}
.opening-overlay{position:fixed;inset:0;z-index:60;background:var(--paper)}.opening-overlay[hidden]{display:none}.opening-overlay button{position:absolute;right:30px;bottom:28px;background:transparent;border:0;padding:12px;font-size:12px;color:var(--muted);z-index:90}.opening-overlay button:hover{color:var(--ink)}#party-canvas{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:70;visibility:hidden}.site-footer{width:min(1152px,calc(100% - 96px));margin:auto;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 0;font-size:11px;color:var(--muted);background:var(--paper)}.site-footer button{background:none;border:0;font-size:11px;padding:8px 0;color:var(--muted)}.site-footer button:hover{color:var(--ink)}
.dialog-open{overflow:hidden}dialog{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:65px 70px;border:0;background:#242720f5;color:var(--paper)}dialog::backdrop{background:#242720}dialog[open]{display:flex;align-items:center;justify-content:center;gap:26px}dialog>img{display:block;max-width:calc(100% - 140px);max-height:100%;width:auto;height:auto;object-fit:contain}.dialog-close,.dialog-previous,.dialog-next{display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid #fffaf04d;color:var(--paper);width:44px;height:44px;border-radius:50%;font-size:22px;flex-shrink:0}.dialog-close{position:absolute;top:15px;right:22px;border:0;font-size:30px}dialog button:hover{background:#ffffff15}dialog button:focus-visible{outline-color:white}.noscript-note{position:fixed;bottom:30px;left:30px;z-index:100}.no-js .story-stage{min-height:100vh;height:auto}.no-js .story-panel{position:relative;top:auto;left:auto;visibility:visible;opacity:1;transform:none;width:100%;padding:130px 0;display:block}.no-js .character-figure,.no-js .gallery-scene,.no-js .story-bottom{display:none}.motion-paused *,.motion-paused *::before,.motion-paused *::after{transition:none!important;animation:none!important}
@media(max-width:1050px){.site-header,.story-content,.story-bottom,.site-footer{width:calc(100% - 64px)}.story-panel{width:52%}.story-panel h1{font-size:5.8vw}.story-panel h2{font-size:5.3vw}.story-panel--letter h2{font-size:4.4vw}.story-panel--center{left:8%;width:84%}.story-panel--center h2{font-size:6vw}.story-panel p{font-size:17px;margin-top:25px}.character-figure{height:55svh;right:-10px;width:46%}.birthday-number{font-size:150px}.gallery-main{width:49vw;height:63svh}.gallery-side{width:28%;height:62%}.gallery-side-left{left:1%}.gallery-side-right{right:1%}}
@media(max-width:760px){.site-header,.story-content,.story-bottom,.site-footer{width:calc(100% - 44px)}.site-header{height:72px}.header-tools{gap:15px}.header-date{font-size:10px}.wordmark{font-size:25px}.motion-toggle{font-size:10px;padding-left:0}.story-panel h1{font-size:6vw}.story-panel h2{font-size:5.5vw}.story-panel--letter h2{font-size:4.9vw}.story-panel p{font-size:15px}.story-panel--center h2{font-size:6.5vw}.story-panel--center p{font-size:18px}.character-figure{height:46svh}.story-bottom{bottom:22px}.scroll-hint{font-size:10px}.gallery-scene{inset:95px 0 125px}.gallery-main{width:57vw;height:63svh}.gallery-controls{bottom:-41px}.gallery-side{width:31%;height:57%;top:20%}.gallery-side-left{left:-1%}.gallery-side-right{right:-1%}dialog{padding:65px 20px}dialog[open]{gap:12px}dialog>img{max-width:calc(100% - 90px)}.dialog-previous,.dialog-next{width:34px;height:34px}}
@media(max-width:620px){.site-header,.story-content,.story-bottom,.site-footer{width:calc(100% - 40px)}.site-header{height:70px;gap:12px}.wordmark{font-size:22px;letter-spacing:-1px;white-space:nowrap}.header-date{display:none}.story-stage{min-height:620px}.story-panel{top:108px;left:0;width:100%}.story-panel h1{font-size:clamp(37px,10.4vw,52px);line-height:1.08;letter-spacing:-.055em}.story-panel h2{font-size:clamp(34px,9.5vw,48px);line-height:1.1}.story-panel p{font-size:16px;line-height:1.65;margin-top:20px;max-width:100%}.story-panel--letter h2{font-size:clamp(28px,7.8vw,36px);line-height:1.17;letter-spacing:-.04em}.story-panel--quote h2{font-size:clamp(33px,9vw,43px)}.story-panel--quote p{font-size:19px}.story-panel--yay h2{font-size:clamp(39px,10.6vw,54px)}.story-panel--yay .yay{font-size:1.3em}.story-panel--center{top:29%;width:100%;left:0;text-align:left}.story-panel--center h2{font-size:clamp(38px,10vw,50px)}.story-panel--center p{font-size:18px;margin-top:25px}.story-panel--birthday h2{font-size:clamp(33px,9.1vw,44px)}.story-panel--birthday p{max-width:310px}.story-panel--finale h2{font-size:clamp(30px,8.7vw,42px)}.story-panel--finale p strong{font-size:clamp(40px,11.5vw,57px)}.finale-party{margin-top:21px;font-size:11px;padding:9px 15px}.character-figure{width:82%;height:34svh;max-height:315px;min-height:210px;right:9%;top:auto;bottom:111px}.character-backdrop{inset:3% 7% 1%}.birthday-number{font-size:140px;top:-5%;right:-2%;letter-spacing:-10px}.story-bottom{bottom:14px}.gallery-scene{inset:105px 0 140px}.gallery-main{width:84%;height:100%;max-height:570px;padding:8px;transform:rotate(-2deg)}.gallery-side{width:55%;height:67%;top:16%;padding:6px;opacity:.45}.gallery-side-left{left:-16%;transform:rotate(-13deg)}.gallery-side-right{right:-16%;transform:rotate(13deg)}.gallery-controls{bottom:-51px;gap:20px}.gallery-controls button{height:42px;width:42px}.site-footer{font-size:10px;align-items:center;padding:25px 0}.site-footer button{font-size:10px}.opening-overlay button{right:15px;bottom:20px}dialog{padding:65px 15px 95px}dialog>img{max-width:100%;max-height:100%}.dialog-previous,.dialog-next{position:absolute;bottom:24px;width:42px;height:42px}.dialog-previous{left:calc(50% - 52px)}.dialog-next{right:calc(50% - 52px)}.dialog-close{right:12px;top:12px}}
@media(max-height:720px) and (max-width:620px){.story-panel{top:95px}.story-panel p{font-size:14px;line-height:1.6;margin-top:16px}.story-panel h1{font-size:clamp(34px,9vw,43px)}.story-panel h2{font-size:clamp(30px,8.2vw,39px)}.story-panel--letter h2{font-size:clamp(25px,7vw,31px)}.story-panel--center{top:27%}.story-panel--center h2{font-size:36px}.story-panel--center p{font-size:16px}.character-figure{height:31svh;min-height:190px;bottom:97px}.story-panel--finale p strong{font-size:41px}.finale-party{margin-top:15px}.gallery-scene{inset:95px 0 135px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
html{scrollbar-gutter:stable}
.site-header{width:100%;padding-inline:max(48px,calc((100% - 1152px)/2));margin:0}
.site-header::before{display:none}
.party-games{position:absolute;inset:0;z-index:5;pointer-events:none}
.party-games[hidden],.pop-balloon[hidden]{display:none}
.party-balloons{position:absolute;inset:0;pointer-events:none}
.pop-balloon{position:absolute;width:64px;height:104px;padding:0;border:0;background:none;pointer-events:auto;transform:translateX(-50%);transform-origin:50% 28%;cursor:crosshair;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.pop-balloon svg{width:100%;height:100%;fill:none;stroke:none;overflow:visible}
.pop-balloon:hover svg{transform:rotate(5deg)}
.pop-balloon:focus-visible{outline:3px dashed var(--accent);outline-offset:3px;border-radius:45%}
.candle-game{position:absolute;left:50%;bottom:-34px;width:160px;transform:translateX(-50%);pointer-events:auto;text-align:center}
.candle-button{position:relative;display:block;width:160px;height:130px;padding:0;border:0;background:transparent;touch-action:pan-y;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.candle-button .birthday-cake{display:block;width:100%;height:100%;fill:none;stroke:none;overflow:visible}
.candle-button:focus-visible{outline:3px dashed var(--accent);outline-offset:5px;border-radius:8px}
.candle-hint{position:absolute;left:50%;top:calc(100% + 3px);width:220px;transform:translateX(-50%);font-size:11px;line-height:1.4;color:#626356;white-space:nowrap;pointer-events:none}
.candle-hold-track{position:absolute;bottom:-1px;left:20%;width:60%;height:3px;background:#b6532920;border-radius:3px;overflow:hidden;opacity:0}
.candle-hold-track>span{display:block;width:calc(var(--hold,0) * 100%);height:100%;background:var(--accent)}
[data-candle=holding] .candle-hold-track{opacity:1}
.candle-flames{transform-origin:80px 34px;animation:candle-flicker .7s ease-in-out 6 alternate}
.candle-smoke{opacity:0}
.is-blown .candle-flames{opacity:0;animation:none}
.is-blown .candle-smoke{animation:candle-smoke 1.3s ease-out both}
.party-scrap{position:absolute;width:5px;height:9px;pointer-events:none;z-index:8}
@keyframes candle-flicker{from{transform:scaleX(.94) scaleY(.97)}to{transform:scaleX(1.05) scaleY(1.04)}}
@keyframes candle-smoke{0%{opacity:0;transform:translateY(0)}20%{opacity:.7}100%{opacity:0;transform:translateY(-18px)}}
@media(max-width:620px){.pop-balloon{width:49px;height:80px}.candle-game{bottom:-38px;width:138px}.candle-button{width:138px;height:112px}.candle-hint{font-size:10px;top:calc(100% + 2px)}}
@media(max-height:720px) and (max-width:620px){.pop-balloon{width:44px;height:72px}.candle-game{bottom:-32px;width:126px}.candle-button{width:126px;height:103px}}
.gallery-outgoing{position:absolute;left:50%;top:50%;height:min(65svh,610px);width:min(44vw,490px);max-height:100%;padding:11px;background:#fffdf6;box-shadow:0 12px 45px #0004;pointer-events:none;will-change:transform,opacity}
.gallery-outgoing[hidden]{display:none}
.gallery-outgoing img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:1050px){.gallery-outgoing{width:49vw;height:63svh}}
@media(max-width:760px){.gallery-outgoing{width:57vw;height:63svh}}
@media(max-width:620px){.gallery-outgoing{width:84%;height:100%;max-height:570px;padding:8px}}
.story-panel--long-letter{top:110px;height:calc(100% - 180px);overflow:hidden;overflow:clip}
.story-panel--long-letter h2{font-size:clamp(28px,3vw,40px);line-height:1.18;letter-spacing:-.04em}
.story-panel--long-letter p{font-size:17px;line-height:1.75;max-width:none;margin-top:18px}
.letter-content{display:flow-root;will-change:transform;padding-bottom:4px}
.letter-active #party-canvas.in-story{clip-path:inset(0 0 0 55%)}
@media(max-width:760px){.story-panel--long-letter{top:98px;height:calc(100% - 158px)}.story-panel--long-letter h2{font-size:29px}.story-panel--long-letter p{font-size:16px;line-height:1.7}}
@media(max-width:620px){.story-panel--long-letter{top:100px;bottom:330px;height:auto}.story-panel--long-letter h2{font-size:27px;line-height:1.2}.story-panel--long-letter p{font-size:16px;line-height:1.7;margin-top:17px}.letter-active .character-figure{height:230px;min-height:0;max-height:230px;bottom:76px}.letter-active .birthday-number{font-size:110px}.letter-active #party-canvas.in-story{clip-path:inset(calc(100% - 310px) 0 0)}}
@media(max-height:720px) and (max-width:620px){.story-panel--long-letter{top:92px;bottom:238px}.story-panel--long-letter h2{font-size:24px}.story-panel--long-letter p{font-size:15px;line-height:1.65;margin-top:15px}.letter-active .character-figure{height:164px;max-height:164px;bottom:58px}.letter-active #party-canvas.in-story{clip-path:inset(calc(100% - 228px) 0 0)}}
.character-figure{z-index:2}
#party-canvas.in-story{position:absolute;z-index:1}
@media(max-width:1050px){.site-header{padding-inline:32px}}
@media(max-width:760px){.site-header{padding-inline:22px}}
@media(max-width:620px){.site-header{padding-inline:20px}}