@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');:root{font-family:'DM Sans',sans-serif;color:#f3f0ec;background:#09090d;scroll-behavior:smooth}*{box-sizing:border-box}body{margin:0;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit}#field{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.grain{position:fixed;inset:0;pointer-events:none;z-index:5;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E")}header,main,footer{position:relative;z-index:1}header{position:absolute;top:0;left:0;width:100%;height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;z-index:4}.brand{font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:-.09em;font-size:1.7rem}.brand span{color:#cc785e}nav{display:flex;gap:3rem;margin-left:4rem}nav a,header button,.eyebrow,.hero-bottom,.section-top,.section-bottom,.overline,.text-link,.about-label,footer,.drag-note{font-size:.72rem;font-weight:700;letter-spacing:.17em}nav a:hover,.text-link:hover,footer a:hover{color:#e9a48a}header button{background:none;border:0;color:inherit;cursor:pointer;padding:.8rem}header button span{color:#df8e70}.hero{min-height:800px;height:100svh;max-height:1200px;display:flex;align-items:center;padding:100px 11% 60px;position:relative}.hero-inner{width:100%}.eyebrow{display:flex;align-items:center;gap:1.4rem;color:#aaa4a8}.line{width:42px;height:1px;background:#d9836d}.index{margin-left:auto}h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(7rem,20vw,23rem);letter-spacing:-.105em;line-height:1;margin:4vh 0 0 -1.7%;font-weight:700;white-space:nowrap;text-shadow:0 0 100px #ca5d3733}.x{display:inline-block;color:#f5eee8;filter:drop-shadow(0 0 35px #ed6f6666);transition:transform .5s cubic-bezier(.2,.8,.2,1)}h1:hover .x{transform:skew(-9deg) scale(1.05)}.hero-copy{font-family:'Space Grotesk';font-size:clamp(1.5rem,2.5vw,2.8rem);line-height:1.18;letter-spacing:-.045em;margin:-.2rem 0 0 1%;color:#dfd7d3}.hero-actions{display:flex;align-items:center;justify-content:space-between;margin-top:5vh}.circle-link{width:146px;height:146px;border:1px solid #b9897d;border-radius:50%;display:flex;align-items:center;justify-content:center;gap:.8rem;transform:rotate(-12deg);font-size:.7rem;letter-spacing:.12em;font-weight:700;line-height:1.5;transition:background .3s,transform .3s}.circle-link:hover{background:#b66552;transform:rotate(0)}.circle-link b{font-size:1.5rem;font-weight:400}.drag-note{text-align:right;color:#958d91;line-height:1.8}.hero-bottom{position:absolute;bottom:35px;left:5.5%;right:5.5%;display:flex;justify-content:space-between;color:#8b8489}.world{min-height:740px;position:relative;padding:5rem 8% 4rem;border-top:1px solid #ffffff23;overflow:hidden}.music{background:linear-gradient(130deg,#100d16 10%,#23121e 57%,#100e16)}.words{background:linear-gradient(130deg,#171313,#231c19 60%,#101014)}.section-top,.section-bottom{display:flex;justify-content:space-between;color:#aaa0a0}.section-top{border-bottom:1px solid #ffffff27;padding-bottom:1.2rem}.section-bottom{border-top:1px solid #ffffff27;padding-top:1.2rem}.world-body{min-height:610px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:5vw}.world-copy{max-width:570px}.overline{color:#e0967d;margin-bottom:2rem}.world h2,.about h2{font-family:'Space Grotesk';font-size:clamp(3.5rem,6.2vw,7.8rem);letter-spacing:-.075em;line-height:1.03;margin:0 0 2rem;font-weight:500}.world h2 em,.about h2 i{font-weight:400;font-family:Georgia,serif;letter-spacing:-.065em;color:#dea184}.world-copy>p:not(.overline),.about p{font-size:1.15rem;line-height:1.7;max-width:460px;color:#c1b8b8}.text-link{display:inline-flex;gap:2.5rem;padding:1.1rem 0;border-bottom:1px solid #cd8776;margin-top:1.8rem;line-height:1.5}.text-link span{font-size:1.1rem}.orb{width:min(33vw,420px);height:min(33vw,420px);border-radius:50%;margin:auto;background:radial-gradient(circle at 36% 34%,#ffc1a4 0%,#bd6479 13%,#40234f 37%,#151224 57%,#da8f75 72%,#1b182b 80%);box-shadow:0 0 85px #be53703a,inset -25px -35px 45px #060510;filter:saturate(1.25);animation:float 7s ease-in-out infinite;position:relative}.orb:after{content:'';position:absolute;inset:-12%;border-radius:50%;border:1px solid #d69c805c;transform:rotateX(72deg) rotate(-24deg);box-shadow:0 0 18px #c4776766}.word-art{font-family:Georgia,serif;font-style:italic;font-size:clamp(3rem,6.7vw,8rem);letter-spacing:-.08em;line-height:.95;color:#ecded0;transform:rotate(-9deg);margin:auto;text-shadow:4px 7px 0 #6f4b46,10px 15px 45px #e2a18240}.word-art span{display:block}.word-art span:nth-child(2){margin-left:1.5em;color:#bf8b78}.word-art span:nth-child(3){margin-left:.3em}.about{padding:10rem 10%;display:grid;grid-template-columns:1fr 2fr;gap:3rem;background:#0d0c10}.about-label{color:#dc9276;padding-top:1rem}.about h2{max-width:900px}.about p{max-width:610px}footer{min-height:145px;padding:2rem 5.5%;border-top:1px solid #ffffff27;display:flex;align-items:center;justify-content:space-between;gap:1rem;color:#a7a0a0}footer .brand{color:#f3f0ec}@keyframes float{50%{transform:translateY(-19px) rotate(8deg)}}@media(max-width:800px){header{height:78px;padding:0 5%}nav{gap:1rem;margin:0}nav a{font-size:.6rem}header button{display:none}.hero{min-height:680px;padding:90px 6% 70px}h1{font-size:clamp(5.1rem,20vw,12rem);margin:7vh 0 2rem -1%}.eyebrow{font-size:.58rem}.index{display:none}.hero-actions{margin-top:5rem}.drag-note{font-size:.55rem}.hero-bottom{font-size:.55rem;left:6%;right:6%}.world{padding:4rem 6%}.world-body{grid-template-columns:1fr;gap:4rem;padding:4rem 0;min-height:auto}.orb{width:210px;height:210px;grid-row:1}.world-copy{grid-row:2}.word-art{font-size:clamp(3.5rem,12vw,6rem);grid-row:1}.section-top,.section-bottom{font-size:.58rem}.world h2{font-size:clamp(3.5rem,11vw,6rem)}.about{grid-template-columns:1fr;padding:7rem 6%;gap:1rem}.about h2{font-size:clamp(4rem,12vw,7rem)}footer{flex-wrap:wrap;font-size:.58rem}}@media(max-width:450px){header .brand{font-size:1.35rem}nav{gap:.8rem}nav a{font-size:.57rem}.hero{min-height:650px}.hero-copy{font-size:1.5rem}.circle-link{width:115px;height:115px;font-size:.6rem}.hero-bottom span:first-child{max-width:160px}.section-top span:last-child{max-width:120px;text-align:right}}@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.orb{animation:none}h1 .x,.circle-link{transition:none}#field{display:none}}

