@import url('../assets/fonts/fonts.css');
:root{color-scheme:dark;--ink:#070b18;--gold:#e9d8ad;--ivory:#f8f4e9;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100vh;height:100dvh;overflow:hidden;background:var(--ink)}
body{font-family:'Noto Serif SC',serif;color:var(--ivory)}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
#app,main,.scene{position:absolute;inset:0;overflow:hidden}
.scene{opacity:0;visibility:hidden;transition:opacity 1.15s ease,visibility 1.15s;pointer-events:none}
.scene.active{opacity:1;visibility:visible;pointer-events:auto}
.sky{position:absolute;inset:0;overflow:hidden;background:radial-gradient(ellipse at 70% 32%,#1c244b 0,transparent 36%),radial-gradient(ellipse at 16% 85%,#172037 0,transparent 44%),linear-gradient(145deg,#060a16,#0c1228 58%,#080d1b)}
.sky:before{content:'';position:absolute;left:-28%;top:18%;width:160%;height:62%;transform:rotate(-24deg);background:radial-gradient(ellipse at 50% 52%,#a6a3db11 0%,#8c93d315 18%,#3d61971e 34%,transparent 66%),radial-gradient(ellipse at 44% 50%,#dac3b310 0%,transparent 42%);filter:blur(clamp(18px,3vw,55px));opacity:.72;animation:nebulaDrift 65s ease-in-out infinite alternate}
.sky:after{content:'';position:absolute;inset:-20%;background:radial-gradient(ellipse at 70% 20%,#6a73b00c,transparent 40%),radial-gradient(ellipse at 25% 72%,#5c728c10,transparent 35%);filter:blur(65px);animation:nebulaFloat 48s ease-in-out infinite alternate}
#starfield{position:absolute;inset:0;z-index:1;pointer-events:none}
.sound{position:fixed;z-index:30;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));border:1px solid #ffffff14;border-radius:50px;padding:8px 11px;background:#10162948;backdrop-filter:blur(9px);font-size:12px;letter-spacing:.1em;color:#cbd3e5ad;transition:background .3s,border-color .3s,color .3s,transform .3s}
.sound:hover,.sound:focus-visible{background:#192441ba;border-color:#e7d7b766;color:#fff;transform:translateY(-1px)}
.sound-icon{font-size:15px;margin-right:5px}.sound-label{font:10px system-ui,sans-serif}
.signature{position:fixed;z-index:25;bottom:max(8px,env(safe-area-inset-bottom));left:12px;color:#e0e7ff;opacity:.21;font:9px system-ui,sans-serif;letter-spacing:.08em;pointer-events:none}
#entry{display:grid;place-items:center}.glow-link{border:0;background:none;color:#eee8df;font-size:clamp(18px,1.55vw,26px);letter-spacing:.36em;text-indent:.36em;padding:26px 36px;text-shadow:0 0 22px #c3b8f494;animation:breathe 3.7s ease-in-out infinite}
.maze-heading{position:absolute;z-index:3;top:clamp(30px,4.5vh,62px);width:100%;text-align:center;pointer-events:none;text-shadow:0 3px 24px #060814}
.eyebrow{font:300 clamp(20px,2.45vw,38px)/1.15 'Cormorant Garamond',serif;letter-spacing:.24em;color:#e6d9bd}
.maze-heading p{font-size:clamp(14px,1.18vw,20px);line-height:1.7;color:#e1e4ef;letter-spacing:.26em;margin:.6em 0}
.maze-world{position:absolute;width:min(93vw,1500px);height:min(72vh,790px);left:50%;top:54%;transform:translate(-50%,-50%);overflow:hidden;border-radius:clamp(16px,1.7vw,28px);background-image:radial-gradient(ellipse at 88% 22%,#f0d69b1f,transparent 26%),linear-gradient(#14213c80,#0a202bbc),url('../assets/backgrounds/castle.jpg');background-position:center;background-size:cover;box-shadow:0 35px 100px #000a,inset 0 0 100px #071122b9;isolation:isolate}
.maze-world:before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle at 87% 23%,#f6da9b28,transparent 22%),radial-gradient(ellipse at 8% 83%,#a6b89e12,transparent 30%)}
.maze-world:after{content:'';position:absolute;inset:-15%;z-index:6;pointer-events:none;background:radial-gradient(ellipse at 65% 75%,#c5d5dc12,transparent 38%),radial-gradient(ellipse at 13% 38%,#b7bacf12,transparent 30%);filter:blur(40px);animation:nebulaFloat 22s ease-in-out infinite alternate}
.mountains{position:absolute;top:20%;left:-5%;width:110%;height:32%;background:linear-gradient(140deg,transparent 45%,#101d36 46%) 0 0/27% 100%,linear-gradient(225deg,transparent 45%,#0d2632 46%) 0 0/37% 100%;opacity:.65}
.mountains:after{content:'';position:absolute;left:0;right:0;bottom:-32%;height:45%;background:linear-gradient(transparent,#bedad414);filter:blur(24px)}
.castle{position:absolute;z-index:2;right:5%;top:5%;width:clamp(92px,10vw,170px);height:clamp(115px,18vh,205px);background:linear-gradient(#78718c,#3b465b);clip-path:polygon(0 40%,12% 40%,12% 24%,22% 4%,32% 24%,32% 44%,44% 44%,44% 19%,56% 0,68% 19%,68% 44%,78% 44%,78% 27%,88% 9%,98% 27%,98% 100%,0 100%);filter:drop-shadow(0 0 24px #f6df9dbb);opacity:.88;transition:filter 2s,opacity 2s,transform 3s}
.castle i{position:absolute;top:53%;left:23%;width:7%;height:12%;background:#ffe2a4;box-shadow:30px 7px #ffe2a4,60px -4px #ffe2a4;opacity:.5}.castle b{position:absolute;right:12%;top:9%;color:#ffeaae}
.maze-board{position:absolute;z-index:3;left:4%;right:4%;bottom:5%;height:76%;display:grid;grid-template-columns:repeat(var(--maze-cols),1fr);grid-template-rows:repeat(var(--maze-rows),1fr);background:radial-gradient(ellipse at 87% 9%,#e6c9842b,transparent 34%),linear-gradient(180deg,#0b20247a,#0b281f9c);border-radius:16px;box-shadow:inset 0 0 45px #07120b80}
.maze-cell{position:relative;min-width:0;min-height:0}.maze-cell.path{background:radial-gradient(ellipse at 50% 70%,#d5c99410,transparent 75%)}
.maze-cell.wall:before{content:'';position:absolute;inset:-11%;background:radial-gradient(ellipse at 43% 35%,#3f5946,#1c3e34 62%,#102626 100%);border-radius:42% 54% 38% 47%;box-shadow:0 0 15px #9ed0a124,inset 0 4px 8px #a6d4a228}
.maze-cell.wall.tree:before{inset:-15% -14% -7%;border-radius:48% 42% 38% 44%;background:radial-gradient(ellipse at 45% 25%,#42614c,#1c463c 55%,#102c2e 100%)}
.maze-cell.wall.stone:before{inset:1% -7%;border-radius:46% 32% 25% 33%;background:linear-gradient(145deg,#455456,#263d41 62%,#15252f);box-shadow:inset 0 3px 9px #a4b9a525,0 3px 12px #06131580}
.maze-cell.wall:nth-child(4n):before{transform:rotate(13deg) scale(1.12);border-radius:35% 55% 42% 58%}.maze-cell.wall:nth-child(7n):before{transform:rotate(-17deg) scale(.97,1.16);border-radius:55% 37% 58% 35%}.maze-cell.tree:not(.glow-plant):after{content:'';position:absolute;left:25%;top:8%;width:34%;height:35%;border-top:1px solid #a9ce9b36;border-radius:50%;transform:rotate(-25deg)}
.maze-cell.glow-plant:after{content:'✦';position:absolute;z-index:2;left:40%;top:28%;font-size:clamp(6px,.8vw,13px);color:#dff6bb;filter:drop-shadow(0 0 8px #c9efa2);animation:plantGlow 3.8s ease-in-out infinite}
.maze-cell.goal:after{content:'';position:absolute;inset:25%;border-radius:50%;background:#ffe9b1;box-shadow:0 0 18px 8px #f2c9779c;animation:breathe 2s infinite}
.character{position:absolute;z-index:7;width:clamp(34px,4.4vw,var(--character-width));height:clamp(49px,6.2vw,var(--character-height));transform:translate(-50%,-79%);filter:drop-shadow(0 0 13px #f3dfada6);will-change:left,top}
.character img{width:100%;height:100%;object-fit:contain;transform:scaleX(var(--facing,1));animation:float 2.7s ease-in-out infinite}
.character.walking img{animation:walk .4s ease-in-out infinite alternate}.character.touching-wall{filter:drop-shadow(0 0 17px #ffdd9b)}
.partner{opacity:0;transition:opacity 1.5s}.maze-world.completed .partner{opacity:1}.maze-world.completed .castle{filter:drop-shadow(0 0 45px #ffe6a9);transform:scale(1.04)}
.maze-bloom{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(circle at 87% 24%,#ffe4a762,transparent 43%);opacity:0;transition:opacity 2.5s}.completed .maze-bloom{opacity:1}
.controls{position:absolute;z-index:8;bottom:max(2vh,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;align-items:center;flex-direction:column;gap:4px}.controls>div{display:flex;gap:4px}
.controls button{width:clamp(47px,4.1vw,60px);height:clamp(43px,4.1vw,58px);border:1px solid #e8eaf542;background:#6c7c9d42;backdrop-filter:blur(13px);border-radius:13px;color:#f9f5e6;font:clamp(19px,1.7vw,25px) system-ui,sans-serif;touch-action:none;transition:background .2s,transform .2s}.controls button:active{background:#e6d5ae65;transform:scale(.94)}
.keyboard-hint{position:absolute;bottom:2%;left:2%;color:#c5cde4ac;font:11px system-ui,sans-serif;letter-spacing:.16em}
.center-copy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:28px}.reward-line{font-size:clamp(19px,2.2vw,37px);line-height:1.85;letter-spacing:.1em;opacity:0;transform:translateY(16px);transition:opacity 1.8s,transform 1.8s}.active .reward-line{opacity:1;transform:none}
.gift-button{display:flex;flex-direction:column;align-items:center;gap:15px;min-width:44px;min-height:44px;border:0;background:none;opacity:0;transition:opacity 1.8s;color:var(--gold);font-size:clamp(15px,1.2vw,20px);letter-spacing:.2em;pointer-events:auto;touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.gift-button.ready{opacity:1}.gift-orb{display:block;width:clamp(54px,5vw,78px);height:clamp(54px,5vw,78px);border-radius:50%;background:radial-gradient(circle,#fff8db 0%,#dfc28f 15%,#a0749844 45%,transparent 70%);box-shadow:0 0 35px #eacfa88c;animation:breathe 3s infinite}
#birthday{background:radial-gradient(ellipse at 50% 47%,#1b24467d,transparent 60%),#080d1bc7;transition-duration:.42s}
.birthday-halo{position:absolute;inset:-15%;background:radial-gradient(circle at 50% 50%,#f8d4ad24,transparent 28%),radial-gradient(circle at 25% 30%,#e8a2c116,transparent 26%);opacity:0;transition:opacity 1.2s}.celebrating .birthday-halo{opacity:1;animation:nebulaFloat 12s ease-in-out infinite alternate}
#fireworks{position:absolute;inset:0;width:100%;height:100%;z-index:2}.birthday-curtain{position:absolute;z-index:5;inset:0;background:#030510;opacity:0;pointer-events:none;transition:opacity .34s}.prelude .birthday-curtain{opacity:1}
.birthday-title{position:absolute;z-index:3;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-shadow:0 0 34px #ffe4c2a6,0 5px 40px #080b1e;pointer-events:none}
.birthday-title p,.birthday-title h1,.birthday-title span{opacity:0;transform:translateY(22px) scale(.96);transition:opacity 1.65s,transform 2s var(--ease)}.birthday-title .show{opacity:1;transform:none}
.birthday-title p{font:300 clamp(58px,8vw,155px)/.95 'Cormorant Garamond',serif;letter-spacing:.025em;margin:0}.birthday-title h1{font-weight:300;font-size:clamp(82px,10vw,195px);letter-spacing:.26em;text-indent:.26em;margin:clamp(4px,1.2vh,18px) 0}.birthday-title span{font-size:clamp(18px,2vw,31px);letter-spacing:.32em;text-indent:.32em;color:#f5e3c7}
#gallery{background:#080c19}.photo-stage,.photo-frame{position:absolute;inset:0}.photo-frame{opacity:0;overflow:hidden;transition:opacity 1.35s ease;perspective:900px}.photo-frame.active{opacity:1}
.photo-bg{position:absolute;inset:-12%;background-position:center;background-size:cover;filter:blur(45px) brightness(.37) saturate(.85);transform:scale(1.14);transition:transform 7s ease,filter 1.8s}.photo-frame.active .photo-bg{transform:scale(1.03);filter:blur(36px) brightness(.43) saturate(.9)}
.photo-frame:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 48%,transparent 32%,#030611ad 100%),linear-gradient(0deg,#060913d9,transparent 25%)}
.photo-main{position:absolute;top:50%;left:var(--photo-x,50%);width:min(47vw,48vh);height:69vh;object-fit:contain;opacity:0;filter:drop-shadow(0 28px 48px #000c);transform:translate(-50%,-50%) scale(1.09);transition:transform 6.8s var(--ease),opacity 1.65s ease,filter 1.6s,clip-path 1.8s;will-change:transform,opacity}
.photo-frame.active .photo-main{opacity:1;transform:translate(-50%,-50%) scale(1)}
.preset-01{--photo-x:62%}.preset-02{--photo-x:37%}.preset-03{--photo-x:50%}.preset-04{--photo-x:63%}.preset-05{--photo-x:36%}.preset-06{--photo-x:60%}.preset-07{--photo-x:50%}.preset-08{--photo-x:62%}.preset-09{--photo-x:38%}.preset-10{--photo-x:50%}
.preset-01 .photo-main{transform:translate(-50%,-50%) scale(1.15);filter:blur(14px) drop-shadow(0 28px 48px #000c)}.preset-01.active .photo-main{transform:translate(-50%,-50%) scale(1.02);filter:blur(0) drop-shadow(0 28px 48px #000c)}
.preset-02 .photo-main{transform:translate(calc(-50% + 13vw),-50%) rotate(7deg) scale(1.08);filter:blur(12px)}.preset-02.active .photo-main{transform:translate(-50%,-50%) rotate(-1deg) scale(1);filter:blur(0)}
.preset-03 .photo-main{transform:translate(-50%,-50%) scale(1.04);transition-delay:.55s}.preset-03.active .photo-main{transform:translate(-50%,-50%) scale(1)}
.preset-04 .photo-main{transform:translate(-50%,-50%) scale(1.42)}.preset-04.active .photo-main{transform:translate(-50%,-50%) scale(.98)}
.preset-05:before{content:'';position:absolute;z-index:3;inset:-40%;pointer-events:none;background:linear-gradient(110deg,transparent 38%,#ffdb9e00 44%,#fff4cf8f 50%,#efabb156 53%,transparent 62%);transform:translateX(-90%) rotate(-8deg);opacity:0}.preset-05.active:before{animation:lightLeak 2s ease-out both}.preset-05 .photo-main{transform:translate(calc(-50% - 5vw),-50%) scale(1.12)}.preset-05.active .photo-main{transform:translate(-50%,-50%) scale(1)}
.preset-06 .photo-main{transform:translate(-50%,-50%) rotateY(-28deg) rotateX(11deg) scale(.88);filter:blur(8px)}.preset-06.active .photo-main{transform:translate(-50%,-50%) rotateY(0) rotateX(0) scale(1);filter:blur(0)}
.preset-07{transition-duration:2.25s}.preset-07 .photo-main{transform:translate(-50%,-50%) scale(1.16);filter:blur(10px)}.preset-07.active .photo-main{transform:translate(-50%,-50%) scale(1);filter:blur(0)}
.preset-08 .photo-main{clip-path:inset(0 100% 0 0);transform:translate(-50%,-50%) scale(1.04)}.preset-08.active .photo-main{clip-path:inset(0 0 0 0);transform:translate(-50%,-50%) scale(1)}.preset-08:before{content:'';position:absolute;z-index:4;left:20%;right:20%;top:8%;bottom:8%;border-top:1px solid #f2e6d034;border-bottom:1px solid #f2e6d034;pointer-events:none;opacity:0}.preset-08.active:before{opacity:1;transition:opacity 2s}
.preset-09 .photo-main{transform:translate(-50%,-50%) scale(1.68);filter:blur(4px)}.preset-09.active .photo-main{transform:translate(-50%,-50%) scale(1);filter:blur(0)}
.preset-10{transition-duration:2.5s}.preset-10 .photo-main{transform:translate(-50%,-50%) scale(.97)}.preset-10.active .photo-main{transform:translate(-50%,-50%) scale(1.06);transition-duration:7s;transition-delay:.25s}
.photo-meta{position:absolute;z-index:5;bottom:13%;width:min(34vw,630px);text-shadow:0 2px 18px #000,0 0 24px #000;opacity:0;transform:translateY(20px);transition:opacity 1.1s ease,transform 1.2s var(--ease);pointer-events:none}.photo-meta.visible{opacity:1;transform:none}
.photo-meta span{color:#e9d8ad;font:clamp(12px,.85vw,16px) system-ui,sans-serif;letter-spacing:.3em}.photo-meta p{font-size:clamp(15px,1.1vw,21px);line-height:1.7;letter-spacing:.12em;color:#e8dac2;margin:12px 0}.photo-meta h2{font-weight:300;font-size:clamp(22px,2vw,36px);line-height:1.65;letter-spacing:.04em;margin:0}
#gallery[data-preset="preset-01"] .photo-meta,#gallery[data-preset="preset-04"] .photo-meta,#gallery[data-preset="preset-06"] .photo-meta,#gallery[data-preset="preset-08"] .photo-meta{left:8%;text-align:left}
#gallery[data-preset="preset-02"] .photo-meta,#gallery[data-preset="preset-05"] .photo-meta,#gallery[data-preset="preset-09"] .photo-meta{right:8%;text-align:right}
#gallery[data-preset="preset-03"] .photo-meta,#gallery[data-preset="preset-07"] .photo-meta,#gallery[data-preset="preset-10"] .photo-meta{left:50%;bottom:6%;width:min(68vw,900px);text-align:center;transform:translate(-50%,20px)}
#gallery[data-preset="preset-03"] .photo-meta.visible,#gallery[data-preset="preset-07"] .photo-meta.visible,#gallery[data-preset="preset-10"] .photo-meta.visible{transform:translate(-50%,0)}
#gallery[data-preset="preset-04"] .photo-meta,#gallery[data-preset="preset-05"] .photo-meta{bottom:34%}
#gallery[data-preset="preset-07"] .photo-meta{bottom:9%}
.story-intro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:clamp(18px,3vh,40px);text-align:center;padding:24px}.story-intro p,.story-intro span{opacity:0;transition:opacity 1.5s}.story-intro p.show,.story-intro span.show{opacity:1}.story-intro p{font:300 clamp(42px,4vw,72px) 'Cormorant Garamond',serif;letter-spacing:.22em}.story-intro span{font-size:clamp(18px,1.55vw,27px);line-height:1.9}
.story-viewport{position:absolute;inset:0;overflow:hidden;perspective:750px;opacity:0;transition:opacity 1.5s}.story-viewport.show{opacity:1}.story-viewport:after{content:'';position:absolute;inset:0;background:linear-gradient(#080d1f 0%,transparent 18%,transparent 72%,#080d1f 100%);pointer-events:none}.story-scroll{position:absolute;top:100%;left:50%;width:min(74vw,900px);transform:translateX(-50%);transform-origin:50% 100%;text-align:center;color:#f7f0e3;text-shadow:0 0 18px #f7dbad58;font-size:clamp(20px,1.75vw,31px);line-height:2.25;letter-spacing:.065em}.story-scroll p{margin:0 0 1.75em}.story-scroll p:last-child{color:#ffe0a8;font-size:1.23em;margin-top:2.4em}
.heart-button{position:absolute;left:50%;top:50%;width:130px;height:130px;transform:translate(-50%,-50%);border:0;background:none;display:grid;place-items:center}.heart-shape{position:relative;width:50px;height:50px;background:#ab253e;transform:rotate(-45deg);box-shadow:0 0 30px #c62b5866;animation:heartbeat 3s ease-in-out infinite}.heart-shape:before,.heart-shape:after{content:'';position:absolute;width:50px;height:50px;background:inherit;border-radius:50%}.heart-shape:before{top:-25px;left:0}.heart-shape:after{top:0;left:25px}
#easter{background:#020306}.easter-copy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:25px;gap:28px}.easter-copy p{font-size:clamp(18px,2vw,30px);font-weight:300;line-height:1.9;letter-spacing:.08em;margin:0;opacity:0;transition:opacity 2.5s}.easter-copy p.show{opacity:1}.easter-copy .tiny-heart{font-size:20px;color:#a92b40;animation:heartbeat 3s infinite;text-shadow:0 0 24px #a92b40;opacity:0;transition:opacity 2s}.easter-copy .tiny-heart.show{opacity:1}.easter-copy p:last-child{font-size:clamp(13px,1vw,17px);color:#d1c3ad}
@media(max-width:600px){
  .sound{width:34px;height:34px;padding:0;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));background:#10162938}.sound-label{display:none}.sound-icon{margin:0}
  .maze-heading{top:clamp(43px,6vh,65px)}.eyebrow{font-size:clamp(22px,6vw,30px)}.maze-heading p{font-size:clamp(15px,4vw,18px);margin:.35em 0}
  .maze-world{width:96vw;height:min(55vh,480px);top:45%;border-radius:18px}.maze-board{left:3%;right:3%;height:77%;bottom:5%}.castle{width:96px;height:120px;top:2%;right:2%}
  .character{width:min(var(--character-width),9vw);height:min(var(--character-height),13vw)}.controls{bottom:max(4.5vh,env(safe-area-inset-bottom));gap:3px}.controls>div{gap:3px}.controls button{width:51px;height:47px}.keyboard-hint{display:none}
  .birthday-title p{font-size:clamp(42px,12.2vw,57px)}.birthday-title h1{font-size:clamp(84px,24vw,120px);margin:4px 0}.birthday-title span{font-size:clamp(18px,5vw,25px);letter-spacing:.2em;text-indent:.2em}
  .photo-main{top:36%;left:var(--photo-x,50%);width:min(88vw,43vh);height:57vh}.preset-01,.preset-02,.preset-03,.preset-04,.preset-05,.preset-06,.preset-07,.preset-08,.preset-09,.preset-10{--photo-x:50%}
  .photo-meta,#gallery[data-preset] .photo-meta{left:7%;right:7%;bottom:7%;width:auto;text-align:left;transform:translateY(17px)}.photo-meta.visible,#gallery[data-preset] .photo-meta.visible{transform:none}
  #gallery[data-preset="preset-02"] .photo-meta,#gallery[data-preset="preset-05"] .photo-meta,#gallery[data-preset="preset-09"] .photo-meta{left:7%;right:7%;bottom:7%;text-align:right}
  #gallery[data-preset="preset-03"] .photo-meta,#gallery[data-preset="preset-07"] .photo-meta,#gallery[data-preset="preset-10"] .photo-meta{left:7%;right:7%;bottom:6%;text-align:center;transform:translateY(17px)}
  #gallery[data-preset="preset-03"] .photo-meta.visible,#gallery[data-preset="preset-07"] .photo-meta.visible,#gallery[data-preset="preset-10"] .photo-meta.visible{transform:none}
  .photo-meta span{font-size:12px}.photo-meta p{font-size:15px;margin:7px 0}.photo-meta h2{font-size:clamp(18px,4.8vw,24px);line-height:1.55}
  .story-scroll{width:82vw;font-size:clamp(19px,4.8vw,22px);line-height:2.15}.story-viewport{perspective:650px}.story-intro p{font-size:45px}.story-intro span{font-size:18px}
}
@media(min-width:601px) and (max-height:720px){.maze-world{height:68vh;top:54%}.maze-heading{top:2vh}.controls{bottom:1vh}.photo-main{height:64vh;width:min(44vw,44vh)}}
@media(min-width:2200px){.maze-world{width:min(84vw,1900px);height:min(72vh,950px)}.maze-heading{top:5vh}.eyebrow{font-size:clamp(36px,2vw,48px)}.maze-heading p{font-size:clamp(20px,1vw,26px)}}

/* V0.3 · real-photo montage */
#gallery{background:#050813}
.photo-frame{transition:opacity 1.55s ease}
.photo-frame.active{opacity:1}
#birthday .birthday-halo:after{content:'';position:absolute;left:-35%;top:43%;width:170%;height:13%;background:linear-gradient(90deg,transparent 11%,#ffc8ad00 24%,#fff0c454 49%,#b8d8ff32 53%,transparent 73%);filter:blur(22px);opacity:0;transform:scaleX(.55);pointer-events:none}
#birthday.celebrating .birthday-halo:after{animation:birthdayFlare 2.4s ease-out both}
.photo-bg{filter:blur(50px) brightness(.32) saturate(.8);transform:scale(1.18)}
.photo-frame.active .photo-bg{filter:blur(42px) brightness(.38) saturate(.88);transform:scale(1.04)}
.photo-frame:after{background:radial-gradient(ellipse at 50% 44%,transparent 22%,#03061188 78%,#030611bd 100%),linear-gradient(0deg,#040711c9,transparent 28%)}
.photo-main{width:min(48vw,49vh);height:67vh;filter:drop-shadow(0 28px 58px #000d);transition:transform 6.7s var(--ease),opacity 1.65s ease,filter 1.5s ease,clip-path 1.45s var(--ease)}
.photo-frame.wide .photo-main{width:min(72vw,105vh);height:min(67vh,760px)}
.preset-01 .photo-main,.preset-07 .photo-main{object-fit:cover}.preset-01 .photo-main{object-position:center top}.preset-07 .photo-main{object-position:center 31%}
.preset-01{--photo-x:63%}.preset-02{--photo-x:36%}.preset-03{--photo-x:58%}.preset-04{--photo-x:36%}.preset-05{--photo-x:62%}.preset-06{--photo-x:62%}.preset-07{--photo-x:37%}.preset-08{--photo-x:37%}.preset-09{--photo-x:40%}.preset-10{--photo-x:35%}
.preset-01 .photo-main{transform:translate(-50%,-50%) scale(.97);filter:blur(12px) drop-shadow(0 28px 58px #000d)}.preset-01.active .photo-main{transform:translate(-50%,-50%) scale(1.04);filter:blur(0) drop-shadow(0 28px 58px #000d)}
.preset-02 .photo-main{transform:translate(calc(-50% + 10vw),-50%) rotateY(-14deg) rotate(2deg) scale(.94);filter:blur(10px)}.preset-02.active .photo-main{transform:translate(-50%,-50%) rotateY(0) rotate(0) scale(1.04);filter:blur(0)}
.preset-02:before{content:'';position:absolute;z-index:3;inset:-45%;pointer-events:none;background:linear-gradient(105deg,transparent 38%,#ffe9ae00 45%,#ffe6ac86 51%,#e8aa7052 55%,transparent 64%);opacity:0;transform:translateX(-85%) rotate(-8deg)}.preset-02.active:before{animation:lightLeak 2.2s ease-out both}
.preset-03 .photo-main{width:min(54vw,54vh);height:72vh;transform:translate(-50%,-50%) scale(1.14);filter:blur(18px);transition:transform 6.7s var(--ease),opacity 1.45s ease,filter .95s ease}.preset-03.active .photo-main{transform:translate(-50%,-50%) scale(1.04);filter:blur(0)}
.preset-03:before{content:'';position:absolute;z-index:3;inset:0;pointer-events:none;background:radial-gradient(circle at 52% 42%,#fff5dba8,transparent 31%);opacity:0}.preset-03.active:before{animation:flashLeak 1.8s ease-out both}
.preset-04 .photo-main{clip-path:inset(48% 0 48% 0);transform:translate(-50%,-50%) rotate(3deg) scale(1.08)}.preset-04.active .photo-main{clip-path:inset(0 0 0 0);transform:translate(-50%,-50%) rotate(0) scale(1)}
.preset-05 .photo-main{transform:translate(-50%,-50%) scale(.72);filter:blur(6px)}.preset-05.active .photo-main{transform:translate(-50%,-50%) scale(1.03);filter:blur(0)}.preset-05 .photo-bg{transform:translateX(-3%) scale(1.23)}.preset-05.active .photo-bg{transform:translateX(2%) scale(1.06)}
.preset-05:before{display:none}
.preset-06 .photo-main{transform:translate(-50%,-50%) rotateY(-24deg) rotateX(8deg) scale(.89);filter:blur(8px)}.preset-06.active .photo-main{transform:translate(-50%,-50%) rotateY(0) rotateX(0) scale(1.01);filter:blur(0)}.preset-06 .photo-bg{transform:translateX(3%) scale(1.17)}.preset-06.active .photo-bg{transform:translateX(-2%) scale(1.05)}
.preset-07{transition-duration:2.25s}.preset-07 .photo-main{transform:translate(-50%,-50%) scale(1.48);filter:blur(4px)}.preset-07.active .photo-main{transform:translate(-50%,-50%) scale(1);filter:blur(0)}
.preset-08 .photo-main{transform:translate(-50%,-50%) scale(1.02);filter:brightness(.22) blur(8px)}.preset-08.active .photo-main{transform:translate(-50%,-50%) scale(1.05);filter:brightness(1) blur(0)}
.preset-08:before{content:'';position:absolute;z-index:3;inset:0;border:0;pointer-events:none;background:radial-gradient(circle at 17% 23%,#ffe5a746,transparent 9%),radial-gradient(circle at 81% 39%,#ffddab38,transparent 8%),radial-gradient(circle at 56% 74%,#ffe9c021,transparent 8%);opacity:0;filter:blur(13px)}.preset-08.active:before{opacity:.62;transition:opacity 2.5s}
.preset-09 .photo-main{width:min(54vw,55vh);height:72vh;transform:translate(-50%,-50%) scale(1.34);filter:blur(9px)}.preset-09.active .photo-main{transform:translate(-50%,-50%) scale(1.09);filter:blur(0)}.preset-09 .photo-bg{filter:blur(59px) brightness(.3)}
.preset-10{transition-duration:2.4s}.preset-10 .photo-main{transform:translate(-50%,-50%) scale(.94);filter:blur(7px);transition:transform 8.2s var(--ease),opacity 2s ease,filter 1.1s ease}.preset-10.active .photo-main{transform:translate(-50%,-50%) scale(1.07);filter:blur(0)}.preset-10.leaving{opacity:0;transition-duration:1.8s}
.photo-meta{width:min(33vw,620px);isolation:isolate;transition:opacity 1.05s ease,transform 1.2s var(--ease)}
.photo-meta:before{content:'';position:absolute;z-index:-1;inset:-36px -45px;background:radial-gradient(ellipse at center,#02050bc9 0%,#02050b7d 44%,transparent 76%);filter:blur(18px);pointer-events:none}
.photo-meta.visible{opacity:1}.photo-meta.leaving{opacity:0;transition-duration:1.4s}
.photo-meta span:not(.caption-line){font-size:clamp(12px,.9vw,16px)}
.photo-meta p{font-size:clamp(15px,1.05vw,20px);opacity:0;filter:blur(6px);transform:translateY(11px);transition:opacity .85s ease,transform 1s var(--ease),filter 1s ease}
.photo-meta.visible p{opacity:1;filter:blur(0);transform:none;transition-delay:.22s}
.photo-meta h2{font-size:clamp(24px,2vw,38px);line-height:1.62;max-width:100%}
.photo-meta h2 .caption-line{font:inherit;letter-spacing:inherit;color:inherit}
.caption-line{display:block;opacity:0;filter:blur(8px);transform:translateY(18px);transition:opacity 1.25s ease,transform 1.35s var(--ease),filter 1.35s ease}
.photo-meta.visible .caption-line{opacity:1;filter:blur(0);transform:none;transition-delay:var(--line-delay)}
.caption-line+.caption-line{margin-top:.52em}
#gallery[data-preset="preset-01"] .photo-meta,#gallery[data-preset="preset-05"] .photo-meta,#gallery[data-preset="preset-06"] .photo-meta{left:8%;right:auto;bottom:13%;text-align:left}
#gallery[data-preset="preset-02"] .photo-meta,#gallery[data-preset="preset-04"] .photo-meta,#gallery[data-preset="preset-07"] .photo-meta,#gallery[data-preset="preset-08"] .photo-meta,#gallery[data-preset="preset-09"] .photo-meta,#gallery[data-preset="preset-10"] .photo-meta{left:auto;right:8%;bottom:13%;text-align:right}
#gallery[data-preset="preset-03"] .photo-meta{left:7%;right:auto;bottom:10%;width:min(35vw,680px);text-align:left;transform:translateY(20px)}
#gallery[data-preset="preset-03"] .photo-meta.visible{transform:none}
#gallery[data-preset="preset-03"] .photo-meta h2,#gallery[data-preset="preset-09"] .photo-meta h2{font-size:clamp(27px,2.2vw,42px)}
#gallery[data-preset="preset-04"] .photo-meta,#gallery[data-preset="preset-06"] .photo-meta{bottom:30%}
#gallery[data-preset="preset-10"] .photo-meta{left:auto;right:6%;bottom:12%;width:min(35vw,640px);text-align:left;transform:translateY(20px)}
#gallery[data-preset="preset-10"] .photo-meta.visible{transform:none}
#gallery[data-preset="preset-10"] .photo-meta h2{font-size:clamp(23px,1.8vw,34px);line-height:1.58}
#easter{background:radial-gradient(ellipse at 50% 46%,#14142128,transparent 52%),#020306}
#easter:before{content:'';position:absolute;inset:0;opacity:.22;pointer-events:none;background:radial-gradient(1px 1px at 19% 24%,#f3e9eb,transparent),radial-gradient(1px 1px at 83% 37%,#d8d6ed,transparent),radial-gradient(1px 1px at 66% 78%,#f1dce1,transparent)}
.easter-copy p{white-space:pre-line}.easter-copy .tiny-heart{animation:tinyPulse 3.2s ease-in-out infinite;font-size:clamp(17px,2vw,24px)}
@media(max-width:600px){
  .photo-main,.preset-03 .photo-main,.preset-09 .photo-main{top:35%;width:min(88vw,43vh);height:56vh}
  .photo-frame.wide .photo-main{top:34%;width:92vw;height:53vh}
  .preset-01,.preset-02,.preset-03,.preset-04,.preset-05,.preset-06,.preset-07,.preset-08,.preset-09,.preset-10{--photo-x:50%}
  .preset-03 .photo-main{top:32%;height:51vh}.preset-09 .photo-main{top:34%;height:56vh}.preset-10 .photo-main{top:29%;height:47vh;width:min(86vw,41vh)}
  .photo-meta,#gallery[data-preset] .photo-meta{left:6.5%;right:6.5%;bottom:max(6%,env(safe-area-inset-bottom));width:auto;text-align:left;transform:translateY(17px)}
  .photo-meta.visible,#gallery[data-preset] .photo-meta.visible{transform:none}
  #gallery[data-preset="preset-02"] .photo-meta,#gallery[data-preset="preset-04"] .photo-meta,#gallery[data-preset="preset-07"] .photo-meta,#gallery[data-preset="preset-09"] .photo-meta{left:6.5%;right:6.5%;bottom:6%;text-align:right}
  #gallery[data-preset="preset-03"] .photo-meta,#gallery[data-preset="preset-10"] .photo-meta{left:6.5%;right:6.5%;bottom:5%;width:auto;text-align:left;transform:translateY(17px)}
  #gallery[data-preset="preset-03"] .photo-meta.visible,#gallery[data-preset="preset-10"] .photo-meta.visible{transform:none}
  .photo-meta:before{inset:-25px -18px;background:radial-gradient(ellipse,#02040ee6 0%,#02040e9a 51%,transparent 79%)}
  .photo-meta span:not(.caption-line){font-size:11px}.photo-meta p{font-size:14px;margin:7px 0}
  .photo-meta h2,#gallery[data-preset="preset-03"] .photo-meta h2,#gallery[data-preset="preset-09"] .photo-meta h2{font-size:clamp(18px,5vw,25px);line-height:1.53}
  #gallery[data-preset="preset-10"] .photo-meta h2{font-size:clamp(18px,4.4vw,22px);line-height:1.38}
  .caption-line+.caption-line{margin-top:.27em}
}

/* V0.3.2 · continuous woodland terrain over the original 19 × 13 maze */
.maze-world{background-image:radial-gradient(ellipse at 88% 20%,#f4dfa122,transparent 23%),linear-gradient(180deg,#101b3480 0%,#0c2025a0 58%,#061819bb 100%),url('../assets/backgrounds/castle.jpg');transition:transform 3s var(--ease),box-shadow 2.5s ease;box-shadow:0 35px 100px #000b,inset 0 0 100px #06121cc9}
.maze-world:before{background:radial-gradient(ellipse at 85% 24%,#ffe4aa31,transparent 29%),linear-gradient(180deg,transparent 22%,#a6c5b013 46%,transparent 63%),radial-gradient(ellipse at 10% 89%,#101c22b0,transparent 40%)}
.maze-world:after{background:radial-gradient(ellipse at 95% 91%,#071c19b8,transparent 32%),radial-gradient(ellipse at 2% 10%,#102922a1,transparent 28%),radial-gradient(ellipse at 61% 43%,#d8e5d00c,transparent 42%);filter:blur(22px);animation:nebulaFloat 27s ease-in-out infinite alternate}
.maze-board{background:none;box-shadow:inset 0 0 65px #020d10a8;overflow:hidden;border-radius:18px;transition:filter 2.5s ease}
.maze-terrain{position:absolute;z-index:0;inset:0;width:100%;height:100%;pointer-events:none}
.maze-cell{z-index:1;background:none!important}
.maze-cell.wall:before,.maze-cell.tree:not(.glow-plant):after{content:none}
.maze-cell.glow-plant:after{content:'✦';left:42%;top:29%;font-size:clamp(5px,.55vw,9px);color:#d6f4c0;filter:drop-shadow(0 0 5px #c5e6a1);animation:plantGlow 4.7s ease-in-out infinite}
.maze-cell.goal:after{inset:33%;background:#fff1c1;box-shadow:0 0 15px 7px #f3d28a88}
.mountains{top:15%;opacity:.52;filter:blur(4px)}
.castle{background:none;clip-path:none;filter:drop-shadow(0 0 24px #f6df9d72);opacity:.86}
.castle:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,#a89ba0 0%,#525b69 38%,#222f44 100%);clip-path:polygon(2% 100%,2% 47%,9% 47%,9% 26%,18% 8%,27% 26%,27% 44%,39% 44%,39% 28%,48% 4%,58% 28%,58% 43%,70% 43%,70% 30%,80% 11%,90% 30%,90% 47%,98% 47%,98% 100%);box-shadow:inset 0 -28px 30px #192738a8}
.castle:after{content:'';position:absolute;left:11%;right:10%;bottom:0;height:43%;background:radial-gradient(ellipse at 51% 83%,#fbd8969c 0%,#e1af6263 15%,transparent 29%),linear-gradient(145deg,#7b7681,#354253 76%);clip-path:polygon(0 100%,0 30%,19% 30%,19% 13%,33% 13%,33% 30%,66% 30%,66% 12%,80% 12%,80% 30%,100% 30%,100% 100%);opacity:.94}
.castle i{z-index:2;top:43%;left:16%;width:7%;height:12%;border-radius:50% 50% 2px 2px;background:#ffe2a2;box-shadow:0 0 15px #ffdf91,32px 8px 11px #f6cc7f,64px -3px 10px #f6cc7f;opacity:.76}
.castle i:nth-child(2){left:47%;top:37%;width:6%;height:10%}.castle i:nth-child(3){left:76%;top:46%;width:6%;height:10%}
.castle b{z-index:2;right:14%;top:7%;font-size:clamp(8px,1vw,15px);text-shadow:0 0 15px #fff3c8}
.maze-heading{text-shadow:0 0 24px #bec9df42,0 4px 22px #050914}
.character{filter:drop-shadow(0 5px 9px #02110de0) drop-shadow(0 0 7px #f4dfb087)}
.character.walking img{animation:forestStep .38s ease-in-out infinite alternate}
.maze-world.completed{transform:translate(-50%,-50%) scale(1.025);box-shadow:0 38px 110px #000b,inset 0 0 80px #f2dda41c}
.maze-world.completed .maze-board{filter:brightness(1.13)}
.maze-world.completed .hero{margin-left:calc(-1 * clamp(11px,1.5vw,24px))}
.maze-world.completed .partner{margin-left:clamp(11px,1.5vw,24px)}
.maze-world.completed .castle{opacity:1;filter:drop-shadow(0 0 44px #ffe1a3b3);transform:scale(1.05)}
.maze-world.completed .castle i{background:#fff0b6;box-shadow:0 0 22px #fff0af,32px 8px 16px #ffe297,64px -3px 14px #ffe297}
.maze-world.completed .maze-bloom{opacity:.78}
@media(max-width:600px){.maze-world.completed{transform:translate(-50%,-50%) scale(1.01)}.castle i{box-shadow:0 0 12px #ffdf91,19px 6px 8px #f6cc7f,39px -2px 8px #f6cc7f}}