:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;background:#0f0d16;color:#f4effb}*{box-sizing:border-box}body{margin:0}main{max-width:680px;margin:auto;padding:28px 20px 60px}.home{padding-top:10vh}.eyebrow{font-size:11px;letter-spacing:2px;color:#c7aff0;font-weight:800}h1{font-size:42px;line-height:1.05;margin:12px 0 18px}h2{font-size:20px}.lead,.muted{color:#aaa0b8;line-height:1.6}.card,.status{background:#1b1724;border:1px solid #342b43;border-radius:18px;padding:18px;margin:20px 0}.button,button{display:inline-block;border:1px solid #49395f;background:#251d31;color:#fff;border-radius:12px;padding:12px 16px;text-decoration:none;font:inherit;cursor:pointer}.primary{background:#c6adff;color:#20142d;border-color:#c6adff;font-weight:700}input{width:100%;background:#100d17;border:1px solid #463754;color:#fff;border-radius:12px;padding:13px;font:inherit;margin:7px 0 10px}form{display:flex;gap:8px}form input{margin:0}.status{display:flex;justify-content:space-between;padding:12px 15px}nav{display:flex;gap:6px;overflow:auto;margin:20px 0}nav button{flex:1;white-space:nowrap}nav .active{background:#c6adff;color:#21152d}.song{display:flex;gap:12px;align-items:center;border-bottom:1px solid #2f2739;padding:14px 0}.song div{flex:1}.song strong,.song small{display:block}.song small{color:#a89caf;margin-top:4px}.controls{display:flex;gap:8px}.controls button{flex:1}.error,.toast{color:#f3b7b7}.toast{position:sticky;bottom:10px;background:#2b2027;padding:10px;border-radius:10px}ol{padding-left:24px}li{padding:8px 0}label{font-size:13px;color:#b9aec5}@media(max-width:480px){h1{font-size:34px}form{display:block}form button{width:100%;margin-top:8px}}

.or{text-align:center;color:#756a80;font-weight:800;letter-spacing:2px;margin:4px 0}.center{text-align:center}.room-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 8px}.room-actions .muted{margin:0}@media(max-width:480px){.room-actions{align-items:stretch;flex-direction:column}.room-actions .button{text-align:center}}
.rooms-card{margin-top:20px}.rooms-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.rooms-heading h2,.rooms-heading p{margin:0}.room-link{display:flex;flex-direction:column;gap:3px;padding:14px 2px;border-top:1px solid #342b43;text-decoration:none;color:#fff}.room-link:first-child{margin-top:14px}.room-link span{font-weight:700}.room-link small{color:#aaa0b8}.room-link:hover span{text-decoration:underline}@media(max-width:480px){.rooms-heading{align-items:flex-start}.room-actions>div{display:flex;gap:8px}.room-actions>div .button{flex:1}}
button.danger{border-color:#b33;background:#421;color:#fff}

/* v1.5.6 guest synchronized playback */
.guest-video{padding:12px;overflow:hidden}.guest-video-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.guest-video-head button{width:auto}.guest-video #guestPlayer,.guest-video iframe{width:100%;aspect-ratio:16/9;min-height:180px;border:0;border-radius:12px;background:#000}.guest-video #syncStatus{margin:.55rem 0 0}.guest-video[hidden]{display:none!important}
.guest-display{min-height:100vh}.guest-display-main{max-width:1500px;margin:0 auto;padding:20px}.guest-display-head,.guest-display-foot{display:flex;align-items:center;justify-content:space-between;gap:16px}.guest-display-head h1{margin:.2rem 0}.guest-display-head button{width:auto;min-width:150px}.guest-stage{padding:14px}.guest-player-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:16px;overflow:hidden}.guest-player-wrap #guestDisplayPlayer,.guest-player-wrap iframe{width:100%;height:100%;border:0}.guest-player-shield{position:absolute;inset:0;z-index:3;background:transparent;cursor:default}.guest-waiting{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;font-size:1.1rem;background:#09090d}.guest-waiting[hidden]{display:none}.guest-song{padding:14px 4px 2px}.guest-song h2{margin:.25rem 0}.guest-song p{margin:.2rem 0}.guest-display-foot{padding:12px 2px;flex-wrap:wrap}.guest-display-foot .button{width:auto}@media(max-width:700px){.guest-display-main{padding:10px}.guest-display-head{align-items:flex-end}.guest-display-head h1{font-size:1.45rem}.guest-display-head button{min-width:120px}.guest-stage{padding:8px}}