@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap');
*{box-sizing:border-box}
html{min-height:100%;background:#070d20}
body{margin:0;min-height:100vh;color:#fff;font-family:Outfit,Arial,sans-serif;background:radial-gradient(ellipse at 50% 28%,#203e82 0%,#101d40 40%,#070d20 80%);display:flex;flex-direction:column}
.welcome{display:grid;place-items:center;flex:1;min-height:calc(100vh - 55px);padding:45px 20px;text-align:center;overflow:hidden;position:relative}
.welcome:before,.welcome:after{content:"";position:absolute;width:300px;height:600px;background:linear-gradient(180deg,rgba(63,146,255,.16),transparent);top:-160px;filter:blur(22px);pointer-events:none}
.welcome:before{left:-90px;transform:rotate(-25deg)}
.welcome:after{right:-90px;transform:rotate(25deg)}
.content{position:relative;z-index:1;max-width:760px}
.mic{font-size:100px;filter:drop-shadow(0 0 24px #308cff);animation:float 3s ease-in-out infinite}
.eyebrow{letter-spacing:4px;font-size:12px;color:#83c5ff;font-weight:800;margin:30px 0 15px}
h1{font-size:clamp(42px,7vw,78px);line-height:1.12;letter-spacing:-2px;margin:0;font-weight:900}
h1 span{color:#5bb7ff;text-shadow:0 0 35px rgba(46,154,255,.3)}
.tagline{font-size:clamp(20px,3vw,29px);font-weight:700;margin:24px 0 8px}
.intro{font-size:17px;color:#bfcde7;margin:0 0 38px}
.enter{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:64px;padding:0 35px;background:linear-gradient(100deg,#329fff,#6fc9ff);color:#05122c;border-radius:16px;text-decoration:none;font-size:20px;font-weight:900;box-shadow:0 10px 45px #168bff55;transition:transform .2s,box-shadow .2s}
.enter:hover,.enter:focus-visible{transform:translateY(-4px);box-shadow:0 14px 55px #168bff99}
.hint{color:#8ba3c9;font-size:13px;margin-top:20px}
footer{text-align:center;padding:17px;color:#7185aa;font-size:12px}
@keyframes float{50%{transform:translateY(-12px)}}
@media(max-width:480px){.mic{font-size:80px}.eyebrow{letter-spacing:2px}.intro{font-size:15px}.enter{font-size:17px;width:100%;max-width:340px}}
@media(prefers-reduced-motion:reduce){.mic{animation:none}.enter{transition:none}}

.topbar{width:100%;min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px max(22px,calc((100vw - 1160px)/2));border-bottom:1px solid rgba(128,176,245,.18);background:rgba(7,13,32,.52)}
.site-name{font-size:19px;font-weight:800;color:#f3f7ff;text-decoration:none}
.music-link{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border:1px solid #4a8ee2;border-radius:11px;background:rgba(42,112,205,.18);color:#bfe2ff;text-decoration:none;font-weight:700}
.music-link:hover,.music-link:focus-visible{background:#2788e5;color:#fff}
.welcome{min-height:calc(100vh - 129px)}
@media(max-width:480px){.topbar{padding:12px 17px}.site-name{font-size:15px}.music-link{font-size:14px;padding:10px 12px}}