/* Dongjing Meng Hua Lu — Volume III Entry 18 / Xiangguo Temple */
.dj18-page{--v3-paper:#f2ede2;--v3-ink:#181613;--v3-muted:#746a57;--v3-rule:#cbc0a8;--v3-red:#9d3320;--v3-jade:#4d473c;--v3-soft:#e6ddcc;--v3-night:#181613;--dj18-brass:#8c8066;--dj18-night-2:#1e1c18;--dj18-line:#5c5446}
.dj18-page :lang(zh-Hant){font-family:var(--reading-display-cjk,"Galok QIJIC Reading","Galok Reading Serif TW","Galok HanaMin Reading",serif);font-weight:400;font-synthesis:none}
.dj18-page .dj-title-zh,.dj18-page .dj18-threshold :lang(zh-Hant),.dj18-page .dj18-variants :lang(zh-Hant),.dj18-page .dj18-exit :lang(zh-Hant){font-family:var(--reading-display-cjk,"Galok QIJIC Reading","Galok Reading Serif TW","Galok HanaMin Reading",serif);font-weight:400;font-synthesis:none}
.dj18-page .dj-entry-title h1{font-size:clamp(3.7rem,7vw,8.3rem);line-height:.82;letter-spacing:.04em}
.dj18-page .dj-entry-title h2,.dj18-page .dj-v3-section-head h2,.dj18-page .dj18-threshold-rail b,.dj18-page .dj18-threshold-panel b,.dj18-page .dj18-variants h2,.dj18-page .dj18-exit strong{font-family:var(--reading-display-latin,"Galok Bagnard","Galok Gambetta",Georgia,serif);font-weight:400;font-synthesis:none}
.dj18-paper .dj-columns{height:min(53vh,540px)}

/* Entry 18 turns the threshold section into an abstract architectural section: visual depth, not a fake plan. */
.dj18-system{position:relative;isolation:isolate;overflow:hidden;margin-left:calc((100vw - 100%) / -2);margin-right:calc((100vw - 100%) / -2);padding:clamp(82px,8vw,132px) max(32px,calc((100vw - min(1480px,calc(100vw - 64px))) / 2));background:linear-gradient(180deg,#151410 0%,var(--v3-night) 35%,#1b1a16 100%);color:#eee7da;border-bottom:1px solid var(--v3-ink)}
.dj18-system::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.34;background:linear-gradient(90deg,transparent 0 7%,rgba(238,231,218,.06) 7% 7.08%,transparent 7.08% 18%,rgba(238,231,218,.035) 18% 18.08%,transparent 18.08% 50%,rgba(238,231,218,.035) 50% 50.08%,transparent 50.08% 82%,rgba(238,231,218,.035) 82% 82.08%,transparent 82.08% 93%,rgba(238,231,218,.06) 93% 93.08%,transparent 93.08%),linear-gradient(180deg,rgba(255,255,255,.025),transparent 32%)}
.dj18-system::after{content:"";position:absolute;z-index:-1;left:50%;bottom:-26vw;width:min(82vw,1180px);aspect-ratio:1;border:1px solid rgba(212,97,77,.16);transform:translateX(-50%) rotate(45deg);box-shadow:0 0 0 8vw rgba(238,231,218,.018),0 0 0 16vw rgba(238,231,218,.012);pointer-events:none}
.dj18-system .dj-v3-section-head{position:relative;border-color:var(--dj18-line)}.dj18-system .dj-v3-section-head::after{content:"";position:absolute;left:0;bottom:-1px;width:min(24vw,310px);height:3px;background:#d4614d}.dj18-system .dj-v3-section-head small{color:#d4614d}.dj18-system .dj-v3-section-head p{color:#bcb096}
.dj18-rhythm{display:grid;grid-template-columns:minmax(180px,.34fr) minmax(260px,.62fr) minmax(260px,.62fr);gap:28px;align-items:end;margin:36px 0 28px;padding:24px 22px;border:1px solid var(--dj18-line);background:rgba(238,231,218,.025);backdrop-filter:blur(2px)}
.dj18-rhythm>div:first-child{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:end}.dj18-rhythm small{grid-column:1/3;color:#d4614d;font:760 .75rem/1.2 var(--dj-mono);letter-spacing:.09em}.dj18-rhythm strong{font-family:var(--reading-display-latin,"Galok Bagnard",serif);font-size:clamp(3.4rem,6vw,6.5rem);font-weight:400;line-height:.75}.dj18-rhythm span{padding-bottom:.12em;font-family:var(--reading-display-latin,"Galok Bagnard",serif);font-size:clamp(1rem,1.8vw,1.65rem);line-height:.95}.dj18-rhythm p{margin:0;color:#bcb096;font-family:var(--dj-serif);font-size:.92rem;line-height:1.55}
.dj18-rhythm-marks{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;align-items:end}.dj18-rhythm-marks i{display:block;height:44px;border:1px solid #776e5a;background:linear-gradient(180deg,transparent 0 68%,#d4614d 68% 100%)}.dj18-rhythm-marks i:nth-child(2){height:54px}.dj18-rhythm-marks i:nth-child(3){height:66px}.dj18-rhythm-marks i:nth-child(4){height:78px}.dj18-rhythm-marks i:nth-child(5){height:92px}

.dj18-threshold{position:relative;border-top:1px solid var(--dj18-line);box-shadow:0 28px 90px rgba(0,0,0,.2)}
.dj18-threshold::before{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(212,97,77,.06),transparent 24%,transparent 76%,rgba(212,97,77,.04))}
.dj18-threshold-rail{position:relative;z-index:2;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));border-left:1px solid var(--dj18-line)}
.dj18-threshold-rail button{position:relative;min-width:0;min-height:160px;padding:14px 12px 16px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;color:#eee7da;background:rgba(21,20,16,.7);border:0;border-right:1px solid var(--dj18-line);border-bottom:1px solid var(--dj18-line);cursor:pointer;transition:background 220ms ease,color 220ms ease,transform 220ms ease}
.dj18-threshold-rail button::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:0;background:#d4614d;transition:height 220ms ease}
.dj18-threshold-rail button:nth-child(n+5){background:rgba(35,32,27,.74)}
.dj18-threshold-rail button:nth-child(n+7){background:rgba(41,38,33,.78)}
.dj18-threshold-rail button span{color:#d4614d;font:760 .75rem/1 var(--dj-mono);letter-spacing:.08em}.dj18-threshold-rail button b{margin:auto 0 7px;font-size:clamp(.82rem,1.15vw,1.1rem);line-height:.95;letter-spacing:-.01em}.dj18-threshold-rail button em{color:#bcb096;font-size:1rem;font-style:normal;line-height:1.1}.dj18-threshold-rail button[aria-selected="true"]{background:#eee7da;color:var(--v3-night);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}.dj18-threshold-rail button[aria-selected="true"]::after{height:6px}.dj18-threshold-rail button[aria-selected="true"] span{color:var(--v3-red)}.dj18-threshold-rail button[aria-selected="true"] em{color:#635c4c}.dj18-threshold-rail button:hover{transform:translateY(-3px)}.dj18-threshold-rail button:focus-visible{position:relative;z-index:3;outline:2px solid #eee7da;outline-offset:-4px}.dj18-threshold-rail button[aria-selected="true"]:focus-visible{outline-color:var(--v3-red)}
.dj18-threshold-panels{position:relative;z-index:1;border-left:1px solid var(--dj18-line);border-right:1px solid var(--dj18-line);border-bottom:1px solid var(--dj18-line)}.dj18-threshold-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:46px;min-height:420px;padding:42px;background:linear-gradient(135deg,#1d1a16 0%,#201e1a 56%,#191714 100%);opacity:1;transform:translateY(0);transition:opacity 220ms ease,transform 220ms ease}.dj18-threshold-panel::before{content:"";position:absolute;right:-12%;top:-44%;width:52%;aspect-ratio:1;border:1px solid rgba(212,97,77,.13);transform:rotate(45deg);box-shadow:0 0 0 42px rgba(238,231,218,.018),0 0 0 84px rgba(238,231,218,.012);pointer-events:none}.dj18-threshold-panel[hidden]{display:none}.dj18-threshold-panel.is-entering{opacity:0;transform:translateY(6px)}
.dj18-threshold-panel>header{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:flex-end}.dj18-threshold-panel>header small{color:#d4614d;font:760 .75rem/1.2 var(--dj-mono);letter-spacing:.09em}.dj18-threshold-panel h3{margin:auto 0 18px;max-width:9ch;font-size:clamp(2.5rem,4.9vw,5.8rem);line-height:.87;letter-spacing:.045em;text-wrap:balance}.dj18-threshold-panel>header p{max-width:48ch;margin:0;color:#bcb096;font-family:var(--dj-serif);font-size:1rem;line-height:1.55}
.dj18-layer-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;align-self:stretch;border-top:1px solid var(--dj18-line);border-left:1px solid var(--dj18-line)}.dj18-layer-grid>div{min-height:300px;padding:22px;display:flex;flex-direction:column;border-right:1px solid var(--dj18-line);border-bottom:1px solid var(--dj18-line);background:rgba(9,9,7,.16)}.dj18-layer-grid>div:first-child{background:linear-gradient(180deg,rgba(157,51,32,.08),rgba(9,9,7,.12))}.dj18-layer-grid small{color:#d4614d;font:760 .75rem/1.2 var(--dj-mono);letter-spacing:.08em}.dj18-layer-grid b{margin:auto 0 14px;font-size:clamp(1.55rem,2.5vw,2.8rem);line-height:.95;letter-spacing:-.02em}.dj18-layer-grid span{color:#bcb096;font-family:var(--dj-serif);font-size:.92rem;line-height:1.48}.dj18-layer-grid span:lang(zh-Hant),.dj18-layer-grid b:lang(zh-Hant){font-family:var(--reading-display-cjk,"Galok QIJIC Reading","Galok Reading Serif TW","Galok HanaMin Reading",serif);font-weight:400;color:#e9e1d2;letter-spacing:.035em}

.dj18-variants{margin:96px 0 20px;border-top:1px solid var(--v3-ink)}.dj18-variants>header{display:grid;grid-template-columns:170px 1fr;gap:32px;padding:30px 0;border-bottom:1px solid var(--v3-rule)}.dj18-variants>header small{color:var(--v3-red);font:760 .75rem/1.2 var(--dj-mono);letter-spacing:.09em}.dj18-variants h2{margin:0;font-size:clamp(2.2rem,4.1vw,4.7rem)!important;line-height:.92!important;letter-spacing:-.04em!important}.dj18-variant-table{border-left:1px solid var(--v3-rule);background:linear-gradient(90deg,rgba(157,51,32,.025),transparent 38%)}.dj18-variant-table>div{display:grid;grid-template-columns:120px 1fr 120px 1fr;align-items:center;min-height:92px;border-bottom:1px solid var(--v3-rule)}.dj18-variant-table span,.dj18-variant-table em{padding:16px;color:var(--v3-red);font:760 .75rem/1.2 var(--dj-mono);font-style:normal;letter-spacing:.08em}.dj18-variant-table b,.dj18-variant-table strong{height:100%;padding:16px;display:flex;align-items:center;border-left:1px solid var(--v3-rule);font-size:clamp(1.25rem,2vw,2rem);font-weight:400}.dj18-variant-table strong{color:var(--v3-muted)}.dj18-variants>p{max-width:68ch;margin:24px 0 0;color:var(--v3-muted);font-family:var(--dj-serif);line-height:1.62}

.dj18-exit{position:relative;overflow:hidden;margin-left:calc((100vw - 100%) / -2);margin-right:calc((100vw - 100%) / -2);padding:clamp(92px,10vw,168px) max(32px,calc((100vw - min(1480px,calc(100vw - 64px))) / 2));background:linear-gradient(135deg,#e7dfce,#ede7d9);color:var(--v3-ink);border-bottom:1px solid var(--v3-ink)}.dj18-exit::after{content:"";position:absolute;right:-9vw;bottom:-13vw;width:38vw;aspect-ratio:1;border:1px solid rgba(157,51,32,.18);transform:rotate(45deg);box-shadow:0 0 0 5vw rgba(157,51,32,.025),0 0 0 10vw rgba(77,71,60,.025);pointer-events:none}.dj18-exit>small{display:block;color:var(--v3-red);font:760 .75rem/1.2 var(--dj-mono);letter-spacing:.1em}.dj18-exit>p{margin:34px 0 12px;color:var(--v3-muted);font-family:var(--dj-serif);font-size:1rem}.dj18-exit>strong{position:relative;z-index:1;display:block;max-width:12ch;font-size:clamp(3.3rem,7vw,8rem);line-height:.82;letter-spacing:-.055em}.dj18-exit>div{position:relative;z-index:1;display:flex;justify-content:space-between;gap:30px;align-items:end;margin-top:48px;padding-top:18px;border-top:1px solid var(--v3-ink)}.dj18-exit>div span{font-family:var(--reading-display-mixed,"Galok Bagnard","Galok QIJIC Reading","Galok Reading Serif TW","Galok HanaMin Reading",serif);font-size:clamp(1.35rem,2.4vw,2.5rem);line-height:1}.dj18-exit>div b{font-weight:400}.dj18-exit>div em{color:var(--v3-muted);font-family:var(--dj-serif);font-size:.92rem;font-style:normal}

@media(max-width:1100px){.dj18-rhythm{grid-template-columns:1fr 1fr}.dj18-rhythm>p{grid-column:1/3}.dj18-threshold-rail{grid-template-columns:repeat(4,1fr)}.dj18-threshold-panel{grid-template-columns:1fr;min-height:0}.dj18-threshold-panel>header{min-height:230px}.dj18-layer-grid>div{min-height:240px}.dj18-variants>header{grid-template-columns:1fr;gap:16px}}
@media(max-width:760px){.dj18-page .dj-entry-title h1{font-size:clamp(3rem,13.2vw,5.25rem)}.dj18-system,.dj18-exit{padding-left:20px;padding-right:20px}.dj18-rhythm{grid-template-columns:1fr;gap:20px;padding:20px}.dj18-rhythm>p{grid-column:auto}.dj18-threshold-rail{display:flex;overflow-x:auto;scroll-snap-type:x proximity;border-left:0}.dj18-threshold-rail button{flex:0 0 42vw;min-height:138px;scroll-snap-align:start;border-left:1px solid var(--dj18-line)}.dj18-threshold-panel{padding:24px;gap:28px}.dj18-threshold-panel>header{min-height:220px}.dj18-threshold-panel h3{font-size:clamp(2.7rem,12vw,4.8rem)}.dj18-layer-grid{grid-template-columns:1fr}.dj18-layer-grid>div{min-height:190px}.dj18-variant-table>div{grid-template-columns:1fr 1fr}.dj18-variant-table span,.dj18-variant-table em{border-top:1px solid var(--v3-rule)}.dj18-variant-table b,.dj18-variant-table strong{min-height:70px}.dj18-exit>div{display:grid;grid-template-columns:1fr}.dj18-exit>strong{font-size:clamp(3rem,13vw,5.4rem)}}
@media(prefers-reduced-motion:reduce){.dj18-threshold-panel,.dj18-threshold-rail button,.dj18-threshold-rail button::after{transition:none!important}.dj18-threshold-rail button:hover{transform:none}.dj18-threshold-panel.is-entering{opacity:1;transform:none}}
