:root {
  --paper: #efefec;
  --paper-warm: #ecece6;
  --ink: #1c211e;
  --muted: #777d78;
  --line: rgba(36, 43, 39, .2);
  --green: #6d8b59;
  --red: #9a554e;
  --mx: 0;
  --my: 0;
}

* { box-sizing: border-box; }
html { background: var(--paper); }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
  overflow-x: hidden;
  cursor: none;
}
button, a { font: inherit; color: inherit; cursor: none; }
button { border: 0; }

.loader {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-content: center; justify-items: center;
  background: #f1f1ee;
}
.loader__orbit { width: 76px; height: 76px; border: 1px solid rgba(28,33,30,.24); border-radius: 50%; display: grid; place-items: center; position: relative; }
.loader__orbit i { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--ink); top: -3px; left: 50%; transform-origin: 0 41px; animation: orbit 1.7s linear infinite; }
.loader__orbit span { font-size: 10px; font-variant-numeric: tabular-nums; letter-spacing: .08em; }
.loader p { margin: 18px 0 0; font-size: 9px; letter-spacing: .2em; color: var(--muted); }

.cursor { position: fixed; z-index: 900; left: 0; top: 0; width: 44px; height: 44px; transform: translate(-50%,-50%); pointer-events: none; display: grid; place-items: center; mix-blend-mode: multiply; }
.cursor::before { content:""; position:absolute; inset:5px; border:1px solid rgba(28,33,30,.42); border-radius:50%; transition:transform .3s ease, background .3s ease; }
.cursor i { width:3px; height:3px; border-radius:50%; background:var(--ink); }
.cursor span { position:absolute; top:47px; font:7px/1 Arial,sans-serif; letter-spacing:.13em; opacity:0; transition:.25s ease; white-space:nowrap; }
.cursor.is-active::before { transform:scale(1.48); background:rgba(255,255,255,.5); }
.cursor.is-active span { opacity:1; }

