:root{--paper:#efeee7;--ink:#29342f;--purple:#4B0082;--gold:#d2cfb8;--serif:'Songti SC','STSong','Noto Serif CJK SC',serif;--ease:cubic-bezier(.22,.78,.2,1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,'PingFang SC',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}a:focus-visible,button:focus-visible{outline:1px solid currentColor;outline-offset:9px}body:after{content:'';position:fixed;inset:0;pointer-events:none;opacity:.025;z-index:50;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}body.loading{overflow:hidden}.cover{position:relative;height:100svh;min-height:560px;overflow:hidden;isolation:isolate}.folio{position:absolute;inset:0;display:grid;place-items:center;clip-path:circle(150vmax at 50% 47%);transition:clip-path 1.8s var(--ease);z-index:1;background:var(--purple)}.paper{position:absolute;inset:0;background:#4B0082 url('/assets/cold-gold.svg') center/1200px 1200px}.paper:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 35% 30%,#b4aac516,transparent 60%);mix-blend-mode:screen}.calligraphy{display:flex;align-items:center;justify-content:center;gap:2vw;width:min(70vw,680px);transform:translateY(-3vh) scale(1);transition:transform 1.8s var(--ease);filter:drop-shadow(0 2px 2px #180d2520)}.calligraphy img{display:block;object-fit:contain;width:44%;height:auto}.calligraphy .jing{max-height:310px;max-width:240px}.calligraphy .hu{max-width:350px;transform:translateY(11px)}.gathered .folio,.settled .folio{clip-path:circle(min(31vw,35vh) at 50% 47%)}.gathered .calligraphy,.settled .calligraphy{transform:translateY(-3vh) scale(.70)}.flying{position:absolute;z-index:3;opacity:0;pointer-events:none;transition:transform 1.15s var(--ease),opacity 1.15s}.directory-link{top:7%;right:7%;display:flex;align-items:center;gap:25px;font:13px var(--serif);letter-spacing:3px;transform:translate(200px,-130px) rotate(8deg)}.directory-link span{font:23px var(--serif);transition:transform .3s}.directory-link:hover span{transform:translate(3px,-3px)}.replay{left:7%;top:calc(7% - 7px);width:38px;height:38px;padding:8px;transform:translate(-160px,-140px) rotate(-90deg)}.replay svg{width:22px;height:22px;transition:transform .5s}.replay:hover svg{transform:rotate(-40deg)}.descend{bottom:7%;left:calc(50% - 22px);width:44px;height:44px;display:grid;place-items:center;font-size:27px;font-weight:200;transform:translateY(180px)}.revealed .flying,.settled .flying{transform:none;opacity:1;pointer-events:auto}.revealed .replay{transition-delay:.08s}.revealed .descend{transition-delay:.17s}.settled *{transition:none!important}.contents{padding:65px 7% 100px;scroll-margin-top:0;max-width:1800px;margin:auto}.contents-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}.contents-top>a{font-size:23px;font-weight:200;padding:8px}.contents-top>span{font:13px var(--serif);letter-spacing:6px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:42px 30px;align-items:start}.card{position:relative;display:block;overflow:hidden;background:var(--card-bg);aspect-ratio:4/5;isolation:isolate}.card:nth-child(3n+2){margin-top:75px}.card:nth-child(3n){margin-top:22px}.card-image{position:absolute;inset:0;overflow:hidden}.card-image img{height:100%;width:100%;object-fit:cover;object-position:center;display:block;transition:transform 1.2s var(--ease),filter .8s;filter:saturate(.78)}.card:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 60px #ffffff0a;pointer-events:none}.card h2{position:absolute;right:25px;top:26px;margin:0;writing-mode:vertical-rl;font:400 25px/1.6 var(--serif);letter-spacing:7px;transition:transform .6s var(--ease)}.card:hover .card-image img{transform:scale(1.045);filter:saturate(1)}.card:hover h2{transform:translateY(7px)}.tone-16{color:#e2e2ca}.tone-07 h2{color:#f0eadb;right:auto;left:28px}.tone-12 h2{color:#182c2d}.tone-09 h2{top:auto;bottom:28px}.poem-world{position:relative;min-height:100svh;background:var(--world-bg);isolation:isolate;overflow:clip}.scene{position:fixed;inset:0;z-index:-2;overflow:hidden}.scene img{display:block;height:100%;width:100%;object-fit:cover;object-position:center}.atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-1}.return{position:fixed;top:max(35px,env(safe-area-inset-top));left:4%;display:flex;align-items:center;gap:17px;font:12px var(--serif);letter-spacing:3px;z-index:8;transition:opacity .3s}.return span{font:24px var(--serif);transition:transform .35s}.return:hover span{transform:translate(-4px,4px)}.poetry{position:relative;width:max-content;max-width:90%;margin-left:66%;padding:18svh 0 90px;animation:poetry-arrive 1.15s var(--ease) both}.poetry h1{font:400 29px/1.6 var(--serif);letter-spacing:5px;margin:0 0 38px}.lines{font:400 21px/2.35 var(--serif);letter-spacing:4px}.lines p{margin:0}.classical .lines p{white-space:nowrap}.modern .poetry{width:38%;margin-left:58%;padding-top:140px}.modern .lines{font-size:18px;letter-spacing:1.5px;line-height:2.3}.modern .lines p{margin-bottom:24px}.modern h1{margin-bottom:45px}.world-01 .poetry{margin-left:69%;padding-top:25svh}.world-01 .atmosphere{background:linear-gradient(90deg,transparent 55%,#d8dfd326)}.world-02 .poetry{margin-left:65%;padding-top:22svh}.world-03 .poetry{margin-left:67%;padding-top:14svh}.world-03 .lines{letter-spacing:7px;line-height:2.1}.world-04 .poetry{margin-left:68%;padding-top:14svh}.world-04 .lines{line-height:2.1}.world-05 .poetry{margin-left:67%;padding-top:20svh}.world-06 .poetry{margin-left:66%;padding-top:28svh}.world-06 .lines{font-size:20px}.world-07 .poetry{margin-left:62%;width:32%;padding-top:120px}.world-07 .lines{font-size:19px;line-height:2.4}.world-07 .lines p{margin-bottom:26px}.world-08 .poetry{margin-left:70%;padding-top:14svh}.world-08 .lines{font-size:20px;line-height:2.15;letter-spacing:3px}.world-09 .poetry{margin-left:68%;padding-top:31svh}.world-09 .lines{font-size:21px;letter-spacing:4px}.world-10 .poetry{margin-left:66%;padding-top:14svh}.world-10 h1{font-size:27px;letter-spacing:2px}.world-10 .lines{font-size:20px;letter-spacing:3px;line-height:2.1}.world-11 .poetry{margin-left:68%;padding-top:12svh}.world-11 .lines{font-size:20px;letter-spacing:3px;line-height:2.15}.world-12 .poetry{margin-left:58%;width:36%;padding-top:120px}.world-12 .scene{opacity:.8}.world-12 .lines{font-size:18px;line-height:2.3}.world-12 .lines p{margin-bottom:27px}.world-13 .poetry{margin-left:68%;padding-top:13svh}.world-13 .lines{letter-spacing:6px;line-height:2.1}.world-14 .poetry{margin-left:69%;padding-top:12svh}.world-14 .lines{font-size:20px;line-height:2.15;letter-spacing:3px}.world-15 .poetry{margin-left:65%;padding-top:13svh}.world-15 .lines{font-size:20px;line-height:2.1;letter-spacing:3px}.world-16{color:#e5e4d0}.world-16 .poetry{margin-left:68%;padding-top:32svh}.world-16 .lines{font-size:22px;letter-spacing:7px}.world-13 .scene img{animation:cyclone-breath 15s ease-in-out infinite}.world-09 .scene img{animation:love-breath 12s ease-in-out infinite}.world-05 .atmosphere{animation:morning-light 9s ease-in-out infinite;background:#fff2cd;mix-blend-mode:soft-light}.world-16 .atmosphere{background:radial-gradient(ellipse at 32% 28%,#c7cebd10,transparent 50%)}.portal{position:fixed;z-index:100;overflow:hidden;pointer-events:none;contain:layout paint;will-change:top,left,width,height;background:var(--card-bg,#efeee7)}.portal img{height:100%;width:100%;object-fit:cover;object-position:33% 50%;display:block}.portal h2{position:absolute;right:25px;top:26px;writing-mode:vertical-rl;font:400 25px var(--serif);letter-spacing:7px;margin:0}.portal.full img{object-position:center}.entering .poetry{animation:none;opacity:0}.entering .return{opacity:0}.arrived .return{animation:poetry-arrive .9s .2s both}@keyframes poetry-arrive{from{opacity:0;transform:translateY(18px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}

/* --- 喜鹊杀人案 OP 风格大剧场转场与版式强化 --- */
:root{--crimson:#9e1c22;--crimson-glow:rgba(158,28,34,0.55);--ink-deep:#111613;--gold-seam:#d2cfb8}
.card{transition:transform .4s var(--ease),box-shadow .4s var(--ease),filter .4s}
.card.card-picked{transform:scale(.95)!important;box-shadow:0 0 0 2px var(--crimson),0 12px 28px rgba(0,0,0,.25)!important;filter:brightness(.92);transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .18s!important}
.card.card-returned{animation:card-return-pulse 1.35s var(--ease) both}
@keyframes card-return-pulse{0%{box-shadow:0 0 0 0 var(--crimson)}40%{box-shadow:0 0 0 7px var(--crimson-glow)}100%{box-shadow:0 0 0 0 transparent}}

/* --- 索尔·巴斯风格：卡片图案物理拉伸 -> 场景矢量苏醒小动画 (3.1s) -> 缓缓落墨 --- */
.theatre-portal{position:fixed;z-index:9999;background:var(--portal-bg,#efeee7);overflow:hidden;isolation:isolate;user-select:none;will-change:top,left,width,height,border-radius,opacity}
.theatre-portal-face{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;transition:opacity .45s ease}
.theatre-portal-face img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.theatre-expanded .theatre-portal-face{opacity:0}

.theatre-portal-svg-wrap{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .45s ease}
.theatre-portal-svg-wrap svg{display:block;width:100%;height:100%;position:absolute;inset:0}
.theatre-expanded .theatre-portal-svg-wrap{opacity:1}

.theatre-portal-title{position:absolute;right:25px;top:26px;z-index:10;writing-mode:vertical-rl;font:400 25px/1.6 var(--serif);letter-spacing:7px;color:var(--ink-deep);pointer-events:none;margin:0}
.op-scene-16 .theatre-portal-title{color:#e2e2ca}
.op-scene-07 .theatre-portal-title{color:#f0eadb;right:auto;left:28px}
.op-scene-12 .theatre-portal-title{color:#182c2d}
.op-scene-09 .theatre-portal-title{top:auto;bottom:28px}

.theatre-return-portal{position:fixed;z-index:9999;overflow:hidden;pointer-events:none;will-change:top,left,width,height,border-radius,opacity}
.return-scene-face,.return-card-face{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.return-scene-face img,.return-card-face img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.return-scene-face{opacity:1;transition:opacity .54s cubic-bezier(.16,1,.3,1)}
.return-card-face{opacity:0;transition:opacity .54s cubic-bezier(.16,1,.3,1)}
.theatre-return-portal.returning .return-scene-face{opacity:0}
.theatre-return-portal.returning .return-card-face{opacity:1}

/* --- 十六首专属动画动作编排：直接驱动 scene-*.svg 真实矢量元素，收尾100%完美还原背景 --- */
/* 01 清明雨 */
.op-scene-01.op-awakened svg path[fill="#889b8a"]{animation:op-01-h1 2.8s cubic-bezier(.16,1,.3,1) both}
.op-scene-01.op-awakened svg path[fill="#4c6c5a"]{animation:op-01-h2 2.9s .12s cubic-bezier(.16,1,.3,1) both}
.op-scene-01.op-awakened svg path[stroke="#e6e9da"]{animation:op-01-rain 3s cubic-bezier(.16,1,.3,1) both}
@keyframes op-01-h1{0%{transform:translateY(220px);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-01-h2{0%{transform:translateY(320px);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-01-rain{0%{transform:translate(70px,-200px);opacity:0}40%{opacity:.8}100%{transform:none;opacity:.5}}

/* 02 思芳草 */
.op-scene-02.op-awakened svg circle[cx="430"]{animation:op-02-moon 3s cubic-bezier(.16,1,.3,1) both;transform-origin:430px 310px}
.op-scene-02.op-awakened svg path[stroke="#87976e"]{animation:op-02-reed-1 3s cubic-bezier(.25,1,.5,1) both;transform-origin:50% 1000px}
.op-scene-02.op-awakened svg path[stroke="#677e54"]{animation:op-02-reed-2 3s .1s cubic-bezier(.25,1,.5,1) both;transform-origin:50% 1000px}
.op-scene-02.op-awakened svg path[stroke="#a8af83"]{animation:op-02-reed-3 3s .2s cubic-bezier(.25,1,.5,1) both;transform-origin:50% 1000px}
@keyframes op-02-moon{0%{transform:translateY(-140px) scale(.75);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-02-reed-1{0%{transform:rotate(-18deg) scaleY(.65)}50%{transform:rotate(9deg)}100%{transform:none}}
@keyframes op-02-reed-2{0%{transform:rotate(16deg) scaleY(.7)}55%{transform:rotate(-7deg)}100%{transform:none}}
@keyframes op-02-reed-3{0%{transform:scaleY(.4)}100%{transform:none}}

/* 03 藏剑 */
.op-scene-03.op-awakened svg circle[cx="460"]{animation:op-03-halo 2.8s cubic-bezier(.16,1,.3,1) both;transform-origin:460px 360px}
.op-scene-03.op-awakened svg path[fill="url(#steel)"],.op-scene-03.op-awakened svg path[fill="#778c91"]{animation:op-03-blade 2.9s .2s cubic-bezier(.16,1,.3,1) both;transform-origin:450px 800px}
.op-scene-03.op-awakened svg path[fill="#3b5155"],.op-scene-03.op-awakened svg path[fill="#29444a"]{animation:op-03-hilt 2.7s .4s cubic-bezier(.16,1,.3,1) both;transform-origin:430px 850px}
@keyframes op-03-halo{0%{transform:scale(.2);opacity:0}60%{transform:scale(1.15);opacity:.45}100%{transform:none;opacity:.25}}
@keyframes op-03-blade{0%{transform:translateY(-550px);filter:brightness(1.9)}45%{transform:translateY(16px)}100%{transform:none;filter:none}}
@keyframes op-03-hilt{0%{transform:scaleX(0);opacity:0}100%{transform:none;opacity:1}}

/* 04 滴墨 */
.op-scene-04.op-awakened svg circle[cx="520"]{animation:op-04-drop 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:520px 480px}
.op-scene-04.op-awakened svg circle[cx="562"]{animation:op-04-drop 2.9s .12s cubic-bezier(.16,1,.3,1) both;transform-origin:562px 424px}
.op-scene-04.op-awakened svg path[fill="#202d2b"]{animation:op-04-stem 2.8s .28s cubic-bezier(.16,1,.3,1) both;transform-origin:480px 700px}
.op-scene-04.op-awakened svg circle[cx="220"],.op-scene-04.op-awakened svg circle[cx="815"]{animation:op-04-speck 2.6s .45s cubic-bezier(.34,1.56,.64,1) both}
@keyframes op-04-drop{0%{transform:translateY(-360px) scale(.5);opacity:0}40%{transform:translateY(0) scale(1.22);opacity:1}70%{transform:scale(.96)}100%{transform:none;opacity:1}}
@keyframes op-04-stem{0%{transform:scaleY(0);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-04-speck{0%{transform:scale(0);opacity:0}100%{transform:none;opacity:1}}

/* 05 早起 */
.op-scene-05.op-awakened svg circle[cx="485"]{animation:op-05-sun 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:485px 650px}
.op-scene-05.op-awakened svg path[stroke="#c9ab84"]{animation:op-05-beams 2.8s .2s cubic-bezier(.16,1,.3,1) both;transform-origin:left center}
@keyframes op-05-sun{0%{transform:translateY(240px) scale(.8)}50%{transform:translateY(-18px) scale(1.08)}100%{transform:none}}
@keyframes op-05-beams{0%{transform:scaleX(0);opacity:0}100%{transform:none;opacity:1}}

/* 06 太阳好 */
.op-scene-06.op-awakened svg circle[fill="url(#sun)"]{animation:op-06-sun 3s cubic-bezier(.16,1,.3,1) both;transform-origin:490px 455px}
.op-scene-06.op-awakened svg circle[stroke="#c68946"]{animation:op-06-ring 3s .2s cubic-bezier(.16,1,.3,1) both;transform-origin:490px 455px}
@keyframes op-06-sun{0%{transform:scale(.3);filter:brightness(1.6)}45%{transform:scale(1.22);filter:brightness(1.1)}75%{transform:scale(.96)}100%{transform:none;filter:none}}
@keyframes op-06-ring{0%{transform:scale(.4);opacity:0}55%{transform:scale(1.18);opacity:.35}100%{transform:none}}

/* 07 思过 */
.op-scene-07.op-awakened svg path[fill="#252b2a"],.op-scene-07.op-awakened svg path[fill="#182323"]{animation:op-07-monolith 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:left}
.op-scene-07.op-awakened svg path[fill="#a7a18f"],.op-scene-07.op-awakened svg path[stroke="#c9c1ad"]{animation:op-07-dunes 2.8s .2s cubic-bezier(.16,1,.3,1) both;transform-origin:bottom}
@keyframes op-07-monolith{0%{transform:translateX(-105%)}100%{transform:none}}
@keyframes op-07-dunes{0%{transform:translateY(170px);opacity:0}100%{transform:none;opacity:1}}

/* 08 赋得琉璃 */
.op-scene-08.op-awakened svg path[fill="#7c8e7b"],.op-scene-08.op-awakened svg path[fill="#405e50"]{animation:op-08-peaks 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:bottom}
.op-scene-08.op-awakened svg path[stroke="#a24b43"]{animation:op-08-river 3s .35s cubic-bezier(.16,1,.3,1) both}
@keyframes op-08-peaks{0%{transform:translateY(300px);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-08-river{0%{stroke-dasharray:2000;stroke-dashoffset:2000;opacity:0}40%{opacity:1}100%{stroke-dasharray:none;stroke-dashoffset:0;opacity:1}}

/* 09 情诗 */
.op-scene-09.op-awakened svg circle[cx="470"]{animation:op-09-left 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:470px 450px}
.op-scene-09.op-awakened svg circle[cx="650"]{animation:op-09-right 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:650px 450px}
.op-scene-09.op-awakened svg path[fill="#9d575c"]{animation:op-09-pulse 3s .5s cubic-bezier(.16,1,.3,1) both;transform-origin:560px 450px}
@keyframes op-09-left{0%{transform:translateX(-280px);opacity:0}100%{transform:none;opacity:.8}}
@keyframes op-09-right{0%{transform:translateX(280px);opacity:0}100%{transform:none;opacity:.8}}
@keyframes op-09-pulse{0%{transform:scale(.3);opacity:0}45%{transform:scale(1.28);opacity:.85}75%{transform:scale(.96)}100%{transform:none;opacity:.55}}

/* 10 观范公题名有感 */
.op-scene-10.op-awakened svg path[fill="#252e2c"]{animation:op-10-stroke 2.8s cubic-bezier(.16,1,.3,1) both;transform-origin:350px 450px}
.op-scene-10.op-awakened svg circle[cx="710"]{animation:op-10-seal 2.8s .55s cubic-bezier(.34,1.56,.64,1) both;transform-origin:710px 180px}
@keyframes op-10-stroke{0%{transform:scale(.4) rotate(-8deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-10-seal{0%{transform:scale(3.5) rotate(-35deg);opacity:0}60%{transform:scale(.92) rotate(4deg);opacity:1}100%{transform:none;opacity:1}}

/* 11 有感 */
.op-scene-11.op-awakened svg path[stroke]{animation:op-11-wave 3s cubic-bezier(.25,1,.5,1) both}
@keyframes op-11-wave{0%{transform:translateY(75px) scaleY(.7);opacity:0}50%{transform:translateY(-22px) scaleY(1.15)}100%{transform:none;opacity:1}}

/* 12 钢刀 */
.op-scene-12.op-awakened svg path[fill="url(#steel)"],.op-scene-12.op-awakened svg path[fill="#a13838"]{animation:op-12-blade 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:400px 500px}
.op-scene-12.op-awakened svg path[fill="#18272b"]{animation:op-12-hilt 2.8s .3s cubic-bezier(.16,1,.3,1) both}
@keyframes op-12-blade{0%{transform:translate(360px,-500px);opacity:0}40%{transform:translate(-10px,14px);opacity:1}100%{transform:none;opacity:1}}
@keyframes op-12-hilt{0%{transform:scale(0);opacity:0}100%{transform:none;opacity:1}}

/* 13 台风 */
.op-scene-13.op-awakened svg ellipse[cx="530"]{animation:op-13-typhoon 3s cubic-bezier(.16,1,.3,1) both;transform-origin:530px 540px}
@keyframes op-13-typhoon{0%{transform:rotate(-360deg) scale(.35);opacity:0}55%{transform:rotate(30deg) scale(1.12);opacity:1}100%{transform:none;opacity:1}}

/* 14 无题 */
.op-scene-14.op-awakened svg path[fill]{animation:op-14-peaks 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:bottom}
.op-scene-14.op-awakened svg path[stroke="#ad5f4b"]{animation:op-14-crack 2.9s .38s cubic-bezier(.16,1,.3,1) both}
@keyframes op-14-peaks{0%{transform:translateY(280px);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-14-crack{0%{stroke-dasharray:1200;stroke-dashoffset:1200;opacity:0}35%{opacity:1}100%{stroke-dasharray:none;stroke-dashoffset:0;opacity:1}}

/* 15 宿舍 */
.op-scene-15.op-awakened svg path[fill="#3c4841"],.op-scene-15.op-awakened svg path[fill="#adb6a1"]{animation:op-15-frame 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:70px 500px}
.op-scene-15.op-awakened svg path[fill="#dfceaa"]{animation:op-15-sunlight 2.9s .3s cubic-bezier(.16,1,.3,1) both;transform-origin:120px 820px}
@keyframes op-15-frame{0%{transform:scaleX(0);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-15-sunlight{0%{transform:skewX(-22deg) scaleY(.2);opacity:0}50%{opacity:1}100%{transform:none;opacity:1}}

/* 16 看天 */
.op-scene-16.op-awakened svg circle[cx="530"]{animation:op-16-moon 2.9s cubic-bezier(.16,1,.3,1) both;transform-origin:530px 270px}
.op-scene-16.op-awakened svg circle[cx="595"]{animation:op-16-shadow 2.9s .18s cubic-bezier(.16,1,.3,1) both;transform-origin:595px 215px}
.op-scene-16.op-awakened svg path[fill]{animation:op-16-ridges 2.9s .38s cubic-bezier(.16,1,.3,1) both;transform-origin:bottom}
@keyframes op-16-moon{0%{transform:translateY(-120px) scale(.8);opacity:0}100%{transform:none;opacity:1}}
@keyframes op-16-shadow{0%{transform:translate(-80px,-50px)}100%{transform:none}}
@keyframes op-16-ridges{0%{transform:translateY(210px);opacity:0}100%{transform:none;opacity:1}}

/* 墨落成诗：古典与现代文字缓缓落墨入场序列 */
.poem-world .poetry h1{opacity:0;transform:translateY(-16px)}
.poem-world .lines p{opacity:0;transform:translateY(-14px)}
.arrived .poetry h1{animation:verse-seal 1.1s .15s cubic-bezier(.16,1,.3,1) both}
.classical.arrived .lines p{animation:verse-ink 1.1s cubic-bezier(.16,1,.3,1) both;font-feature-settings:"vpal","vert";text-shadow:0 1px 1px rgba(255,255,255,.25)}
.world-16.classical.arrived .lines p{text-shadow:0 1px 3px rgba(0,0,0,.45)}
.modern.arrived .lines p{animation:verse-ink .95s cubic-bezier(.16,1,.3,1) both}

.classical .lines p:nth-child(1){animation-delay:.35s}
.classical .lines p:nth-child(2){animation-delay:.75s}
.classical .lines p:nth-child(3){animation-delay:1.15s}
.classical .lines p:nth-child(4){animation-delay:1.55s}
.classical .lines p:nth-child(5){animation-delay:1.95s}
.classical .lines p:nth-child(6){animation-delay:2.35s}
.classical .lines p:nth-child(7){animation-delay:2.75s}
.classical .lines p:nth-child(8){animation-delay:3.15s}
.classical .lines p:nth-child(9){animation-delay:3.55s}
.classical .lines p:nth-child(10){animation-delay:3.95s}

.modern .lines p:nth-child(1){animation-delay:.25s}
.modern .lines p:nth-child(2){animation-delay:.50s}
.modern .lines p:nth-child(3){animation-delay:.75s}
.modern .lines p:nth-child(4){animation-delay:1.00s}
.modern .lines p:nth-child(5){animation-delay:1.25s}
.modern .lines p:nth-child(6){animation-delay:1.50s}
.modern .lines p:nth-child(7){animation-delay:1.75s}
.modern .lines p:nth-child(8){animation-delay:2.00s}

@keyframes verse-seal{from{opacity:0;transform:translateY(-16px) scale(.95);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
@keyframes verse-ink{from{opacity:0;transform:translateY(-14px);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}@keyframes cyclone-breath{50%{transform:scale(1.035) rotate(1deg)}}@keyframes love-breath{50%{transform:scale(1.025)}}@keyframes morning-light{0%,100%{opacity:0}50%{opacity:.22}}@media(min-width:1800px){.lines{font-size:25px}.poetry h1{font-size:36px}.world-08 .lines,.world-10 .lines,.world-11 .lines,.world-14 .lines,.world-15 .lines{font-size:24px}}@media(max-width:1100px) and (min-width:701px){.poetry,.world-01 .poetry,.world-02 .poetry,.world-03 .poetry,.world-04 .poetry,.world-05 .poetry,.world-06 .poetry,.world-08 .poetry,.world-09 .poetry,.world-10 .poetry,.world-11 .poetry,.world-13 .poetry,.world-14 .poetry,.world-15 .poetry,.world-16 .poetry{margin-left:62%}.lines,.world-06 .lines,.world-08 .lines,.world-09 .lines,.world-10 .lines,.world-11 .lines,.world-14 .lines,.world-15 .lines,.world-16 .lines{font-size:18px;letter-spacing:2px}.poetry h1{font-size:25px}.world-10 h1{font-size:23px;letter-spacing:1px}.modern .poetry{margin-left:54%;width:41%}.modern .lines{font-size:17px}.cards{gap:27px 22px}.card h2{font-size:23px;right:18px;top:23px}.card:nth-child(3n+2){margin-top:50px}}@media(max-width:700px){.cover{min-height:500px}.calligraphy{width:88vw;gap:3vw}.calligraphy .jing{width:38%;max-height:240px}.calligraphy .hu{width:48%;transform:translateY(8px)}.gathered .folio,.settled .folio{clip-path:circle(40vw at 50% 47%)}.gathered .calligraphy,.settled .calligraphy{transform:translateY(-3vh) scale(.77)}.paper{background-size:850px 850px}.directory-link{top:7%;right:8%;font-size:12px;gap:14px}.replay{top:calc(7% - 8px);left:6%}.descend{bottom:8%}.contents{padding:30px 6% 65px}.contents-top{margin-bottom:25px}.cards{grid-template-columns:repeat(2,1fr);gap:22px 18px}.card{aspect-ratio:3/5}.card:nth-child(3n+2),.card:nth-child(3n){margin-top:0}.card:nth-child(even){margin-top:45px}.card h2{right:15px;top:20px;font-size:20px;letter-spacing:5px}.tone-07 h2{left:17px;right:auto}.card-image img{object-position:31% 50%}.return{top:max(23px,env(safe-area-inset-top));left:7%;font-size:11px;gap:12px;letter-spacing:2px}.return span{font-size:22px}.scene img{object-position:31% 50%;opacity:.63}.poem-world{min-height:100svh}.atmosphere{background:linear-gradient(180deg,var(--world-bg) 3%,transparent 40%,var(--world-bg) 100%)!important;opacity:.6}.poetry,.world-01 .poetry,.world-02 .poetry,.world-03 .poetry,.world-04 .poetry,.world-05 .poetry,.world-06 .poetry,.world-08 .poetry,.world-09 .poetry,.world-10 .poetry,.world-11 .poetry,.world-13 .poetry,.world-14 .poetry,.world-15 .poetry,.world-16 .poetry{margin:0 auto;padding:22svh 0 100px;width:max-content;max-width:86%;text-align:center}.poetry h1,.world-10 h1{font-size:27px;letter-spacing:5px;margin-bottom:36px}.lines,.world-03 .lines,.world-04 .lines,.world-06 .lines,.world-08 .lines,.world-09 .lines,.world-10 .lines,.world-11 .lines,.world-13 .lines,.world-14 .lines,.world-15 .lines,.world-16 .lines{font-size:19px;line-height:2.4;letter-spacing:4px}.world-03 .poetry,.world-04 .poetry,.world-08 .poetry,.world-10 .poetry,.world-11 .poetry,.world-13 .poetry,.world-14 .poetry,.world-15 .poetry{padding-top:17svh}.world-03 .lines,.world-04 .lines,.world-08 .lines,.world-10 .lines,.world-11 .lines,.world-13 .lines,.world-14 .lines,.world-15 .lines{line-height:2.15;font-size:18px;letter-spacing:3px}.world-10 .poetry h1{font-size:24px;letter-spacing:2px}.world-01 .scene img{object-position:24% 50%}.world-02 .scene img{object-position:26% 50%;opacity:.43}.world-03 .scene img{object-position:28% 50%;opacity:.36}.world-04 .scene img{object-position:28% 50%;opacity:.25}.world-05 .scene img{object-position:28% 50%;opacity:.55}.world-06 .scene img{object-position:31% 50%;opacity:.48}.world-07 .scene img{object-position:70% 50%;opacity:.55}.world-08 .scene img{object-position:42% 50%;opacity:.33}.world-09 .scene img{object-position:35% 50%;opacity:.4}.world-10 .scene img{object-position:31% 50%;opacity:.21}.world-11 .scene img{object-position:35% 50%;opacity:.35}.world-12 .scene img{object-position:31% 50%;opacity:.25}.world-13 .scene img{object-position:33% 50%;opacity:.3}.world-14 .scene img{object-position:35% 50%;opacity:.29}.world-15 .scene img{object-position:29% 50%;opacity:.2}.world-16 .scene img{object-position:30% 50%;opacity:.6}.world-16 .poetry{padding-top:35svh}.world-07 .poetry,.world-12 .poetry,.modern .poetry{width:80%;max-width:none;margin:0 auto;padding:120px 0 80px;text-align:left}.modern .lines,.world-07 .lines,.world-12 .lines{font-size:18px;letter-spacing:1px;line-height:2.35}.modern .lines p{margin-bottom:26px}.world-07 .poetry{padding-top:150px}.world-09 .poetry{padding-top:32svh}.portal h2{font-size:20px;right:15px;top:20px;letter-spacing:5px}}@media(max-width:360px){.lines,.world-08 .lines,.world-10 .lines,.world-11 .lines,.world-14 .lines,.world-15 .lines{font-size:17px;letter-spacing:2px}.card h2{font-size:18px;right:12px}.modern .lines{font-size:17px}.poetry h1{font-size:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.flying{transform:none!important}.poetry{filter:none!important}}
/* Vertical manuscripts: aligned columns, read right to left. */
.calligraphy{flex-direction:column;width:270px;gap:18px;transform:translateY(-3vh)}
.calligraphy .jing{width:150px;max-width:none;max-height:none;transform:none}
.calligraphy .hu{width:230px;max-width:none;margin-top:0;transform:none}
.poem-world.classical .poetry{display:flex;flex-direction:row-reverse;align-items:flex-start;width:max-content;max-width:90%;margin:0 8% 0 auto;padding:24svh 0 100px;gap:35px;text-align:start}
.poem-world.classical .poetry h1{writing-mode:vertical-rl;text-orientation:upright;font-size:28px;line-height:1.35;letter-spacing:8px;margin:0;transform:none;font-weight:400}
.poem-world.classical .lines{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:13px;font-size:22px;line-height:1.45;letter-spacing:6px}
.poem-world.classical .lines p{writing-mode:vertical-rl;text-orientation:upright;margin:0;white-space:nowrap;flex:none}
.classical .lines p:nth-child(4n+1){margin-top:0}.classical .lines p:nth-child(4n+2){margin-top:0}.classical .lines p:nth-child(4n+3){margin-top:0}.classical .lines p:nth-child(4n){margin-top:0}
.world-01.classical .poetry{padding-top:30svh;gap:44px}.world-03.classical .poetry{padding-top:22svh}.world-04.classical .poetry{padding-top:22svh}.world-05.classical .poetry{padding-top:28svh}.world-06.classical .poetry{padding-top:32svh}.world-09.classical .poetry{padding-top:34svh}.world-16.classical .poetry{padding-top:34svh}
.world-10.classical .poetry h1{font-size:24px;letter-spacing:6px}
.modern .lines{writing-mode:horizontal-tb}.modern .poetry h1{writing-mode:horizontal-tb}
@media(max-width:1100px) and (min-width:701px){.poem-world.classical .poetry{margin-right:6%;gap:24px}.poem-world.classical .lines{font-size:20px;gap:9px;letter-spacing:5px}.poem-world.classical .poetry h1{font-size:25px}}
@media(max-width:700px){.calligraphy{width:220px;gap:16px}.calligraphy .jing{width:125px;transform:none}.calligraphy .hu{width:190px;margin-top:0;transform:none}.poem-world.classical .poetry{margin:0 auto;max-width:90%;padding:28svh 0 90px;gap:20px}.poem-world.classical .poetry h1{font-size:25px;letter-spacing:7px;transform:none}.poem-world.classical .lines{font-size:18px;line-height:1.4;letter-spacing:5px;gap:7px}.classical .lines p:nth-child(4n+2){margin-top:0}.classical .lines p:nth-child(4n){margin-top:0}.world-10.classical .poetry h1{font-size:21px;letter-spacing:4px}.world-16.classical .poetry{padding-top:38svh}.world-09.classical .poetry{padding-top:35svh}}
@media(max-width:360px){.poem-world.classical .lines{font-size:16px;gap:6px;letter-spacing:5px}.poem-world.classical .poetry{gap:15px}.poem-world.classical .poetry h1{font-size:23px}.world-10.classical .poetry h1{font-size:20px}}
