:root{color-scheme:dark;--pink:#ff55c8;--cyan:#7cf6f1;--ink:#10091d}
*{box-sizing:border-box}html{min-height:100%;background:var(--ink)}body{margin:0;min-height:100svh;display:flex;flex-direction:column;overflow-x:hidden;background:#10091d;color:#fff4fc;font-family:Arial,Helvetica,sans-serif}.scene{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,#68285644,transparent 55%),radial-gradient(ellipse at 90% 5%,#372a6526,transparent 40%),#10091d}.stars{position:absolute;inset:0;background-image:radial-gradient(circle,#ffc4f7a0 1px,transparent 1.5px),radial-gradient(circle,#a3f7f790 1px,transparent 1.5px);background-size:137px 171px,223px 193px;background-position:17px 11px,90px 77px;mask-image:linear-gradient(#000,transparent 85%);animation:twinkle 7s ease-in-out infinite alternate}.orb{position:absolute;left:50%;top:25%;transform:translateX(-50%);width:min(58vw,610px);aspect-ratio:1;border-radius:50%;opacity:.42;background:linear-gradient(#fcaf68 0%,#ff659c 31%,#cc36a3 58%,#631779 100%);mask-image:linear-gradient(#000 0 46%,transparent 46% 47%,#000 47% 53%,transparent 53% 55%,#000 55% 60%,transparent 60% 63%,#000 63% 68%,transparent 68% 72%,#000 72% 76%,transparent 76% 81%,#000 81% 84%,transparent 84% 90%,#000 90% 92%,transparent 92%);filter:drop-shadow(0 0 60px #fa50cf)}.horizon{position:absolute;left:-10%;right:-10%;top:70%;height:1px;background:#a567d6;box-shadow:0 0 16px 3px #a654b966,0 -50px 120px 35px #ad40851f}.grid{position:absolute;left:-50%;width:200%;top:70%;height:70%;background-image:linear-gradient(#d15bb844 1px,transparent 1px),linear-gradient(90deg,#d15bb844 1px,transparent 1px);background-size:75px 60px;transform:perspective(260px) rotateX(57deg);transform-origin:center top;mask-image:linear-gradient(transparent,#000 12%,#000 45%,transparent 85%)}.grain{position:absolute;inset:0;opacity:.065;background: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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.site-header,footer{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:32px 40px;font-family:monospace;font-size:10px;letter-spacing:1.5px}.wordmark{font-size:12px;font-weight:700;text-decoration:none;color:#f4dbef;letter-spacing:1.3px}.wordmark span{color:var(--pink)}.frequency{display:flex;align-items:center;gap:9px;color:#b298ba}.frequency i{height:5px;width:5px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px #7cf6f177}main{position:relative;z-index:1;flex:1;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:44px 24px 72px;text-align:center}.eyebrow{display:flex;align-items:center;gap:15px;margin:0 0 28px;color:#eab5d8;font:10px monospace;letter-spacing:3px}.eyebrow span{height:1px;width:30px;background:linear-gradient(90deg,transparent,#e58cbc)}.eyebrow span:last-child{transform:rotate(180deg)}h1{font-family:Arial,Helvetica,sans-serif;font-size:clamp(64px,9vw,132px);line-height:.92;font-weight:900;letter-spacing:-.075em;margin:0;filter:drop-shadow(0 2px 0 #b03aab) drop-shadow(0 4px 0 #451743) drop-shadow(0 0 22px #ee62da33)}.player{position:relative;margin-top:50px;isolation:isolate}.play-button{position:relative;display:flex;align-items:center;justify-content:center;width:230px;height:100px;border:1px solid #ffb2ec;border-radius:100px;background:linear-gradient(155deg,#fb77d5 0%,#ef46b9 38%,#b938a3 100%);box-shadow:inset 0 2px 2px #ffeaff7f,inset 0 -5px 0 #68245d55,0 8px 0 #622454,0 13px 30px #0008,0 0 45px #f644b937;cursor:pointer;transition:transform .15s,box-shadow .15s,filter .15s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.play-button:hover{filter:brightness(1.13);transform:translateY(-2px)}.play-button:active,.play-button.pressed{transform:translateY(5px);box-shadow:inset 0 2px 2px #ffeaff7f,inset 0 -2px 0 #68245d55,0 3px 0 #622454,0 5px 20px #0008,0 0 60px #f644b966}.play-button:focus-visible{outline:3px solid var(--cyan);outline-offset:12px}.button-shine{position:absolute;inset:5px 12px auto;height:39%;border-radius:100px;background:linear-gradient(#ffdfef24,transparent);pointer-events:none}.play-icon{position:relative;width:30px;height:35px;margin-left:6px;fill:#fff6fb;filter:drop-shadow(0 2px 2px #9e286e)}.button-halo{position:absolute;z-index:-1;top:50px;left:50%;width:290px;height:140px;border:1px solid #ff6bcc33;border-radius:50%;transform:translate(-50%,-50%) rotate(-13deg);transition:opacity .3s}.status{margin:27px 0 0;font:10px monospace;letter-spacing:2px;color:#d3b3d1;min-height:2.5em;max-width:280px;line-height:1.6}.equalizer{display:none;position:absolute;align-items:center;justify-content:center;gap:5px;height:35px}.equalizer i{height:12px;width:4px;border-radius:4px;background:#fff3fc;animation:equalize .6s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.4s}.equalizer i:nth-child(3){animation-delay:-.2s}.equalizer i:nth-child(4){animation-delay:-.5s}.equalizer i:nth-child(5){animation-delay:-.3s}.is-playing .equalizer{display:flex}.is-playing .play-icon{opacity:0}.is-playing .button-halo{animation:halo 1.8s ease-out infinite}.is-loading .play-icon{animation:twinkle .5s ease-in-out infinite alternate}footer{color:#967b9e;font-size:9px;padding-top:20px;padding-bottom:24px}.footer-center{color:#b496bb}footer>span:last-child span{color:var(--cyan);font-size:15px}@keyframes equalize{to{height:32px}}@keyframes twinkle{to{opacity:.35}}@keyframes halo{from{opacity:.7;transform:translate(-50%,-50%) rotate(-13deg) scale(.8)}to{opacity:0;transform:translate(-50%,-50%) rotate(-13deg) scale(1.5)}}@media(min-width:1500px){main{padding-bottom:100px}.orb{top:27%}}@media(max-width:600px){.site-header{padding:24px}.frequency{display:none}main{padding:30px 18px 50px}.eyebrow{font-size:8px;letter-spacing:2px;gap:9px;margin-bottom:32px}.eyebrow span{width:20px}h1{font-size:clamp(58px,13.8vw,83px)}.orb{width:95vw;top:29%;opacity:.38}.player{margin-top:44px}.play-button{width:210px;height:94px}footer{padding:20px 22px;font-size:8px;letter-spacing:.8px}.footer-center{display:none}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.equalizer i:nth-child(2),.equalizer i:nth-child(4){height:25px}.equalizer i:nth-child(3){height:32px}}

/* Sunset-chrome reflections repeat on each line, with a hard metallic horizon. */
h1 span {
  display: inline-block;
  padding: .04em .03em;
  color: #f9dcff;
}
@supports (background-clip: text) or (-webkit-background-clip: text) {
  h1 span {
    background: linear-gradient(180deg,
      #ffffff 0%, #e4ffff 10%, #8decff 23%, #8d92ee 36%,
      #443b87 47%, #251c4d 49%,
      #fff2ff 50%, #ffc5f3 54%, #ff78d2 65%,
      #b84dba 78%, #e5a6ec 89%, #ffffff 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-stroke: .6px #f6c9ff;
  }
}