/* Supplied tsuri artwork frames the reading space. */
:root { --orange:#d9240e; --yellow:#f9b900; --purple:#c6645b; --cream:#fff9ed; --ink:#430b0b; }
body { background:#430b0b; color:var(--cream); }
body::before { background:#430b0b; }
body::after { background:none; box-shadow:none; }
.tsuri-backdrop { position:fixed; inset:0; z-index:-1; overflow:hidden; pointer-events:none; }
/* Extend the colored sheets to the ceiling, behind their original eye fringe. */
.tsuri-backdrop::before { content:""; position:absolute; inset:-10vh 0 auto; height:calc(30vw + 10vh); background:linear-gradient(90deg,#d9240e 50%,#c6645b 50%); clip-path:polygon(0 0,100% 0,100% 28%,50% 100%,0 28%); }
.tsuri-backdrop img { position:absolute; max-width:none; }
.tsuri-red { width:130vw; left:-86vw; top:-7vw; transform:rotate(24deg); }
.tsuri-purple { width:130vw; right:-86vw; top:-7vw; transform:rotate(-24deg); }
.tsuri-yellow { width:100vw; left:0; bottom:-3vw; transform:rotate(180deg); }
.site-header { background:linear-gradient(#430b0bf5,#430b0bbb,transparent); }
.hero::before { background:linear-gradient(90deg,transparent,#430b0b55 28% 72%,transparent); }
.hero { background:none; }
.hero-logo.event-main-title .event-wordmark-image { filter:drop-shadow(0 5px 0 #3b1714); }
.event-subtitle,.theme-prelude,.hero-copy { color:#fff9ed; text-shadow:0 2px 3px #430b0b; }
.eyebrow { color:#ffe064; }
.event-meta { background:#430b0bf5; border:2px solid #c6645b; box-shadow:8px 8px 0 #230d0b; backdrop-filter:none; }
.event-meta small { color:#ffe064; }
.festival-eye { right:5%; width:clamp(130px,15vw,200px); }
.festival-eye img,.festival-eye.is-awake img { filter:none; }
.festival-eye p:not(:empty) { background:#52211d; border:2px solid #f9b900; }
.venue-canopy { top:-26px; filter:drop-shadow(0 8px 22px #e4302733); opacity:1; }
.canopy-row-1,.canopy-row-2 { opacity:1; }
.section { background:#430b0bf0; border-color:#c6645b66; }
.section-heading h2 { color:#fff9ed; }
.section-heading p { color:#ffe064; }
.news-section { background:#5c1010ed; border-block:2px solid #c6645b; }
.news-list,.news-item { border-color:#c6645b88; }
.tag { background:#f9b900; color:#351310; border-color:#f9b900; }
.about-section { background:#5a1010e8; }
.program-section { background:#430b0bf2; }
.access-section { background:#641212ee; }
.history-section { background:#3b1815e8; }
.closing { background:#430b0b77; }
footer { background:#430b0bf2; border-color:#c6645b; }
.section-intro,.access-copy,.news-item { color:#fff9ed; }
.venue-world { border:3px solid #c6645b; box-shadow:9px 9px 0 #230d0b; background:#430b0b; }
.venue-world figcaption { background:#53221d; }
.venue-world strong,.venue-world figcaption>span { color:#ffe064; }
.program-card-front,.map-card { border-color:#c6645b; }
.program-card-back { background:#ffe064; }
.chapter-guide { background:#53221df5; border-color:#f9b900; }
.news-detail { background:#430b0bf0; }
.news-detail-body { color:#3c2116; }
.intro-paper,.lantern-intro,.route-lantern-transition { background:#430b0b; }
.lantern-passage-depth { background:radial-gradient(ellipse at 50% 44%,#c6645b 0,#53221d 35%,#430b0b 70%); }
.passage-lantern { filter:drop-shadow(0 0 18px #ff7f2366); }
.lantern-story .chapter-guide img { filter:drop-shadow(0 0 10px #ff9b4155); }
.lantern-passage-glow { background:radial-gradient(ellipse at 50% 44%,#ffe064,#f9b900 55%,#d9240e); }
@media(max-width:800px) {
 .tsuri-backdrop::before { height:calc(65vw + 10vh); clip-path:polygon(0 0,100% 0,100% 65%,50% 100%,0 65%); }
 .tsuri-red { width:210vw; left:-155vw; top:0; transform:rotate(34deg); }
 .tsuri-purple { width:210vw; right:-155vw; top:0; transform:rotate(-34deg); }
 .tsuri-yellow { width:180vw; left:-40vw; bottom:-4vw; }
 .festival-eye { right:auto; width:145px; }
 .hero::before { background:#430b0b22; }
 .event-meta { box-shadow:5px 5px 0 #230d0b; }
 .section { padding-inline:24px; }
}
/* Reversible atmosphere without a dedicated guide panel or a time-based loop. */
.scroll-atmosphere .tsuri-backdrop { transform:translateY(var(--scroll-world-y,0px)) rotate(var(--scroll-world-turn,0deg)) scale(var(--scroll-world-scale,1.04)); }
.scroll-atmosphere .immersive-air::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at 50% 38%,rgb(255 185 55 / var(--scroll-light,.025)),transparent 70%); }
.scroll-atmosphere .venue-canopy-row img { animation:none; transform:translateX(-50%) translateY(var(--scroll-lantern-y,0px)) rotate(var(--scroll-lantern-turn,0deg)); }
.scroll-atmosphere .lantern-story .story-bat img { animation:none; transform:rotate(var(--scroll-lantern-turn,0deg)); }

/* A scroll-controlled foreground gives the existing festival an approachable depth. */
.immersive-air { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:4; contain:layout paint; }
.depth-lantern { position:absolute; left:50%; top:0; width:clamp(80px,11vw,170px); height:auto; margin-left:-5.5vw; opacity:0; transform-origin:center; will-change:transform,opacity; }
.depth-spark { position:absolute; left:50%; top:0; width:3px; height:3px; border-radius:50%; background:#ffe7a4; box-shadow:0 0 9px 2px #ffb64b66; }
.depth-light { position:absolute; inset:0; opacity:var(--depth-haze,.12); mix-blend-mode:screen; }
.depth-light-warm { background:radial-gradient(ellipse at -12% 55%,#ff731d,transparent 48%); }
.depth-light-violet { background:radial-gradient(ellipse at 112% 28%,#ff9f96,transparent 48%); }
.scroll-atmosphere .canopy-row-0 { transform:translateY(calc(var(--depth-canopy,0px) * -.25)) scale(1.02); }
.scroll-atmosphere .canopy-row-1 { transform:translateY(calc(var(--depth-canopy,0px) * -.55)) scale(1.06); }
.scroll-atmosphere .canopy-row-2 { transform:translateY(calc(var(--depth-canopy,0px) * -1)) scale(1.12); }
@media(max-width:800px) {
 .depth-lantern { width:85px; margin-left:-42px; }
 .depth-lantern:nth-of-type(n+5) { display:none; }
 .depth-spark { width:2px; height:2px; }
}
@media(prefers-reduced-motion:reduce) {
 .depth-lantern,.depth-spark { display:none; }
}

/* Hidden residents share the official tsuri eye artwork. */
.castle-window-arch.resident-town img { width:84%; left:50%; bottom:12%; object-fit:contain; }
.news-pumpkin button img,.graveyard-reveal button img,.tiny-resident button img { object-fit:contain; }
.news-pumpkin.is-found button img,.graveyard-reveal.is-found button img,.tiny-resident.is-found button img { filter:drop-shadow(0 0 15px #ffe06499); }

/* The supplied pillar lettering sits immediately beneath the event logo. */
.hero .event-subtitle { margin:-25px 0 0; position:relative; z-index:1; line-height:0; }
.event-subtitle img { display:block; width:clamp(200px,21vw,300px); height:auto; filter:drop-shadow(0 2px 2px #430b0b66); }
@media(max-width:800px) { .hero .event-subtitle { margin:-14px 0 0; } }

/* Mouths have their own viewport anchors so the wide artwork cannot scatter them. */
.tsuri-face { display:block; width:clamp(145px,18vw,250px); }
.tsuri-face-red { left:6%; top:30vh; transform:translateY(-50%) rotate(-5deg); }
.tsuri-face-purple { right:6%; top:30vh; transform:translateY(-50%) rotate(5deg); }
.tsuri-face-yellow { left:50%; bottom:14vh; width:clamp(120px,14vw,180px); transform:translateX(-50%); }
@media(max-width:800px) {
 .tsuri-face { display:block; width:clamp(116px,29vw,232px); }
 .tsuri-face-red { left:18px; top:130px; transform:rotate(8deg); }
 .tsuri-face-purple { right:18px; top:130px; transform:rotate(-8deg); }
 .tsuri-face-yellow { left:auto; right:12px; bottom:3vh; width:clamp(120px,30vw,240px); transform:none; }
}

/* Center the visible letterforms; hang punctuation outside the text axis. */
.about-copy .section-heading { display:flex; flex-direction:column; align-items:center; text-align:center; }
.about-copy .section-heading > p { padding-left:.25em; }
.about-copy .section-heading h2 { font-family:"Zen Maru Gothic","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; font-weight:900; letter-spacing:.08em; line-height:1.45; }
.about-title-line { display:block; position:relative; width:max-content; margin-inline:auto; padding-left:.08em; }
.about-title-punctuation { position:absolute; left:100%; letter-spacing:0; }
.about-copy .section-heading > span { padding-left:.16em; text-wrap:balance; }

/* Keep moving lanterns on transform/opacity paths; the artwork already contains its glow. */
.passage-lantern,.venue-canopy { filter:none; }
.depth-lantern { filter:none; }
.lantern-story .foreground-fog { filter:none; }
/* Keep the yellow field continuous when its illustrated fringe rises. */
.tsuri-backdrop::after { content:""; position:absolute; left:-20%; right:-20%; bottom:-20vh; height:calc(20vh + 150px); background:#f9b900; z-index:-1; }

/* Each mouth travels with its artwork; the lower colors share one intact contour. */
.tsuri-backdrop::before,.tsuri-backdrop::after { display:none; }
.tsuri-red-plane,.tsuri-lower-plane { position:absolute; aspect-ratio:1471 / 521; }
.tsuri-red-plane { width:120vw; left:-10vw; top:-5vw; }
.tsuri-lower-plane { width:100vw; left:0; bottom:-3vw; }
.tsuri-red-plane::before { content:""; position:absolute; inset:auto 0 99%; height:50vh; background:#d9240e; }
.tsuri-lower-plane::after { content:""; position:absolute; inset:99% 0 auto; height:50vh; background:#d9240e; }
.tsuri-art { width:100%; height:100%; inset:0; }
.tsuri-lower-plane .tsuri-art { transform:rotate(180deg); }
.tsuri-mouth { height:auto; width:16%; }
.red-mouth { left:20%; top:23%; transform:rotate(-5deg); }
.yellow-mouth { left:12%; bottom:8%; }
.purple-mouth { right:12%; bottom:8%; }
@media(max-width:800px) {
 .tsuri-red-plane { width:180vw; left:-40vw; top:-5vw; }
 .tsuri-lower-plane { width:180vw; left:-40vw; bottom:-4vw; }
 .red-mouth { left:43%; top:23%; width:18%; }
 .yellow-mouth { left:27%; bottom:9%; width:16%; }
 .purple-mouth { right:27%; bottom:9%; width:16%; }
}

/* September revision: compact English subtitle and supplied program artwork. */
.hero .event-subtitle { margin:14px 0 0; line-height:1.4; font-family:"Zen Maru Gothic",sans-serif; font-size:clamp(17px,2vw,25px); font-weight:900; letter-spacing:.13em; color:#ffe064; }
.event-wordmark .event-wordmark-eye { top:-11%; }
.hero-logo.event-main-title { margin-bottom:0; }
.about-copy .section-heading h2 { font-size:clamp(32px,5vw,68px); }
.town-awakening { width:min(100%,1000px); margin:64px auto 0; display:grid; grid-template-columns:minmax(180px,1fr) 2fr; gap:40px; align-items:center; }
.town-awakening img { width:100%; height:auto; object-fit:contain; }
.town-awakening p { font-size:15px; line-height:2.2; margin:0 0 22px; }
.program-images { position:absolute; inset:0; display:block; }
.program-images.has-pair { display:grid; grid-template-rows:1fr 1fr; }
.program-images.has-pair img { min-height:0; }
.program-front-copy b { font-family:"Zen Maru Gothic",sans-serif; font-weight:900; font-size:clamp(22px,2.4vw,34px); line-height:1.2; overflow-wrap:anywhere; }
.program-theme { display:block; font-size:12px; margin-bottom:10px; font-weight:800; }
.program-card-back > b { font-family:"Zen Maru Gothic",sans-serif; font-size:clamp(21px,2.5vw,32px); }
@media(max-width:800px) { .town-awakening { grid-template-columns:1fr; gap:12px; } .town-awakening img { max-width:220px; margin:auto; } .about-copy .section-heading h2 { font-size:clamp(26px,7vw,48px); } .program-front-copy b { font-size:28px; } }

/* Give the three-line invitation and practical details a clear visual hierarchy. */
.hero .hero-copy { margin:40px 0 46px; font-size:clamp(30px,3.8vw,54px); font-weight:900; line-height:1.6; letter-spacing:.08em; text-shadow:0 3px 8px #430b0bcc; }
.hero-copy > span { display:block; }
.hero .event-meta { width:min(1160px,100%); max-width:none; border:2px solid #ffe064; background:#430b0bf7; }
.hero .event-meta div { flex-direction:column; gap:9px; padding:24px 16px; }
.hero .event-meta small { font-size:16px; font-weight:900; }
.hero .event-meta strong { font-size:clamp(23px,2.25vw,30px); font-weight:900; line-height:1.4; letter-spacing:.025em; overflow-wrap:normal; }
.hero .event-meta em { display:block; font-size:16px; text-align:center; letter-spacing:.1em; }
@media(max-width:800px) {
 .hero .hero-copy { margin:32px 0 36px; font-size:clamp(27px,7.4vw,42px); letter-spacing:.04em; line-height:1.65; }
 .hero .event-meta { width:100%; max-width:520px; }
 .hero .event-meta div { flex-direction:row; justify-content:flex-start; padding:20px 16px; gap:14px; }
 .hero .event-meta small { min-width:56px; font-size:13px; }
 .hero .event-meta strong { font-size:clamp(21px,5.7vw,28px); }
 .hero .event-meta em { text-align:left; font-size:13px; }
}

/* The eye and statement form the opening row; the narrative follows below. */
.town-awakening { grid-template-columns:minmax(140px,220px) minmax(0,1fr); gap:32px 40px; text-align:left; }
.town-awakening-title { margin:0; color:#fff9ed; font-size:clamp(22px,2.3vw,32px); font-weight:900; line-height:1.75; letter-spacing:.025em; }
.town-awakening-body { grid-column:2; min-width:0; }
.town-awakening-body p { font-size:clamp(16px,1.5vw,19px); line-height:2.1; }
@media(max-width:800px) {
 .town-awakening { grid-template-columns:minmax(70px,100px) minmax(0,1fr); gap:24px 18px; }
 .town-awakening-title { font-size:clamp(18px,4.3vw,25px); line-height:1.7; }
 .town-awakening img { width:100%; }
}

/* Reserve real space for the closing eye so it cannot overlap the line above. */
.closing-logo { margin-top:24px; }
.closing-logo .event-wordmark { display:flex; flex-direction:column; align-items:center; gap:16px; }
.closing-logo .event-wordmark-eye { position:static; order:-1; flex:none; width:8%; height:auto; }

.closing .closing-ja { font-size:clamp(28px,3.8vw,48px); font-weight:900; line-height:1.6; letter-spacing:.08em; margin:48px 20px 32px; text-wrap:balance; }
@media(max-width:600px) { .closing .closing-ja { font-size:clamp(24px,6.5vw,34px); letter-spacing:.04em; margin-inline:12px; } }
