/* Five chambers share one ink path, with a quiet light at each threshold. */
.ink-site.temple-journey .world-chapters{grid-template-columns:repeat(5,minmax(0,1fr));background:#100c09;border-color:#a8894945;padding:0 4%;position:relative}
.ink-site.temple-journey .world-chapters:after{content:'';position:absolute;inset:auto 4% 0;height:1px;background:linear-gradient(90deg,transparent,#d7b975 22%,#d7b975 80%,transparent);pointer-events:none}
.temple-journey .world-chapters a{font-size:19px;gap:12px;min-height:84px;padding:20px 8px;border-color:#b4954b24;position:relative}
.temple-journey .world-chapters small{display:grid;place-items:center;border:1px solid #a4442f80;width:28px;height:32px;color:#d7b579;font-size:15px}
.temple-journey .world-chapters a:hover,.temple-journey .world-chapters a[aria-current="location"]{background:#5c211629;color:#fff0ca}
.temple-journey .world-chapters a[aria-current="location"] small{background:#a53624;border-color:#cd9460;color:#f7e6c0}
.temple-gate{min-height:290px;position:relative;isolation:isolate;overflow:hidden;padding:65px 8% 55px;background:#090807;display:flex;flex-direction:column;justify-content:center;border-top:1px solid #b69a5020}
.temple-gate:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 61% 60%,#a66e2417,transparent 57%);pointer-events:none;z-index:-1}
.gate-glyph{position:absolute;right:10%;top:50%;transform:translateY(-50%);font:500 clamp(170px,19vw,290px)/1 var(--serif);color:#c6a2580b;pointer-events:none;z-index:-1}
.temple-gate{scroll-margin-top:15px}
.gate-ink{position:absolute;inset:4% -3% -12%;width:106%;height:108%;object-fit:fill;opacity:.75;z-index:-1;pointer-events:none}
.gate-kicker{font-size:13px;letter-spacing:.15em;color:#bc9a5e;margin:0 0 17px;display:flex;align-items:center;gap:15px}
.gate-kicker:before{content:'';width:23px;height:3px;background:#b13a26}
.gate-title{font:500 clamp(39px,4.9vw,72px)/1.4 var(--serif);letter-spacing:.08em;color:#eee2c4;margin:0}
.gate-subtitle{font-size:17px;line-height:1.9;color:#bda983;margin:17px 0 0}
.gate-ray{position:absolute;left:8%;right:8%;bottom:31px;height:1px;background:linear-gradient(90deg,#c8a76505,#d1ac6180 30%,#d1ac6140 70%,transparent);pointer-events:none}
.gate-ray:after{content:'';position:absolute;top:-2px;left:12%;width:42px;height:5px;opacity:0;background:radial-gradient(ellipse,#fff0bd,#d5ae6360 30%,transparent 70%);box-shadow:0 0 26px #dab76425}
.gate-lit .gate-ray:after{animation:temple-ray-pass 3.8s ease-out both}
.gate-lit .gate-ink{animation:temple-ink-arrive 4s ease-out both}
.gate-suspended .gate-ray:after,.gate-suspended .gate-ink{animation-play-state:paused}
@keyframes temple-ray-pass{0%{left:8%;opacity:0}22%{opacity:1}85%{opacity:.6}100%{left:85%;opacity:0}}
@keyframes temple-ink-arrive{from{opacity:.45;transform:scaleX(.96)}to{opacity:.75;transform:scaleX(1)}}
.ink-site.temple-journey #pillars,.ink-site.temple-journey #five-phases,.ink-site.temple-journey #time,.ink-site.temple-journey #philosophy{scroll-margin-top:35px}
.ink-site.temple-journey .hero-bottom{border-bottom:1px solid #c7a45d50}
.ink-site.temple-journey .relations-section,.ink-site.temple-journey .archive-scene{border-top:1px solid #b89a5035}

/* Selection travels through the existing ink painting and the two relations. */
.ink-site .five-phases-ink[data-selected]{opacity:.21;transition:opacity 1.4s ease}
.ink-site .five-ink-art>.ink-still{opacity:.72}
.ink-site .five-ink-art>.ink-motif{opacity:.42;transition:opacity 1.5s ease}
.ink-site .five-ink-art>.ink-motif.is-selected{opacity:1}
.ink-site .five-phases-ink[data-selected="wood"] .ink-wood{animation-duration:19s}
.ink-site .five-phases-ink[data-selected="fire"] .ink-fire{animation-duration:11s}
.ink-site .five-phases-ink[data-selected="earth"] .ink-earth{animation-duration:28s}
.ink-site .five-phases-ink[data-selected="metal"] .ink-metal{animation-duration:19s}
.ink-site .five-phases-ink[data-selected="water"] .ink-water{animation-duration:15s}
.ink-site .element-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}
.ink-site .element-connections .connection{fill:none;stroke:#e1bd77;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.ink-site .element-connections .connection-control{stroke:#caa15f;stroke-width:1.4;stroke-dasharray:.035 .025;opacity:.88}
.ink-site .element-connections marker path{fill:#e1bd77;stroke:none}
.ink-site .element-connections .connection-draw{animation:element-line-draw 1.8s ease-out both}
.ink-site .element-connections .connection-control.connection-draw{animation:element-control-light 1.8s ease-out both}
.ink-site .elements-orbit .element,.ink-site .elements-orbit .orbit-center{z-index:2}
@keyframes element-line-draw{from{stroke-dasharray:1;stroke-dashoffset:1;opacity:0}to{stroke-dasharray:1;stroke-dashoffset:0;opacity:1}}
@keyframes element-control-light{from{opacity:0}to{opacity:.88}}
.ink-site .element-description h3>span{display:inline-block}
.element-current-relations{border-top:1px solid #b6995138;margin:26px 0 0;padding-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px 25px}
.element-current-relations p{margin:0;display:flex;align-items:center;gap:14px;flex-wrap:wrap;line-height:1.8}
.element-current-relations span{font-size:13px;color:#aa8d5b;border:1px solid #ad905946;padding:2px 9px}
.element-current-relations strong{font:500 22px/1.7 var(--serif);color:#d8b977;letter-spacing:.08em}
.element-current-relations small{font-size:13px;color:#a8997a;display:block;flex-basis:100%}

/* The four columns unfold once, then the day stem receives its vermilion seal. */
.ink-site .pillar-replay{display:flex;align-items:center;gap:9px;min-height:44px;align-self:center;border:1px solid #a7894a55;padding:8px 14px;background:#150e09;color:#cdb17b;font:400 13px/1.6 var(--serif);letter-spacing:.035em;margin-left:auto}
.ink-site .pillar-replay:hover{background:#a3332229;border-color:#c7a669}
.ink-site .pillar-replay:disabled{opacity:.45;cursor:default}
.ink-site .meishiki-book .book-heading{flex-wrap:wrap;align-items:center}
.ink-site .meishiki-book .book-heading>span:last-of-type{font:12px/1.8 Georgia,serif;letter-spacing:.12em}
.ink-site .pillar[data-pillar="2"] .chart-stem b{position:relative;isolation:isolate;border:0;border-radius:0}
.day-master-imprint{position:absolute;inset:-2px;z-index:-1;border:3px double #e16843;background:#3f100a35;box-shadow:0 0 0 3px #b75a3224,inset 0 0 0 5px #e7b46a13;transform:rotate(-4deg);pointer-events:none}
.ink-site .pillar-opening-ready:not(.opening-complete) .pillar{opacity:.2;transform:translateY(16px)}
.ink-site .pillar-opening-ready:not(.opening-complete) .chart-stem b,.ink-site .pillar-opening-ready:not(.opening-complete) .chart-branch b,.ink-site .pillar-opening-ready:not(.opening-complete) .day-master-imprint{opacity:0}
.ink-site .opening-active .pillar{animation:pillar-unfold .72s cubic-bezier(.2,.6,.2,1) var(--column-delay) both}
.ink-site .opening-active .chart-stem b{animation:pillar-character .57s ease-out calc(var(--column-delay) + .18s) both}
.ink-site .opening-active .chart-branch b{animation:pillar-character .57s ease-out calc(var(--column-delay) + .38s) both}
.ink-site .opening-active .day-master-imprint{animation:day-master-stamp .72s ease-out 1.78s both}
.ink-site .opening-suspended .pillar,.ink-site .opening-suspended .chart-stem b,.ink-site .opening-suspended .chart-branch b,.ink-site .opening-suspended .day-master-imprint{animation-play-state:paused}
@keyframes pillar-unfold{from{opacity:.2;transform:translateY(16px);filter:brightness(.6)}to{opacity:1;transform:none;filter:brightness(1)}}
@keyframes pillar-character{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes day-master-stamp{0%{opacity:0;transform:rotate(-10deg) scale(1.4)}65%{opacity:.85;transform:rotate(-4deg) scale(1.02)}100%{opacity:1;transform:rotate(-4deg) scale(1)}}
.ink-site.motion-paused .temple-gate .gate-ink,.ink-site.motion-paused .temple-gate .gate-ray:after,.ink-site.motion-paused .element-connections .connection{animation:none}
.ink-site.motion-paused .pillar-opening-ready .pillar,.ink-site.motion-paused .pillar-opening-ready .chart-stem b,.ink-site.motion-paused .pillar-opening-ready .chart-branch b{animation:none;opacity:1;transform:none;filter:none}
.ink-site.motion-paused .pillar-opening-ready .day-master-imprint{animation:none;opacity:1;transform:rotate(-4deg)}
.ink-site.motion-paused .ink-motif,.ink-site.motion-paused .five-phases-ink{transition:none}
@media(max-width:1100px) and (min-width:801px){.temple-journey .world-chapters a{font-size:16px;gap:8px}.temple-journey .world-chapters small{width:22px;height:28px}}
@media(max-width:800px){
 .ink-site.temple-journey .world-chapters{grid-template-columns:1fr 1fr;padding:0 5%}
 .temple-journey .world-chapters a{justify-content:flex-start;font-size:16px;min-height:69px;padding:15px 10px}
 .temple-journey .world-chapters a:last-child{grid-column:1/-1;justify-content:center;border-right:0}
 .temple-gate{min-height:215px;padding:43px 7% 48px}
 .gate-title{font-size:clamp(31px,8.5vw,44px);letter-spacing:.035em}
 .gate-kicker{font-size:12px;margin-bottom:12px}
 .gate-subtitle{font-size:15px;margin-top:11px}
 .gate-ink{inset:13% -22% -5%;width:144%;height:95%}
 .gate-ray{left:7%;right:7%;bottom:27px}
 .gate-glyph{right:5%;font-size:170px}
 .element-current-relations{gap:12px;margin-top:22px}
 .element-current-relations strong{font-size:20px;letter-spacing:.03em}
 .element-current-relations p{gap:8px}
 .element-current-relations small{font-size:12px}
 .ink-site .pillar-replay{margin:12px auto 0;justify-content:center;font-size:12px}
 .ink-site .meishiki-book .book-heading{display:block}
 .ink-site .meishiki-book .book-heading>span:last-of-type{display:block;font-size:12px;letter-spacing:.025em;margin-top:8px}
 .day-master-imprint{border-width:2px;box-shadow:0 0 0 2px #b75a3224,inset 0 0 0 3px #e7b46a13}
}
@media(max-width:370px){.temple-journey .world-chapters a{font-size:15px;gap:8px;padding-inline:5px}.temple-journey .world-chapters small{font-size:13px;width:24px;height:28px}.element-current-relations strong{font-size:18px}.element-current-relations span{padding:2px 7px;font-size:12px}.ink-site .meishiki-book .book-heading>span:last-of-type{letter-spacing:0}}
@media(prefers-reduced-motion:reduce){
 .temple-gate .gate-ink,.temple-gate .gate-ray:after,.ink-site .element-connections .connection{animation:none}
 .ink-site .pillar-opening-ready .pillar,.ink-site .pillar-opening-ready .chart-stem b,.ink-site .pillar-opening-ready .chart-branch b{animation:none;opacity:1;transform:none;filter:none}
 .ink-site .pillar-opening-ready .day-master-imprint{animation:none;opacity:1;transform:rotate(-4deg)}
 .ink-site .ink-motif,.ink-site .five-phases-ink{transition:none}
}