@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,wght@0,400;0,500;1,400;1,500&family=Manrope:wght@400;500;600&family=Noto+Serif+JP:wght@400;500&family=Barlow+Condensed:ital,wght@0,500;0,600;0,700;1,600&display=swap');
:root{--paper:#f5f3ee;--white:#fffefa;--ink:#272522;--muted:#817a73;--wine:#752033;--hairline:#c9c3b966;--display:'Bodoni Moda','Times New Roman',serif;--jp:'Noto Serif JP','Hiragino Mincho ProN','Yu Mincho',serif;--sans:'Manrope','Helvetica Neue',Arial,sans-serif;--race:'Barlow Condensed',Impact,'Arial Narrow',sans-serif;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;touch-action:manipulation;cursor:pointer}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #ba6573;outline-offset:7px}h1,h2,p{margin:0}h2[tabindex]:focus{outline:none}::selection{background:#8d3147;color:#fff}[hidden]{display:none!important}
.scene{min-height:100svh;overflow:hidden;position:relative;padding:0 clamp(24px,5vw,80px)}.site-header{max-width:1360px;margin:0 auto;height:112px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--hairline);font-size:12px;letter-spacing:.16em}.site-header time{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;color:#817a73}.monogram{font:italic 40px/1 var(--display);color:var(--wine);letter-spacing:-.08em}.header-sender{color:#817a73;font-size:12px;letter-spacing:.14em}.eyebrow{font-size:12px;letter-spacing:.25em;font-weight:500}
.cover-scene{display:flex;flex-direction:column;background:radial-gradient(ellipse at 65% 45%,#fffefa 0%,#f5f3ee 58%,#edeae3 100%)}.cover-scene .site-header{width:100%}.cover-layout{display:grid;grid-template-columns:1fr 1.35fr;align-items:center;max-width:1300px;width:100%;margin:auto;gap:0;padding:60px 0 70px;min-height:610px}.cover-type{position:relative;z-index:1;padding-bottom:60px}.cover-type .eyebrow{color:var(--wine);margin:0 0 38px 6px}.cover-type h1{font-family:var(--display);font-weight:400;letter-spacing:-.065em;line-height:.93}.cover-type h1>span{display:block;font-size:58px;font-weight:400;letter-spacing:-.045em;margin-left:8px;margin-bottom:14px}.cover-type h1 em{font-weight:400;font-size:clamp(100px,12vw,180px);font-style:italic;display:block;white-space:nowrap}.ink-dot{color:var(--wine)}.cover-hairline{width:65px;height:1px;background:var(--wine);margin:43px 0 0 12px}.envelope-presentation{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;margin-left:-28px;width:calc(100% + 28px);perspective:1000px}.envelope-stage{position:relative;width:100%;transform:rotate(4deg);transition:transform 1.2s cubic-bezier(.16,1,.3,1),opacity .8s;animation:envelope-arrive 1.4s backwards cubic-bezier(.16,1,.3,1)}.envelope-art{display:block;width:100%;height:auto;filter:drop-shadow(0 20px 30px #51402a10);pointer-events:none;user-select:none}.seal-button{position:absolute;left:49.5%;top:55.3%;width:13.5%;aspect-ratio:1;min-width:48px;min-height:48px;transform:translate(-50%,-50%);border:0;border-radius:50%;background:transparent;padding:0;transition:box-shadow .35s,background .35s}.seal-button:hover{background:#fff5e809;box-shadow:0 0 24px 6px #75203320}.seal-button:focus-visible{outline:1px solid var(--wine);outline-offset:7px}.seal-button:active{background:#35101a20}.envelope-stage:has(.seal-button:hover){transform:translateY(-4px) rotate(2deg)}.open-label{margin:0 0 -25px;padding:22px 0;font-family:var(--jp);font-size:14px;letter-spacing:.11em;color:#817269;transition:opacity .3s}.cover-foot{max-width:1360px;width:100%;margin:0 auto;padding:0 0 33px;display:flex;align-items:center;gap:18px;color:#948d84;font-size:12px;letter-spacing:.17em}.foot-line{height:1px;width:42px;background:#b8afa1}.cover-type,.cover-foot{transition:opacity .7s,transform .9s}.is-opening .envelope-stage{transform:translateY(80px) rotateX(35deg) rotate(-4deg) scale(.93)!important;opacity:0}.is-opening .open-label{opacity:0;transition:opacity .3s}.is-opening .cover-type{opacity:0;transform:translateY(-20px)}.is-opening .cover-foot{opacity:0}
.letter-scene{background:#eeeae3}.letter-wrap{max-width:760px;margin:60px auto 75px;perspective:1300px}.letter-paper{position:relative;padding:49px 65px 40px;background:var(--white);box-shadow:0 25px 65px #50433612,0 2px 8px #5043360a;border:1px solid #d9d3c84a}.letter-paper:before{content:'';position:absolute;left:0;right:0;top:51%;height:1px;background:#7267560a;box-shadow:0 2px 3px #796a5010;pointer-events:none}.paper-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px;color:var(--wine)}.paper-heading p{font-size:12px;letter-spacing:.2em;padding-top:7px}.paper-heading>span{font:400 25px/1 var(--display);text-align:center}.paper-heading i{font-size:18px;font-weight:400}.letter-paper h2{font:400 clamp(33px,3.8vw,50px)/1.4 var(--display);letter-spacing:-.04em;margin:0 0 38px;white-space:nowrap}.letter-paper h2 em{font-weight:400}.letter-copy{font:400 17px/2.15 var(--jp);letter-spacing:.015em;text-wrap:pretty}.letter-copy p+p{margin-top:24px}.letter-signature{margin:31px 0 29px;text-align:right}.letter-signature p{font:italic 400 39px/1.3 var(--display);letter-spacing:-.035em;color:var(--wine);margin-bottom:9px}.letter-signature span{font:16px/1.8 var(--jp);color:#62564e}.letter-action{padding-top:25px;border-top:1px solid var(--hairline);display:flex;justify-content:flex-end}.gift-button{display:flex;align-items:center;justify-content:center;gap:23px;min-height:56px;padding:16px 28px;border:1px solid var(--wine);border-radius:2px;background:var(--wine);color:#fffaf4;font-size:14px;letter-spacing:.1em;transition:background .3s,box-shadow .3s,transform .3s}.gift-button svg{width:20px;height:20px}.gift-button:hover{background:#5d1424;box-shadow:0 8px 25px #75203328;transform:translateY(-2px)}.letter-scene.is-visible .letter-paper{animation:paper-in 1.25s both cubic-bezier(.16,1,.3,1)}
.gift-scene{--hairline:#ffffff19;background:#0e0f11;color:#eeece7;isolation:isolate}.gift-header{height:100px;position:relative;z-index:5}.gift-header .monogram{color:#dfdcd5}.back-button{border:0;background:none;color:#bcb9b2;font-size:14px;letter-spacing:.04em;padding:12px 0;border-bottom:1px solid #8d888156}.back-button:hover{color:#fff}.gift-layout{max-width:1180px;margin:68px auto 58px;display:grid;grid-template-columns:1.45fr 1fr;gap:75px;align-items:center}.event-panel{position:relative;min-height:590px;align-self:stretch;display:flex;align-items:flex-start;padding-top:40px}.event-type{position:relative;z-index:2}.event-type .eyebrow{color:#b3ada7;letter-spacing:.36em;margin:0 0 22px 4px}.event-type h2{font:600 clamp(110px,11vw,170px)/.82 var(--race);letter-spacing:-.035em}.event-type h2 span{display:block;color:#9d9fa4;font-weight:500;font-style:italic;letter-spacing:-.025em;margin:8px 0 0}.event-jp{font:400 17px/1.8 var(--jp);letter-spacing:.08em;margin:29px 0 0 5px;color:#dedad2}.event-rule{width:43px;height:3px;background:#9b2f43;margin:28px 0 18px 5px}.event-location{font-size:12px;letter-spacing:.22em;color:#8d8e93;margin-left:5px}.race-art{position:absolute;width:145%;height:400px;object-fit:cover;object-position:80% 50%;left:-7%;bottom:-60px;z-index:1;opacity:.75;mix-blend-mode:screen;mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 80%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 80%,transparent 100%);pointer-events:none}.pass-wrap{position:relative;z-index:3;perspective:1600px;padding:15px 0}.invitation-pass{position:relative;width:100%;max-width:395px;margin:auto;border-radius:12px;overflow:hidden;border:1px solid #6a696455;transform:rotate(3deg);box-shadow:0 35px 75px #0009;transition:transform .5s cubic-bezier(.2,.7,.2,1);background:#24262a;isolation:isolate}.invitation-pass:after{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 22%,#ffffff0b 45%,#ffffff17 46%,transparent 58%);background-size:250% 100%;animation:pass-shine 3.5s .9s both}.invitation-pass:hover{transform:rotate(0deg) translateY(-5px)}.pass-body{position:relative;padding:38px 36px 30px;background:radial-gradient(ellipse at 5% 0%,#46484d 0%,#27292e 40%,#191a1e 100%)}.pass-body:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,#ffffff03 0px,#ffffff03 1px,transparent 1px,transparent 4px)}.pass-slot{position:relative;width:54px;height:7px;border-radius:4px;background:#0b0b0d;box-shadow:0 1px 1px #d4d0c626;left:50%;transform:translateX(-50%);margin:-18px 0 31px}.pass-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:12px;letter-spacing:.14em;color:#c2c0bd}.pass-symbol{font:italic 29px/1 var(--display);letter-spacing:-.07em;color:#eee9e0}.pass-title{font:500 28px/1.06 var(--race);letter-spacing:.1em;margin:23px 0 20px;color:#e0ded9}.pass-date{display:flex;align-items:flex-end;gap:17px;margin-bottom:19px}.date-day{font:600 139px/.85 var(--race);letter-spacing:-.075em;padding-right:5px;background:linear-gradient(120deg,#fff 5%,#b2b4bc 55%,#e0e2e8 85%);background-clip:text;-webkit-background-clip:text;color:transparent}.pass-date>div{display:flex;flex-direction:column;padding-bottom:4px;gap:2px}.pass-date>div>span{font:500 18px/1.1 var(--race);letter-spacing:.13em;color:#b4b4ba}.pass-date strong{font:500 41px/1 var(--race);letter-spacing:.01em;color:#e7e5e0}.race-day{display:flex;gap:10px;align-items:center;font-size:12px;letter-spacing:.14em;color:#c5c3c0;margin-top:24px}.red-rule{width:21px;height:3px;background:#b13f50;flex-shrink:0}.pass-event{display:flex;flex-direction:column;border-top:1px solid #cac6bf20;margin-top:26px;padding-top:18px;gap:6px;font:14px/1.65 var(--jp);color:#c3c0ba}.pass-event time{font-family:var(--sans);font-size:14px;letter-spacing:.025em}.pass-stub{position:relative;color:#27272a;padding:26px 36px 24px;background:linear-gradient(110deg,#dadbdc 0%,#f0eee9 48%,#cacbd0 100%);border-top:1px dashed #77787a}.pass-stub:before,.pass-stub:after{content:'';position:absolute;width:19px;height:19px;border-radius:50%;background:#0e0f11;top:-10px}.pass-stub:before{left:-10px}.pass-stub:after{right:-10px}.guest-label{font-size:12px;letter-spacing:.18em;color:#656365;display:block}.pass-stub>strong{display:block;font:500 34px/1.5 var(--sans);letter-spacing:.13em}.pass-venue{display:flex;justify-content:space-between;gap:12px;margin-top:17px;padding-top:16px;border-top:1px solid #77747433;font-size:12px;letter-spacing:.065em;color:#5c5a5d}.gift-footer{max-width:1180px;margin:0 auto;padding:25px 0 32px;border-top:1px solid #ffffff19;color:#939196;display:flex;gap:20px;justify-content:space-between;align-items:center;font-size:12px;line-height:1.9}.gift-footer a{color:#b4b0b4;text-underline-offset:5px;text-decoration-color:#716b73}.gift-scene.is-visible .event-type{animation:rise .9s both .1s}.gift-scene.is-visible .pass-wrap{animation:pass-in 1.4s both cubic-bezier(.16,1,.3,1)}
.transition-veil{position:fixed;z-index:50;inset:0;pointer-events:none;opacity:0;visibility:hidden;background:#0e0f11;transition:opacity .6s,visibility .6s;display:grid;place-items:center}.transition-veil span{height:1px;width:90px;background:#a25867;transform:scaleX(0);transition:transform .85s}.is-transitioning .transition-veil{opacity:1;visibility:visible}.is-transitioning .transition-veil span{transform:scaleX(1)}
@keyframes envelope-arrive{from{opacity:0;transform:translateY(35px) rotate(8deg)}to{opacity:1;transform:translateY(0) rotate(4deg)}}@keyframes paper-in{from{opacity:0;transform:translateY(70px) rotateX(-8deg) scale(.95)}to{opacity:1;transform:none}}@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes pass-in{from{opacity:0;transform:translateY(80px) rotate(-5deg) scale(.9)}to{opacity:1;transform:none}}@keyframes pass-shine{from{background-position:130% 0}to{background-position:-70% 0}}
@media(min-width:1500px){.cover-layout{min-height:690px}.event-panel{padding-top:25px}}
@media(max-width:900px){.cover-layout{grid-template-columns:1fr 1.1fr;min-height:570px}.cover-type h1>span{font-size:45px}.cover-type h1 em{font-size:116px}.cover-type .eyebrow{font-size:12px;letter-spacing:.17em}.gift-layout{gap:35px;grid-template-columns:1fr 1fr}.event-type h2{font-size:110px}.pass-body{padding-inline:28px}.pass-stub{padding-inline:28px}.pass-date .date-day{font-size:125px}.pass-date strong{font-size:36px}.pass-title{font-size:25px}}
@media(max-width:650px){.scene{padding:0 24px}.site-header{height:80px;gap:12px;font-size:12px;letter-spacing:.08em}.site-header time{position:static;transform:none;font-size:12px;letter-spacing:.07em;margin-left:auto}.monogram{font-size:33px}.header-sender{display:none}.cover-layout{display:flex;flex-direction:column;justify-content:center;min-height:0;margin:auto;padding:43px 0 36px;gap:2px}.cover-type{padding:0;text-align:center;align-self:stretch}.cover-type .eyebrow{margin:0 0 21px;font-size:12px;letter-spacing:.22em}.cover-type h1>span{font-size:31px;margin:0 0 7px;line-height:1.15}.cover-type h1 em{font-size:clamp(87px,25vw,143px);line-height:.94;letter-spacing:-.07em}.cover-hairline{display:none}.envelope-presentation{width:calc(100% + 16px);margin:5px -8px 0}.envelope-stage{max-width:430px}.open-label{margin:0;padding:18px 0 12px;font-size:14px}.cover-foot{padding-bottom:24px;justify-content:center;font-size:12px;gap:12px}.foot-line{width:28px}.letter-scene{padding-inline:18px}.letter-scene .site-header{margin-inline:6px}.letter-wrap{margin:27px auto 32px}.letter-paper{padding:30px 26px 27px}.paper-heading{margin-bottom:8px}.paper-heading p{font-size:12px;letter-spacing:.13em}.paper-heading>span{font-size:23px}.paper-heading i{font-size:16px}.letter-paper h2{font-size:clamp(30px,8.3vw,46px);margin-bottom:31px;line-height:1.35}.letter-copy{font-size:16px;line-height:2.15;letter-spacing:0;text-wrap:pretty}.letter-copy p+p{margin-top:23px}.letter-signature{margin:26px 0}.letter-signature p{font-size:35px}.letter-signature span{font-size:16px}.letter-action{padding-top:23px}.gift-button{width:100%;padding:15px 16px;font-size:14px;gap:20px}.gift-header{height:78px}.back-button{font-size:14px}.gift-layout{display:flex;flex-direction:column;gap:28px;margin:34px auto 36px}.event-panel{padding:0;min-height:0;width:100%;display:block;max-width:420px}.event-type .eyebrow{font-size:12px;margin:0 0 11px;letter-spacing:.28em}.event-type h2{display:flex;gap:13px;align-items:baseline;font-size:clamp(62px,17vw,90px);line-height:1;white-space:nowrap;letter-spacing:-.025em}.event-type h2 span{margin:0;font-size:.88em;font-style:italic;color:#a5a5ac}.event-jp{font-size:14px;line-height:1.8;letter-spacing:.06em;margin:10px 0 0}.event-rule,.event-location{display:none}.race-art{width:105%;height:240px;left:18%;top:-26px;bottom:auto;opacity:.32;object-position:80% 50%;mask-image:linear-gradient(180deg,transparent 0%,#000 20%,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 20%,#000 65%,transparent 100%)}.pass-wrap{width:100%;max-width:355px;padding:5px 5px 7px}.invitation-pass{transform:rotate(2deg);border-radius:10px}.pass-body{padding:32px 27px 23px}.pass-slot{width:45px;height:6px;margin:-15px 0 23px}.pass-top{font-size:12px;letter-spacing:.1em}.pass-symbol{font-size:26px}.pass-title{font-size:27px;margin:18px 0 17px}.pass-date{margin-bottom:12px}.pass-date .date-day{font-size:115px}.pass-date strong{font-size:38px}.pass-date>div>span{font-size:17px}.race-day{margin-top:18px;font-size:12px;letter-spacing:.1em}.pass-event{margin-top:20px;padding-top:15px;font-size:14px;gap:4px}.pass-event time{font-size:14px}.pass-stub{padding:20px 27px 22px}.guest-label{font-size:12px}.pass-stub>strong{font-size:30px;line-height:1.6}.pass-venue{font-size:12px;letter-spacing:.02em;margin-top:11px;padding-top:13px}.gift-footer{padding:22px 0 27px;font-size:12px;display:block;text-align:center}.gift-footer a{display:inline-block;margin-top:11px}.gift-footer p{font-size:12px}}
@media(max-width:360px){.scene{padding-inline:19px}.cover-layout{padding-top:32px;padding-bottom:26px}.cover-type h1 em{font-size:88px}.cover-type .eyebrow{margin-bottom:16px}.letter-scene{padding-inline:13px}.letter-paper{padding-inline:21px}.letter-paper h2{font-size:29px}.pass-wrap{padding-inline:3px}.pass-body,.pass-stub{padding-inline:23px}.event-type h2{font-size:59px}}
@media(max-height:740px) and (max-width:650px){.cover-layout{padding-top:28px;padding-bottom:23px}.cover-type .eyebrow{margin-bottom:13px}.cover-type h1>span{font-size:27px}.cover-type h1 em{font-size:90px}.envelope-stage{max-width:335px}.site-header{height:68px}.cover-foot{padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important;transition-delay:0ms!important}.envelope-stage,.invitation-pass{transform:none!important}}
.cover-scene.is-opening .envelope-stage{animation:none}