.landscape { position: relative; width: 100%; height: 100vh; min-height: 620px; overflow: hidden; background: #f0f0ed; }
.site-header { position:absolute; z-index:80; top:0; left:0; right:0; height:72px; display:flex; align-items:center; padding:0 clamp(28px,3.2vw,60px); border-bottom:1px solid rgba(33,40,36,.08); }
.wordmark { display:flex; align-items:baseline; gap:16px; text-decoration:none; min-width:30%; }
.wordmark b { font-family:Georgia,"Times New Roman",serif; font-size:17px; font-weight:400; letter-spacing:-.04em; }
.wordmark span { font-size:7px; letter-spacing:.16em; color:var(--muted); text-transform:uppercase; }
.site-header nav { display:flex; gap:23px; }
.nav-link,.soundless { padding:4px 0; background:none; font-size:8px; letter-spacing:.08em; color:#555b56; position:relative; }
.nav-link::after { content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--ink); transition:right .3s; }.nav-link:hover::after{right:0}
.soundless { margin-left:auto; display:flex; gap:18px; align-items:center; }.soundless i{font-style:normal;padding:6px 9px;background:var(--ink);color:#fff;font-size:7px}

.scene-viewport { position:absolute; inset:72px 0 0; overflow:hidden; transform-origin:center; transition:transform .75s cubic-bezier(.22,.8,.25,1); perspective:1400px; background:linear-gradient(180deg,#f1f1ee 0%,#ecece8 68%,#efefec 100%); }
.landscape.is-open .scene-viewport { transform:scale(1.035); }
.sky-wash { position:absolute; z-index:1; pointer-events:none; border-radius:50%; filter:blur(60px); opacity:.55; }
.wash-a { width:52vw;height:42vh;left:13vw;top:18vh;background:rgba(205,212,205,.55); }
.wash-b { width:45vw;height:38vh;right:-8vw;bottom:9vh;background:rgba(207,206,210,.56); }
.world { position:absolute; z-index:4; left:0; top:0; width:590vw; height:100%; transform-style:preserve-3d; will-change:transform; }
.world::before { content:""; position:absolute; left:0; right:0; bottom:14.5vh; height:1px; background:linear-gradient(90deg,transparent,rgba(100,109,102,.15) 9%,rgba(100,109,102,.11) 85%,transparent); }

.ink-begin { position:absolute; left:54vw; bottom:13vh; width:36vw; height:19vh; opacity:.34; filter:blur(1px); }
.ink-begin i { position:absolute; bottom:0; width:var(--w); height:var(--h); left:var(--x); border-radius:50%; background:rgba(104,126,101,.35); filter:blur(var(--b)); transform:rotate(var(--r)); }
.ink-begin i:nth-child(1){--x:0;--w:26%;--h:20%;--b:5px;--r:8deg}.ink-begin i:nth-child(2){--x:18%;--w:18%;--h:45%;--b:7px;--r:-8deg}.ink-begin i:nth-child(3){--x:38%;--w:22%;--h:15%;--b:4px;--r:2deg}.ink-begin i:nth-child(4){--x:58%;--w:19%;--h:32%;--b:8px;--r:-4deg}.ink-begin i:nth-child(5){--x:78%;--w:22%;--h:13%;--b:5px;--r:4deg}

.copy-block { position:absolute; z-index:20; top:30%; width:22vw; max-width:330px; min-width:250px; }
.copy-block .copy-index { display:block; margin-bottom:23px; font-size:7px; letter-spacing:.18em; color:#8c928d; }
.copy-block h1,.copy-block h2 { margin:0; font-family:Georgia,"Noto Serif SC","Songti SC",serif; font-weight:400; font-size:clamp(24px,2.35vw,43px); line-height:1.28; letter-spacing:-.035em; }
.copy-block p { margin:24px 0 0; font-size:10px; line-height:1.9; letter-spacing:.08em; color:#676d68; }
.copy-block small { display:block; margin-top:42px; font-size:7px; letter-spacing:.16em; }
.copy-block small::after { content:""; display:inline-block; width:36px; height:1px; margin-left:12px; vertical-align:middle; background:var(--ink); }
.copy-one{left:6vw}.copy-two{left:129vw}.copy-three{left:251vw}.copy-four{left:374vw}.copy-five{left:501vw;top:28%}

.scene-object { position:absolute; z-index:10; display:block; padding:0; background:none; transform-style:preserve-3d; transform-origin:center bottom; will-change:transform,opacity; }
.scene-object img { display:block; width:100%; height:auto; position:relative; z-index:2; pointer-events:none; filter:drop-shadow(0 18px 12px rgba(41,49,43,.1)); transform:translate(calc(var(--mx) * 8px),calc(var(--my) * 5px)); transition:filter .4s ease; }
.scene-object:hover img { filter:drop-shadow(0 21px 13px rgba(41,49,43,.16)) saturate(1.06); }
.paper-ground { position:absolute; z-index:1; left:6%; right:2%; bottom:1%; height:12%; border-radius:50%; background:rgba(255,255,255,.9); box-shadow:0 13px 22px rgba(65,73,68,.12); transform:rotateX(72deg) translateZ(-12px); }
.object-note { position:absolute; z-index:5; left:52%; top:52%; padding:9px 12px; background:rgba(244,244,240,.91); border:1px solid rgba(36,43,39,.14); white-space:nowrap; font-size:7px; letter-spacing:.12em; opacity:0; transform:translate(10px,8px); transition:.35s ease; pointer-events:none; }
.scene-object:hover .object-note,.scene-object.is-inspected .object-note { opacity:1; transform:translate(0,0); }
.tree-object { left:69vw; bottom:11.5vh; width:min(68vh,47vw); }
.animal-object { left:164vw; bottom:13.8vh; width:62vw; }
.estate-object { left:277vw; bottom:11.8vh; width:75vw; }
.hills-back { left:340vw; bottom:10vh; width:118vw; opacity:.22; filter:grayscale(.16) blur(.3px); z-index:5; transform:scale(.82); transform-origin:center bottom; pointer-events:none; }
.hills-object { left:372vw; bottom:8vh; width:155vw; z-index:9; }
.hills-object .paper-ground { height:8%; }

.paper-slice { position:absolute; z-index:7; bottom:12vh; height:8vh; background:rgba(250,250,247,.94); filter:drop-shadow(0 8px 7px rgba(45,51,47,.08)); clip-path:polygon(0 48%,12% 30%,29% 39%,42% 6%,61% 32%,76% 17%,100% 42%,95% 87%,69% 74%,48% 100%,28% 69%,7% 83%); transform:rotateX(58deg); transform-origin:center bottom; }
.slice-one{left:199vw;width:72vw}.slice-two{left:314vw;width:92vw;height:10vh}

.again { margin-top:35px; padding:0 0 7px; background:none; border-bottom:1px solid rgba(28,33,30,.35); font-size:8px; letter-spacing:.14em; }.again i{font-style:normal;margin-left:14px}
.scene-vignette { position:absolute; z-index:50; inset:72px 0 0; pointer-events:none; background:linear-gradient(90deg,rgba(240,240,237,.93) 0,transparent 7%,transparent 91%,rgba(240,240,237,.95) 100%),linear-gradient(180deg,rgba(240,240,237,.3),transparent 22%,transparent 75%,rgba(240,240,237,.7)); }

.scroll-guide { position:absolute; z-index:75; left:clamp(28px,3.2vw,60px); bottom:31px; display:flex; align-items:center; gap:13px; font-size:7px; letter-spacing:.13em; }
.scroll-guide i { width:82px; height:1px; background:rgba(28,33,30,.18); overflow:hidden; }.scroll-guide i b{display:block;width:100%;height:100%;background:var(--ink);transform:translateX(-100%)}
.scroll-guide em { width:20px; font-style:normal; font-variant-numeric:tabular-nums; }
.open-landscape { position:absolute; z-index:75; right:clamp(33px,5vw,90px); top:50%; display:flex; align-items:center; gap:9px; padding:8px; background:none; font-size:7px; letter-spacing:.12em; }.open-landscape i{font-style:normal;font-size:13px;transition:transform .5s}.landscape.is-open .open-landscape i{transform:rotate(135deg)}
.chapter-status { position:absolute; z-index:75; right:clamp(28px,3.2vw,60px); bottom:31px; display:flex;align-items:center;gap:10px;font-size:7px;letter-spacing:.13em}.chapter-status i{width:28px;height:1px;background:rgba(28,33,30,.28)}.chapter-status b{font-weight:400}

.discovery { position:fixed; z-index:700; left:50%; bottom:7vh; width:min(420px,82vw); padding:19px 55px 19px 24px; border:1px solid rgba(28,33,30,.15); background:rgba(244,244,240,.92); backdrop-filter:blur(12px); box-shadow:0 17px 45px rgba(45,52,47,.12); font-family:Georgia,"Songti SC",serif; font-size:11px; line-height:1.7; letter-spacing:.07em; opacity:0; transform:translate(-50%,20px); pointer-events:none; }.discovery.is-open{pointer-events:auto}.discovery button{position:absolute;right:16px;top:11px;background:none;font-size:20px;font-weight:300}

@keyframes orbit { to { transform:rotate(360deg); } }

@media (max-width: 780px) {
  body,button,a{cursor:auto}.cursor{display:none}.landscape{min-height:560px}.site-header{padding:0 18px;height:62px}.wordmark{min-width:auto}.wordmark span,.soundless span{display:none}.site-header nav{margin-left:auto;gap:14px}.soundless{margin-left:14px}.scene-viewport{inset:62px 0 0}.world{width:700vw}.copy-block{width:58vw;min-width:210px;top:25%}.copy-block h1,.copy-block h2{font-size:clamp(22px,7vw,35px)}.copy-block p{font-size:9px}.copy-one{left:8vw}.copy-two{left:158vw}.copy-three{left:308vw}.copy-four{left:458vw}.copy-five{left:608vw}.tree-object{left:78vw;width:88vw}.animal-object{left:197vw;width:94vw}.estate-object{left:316vw;width:118vw}.paper-slice.slice-one{left:245vw}.paper-slice.slice-two{left:395vw}.hills-back{left:430vw;width:140vw}.hills-object{left:478vw;width:205vw}.scroll-guide{left:18px;bottom:19px}.scroll-guide span{display:none}.chapter-status{right:18px;bottom:19px}.open-landscape{right:12px;top:44%}.scene-vignette{top:62px}
}

@media (prefers-reduced-motion: reduce){
  .loader__orbit i{animation:none}.cursor{display:none}body,button,a{cursor:auto}.scene-viewport{transition:none}
}