/* Signals converge on the room form; all original introduction copy follows it. */
#lobby .home-hero{isolation:isolate;display:grid;place-items:center;grid-template-columns:minmax(0,1fr);width:100%;max-width:none;min-height:calc(100svh - 78px);padding:64px 24px 72px;margin:0;gap:0;overflow:hidden;background:radial-gradient(ellipse at center,#7c6fff18,transparent 64%)}
#lobby .home-hero>.lcard{grid-row:auto;width:min(100%,460px);max-width:460px;padding:30px;border:1px solid #ac99ff8c;border-radius:22px;background:linear-gradient(145deg,#221d3bf5,#0e0c1bf5 75%);box-shadow:0 24px 80px #0008,0 0 80px #7c6fff18;backdrop-filter:blur(20px)}
#lobby .home-hero .home-start{text-align:center;margin-bottom:26px}
#lobby .home-hero .home-start h2{font-size:clamp(24px,3vw,30px);letter-spacing:-1px}
#lobby .home-hero .home-start p{color:#c0b5dc}
.home-signals{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.signal-track{stroke:#9b83ff;stroke-opacity:.15;stroke-width:1}
.home-mobile-signals{display:none}
.signal-pulse{stroke:#ff8bd8;stroke-width:3;stroke-linecap:round;stroke-dasharray:10 90;stroke-dashoffset:10;animation:signal-in 6s linear infinite;animation-delay:var(--delay);filter:drop-shadow(0 0 7px #f45bc4)}
@keyframes signal-in{0%{stroke-dashoffset:6;opacity:0}12%,78%{opacity:.85}100%{stroke-dashoffset:-100;opacity:0}}
.home-orbit{position:absolute;inset:0;z-index:-1;pointer-events:none}
.home-orbit span{position:absolute;display:grid;place-items:center;width:54px;height:54px;border:1px solid #ff8bd845;border-radius:16px;background:#161027;color:#ff8bd8;font-size:25px;box-shadow:0 0 30px #7c6fff10;animation:note-drift 8s ease-in-out infinite}
.home-orbit span:nth-child(1){left:12%;top:20%;transform:rotate(-12deg)}
.home-orbit span:nth-child(2){right:13%;top:24%;animation-delay:-2s;transform:rotate(10deg)}
.home-orbit span:nth-child(3){left:18%;bottom:20%;animation-delay:-4s;transform:rotate(8deg)}
.home-orbit span:nth-child(4){right:17%;bottom:16%;animation-delay:-6s;transform:rotate(-8deg)}
@keyframes note-drift{50%{translate:0 -12px}}
.home-story-wrap{position:relative;z-index:2;flex-shrink:0;width:min(1072px,calc(100% - 48px));margin:20px auto 64px;padding:40px 0;border-top:1px solid #9b83ff30}
#lobby .home-story-wrap .lobby-story{max-width:760px;margin:auto;text-align:center}
#lobby .home-story-wrap .platform-copy{margin-inline:auto}
#lobby .home-story-wrap .home-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;text-align:left;margin:36px 0 30px}
#lobby .home-story-wrap .home-steps li{align-items:flex-start}
#lobby .home-story-wrap .home-learn{display:inline-block}
/* Magenta distinguishes the main room/song actions from secondary violet controls. */
body #lobby #start-room-button,body #lobby #create-room-button,body #room #djbtn,body #room #djbtn-mob{border:1px solid #ffb3e8;background:linear-gradient(115deg,#ff8bd8,#f45bc4 55%,#ff75ce);color:#290d24;box-shadow:0 0 5px 0 #ff83d8cc,0 0 10px 0 #f454c580,inset 0 1px 0 #ffffff55;animation:action-glow 3.6s ease-in-out infinite;transition:filter .2s;font-weight:700}
body #lobby #start-room-button:hover,body #lobby #create-room-button:hover,body #room #djbtn:hover,body #room #djbtn-mob:hover{filter:brightness(1.12)}
/* Matching shadow lists let blur, spread and alpha interpolate continuously. */
@keyframes action-glow{0%,100%{box-shadow:0 0 5px 0 #ff83d8cc,0 0 10px 0 #f454c580,inset 0 1px 0 #ffffff55}50%{box-shadow:0 0 12px 2px #ff83d899,0 0 22px 4px #f454c550,inset 0 1px 0 #ffffff55}}
body #lobby #start-room-button:disabled,body #lobby #create-room-button:disabled,body #room #djbtn:disabled,body #room #djbtn-mob:disabled{animation:none;box-shadow:none;filter:none;opacity:.55;cursor:wait}
@media(max-width:800px){
 #lobby .home-hero{padding:130px 20px 36px;min-height:0;align-content:start}
 .home-signals{display:none}
 .home-mobile-signals{display:block;position:absolute;top:0;left:0;width:100%;height:130px;pointer-events:none;z-index:-1}
 .home-mobile-signals .signal-track{stroke-opacity:.3}
 .home-mobile-signals .signal-pulse{animation-duration:4.8s;stroke-width:2}
 .home-orbit{height:130px}
 .home-orbit span{width:30px;height:30px;font-size:18px;border-radius:10px;animation-duration:5s}
 .home-orbit span:nth-child(1){left:10%;top:18px}
 .home-orbit span:nth-child(2){right:10%;top:18px}
 .home-orbit span:nth-child(3){left:29%;top:65px;bottom:auto}
 .home-orbit span:nth-child(4){right:29%;top:65px;bottom:auto}
 #lobby .home-hero>.lcard{padding:20px;border-radius:18px}
 #lobby .home-hero .home-start{margin-bottom:16px}
 #lobby .home-hero .home-start h2{font-size:23px}
 #lobby .home-hero .linput{margin-bottom:12px}
 #lobby .home-hero .home-field-help{margin-bottom:14px}
 #lobby .home-hero #lobby-identity:empty{display:none}
 .home-story-wrap{width:calc(100% - 36px);margin-bottom:36px}
 #lobby .home-story-wrap .home-steps{grid-template-columns:1fr;max-width:360px;margin-inline:auto}
}
@media(max-width:400px){#lobby .home-hero{padding-inline:18px}#lobby .home-hero>.lcard{padding:18px}#lobby .home-hero .home-start h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){.signal-pulse,.home-orbit span,body #lobby #start-room-button,body #lobby #create-room-button,body #room #djbtn,body #room #djbtn-mob{animation:none;transition:none}.signal-pulse{opacity:.35;stroke-dashoffset:-35}}

/* Repeat the main action accent in small wayfinding details. */
#lobby .home-steps li>span{color:#ff8bd8;border-color:#ff8bd845;background:#f45bc412}
#lobby .home-learn{color:#ff9fdf}
#room .mob-tab.active{color:#ffb3e8;border-bottom-color:#f45bc4}
#room .mob-tab svg{color:#ff8bd8}
#room .cbtn.lg{background:linear-gradient(115deg,#ff8bd8,#f45bc4 55%,#ff75ce);color:#290d24;border-color:#ffb3e8}
#room .cbtn.lg:hover:not(:disabled){background:#ff8bd8;color:#290d24}