/* Keep the name legible: tight display tracking joined the two v letters. */
.brand{font-family:Arial,Helvetica,sans-serif;letter-spacing:.015em;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0}.hero h1{font-family:Arial,Helvetica,sans-serif;letter-spacing:-.045em;font-variant-ligatures:none;font-feature-settings:"liga" 0,"clig" 0;font-size:clamp(4.8rem,15vw,16rem);margin-left:0}.hero h1 .x{margin-left:.06em}@media(max-width:800px){.hero h1{font-size:clamp(4rem,16vw,9rem)}}@media(max-width:450px){.hero h1{font-size:16vw}}
/* Open tracking makes the two v glyphs unmistakably separate. */
.brand{letter-spacing:.085em}
.hero h1{letter-spacing:.075em;font-size:clamp(4.2rem,12.6vw,13rem);white-space:nowrap}
.hero h1 .x{margin-left:.08em}
@media(max-width:800px){.hero h1{font-size:clamp(3.5rem,12.4vw,8rem)}}
@media(max-width:450px){.hero h1{font-size:12.2vw}}

.music-score{position:relative;width:100%;height:clamp(360px,38vw,510px);min-width:0;isolation:isolate;touch-action:pan-y}
.music-score canvas{display:block;width:100%;height:100%;cursor:default}
.score-hint{position:absolute;left:11%;bottom:4%;color:#c69d9a;font-size:.68rem;font-weight:700;letter-spacing:.18em;pointer-events:none}
@media(max-width:800px){.music-score{height:330px;grid-row:1}.music .world-copy{grid-row:2}.score-hint{font-size:.6rem}}
@media(max-width:450px){.music-score{height:280px}}

.paper-scene{position:relative;width:100%;height:clamp(380px,40vw,520px);min-width:0;touch-action:pan-y;isolation:isolate}
.paper-scene canvas{display:block;width:100%;height:100%;cursor:default}
.paper-hint{position:absolute;left:10%;bottom:3%;font-size:.68rem;font-weight:700;letter-spacing:.18em;color:#c6a299;pointer-events:none}
@media(max-width:800px){.paper-scene{height:350px;grid-row:1}.words .world-copy{grid-row:2}.paper-hint{font-size:.6rem}}
@media(max-width:450px){.paper-scene{height:300px}}
