*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-width:320px;min-height:100%;background:#010101;color:#f1efe6;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:16px;line-height:1.4;overflow:hidden}body{min-height:100vh;min-height:100dvh}button,input{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:inherit;font-weight:400}button{color:inherit}button:focus-visible,input:focus-visible{outline:1px solid rgba(233,248,224,.75);outline-offset:.45rem}.xeno-shell{position:relative;isolation:isolate;display:grid;place-items:center;width:100vw;height:100vh;height:100dvh;overflow:hidden;background:linear-gradient(115deg,rgba(233,248,224,.008),transparent 34%),linear-gradient(245deg,rgba(154,190,186,.015),transparent 45%),linear-gradient(180deg,#000,#010101 52%,#000)}.field{position:absolute;inset:-8%;z-index:-3;background:radial-gradient(ellipse at calc(50% + var(--cursor-x) * 14%) calc(48% + var(--cursor-y) * 10%),rgba(245,243,235,.024),transparent 58%);transform:translate(calc(var(--cursor-x) * -1.3rem),calc(var(--cursor-y) * -1.1rem)) rotate(calc(var(--cursor-x) * .45deg));opacity:calc(.12 + var(--distance) * .18);transition:transform .55s ease,opacity .55s ease}.grain{position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:.4;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.72' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.82'/%3E%3C/svg%3E");background-size:88px 88px;filter:contrast(220%) brightness(54%);mix-blend-mode:normal}.filter-rig{position:absolute;width:0;height:0;overflow:hidden}.instrument{position:relative;display:grid;grid-template-rows:minmax(3.5rem,auto) minmax(14rem,auto) minmax(3.5rem,auto) 2rem;align-items:center;justify-items:center;width:min(88rem,calc(100vw - 3rem));min-height:min(48rem,calc(100dvh - 3rem));padding:2rem 0}.axis{display:grid;grid-template-columns:5rem minmax(18rem,46rem) 5rem;align-items:center;justify-items:center;width:100%;gap:2rem}.fragment-stage{display:grid;place-items:center;min-height:13rem;width:100%;transform:translate(calc(var(--cursor-x) * .6rem),calc(var(--cursor-y) * .45rem));transition:transform .55s cubic-bezier(.16,1,.3,1)}.fragment{position:relative;z-index:1;margin:0;max-width:44rem;color:#f5f3ebf7;font-family:Georgia,Times New Roman,serif;font-size:3.25rem;font-weight:400;line-height:1.12;text-align:center;text-wrap:balance;letter-spacing:0;text-shadow:0 1px 0 rgba(0,0,0,.32),0 0 1rem rgba(245,243,235,.2),0 0 3.8rem rgba(154,190,186,.17);filter:url(#xeno-fragment-edge);animation:fragment-arrival .62s cubic-bezier(.16,1,.3,1) both}.fragment:before,.fragment:after{content:attr(data-fragment);position:absolute;inset:0;pointer-events:none;opacity:0;filter:url(#xeno-loading-warp)}.fragment:before{color:#9abeba8c;clip-path:inset(8% 0 52% 0)}.fragment:after{color:#bf6e526b;clip-path:inset(54% 0 9% 0)}.generating .fragment{animation:breath .9s ease-in-out infinite alternate,fragment-loading-skew .48s steps(2,end) infinite;filter:url(#xeno-loading-warp);text-shadow:0 0 .6rem rgba(245,243,235,.18),0 0 2.4rem rgba(154,190,186,.18),.07rem 0 rgba(191,110,82,.22),-.06rem 0 rgba(154,190,186,.18)}.generating .fragment:before,.generating .fragment:after{opacity:1}.generating .fragment:before{animation:fragment-noise-a .36s steps(3,end) infinite}.generating .fragment:after{animation:fragment-noise-b .42s steps(4,end) infinite}.error .fragment{text-shadow:0 0 .8rem rgba(191,110,82,.18),0 0 3.2rem rgba(245,243,235,.09)}.arrow,.direction{border:0;background:transparent;cursor:pointer;letter-spacing:0;transition:opacity .18s ease,color .18s ease,transform .42s cubic-bezier(.16,1,.3,1),text-shadow .18s ease}.arrow:disabled,.direction:disabled{cursor:default;opacity:.38}.arrow{display:grid;place-items:center;width:5rem;height:5rem;padding:0;color:#e9f8e085;font-size:2.2rem;line-height:1}.arrow.left,.arrow.right{transform:translate(calc(var(--cursor-x) * -.8rem))}.arrow:not(:disabled):hover{color:#e9f8e0f2;text-shadow:0 0 1.2rem rgba(233,248,224,.18)}.direction{--direction-color: #9abeba;min-height:3.5rem;padding:.42rem .9rem;border:1px solid color-mix(in srgb,var(--direction-color) 34%,transparent);border-radius:999px;background:linear-gradient(135deg,color-mix(in srgb,var(--direction-color) 12%,transparent),#f5f3eb06);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px #f5f3eb14,0 .7rem 2.2rem #0000002e,0 0 1.5rem color-mix(in srgb,var(--direction-color) 13%,transparent);color:color-mix(in srgb,var(--direction-color) 72%,#f5f3eb 24%);font-size:.92rem;line-height:1.3;text-transform:lowercase;text-align:center}.direction span{display:inline-block;animation:drift 9s ease-in-out infinite alternate}.direction.bottom span{animation-duration:11s;animation-direction:alternate-reverse}.direction.top{transform:translate(calc(var(--cursor-x) * -1rem),calc(var(--cursor-y) * -.7rem))}.direction.bottom{transform:translate(calc(var(--cursor-x) * .9rem),calc(var(--cursor-y) * .75rem))}.direction:not(:disabled):hover{border-color:color-mix(in srgb,var(--direction-color) 48%,rgba(245,243,235,.2));background:linear-gradient(135deg,color-mix(in srgb,var(--direction-color) 18%,transparent),#f5f3eb0a);color:#f5f3ebeb;filter:url(#xeno-direction-warp);text-shadow:0 0 1rem color-mix(in srgb,var(--direction-color) 34%,transparent)}.distance{width:min(26rem,56vw);height:2rem;margin:0;padding:0;accent-color:#e9f8e0;background:transparent;cursor:pointer;transform:translateY(.6rem)}.distance::-webkit-slider-runnable-track{height:1px;background:linear-gradient(90deg,#bf6e5285,#e9f8e09e,#9abeba85)}.distance::-webkit-slider-thumb{width:.8rem;height:.8rem;margin-top:-.38rem;border:1px solid rgba(245,243,235,.92);border-radius:50%;background:#050505;box-shadow:0 0 .7rem #e9f8e014;transform:scale(1);transform-origin:center;transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .18s ease;will-change:transform;-webkit-appearance:none;appearance:none}.distance:hover::-webkit-slider-thumb,.distance:focus-visible::-webkit-slider-thumb{box-shadow:0 0 1rem #e9f8e02e;transform:scale(1.25)}.distance::-moz-range-track{height:1px;background:linear-gradient(90deg,#bf6e5285,#e9f8e09e,#9abeba85)}.distance::-moz-range-thumb{width:.8rem;height:.8rem;border:1px solid rgba(245,243,235,.92);border-radius:50%;background:#050505;box-shadow:0 0 .7rem #e9f8e014;transform:scale(1);transform-origin:center;transition:transform .18s cubic-bezier(.16,1,.3,1),box-shadow .18s ease;will-change:transform}.distance:hover::-moz-range-thumb,.distance:focus-visible::-moz-range-thumb{box-shadow:0 0 1rem #e9f8e02e;transform:scale(1.25)}.language-toggle{position:fixed;top:1rem;left:1rem;z-index:2;width:2.6rem;height:2rem;padding:0;border:1px solid rgba(233,248,224,.14);border-radius:999px;background:#f5f3eb09;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f5f3eba3;cursor:pointer;font-size:.76rem;line-height:1;text-transform:lowercase;transition:border-color .18s ease,color .18s ease,background .18s ease,opacity .18s ease}.language-toggle:not(:disabled):hover{border-color:#e9f8e047;background:#f5f3eb11;color:#f5f3ebe6}.language-toggle:disabled{cursor:default;opacity:.38}.system-error{position:fixed;right:1rem;bottom:1rem;max-width:26rem;color:#bf6e52e6;font-size:.75rem}@keyframes fragment-arrival{0%{opacity:0;transform:translateY(.75rem) scale(.992)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes breath{0%{opacity:.62;transform:translateY(.1rem)}to{opacity:.88;transform:translateY(-.1rem)}}@keyframes fragment-loading-skew{0%{letter-spacing:0}50%{letter-spacing:.015em}to{letter-spacing:0}}@keyframes fragment-noise-a{0%{transform:translate(-.1rem,-.08rem);clip-path:inset(6% 0 61% 0)}33%{transform:translate(.16rem,.03rem);clip-path:inset(29% 0 38% 0)}66%{transform:translate(-.04rem,.12rem);clip-path:inset(14% 0 55% 0)}to{transform:translate(.09rem,-.02rem);clip-path:inset(38% 0 26% 0)}}@keyframes fragment-noise-b{0%{transform:translate(.12rem,.08rem);clip-path:inset(53% 0 12% 0)}25%{transform:translate(-.18rem,-.02rem);clip-path:inset(61% 0 5% 0)}50%{transform:translate(.05rem,.14rem);clip-path:inset(45% 0 26% 0)}75%{transform:translate(-.08rem,-.09rem);clip-path:inset(67% 0 2% 0)}to{transform:translate(.14rem,.02rem);clip-path:inset(57% 0 15% 0)}}@keyframes drift{0%{transform:translate(-.15rem)}to{transform:translate(.15rem,-.2rem)}}@media(max-width:740px){.instrument{grid-template-rows:minmax(4.5rem,auto) minmax(16rem,auto) minmax(4.5rem,auto) 2rem;width:calc(100vw - 2rem);min-height:calc(100dvh - 2rem);padding:1rem 0}.axis{grid-template-columns:3rem minmax(0,1fr) 3rem;gap:.75rem}.fragment-stage{min-height:15rem}.fragment{font-size:2.15rem;line-height:1.16}.arrow{width:3rem;height:4rem;font-size:1.7rem}.direction{max-width:16rem;font-size:.86rem}.distance{width:min(18rem,70vw)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:1ms!important}}