@font-face{font-family:"Sawarabi Mincho";src:url(fonts/sawarabi.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"BIZ UDPMincho";src:url(fonts/biz.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"BIZ UDPMincho";src:url(fonts/biz-bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"Cormorant SC";src:url(fonts/cormorant-sc.woff2) format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/ebg.woff2) format("woff2");font-style:normal;font-weight:400 600;font-display:swap}
@font-face{font-family:"EB Garamond";src:url(fonts/ebg-italic.woff2) format("woff2");font-style:italic;font-weight:400 600;font-display:swap}
@font-face{font-family:"Great Vibes";src:url(fonts/vibes.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}

.petals{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:40}
.petals i{position:absolute;top:-40px;display:block;width:18px;height:22px;background-size:contain;background-repeat:no-repeat;
  animation:fall linear infinite;opacity:.85}
.petals i:nth-child(1){left:8%;animation-duration:14s;animation-delay:0s;background-image:url(petals/p0.png);width:16px;height:20px}
.petals i:nth-child(2){left:22%;animation-duration:18s;animation-delay:2s;background-image:url(petals/p1.png);width:22px;height:26px}
.petals i:nth-child(3){left:38%;animation-duration:12s;animation-delay:4s;background-image:url(petals/p2.png)}
.petals i:nth-child(4){left:55%;animation-duration:16s;animation-delay:1s;background-image:url(petals/p3.png);width:20px;height:24px}
.petals i:nth-child(5){left:68%;animation-duration:20s;animation-delay:3s;background-image:url(petals/p0.png)}
.petals i:nth-child(6){left:82%;animation-duration:13s;animation-delay:5s;background-image:url(petals/p1.png);width:14px;height:18px}
.petals i:nth-child(7){left:15%;animation-duration:17s;animation-delay:7s;background-image:url(petals/p2.png)}
.petals i:nth-child(8){left:90%;animation-duration:15s;animation-delay:2.5s;background-image:url(petals/p3.png)}
@keyframes fall{0%{transform:translateY(-10vh) rotate(0deg);opacity:0}
10%{opacity:.9}100%{transform:translateY(110vh) rotate(360deg);opacity:.2}}
@media (prefers-reduced-motion:reduce){.petals{display:none}}

.scrolls{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 18px}
.scroll{margin:0;width:150px;text-align:center}
.kake{display:flex;flex-direction:column;align-items:center;filter:drop-shadow(0 12px 18px rgba(40,20,10,.25));transition:transform .25s}
.kake:hover{transform:translateY(-3px)}
.rod{display:block;width:158px;height:9px;background:linear-gradient(180deg,#8a6a3e,#3d2a16);border-radius:2px}
.rod.top{position:relative;background:linear-gradient(180deg,#8a6a3e,#4a3218)}
.rod.top::before,.rod.top::after{content:"";position:absolute;top:50%;width:8px;height:8px;border-radius:50%;
  background:#c9a45a;transform:translateY(-50%);box-shadow:0 0 0 1px #5a4020}
.rod.top::before{left:6px}.rod.top::after{right:6px}
.silk{display:block;width:140px;padding:9px 7px;background:linear-gradient(180deg,#fffaf0,#f0e4cc)}
.silk img{display:block;width:100%;height:160px;object-fit:cover;border:1px solid rgba(80,50,20,.2)}
figcaption{margin-top:10px;font:600 10px/1.3 "Cormorant SC",serif;letter-spacing:.14em;text-transform:uppercase;color:#5c4a32}
@media(max-width:700px){.scroll{width:42vw}.silk{width:38vw}.silk img{height:42vw}.rod{width:44vw}}

.scrolls.compact{gap:22px 14px}
.scrolls.compact .scroll{width:122px}
.scrolls.compact .rod{width:130px;height:8px}
.scrolls.compact .silk{width:114px;padding:7px 6px}
.scrolls.compact .silk img{height:132px}
.scrolls.compact figcaption{font-size:9.5px;letter-spacing:.12em}
.wall-div{display:flex;align-items:center;justify-content:center;gap:14px;margin:26px auto;max-width:420px;color:#b08a4a;position:relative;z-index:1}
.wall-div span{flex:1;height:1px;background:linear-gradient(90deg,transparent,#c9a45a,transparent)}
.wall-div i{font-style:normal;font-size:18px;opacity:.8}
@media(max-width:700px){.gallery{padding-left:10px;padding-right:10px}.wall{padding-left:10px;padding-right:10px}.split{padding-left:12px;padding-right:12px}.scrolls.compact .scroll{width:27vw}.scrolls.compact .silk{width:25vw;border-left-width:4px;border-right-width:4px}.scrolls.compact .silk img{height:30vw}.scrolls.compact .rod{width:27vw}
.scrolls.compact{gap:16px 8px}.scrolls.compact figcaption{font-size:8.5px}}

*{box-sizing:border-box}html,body{margin:0}
html{background:#1a2238}
body{font:18px/1.55 "EB Garamond","Sawarabi Mincho",Georgia,serif;color:#1e1a14;min-height:100vh;background:#f4ecd8}
a{color:#7a2e28;text-decoration:none}
.nav{display:flex;justify-content:center;gap:8px 22px;flex-wrap:wrap;padding:14px 16px;background:rgba(26,34,56,.92);
  position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(201,164,90,.35)}
.nav a{font:600 11px/1 "Cormorant SC",serif;letter-spacing:.26em;text-transform:uppercase;color:#f3e6c8;padding:8px 4px}
.nav a[aria-current="page"],.nav a:hover{color:#e0c078}
.hero{position:relative;min-height:min(58vh,560px);background:#1a2238 center/cover no-repeat;
  background-image:linear-gradient(180deg,rgba(12,18,36,.12) 0%,rgba(12,18,36,.25) 50%,rgba(244,236,220,.55) 78%,rgba(244,236,220,.98) 100%),
  url(scene/castle-scene.jpg);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.hero-inner{text-align:center;padding:36px 24px 40px;position:relative;z-index:2;max-width:820px}
.kanji{font:700 22px/1 "BIZ UDPMincho",serif;color:rgba(255,240,220,.75);letter-spacing:.5em;margin:0 0 14px;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.eyebrow{font:600 11px/1 "Cormorant SC",serif;letter-spacing:.4em;text-transform:uppercase;color:#f3e6c8;margin:0 0 14px;text-shadow:0 1px 8px rgba(0,0,0,.5)}
h1{margin:0;font:600 46px/1.1 "Cormorant SC",serif;letter-spacing:.14em;text-transform:uppercase;color:#fff8ec;text-shadow:0 2px 18px rgba(0,0,0,.55)}
.artist{margin:14px 0 0;font:400 34px/1.2 "Great Vibes",cursive;color:#ffe6c8;text-shadow:0 2px 10px rgba(0,0,0,.45)}
.lead{margin:18px auto 0;max-width:480px;color:rgba(255,245,230,.9);font-style:italic;font-size:18px;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.gallery,.page{background:#f4ecd8;background-image:radial-gradient(rgba(120,90,40,.05) 1px,transparent 1px);background-size:5px 5px;
  padding:48px 28px 64px;position:relative}
.gallery::before{content:"";position:absolute;inset:0;background:url(scene/sakura-petals.jpg) center/cover;opacity:.12;pointer-events:none}
.section-title,.page-title{position:relative;z-index:1;text-align:center;font:600 13px/1 "Cormorant SC",serif;letter-spacing:.32em;
  text-transform:uppercase;color:#5c4a32;margin:0 0 28px}
.page-title{font-size:22px;letter-spacing:.18em;margin-bottom:18px}
.page .prose{position:relative;z-index:1;max-width:560px;margin:0 auto;text-align:center;color:#5c4a32;font-size:19px;line-height:1.7}
.page .prose p{margin:0 0 1em}
.silk{border-left:6px solid #8b1e1e;border-right:6px solid #8b1e1e}
.bio{position:relative;z-index:1;text-align:center;margin:40px auto 0;max-width:360px;font-style:italic;color:#6b5a44}
.more{position:relative;z-index:1;text-align:center;margin:28px 0 0}
.more a{font:600 12px/1 "Cormorant SC",serif;letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid rgba(122,46,40,.4);padding-bottom:4px}
footer{background:#1a2238;color:rgba(243,230,200,.55);text-align:center;padding:18px;font:600 10px/1 "Cormorant SC",serif;
  letter-spacing:.28em;text-transform:uppercase}
.page-hero{padding:56px 24px 20px;text-align:center;background:linear-gradient(180deg,#1a2238,#f4ecd8);color:#fff8ec}
.page-hero h1{font-size:34px;color:#fff8ec;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.page-hero .artist{font-size:26px}
@media(max-width:700px){h1{font-size:30px}.artist{font-size:28px}.hero{min-height:46vh}.page-hero h1{font-size:26px}}
