:root{--paper:#fff6e5;--ink:#433128;--red:#be3e32;--blue:#446e80;--line:#d8c6a8}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:22px}
body{margin:0;background:#e7dcc5;color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:16px;line-height:1.75;-webkit-tap-highlight-color:transparent}
main{max-width:540px;margin:auto;overflow:hidden;background:var(--paper);box-shadow:0 0 40px #43312818}
a{color:inherit}button{font:inherit}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid var(--blue);outline-offset:4px}img{display:block;max-width:100%}
.party-cover{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:9/16}
.party-background{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-3}
.party-motion{z-index:-2}
.cover-heading{position:absolute;top:18%;left:8%;right:8%;text-align:center;z-index:2}
.newspaper-meta{display:flex;justify-content:space-between;gap:8px;border-top:2px solid var(--red);border-bottom:1px solid var(--red);padding:4px 0;color:var(--red);font-size:11px;font-weight:700;letter-spacing:.06em}
h1{margin:8px -6% 4px;color:var(--red);font-size:clamp(28px,8.7vw,45px);line-height:1.3;font-weight:900;letter-spacing:.02em;text-shadow:1px 2px #e6c2a8}
.cover-name{margin:0;font-size:clamp(14px,3.8vw,18px);letter-spacing:.14em;font-weight:700}.cover-name span{padding:0 3px;color:var(--red)}
.character-stage{position:absolute;top:37%;left:10%;width:80%;height:43%;z-index:1}
.full-body{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 2px #71482b14)}
.birthday-one{position:absolute;right:-3%;top:-7%;color:var(--blue);opacity:.23;font-family:Georgia,serif;font-size:clamp(170px,50vw,260px);font-weight:700;line-height:1}
.age-stamp{position:absolute;left:7%;top:8%;z-index:2;transform:rotate(-13deg);border:3px double var(--red);color:var(--red);font-size:20px;font-weight:800;letter-spacing:.15em;padding:2px 7px;background:#fff8e5c9}
.cover-caption{position:absolute;left:7%;right:7%;bottom:10%;z-index:2;margin:0;text-align:center;color:var(--red);font-size:clamp(14px,4.1vw,20px);font-weight:700;letter-spacing:.05em}
.motion-toggle{position:absolute;z-index:5;right:14px;top:12px;border:1px solid #79665065;background:#fff9e4df;color:#594635;border-radius:20px;padding:4px 10px;font-size:12px;min-height:32px;cursor:pointer}
.cover-ticket{position:relative;z-index:3;margin:-22px 24px 0;background:#fff9e9;border:1px dashed var(--red);box-shadow:3px 4px 0 #be3e321a;padding:17px 12px;text-align:center}
.ticket-kicker{margin:0 0 4px;color:var(--red);font-size:13px;letter-spacing:.15em}
.ticket-date{font-family:Georgia,"Microsoft YaHei",serif;font-size:29px;font-weight:700;line-height:1.5;margin:0}.ticket-date span{display:block;font-family:"Microsoft YaHei",sans-serif;font-size:15px;letter-spacing:.1em}
.ticket-place{margin:7px 0 0;font-size:15px}.scroll-link{display:flex;flex-direction:column;align-items:center;gap:1px;text-decoration:none;font-size:13px;letter-spacing:.06em;color:var(--blue);padding:20px 0 22px}.scroll-link span:last-child{font-size:23px;line-height:1.2}
.paper-section{padding:34px 24px 44px;background:linear-gradient(90deg,#bd966706 1px,transparent 1px),var(--paper);background-size:8px 100%;scroll-margin-top:20px}
.issue-line{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);padding:5px 0;margin-bottom:27px;font-size:12px;letter-spacing:.08em;font-weight:700}
.section-heading{text-align:center}.eyebrow{font-family:Georgia,serif;color:var(--blue);font-size:11px;letter-spacing:.13em;margin:0 0 7px}h2{font-size:29px;font-weight:800;margin:0 0 12px;color:var(--red);line-height:1.4}.section-heading>p:last-child:not(.eyebrow){margin:0;font-size:15px}
.memory{margin:34px 0 0;text-align:center}.memory-label{display:flex;justify-content:center;align-items:center;gap:9px;margin-bottom:16px}.chapter-number{font-family:Georgia,serif;font-size:22px;font-style:italic;color:var(--red)}h3{margin:0;font-size:18px;font-weight:700}.memory-label h3{letter-spacing:.05em}
.photo-button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}.photo-button img{width:100%;height:auto}.memory>.photo-button{border:7px solid #fffdf5;box-shadow:2px 4px 0 #43312818;outline:1px solid #d9c9ab}
.wide-photo{transform:rotate(-1.5deg)}.portrait-photo{max-width:280px;margin:0 auto;transform:rotate(1.5deg)}.portrait-photo img{aspect-ratio:5/6;object-fit:cover;object-position:50% 42%}.one-photo{transform:rotate(-1.3deg)}.one-photo img{aspect-ratio:4/5;object-position:50% 69%}
.hand-note{font-size:14px;margin:14px 0 0;color:var(--blue);letter-spacing:.02em}.moments-section{background:var(--paper)}
.snapshot-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin:35px 0}.snapshot{margin:0;background:#fffdf5;border:1px solid #d9c9ab;padding:7px 7px 11px;box-shadow:2px 4px 0 #43312814;transform:rotate(-3deg)}.snapshot:nth-child(2){transform:rotate(3deg);margin-top:14px}.snapshot img{aspect-ratio:4/5;object-fit:cover}.snapshot figcaption{font-size:12px;margin-top:7px;text-align:center;color:var(--blue)}.family-frame{margin:28px 0 0;padding:8px 8px 14px;background:#fffdf5;border:1px solid #d9c9ab;box-shadow:2px 4px 0 #43312814}.family-frame img{aspect-ratio:3/2;object-fit:cover}.family-frame figcaption{text-align:center;font-size:14px;margin-top:10px;color:var(--blue)}
.invitation-copy{text-align:center;font-size:16px;line-height:2.1;margin:23px 0 29px}.invitation-copy strong{color:var(--red)}
.event-card{padding:24px 20px;background:#fff6e5;border:1px dashed var(--red);box-shadow:4px 5px 0 #be3e3216;text-align:center}.event-kicker{margin:0 0 20px;font-size:12px;color:var(--red);letter-spacing:.07em}.event-date{display:flex;flex-direction:column;align-items:center}.event-year{font-family:Georgia,serif;font-size:20px;letter-spacing:.22em;color:var(--blue)}.event-date strong{font-family:Georgia,"Microsoft YaHei",serif;font-size:39px;line-height:1.45;color:var(--red)}.event-date>span:last-child{font-size:16px;letter-spacing:.06em}.ticket-divider{margin:23px -20px;border-top:1px dashed var(--line)}.event-card h3{font-size:24px;color:var(--red)}.floor{margin:6px 0 14px;font-size:14px;color:var(--blue)}.room-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-width:300px;margin:auto}.room-grid span{border:1px solid var(--line);padding:6px 4px;font-size:16px;background:#fcf4df}.address{font-size:16px;margin:18px 0 20px;line-height:1.8}.map-button{display:flex;align-items:center;justify-content:center;gap:17px;min-height:50px;background:var(--red);color:#fff8e6;font-size:16px;font-weight:700;text-decoration:none;box-shadow:3px 3px 0 #8b291e}.parking{margin:24px 0 0;padding-top:18px;border-top:1px solid var(--line);text-align:left;font-size:14px;line-height:1.9;color:#75614d}.parking strong{color:var(--blue)}
.closing-note{text-align:center;margin:34px 0 16px}.closing-character{width:128px;height:137px;object-fit:contain;margin:0 auto 12px}.closing-note p{margin:0;font-size:16px}.closing-sign{display:block;color:var(--red);font-size:14px;letter-spacing:.18em;margin-top:12px}.poster-link{display:block;text-align:center;font-size:14px;color:var(--blue);margin:22px auto 0;padding:10px;min-height:44px}
.page-footer{text-align:center;font-size:12px;color:#8d7861;padding:10px 12px 95px;background:var(--paper)}
.bottom-nav{position:fixed;z-index:10;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:540px;display:flex;align-items:center;justify-content:space-evenly;padding:6px 18px calc(6px + env(safe-area-inset-bottom));background:#fff6e5ed;border-top:1px solid #cdb691;backdrop-filter:blur(10px)}.bottom-nav a{flex:1;text-align:center;min-height:46px;padding:9px 0;text-decoration:none;font-size:15px;color:var(--red);font-weight:700}.bottom-nav span{color:var(--blue);font-size:24px;margin:0 10px}
dialog{border:0;padding:54px 18px 22px;background:#fff6e5;color:var(--ink);width:min(94vw,700px);max-height:92vh;box-shadow:0 20px 80px #0005}dialog::backdrop{background:#2e261ddd;backdrop-filter:blur(4px)}dialog figure{margin:0}dialog img{width:100%;max-height:73vh;object-fit:contain}dialog figcaption{text-align:center;font-size:14px;padding:15px 5px 0}.close-photo{position:absolute;right:10px;top:5px;border:0;background:none;color:var(--red);font-size:35px;min-width:44px;min-height:44px;cursor:pointer}.dialog-fallback{position:fixed;inset:5vh 3vw;z-index:100;display:block}
.reveal.will-reveal{opacity:0;transform:translateY(15px);transition:opacity .6s ease,transform .6s ease}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:360px){.newspaper-meta{font-size:10px}.ticket-date{font-size:26px}.paper-section{padding-left:20px;padding-right:20px}.event-card{padding-left:16px;padding-right:16px}.ticket-divider{margin-left:-16px;margin-right:-16px}.event-date strong{font-size:34px}.event-card h3{font-size:22px}.room-grid span{font-size:15px}.age-stamp{font-size:17px;left:4%}.snapshot-grid{gap:13px}}
@media(min-width:600px){.paper-section{padding-left:42px;padding-right:42px}.cover-name{font-size:18px}.age-stamp{font-size:25px}.cover-ticket{margin-left:40px;margin-right:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal.will-reveal{opacity:1;transform:none;transition:none}}

.cover-caption{left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:90%;padding:4px 9px;background:#fff6e5dd;line-height:1.6;border-top:1px solid #be3e3245;border-bottom:1px solid #be3e3245;white-space:nowrap}
/* Paper palette sampled from the user-approved reference. */
#home{background:#fff6e5}
.party-cover{background:#fff6e5}
.party-background{filter:brightness(1.055);mix-blend-mode:multiply}
.cover-name{color:#713f48}
.cover-caption{background:#fff6e5ed}
.motion-toggle{background:#fff6e5ed;border-color:#ad687b65;color:#713f48}
.cover-ticket{background:#fff6e5;border-color:#c36b7b;box-shadow:3px 4px 0 #bc607e1c}

.hundred-photo{max-width:360px}.hundred-photo img{aspect-ratio:4/5;object-fit:cover;object-position:50% 100%;height:auto}

.closing-avatar{position:relative;display:grid;place-items:center;width:176px;height:176px;margin:0 auto 15px}
.closing-avatar .closing-character{width:176px;height:176px;margin:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 3px 2px #98643f14);transform-origin:50% 80%;animation:closing-baby-sway 4.8s ease-in-out infinite}
.closing-star{position:absolute;font-size:21px;line-height:1;color:var(--red);pointer-events:none;animation:closing-star-twinkle 2.6s ease-in-out infinite}
.star-left{left:0;top:43px;animation-delay:-.8s}.star-right{right:2px;top:16px;color:var(--blue);font-size:25px;animation-delay:-1.7s}.star-heart{right:4px;bottom:14px;font-size:22px;animation-delay:-.3s}
@keyframes closing-baby-sway{0%,100%{transform:translateY(2px) rotate(-3deg)}50%{transform:translateY(-5px) rotate(3deg)}}
@keyframes closing-star-twinkle{0%,100%{opacity:.45;transform:translateY(2px) scale(.8) rotate(-8deg)}50%{opacity:1;transform:translateY(-3px) scale(1.1) rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.closing-avatar .closing-character,.closing-star{animation:none}}


.album-pair{display:grid;gap:22px;margin:29px 0 32px}.album-print{margin:0;padding:7px 7px 12px;background:#fffdf5;border:1px solid #d9c9ab;box-shadow:2px 4px 0 #43312814;transform:rotate(-.65deg)}.album-print:nth-child(2){transform:rotate(.65deg)}.album-print img{height:auto;aspect-ratio:2/1;object-fit:contain}.album-print figcaption{font-size:14px;line-height:1.6;text-align:center;color:var(--blue);margin-top:9px}

.pink-snapshot img{object-position:50% 100%}
.bottom-nav .music-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;flex:0 0 82px;min-height:48px;padding:2px 4px;border:0;background:transparent;color:var(--blue);cursor:pointer;line-height:1.2}
.bottom-nav .music-toggle span{margin:0;color:inherit}
.bottom-nav .music-toggle .music-icon{display:grid;place-items:center;width:26px;height:26px;font-size:20px;border:1px solid currentColor;border-radius:50%}
.bottom-nav .music-toggle .music-label{font-size:10px;white-space:nowrap;letter-spacing:.03em}
.music-toggle.is-playing .music-icon{animation:music-record-turn 8s linear infinite}
@keyframes music-record-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.music-toggle.is-playing .music-icon{animation:none}}