:root{--depth:0;--gold:#d6c698}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:75px}body{margin:0;background:#07110e;color:#eee9d8;font-family:Arial,'Microsoft JhengHei',sans-serif;line-height:1.7}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--gold);outline-offset:6px}header{position:fixed;inset:0 0 auto;z-index:10;height:85px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(#06100ee8,transparent)}.brand{font-size:24px;letter-spacing:.25em;font-weight:800}nav{display:flex;gap:32px;font-size:12px;letter-spacing:.12em}nav a:hover{color:var(--gold)}#motion{font:inherit;font-size:10px;padding:7px 12px;border:1px solid #dfebd73b;background:#0c1d1655;color:#d1d9c8;cursor:pointer}.world{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:-1}.landscape{position:absolute;inset:-5%;background:url('assets/prehistoric-forest.png') center/cover;transform:scale(calc(1 + var(--depth)*.32)) translateY(calc(var(--depth)*-4%));will-change:transform}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#03110c88,transparent 75%),linear-gradient(0deg,#06110fe8,transparent 65%,#08150f40);box-shadow:inset 0 0 16vw 2vw #020b08aa}.mist{position:absolute;inset:10% -35%;background:radial-gradient(ellipse at 50% 65%,#d0dfc340,transparent 56%);filter:blur(30px);animation:drift 24s ease-in-out infinite alternate}.second{top:42%;opacity:.5;animation-duration:33s;animation-direction:alternate-reverse}.spore{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#f1d99b;box-shadow:0 0 10px #e5d6ab;animation:float var(--duration) ease-in-out infinite alternate;animation-delay:var(--delay)}.fern{position:absolute;bottom:-20vh;width:38vw;height:85vh;color:#061d12;filter:drop-shadow(0 8px 7px #010803);opacity:.9}.left{left:-12vw;transform:translate(calc(var(--depth)*-20vw),calc(var(--depth)*12vh)) rotate(20deg)}.right{right:-13vw;transform:translate(calc(var(--depth)*22vw),calc(var(--depth)*12vh)) scaleX(-1) rotate(16deg);color:#0a2417}.trail{position:fixed;z-index:8;right:25px;top:37%;display:flex;align-items:center;flex-direction:column;gap:22px;font-size:10px}.trail span{writing-mode:vertical-rl;letter-spacing:.25em;font-size:8px;opacity:.65;margin-bottom:10px}.trail a{opacity:.4;border-right:1px solid transparent;padding-right:7px}.trail a.active{opacity:1;color:var(--gold);border-color:var(--gold)}main{overflow:clip}.chapter{position:relative;min-height:110svh;padding:140px 12%;display:flex;align-items:center}.entrance{height:100svh;min-height:700px;justify-content:center;text-align:center;padding:130px 7% 100px}.hero-copy{text-shadow:0 3px 30px #000;transform:translateY(calc(var(--depth)*-160px));opacity:clamp(0,calc(1 - var(--depth)*5),1)}.eyebrow{font-size:10px!important;letter-spacing:.3em!important;color:var(--gold)!important;margin:0 0 28px}h1,h2{font-family:'Noto Serif TC','PMingLiU',serif;font-weight:400;letter-spacing:.075em;line-height:1.45;margin:0 0 28px}h1{font-size:clamp(48px,5.7vw,88px)}h2{font-size:clamp(30px,3.8vw,58px)}em{font-style:normal;color:#e2d6b1}p{font-size:15px;line-height:2.15;color:#cbd5c5;letter-spacing:.06em}.cue{display:flex;align-items:center;flex-direction:column;gap:14px;margin:36px auto 0;font-size:10px;letter-spacing:.25em}.cue span{font-size:24px;animation:cue 2.5s ease-in-out infinite}.note{position:absolute;bottom:30px;left:5%;right:5%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.18em;color:#d2d8c5aa}.story{min-height:130svh;background:linear-gradient(transparent,#06130d66 45%,#06130dbb)}.story-copy{max-width:550px;padding:45px 0}.story-copy p{max-width:440px}.field-note{font-size:9px;letter-spacing:.18em;color:var(--gold);border-left:1px solid #a1af8e60;padding:4px 0 4px 20px;margin-top:40px}.field-note span{display:block;margin-top:8px;font-size:11px;color:#c0cbbd}.fossil{gap:8%;background:linear-gradient(#06130dbb,#07110ff2);min-height:125svh}.fossil-art{width:44%;text-align:center}.specimen{border-radius:50%;overflow:hidden;border:1px solid #bdc4a92e;box-shadow:0 0 100px #a7ba7912;background:#b8ba9e}.specimen img{display:block;width:100%;height:auto;mix-blend-mode:multiply;transform:rotate(calc(var(--depth)*-12deg));filter:sepia(.25)}.specimen-label{margin-top:28px;font-size:9px;letter-spacing:.22em;color:#a9b69d}.fossil-copy{width:48%;max-width:530px}.fossil-copy p{font-size:14px}dl{margin-top:30px}dl div{display:flex;gap:36px;padding:15px 0;border-top:1px solid #d3d9bd26;font-size:12px}dt{color:var(--gold);min-width:40px}dd{margin:0;color:#c0cbbd}.next{background:linear-gradient(#07110ff2,#07110fcc,#07110f);justify-content:center;text-align:center;min-height:100svh}.next h2{font-size:clamp(36px,4.4vw,68px)}.coming{margin:35px auto;max-width:480px;padding:23px;border-block:1px solid #ddd6b52b;font-size:13px;color:var(--gold)}.coming small{display:block;font-size:10px;color:#a1b09b;margin-top:8px}.button{display:inline-block;border:1px solid #bcb88b70;padding:14px 23px;font-size:12px;color:#ede4c8}.button:hover{background:#d1d0a41a}.back{display:block;width:max-content;margin:25px auto 0;color:#9ea993;font-size:10px}footer{display:flex;justify-content:space-between;gap:25px;padding:35px 5%;font-size:10px;color:#9da88f;background:#07110f;border-top:1px solid #bbcaab22}footer .brand{font-size:15px;color:#eee9d8}.js .reveal{opacity:0;transform:translateY(45px);transition:opacity 1.2s ease,transform 1.2s ease}.js .reveal.visible{opacity:1;transform:translateY(0)}@keyframes drift{from{transform:translate(-8%,4%)}to{transform:translate(8%,-3%)}}@keyframes float{from{transform:translate(0,20px);opacity:.1}to{transform:translate(35px,-75px);opacity:.55}}@keyframes cue{50%{transform:translateY(8px)}}.reduced .mist,.reduced .spore,.reduced .cue span{animation:none}.reduced .landscape,.reduced .fern,.reduced .hero-copy,.reduced .specimen img{transform:none}.reduced .hero-copy{opacity:1}.reduced .reveal{transition:none!important;opacity:1!important;transform:none!important}.reduced{scroll-behavior:auto}.reduced .right{transform:scaleX(-1)}
@media(max-width:760px){header{height:72px;padding:0 6%;gap:12px}.brand{font-size:19px}nav{gap:14px;font-size:10px}nav a:last-child{display:none}#motion{font-size:9px;padding:5px 7px}.trail{right:10px;gap:20px}.trail span{display:none}.chapter{padding:110px 9%;min-height:100svh}.entrance{min-height:650px;height:100svh;padding-inline:7%}h1{font-size:48px;letter-spacing:.04em}.eyebrow{font-size:8px!important;letter-spacing:.2em!important}h2{font-size:34px}p{font-size:13px}.story{min-height:115svh}.story-copy{max-width:90%}.fossil{flex-direction:column;gap:55px;padding-block:95px}.fossil-art{width:65%;max-width:320px}.fossil-copy{width:100%;max-width:none}.specimen-label{font-size:8px;margin-top:18px}.next h2{font-size:36px}.fern{width:65vw;height:67vh;bottom:-15vh}.left{left:-25vw}.right{right:-30vw}.note{font-size:7px}.coming small{font-size:9px}footer{flex-wrap:wrap;font-size:9px;padding:30px 8%}.landscape{background-position:54% center}.mist{filter:blur(15px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.mist,.spore,.cue span{animation:none}.landscape,.fern,.hero-copy,.specimen img{transform:none!important}.hero-copy{opacity:1!important}.reveal{transition:none!important;opacity:1!important;transform:none!important}.right{transform:scaleX(-1)!important}}
@media(max-width:420px){header{padding-inline:6%;gap:10px}header nav{display:none}header .brand{font-size:18px;white-space:nowrap}h1{font-size:clamp(32px,10vw,42px)}h2{font-size:29px}.next h2{font-size:31px}.entrance{padding-inline:9%}.trail{right:7px;font-size:8px}.fern{opacity:.65}}
/* Photographic foreground foliage; preserve scroll-driven separation. */
.fern{width:40vw;height:auto;bottom:-10vh;opacity:.96;filter:brightness(.46) saturate(.65) drop-shadow(0 8px 9px #01080399);object-fit:contain;mask-image:linear-gradient(to bottom,#000 85%,transparent);will-change:transform}.fern.left{left:-7vw;transform:translate(calc(var(--depth)*-24vw),calc(var(--depth)*12vh)) rotate(-4deg)}.fern.right{right:-9vw;bottom:-13vh;width:43vw;transform:translate(calc(var(--depth)*24vw),calc(var(--depth)*12vh)) scaleX(-1) rotate(-8deg);filter:brightness(.38) saturate(.6) drop-shadow(0 8px 9px #01080399)}
@media(max-width:760px){.fern{width:57vw;bottom:-4vh;opacity:.9}.fern.left{left:-19vw}.fern.right{right:-22vw;width:62vw;bottom:-6vh}}
.reduced .fern.left{transform:rotate(-4deg)}.reduced .fern.right{transform:scaleX(-1) rotate(-8deg)}

/* First sighting */
.discovery{isolation:isolate;overflow:hidden;min-height:115svh;text-align:left;justify-content:flex-start;padding:145px 8% 125px;background:#07110f}.discovery-scene{position:absolute;inset:0;z-index:-2}.discovery-scene img{width:100%;height:100%;object-fit:cover;object-position:62% center;filter:brightness(.73) saturate(.68)}.discovery:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#06100ee8,#06100e90 30%,transparent 63%),linear-gradient(#07110f,transparent 20%,transparent 75%,#07110f)}.js .discovery-scene.reveal{transform:scale(1.06);opacity:0;transition:opacity 2.4s ease,transform 4s ease}.js .discovery-scene.visible{opacity:1;transform:scale(1)}.discovery-copy{width:44%;max-width:540px;text-shadow:0 2px 20px #0009}.discovery h2{font-size:clamp(36px,4.1vw,64px)}.sighting{font-size:10px;letter-spacing:.2em;color:#b7c3a9;margin-bottom:25px}.sighting span{display:block;font-size:11px;letter-spacing:.32em;margin-top:5px;color:var(--gold)}.discovery .coming{margin:28px 0;padding:18px 0;border-color:#ddd6b540}.discovery .back{margin-left:0}.discovery-caption{position:absolute;bottom:25px;left:8%;right:8%;display:flex;justify-content:space-between;font-size:8px;letter-spacing:.2em;color:#bac4af}.discovery-caption span{font-size:9px;letter-spacing:.1em}
@media(max-width:760px){.discovery{padding:62svh 9% 110px;min-height:115svh}.discovery-scene{height:72svh}.discovery-scene img{object-position:65% center}.discovery:after{background:linear-gradient(#07110f,transparent 12%,transparent 37%,#07110f 63%)}.discovery-copy{width:100%;max-width:500px}.discovery h2{font-size:36px}.discovery .eyebrow{margin-bottom:15px}.sighting{margin-bottom:18px}.discovery-caption{flex-direction:column;gap:4px}.discovery-copy>p:not(.eyebrow):not(.sighting){font-size:12px}}
@media(prefers-reduced-motion:reduce){.js .discovery-scene.reveal{transition:none;transform:none;opacity:1}}

/* One continuous forest; an independent silhouette approaches with scroll. */
:root{--approach:0;--sighting:0}
.story{background:linear-gradient(transparent,#06130d66 50%,transparent)}.fossil{background:transparent}.fossil-copy,.story-copy{text-shadow:0 2px 18px #000}.fossil-copy{background:radial-gradient(ellipse,#06130d99,transparent 75%)}
.discovery{display:block;isolation:auto;overflow:visible;height:230svh;min-height:0;padding:0;background:transparent}.discovery:after{display:none}.discovery-stage{position:sticky;top:0;height:100svh;min-height:690px;padding:100px 8% 60px;display:flex;align-items:center;background:linear-gradient(90deg,#06100e9c,transparent 60%)}.discovery-copy{position:relative;width:43%;max-width:540px}.discovery-caption{bottom:20px}.discovery .coming{background:#06100e44}.dinosaur{position:absolute;right:0;bottom:12%;width:70vw;transform-origin:70% 85%;transform:translateY(calc(var(--approach)*8vh)) scale(calc(.22 + var(--approach)*.78));opacity:var(--sighting);filter:brightness(calc(.42 + var(--approach)*.2)) saturate(.5) blur(calc((1 - var(--approach))*3px));will-change:transform,opacity;mask-image:linear-gradient(#000 65%,transparent 98%)}.dinosaur img{display:block;width:100%;height:auto}.world .mist{z-index:1}.world .fern{z-index:2}.discovery h2{font-size:clamp(34px,3.8vw,60px)}
.reduced .dinosaur{transform:scale(.85);filter:brightness(.5) saturate(.5)}.reduced .discovery{height:auto;min-height:100svh}
@media(max-width:760px){.discovery{height:220svh;padding:0;min-height:0}.discovery-stage{height:100svh;min-height:700px;padding:35svh 9% 50px;align-items:center;background:linear-gradient(0deg,#06100ed9,transparent 85%)}.discovery-copy{width:100%;max-width:500px}.discovery h2{font-size:32px;line-height:1.3;margin-bottom:16px}.discovery .eyebrow{margin-bottom:8px}.sighting{margin:8px 0 12px}.sighting span{display:inline;margin-left:12px}.discovery .coming{margin:18px 0;padding:10px 0}.discovery .back{margin-top:15px}.dinosaur{width:100vw;right:-8vw;bottom:48%;transform-origin:65% 90%}.discovery-caption{display:none}}
@media(prefers-reduced-motion:reduce){.dinosaur{transform:scale(.85);filter:brightness(.5) saturate(.5)}.discovery{height:auto;min-height:100svh}}
.discovery-stage{background:transparent}.discovery-copy{filter:drop-shadow(0 2px 12px #020b08)}.discovery .coming{background:transparent}

.language-switch{font-size:11px;white-space:nowrap;color:var(--gold);padding:7px;border:1px solid #dfebd73b;margin-left:auto}header nav{margin-left:auto}html[lang=en] h1{font-size:clamp(40px,5.2vw,78px);letter-spacing:.025em}html[lang=en] h2{letter-spacing:.02em}html[lang=en] .discovery h2{font-size:clamp(32px,3.5vw,54px)}@media(max-width:760px){header nav{display:none}.language-switch{margin-left:auto}html[lang=en] h1{font-size:40px}html[lang=en] h2{font-size:30px}html[lang=en] .discovery h2{font-size:30px}}
