:root{--paper:#eee2cc;--ink:#382d24;--line:rgba(56,45,36,.23);--ease:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overflow-x:hidden}main{width:min(1180px,100%);min-height:100svh;margin:auto;padding:clamp(22px,4vw,54px);display:grid;grid-template-rows:auto 1fr auto;gap:24px}header{display:flex;justify-content:space-between;align-items:end;gap:32px;position:relative;z-index:3}.kicker{text-transform:uppercase;letter-spacing:.16em;font-size:10px;font-weight:700;margin:0 0 12px}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(40px,6.2vw,82px);font-weight:400;line-height:.86;letter-spacing:-.055em;margin:0}.intro{max-width:330px;font-family:Georgia,"Times New Roman",serif;font-size:17px;line-height:1.45;margin:0 0 4px}.kicker,h1,.intro{opacity:0;transform:translateY(16px);animation:arrive .85s var(--ease) forwards}.kicker{animation-delay:.05s}h1{animation-delay:.13s}.intro{animation-delay:.25s}@keyframes arrive{to{opacity:1;transform:none}}.stage{position:relative;min-height:540px;display:grid;place-items:center;isolation:isolate;opacity:0;transform:scale(.96);animation:globeIn 1.2s .25s var(--ease) forwards}@keyframes globeIn{to{opacity:1;transform:none}}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}canvas:active{cursor:grabbing}.orbshine{position:absolute;width:min(68vw,560px);aspect-ratio:1;border-radius:50%;pointer-events:none;z-index:3;background:radial-gradient(circle at 31% 24%,rgba(255,255,255,.24),transparent 27%),linear-gradient(120deg,transparent 57%,rgba(34,24,20,.13));box-shadow:inset 0 0 28px rgba(40,27,22,.22),0 30px 55px rgba(90,49,30,.13)}.grain{position:absolute;inset:6% 12%;pointer-events:none;mix-blend-mode:multiply;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E");border-radius:50%;z-index:2}.hint{position:absolute;left:0;top:50%;font-size:11px;letter-spacing:.08em;text-transform:uppercase;writing-mode:vertical-rl;display:flex;align-items:center;gap:9px;margin:0;transition:opacity .5s var(--ease)}.hint span{width:1px;height:28px;background:var(--ink);display:block;animation:nudge 1.6s infinite var(--ease)}@keyframes nudge{50%{transform:scaleY(.55);opacity:.5}}.sound{position:absolute;right:0;bottom:16px;border:0;background:transparent;color:var(--ink);display:flex;align-items:end;gap:3px;padding:12px 0;cursor:pointer;transition:transform .3s var(--ease)}.sound:hover{transform:translateY(-2px)}.sound:active{transform:scale(.94)}.sound i{display:block;width:2px;height:10px;background:currentColor;transform-origin:bottom;opacity:.65}.sound i:nth-child(2){height:16px}.sound i:nth-child(3){height:12px}.sound i:nth-child(4){height:7px}.sound b{font-size:11px;letter-spacing:.09em;text-transform:uppercase;margin-left:7px}.sound[aria-pressed=true] i{animation:pulse .8s infinite alternate}.sound[aria-pressed=true] i:nth-child(2){animation-delay:.2s}.sound[aria-pressed=true] i:nth-child(3){animation-delay:.4s}@keyframes pulse{to{transform:scaleY(.3)}}footer{border-top:1px solid var(--line);padding-top:14px;display:flex;justify-content:space-between;font-size:11px;letter-spacing:.04em;gap:24px;opacity:0;animation:arrive .8s .7s var(--ease) forwards}footer p{margin:0}.found{position:fixed;inset:auto 18px 18px auto;background:#382d24;color:#eee2cc;border-radius:99px;padding:10px 14px;font-size:11px;letter-spacing:.06em;z-index:8;animation:arrive .4s var(--ease) both}.visual-fallback .stage::before{content:"";position:absolute;width:min(68vw,560px);aspect-ratio:1;border-radius:50%;z-index:-2;background-image:url('panorama.svg');background-size:auto 100%;background-position:center;box-shadow:0 30px 55px rgba(90,49,30,.2),inset -25px -30px 50px rgba(54,32,26,.34),inset 20px 24px 46px rgba(255,240,205,.3)}.visual-fallback .stage::after{content:"";position:absolute;width:min(68vw,560px);aspect-ratio:1;border-radius:50%;z-index:-1;opacity:1;background:radial-gradient(circle at 36% 28%,rgba(255,255,255,.25),transparent 32%),linear-gradient(115deg,transparent 58%,rgba(40,26,22,.18));box-shadow:inset 0 0 35px rgba(46,29,22,.25)}@media(max-width:620px){main{padding:22px 18px 18px;gap:8px}header{display:block}.kicker{margin-bottom:8px}h1{font-size:46px}.intro{font-size:14px;line-height:1.42;margin-top:15px;max-width:280px}.stage{min-height:58svh;margin:0 -18px}.hint{left:18px;top:45%;font-size:9px}.sound{right:18px;bottom:5px}.grain{inset:14% 5%}.visual-fallback .stage::before,.visual-fallback .stage::after,.orbshine{width:94vw}footer{font-size:9px;line-height:1.35}footer p:last-child{text-align:right;max-width:130px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}
@media(max-width:620px){.orbshine{width:94vw}.stage{min-height:59svh}.intro{max-width:300px}.sound{background:rgba(238,226,204,.72);backdrop-filter:blur(3px);padding:9px 7px;border-radius:3px}}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#a84e37;margin:0 9px 1px 0}.sound:focus-visible{outline:1px solid currentColor;outline-offset:5px}.stage::selection{background:transparent}@media(pointer:fine){.stage{transition:transform .45s var(--ease)}.stage:hover{transform:scale(1.006)}}