:root{
  --red:#B92832;--red2:#8F1E27;--gold:#F0D253;--sand:#DDBD70;--blue:#526FB3;
  --ink:#1C1C1C;--paper:#F6EEDC;--paper2:#FFF9ED;--line:#D8C5A1;--white:#fff;
  --shadow:0 18px 50px rgba(62,36,18,.14);--radius:26px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:#2a211b;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}body.is-locked{overflow:hidden}
img{max-width:100%;display:block}a{color:inherit}.paper-noise{position:fixed;inset:0;pointer-events:none;z-index:999;opacity:.12;mix-blend-mode:multiply;background-image:radial-gradient(#7f5b31 .55px,transparent .7px);background-size:8px 8px}
main{overflow:hidden}.section{position:relative;padding:88px 18px}.section-inner{position:relative;z-index:3;max-width:1080px;margin:auto}.narrow{max-width:720px}.eyebrow{font-size:.72rem;letter-spacing:.23em;font-weight:900;color:var(--red);margin:0 0 12px}.section-heading{text-align:center;max-width:680px;margin:0 auto 42px}.section-heading h2{font-family:Georgia,serif;font-size:clamp(2.2rem,6vw,4.2rem);margin:.1em 0;color:#3a2417;line-height:.98}.section-heading p{line-height:1.8;color:#6c5a4d}.btn{border:0;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;font-weight:900;cursor:pointer;transition:.25s transform,.25s box-shadow,.25s background}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--red);color:#fff;box-shadow:0 8px 20px rgba(185,40,50,.28)}.btn-dark{background:var(--ink);color:#fff}.btn-outline{border:1.5px solid #8a6e4a;background:transparent;color:#5a402b}.section-bg{position:absolute;inset:0;z-index:0;pointer-events:none}.parchment-bg{background:url('assets/decorative/one-piece-background.webp') center top/cover no-repeat;opacity:.19}.parchment-soft{opacity:.12}.crew-bg{background:url('assets/decorative/one-piece-background.webp') center/cover no-repeat;opacity:.28}.heading-emblem{width:120px;margin:0 auto 8px}

/* welcome */
.welcome-screen{position:fixed;z-index:1000;inset:0;background:linear-gradient(#fffaf1,#efe0bd);display:grid;place-items:center;padding:14px 18px 150px;overflow:hidden}.welcome-card{z-index:5;text-align:center;width:min(520px,92vw);padding:12px 20px}.welcome-card h1{font:700 clamp(2.7rem,10vw,5rem)/.95 Georgia,serif;margin:7px 0 12px;color:#351f16}.welcome-card h1 span{display:block}.welcome-card h1 b{display:block;color:var(--red);font-size:.7em;margin:.05em}.welcome-hat{width:152px;margin:0 auto -8px;filter:drop-shadow(0 12px 16px rgba(85,46,18,.18));animation:floatHat 4s ease-in-out infinite}.welcome-date{font-weight:900;letter-spacing:.08em}.guest-line{margin:20px 0 18px;line-height:1.65}.mini-kicker{font-size:.7rem;font-weight:900;letter-spacing:.28em}.welcome-qr{margin:16px auto 0;display:flex;flex-direction:column;align-items:center;gap:4px}.welcome-qr p{font-size:.66rem;font-weight:900;letter-spacing:.16em;margin:0;color:#765a3b}.welcome-qr strong{font-size:.84rem}.dummy-qr{width:86px;height:86px;padding:6px;background:#fff;border-radius:10px;box-shadow:0 8px 20px rgba(75,49,24,.14)}
.welcome-cloud{position:absolute;width:min(620px,70vw);opacity:.85;z-index:1}.cloud-left{left:-18vw;top:-5vw}.cloud-right{right:-18vw;top:19vh}.welcome-screen.opening{animation:welcomeOut .95s cubic-bezier(.7,0,.2,1) forwards}.welcome-screen.opening .welcome-card{animation:cardOut .72s ease forwards}
@keyframes floatHat{50%{transform:translateY(-8px) rotate(-2deg)}}@keyframes welcomeOut{to{opacity:0;visibility:hidden;transform:scale(1.04)}}@keyframes cardOut{to{opacity:0;transform:translateY(-30px)}}

/* wave layers */
.wave-stack{position:absolute;left:0;right:0;bottom:0;height:145px;overflow:hidden;z-index:4;pointer-events:none}.wave-track,.foam-track{position:absolute;left:0;display:flex;width:200%;will-change:transform}.wave-track img,.foam-track img{width:50%;max-width:none;height:auto;flex:0 0 50%}.wave-back{bottom:52px;opacity:.68;animation:waveLeft 16s linear infinite}.wave-front{bottom:8px;animation:waveRight 11s linear infinite}.foam-track{bottom:0;opacity:.85;animation:foamDrift 8s ease-in-out infinite alternate}.welcome-wave-stack{height:155px}.section-wave-stack{height:170px}.section-wave-stack .wave-back{bottom:58px}.section-wave-stack .wave-front{bottom:10px}@keyframes waveLeft{to{transform:translateX(-50%)}}@keyframes waveRight{from{transform:translateX(-50%)}to{transform:translateX(0)}}@keyframes foamDrift{from{transform:translateX(-4%) translateY(2px)}to{transform:translateX(-10%) translateY(-4px)}}

/* hero */
.hero{min-height:850px;display:grid;place-items:center;background:linear-gradient(180deg,#fff9e9 0,#f3dfad 70%,#8ac8e9 100%);padding-top:95px;padding-bottom:170px}.hero-inner{text-align:center;z-index:3;max-width:760px}.hero-photo-wrap{width:min(540px,88vw);aspect-ratio:4/3;margin:24px auto;position:relative}.hero-photo{position:absolute;width:73%;height:71%;object-fit:cover;left:13.4%;top:13.7%;border-radius:25px}.hero-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 25px rgba(76,44,15,.14))}.hero-names{font:700 clamp(3rem,8vw,5.7rem)/.9 Georgia,serif;margin:0;color:#3c2418}.hero-names b{color:var(--red);margin:0 .2em}.hero-copy{max-width:560px;margin:18px auto;line-height:1.8}.date-badge{display:inline-flex;align-items:center;gap:12px;border:1px solid #ae8b51;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.62)}.date-badge span{font:700 2rem Georgia,serif;color:var(--red)}.date-badge small{font-weight:900;letter-spacing:.12em}.hero-cloud{position:absolute;z-index:1;opacity:.52;width:620px}.hero-cloud-left{left:-270px;top:130px}.hero-cloud-right{right:-290px;top:320px}

/* couple */
.couple{background:linear-gradient(180deg,#f8f0df,#fff8e9)}.wanted-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;align-items:start}.wanted-card{text-align:center}.wanted-visual{position:relative;aspect-ratio:1122/1402;width:min(440px,100%);margin:auto}.wanted-photo{position:absolute;left:17%;top:27%;width:66%;height:48%;object-fit:cover;border-radius:4px;filter:saturate(.85) sepia(.08)}.wanted-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 16px 30px rgba(59,36,15,.14))}.wanted-card h3{font:700 2.3rem Georgia,serif;margin:14px 0 6px;color:#4b2f20}.wanted-card p{color:#6f5e50;line-height:1.7;margin:0 auto 12px;max-width:340px}.instagram-btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;background:#fff7e7;border:1px solid #d8b876;border-radius:999px;padding:7px 13px 7px 7px;box-shadow:0 8px 18px rgba(72,45,20,.08);font-size:.78rem;font-weight:900}.instagram-btn small{font-weight:700;color:#876f5c}.ig-medallion{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#f7db74,#c99028);color:#633e13;border:1px solid #8d621e;font-size:1.1rem;box-shadow:inset 0 2px 2px #fff7}.rope-divider{width:min(900px,100%);margin:45px auto -25px}

/* crew */
.crew{background:#f0e0bf;overflow:hidden}.crew .section-heading{margin-bottom:24px}.crew-scroller{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:14px max(20px,calc((100vw - 1080px)/2)) 18px;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);scrollbar-width:none}.crew-scroller::-webkit-scrollbar{display:none}.crew-scroller article{flex:0 0 min(72vw,260px);height:390px;position:relative;scroll-snap-align:center;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,#fff7e8,#ddbd70);border:1px solid rgba(110,74,34,.22);box-shadow:0 14px 30px rgba(60,38,18,.12)}.crew-scroller img{width:100%;height:100%;object-fit:contain;object-position:center bottom;padding:10px 6px 38px;filter:drop-shadow(0 12px 12px rgba(30,20,10,.13))}.crew-scroller span{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);background:rgba(28,28,28,.86);color:#fff;padding:6px 12px;border-radius:999px;font-size:.68rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.swipe-hint{text-align:center;font-size:.72rem;color:#806b55;margin:10px 0 0}

/* event */
.event{background:#e8f2f4;min-height:960px}.island{position:absolute;width:min(500px,48vw);z-index:1;opacity:.76}.island-left{left:-170px;bottom:20px}.island-right{right:-180px;top:200px}.event-map{position:relative;width:min(760px,100%);min-height:660px;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:110px 90px}.event-map-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:-1}.event-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;width:100%}.event-card{background:rgba(255,249,234,.84);border:1px solid rgba(96,66,35,.2);border-radius:18px;padding:24px;text-align:center;backdrop-filter:blur(4px)}.event-card h3{font:700 1.8rem Georgia,serif;margin:7px 0}.event-label{font-size:.68rem;letter-spacing:.18em;font-weight:900;color:var(--red)}.event-card p{line-height:1.6;color:#5c4c41}.event-map .btn{margin-top:18px}.event-ornaments{display:flex;justify-content:center;align-items:center;margin-top:-70px}.event-ornaments img{width:180px;margin:0 -10px;filter:drop-shadow(0 14px 20px rgba(0,0,0,.12))}

/* journey */
.journey{background:#f7ead0}.route-map{width:min(620px,90vw);margin:-20px auto 25px}.story-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.story-card{background:#fff8ea;border:1px solid #dbc49b;padding:14px 14px 22px;border-radius:24px;box-shadow:0 14px 35px rgba(91,59,26,.08);transform:rotate(-1deg)}.story-card:nth-child(2){transform:rotate(1.3deg) translateY(25px)}.story-card:nth-child(3){transform:rotate(-.7deg)}.story-card img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:16px}.story-card span{display:block;font-size:.68rem;letter-spacing:.12em;font-weight:900;color:var(--red);margin-top:17px}.story-card h3{font:700 1.5rem Georgia,serif;margin:6px 0}.story-card p{font-size:.92rem;line-height:1.7;color:#67594d}.journey-ship{width:min(580px,90vw);margin:60px auto -100px;filter:drop-shadow(0 20px 22px rgba(40,70,80,.18))}

/* gallery slider */
.gallery{padding-top:140px;background:#fff8e9}.gallery-shell{position:relative;padding:48px 56px 36px}.gallery-slider{overflow:hidden;border-radius:28px;box-shadow:0 18px 40px rgba(67,41,17,.12);background:#ecd8aa;touch-action:pan-y}.gallery-track{display:flex;transition:transform .48s cubic-bezier(.22,.7,.24,1);will-change:transform}.gallery-slide{margin:0;flex:0 0 100%;position:relative;aspect-ratio:4/5;overflow:hidden;background:#ddd}.gallery-slide img{width:100%;height:100%;object-fit:cover}.gallery-slide figcaption{position:absolute;left:16px;bottom:16px;background:rgba(28,28,28,.7);color:#fff;padding:7px 11px;border-radius:999px;font-size:.7rem;font-weight:900;letter-spacing:.08em}.gallery-corner{position:absolute;width:240px;z-index:4;pointer-events:none;filter:drop-shadow(0 10px 16px rgba(0,0,0,.09))}.gallery-corner-left{left:-55px;top:-25px}.gallery-corner-right{right:-55px;bottom:-35px}.gallery-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px}.gallery-controls>button{width:42px;height:42px;border-radius:50%;border:1px solid #b79761;background:#fff7e8;color:#54351f;font-size:1.7rem;cursor:pointer}.gallery-dots{display:flex;gap:6px;max-width:240px;overflow:hidden}.gallery-dots button{width:7px;height:7px;border:0;border-radius:50%;padding:0;background:#c8ad7f;cursor:pointer}.gallery-dots button.active{width:22px;border-radius:99px;background:var(--red)}

/* forms */
.rsvp{background:#e8f2f4}.rsvp-snail{width:150px;margin:0 auto -5px}.form-card{background:#fffaf0;border:1px solid #dec9a7;border-radius:28px;padding:30px;box-shadow:var(--shadow)}.form-card label{display:block;font-size:.82rem;font-weight:800;margin-bottom:18px;color:#533b2b}.form-card input,.form-card select,.form-card textarea{width:100%;border:1px solid #d8c5a1;background:#fff;padding:14px 15px;border-radius:14px;font:inherit;margin-top:8px;color:#2f261f}.form-card fieldset{border:0;padding:0;margin:0 0 18px}.form-card legend{font-size:.82rem;font-weight:800;margin-bottom:9px}.choice-row{display:flex;gap:10px}.choice{flex:1;margin:0!important}.choice input{position:absolute;opacity:0}.choice span{display:block;padding:13px;text-align:center;border:1px solid #d7c29f;border-radius:14px;background:white}.choice input:checked+span{background:var(--red);color:white;border-color:var(--red)}.form-status{min-height:20px;font-size:.85rem;color:#3b6b40}.wishes{background:#f7ead0}.wish-wall{display:grid;gap:14px;margin-top:18px;max-height:420px;overflow:auto;padding-right:4px}.wish-card{background:#fff8ea;border-left:5px solid var(--red);padding:18px 20px;border-radius:16px;box-shadow:0 8px 18px rgba(71,48,27,.05)}.wish-card p{margin:8px 0;line-height:1.65}.wish-card time{font-size:.72rem;color:#917a66}.gift{background:#fff8e9}.gift-visual{position:relative;width:min(420px,90vw);margin:-20px auto}.gift-coins{position:absolute!important;width:150px!important;right:-40px!important;bottom:25px!important}.bank-card{text-align:center;background:#fff;border:1px solid #d8c5a1;border-radius:22px;padding:25px;box-shadow:var(--shadow);display:grid;gap:7px;max-width:430px;margin:auto}.bank-card span{font-weight:900;color:var(--red)}.bank-card strong{font:700 1.8rem Georgia,serif;letter-spacing:.08em}.bank-card small{color:#796858}.bank-card .btn{margin-top:8px}

/* closing */
.closing{min-height:850px;padding:110px 20px;background:#1f2f45;color:#fff;display:grid;place-items:center;overflow:hidden}.closing-sunset{position:absolute;inset:0}.closing-sunset img{width:100%;height:100%;object-fit:cover;filter:brightness(.62) saturate(.9)}.closing-sunset:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,26,38,.12),rgba(19,24,35,.85))}.closing-inner{position:relative;z-index:2;text-align:center;max-width:760px}.closing-ship{width:min(520px,90vw);margin:0 auto -20px;filter:drop-shadow(0 25px 30px rgba(0,0,0,.25))}.eyebrow.light{color:#f8d56e}.closing h2{font:700 clamp(2.5rem,7vw,5.2rem)/.96 Georgia,serif;margin:.25em 0;color:#fff}.closing p{line-height:1.8;color:#f3e8d6}.closing h3{font:700 2rem Georgia,serif}.closing-mark{width:170px;margin:15px auto 0}

/* nav + music */

.music-player{position:fixed;z-index:910;right:12px;bottom:68px;width:72px;height:72px;border:0;background:transparent;padding:0;cursor:pointer;opacity:0;pointer-events:none;transition:.3s}.music-player.show{opacity:1;pointer-events:auto}.music-disc{position:absolute;inset:0;border-radius:50%;overflow:hidden;filter:drop-shadow(0 9px 16px rgba(0,0,0,.3))}.music-disc img{width:100%;height:100%;object-fit:contain}.music-player.is-playing .music-disc{animation:spin 9s linear infinite}.music-state{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#f1c84f;color:#4a2b12;font-size:11px;font-weight:900;box-shadow:0 4px 10px rgba(0,0,0,.25)}.music-caption{position:absolute;top:-17px;left:50%;transform:translateX(-50%);background:#1c1c1c;color:#fff;font-size:9px;padding:3px 7px;border-radius:99px;letter-spacing:.08em}.music-player.is-playing .music-state{font-size:0}.music-player.is-playing .music-state:after{content:"Ⅱ";font-size:11px}@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;z-index:1200;left:50%;top:18px;transform:translate(-50%,-20px);background:#1c1c1c;color:#fff;padding:10px 16px;border-radius:999px;font-size:.84rem;opacity:0;pointer-events:none;transition:.3s}.toast.show{opacity:1;transform:translate(-50%,0)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}.reveal.from-left{transform:translate(-34px,12px)}.reveal.from-right{transform:translate(34px,12px)}.reveal.visible{opacity:1!important;transform:none!important}

@media(min-width:761px){.gallery-slider{max-width:520px;margin:auto}.crew-scroller article{flex-basis:240px}}
@media(max-width:760px){
  .section{padding:70px 15px}.section-heading{margin-bottom:30px}.section-heading h2{font-size:2.55rem}
  .welcome-screen{padding:10px 12px 142px}.welcome-cloud{width:125vw}.cloud-left{left:-68vw}.cloud-right{right:-72vw}.welcome-hat{width:125px}.welcome-card h1{font-size:3rem}.welcome-date{font-size:.9rem}.guest-line{font-size:.88rem;margin:16px 0 14px}.welcome-qr{margin-top:12px}.dummy-qr{width:76px;height:76px}.welcome-wave-stack{height:130px}.wave-stack{height:130px}.wave-back{bottom:44px}.wave-front{bottom:5px}
  .hero{min-height:760px;padding-top:74px;padding-bottom:145px}.hero-photo-wrap{width:96vw;margin-left:50%;transform:translateX(-50%)}.hero-names span{display:block}.hero-names b{display:block;margin:.05em}.hero-cloud{width:410px}.hero-cloud-left{left:-260px;top:130px}.hero-cloud-right{right:-280px;top:310px}.section-wave-stack{height:145px}
  .wanted-grid{grid-template-columns:1fr;gap:52px}.wanted-visual{width:min(360px,100%)}.rope-divider{width:170%;margin-left:-35%}.instagram-btn{padding-right:11px}
  .crew{padding-left:0;padding-right:0}.crew .section-heading{padding:0 16px}.crew-scroller article{flex-basis:68vw;height:365px}.crew-scroller{padding-left:16vw;padding-right:16vw}
  .event{min-height:940px}.island{width:340px;opacity:.4}.island-left{left:-180px}.island-right{right:-190px}.event-map{min-height:650px;padding:115px 34px}.event-cards{grid-template-columns:1fr;gap:10px}.event-card{padding:17px}.event-map .btn{margin-top:12px}.event-ornaments{margin-top:-55px}.event-ornaments img{width:135px}
  .story-grid{grid-template-columns:1fr;gap:24px}.story-card,.story-card:nth-child(2),.story-card:nth-child(3){transform:none}.story-card img{aspect-ratio:16/10}.journey-ship{margin-top:30px;margin-bottom:-75px}
  .gallery{padding-top:110px}.gallery-shell{padding:25px 0 10px}.gallery-slider{border-radius:22px}.gallery-slide{aspect-ratio:4/5}.gallery-corner{width:160px}.gallery-corner-left{left:-62px;top:-42px}.gallery-corner-right{right:-62px;bottom:-40px}.gallery-controls{margin-top:14px}.gallery-dots{max-width:150px}.gallery-controls>button{width:38px;height:38px}
  .form-card{padding:22px}.choice-row{flex-direction:column}.gift-visual{width:320px}.gift-coins{width:110px!important;right:-25px!important}.closing{min-height:760px}.closing-ship{width:360px}.closing-mark{width:130px}
  .music-player{width:62px;height:62px;right:9px;bottom:62px}.music-caption{display:none}
}
@media(max-height:740px) and (max-width:760px){.welcome-hat{width:105px}.welcome-card h1{font-size:2.55rem}.guest-line{margin:12px 0}.welcome-qr{margin-top:9px}.dummy-qr{width:64px;height:64px}.welcome-screen{padding-bottom:115px}.welcome-wave-stack{height:105px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* v1.2.0 refinements */
.section-has-nakama{overflow:hidden}
.section-has-nakama .section-inner,.section-has-nakama .hero-inner,.section-has-nakama .closing-inner{position:relative;z-index:2}
.section-map-bg{position:absolute;inset:0;pointer-events:none;z-index:0;opacity:.08;background:url('assets/decorative/event-map-card.webp') center/cover no-repeat;mix-blend-mode:multiply}
.map-soft{opacity:.07}.map-strong{opacity:.11}
.nakama-decor{position:absolute;z-index:1;pointer-events:none;filter:drop-shadow(0 10px 18px rgba(70,40,20,.16));opacity:.96;transform-origin:center bottom}
.decor-hero-luffy{width:min(31vw,170px);right:-20px;top:110px}
.decor-couple-nami{width:min(28vw,140px);left:-18px;top:120px}
.decor-couple-sanji{width:min(28vw,138px);right:-18px;bottom:120px}
.decor-event-zoro{width:min(27vw,132px);left:-14px;bottom:120px}
.decor-event-robin{width:min(27vw,132px);right:-14px;top:120px}
.decor-journey-usopp{width:min(26vw,126px);right:-14px;top:110px}
.decor-journey-chopper{width:min(23vw,110px);left:-10px;bottom:110px}
.decor-gallery-franky{width:min(28vw,140px);left:-16px;top:150px}
.decor-gallery-brook{width:min(28vw,140px);right:-16px;bottom:118px}
.decor-rsvp-jinbei{width:min(29vw,145px);right:-14px;bottom:80px}
.decor-wishes-chopper{width:min(22vw,105px);left:-8px;top:120px}
.decor-gift-nami{width:min(27vw,135px);left:-10px;bottom:65px}
.decor-closing-brook{width:min(28vw,145px);left:-10px;bottom:100px;z-index:2;opacity:.9}

.wave-back{animation:waveSwayLeft 10s ease-in-out infinite alternate}
.wave-front{animation:waveSwayRight 8s ease-in-out infinite alternate}
.foam-track{animation:foamSway 7s ease-in-out infinite alternate}
@keyframes waveSwayLeft{from{transform:translateX(0)}to{transform:translateX(-8%)}}
@keyframes waveSwayRight{from{transform:translateX(-8%)}to{transform:translateX(0)}}
@keyframes foamSway{from{transform:translateX(-2%)}to{transform:translateX(2%)}}

.rope-divider{display:block;width:min(980px,128%);margin:24px auto 0;transform:translateX(0)}
.closing-mark{display:block;object-fit:contain;object-position:center;margin:18px auto 0}
.instagram-btn{gap:8px}.ig-medallion{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#f4d16e;color:#5a3419;font-size:13px;box-shadow:0 5px 12px rgba(0,0,0,.12)}

@media(max-width:760px){
  .section-map-bg{background-position:center}
  .decor-hero-luffy{width:112px;right:-22px;top:92px;opacity:.88}
  .decor-couple-nami{width:96px;left:-24px;top:150px}
  .decor-couple-sanji{width:94px;right:-24px;bottom:140px}
  .decor-event-zoro{width:92px;left:-22px;bottom:210px}
  .decor-event-robin{width:90px;right:-22px;top:150px}
  .decor-journey-usopp{width:92px;right:-22px;top:164px}
  .decor-journey-chopper{width:78px;left:-18px;bottom:115px}
  .decor-gallery-franky{width:92px;left:-20px;top:165px}
  .decor-gallery-brook{width:90px;right:-20px;bottom:104px}
  .decor-rsvp-jinbei{width:96px;right:-22px;bottom:110px}
  .decor-wishes-chopper{width:78px;left:-18px;top:140px}
  .decor-gift-nami{width:92px;left:-22px;bottom:94px}
  .decor-closing-brook{width:92px;left:-18px;bottom:152px}
  .rope-divider{width:140%;margin-left:-20%;margin-top:16px}
}


/* v1.2.1 wave refinement + Nami placement */
.wave-stack{overflow:hidden}
.wave-track,.foam-track{width:230%;left:-15%;display:flex;align-items:flex-end}
.wave-track img,.foam-track img{width:58%;flex:0 0 58%;max-width:none;height:auto}
.wave-track img + img,.foam-track img + img{margin-left:-6%}
.wave-back{bottom:50px;opacity:.78;animation:waveBackSway 5.8s ease-in-out infinite alternate}
.wave-front{bottom:4px;animation:waveFrontSway 4.6s ease-in-out infinite alternate}
.foam-track{bottom:-2px;opacity:.92;animation:foamGentleSway 4.2s ease-in-out infinite alternate}
.section-wave-stack .wave-back{bottom:56px}.section-wave-stack .wave-front{bottom:8px}
@keyframes waveBackSway{from{transform:translateX(-2.2%)}to{transform:translateX(2.2%)}}
@keyframes waveFrontSway{from{transform:translateX(2.8%)}to{transform:translateX(-2.8%)}}
@keyframes foamGentleSway{from{transform:translateX(-1.6%)}to{transform:translateX(1.6%)}}

.decor-couple-robin{width:min(28vw,140px);left:-18px;top:120px}
.decor-gift-nami{width:min(29vw,145px);left:-8px;bottom:54px;opacity:.98}

@media(max-width:760px){
  .wave-track,.foam-track{width:250%;left:-22%}
  .wave-track img,.foam-track img{width:64%;flex-basis:64%}
  .wave-track img + img,.foam-track img + img{margin-left:-9%}
  .wave-back{bottom:42px}
  .wave-front{bottom:2px}
  .section-wave-stack .wave-back{bottom:50px}
  .section-wave-stack .wave-front{bottom:6px}
  .decor-couple-robin{width:96px;left:-22px;top:148px}
  .decor-gift-nami{width:102px;left:-18px;bottom:82px}
}


/* v1.2.2 rope centering + Nami top-right */
.rope-divider{position:relative;left:50%;transform:translateX(-50%);width:min(760px,118%);margin:24px 0 0}
.decor-gift-nami{left:auto;right:-10px;top:88px;bottom:auto;width:min(29vw,145px);opacity:.99}

@media(max-width:760px){
  .rope-divider{width:128%;left:50%;margin-top:16px;transform:translateX(-50%)}
  .decor-gift-nami{width:104px;right:-14px;top:112px;bottom:auto;left:auto}
}


/* v1.3.0 gift asset swap */
.gift-visual{position:relative;width:min(560px,96vw);margin:-10px auto 8px;display:grid;place-items:center}
.gift-visual .gift-nami-stealing{display:block;width:100%;max-width:560px;height:auto;filter:drop-shadow(0 16px 24px rgba(69,45,24,.14))}
.gift-coins-left{position:absolute!important;width:152px!important;left:-18px!important;right:auto!important;bottom:52px!important;z-index:2;filter:drop-shadow(0 10px 14px rgba(0,0,0,.10))}
.decor-couple-nami{width:min(28vw,140px);left:-18px;top:120px}

@media(max-width:760px){
  .gift-visual{width:min(410px,98vw);margin:-2px auto 8px}
  .gift-visual .gift-nami-stealing{width:100%;max-width:410px}
  .gift-coins-left{width:108px!important;left:-8px!important;bottom:34px!important}
}


/* v1.3.1 rope divider refinement */
.rope-divider{position:relative;left:50%;transform:translateX(-50%);width:min(860px,126%);margin:24px 0 0}
@media(max-width:760px){.rope-divider{width:136%;left:50%;margin-top:16px;transform:translateX(-50%)}}


/* v1.4.0 asset implementation */
.event-map{padding-bottom:148px;overflow:visible}
.event-decor{position:absolute;z-index:0;pointer-events:none;filter:drop-shadow(0 12px 18px rgba(0,0,0,.10));opacity:.94}
.event-decor-compass{width:138px;left:16px;bottom:118px}
.event-decor-anchor{width:156px;right:14px;bottom:110px}
.event-cards,.event-map .btn,.event-bottom-decoration{position:relative;z-index:1}
.event-bottom-decoration{display:block;width:min(680px,108%);height:auto;margin:18px auto 0;filter:drop-shadow(0 10px 14px rgba(0,0,0,.10))}
.event-ornaments{display:none}



.music-state{overflow:hidden;background:transparent;box-shadow:none;width:34px;height:34px}
.music-state-icon{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .2s ease}
.music-player .icon-play{opacity:1}
.music-player.is-playing .icon-play{opacity:0}
.music-player.is-playing .icon-stop{opacity:1}
.music-player:not(.is-playing) .icon-stop{opacity:0}



@media(max-width:760px){
  .event-map{padding-bottom:124px}
  .event-decor-compass{width:92px;left:-10px;bottom:122px;opacity:.82}
  .event-decor-anchor{width:102px;right:-12px;bottom:122px;opacity:.84}
  .event-bottom-decoration{width:112%;max-width:none;margin-left:-6%;margin-top:14px}
  
  .music-state{width:30px;height:30px}
  
}


/* v1.4.1 event map-card gag block */
.event-map{padding-bottom:44px}
.event-decor,.event-bottom-decoration,.event-ornaments{display:none!important}
.event-lost-gag{margin:14px auto 0;display:grid;justify-items:center;gap:12px;max-width:680px}
.event-lost-visual{position:relative;width:min(520px,98vw);margin:0 auto}
.event-lost-map{display:block;width:100%;height:auto;filter:drop-shadow(0 12px 18px rgba(0,0,0,.10))}
.event-lost-zoro{position:absolute;width:min(34%,160px);right:6px;bottom:2px;transform:rotate(-3deg);filter:drop-shadow(0 12px 14px rgba(0,0,0,.12))}
.event-lost-pin{position:absolute;width:min(22%,98px);left:22px;top:26px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.10))}
.event-lost-note{margin:0 auto;text-align:center;max-width:440px;color:#6d5644;font-size:.92rem;line-height:1.7;font-style:italic}

@media(max-width:760px){
  .event-map{padding-bottom:26px}
  .event-lost-gag{margin-top:10px;gap:8px}
  .event-lost-visual{width:min(370px,96vw)}
  .event-lost-zoro{width:118px;right:-8px;bottom:-2px}
  .event-lost-pin{width:72px;left:10px;top:14px}
  .event-lost-note{max-width:300px;font-size:.84rem;line-height:1.6}
}


/* v1.4.2 — refine Wedding Event while keeping v1.4.1 as baseline */
.event-map-bg,
.decor-event-zoro{
  display:none!important;
}
.event-map{
  background:transparent;
}


/* ==================================================
   v1.5.0 — Master Prompt Compliance Upgrade
   Baseline source: OFFLINE v1.4.2
   ================================================== */
.copy-multiline{white-space:pre-line}
.media-frame{overflow:hidden}
.media-photo{object-fit:cover;object-position:var(--focal-x,50%) var(--focal-y,50%);transform:scale(var(--photo-zoom,1));transform-origin:var(--focal-x,50%) var(--focal-y,50%);will-change:transform}
.hero-photo-crop{position:absolute;left:13.4%;top:13.7%;width:73%;height:71%;border-radius:25px;overflow:hidden}
.hero-photo-crop .hero-photo{position:absolute;inset:0;width:100%;height:100%;left:auto;top:auto;border-radius:0}
.wanted-photo-crop{position:absolute;left:17%;top:27%;width:66%;height:48%;border-radius:4px;overflow:hidden}
.wanted-photo-crop .wanted-photo{position:absolute;inset:0;width:100%;height:100%;left:auto;top:auto;border-radius:0}
.story-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.story-card:nth-child(2),.story-card:nth-child(3),.story-card:nth-child(4){transform:none}
.story-card img{aspect-ratio:16/9}
.rope-divider{width:min(920px,132%)}
.music-player{bottom:18px}
.site-footer{position:relative;z-index:5;padding:26px 20px 34px;background:linear-gradient(180deg,#fff8e8 0%,#f6e8c9 100%);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:3px;color:#4a2d1c}
.site-footer::before{content:"⚓";display:block;font-size:18px;color:#b5852e;margin-bottom:2px}
.brand-kicker{font-size:.68rem;letter-spacing:.16em;text-transform:lowercase;color:#7a624f}
.brand-domain{font:700 1.15rem Georgia,serif;letter-spacing:.04em;color:#4a2d1c;text-decoration:none}

@media(max-width:760px){
  .story-grid{grid-template-columns:1fr;gap:24px}
  .story-card img{aspect-ratio:16/9}
  .rope-divider{width:142%}
  .music-player{bottom:14px}
  .site-footer{padding:22px 18px 28px}
}

.gallery-dots{overflow-x:auto;scrollbar-width:none;padding:2px 1px}.gallery-dots::-webkit-scrollbar{display:none}.music-player.is-playing .music-state:after{content:none!important}


/* =========================================================
   v1.5.1 — Lite gallery + hero frame containment
   ========================================================= */
/* The hero client photo must remain completely inside the transparent rope opening.
   Decorative frame stays fixed; only the client photo is cropped/moved. */
.hero-photo-crop{
  left:21.9%;
  top:23.7%;
  width:60.9%;
  height:51.9%;
  border-radius:18px;
  overflow:hidden;
}
.hero-photo-crop .hero-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover;
  object-position:var(--focal-x,50%) var(--focal-y,50%);
  transform:scale(var(--photo-zoom,1));
  transform-origin:var(--focal-x,50%) var(--focal-y,50%);
}
.hero-frame{z-index:2;pointer-events:none}

/* Lite base gallery = max 6. Add-On remains one gallery experience,
   shown as one horizontal extension row under the main slider. */
.gallery-addon-wrap{
  position:relative;
  margin-top:28px;
  z-index:2;
}
.gallery-addon-heading{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:14px;
  margin:0 4px 12px;
  color:#54351f;
}
.gallery-addon-heading strong{
  font:700 1.1rem Georgia,serif;
}
.gallery-addon-heading span{
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#8a725b;
  text-align:right;
}
.gallery-addon-row{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(118px,30%);
  gap:12px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scroll-snap-type:inline mandatory;
  scrollbar-width:none;
  padding:3px 4px 12px;
}
.gallery-addon-row::-webkit-scrollbar{display:none}
.gallery-addon-item{
  margin:0;
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  border-radius:16px;
  background:#e7d4a9;
  scroll-snap-align:start;
  box-shadow:0 8px 18px rgba(67,41,17,.10);
}
.gallery-addon-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.gallery-addon-item figcaption{
  position:absolute;
  left:8px;
  bottom:8px;
  padding:5px 8px;
  border-radius:999px;
  background:rgba(28,28,28,.68);
  color:#fff;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.05em;
}
@media(max-width:760px){
  .gallery-addon-wrap{margin-top:22px}
  .gallery-addon-heading{align-items:flex-start;flex-direction:column;gap:4px;margin-inline:2px}
  .gallery-addon-heading span{text-align:left}
  .gallery-addon-row{grid-auto-columns:34%;gap:10px;padding-bottom:10px}
  .gallery-addon-item{border-radius:14px}
}


/* =========================================================
   v1.5.2 — Hero opening fill + unified Lite/Add-On gallery
   Baseline: v1.5.1 (itself derived from v1.4.2)
   ========================================================= */
/* Rope frame stays fixed. The client photo fills the actual inner opening more closely. */
.hero-photo-crop{
  left:15.4%;
  top:20.7%;
  width:73.1%;
  height:60.2%;
  border-radius:14px;
  overflow:hidden;
}
.hero-photo-crop .hero-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:var(--focal-x,50%) var(--focal-y,50%);
  transform:scale(var(--photo-zoom,1));
  transform-origin:var(--focal-x,50%) var(--focal-y,50%);
}

/* Add-On is no longer a separate row. All slides use the same slider/track. */
.gallery-addon-wrap{display:none!important}
.gallery-slide[data-gallery-source="addon"] figcaption{
  background:rgba(185,40,50,.82);
}


/* =========================================================
   v1.5.3 — hero + bride photo fit refinement
   ========================================================= */
/* Hero photo: add a bit more height, and widen 5px to the left + 5px to the right */
.hero-photo-crop{
  left:calc(15.4% - 5px);
  top:20.7%;
  width:calc(73.1% + 10px);
  height:calc(60.2% + 5px);
}

/* Bride photo: add a little more height */
.wanted-grid .wanted-card:first-child .wanted-photo-crop{
  height:calc(48% + 3px);
}


/* =========================================================
   v1.5.4 — exact photo crop tuning + Instagram button simplification
   ========================================================= */
.hero-photo-crop {
  left: calc(15.4% - 5px);
  top: 18.7%;
  width: calc(73.1% + 10px);
  height: calc(60.2% + 11px);
}

.wanted-grid .wanted-card:first-child .wanted-photo-crop {
  height: calc(48%);
}

.wanted-photo-crop {
  position: absolute;
  left: 17%;
  top: 25%;
  width: 66%;
  height: 48%;
  border-radius: 4px;
  overflow: hidden;
}

.instagram-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
}
.instagram-btn .instagram-icon{
  width:18px;
  height:18px;
  object-fit:contain;
  flex:0 0 18px;
}
.instagram-btn small{
  font-size:.78rem;
  font-weight:800;
  color:#6f5e50;
}


/* =========================================================
   v1.5.5 — desktop sailing scene + new vinyl/tonearm
   ========================================================= */
.desktop-scene{display:none}
.music-turntable{position:absolute;inset:0}
.music-player{width:84px;height:84px;right:14px;bottom:74px}
.music-disc{position:absolute;left:0;top:7px;width:72px;height:72px;border-radius:50%;overflow:hidden;filter:drop-shadow(0 9px 16px rgba(0,0,0,.3))}
.music-disc img{width:100%;height:100%;object-fit:contain}
.music-tonearm{position:absolute;right:-1px;top:2px;width:36px;height:auto;transform-origin:76% 10%;transform:rotate(-24deg);transition:transform .38s ease}
.music-player.is-playing .music-tonearm{transform:rotate(12deg) translate(-2px,2px)}
.music-state{left:35px;top:43px;width:28px;height:28px}
.music-caption{top:-18px}

@keyframes desktopOceanDrift{0%{transform:scale(1.06) translate3d(-1.2%,0,0)}100%{transform:scale(1.1) translate3d(1.2%,-1%,0)}}
@keyframes desktopCloudDrift{0%{transform:translate3d(-2.5%,0,0)}100%{transform:translate3d(2.5%,1%,0)}}
@keyframes desktopShipBob{0%{transform:translate3d(0,0,0) rotate(-1.2deg)}50%{transform:translate3d(0,-10px,0) rotate(.4deg)}100%{transform:translate3d(0,0,0) rotate(-1.2deg)}}
@keyframes desktopShipSway{0%{transform:translateX(-1.2%)}100%{transform:translateX(1.2%)}}

@media (min-width:1100px){
  body{background:#102338}
  .desktop-scene{display:block;position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0;background:linear-gradient(180deg,#162a3c 0%,#0c2234 100%)}
  .desktop-scene-bg{position:absolute;inset:-3%;background:url('assets/decorative/desktop-ocean-background.png') center center/cover no-repeat;filter:brightness(.5) saturate(.9);animation:desktopOceanDrift 30s ease-in-out infinite alternate}
  .desktop-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,15,22,.08) 0%,rgba(9,15,22,.34) 55%,rgba(9,15,22,.54) 100%)}
  .desktop-scene-clouds{position:absolute;left:-3%;right:-3%;top:0;width:106%;max-width:none;opacity:.52;filter:blur(.15px);animation:desktopCloudDrift 32s ease-in-out infinite alternate;z-index:1}
  .desktop-scene-ship{position:absolute;left:7%;bottom:8%;width:min(38vw,600px);height:auto;opacity:.82;filter:drop-shadow(0 35px 55px rgba(0,0,0,.34));animation:desktopShipBob 7.8s ease-in-out infinite,desktopShipSway 13s ease-in-out infinite alternate;z-index:2}
  .desktop-scene-ship-alt{display:none}
  .welcome-screen,.toast{z-index:1200}
  .paper-noise{z-index:1000}
  main{position:relative;z-index:2;max-width:460px;margin:28px auto 0;border-radius:28px 28px 0 0;overflow:hidden;box-shadow:0 28px 80px rgba(4,8,14,.38)}
  .site-footer{position:relative;z-index:2;max-width:460px;margin:0 auto 30px;border-radius:0 0 28px 28px;box-shadow:0 28px 80px rgba(4,8,14,.38)}
  .music-player{right:max(22px,calc((100vw - 460px)/2 - 96px));bottom:36px}
}

/* =========================================================
   v1.5.6 — desktop centered mobile-canvas correction
   Keep the invitation visually identical to the mobile layout
   while the animated sailing scene lives outside the canvas.
   ========================================================= */
@media (min-width:1100px){
  /* Fixed phone-like invitation canvas: straight, centered, no skew. */
  main{
    width:430px;
    max-width:430px;
    margin:28px auto 0;
    transform:none!important;
    rotate:0deg!important;
    border-radius:28px 28px 0 0;
  }
  .site-footer{
    width:430px;
    max-width:430px;
    margin:0 auto 30px;
    transform:none!important;
    border-radius:0 0 28px 28px;
  }

  /* Re-apply the approved mobile composition inside desktop canvas. */
  main .section{padding:70px 15px}
  main .section-inner,
  main .hero-inner,
  main .closing-inner{max-width:100%}
  main .section-heading{margin-bottom:30px}
  main .section-heading h2{font-size:2.55rem}

  main .hero{min-height:760px;padding-top:74px;padding-bottom:145px}
  main .hero-photo-wrap{
    width:calc(100% + 18px);
    max-width:none;
    margin:24px 0 24px 50%;
    transform:translateX(-50%);
  }
  main .hero-names{font-size:3rem;line-height:.92}
  main .hero-names span,
  main .hero-names b{display:block}
  main .hero-names b{margin:.05em 0}
  main .hero-copy{max-width:350px}
  main .hero-cloud{width:410px}
  main .hero-cloud-left{left:-260px;top:130px}
  main .hero-cloud-right{right:-280px;top:310px}

  main .wanted-grid{grid-template-columns:1fr;gap:52px}
  main .wanted-visual{width:min(360px,100%)}
  main .rope-divider{width:142%;margin-top:16px}

  main .event{min-height:940px}
  main .island{width:340px;opacity:.4}
  main .island-left{left:-180px}
  main .island-right{right:-190px}
  main .event-map{min-height:650px;padding:115px 34px 26px}
  main .event-cards{grid-template-columns:1fr;gap:10px}
  main .event-card{padding:17px}
  main .event-map .btn{margin-top:12px}
  main .event-lost-visual{width:min(370px,96%)}

  main .story-grid{grid-template-columns:1fr;gap:24px}
  main .story-card,
  main .story-card:nth-child(2),
  main .story-card:nth-child(3),
  main .story-card:nth-child(4){transform:none}
  main .story-card img{aspect-ratio:16/10}
  main .route-map{width:90%}
  main .journey-ship{width:90%;margin-top:30px;margin-bottom:-75px}

  main .gallery{padding-top:110px}
  main .gallery-shell{padding:25px 0 10px}
  main .gallery-slider{max-width:none;border-radius:22px}
  main .gallery-corner{width:160px}
  main .gallery-corner-left{left:-62px;top:-42px}
  main .gallery-corner-right{right:-62px;bottom:-40px}
  main .gallery-dots{max-width:150px}

  main .form-card{padding:22px}
  main .choice-row{flex-direction:column}
  main .gift-visual{width:min(320px,90%)}
  main .gift-coins{width:110px!important;right:-25px!important}
  main .closing{min-height:760px}
  main .closing-ship{width:90%}
  main .closing-mark{width:130px}

  /* Mobile-sized character ornaments inside the centered canvas. */
  main .decor-hero-luffy{width:112px;right:-22px;top:92px}
  main .decor-couple-nami{width:96px;left:-24px;top:150px}
  main .decor-couple-sanji{width:94px;right:-24px;bottom:140px}
  main .decor-event-robin{width:90px;right:-22px;top:150px}
  main .decor-journey-usopp{width:92px;right:-22px;top:164px}
  main .decor-journey-chopper{width:78px;left:-18px;bottom:115px}
  main .decor-gallery-franky{width:92px;left:-20px;top:165px}
  main .decor-gallery-brook{width:90px;right:-20px;bottom:104px}
  main .decor-rsvp-jinbei{width:96px;right:-22px;bottom:110px}
  main .decor-wishes-chopper{width:78px;left:-18px;top:140px}
  main .decor-closing-brook{width:92px;left:-18px;bottom:152px}

  .music-player{right:max(22px,calc((100vw - 430px)/2 - 96px));bottom:36px}
}

/* =========================================================
   v1.5.7 — desktop closing correction + swipeable gallery
   ========================================================= */
.gallery-slider{
  touch-action:pan-y;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  overscroll-behavior-x:contain;
}
.gallery-slider.is-dragging{cursor:grabbing}
.gallery-slider.is-dragging .gallery-track{transition:none!important}
.gallery-slide img{-webkit-user-drag:none;user-drag:none;pointer-events:none}

@media (min-width:1100px){
  /* Closing must retain the approved mobile scale inside the 430px canvas. */
  main .closing{
    min-height:760px;
    padding:88px 18px 76px;
  }
  main .closing-inner{
    width:100%;
    max-width:394px;
    margin-inline:auto;
    padding-inline:4px;
  }
  main .closing h2{
    font-size:2.72rem;
    line-height:.98;
    max-width:370px;
    margin:.28em auto;
    overflow-wrap:normal;
    word-break:normal;
  }
  main .closing p{
    max-width:350px;
    margin-inline:auto;
    font-size:.95rem;
    line-height:1.7;
  }
  main .closing h3{
    font-size:1.85rem;
    line-height:1.1;
    margin:20px auto 12px;
  }
  main .closing-ship{
    width:350px;
    max-width:92%;
    margin:0 auto -12px;
  }
  main .closing-mark{
    width:128px;
    margin-top:14px;
  }
}

/* =========================================================
   v1.5.8 — desktop welcome/hero refinement + loading screen
   ========================================================= */
body.is-loading{overflow:hidden}
.loading-screen{
  position:fixed;
  inset:0;
  z-index:1400;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(circle at top, rgba(255,255,255,.25), transparent 38%),
    linear-gradient(180deg, #fffaf1 0%, #f4e4bd 62%, #d3b37a 100%);
}
.loading-screen::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0)),
    radial-gradient(circle at 20% 15%, rgba(255,255,255,.35), transparent 20%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,.25), transparent 18%);
  pointer-events:none;
}
.loading-card{
  position:relative;
  z-index:1;
  width:min(430px, 92vw);
  padding:32px 28px 26px;
  text-align:center;
  border-radius:30px;
  background:rgba(255,249,239,.92);
  border:1px solid rgba(142,103,54,.16);
  box-shadow:0 24px 60px rgba(90,54,19,.18);
  backdrop-filter:blur(10px);
}
.loading-mark{
  width:122px;
  display:block;
  margin:0 auto 14px;
  filter:drop-shadow(0 12px 22px rgba(95,58,24,.18));
  animation:loadingFloat 3.6s ease-in-out infinite;
}
.loading-kicker{
  margin:0;
  color:#9c6331;
  font-size:.76rem;
  letter-spacing:.26em;
  font-weight:900;
}
.loading-title{
  margin:10px 0 8px;
  color:#3c2418;
  font:700 clamp(2rem, 6vw, 2.7rem)/1.02 Georgia, serif;
}
.loading-copy,
.loading-footnote{
  margin:0;
  color:#6c5340;
  line-height:1.7;
}
.loading-copy{max-width:300px;margin-inline:auto}
.loading-footnote{margin-top:14px;font-size:.84rem}
.loading-bar{
  width:min(240px, 82%);
  height:10px;
  margin:18px auto 0;
  border-radius:999px;
  overflow:hidden;
  background:rgba(144,107,66,.16);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.08);
}
.loading-bar span{
  display:block;
  width:42%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, #c24146 0%, #f1c84f 48%, #c24146 100%);
  animation:loadingBar 1.75s ease-in-out infinite;
}
.loading-screen.is-loaded{
  opacity:0;
  visibility:hidden;
  transition:opacity .55s ease, visibility .55s ease;
}
@keyframes loadingBar{
  0%{transform:translateX(-120%)}
  100%{transform:translateX(340%)}
}
@keyframes loadingFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

@media (max-width:760px){
  .loading-card{padding:28px 22px 22px;border-radius:24px}
  .loading-mark{width:110px}
  .loading-title{font-size:2rem}
}

@media (min-width:1100px){
  .loading-screen{
    background:
      linear-gradient(180deg, rgba(9,15,22,.62), rgba(9,15,22,.7)),
      url('assets/decorative/desktop-ocean-background.png') center center / cover no-repeat;
  }
  .loading-card{
    width:min(440px, 34vw);
    background:rgba(255,248,236,.9);
    box-shadow:0 30px 70px rgba(4,8,14,.34);
  }

  
main .hero{
    min-height:720px;
    padding-top:58px;
    padding-bottom:136px;
  }
  main .hero-inner{
    max-width:392px;
    margin-inline:auto;
  }
  main .hero .eyebrow{
    max-width:330px;
    margin:0 auto;
  }
  main .hero-photo-wrap{
    width:calc(100% + 34px);
    max-width:none;
    margin:18px 0 20px 50%;
    transform:translateX(-50%);
  }
  main .hero-copy{
    max-width:334px;
    margin:16px auto;
  }
  main .date-badge{
    gap:10px;
    padding:7px 15px;
  }
  main .date-badge span{font-size:1.8rem}
  main .date-badge small{font-size:.72rem;letter-spacing:.14em}
  main .hero-cloud{opacity:.44}
  main .hero-cloud-left{left:-230px;top:116px}
  main .hero-cloud-right{right:-248px;top:292px}
  main .decor-hero-luffy{width:108px;right:-14px;top:82px;opacity:.92}
}

/* =========================================================
   v1.5.9 — restore welcome + loading copy + autoplay attempt
   ========================================================= */
/* Desktop welcome intentionally falls back to the approved v1.5.7 styling. */

/* =========================================================
   v1.6.0 — tonearm-only music state + gallery lightbox
   ========================================================= */
.music-state{display:none!important}
.gallery-slide{cursor:zoom-in}
.gallery-slide figcaption{display:none!important}

body.lightbox-open{overflow:hidden}
.gallery-lightbox{
  position:fixed;
  inset:0;
  z-index:1350;
  display:none;
  place-items:center;
  padding:20px;
}
.gallery-lightbox.is-open{display:grid}
.gallery-lightbox-backdrop{
  position:absolute;
  inset:0;
  background:rgba(8,12,18,.9);
  backdrop-filter:blur(8px);
}
.gallery-lightbox-dialog{
  position:relative;
  z-index:1;
  width:min(980px,96vw);
  height:min(880px,92vh);
  display:grid;
  place-items:center;
}
.gallery-lightbox-figure{
  margin:0;
  width:100%;
  height:100%;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  align-items:center;
  justify-items:center;
  gap:10px;
}
.gallery-lightbox-figure img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:calc(92vh - 70px);
  object-fit:contain;
  border-radius:18px;
  box-shadow:0 24px 70px rgba(0,0,0,.42);
}
.gallery-lightbox-figure figcaption{
  color:#fff;
  font-size:.8rem;
  letter-spacing:.12em;
  font-weight:800;
}
.gallery-lightbox-close,
.gallery-lightbox-nav{
  position:absolute;
  z-index:2;
  border:0;
  cursor:pointer;
  display:grid;
  place-items:center;
  color:#fff;
  background:rgba(28,28,28,.68);
  box-shadow:0 10px 28px rgba(0,0,0,.28);
  backdrop-filter:blur(8px);
}
.gallery-lightbox-close{
  right:0;
  top:0;
  width:46px;
  height:46px;
  border-radius:50%;
  font-size:2rem;
  line-height:1;
}
.gallery-lightbox-nav{
  top:50%;
  width:48px;
  height:62px;
  margin-top:-31px;
  border-radius:999px;
  font-size:2.1rem;
}
.gallery-lightbox-prev{left:0}
.gallery-lightbox-next{right:0}

@media(max-width:760px){
  .gallery-lightbox{padding:12px}
  .gallery-lightbox-dialog{width:100%;height:94vh}
  .gallery-lightbox-figure img{max-height:calc(94vh - 72px);border-radius:14px}
  .gallery-lightbox-close{right:4px;top:4px;width:42px;height:42px}
  .gallery-lightbox-nav{width:42px;height:54px;margin-top:-27px;font-size:1.8rem}
  .gallery-lightbox-prev{left:4px}
  .gallery-lightbox-next{right:4px}
}

/* =========================================================
   v1.6.1 — centered vinyl + reliable gallery lightbox
   ========================================================= */
/* Visually center the vinyl disc inside the player control.
   Tonearm is decorative and may extend to the right without shifting the disc. */
.music-player{overflow:visible}
.music-turntable{position:absolute;inset:0;overflow:visible}
.music-disc{
  left:50%!important;
  top:50%!important;
  width:72px;
  height:72px;
  transform:translate(-50%,-50%);
  transform-origin:center center;
}
.music-player.is-playing .music-disc{
  animation:spinCentered 9s linear infinite;
}
.music-tonearm{
  right:-5px;
  top:1px;
  width:34px;
  z-index:3;
}
@keyframes spinCentered{
  from{transform:translate(-50%,-50%) rotate(0deg)}
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

/* Lightbox sits above every theme layer and accepts clicks reliably. */
.gallery-lightbox{z-index:5000!important}
.gallery-lightbox.is-open{display:grid!important;visibility:visible;opacity:1;pointer-events:auto}
.gallery-lightbox:not(.is-open){visibility:hidden;opacity:0;pointer-events:none}
.gallery-lightbox-backdrop{cursor:zoom-out}
.gallery-lightbox-dialog{pointer-events:auto}
.gallery-lightbox-figure img{pointer-events:auto}

@media(max-width:760px){
  .music-disc{width:62px;height:62px}
  .music-tonearm{width:30px;right:-5px;top:0}
}


/* =========================================================
   v1.6.2 — tonearm mobile tuning + bottom lightbox controls
   ========================================================= */
.gallery-lightbox-dialog{
  height:min(900px,94vh);
  grid-template-rows:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  justify-items:center;
}
.gallery-lightbox-figure{
  min-height:0;
  width:100%;
  height:100%;
  touch-action:pan-y;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
}
.gallery-lightbox-figure.is-swiping{cursor:grabbing}
.gallery-lightbox-figure img{
  max-height:calc(94vh - 132px);
  -webkit-user-drag:none;
  user-drag:none;
  pointer-events:none;
}
.gallery-lightbox-controls{
  position:relative;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:2px 0 0;
}
.gallery-lightbox-nav{
  position:relative;
  top:auto;
  left:auto;
  right:auto;
  margin:0;
  width:48px;
  height:48px;
  border-radius:50%;
  font-size:1.85rem;
}
.gallery-lightbox-prev,
.gallery-lightbox-next{left:auto;right:auto}

@media(max-width:760px){
  .music-tonearm{
    width:30px;
    right:8px;
    top:16px;
  }
  .gallery-lightbox-dialog{
    height:94vh;
    grid-template-rows:minmax(0,1fr) auto;
    gap:12px;
  }
  .gallery-lightbox-figure img{
    max-height:calc(94vh - 126px);
    border-radius:14px;
  }
  .gallery-lightbox-controls{gap:14px}
  .gallery-lightbox-nav{
    width:46px;
    height:46px;
    margin:0;
    font-size:1.75rem;
  }
}

/* v1.6.3 — final tonearm position refinement */
.music-tonearm {
  right: 5px;
  top: 14px;
  width: 34px;
  z-index: 3;
}

/* =========================================================
   WordPress integration layer — Nakama v1.1.0
   Visual source above remains OFFLINE v1.6.3.
   ========================================================= */
.loading-screen.is-complete,
.loading-screen.is-loaded{opacity:0;visibility:hidden;transition:opacity .55s ease,visibility .55s ease}
.welcome-qr[hidden]{display:none!important}
.welcome-qr [data-wdg-guest-qr-slot]{width:86px!important;height:86px!important;aspect-ratio:1;margin:0!important;padding:6px;background:#fff;border-radius:10px;box-shadow:0 8px 20px rgba(75,49,24,.14)}
.welcome-qr [data-wdg-guest-qr-slot] svg{display:block;width:100%!important;height:100%!important}
.nakama-personal-link-note{margin:0;text-align:center;line-height:1.7;color:#6f5a46}
.nakama-gift-options{display:grid;gap:14px}
.nakama-gift-options .bank-card{width:100%}
.nakama-gift-qr{display:block;width:min(190px,70%);aspect-ratio:1;object-fit:contain;margin:8px auto;border-radius:14px;background:#fff}
.nakama-gift-address{white-space:pre-line;line-height:1.6}
.event-cards.is-single{grid-template-columns:minmax(0,1fr)}
.wish-card.is-new{animation:nakamaWishIn .35s ease both}
@keyframes nakamaWishIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:760px){.welcome-qr [data-wdg-guest-qr-slot]{width:76px!important;height:76px!important}}
@media(max-height:740px) and (max-width:760px){.welcome-qr [data-wdg-guest-qr-slot]{width:64px!important;height:64px!important}}