@import 'tailwindcss';

:root {
  --ink: #0d1813;
  --moss: #17231f;
  --deep: #0c1511;
  --sage: #9eb09e;
  --fog: #edf0e9;
  --coral: #de7966;
  --line: rgba(233, 240, 231, .25);
  --dark-line: rgba(17, 35, 26, .2);
  --mx: 50vw;
  --my: 50vh;
  --px: 0;
  --py: 0;
  --scroll: 0;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--deep); }
body { margin: 0; overflow-x: hidden; background: var(--moss); color: var(--fog); font-family: Arial, Helvetica, sans-serif; }
button, a, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
::selection { color: var(--ink); background: #dce6d7; }

.site-shell { min-height: 100vh; overflow: hidden; background: var(--moss); }
.noise { position:fixed; inset:0; z-index:80; pointer-events:none; opacity:.24; background-image:radial-gradient(rgba(255,255,255,.22) .55px,transparent .7px),radial-gradient(rgba(0,0,0,.32) .6px,transparent .8px); background-size:5px 5px,7px 7px; background-position:0 0,3px 2px; mix-blend-mode:soft-light; }
.cursor-glow { position:fixed; z-index:79; left:var(--mx); top:var(--my); width:260px; height:260px; border-radius:50%; transform:translate(-50%,-50%); pointer-events:none; background:radial-gradient(circle,rgba(225,243,218,.1),transparent 67%); mix-blend-mode:screen; }
.scroll-progress { position:fixed; left:0; right:0; top:0; height:3px; z-index:101; background:#ffffff18; }
.scroll-progress i { display:block; height:100%; width:calc(var(--scroll) * 100%); background:#e8f1e5; box-shadow:0 0 12px #daf4d2; }

.loader { position:fixed; z-index:200; inset:0; display:grid; place-content:center; justify-items:center; gap:20px; background:#101b16; transition:opacity .6s .15s,visibility .6s .15s; }
.loader-done { opacity:0; visibility:hidden; }
.loader-mark { width:112px; height:112px; display:grid; place-items:center; border-radius:36px 36px 36px 17px; color:#18231d; font-size:72px; font-weight:900; background:linear-gradient(145deg,#fff,#7f9787); border:2px solid #eef7ef; box-shadow:inset -9px -12px 22px #53675d,inset 10px 10px 20px #fff,0 0 80px #cfedcc66; animation:loaderMorph .8s ease-in-out infinite alternate; }
.loader p { margin:0; font:9px monospace; letter-spacing:.23em; color:#bdc9bb; }
.loader-line { width:200px; height:1px; overflow:hidden; background:#ffffff1c; }
.loader-line i { display:block; width:65%; height:100%; background:#e6eee3; animation:loadLine 1s ease-in-out both; }
.liquid-wipe { position:fixed; z-index:150; inset:-20%; pointer-events:none; transform:translateX(-125%) skewX(-12deg); background:radial-gradient(circle at 80% 50%,#dce7d9,#7c9080 38%,#14211a 70%); transition:transform .8s cubic-bezier(.76,0,.24,1); }
.liquid-wipe.wipe-on { transform:translateX(125%) skewX(-12deg); }

.topbar { position:fixed; inset:0 0 auto; height:78px; z-index:100; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding:0 clamp(22px,4vw,64px); border-bottom:1px solid var(--line); background:linear-gradient(rgba(15,27,21,.83),rgba(15,27,21,.2)); backdrop-filter:blur(18px); }
.brand { appearance:none; padding:0; border:0; background:none; cursor:pointer; display:flex; align-items:center; gap:12px; font-size:11px; font-weight:900; letter-spacing:.14em; }
.brand-glyph { width:31px; height:31px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.55); border-radius:11px 11px 11px 5px; background:linear-gradient(145deg,rgba(255,255,255,.62),rgba(141,163,149,.22)); color:#f5f9f3; box-shadow:inset 0 0 14px #fff6,0 0 16px #dfffd322; font-size:19px; letter-spacing:-.08em; }
.topbar nav { display:flex; gap:4px; padding:4px; border:1px solid rgba(255,255,255,.13); border-radius:99px; background:rgba(7,14,10,.22); }
.topbar nav button { border:0; cursor:pointer; background:transparent; color:#bac8b8; border-radius:99px; padding:9px 15px; font:9px monospace; letter-spacing:.14em; transition:.25s; }
.topbar nav button:hover { background:#edf1e91c; color:white; }
.nav-actions { justify-self:end; display:flex; gap:8px; }
.pill { border:1px solid rgba(255,255,255,.42); border-radius:100px; padding:12px 17px; color:var(--fog); text-decoration:none; background:rgba(22,35,29,.43); cursor:pointer; font-size:9px; font-weight:900; letter-spacing:.1em; transition:transform .3s ease,box-shadow .3s ease,background .3s ease; }
.pill:hover { transform:translateY(-3px); box-shadow:0 10px 30px #0005; background:rgba(239,242,234,.14); }
.pill-light { background:#e7ede4; color:#16241d; border-color:#e7ede4; }
.pill-light:hover { color:#eaf0e7; background:var(--coral); border-color:var(--coral); }
.mini-buy { padding-inline:16px; }

.room-index { position:fixed; z-index:95; left:19px; top:50%; display:flex; flex-direction:column; gap:7px; transform:translateY(-50%); }
.room-index button { width:34px; height:32px; padding:0; cursor:pointer; border:0; background:none; display:flex; align-items:center; gap:8px; font:8px monospace; color:#e2e9de88; }
.room-index button i { width:5px; height:5px; border:1px solid currentColor; border-radius:50%; transition:.25s; }
.room-index button span { opacity:0; transform:translateX(-4px); transition:.25s; }
.room-index button:hover span,.room-index button:focus-visible span { opacity:1; transform:none; }
.room-index button:hover i { background:#ecf2e9; box-shadow:0 0 12px #dfffd9; }

.hero { position:relative; isolation:isolate; min-height:760px; height:100svh; padding:112px clamp(22px,4vw,64px) 35px; display:grid; grid-template-columns:minmax(0,1fr) 260px; grid-template-rows:auto 1fr auto; overflow:hidden; }
.hero-art { position:absolute; z-index:-3; inset:-4%; background:url('/unstable-room.png') center/cover no-repeat; transform:translate3d(calc(var(--px) * -13px),calc(var(--py) * -9px),0) scale(1.06); transition:filter .8s ease; }
.hero-art::after { content:""; position:absolute; inset:0; background:radial-gradient(circle 250px at var(--mx) var(--my),transparent 0,rgba(4,10,7,.2) 90%,rgba(4,10,7,.32) 100%); }
.hero-fade { position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,rgba(8,16,12,.8) 0%,rgba(8,16,12,.36) 34%,rgba(8,16,12,.07) 62%,rgba(8,16,12,.65) 100%),linear-gradient(0deg,rgba(10,18,14,.67),transparent 32%); }
.mode-1 .hero-art,.mode-1 .closet-art { filter:saturate(.55) hue-rotate(17deg) blur(.3px); }
.mode-2 .hero-art,.mode-2 .closet-art { filter:brightness(1.22) contrast(.9) saturate(.72); }
.mode-3 .hero-art,.mode-3 .closet-art { filter:hue-rotate(-32deg) contrast(1.12) saturate(.9); }
.is-held .hero-art { animation:heldWorld .32s ease-in-out infinite alternate; }
.eyebrow { grid-column:1/-1; display:flex; justify-content:space-between; font:9px monospace; letter-spacing:.18em; color:#bfccbe; }
.hero-copy { align-self:center; width:min(720px,76vw); }
.kicker { margin:0 0 24px; max-width:360px; text-transform:uppercase; font:10px/1.5 monospace; letter-spacing:.16em; color:#c8d6c5; }
h1,h2,h3,p { text-wrap:balance; }
.hero h1 { margin:0; display:flex; flex-direction:column; font-size:clamp(72px,10.6vw,170px); line-height:.75; letter-spacing:-.085em; font-weight:900; text-shadow:0 8px 42px #0007; }
.hero h1 span:last-child { width:max-content; margin-left:clamp(28px,7vw,120px); color:transparent; -webkit-text-stroke:1.5px #e9efe8; filter:drop-shadow(0 0 14px #cfe1ce77); }
.lede { width:min(460px,71vw); margin:34px 0 26px; color:#dae2d7; font-size:clamp(15px,1.25vw,19px); line-height:1.55; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; }
.hero-actions .pill { padding:16px 22px; }
.hero-hold { min-width:230px; display:flex; justify-content:space-between; gap:22px; user-select:none; }
.hero-hold b { font-family:monospace; }
.charge-card { align-self:end; margin-bottom:58px; border:1px solid var(--line); border-radius:22px; padding:20px; background:rgba(17,31,24,.42); backdrop-filter:blur(18px); box-shadow:inset 0 0 38px rgba(218,241,217,.05); }
.charge-card>div { display:flex; justify-content:space-between; align-items:baseline; font:9px monospace; letter-spacing:.15em; }
.charge-card strong { font-size:26px; color:white; letter-spacing:-.05em; }
.charge-card input { width:100%; accent-color:#eef6ea; margin:22px 0 12px; }
.charge-card p { min-height:31px; margin:0; font:9px/1.55 monospace; color:#afbead; }
.scroll-cue { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; font:8px monospace; letter-spacing:.18em; color:#aebcab; }
.scroll-cue i { width:88px; height:1px; background:#dce6da; position:relative; animation:scan 2s infinite; }

.ticker { position:relative; z-index:4; overflow:hidden; padding:15px 0; border-block:1px solid #cbd5c8; background:#e8ede5; color:#16221c; transform:rotate(-1.2deg) scale(1.02); }
.ticker div { width:max-content; white-space:nowrap; font:10px monospace; letter-spacing:.18em; animation:ticker 24s linear infinite; }
.ticker b { color:#b75443; }

.origin-section { position:relative; z-index:3; min-height:100vh; padding:120px clamp(22px,7vw,110px) 145px; color:#142119; background:#e8ece4; background-image:linear-gradient(#17261b14 1px,transparent 1px),linear-gradient(90deg,#17261b14 1px,transparent 1px); background-size:46px 46px; }
.section-label { display:flex; align-items:center; gap:14px; margin-bottom:88px; font:9px monospace; letter-spacing:.2em; color:#536258; }
.section-label span { width:30px; height:30px; display:grid; place-items:center; border:1px solid currentColor; border-radius:50%; }
.section-label-dark { color:#adbbae; }
.origin-intro { display:grid; grid-template-columns:1fr 260px; align-items:end; gap:60px; margin-bottom:70px; }
.origin-intro h2,.route-title h2 { margin:0; font-size:clamp(54px,7.2vw,118px); line-height:.82; letter-spacing:-.07em; }
.origin-intro h2 em,.route-title h2 em { font-family:Georgia,serif; font-weight:400; color:#66796b; }
.origin-intro p,.route-title>p { margin:0; padding-left:24px; border-left:1px solid #304337; font:11px/1.7 monospace; color:#5c6b61; }
.memory-machine { overflow:hidden; border:1px solid #1c312477; border-radius:30px; background:#dce3da; box-shadow:0 28px 90px #23372a1c; outline:none; }
.memory-machine:focus-visible { box-shadow:0 0 0 3px #647a6b,0 28px 90px #23372a1c; }
.memory-tabs { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid #23362a44; }
.memory-tabs button { position:relative; padding:18px 20px; cursor:pointer; border:0; border-right:1px solid #23362a44; background:transparent; color:#647267; text-align:left; font:9px monospace; letter-spacing:.12em; transition:.3s; }
.memory-tabs button:last-child { border-right:0; }
.memory-tabs button span { margin-right:13px; opacity:.55; }
.memory-tabs button::after { content:""; position:absolute; inset:auto 10px 7px; height:2px; transform:scaleX(0); background:#263c2f; transition:.3s; }
.memory-tabs button.active { color:#17261d; background:#f3f5f052; }
.memory-tabs button.active::after { transform:scaleX(1); }
.memory-stage { display:grid; grid-template-columns:minmax(320px,.9fr) 1.1fr; min-height:590px; }
.portrait-wrap { position:relative; min-height:500px; overflow:hidden; background:#26362d; }
.portrait-wrap img { width:100%; height:100%; object-fit:cover; transform:scale(1.03); filter:saturate(.74) contrast(.97); transition:transform 1s ease; }
.memory-machine:hover .portrait-wrap img { transform:scale(1.075) rotate(-.45deg); }
.portrait-wrap::after { content:""; position:absolute; inset:0; border:1px solid #eff7ec28; box-shadow:inset 0 0 90px #07100a66; }
.scan-line { position:absolute; z-index:2; left:0; right:0; height:1px; top:10%; background:#efffe988; box-shadow:0 0 15px #eaffdd; animation:verticalScan 5s linear infinite; }
.portrait-tag { position:absolute; z-index:3; left:18px; bottom:18px; padding:9px 12px; border:1px solid #fff5; border-radius:99px; color:#e6eee3; background:#14201988; backdrop-filter:blur(10px); font:8px monospace; letter-spacing:.13em; }
.memory-copy { padding:clamp(36px,6vw,90px); animation:memoryIn .55s both; }
.memory-copy>span { font:9px monospace; letter-spacing:.18em; color:#6b796e; }
.memory-copy h3 { margin:25px 0; max-width:650px; font-size:clamp(30px,3.4vw,56px); line-height:.95; letter-spacing:-.045em; color:#17261d; }
.memory-copy>p { max-width:590px; color:#4a5b50; font-size:15px; line-height:1.75; }
.memory-copy blockquote { margin:38px 0 46px; padding:16px 0 16px 20px; border-left:2px solid #798a7d; font:italic 15px/1.5 Georgia,serif; color:#657569; }
.memory-controls { display:flex; align-items:center; gap:15px; color:#324439; }
.memory-controls button { width:42px; height:42px; cursor:pointer; border:1px solid #304638; border-radius:50%; background:transparent; transition:.25s; }
.memory-controls button:hover { color:white; background:#25382c; transform:scale(1.08); }
.memory-controls span { font:9px monospace; letter-spacing:.12em; }

.lab-section { position:relative; z-index:3; padding:130px clamp(22px,7vw,110px) 150px; overflow:hidden; background:radial-gradient(circle at 78% 18%,#6e837644,transparent 25%),#111e18; }
.lab-section::before { content:""; position:absolute; inset:0; opacity:.22; background:repeating-radial-gradient(circle at 80% 35%,transparent 0 70px,#b9c9ba44 71px 72px); pointer-events:none; }
.lab-heading { position:relative; z-index:2; margin-bottom:65px; }
.lab-heading>p { margin:0 0 18px; color:#96a695; font:9px monospace; letter-spacing:.18em; }
.lab-heading h2 { margin:0; font-size:clamp(56px,7.6vw,122px); line-height:.81; letter-spacing:-.075em; }
.lab-heading h2 i { color:transparent; font-family:Georgia,serif; font-weight:400; -webkit-text-stroke:1px #aabbaa; }
.lab-grid { position:relative; z-index:2; display:grid; grid-template-columns:1fr 1fr; min-height:630px; border:1px solid #c3d0c038; border-radius:30px; overflow:hidden; background:#17271fb3; backdrop-filter:blur(18px); }
.signal-console,.artifact-console { padding:clamp(24px,4vw,58px); }
.signal-console { display:flex; flex-direction:column; border-right:1px solid #c3d0c038; }
.console-top { display:flex; justify-content:space-between; color:#b5c2b3; font:9px monospace; letter-spacing:.16em; }
.console-top i { color:#dce9d7; font-style:normal; text-shadow:0 0 10px #e7ffdc; }
.dial-zone { flex:1; min-height:300px; display:grid; grid-template-columns:minmax(190px,1fr) 1fr; gap:35px; align-items:center; }
.big-dial { position:relative; justify-self:center; width:clamp(175px,19vw,255px); aspect-ratio:1; cursor:grab; border:1px solid #dfebdc8c; border-radius:46% 54% 51% 49%; background:radial-gradient(circle at 35% 27%,#e8eee3,#708278 47%,#203128 69%,#b7c7b9 71%,#26382d 75%); box-shadow:inset 10px 14px 22px #ffffff7a,inset -15px -15px 28px #0b1711aa,0 20px 80px #0007,0 0 45px #d6f2d129; transition:transform .8s cubic-bezier(.16,1,.3,1); }
.big-dial::before { content:""; position:absolute; inset:15%; border:1px solid #ffffff73; border-radius:47% 53% 48% 52%; box-shadow:inset 0 0 24px #e5f2e285; }
.big-dial i { position:absolute; width:3px; height:22px; top:9%; left:50%; background:#eef4eb; box-shadow:0 0 9px white; }
.big-dial b { position:absolute; inset:0; display:grid; place-items:center; font-size:52px; color:#e8f0e7; text-shadow:0 2px 8px #102019; transform:rotate(calc((var(--mode, 0)) * -1deg)); }
.dial-copy span,.artifact-copy>span { color:#849687; font:8px monospace; letter-spacing:.2em; }
.dial-copy strong { display:block; margin:11px 0 16px; font-size:clamp(25px,3vw,45px); letter-spacing:-.05em; }
.dial-copy p { min-height:42px; color:#9eae9e; font:11px/1.55 monospace; }
.mode-bank { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid #b9c9ba38; border-radius:13px; overflow:hidden; }
.mode-bank button { padding:14px 8px; cursor:pointer; border:0; border-right:1px solid #b9c9ba38; background:#0e1c15; color:#738576; font:8px monospace; letter-spacing:.08em; }
.mode-bank button:last-child { border:0; }
.mode-bank button i { display:inline-block; width:5px; height:5px; margin-right:7px; border-radius:50%; background:#4a5f50; }
.mode-bank button.active { background:#dfe7dc; color:#17251d; }
.mode-bank button.active i { background:#c35e4d; box-shadow:0 0 10px #ed7964; }
.transmit { margin-top:14px; padding:18px; cursor:pointer; display:flex; justify-content:space-between; border:1px solid #dce7d859; border-radius:13px; background:#9caf9d19; font:9px monospace; letter-spacing:.12em; transition:.3s; }
.transmit:hover { padding-inline:25px; color:#17241c; background:#e4ebe1; }
.artifact-console { display:grid; grid-template-rows:1fr auto auto; background:radial-gradient(circle at 50% 36%,#adc1ad1b,transparent 50%); }
.artifact-visual { position:relative; min-height:340px; display:grid; place-items:center; animation:artifactIn .6s both; }
.artifact-visual>b { position:relative; z-index:2; font:clamp(95px,13vw,180px)/1 Georgia,serif; color:#dfe8dd; text-shadow:inset 0 0 20px white,0 0 22px #d9ffd64d,0 30px 50px #0009; animation:artifactFloat 3.4s ease-in-out infinite; }
.artifact-visual small { position:absolute; left:0; bottom:20px; color:#7f9081; font:8px monospace; letter-spacing:.15em; }
.artifact-orbit { position:absolute; width:65%; aspect-ratio:1; border:1px solid #ccdbca35; border-radius:50%; transform:rotate(22deg) scaleY(.42); animation:orbitSpin 12s linear infinite; }
.artifact-orbit::before { content:""; position:absolute; width:12px; height:12px; top:48%; left:-6px; border-radius:50%; background:#d7e4d4; box-shadow:0 0 16px #eaffdf; }
.artifact-orbit.two { width:90%; animation-direction:reverse; animation-duration:18s; }
.artifact-copy { border-top:1px solid #b9c9ba31; padding-top:24px; }
.artifact-copy h3 { margin:12px 0 10px; font-size:clamp(27px,3vw,43px); letter-spacing:-.05em; }
.artifact-copy p { max-width:520px; min-height:48px; margin:0; color:#99aa9c; font:10px/1.65 monospace; }
.artifact-dots { display:flex; gap:8px; margin-top:22px; }
.artifact-dots button { width:42px; height:42px; cursor:pointer; border:1px solid #b8c9b634; border-radius:50%; background:#101e17; color:#7f9181; font:18px Georgia,serif; transition:.25s; }
.artifact-dots button:hover,.artifact-dots button.active { transform:translateY(-4px); color:#17241c; background:#e3ebe1; box-shadow:0 10px 25px #0006; }

.route-section { position:relative; z-index:3; min-height:1150px; padding:130px clamp(22px,7vw,110px); color:#142119; background:#e7ebe3; }
.route-title { display:grid; grid-template-columns:1.35fr .65fr; align-items:end; gap:70px; }
.orbit-map { position:relative; width:min(1080px,100%); height:720px; margin:80px auto 0; }
.orbit-ring { position:absolute; left:50%; top:48%; width:66%; aspect-ratio:1.7; transform:translate(-50%,-50%) rotate(-7deg); border:1px dashed #41564871; border-radius:50%; }
.ring-b { width:43%; transform:translate(-50%,-50%) rotate(15deg); border-style:solid; opacity:.45; }
.orbit-core { position:absolute; z-index:3; left:50%; top:48%; width:140px; height:140px; transform:translate(-50%,-50%); display:grid; place-content:center; justify-items:center; border:1px solid #6f8275; border-radius:43% 57% 48% 52%; background:radial-gradient(circle at 35% 25%,#fff,#98aa9e 53%,#43594c 75%); box-shadow:inset 7px 8px 16px #fff9,inset -7px -9px 16px #34493e,0 18px 60px #27403155; animation:coreMorph 4s ease-in-out infinite alternate; }
.orbit-core span { font-size:62px; font-weight:900; color:#1b2b22; letter-spacing:-.09em; }
.orbit-core small { text-align:center; font:7px/1.25 monospace; letter-spacing:.15em; color:#304238; }
.orbit-beam { position:absolute; z-index:1; left:50%; top:48%; width:34%; height:1px; transform-origin:left center; background:linear-gradient(90deg,#2e4837,transparent); transition:transform .8s cubic-bezier(.16,1,.3,1); }
.orbit-beam i { position:absolute; right:0; top:-3px; width:7px; height:7px; border-radius:50%; background:#3a5142; box-shadow:0 0 12px #314a39; }
.orbit-node { position:absolute; z-index:4; width:150px; padding:0; cursor:pointer; transform:translate(-50%,-50%); border:0; background:none; color:#43564a; text-align:left; }
.orbit-node span { width:40px; height:40px; margin-bottom:8px; display:grid; place-items:center; border:1px solid #62766a; border-radius:50%; background:#e7ebe3; font:10px monospace; transition:.3s; }
.orbit-node b { display:block; font-size:12px; line-height:1.2; letter-spacing:-.02em; }
.orbit-node:hover span,.orbit-node.active span { color:#eef3eb; background:#253b2e; transform:scale(1.25); box-shadow:0 0 0 8px #4960521b; }
.orbit-node.active b { color:#18291e; }
.event-card { position:absolute; z-index:5; right:4%; bottom:0; width:min(390px,45%); padding:28px; border:1px solid #3d54466b; border-radius:22px; background:#f3f5efc7; backdrop-filter:blur(12px); box-shadow:0 25px 60px #243a2c20; animation:memoryIn .5s both; }
.event-card>div { display:flex; justify-content:space-between; color:#718075; font:8px monospace; letter-spacing:.15em; }
.event-card h3 { margin:20px 0 12px; font-size:34px; line-height:.95; letter-spacing:-.05em; }
.event-card p { margin:0 0 24px; color:#5b6a60; font:10px/1.65 monospace; }
.event-meter { height:3px; background:#24382c1e; }
.event-meter i { display:block; height:100%; background:#31483a; transition:width .7s ease; }

.closet-section { position:relative; isolation:isolate; z-index:3; min-height:900px; padding:110px clamp(22px,7vw,110px); overflow:hidden; }
.closet-art { position:absolute; z-index:-2; inset:-6%; background:url('/unstable-room.png') center/cover no-repeat; transform:translate3d(calc(var(--px) * 9px),calc(var(--py) * 6px),0) scale(1.12); transition:filter .8s; }
.closet-section::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#0c1711e8 0%,#0c1711aa 48%,#0c171133),linear-gradient(0deg,#101b16 0%,transparent 48%); }
.closet-copy { margin-top:120px; max-width:860px; }
.closet-copy>p { margin:0 0 25px; color:#a9b8a8; font:9px/1.6 monospace; letter-spacing:.18em; }
.closet-copy h2 { margin:0 0 42px; font-size:clamp(62px,9vw,145px); line-height:.76; letter-spacing:-.08em; }
.closet-copy h2 i { color:transparent; font-family:Georgia,serif; font-weight:400; -webkit-text-stroke:1px #e2e9df; }
.closet-copy .pill { padding:16px 22px; }
.object-marquee { position:absolute; left:0; right:0; bottom:45px; display:flex; width:max-content; gap:12px; animation:ticker 28s linear infinite; }
.object-marquee>div { width:220px; height:110px; padding:18px; display:flex; align-items:center; gap:15px; border:1px solid #d8e3d64a; border-radius:18px; background:#12211a99; backdrop-filter:blur(12px); }
.object-marquee b { width:60px; text-align:center; font:45px Georgia,serif; color:#dbe5d9; }
.object-marquee span { font:8px/1.4 monospace; letter-spacing:.14em; color:#c1cebf; }

.footer { position:relative; z-index:3; min-height:920px; padding:105px clamp(22px,7vw,110px) 35px; color:#122018; background:#e8ece5; }
.footer-signal { display:flex; align-items:center; gap:14px; color:#485d4f; font:9px monospace; letter-spacing:.17em; }
.footer-signal i { width:7px; height:7px; border-radius:50%; background:#b95645; box-shadow:0 0 10px #b95645; animation:pulse 1.2s infinite; }
.footer-title { margin-top:100px; }
.footer-title p { font:10px monospace; letter-spacing:.18em; color:#5d6e62; }
.footer-title h2 { margin:25px 0 70px; font-size:clamp(86px,13vw,205px); line-height:.68; letter-spacing:-.09em; }
.footer-title h2 i { color:transparent; font-family:Georgia,serif; font-weight:400; -webkit-text-stroke:1.5px #23372b; }
.footer-actions { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; }
.buy-big,.x-big { min-height:120px; padding:25px 30px; display:flex; align-items:center; justify-content:space-between; cursor:pointer; border-radius:22px; text-decoration:none; transition:.35s; }
.buy-big { border:0; color:#eef3ec; background:#192b21; }
.x-big { border:1px solid #263e3061; color:#1d3024; background:transparent; }
.buy-big span,.x-big span { font:9px monospace; letter-spacing:.15em; }
.buy-big b,.x-big b { font-size:clamp(22px,2.5vw,38px); }
.buy-big:hover,.x-big:hover { transform:translateY(-7px); box-shadow:0 22px 45px #27392c33; }
.buy-big:hover { background:#b95b49; }
.x-big:hover { color:#edf2ea; background:#22372a; }
.footer-bottom { position:absolute; left:clamp(22px,7vw,110px); right:clamp(22px,7vw,110px); bottom:25px; display:flex; justify-content:space-between; padding-top:22px; border-top:1px solid #31463943; color:#68786d; font:8px monospace; letter-spacing:.13em; }

.modal-backdrop { position:fixed; z-index:180; inset:0; padding:22px; display:grid; place-items:center; background:#07100ccc; backdrop-filter:blur(18px); animation:fadeIn .3s both; }
.buy-modal { position:relative; width:min(620px,100%); padding:50px; overflow:hidden; border:1px solid #e2eee07a; border-radius:30px; background:radial-gradient(circle at 85% 10%,#a6bba65c,transparent 28%),#17271f; box-shadow:0 30px 100px #000b; }
.modal-close { position:absolute; z-index:2; right:18px; top:18px; width:38px; height:38px; cursor:pointer; border:1px solid #d4dfd24a; border-radius:50%; background:#ffffff0c; font-size:22px; }
.modal-pons { position:absolute; right:-25px; top:30px; width:180px; height:180px; display:grid; place-items:center; border-radius:45% 55% 47% 53%; background:radial-gradient(circle at 35% 25%,#f7faf3,#71887a 55%,#2c4437); box-shadow:inset 8px 9px 18px #fff9,inset -10px -11px 20px #16291f,0 0 50px #cbe8c64f; color:#1b3024; font-size:100px; font-weight:900; transform:rotate(13deg); }
.buy-modal>span { display:block; margin-bottom:24px; color:#98aa9b; font:8px monospace; letter-spacing:.16em; }
.buy-modal h2 { position:relative; width:72%; margin:0 0 24px; font-size:clamp(37px,6vw,67px); line-height:.86; letter-spacing:-.06em; }
.buy-modal>p { position:relative; width:70%; color:#aebdaf; font:11px/1.65 monospace; }
.copy-button { width:100%; margin:22px 0 10px; padding:17px; cursor:pointer; border:0; border-radius:99px; color:#17251d; background:#e6ede3; font:9px monospace; letter-spacing:.1em; }
.buy-modal>a { display:block; padding:12px; color:#b9c8b8; text-align:center; font:8px monospace; letter-spacing:.12em; }

.reveal { opacity:0; transform:translateY(35px); transition:opacity .9s ease,transform .9s cubic-bezier(.16,1,.3,1); }
.reveal.is-visible { opacity:1; transform:none; }

@keyframes loadLine { from { transform:translateX(-110%); } to { transform:translateX(58%); } }
@keyframes loaderMorph { to { border-radius:52% 48% 41% 59%; transform:scale(.96) rotate(-2deg); } }
@keyframes pulse { 50% { transform:scale(1.8); opacity:.4; } }
@keyframes scan { 50% { width:155px; opacity:.35; } }
@keyframes heldWorld { to { transform:translate3d(calc(var(--px) * -13px + 2px),calc(var(--py) * -9px - 1px),0) scale(1.063); filter:brightness(1.15); } }
@keyframes ticker { to { transform:translateX(-50%); } }
@keyframes verticalScan { from { top:5%; } to { top:95%; } }
@keyframes memoryIn { from { opacity:0; transform:translateX(24px); } }
@keyframes artifactIn { from { opacity:0; transform:scale(.7) rotate(-13deg); } }
@keyframes artifactFloat { 50% { transform:translateY(-14px) rotate(4deg); } }
@keyframes orbitSpin { to { rotate:360deg; } }
@keyframes coreMorph { to { border-radius:57% 43% 59% 41%; transform:translate(-50%,-50%) rotate(4deg) scale(.96); } }
@keyframes fadeIn { from { opacity:0; } }

@media (max-width: 900px) {
  .topbar { grid-template-columns:1fr auto; }
  .topbar nav { display:none; }
  .room-index { display:none; }
  .hero { grid-template-columns:1fr; }
  .hero-art { background-position:57% center; }
  .hero-copy { width:100%; align-self:end; padding-bottom:30px; }
  .charge-card { display:none; }
  .origin-intro,.route-title { grid-template-columns:1fr; }
  .origin-intro p,.route-title>p { max-width:430px; }
  .memory-stage { grid-template-columns:1fr; }
  .portrait-wrap { min-height:450px; }
  .lab-grid { grid-template-columns:1fr; }
  .signal-console { border-right:0; border-bottom:1px solid #c3d0c038; }
  .orbit-map { height:800px; }
  .event-card { right:50%; width:min(480px,90%); transform:translateX(50%); }
  .footer-actions { grid-template-columns:1fr; }
}

@media (max-width: 620px) {
  .topbar { height:68px; padding-inline:16px; }
  .brand { font-size:9px; }
  .pill-ghost { display:none; }
  .mini-buy { padding:10px 12px; }
  .hero { min-height:720px; padding:95px 18px 25px; }
  .hero-art { background-position:60% center; }
  .hero-fade { background:linear-gradient(0deg,#0a1510ec 0%,#0a151088 48%,#0a151025 76%); }
  .eyebrow span:last-child { display:none; }
  .hero h1 { font-size:clamp(62px,20.5vw,96px); line-height:.78; }
  .hero h1 span:last-child { margin-left:18px; }
  .kicker { margin-bottom:16px; }
  .lede { width:92%; margin-block:28px 20px; font-size:14px; }
  .hero-actions { align-items:stretch; flex-direction:column; }
  .hero-actions .pill { width:100%; }
  .ticker { padding:12px 0; }
  .origin-section,.lab-section,.route-section { padding:90px 18px 100px; }
  .section-label { margin-bottom:55px; }
  .origin-intro { margin-bottom:45px; }
  .origin-intro h2,.route-title h2 { font-size:50px; }
  .memory-tabs { grid-template-columns:1fr 1fr; }
  .memory-tabs button { border-bottom:1px solid #23362a44; padding:14px 12px; }
  .portrait-wrap { min-height:390px; }
  .memory-copy { padding:32px 24px; }
  .memory-copy h3 { font-size:34px; }
  .memory-copy blockquote { margin-bottom:28px; }
  .lab-heading h2 { font-size:53px; }
  .signal-console,.artifact-console { padding:25px 18px; }
  .dial-zone { grid-template-columns:1fr; gap:6px; padding:35px 0; }
  .big-dial { width:190px; }
  .dial-copy { text-align:center; }
  .mode-bank { grid-template-columns:1fr 1fr; }
  .mode-bank button { border-bottom:1px solid #b9c9ba38; }
  .artifact-visual { min-height:270px; }
  .artifact-dots { justify-content:space-between; }
  .artifact-dots button { width:38px; height:38px; }
  .route-section { min-height:1120px; }
  .orbit-map { height:730px; margin-top:80px; }
  .orbit-ring { width:92%; top:40%; aspect-ratio:1; }
  .ring-b { width:62%; }
  .orbit-core { top:40%; width:100px; height:100px; }
  .orbit-core span { font-size:45px; }
  .orbit-beam { top:40%; width:40%; }
  .orbit-node { width:100px; }
  .orbit-node:nth-of-type(3) { left:90%!important; }
  .orbit-node:nth-of-type(5) { left:9%!important; }
  .event-card { bottom:0; }
  .closet-section { min-height:760px; padding:85px 18px; }
  .closet-copy { margin-top:80px; }
  .closet-copy h2 { font-size:64px; }
  .footer { min-height:790px; padding:80px 18px 30px; }
  .footer-title { margin-top:90px; }
  .footer-title h2 { font-size:82px; }
  .footer-bottom { left:18px; right:18px; flex-direction:column; gap:7px; }
  .buy-modal { padding:36px 24px 28px; }
  .modal-pons { width:120px; height:120px; font-size:70px; opacity:.45; }
  .buy-modal h2,.buy-modal>p { width:100%; }
  .cursor-glow { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
  .reveal { opacity:1; transform:none; }
}