[hidden]{display:none!important}
#room-view{padding-bottom:28px}
.room-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 22px}.back-lobby{display:flex;align-items:center;gap:10px;background:none;border:none;color:#91aacb;padding:0;font-size:17px}.back-lobby span{font-size:11px}.room-id{display:flex;align-items:center;gap:15px;color:#7185a4;font-size:9px;letter-spacing:1px}.room-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px;gap:15px}.room-title-row h1{font:600 34px 'Barlow Condensed',sans-serif;letter-spacing:.5px;margin:8px 0}.room-title-row p{display:flex;align-items:center;gap:8px;font-size:10px;color:#8396b3;margin:0}.room-title-row p svg{width:12px;height:12px;color:#b3a1e4}.room-title-row p span{color:#3f536f;margin-inline:3px}.room-format{border:1px solid #3e5579;border-radius:5px;font-size:10px;padding:10px;color:#a5c9f2;letter-spacing:1px}.room-format b{display:block;font-size:6px;font-weight:400;letter-spacing:2px;margin-top:5px;color:#6c86ac}.inside-room-grid{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:22px;align-items:start}.players-panel{min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:8px}.panel-heading h2{font-size:13px;font-weight:500;margin:0;color:#b8c8e0;display:flex;align-items:center;gap:8px}.panel-heading h2>span{color:#7893b7;border:1px solid #2b405f;border-radius:4px;font-size:8px;padding:2px 5px}.panel-heading>span{font-size:7px;color:#7b91b2;letter-spacing:1px}.player-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.player-slot{position:relative;min-height:168px;border:1px solid #354b6d;border-radius:10px;background:radial-gradient(ellipse at top right,#49407420,transparent 70%),linear-gradient(135deg,#142137,#101a2a);padding:15px;overflow:hidden;box-shadow:inset 0 1px #b5cfff08,0 0 16px #719bff08}.player-slot:before{content:'';position:absolute;top:0;left:15%;right:15%;height:1px;background:linear-gradient(90deg,transparent,#6d9dd877,transparent)}.player-slot.is-ready{border-color:#3c807f;box-shadow:inset 0 0 25px #2d887d08,0 0 17px #6bbdad0a}.player-slot.is-ready:before{background:linear-gradient(90deg,transparent,#76e0cb,transparent);box-shadow:0 0 6px #5dd5c755}.slot-top{display:flex;align-items:center;gap:7px;margin-bottom:18px}.slot-index{font-size:7px;letter-spacing:1.6px;color:#6981a4}.host-tag{display:flex;align-items:center;gap:4px;font-size:6px;color:#c4afea;letter-spacing:1px;margin-left:auto}.host-tag svg{height:10px;width:10px}.you-tag{color:#8cbcf1;background:#253c5c;border:1px solid #3b5f87;font-size:6px;padding:2px 4px;border-radius:3px}.slot-identity{display:flex;align-items:center;gap:13px}.large-avatar{position:relative;display:grid;place-items:center;flex-shrink:0;width:52px;height:54px;border-radius:11px;border:1px solid #6087bc;background:linear-gradient(135deg,#36668c,#4e406f);font:600 21px 'Barlow Condensed';color:#d5e9ff;box-shadow:0 0 15px #5499ef13,inset 0 1px #c8ddff22}.avatar-1{background:linear-gradient(135deg,#276668,#2b3d5e);border-color:#4e8a98}.avatar-2{background:linear-gradient(135deg,#69496f,#383c6e);border-color:#8b6baf}.avatar-3{background:linear-gradient(135deg,#826143,#443e66);border-color:#947c9b}.avatar-online{position:absolute;bottom:-3px;right:-3px;width:9px;height:9px;border:2px solid #122036;border-radius:50%;background:#68d4b4}.slot-identity h3{font-size:14px;font-weight:600;letter-spacing:.2px;margin:0 0 5px;overflow-wrap:anywhere}.player-caption{font-size:6px;letter-spacing:1px;color:#637e9f}.player-chart{font-size:7px;color:#819dc1;margin-top:7px;letter-spacing:.8px}.player-chart strong{font-weight:500;color:#c8b4fa;font-size:10px;margin-left:5px}.slot-status{display:flex;align-items:center;gap:6px;border-top:1px solid #2a3c5866;margin-top:17px;padding-top:10px;font-size:7px;letter-spacing:1px;color:#899bb8}.ready-indicator{font-size:12px;color:#8497b5}.slot-status>strong{font-weight:600}.slot-status>span:last-child{margin-left:auto;font-size:6px;letter-spacing:0;color:#5d7396}.is-ready .slot-status{color:#8ad8c3}.is-ready .ready-indicator{color:#7be0bf}.empty-slot{border-style:dashed;border-color:#2a3d58;background:#0d1725;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;box-shadow:none}.empty-slot .slot-index{position:absolute;top:15px;left:15px}.empty-slot .empty-plus{font-size:25px;color:#38577e;font-weight:300}.empty-slot strong{font-size:10px;font-weight:400;color:#7088aa}.empty-slot>span:last-child{font-size:8px;color:#435e7e}.chat-panel{margin-top:23px;border:1px solid #2a3c58;border-radius:10px;background:#0c1523;padding:16px 17px 0}.chat-presence{display:flex;gap:5px;align-items:center}.chat-presence .status-dot{width:4px;height:4px}.chat-log{height:177px;overflow:auto;scrollbar-width:thin;scrollbar-color:#304864 transparent;padding:3px 0 8px;overscroll-behavior:contain}.chat-system{font-size:8px;color:#6381a5;line-height:1.6;text-align:center;margin:4px 0 15px}.chat-message{display:flex;gap:9px;align-items:flex-start;margin:12px 0}.chat-avatar{display:grid;place-items:center;width:25px;height:27px;background:#263951;border:1px solid #3e5778;border-radius:6px;color:#abc5e6;font-size:7px;flex-shrink:0}.chat-message>div{flex:1;min-width:0}.chat-message strong{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:500;color:#adc6e7}.chat-message time{font-size:6px;color:#415d7e;font-weight:400}.chat-message p{font-size:10px;color:#879eba;line-height:1.65;margin:4px 0 0;overflow-wrap:anywhere}.my-message .chat-avatar{background:#353050;border-color:#685b8d}.my-message strong{color:#c2b0ed}.chat-composer{display:flex;align-items:center;gap:10px;border-top:1px solid #243751;padding:12px 0}.chat-composer input{border:none;outline:none;background:none;color:#d5e5fa;min-width:0;flex:1;font-size:10px;padding:7px 0}.chat-composer input::placeholder{color:#506e92}.chat-composer>span{font-size:6px;color:#425e7f;letter-spacing:1px;white-space:nowrap}.chat-composer button{border:1px solid #45678d;border-radius:5px;width:30px;height:29px;background:#203b5a;color:#b9d8ff;display:grid;place-items:center}.chat-composer button svg{height:14px;width:14px}.song-panel{border:1px solid #405376;border-radius:11px;background:radial-gradient(ellipse at top right,#7465ad16,transparent 60%),#111c2e;padding:18px;box-shadow:0 0 22px #555a9d08;min-width:0}.song-panel .panel-heading svg{width:14px;height:14px;color:#7faee5}.room-song-art{position:relative;border:1px solid #3d5473;border-radius:7px;overflow:hidden;height:135px}.room-song-art img{height:100%;width:100%;object-fit:cover}.room-song-art:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101b2fbb,transparent 60%)}.room-song-art>span{position:absolute;bottom:10px;left:11px;z-index:1;font-size:6px;letter-spacing:1.2px;color:#c0d4ed}.room-song-title{font:600 27px 'Barlow Condensed';margin:15px 0 6px;letter-spacing:.4px}.song-artist{font-size:9px;color:#7e94b2;margin:0}.song-specs{display:flex;gap:10px;border-top:1px solid #2d415e;border-bottom:1px solid #2d415e;padding:13px 0;margin:17px 0}.song-specs>span{width:50%;font-size:6px;letter-spacing:1.2px;color:#647fa4}.song-specs strong{display:block;font-size:12px;font-weight:500;color:#b6d4fa;margin-top:6px}.song-specs>span:last-child strong{color:#c3afe9}.change-song-label{display:block;color:#7792b5;font-size:7px;letter-spacing:1px}.change-song-label select{display:block;width:100%;margin-top:9px;padding:10px 8px;border:1px solid #354f72;background:#0b1626;color:#b6cbe8;border-radius:5px;font-size:10px}.host-select-note{font-size:9px;color:#7791b5;line-height:1.7}.ready-progress{margin:22px 0 17px}.ready-progress>div:first-child{display:flex;justify-content:space-between;color:#8fa7c5;font-size:9px}.ready-progress strong{font-weight:500;color:#9bd8c7}.progress-track{height:3px;background:#24324c;border-radius:3px;overflow:hidden;margin-top:10px}.progress-track span{height:100%;display:block;background:linear-gradient(90deg,#62a7e9,#90bfc7);transition:width .3s}.ready-progress p{font-size:8px;color:#6984a8;line-height:1.6;min-height:13px}.ready-big{display:block;width:100%;border:1px solid #5b70a5;border-radius:7px;background:linear-gradient(110deg,#254364,#343357);color:#c7dbfa;font-size:12px;font-weight:600;letter-spacing:1px;padding:13px 8px}.ready-big>span{margin-right:7px}.ready-big small{display:block;font-size:7px;font-weight:400;letter-spacing:0;color:#8aa6c7;margin-top:6px}.ready-big.selected{border-color:#68b4a5;color:#b7f1d9;background:linear-gradient(110deg,#1b4e4a,#24394d)}.ready-big.selected small{color:#7cafaa}.start-big{width:100%;margin-top:11px;display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 8px;border:1px solid #9ccfff;border-radius:6px;background:linear-gradient(110deg,#81c0fb,#969bf0);color:#0d2441;font-size:9px;font-weight:700;letter-spacing:.5px;box-shadow:0 0 20px #719df429}.start-big svg{width:14px;height:14px}.start-big:disabled{border-color:#334c6c;background:#23354f;color:#577292;box-shadow:none;cursor:not-allowed}.ready-big:disabled{opacity:.5;cursor:not-allowed}.host-start-note{font-size:7px;line-height:1.7;color:#5f7b9e;text-align:center;margin:10px 0 0}.room-demo-tools{margin-top:22px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid #22334e;padding-top:14px;font-size:7px;color:#5b769b;letter-spacing:.4px}.room-demo-tools>span:last-child{margin-left:auto;color:#425e82;font-size:7px;letter-spacing:0}.room-demo-tools button{font-size:8px;border:1px solid #304766;background:#111f33;color:#82a1c8;border-radius:4px;padding:6px 9px}#countdown:not(:empty){margin-top:15px;text-align:center;font:600 30px 'Barlow Condensed';color:#b7d8ff;text-shadow:0 0 15px #77aaff66}.room-id .room-state{font-size:6px}.song-panel aside{position:static}
@media(min-width:1600px){.inside-room-grid{grid-template-columns:minmax(0,1fr) 320px}.player-slot{min-height:190px;padding:19px}.large-avatar{height:64px;width:62px}.slot-identity h3{font-size:17px}.chat-log{height:195px}.room-song-art{height:160px}}
@media(max-width:1150px){.inside-room-grid{grid-template-columns:minmax(0,1fr) 245px;gap:16px}.player-slot{padding:12px}.slot-identity{gap:9px}.large-avatar{width:40px;height:45px;font-size:18px}.slot-identity h3{font-size:12px}.slot-status>span:last-child{display:none}.song-panel{padding:15px}.room-title-row h1{font-size:30px}}
@media(max-width:900px){.inside-room-grid{grid-template-columns:minmax(0,1fr)}.song-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;align-items:start}.song-panel>.panel-heading,.song-panel>.room-song-art,.song-panel>.room-song-title,.song-panel>.song-artist,.song-panel>.song-specs{grid-column:1}.song-panel>.change-song-label{grid-column:2;grid-row:2}.song-panel>.host-select-note{grid-column:2;grid-row:2}.song-panel>.ready-progress{grid-column:2;grid-row:3 / span 2;margin-top:15px}.song-panel>.ready-big{grid-column:2;grid-row:5}.song-panel>.start-big{grid-column:2;grid-row:6}.song-panel>.host-start-note{grid-column:2;grid-row:7}.song-panel>#countdown{grid-column:1 / -1}.room-song-art{height:125px}.song-specs{margin-bottom:0}.chat-log{height:140px}.room-title-row h1{font-size:31px}.slot-status>span:last-child{display:block}.large-avatar{width:48px;height:51px}.player-slot{min-height:168px}.slot-identity h3{font-size:14px}.room-format{font-size:8px}.room-title-row p{font-size:9px}.room-demo-tools>span:last-child{margin-left:0;width:100%}}
@media(max-width:540px){.room-heading{gap:12px;margin-bottom:18px}.back-lobby span{font-size:9px}.room-id{font-size:7px;gap:7px}.room-title-row h1{font-size:28px}.room-title-row .eyebrow{font-size:5px}.room-format{display:none}.room-title-row p{font-size:8px;gap:5px}.player-slots{gap:9px}.player-slot{min-height:158px;padding:11px 9px}.slot-top{gap:4px;margin-bottom:14px}.slot-index{font-size:5px;letter-spacing:1px}.host-tag{font-size:5px;gap:2px}.host-tag svg{width:8px;height:8px}.you-tag{font-size:5px}.large-avatar{width:34px;height:39px;border-radius:8px;font-size:15px}.slot-identity{gap:7px}.slot-identity h3{font-size:11px}.player-caption{font-size:5px;letter-spacing:.3px}.player-chart{font-size:5px}.slot-status{font-size:6px;margin-top:18px}.slot-status>span:last-child{display:none}.chat-panel{padding:14px 12px 0}.chat-presence{display:none}.song-panel{display:block;padding:16px}.room-song-art{height:145px}.song-panel>.ready-progress{margin-top:18px}.room-song-title{font-size:29px}.ready-big{font-size:12px}.chat-composer>span{display:none}.empty-slot strong{font-size:8px;text-align:center}.empty-slot>span:last-child{font-size:7px}.panel-heading h2{font-size:12px}.room-title-row{margin-bottom:22px}.room-demo-tools{gap:8px}.room-demo-tools>span:first-child{width:100%}}
/* Compact player slots. Keep room layout and controls unchanged. */
.player-slots{gap:10px}
.player-slot{min-height:118px;padding:11px 12px}
.slot-top{margin-bottom:9px}
.slot-identity{gap:10px}
.large-avatar{width:36px;height:39px;border-radius:8px;font-size:16px}
.slot-identity h3{font-size:12px;margin-bottom:3px}
.player-caption{font-size:6px}
.player-chart{margin-top:4px}
.slot-status{margin-top:9px;padding-top:7px}
.slot-status>span:last-child{display:none}
.empty-slot{gap:4px}
.empty-slot .slot-index{top:11px;left:12px}
.empty-slot .empty-plus{font-size:20px}
.empty-slot strong{font-size:9px}
.empty-slot>span:last-child{font-size:7px}
@media(max-width:540px){.player-slot{min-height:110px;padding:9px}.slot-top{margin-bottom:8px}.large-avatar{width:29px;height:32px;font-size:13px}.slot-identity{gap:7px}.slot-identity h3{font-size:11px}.player-caption{display:none}.slot-status{margin-top:9px}.empty-slot strong{font-size:8px}}
/* Cyberpunk surfaces: neutral at rest, neon only on hover/focus. */
.player-slot,.player-slot.is-ready{
  border-color:#293b55;border-radius:3px;
  background:linear-gradient(120deg,#101c2c,#101522);
  box-shadow:none;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.player-slot:before,.player-slot.is-ready:before{
  top:0;left:12px;right:18px;height:1px;
  background:linear-gradient(90deg,#59c7ff,#aa8bff,transparent);
  box-shadow:none;opacity:0;transition:opacity .2s;
}
.player-slot:after{
  content:'';position:absolute;right:10px;bottom:8px;width:24px;height:4px;
  background:repeating-linear-gradient(120deg,#466080 0 2px,transparent 2px 5px);
  opacity:.45;pointer-events:none;transition:background .2s,opacity .2s;
}
.player-slot:hover,.player-slot.is-ready:hover,.player-slot:focus-within,.player-slot.is-ready:focus-within{
  border-color:#6db8f5;
  background:radial-gradient(ellipse at top right,#9d77dc24,transparent 65%),linear-gradient(120deg,#142b43,#171b31);
  box-shadow:inset 0 0 22px #5aaeff12,inset 0 0 0 1px #839fff24;
}
.player-slot:hover:before,.player-slot.is-ready:hover:before,.player-slot:focus-within:before{opacity:1;box-shadow:0 0 9px #86a8ff}
.player-slot:hover:after,.player-slot:focus-within:after{
  background:repeating-linear-gradient(120deg,#8dbfff 0 2px,transparent 2px 5px);opacity:1;
}
.slot-index,.host-tag,.you-tag,.player-chart,.slot-status>strong{font-family:Consolas,'Courier New',monospace}
.slot-index{color:#7086a3;letter-spacing:1.3px}
.large-avatar{border-radius:3px;border-color:#4a6688;box-shadow:none;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)}
.is-ready .slot-status{color:#86d6c4}
.is-ready .ready-indicator{color:#78dec0;text-shadow:none}
.empty-slot{background:#0b1421;border-style:dashed}
.chat-panel,.song-panel{border-radius:4px;border-color:#2b3e5a;box-shadow:none}
.chat-panel .panel-heading h2,.song-panel>.panel-heading h2{letter-spacing:.5px}
.ready-big,.start-big{border-radius:3px}
@media(prefers-reduced-motion:reduce){.player-slot,.player-slot:before,.player-slot:after{transition:none}}
/* Native-style multiplayer selection room. The approved animated backdrop is retained. */
body.native-room-open:not(.in-game) .online-header{height:58px;padding:9px 25px}.native-room-open .online-header .brand{font-size:21px}.native-room-open .online-header .brand-mark{width:33px;height:33px}.native-room-open .online-header #connection{font-size:9px}.native-room-open .online-header #logout{font-size:7px;padding:7px}.native-room-open .online-main{max-width:none;padding:14px 30px 12px;min-height:calc(100svh - 58px)}.native-room{position:relative;min-height:calc(100svh - 88px);display:flex;flex-direction:column}.native-room[hidden]{display:none}.native-room-top{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:40px}.native-back{border:1px solid #e3abc9;background:linear-gradient(125deg,#9f3868,#321e3d);color:#fff;font:800 italic 20px 'Barlow Condensed';letter-spacing:1px;padding:5px 20px;clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);filter:drop-shadow(0 2px #000)}.native-room-info{font-size:8px;letter-spacing:2px;color:#9abecb}.native-mode{display:grid;grid-template-columns:auto 25px;gap:0 8px;padding:5px 10px;border:1px solid #b9c3c9;background:linear-gradient(#252730,#06080e);border-radius:3px;font:700 17px 'Barlow Condensed';color:#fff}.native-mode b{grid-row:1 / 3;grid-column:2;font-size:29px;color:#ffe075;line-height:1}.native-mode small{font-size:7px;letter-spacing:1px;color:#a3c2cf}.native-player-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:15px 10px 0}.native-player-banner{position:relative;display:flex;align-items:center;gap:10px;height:76px;min-width:0;padding:8px 12px 12px 8px;border:1px solid #8ee7f2;border-bottom-color:#c477c7;border-radius:2px;background:linear-gradient(90deg,#070c15 0%,#080d16ed 50%,#090e1588 100%),url('./lobby-assets/player-banner-reference.png') right center/auto 100% no-repeat;box-shadow:0 2px 8px #0007,inset 0 1px #f7ffff22}.native-player-banner:after{content:'';position:absolute;inset:0;background:url('./lobby-assets/player-banner-frame.png') center/100% 100% no-repeat;pointer-events:none;opacity:.45}.native-player-avatar{display:grid;place-items:center;width:55px;height:55px;flex-shrink:0;background:#0c2339;border:1px solid #7dc2de}.native-player-avatar img{width:100%;height:100%;object-fit:contain}.native-player-details{align-self:flex-start;padding-top:3px;min-width:0;position:relative;z-index:1}.native-player-details h3{font:700 24px/1 'Barlow Condensed';text-transform:uppercase;color:white;text-shadow:2px 2px #000;margin:0 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.8px}.native-player-details>span{font:700 9px 'DM Sans';color:#d0e1e9;letter-spacing:.7px}.native-player-status{position:absolute;bottom:2px;right:4px;display:flex;gap:4px;z-index:1;font:700 italic 9px 'DM Sans'}.native-player-status b,.native-player-status strong{padding:2px 8px;border:1px solid #6d8ea0;background:#040d16d9;clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%)}.native-player-status b{color:#ffe477;border-color:#a49d60}.native-player-status strong{color:#a9bdcc}.is-ready .native-player-status strong{color:#65f4a0;border-color:#28bc7b;text-shadow:0 0 8px #5aff9e55}.native-empty-banner{background:#06101caa;border-style:dashed;box-shadow:none;color:#9aadb9}.native-empty-avatar{height:50px;width:50px;display:grid;place-items:center;border:1px dashed #637680;font-size:24px;color:#7892a3;flex-shrink:0}.native-empty-banner>div{display:flex;flex-direction:column;gap:6px}.native-empty-banner strong{font:700 italic 21px 'Barlow Condensed'}.native-empty-banner span:last-child{font-size:7px;letter-spacing:.8px}.native-room .native-room-name{text-align:center;font:700 italic 20px 'Barlow Condensed';letter-spacing:1.5px;color:#c8f4ff;text-shadow:0 0 10px #6ed8ed33;margin:17px 0 0}.native-room-space{flex:1;min-height:30px;display:grid;place-items:center;position:relative;pointer-events:none}.native-room-space img{position:absolute;width:140px;height:140px;opacity:.035;transform:rotate(-10deg);filter:grayscale(1)}.native-song-selection{position:relative;margin-top:auto}.native-song-selection>h2{font:700 33px 'Barlow Condensed';text-align:center;color:#fff;margin:5px 0;text-shadow:2px 3px #000}.native-song-selection>p#native-song-meta{font-size:12px;font-weight:600;letter-spacing:1px;color:#b1e4e8;text-align:center;margin:5px 0 15px}.native-difficulty-strip{display:flex;align-items:center;justify-content:center;gap:20px;min-height:45px;width:78%;margin:0 auto 10px;border-block:2px solid #b8d6e2;background:linear-gradient(#102b35cc,#040b12e8);clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);box-shadow:inset 0 -2px #c796d0}.native-difficulty-strip>span{font-size:8px;letter-spacing:2px;color:#9fbdc8}.native-difficulty-strip strong{font:700 36px 'Barlow Condensed';color:#ffe9d6;text-shadow:0 0 10px #ff6617,1px 2px #7b1a0a}.native-difficulty-strip small{font-size:7px;color:#90c9b8;letter-spacing:.7px}.native-carousel{position:relative;display:flex;align-items:center;gap:10px;outline:none}.native-wheel-window{height:206px;position:relative;flex:1;overflow:hidden;--wheel-step:clamp(85px,11vw,185px);perspective:900px}.native-selected-jacket{position:absolute;left:50%;top:3px;transform:translateX(-50%);width:285px;height:190px;z-index:5;border:2px solid #f2c99e;background:#070e17;box-shadow:0 0 16px #ef863c33,0 5px 8px #0009;-webkit-box-reflect:below 3px linear-gradient(transparent 55%,#ffffff15);overflow:hidden}.native-selected-jacket>img{width:100%;height:100%;object-fit:cover}.native-selected-jacket>span{position:absolute;top:0;left:0;right:0;background:#05101a9c;text-align:center;font-size:9px;font-weight:700;letter-spacing:2px;color:#fff;padding:5px;pointer-events:none}.native-wheel-card{position:absolute;left:50%;top:50px;width:185px;height:123px;z-index:var(--depth);transform:translateX(calc(-50% + var(--offset)*var(--wheel-step))) rotateY(calc(var(--offset)*-7deg));padding:0;border:1px solid #82b2c7;background:#081522;overflow:hidden;box-shadow:0 5px 14px #0008;transition:filter .2s,border-color .2s;-webkit-box-reflect:below 4px linear-gradient(transparent 65%,#ffffff10)}.native-wheel-card img{display:block;width:100%;height:100%;object-fit:cover}.native-wheel-card>span{position:absolute;bottom:0;left:0;right:0;padding:5px 3px;background:#030811b0;color:#e0f0f7;font-size:8px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.native-wheel-card:hover:enabled{border-color:#fff0c9;filter:brightness(1.2)}.native-wheel-card:disabled{cursor:default}.native-song-arrow{font:800 42px 'Barlow Condensed';color:#e1f8ff;background:linear-gradient(140deg,#c62c5d,#3a132f);border:2px solid #efa1b8;border-radius:3px;width:53px;height:82px;flex-shrink:0;clip-path:polygon(25% 0,100% 0,75% 100%,0 100%);text-shadow:0 0 10px #fc5a7c;box-shadow:0 0 15px #db346522}.native-song-arrow:last-of-type{background:linear-gradient(140deg,#1083b5,#052c60);border-color:#99dfff;text-shadow:0 0 10px #41c3ff}.native-song-arrow:disabled{opacity:.35;cursor:not-allowed}.native-song-arrow:hover:enabled{filter:brightness(1.25)}.native-host-hint{text-align:center;font-size:8px;color:#88b5c3;margin:0 0 8px;min-height:13px}.native-room-bottom{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:20px;align-items:center;min-height:78px;padding:0 10px}.native-room-bottom>#chat-toggle{justify-self:start;border:1px solid #d1e7ee;border-radius:5px;background:linear-gradient(#183c50,#060e1c);box-shadow:0 0 8px #2a7bc333;color:#e7fbff;font:700 18px 'Barlow Condensed';padding:10px 20px;letter-spacing:1px}.native-room-bottom>#chat-toggle span{border-radius:50%;background:#b82b59;font-size:10px;padding:2px 5px;margin-left:8px}.native-ready-area{display:flex;align-items:center;justify-content:center;gap:15px;min-width:0}.native-ready-area>#ready-count{font-size:8px;color:#89b4c1;white-space:nowrap}.native-ready-area #ready.quick-ready{width:210px;min-height:75px;display:grid;grid-template-columns:56px 1fr;grid-template-rows:14px 36px 13px;column-gap:10px;padding:5px 6px;background:none!important;border:0!important;border-radius:0!important;clip-path:none;filter:drop-shadow(0 2px 3px #0008);box-shadow:none!important;cursor:pointer}.native-ready-area .pump-ready-step{grid-column:1;grid-row:1 / 4;width:56px;height:56px;margin:0}.native-ready-area .pump-ready-prompt{grid-column:2;grid-row:1;font-size:8px}.native-ready-area .pump-ready-logo{grid-column:2;grid-row:2;width:125px;height:39px}.native-ready-area .pump-ready-hint{grid-column:2;grid-row:3;font-size:5px;margin:0}.native-start-area{min-width:0;justify-self:end;text-align:center}.native-start-area #start-game{margin:0;border-radius:4px!important;background:linear-gradient(#264253,#070d15);border:1px solid #a6bac2;color:#d5e4e8;font:700 italic 18px 'Barlow Condensed';box-shadow:inset 0 1px #fff3;padding:11px 17px;white-space:nowrap}.native-start-area #start-game:enabled{color:#ffe89c;border-color:#ffdf7c;background:linear-gradient(#80641a,#3c2d12);text-shadow:0 0 10px #ffc44e55}.native-start-area #start-game:disabled{opacity:.5}.native-start-area .host-start-note{max-width:270px;font-size:6px;line-height:1.4;margin:6px 0 0;color:#6e939e}.native-chat-drawer{position:absolute;bottom:80px;left:10px;z-index:12;width:min(370px,calc(100% - 20px));padding:17px;background:#071724f5;backdrop-filter:blur(14px);border:1px solid #8ac3d6;border-bottom-color:#c68bca;border-radius:5px;box-shadow:0 15px 60px #000b}.native-chat-drawer[hidden]{display:none}.native-chat-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #375e72;padding-bottom:10px;margin-bottom:10px}.native-chat-heading h2{font:700 17px 'Barlow Condensed';letter-spacing:1px;margin:0}.native-chat-heading button{background:none;border:0;font-size:24px;color:#c6e5f3}.native-chat-drawer .chat-log{height:210px}.native-chat-drawer .chat-composer{padding:10px 0 0}.native-room-open #feedback{position:fixed;left:50%;transform:translateX(-50%);bottom:100px;z-index:15;background:#181422db;padding:8px 15px;font-size:11px;border-radius:5px;max-width:80%;text-align:center}.native-room-open #feedback:empty{display:none}
@media(min-height:950px) and (min-width:1000px){.native-wheel-window{height:260px}.native-selected-jacket{width:350px;height:233px}.native-wheel-card{top:65px;width:210px;height:140px}.native-song-selection>h2{font-size:40px}.native-room-space{min-height:100px}.native-player-banner{height:83px}.native-room-bottom{min-height:95px}}
@media(max-width:1100px){.native-room-open .online-main{padding-inline:16px}.native-player-row{gap:8px;margin-inline:0}.native-player-banner{gap:7px;padding:6px;height:68px}.native-player-avatar{width:42px;height:48px}.native-player-details h3{font-size:20px}.native-player-status{font-size:7px}.native-player-status b,.native-player-status strong{padding:1px 5px}.native-player-details>span{font-size:7px}.native-room-bottom{gap:10px;padding-inline:0}.native-start-area #start-game{font-size:15px;padding:10px}.native-ready-area{gap:7px}.native-room-space{min-height:25px}}
@media(max-width:700px){.native-room-open .online-header #identity,.native-room-open .online-header #connection{display:none}.native-player-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.native-room{min-height:calc(100svh - 90px)}.native-room-space{min-height:35px}.native-room-name{font-size:16px!important}.native-song-selection>h2{font-size:27px}.native-song-selection>p#native-song-meta{font-size:9px}.native-difficulty-strip{width:100%;gap:10px}.native-difficulty-strip small{font-size:5px}.native-wheel-window{height:173px;--wheel-step:105px}.native-selected-jacket{width:220px;height:147px}.native-wheel-card{width:145px;height:97px;top:31px}.native-song-arrow{width:32px;height:65px;font-size:29px}.native-carousel{gap:3px}.native-room-bottom{grid-template-columns:1fr 1fr;gap:12px}.native-ready-area{grid-column:1 / -1;grid-row:1}.native-room-bottom>#chat-toggle{grid-column:1;grid-row:2;font-size:16px;padding:9px 15px}.native-start-area{grid-column:2;grid-row:2}.native-start-area .host-start-note{max-width:180px}.native-chat-drawer{bottom:65px}.native-room-open .online-main{padding-inline:10px}.native-room-info{font-size:6px}.native-mode{font-size:13px}.native-back{font-size:17px}}
.native-player-banner:not(.native-empty-banner){background:linear-gradient(90deg,#060c16,#0b1522)}.native-player-banner:not(.native-empty-banner):before{content:'';position:absolute;right:0;top:0;bottom:0;width:45%;background:linear-gradient(90deg,#0b1522,transparent 45%),url('./lobby-assets/player-banner-reference.png') right center/auto 100% no-repeat;pointer-events:none}.native-player-status{z-index:2}
/* The center step starts the song; READY remains a separate action. */
.native-start-area{grid-column:2;grid-row:1;justify-self:center}.native-ready-area{grid-column:3;grid-row:1;justify-self:end}.native-ready-area .pump-ready-step{display:none}.native-ready-area #ready.quick-ready{width:145px;grid-template-columns:1fr}.native-ready-area .pump-ready-prompt,.native-ready-area .pump-ready-logo,.native-ready-area .pump-ready-hint{grid-column:1}.native-start-area #start-game{display:flex;flex-direction:column;align-items:center;gap:0;padding:0 20px;border:0!important;background:none!important;box-shadow:none!important;font-size:19px;color:#ffed97;text-shadow:0 2px 3px #000}.native-start-area #start-game[hidden]{display:none}.pump-start-step{display:block;width:65px;height:65px;background:url('./lobby-assets/pump-xsanity-center.png') 0 0/600% 100% no-repeat;filter:drop-shadow(0 0 7px #ffe65166);transition:transform .2s,filter .2s}.native-start-area #start-game:hover:enabled .pump-start-step{transform:scale(1.1);filter:drop-shadow(0 0 12px #ffe651)}.native-start-area #start-game:disabled{opacity:.45}.native-start-area .host-start-note{margin-top:4px}@media(max-width:700px){.native-start-area{grid-column:1 / -1;grid-row:1}.native-ready-area{grid-column:2;grid-row:2}.native-ready-area>#ready-count{display:none}}
/* Native Pump sprites replace the rectangular carousel controls. */
.native-carousel .native-song-arrow{position:relative;display:grid;place-items:center;width:82px;height:88px;padding:0;border:0;background:none!important;border-radius:0;clip-path:none;box-shadow:none;text-shadow:none;font-size:0;overflow:visible;cursor:pointer}.native-carousel .native-song-arrow:before{content:'';display:block;width:68px;height:68px;background:url('./lobby-assets/pump-xsanity-up.png') 0 0/600% 100% no-repeat;transform:rotate(-45deg);filter:drop-shadow(0 2px 3px #0009);transition:transform .18s,filter .18s}.native-carousel #song-next:before{background-image:url('./lobby-assets/pump-xsanity-down.png');transform:rotate(-135deg)}.native-carousel .native-song-arrow:hover:enabled{filter:none}.native-carousel #song-prev:hover:enabled:before{transform:rotate(-45deg) scale(1.1);filter:drop-shadow(0 0 10px #ff537b)}.native-carousel #song-next:hover:enabled:before{transform:rotate(-135deg) scale(1.1);filter:drop-shadow(0 0 10px #28bcff)}.native-carousel .native-song-arrow:focus-visible{outline:2px solid #d9f5ff;outline-offset:2px}.native-carousel .native-song-arrow:active:enabled:before{scale:.94}@media(max-width:700px){.native-carousel .native-song-arrow{width:44px;height:68px}.native-carousel .native-song-arrow:before{width:40px;height:40px}}@media(prefers-reduced-motion:reduce){.native-carousel .native-song-arrow:before{transition:none}}
/* Continuous song wheel with a fixed, high-contrast selection frame. */
.native-wheel-card.wheel-selected{top:3px;width:285px;height:190px;z-index:5;transform:translateX(-50%);border-color:transparent}.native-wheel-card.wheel-selected>span{display:none}.native-selected-jacket{pointer-events:none;overflow:visible;background:transparent;border:3px solid #ff22d0;outline:1px solid #ffe4fb;outline-offset:1px;box-shadow:0 0 5px #fff0fc,inset 0 0 8px #ff22d0,0 0 16px #ff00c8,0 0 30px #ff00b866;z-index:6}.native-selected-jacket>img{visibility:hidden}.native-wheel-window{overflow:visible;clip-path:inset(-22px 0 -30px)}@media(min-height:950px) and (min-width:1000px){.native-wheel-card.wheel-selected{width:350px;height:233px}}@media(max-width:700px){.native-wheel-card.wheel-selected{width:220px;height:147px}}
.native-difficulty-strip:has(.native-level-picker:not([hidden])){flex-wrap:wrap;padding:8px 15px;overflow:visible;clip-path:none}.native-level-picker{display:flex;align-items:center;justify-content:center;gap:12px}.native-level-picker[hidden]{display:none}.native-level-picker small{font-size:8px;color:#bce7ef;max-width:135px}.native-level-picker button{font:700 30px 'Barlow Condensed';padding:4px 13px;color:#ffdbd2;background:#231b2f;border:2px solid #865574;border-radius:5px}.native-level-picker button[aria-pressed=true]{color:white;border-color:#ff35d5;box-shadow:0 0 12px #ff00bdaa;text-shadow:0 0 8px #ff2bcf}
.native-level-picker button[data-back-songs]{font-size:15px;color:#a5eaff;border-color:#66b8dc;background:#0a2338}.native-level-picker button[data-back-songs] small{display:block;font:700 9px 'DM Sans';margin-top:3px;color:#d0efff}
/* Two player banners per side, with the room chat always visible between them. */
.native-social-panel{display:grid;grid-template-columns:minmax(220px,1fr) minmax(320px,1.5fr) minmax(220px,1fr);grid-template-rows:repeat(2,minmax(76px,1fr));gap:14px 24px;margin:16px 10px 0;align-items:center}.native-social-panel .native-player-row{display:contents}.native-social-panel .native-player-banner:nth-child(1){grid-column:1;grid-row:1}.native-social-panel .native-player-banner:nth-child(2){grid-column:1;grid-row:2}.native-social-panel .native-player-banner:nth-child(3){grid-column:3;grid-row:1}.native-social-panel .native-player-banner:nth-child(4){grid-column:3;grid-row:2}.native-social-panel .native-chat-drawer{position:relative;inset:auto;grid-column:2;grid-row:1 / 3;width:100%;min-width:0;box-sizing:border-box;padding:13px 17px;background:#04121ec9;border:1px solid #76c6df77;border-bottom-color:#e06eb999;border-radius:5px;box-shadow:0 3px 18px #0004;z-index:1}.native-social-panel .native-chat-heading{padding-bottom:6px;margin-bottom:6px}.native-social-panel .chat-log{height:110px;min-height:0}.native-social-panel .chat-composer{padding-top:6px}.native-social-panel .chat-composer input{min-width:0}.native-social-panel #chat-close{display:none}.native-room .native-room-name{margin-top:6px}.native-room-space{min-height:16px}@media(min-height:950px) and (min-width:1000px){.native-social-panel .chat-log{height:140px}}@media(max-width:1000px){.native-social-panel{grid-template-columns:minmax(155px,1fr) minmax(250px,1.4fr) minmax(155px,1fr);gap:10px;margin-inline:0}.native-social-panel .native-player-details h3{font-size:18px}}@media(max-width:700px){.native-social-panel{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;gap:8px}.native-social-panel .native-player-banner:nth-child(1){grid-column:1;grid-row:1}.native-social-panel .native-player-banner:nth-child(2){grid-column:1;grid-row:3}.native-social-panel .native-player-banner:nth-child(3){grid-column:2;grid-row:1}.native-social-panel .native-player-banner:nth-child(4){grid-column:2;grid-row:3}.native-social-panel .native-chat-drawer{grid-column:1 / -1;grid-row:2}.native-social-panel .chat-log{height:100px}}
/* Larger song jackets and selection controls. */
.native-wheel-window{height:254px;--wheel-step:clamp(110px,12vw,215px)}.native-wheel-card{width:230px;height:153px;top:53px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:350px;height:233px;top:3px}.native-carousel .native-song-arrow{width:100px;height:108px}.native-carousel .native-song-arrow:before{width:82px;height:82px}.native-wheel-card>span{font-size:10px;padding:6px}.native-selected-jacket>span{font-size:11px}@media(min-height:950px) and (min-width:1000px){.native-wheel-window{height:296px;--wheel-step:clamp(130px,13vw,240px)}.native-selected-jacket,.native-wheel-card.wheel-selected{width:410px;height:273px}.native-wheel-card{width:260px;height:173px;top:57px}}@media(max-width:700px){.native-wheel-window{height:195px;--wheel-step:120px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:260px;height:173px;top:3px}.native-wheel-card{width:170px;height:113px;top:34px}.native-carousel .native-song-arrow{width:48px;height:76px}.native-carousel .native-song-arrow:before{width:44px;height:44px}.native-wheel-card>span{font-size:8px}}
@media(min-width:701px) and (max-height:949px){.native-social-panel{margin-top:10px;grid-template-rows:repeat(2,minmax(64px,1fr));row-gap:8px}.native-social-panel .native-player-banner{height:64px}.native-social-panel .chat-log{height:76px}.native-social-panel .native-chat-drawer{padding-block:10px}.native-room-space{min-height:6px}.native-song-selection>p#native-song-meta{margin-bottom:10px}}
/* Let the central chat fill the free space above the song title. */
@media(min-width:701px){.native-social-panel{flex:1;align-items:stretch;margin-bottom:20px;min-height:180px}.native-social-panel .native-player-banner{align-self:center}.native-social-panel .native-chat-drawer{display:flex;flex-direction:column;align-self:stretch}.native-social-panel .chat-log{flex:1;height:auto;min-height:76px}.native-social-panel .native-chat-heading,.native-social-panel .chat-composer{flex-shrink:0}.native-room-space{display:none}.native-song-selection{margin-top:0}}
/* Keep each sender and message on the same chat line. */
.native-social-panel .chat-message{display:block;padding:4px 0;line-height:1.5;overflow-wrap:anywhere}.native-social-panel .chat-message>b{display:inline;margin:0 6px 0 0;font-size:11px}.native-social-panel .chat-message>b:after{content:':'}.native-social-panel .chat-message>p{display:inline;margin:0;font-size:11px;white-space:pre-wrap}
/* Pump arrow for sending a room message. */
.native-social-panel .chat-composer button{display:grid;place-items:center;flex:0 0 42px;width:42px;height:40px;padding:0;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;font-size:0;text-shadow:none;overflow:visible;cursor:pointer}.native-social-panel .chat-composer button:before{content:'';display:block;width:32px;height:32px;background:url('./lobby-assets/pump-xsanity-up.png') 0 0/600% 100% no-repeat;transform:rotate(135deg);filter:hue-rotate(320deg) saturate(1.65) drop-shadow(0 0 4px #ff28cd88);transition:transform .18s,filter .18s}.native-social-panel .chat-composer button:hover:before{transform:rotate(135deg) scale(1.13);filter:hue-rotate(320deg) saturate(1.8) brightness(1.2) drop-shadow(0 0 8px #ff28cd)}.native-social-panel .chat-composer button:focus-visible{outline:2px solid #ff64de;outline-offset:2px}.native-social-panel .chat-composer button:active:before{scale:.92}@media(prefers-reduced-motion:reduce){.native-social-panel .chat-composer button:before{transition:none}}
/* Compact consecutive chat messages. */
.native-social-panel .chat-log{display:block;gap:0}.native-social-panel .chat-message{margin:0;padding:1px 0;min-height:0;line-height:1.35}.native-social-panel .chat-message+ .chat-message{margin-top:1px}.native-social-panel .chat-message>b,.native-social-panel .chat-message>p{line-height:inherit}
/* Room chat is always visible, so its former drawer toggle is redundant. */
.native-room-bottom>#chat-toggle{display:none}
/* Approved arcade reference: black chrome, neon edges and reflective jackets. */
body.native-room-open:not(.in-game){background:#020203;color:#f5f8fc}
body.native-room-open:not(.in-game) .online-header{display:none}
.native-room-open:not(.in-game) .login-backdrop{display:none}
body.native-room-open:not(.in-game):before{background:none!important}
body.native-room-open:not(.in-game):after{background:none!important}
.native-room-open .online-main{padding:10px 24px 12px;min-height:100svh;box-sizing:border-box;background:none}
.native-room{min-height:calc(100svh - 22px);isolation:isolate;gap:0}
.approved-room-art{position:fixed;inset:0;z-index:-2;pointer-events:none;background:#000;opacity:.85}
.approved-room-art svg{display:block;width:100%;height:100%;opacity:.8}
.native-room:after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(133deg,#ffffff04 0 1px,transparent 1px 5px),linear-gradient(#0009,transparent 45%,#0007)}
.native-room-top{min-height:52px;align-items:flex-start}
.native-back{font:900 italic 29px 'Arial Black',sans-serif;letter-spacing:-1px;color:white;padding:5px 18px 6px 38px;background:linear-gradient(130deg,#fe397d 0%,#380c21 40%,#170c13 62%,#f94f8c 100%);border:2px solid #ff90bb;clip-path:polygon(12% 0,100% 0,93% 50%,100% 100%,12% 100%,0 50%);text-shadow:2px 3px #000,-1px -1px #000;filter:drop-shadow(0 0 3px #ff228b66)}
.native-back:before{content:'❮';position:absolute;left:9px;top:4px;font-size:35px;color:#ff9bc2;text-shadow:0 0 7px #ff3b99}
.native-room-info{font-size:8px;padding-top:15px;color:#6f737e;letter-spacing:3px}
.native-mode{display:grid;grid-template-columns:auto 65px;align-items:center;gap:0 10px;font:900 23px 'Arial Black',sans-serif;border:0;background:none;text-shadow:2px 2px #000;transform:skew(4deg)}
.native-mode b{color:#ffe617;font:900 italic 40px/1 'Arial Black';text-shadow:0 0 8px #ff4d00,2px 2px #8b2b00;border:1px solid #a08c6670;padding:0 9px}
.native-mode small{color:#ffcf43;font:900 italic 9px 'Arial Black';text-align:center;grid-column:2;letter-spacing:0}
.native-room .native-room-name{font:900 italic 20px 'Arial Black',sans-serif;letter-spacing:1px;margin:1px 0 10px;background:linear-gradient(90deg,#4adaff 40%,#f26bdb 60%);background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 4px #bd3cc155)}
.native-room-name:before,.native-room-name:after{content:'━';margin:0 20px;-webkit-text-fill-color:#63cfff;text-shadow:0 0 6px #3abfff}
.native-room-name:after{-webkit-text-fill-color:#fb77db}
.native-social-panel{grid-template-columns:minmax(250px,1fr) minmax(330px,1.6fr) minmax(250px,1fr);grid-template-rows:repeat(2,minmax(76px,1fr));gap:16px 24px;margin:4px 16px 18px;min-height:190px;flex:1}
.native-social-panel .native-player-banner{height:82px;box-sizing:border-box;padding:6px 8px;gap:13px;border-radius:2px;border:2px solid transparent;border-image:linear-gradient(#14e6ff 15%,#569dff 50%,#ff1bd3) 1;background:#050509!important;box-shadow:inset 0 0 14px #000,0 0 8px #119dff16;overflow:hidden}
.native-player-banner:not(.native-empty-banner):before{width:56%;opacity:1;background-image:linear-gradient(90deg,#050509,transparent 38%),url('./lobby-assets/approved-room-reference.png');background-size:100% 100%,auto 1775.47%;background-position:center,17.37% 10.7%;background-repeat:no-repeat}
.native-player-banner:nth-child(2):before{background-position:center,43.82% 10.7%}
.native-player-banner:nth-child(3):before{background-position:center,70.14% 10.7%}
.native-player-banner:nth-child(4):before{background-position:center,43.82% 10.7%}
.native-player-banner:after{background:none;box-shadow:inset 0 1px #ffffff44;opacity:1}
.native-player-avatar{position:relative;width:66px;height:66px;flex:0 0 66px;background:#080d20;border:1px solid #6fc7ff;z-index:1;overflow:hidden}
.native-player-avatar:before{content:'';position:absolute;inset:0;background:url('./lobby-assets/approved-room-reference.png') 3% 10.7%/2533.33% 1425.76% no-repeat}
.native-player-banner:nth-child(2) .native-player-avatar:before{background-position:28.6% 10.7%}
.native-player-banner:nth-child(3) .native-player-avatar:before{background-position:53.2% 10.7%}
.native-player-banner:nth-child(4) .native-player-avatar:before{background-position:28.6% 10.7%}
.native-player-avatar img{visibility:hidden}
.native-player-details{padding-top:3px;max-width:calc(100% - 75px)}
.native-player-details h3{font:900 22px/1.1 'Arial Black',sans-serif;text-shadow:2px 3px #000,0 0 4px #000;letter-spacing:.2px;margin-bottom:5px}
.native-player-details>span{font:800 12px 'Arial Black',sans-serif;letter-spacing:.4px;color:#e0e3ef;text-shadow:2px 2px #000}
.native-player-status{bottom:0;right:0;gap:0;font:900 italic 13px 'Arial Black'}
.native-player-status b,.native-player-status strong{background:#04050a;border:1px solid #6a78a8;clip-path:polygon(7px 0,100% 0,100% 100%,0 100%);padding:1px 12px;color:#b9d4ef;line-height:1.1}
.native-player-status b{color:#ffe700;border-color:#818344;min-width:50px;text-align:center}
.is-ready .native-player-status strong{color:#00ff83;border-color:#00ff77;box-shadow:inset 0 0 5px #00d95c66;text-shadow:0 0 6px #00ff5d}
.native-social-panel .native-empty-banner{border-image:linear-gradient(#4fb6cf,#b824b4) 1;background:#05050799!important}
.native-empty-banner:before{display:none}
.native-empty-avatar{height:60px;width:60px;border:1px dashed #aeb6c2;color:#697481;font-size:26px}
.native-empty-banner strong{font:800 italic 24px 'Arial Black';color:#c4c5cb;text-shadow:2px 2px #000}
.native-empty-banner span:last-child{font:800 italic 10px 'Arial Black';color:#b3bac9}
.native-social-panel .native-chat-drawer{border-radius:2px;border:1px solid #56c9f288;border-bottom-color:#fa23ca99;background:linear-gradient(135deg,#030509ec,#060810cc);box-shadow:inset 0 0 15px #000,0 0 8px #4acbff0c;padding:12px 17px}
.native-chat-heading h2{font:800 italic 15px 'Arial Black';color:#dcebf7;letter-spacing:1px}
.native-social-panel .native-chat-heading{border-color:#4c688344}
.native-social-panel .chat-composer{border-color:#58627b55}
.native-social-panel .chat-message>b,.native-social-panel .chat-message>p{font-size:12px}
.native-song-selection>h2{font:900 clamp(26px,3vw,43px)/1.1 'Arial Black',sans-serif;text-shadow:2px 3px #000,0 0 8px #000;margin:3px 0 6px;letter-spacing:.5px}
.native-song-selection>p#native-song-meta{font:700 18px 'Arial Black',sans-serif;color:#f7f1db;margin:0 0 12px;text-shadow:1px 2px #000}
.native-difficulty-strip{width:72%;min-height:54px;border-block:2px solid #e5edf4;background:linear-gradient(#05202a,#01080c 45%,#010506 85%,#2b122a);box-shadow:inset 0 -2px #ffa7f3;gap:22px;margin-bottom:14px}
.native-difficulty-strip strong{font:900 italic 42px/1 'Arial Black';color:#fff5e3;text-shadow:0 0 4px #ff3b00,0 0 13px #ff3200,2px 2px #621900}
.native-difficulty-strip>span{font:800 12px 'Arial Black';color:#9caec1}
.native-difficulty-strip small{font-size:8px;color:#afb3bd}
.native-level-picker button{font-family:'Arial Black';font-size:29px;border-radius:0;transform:skew(-10deg);background:linear-gradient(120deg,#5a1217,#160609);border-color:#df293e}
.native-level-picker button[aria-pressed=true]{color:#fff2d4;border-color:#ffb139;box-shadow:0 0 14px #ff5e0088;text-shadow:0 0 8px #ff2b00}
.native-wheel-window{height:255px;--wheel-step:clamp(130px,12vw,220px);clip-path:inset(-25px 0 -42px)}
.native-wheel-card{width:220px;height:147px;top:64px;border:1px solid #f0e9ed;box-shadow:0 4px 10px #000;-webkit-box-reflect:below 4px linear-gradient(transparent 35%,#ffffff32);transform:translateX(calc(-50% + var(--offset)*var(--wheel-step))) rotateY(calc(var(--offset)*-6deg))}
.native-wheel-card>span{font:700 10px 'Arial Black';background:#0009;padding:5px 2px}
.native-selected-jacket,.native-wheel-card.wheel-selected{width:365px;height:243px;top:2px}
.native-selected-jacket{border:2px solid #ffc24b;outline:1px solid #fff0e1;box-shadow:0 0 8px #ffb51d66,0 0 17px #ff22b644}
.native-wheel-card.wheel-selected{transform:translateX(-50%);border-color:#f6d1ad}
.native-selected-jacket>span{font:800 10px 'Arial Black';background:linear-gradient(#000b,transparent);letter-spacing:2px}
.native-carousel .native-song-arrow{width:105px;height:120px}
.native-carousel .native-song-arrow:before{width:88px;height:88px;filter:drop-shadow(0 0 4px #ff3b50)}
.native-carousel #song-next:before{filter:drop-shadow(0 0 4px #00baff)}
.native-host-hint{font-size:8px;margin-top:5px;color:#777d8d}
.native-room-bottom{grid-template-columns:1fr minmax(300px,1.5fr) 1fr;min-height:91px;position:relative;padding-top:0}
.native-start-area{width:100%;align-self:end}
.native-start-area #start-game{position:relative;display:flex;flex-direction:column;justify-content:center;width:100%;height:83px;padding:9px 25px!important;border:2px solid #d9c485!important;border-radius:0!important;background:linear-gradient(130deg,#5d400a,#080807 27%,#050505 70%,#b87d06)!important;box-shadow:inset 0 0 0 5px #141718,inset 0 0 0 7px #ffc82a88,0 0 10px #ffb41966!important;clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);font:900 italic 29px 'Arial Black';color:#fff4dc;text-shadow:0 0 6px #ff5a00,2px 3px #812200}
.native-start-area #start-game:before,.native-start-area #start-game:after{content:'❮❮';position:absolute;left:10%;top:22px;color:#ffdf00;font:900 28px 'Arial Black';text-shadow:0 0 8px #ff9800}
.native-start-area #start-game:after{left:auto;right:10%;content:'❯❯'}
.native-start-area .pump-start-step{position:absolute;width:50px;height:50px;top:-22px;left:calc(50% - 25px);opacity:.3}
.native-start-area .host-start-note{font-size:7px;max-width:none;margin:4px 0 0;color:#7b7c83}
.native-ready-area{align-self:end;justify-self:end;gap:10px;padding-bottom:5px}
.native-ready-area #ready.quick-ready{border:1px solid #7c878e!important;clip-path:polygon(5% 0,100% 0,95% 100%,0 100%);width:200px;min-height:65px;background:linear-gradient(#242729cc,#09090acc)!important;box-shadow:inset 0 0 7px #ffffff11!important;grid-template-rows:12px 32px 12px;padding:4px 15px}
.native-ready-area #ready.selected{border-color:#00df79!important;box-shadow:0 0 8px #00d67c44!important}
.native-ready-area .pump-ready-logo{width:145px;height:36px;justify-self:center}
.native-ready-area .pump-ready-prompt,.native-ready-area .pump-ready-hint{text-align:center}
@media(min-width:1000px) and (min-height:950px){.native-wheel-window{height:296px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:425px;height:283px}.native-wheel-card{width:250px;height:167px;top:65px}.native-social-panel{min-height:240px}.native-social-panel .native-player-banner{height:88px}}
@media(min-width:701px) and (max-height:800px){.native-social-panel{min-height:160px;grid-template-rows:repeat(2,minmax(64px,1fr));gap:8px 18px;margin-bottom:10px}.native-social-panel .native-player-banner{height:68px}.native-player-avatar{height:54px;width:54px;flex-basis:54px}.native-player-details h3{font-size:18px}.native-player-details>span{font-size:10px}.native-social-panel .chat-log{min-height:54px}.native-song-selection>h2{font-size:29px}.native-song-selection>p#native-song-meta{font-size:14px}.native-wheel-window{height:221px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:320px;height:213px}.native-wheel-card{width:205px;height:137px;top:43px}.native-room-bottom{min-height:80px}.native-start-area #start-game{height:70px;font-size:23px}.native-start-area #start-game:before,.native-start-area #start-game:after{font-size:22px;top:20px}}
@media(max-width:1000px){.native-social-panel{grid-template-columns:minmax(175px,1fr) minmax(260px,1.4fr) minmax(175px,1fr);margin-inline:0;gap:10px}.native-player-details h3{font-size:17px}.native-player-avatar{width:52px;height:60px;flex-basis:52px}.native-room-open .online-main{padding-inline:14px}.native-start-area #start-game{font-size:23px}.native-ready-area #ready.quick-ready{width:155px}.native-song-selection>p#native-song-meta{font-size:14px}}
@media(max-width:700px){.native-room{min-height:calc(100svh - 22px)}.native-social-panel{grid-template-columns:1fr 1fr;min-height:0;margin:10px 0}.native-social-panel .native-chat-drawer{min-height:160px}.native-social-panel .native-player-banner{height:72px}.native-player-avatar{width:48px;height:54px;flex-basis:48px}.native-player-details h3{font-size:16px}.native-player-details>span{font-size:9px}.native-player-status{font-size:9px}.native-back{font-size:21px;padding:5px 15px 5px 28px}.native-back:before{font-size:25px}.native-mode{font-size:15px;grid-template-columns:auto 45px}.native-mode b{font-size:28px}.native-mode small{font-size:7px}.native-room .native-room-name{font-size:14px;margin-top:10px}.native-room-name:before,.native-room-name:after{margin:0 8px}.native-song-selection>h2{font-size:26px}.native-difficulty-strip{width:100%;gap:10px}.native-wheel-window{height:198px;--wheel-step:120px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:275px;height:183px}.native-wheel-card{width:175px;height:117px;top:37px}.native-carousel .native-song-arrow{width:46px;height:70px}.native-carousel .native-song-arrow:before{width:44px;height:44px}.native-room-bottom{grid-template-columns:1fr 1fr;gap:10px}.native-start-area{grid-column:1 / -1;grid-row:1;max-width:470px}.native-ready-area{grid-column:1 / -1;grid-row:2;justify-self:center}.native-start-area #start-game{font-size:24px;height:73px}.native-ready-area #ready.quick-ready{width:180px}}
/* Reuse the approved control artwork itself; text/actions remain live HTML. */
.native-back{width:175px;height:57px;box-sizing:border-box;font-size:0;padding:0;border:0;clip-path:none;background:url('./lobby-assets/approved-room-reference.png') .535% .905%/955.43% 1680.36% no-repeat;filter:none;position:relative}.native-back:before{display:none}
.native-carousel .native-song-arrow:before{width:100px;height:120px;background:url('./lobby-assets/approved-room-reference.png') 1.272% 81.65%/1672% 729.46% no-repeat;transform:none;filter:drop-shadow(0 0 5px #ff334d66)}.native-carousel #song-next:before{background-image:url('./lobby-assets/approved-room-reference.png');background-position:98.35% 81.65%;transform:none;filter:drop-shadow(0 0 5px #22aaff66)}.native-carousel #song-prev:hover:enabled:before,.native-carousel #song-next:hover:enabled:before{transform:scale(1.06);filter:brightness(1.2)}
.native-start-area #start-game{height:93px;border:0!important;padding:0!important;clip-path:none;background:url('./lobby-assets/approved-room-reference.png') 49.89% 98.93%/211.65% 950.5% no-repeat!important;box-shadow:none!important;overflow:visible}
.native-start-area #start-game:before,.native-start-area #start-game:after,.native-start-area .pump-start-step{display:none}
.native-start-area #start-game>span:last-child{opacity:0}
.native-start-area #start-game.confirming>span:last-child{opacity:1;background:linear-gradient(#111,#030303);padding:3px 25px;font:900 italic 26px 'Arial Black';color:#fff2dc;text-shadow:0 0 6px #ff5700;width:48%;box-sizing:content-box}
.native-room-bottom{min-height:103px;flex-shrink:0}.native-social-panel{min-height:175px;grid-template-rows:repeat(2,minmax(70px,1fr));margin-bottom:10px}.native-social-panel .chat-log{min-height:65px}.native-start-area .host-start-note{display:none}.native-host-hint{margin-bottom:0}
@media(min-width:701px) and (max-height:900px){.native-room-top{min-height:50px}.native-room .native-room-name{font-size:17px;margin-bottom:6px}.native-social-panel{min-height:165px;margin-top:0;margin-bottom:12px;gap:10px 24px}.native-social-panel .native-player-banner{height:74px}.native-player-avatar{width:58px;height:58px;flex-basis:58px}.native-social-panel .chat-log{min-height:55px}.native-song-selection>h2{font-size:34px}.native-song-selection>p#native-song-meta{font-size:16px;margin-bottom:8px}.native-difficulty-strip{min-height:48px;margin-bottom:10px}.native-wheel-window{height:238px}.native-selected-jacket,.native-wheel-card.wheel-selected{width:350px;height:233px}.native-wheel-card{width:220px;height:147px;top:50px}.native-room-bottom{min-height:95px}.native-start-area #start-game{height:88px}}
@media(max-width:700px){.native-back{width:135px;height:44px}.native-carousel .native-song-arrow:before{width:46px;height:60px}.native-start-area #start-game{height:78px}.native-social-panel{min-height:0}.native-social-panel .native-chat-drawer{min-height:160px}}
/* Shared arcade theme for account, lobby, room setup, stage intro and results. */
body{background:#020203;color:#f0f2f8}
body:not(.in-game) .login-backdrop{background:#020203!important}
.approved-global-art{position:absolute;inset:0;pointer-events:none;opacity:.5}.approved-global-art svg{display:block;width:100%;height:100%}
body:not(.in-game) .login-backdrop:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(133deg,#ffffff04 0 1px,transparent 1px 5px),radial-gradient(ellipse at center,transparent,#000b 85%);pointer-events:none}
body:not(.in-game) .login-tiles,body:not(.in-game) .login-aura,body:not(.in-game) .login-lines,body:not(.in-game) .login-particles{display:none}
body:not(.in-game) .floating-pump-arrow{opacity:calc(var(--alpha)*.2)!important;filter:grayscale(.5) drop-shadow(0 0 7px #bd48ba22)}
body:not(.native-room-open) .online-header{background:linear-gradient(#090a0de8,#010204e8)!important;border-bottom:1px solid #398cbd77;box-shadow:0 1px #ff31d14d;backdrop-filter:blur(12px)}
.online-header .brand{color:#f9fcff;font-family:'Arial Black',sans-serif;letter-spacing:3px;text-shadow:2px 3px #000,0 0 10px #49b8ff44}.online-header #connection{color:#8ee8f1;font-size:11px}.online-header #identity{color:#d2d8e9;font-weight:700}.online-header #logout{border-radius:2px!important;border-color:#7c6a8f;background:linear-gradient(#22212c,#050508);color:#dce9f5;font:700 italic 9px 'Arial Black';clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.login-screen .online-main{max-width:1320px}.login-screen .online-main #login{gap:65px;background:none!important}
.online-main .login-intro h1{font:900 italic clamp(72px,8vw,120px)/1 'Arial Black',sans-serif;letter-spacing:1px;color:#fff;text-shadow:3px 4px #10101d,-1px -1px #7dedff,0 0 25px #3f9eff55}
.login-intro h1>span{font:800 italic 14px 'Arial Black';color:#ff9cde;letter-spacing:4px;margin-top:15px;text-shadow:0 0 9px #ff1dbb44}.login-intro>p{color:#c4c5d6;font-size:17px;text-shadow:1px 2px #000}.login-kicker,.login-ambient-label{color:#82d2f5;letter-spacing:3px;font-weight:700}.login-emblem{background:none;filter:drop-shadow(0 0 12px #2eaeff33)}
.login-entry{position:relative;background:linear-gradient(140deg,#07080ef0,#030308f5)!important;border:2px solid transparent!important;border-image:linear-gradient(150deg,#33d7ff,#a8bdff 40%,#ff2acc 95%) 1;border-radius:0!important;box-shadow:0 0 25px #000a,inset 0 1px #b0c6ff22!important;padding:28px 32px!important}
.login-entry:before{content:'';position:absolute;left:12px;right:12px;top:5px;height:2px;background:linear-gradient(90deg,transparent,#53d8ff,transparent)}
.login-entry>h2{font:900 italic 34px 'Arial Black';color:white;letter-spacing:-.7px;margin:14px 0}.login-entry>p{color:#aab3c9}.login-entry-kicker{font:800 9px 'Arial Black';letter-spacing:2px;color:#ff99de}
.login-player-card{border-radius:1px;border:1px solid transparent;border-image:linear-gradient(#2bdbff,#ce3ee0) 1;background:linear-gradient(90deg,#02040a 35%,#05060bc4 65%,transparent),url('./lobby-assets/approved-room-reference.png') 17.37% 10.7%/auto 1775.47% no-repeat;box-shadow:0 3px 10px #0009;min-height:69px;padding-block:8px;margin-bottom:24px}.login-player-card:after{display:none}.login-player-card strong{font:900 23px 'Arial Black';letter-spacing:.2px;text-shadow:2px 2px #000}.login-card-avatar{width:57px;height:57px;box-sizing:border-box;border:1px solid #65bbf1;border-radius:0;background:url('./lobby-assets/approved-room-reference.png') 3% 10.7%/2533.33% 1425.76% no-repeat}.login-card-avatar img{visibility:hidden}.login-card-spark{color:#ff9be2}
.login-entry .account-tabs{gap:0;border-bottom:1px solid #35415c}.login-entry .account-tabs button{border-radius:0;border:0;background:linear-gradient(#181a26,#05060c);font:800 italic 10px 'Arial Black';padding:13px 5px;color:#8999b7}.login-entry .account-tabs button.active{background:linear-gradient(#1b2034,#0b0b17);color:#f7eaff;border-bottom:2px solid #ff35d0;text-shadow:0 0 8px #ed29b755;box-shadow:0 3px 6px #e52dbb22}
.login-entry #login-form{gap:14px;margin-top:20px}.login-entry #login-form label{font-size:10px;letter-spacing:.4px;color:#bac8df}.login-entry #login-form input{border-radius:2px;border:1px solid #465a7a;background:#03050c;box-shadow:inset 0 2px 8px #000a;color:#edf7ff;padding:13px;font-size:12px}.login-entry #login-form input:focus{outline:none;border-color:#ff42d5;box-shadow:0 0 8px #ff2dba33}.login-entry .login-local-note{font-size:8px;color:#778298;line-height:1.5}.login-entry .login-status{color:#b8c8d5;border-color:#343a51;font-size:8px}
.login-entry #account-submit,.online-main #new-room,.online-main .room-card .join,#room-dialog .create-room-submit{border-radius:1px!important;border:1px solid #f3c861!important;background:linear-gradient(110deg,#63410a 0%,#161309 25%,#080808 55%,#583b0a 100%)!important;box-shadow:inset 0 0 0 3px #060708,inset 0 0 0 4px #d8a43666,0 0 9px #ffc42b33!important;color:#fff3d4;text-shadow:0 0 5px #ff7d00;font-family:'Arial Black',sans-serif;font-style:italic;clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 50%,calc(100% - 7px) 100%,7px 100%,0 50%)}
.login-entry #account-submit:hover,.online-main #new-room:hover,.online-main .room-card .join:hover,#room-dialog .create-room-submit:hover{filter:brightness(1.2)}
#lobby>.section-heading{border-bottom-color:#575179!important;padding-bottom:20px}#lobby>.section-heading:after{background:linear-gradient(90deg,#3ad7ff,#ff36d1)!important;width:160px!important}#lobby h1{font:900 italic 35px 'Arial Black';color:#f5f9ff;text-shadow:2px 3px #000}#lobby #lobby-hint{color:#a7b6cb}#lobby #new-room{font-size:12px;padding:14px 25px}#online-rooms{gap:22px}body:not(.login-screen) #online-rooms>p{border:1px solid #81708d88;border-radius:0;background:linear-gradient(130deg,#05070ce6,#0b0710d9);box-shadow:0 0 12px #0009;color:#c0ccdd;padding:30px;font-size:13px}
.online-main .room-card{border-radius:1px;border:1px solid transparent;border-image:linear-gradient(#4acfff,#ff38d0) 1;background:linear-gradient(145deg,#080c13ee,#030305f5);box-shadow:0 5px 18px #000a;padding:17px;transition:box-shadow .2s,transform .2s}.online-main .room-card:hover{box-shadow:0 0 18px #b225ba33;transform:translateY(-2px)}.online-main .room-card h2{font:800 21px 'Arial Black';color:#f4f7ff;letter-spacing:.1px}.online-main .room-card img{border-radius:0;border:1px solid #a298a7;box-sizing:border-box;height:165px}.online-main .room-card .card-top{border-bottom:1px solid #7d497a44;padding-bottom:10px}.online-main .room-card .room-state{border-radius:0;border:1px solid #57c8e188;color:#98eaff;background:#061421;font:800 italic 9px 'Arial Black';padding:4px 8px}.online-main .room-card .room-number{color:#8fadc9;font-size:9px;letter-spacing:1px}.online-main .room-card .join{padding:10px 20px;font-size:11px}.online-main .room-card p{color:#a6b4c8}
#room-dialog.pump-create-dialog{border:2px solid transparent;border-image:linear-gradient(145deg,#46d9ff,#ad8cda 48%,#ff31c7) 1;border-radius:0;background:linear-gradient(145deg,#080c14,#030308);box-shadow:0 0 28px #000c,inset 0 1px #d4e7ff22;padding:26px 30px}#room-dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}.create-room-header{border-color:#714b7955}.create-room-header:after{background:linear-gradient(90deg,#3fdaff,#ff36d1);border-radius:0}.create-room-header h2{font:900 italic 29px 'Arial Black';color:#fff;letter-spacing:.2px;text-shadow:2px 3px #000}.create-room-header>div>span{color:#67ccef;font-size:8px}.create-room-badge{border-radius:0;border-color:#ebbd50;color:#ffe17c;background:#2a210b;font:800 9px 'Arial Black'}.create-room-intro{color:#a1b3ca}.create-room-label,.create-room-modes legend,.create-party-heading{color:#bec9df!important;font-size:9px!important}
#room-dialog input{background:#02050c;border-color:#4b617d;border-radius:1px;color:white}#room-dialog input:focus{outline:none;border-color:#ff3bcf;box-shadow:0 0 7px #ff2dba33}.create-mode{border-radius:0;border-color:#36c4f5;background:linear-gradient(#112337,#050911);box-shadow:inset 0 0 12px #38a0ff16}.create-mode strong{font:900 italic 19px 'Arial Black'}.create-mode.upcoming{background:#07090e;border-color:#3c4459}.create-mode small{color:#9ac1dd}.mode-check{color:#72ffc4}.create-party-slots>span{border-radius:0;border-color:#4c586d;background:#05070e}.create-party-slots .party-host{background:linear-gradient(#211c0c,#0d0b06);border-color:#c3a94e}.create-party-slots .party-host b{color:#ffe074}.create-room-submit{min-height:59px}.create-room-submit>span:nth-child(2){font-size:12px}#room-dialog #cancel-room{border-radius:0;background:linear-gradient(#1a1b27,#05060d);border-color:#6b6480;color:#b7c7e1;font:800 italic 10px 'Arial Black';box-shadow:inset 0 1px #fff1}.create-room-footnote{color:#7c8ba4}
#song-intro{background:repeating-linear-gradient(133deg,#ffffff04 0 1px,transparent 1px 5px),radial-gradient(ellipse at center,#1b0a1b,#020408 70%,#000);gap:16px}#song-intro>img{border:2px solid #ffd05f;outline:1px solid #f2d3ef;box-shadow:0 0 18px #ff37c844,0 0 5px #ffd97c66}#song-intro>h2{font-family:'Arial Black',sans-serif;font-size:clamp(24px,3.5vw,44px)}#song-intro>p{font:900 italic 24px 'Arial Black';color:#ffe291;text-shadow:0 0 8px #ff630055}#song-intro .song-intro-kicker{color:#7fdaff;font:800 italic 12px 'Arial Black';letter-spacing:5px}#song-intro .song-intro-ready{font:900 italic 20px 'Arial Black';color:#fff6dc;text-shadow:0 0 6px #ff6900}
.judgment-hud{border-radius:0;background:#02050be0;border:1px solid #5ea2c266;border-bottom-color:#d43cc799;box-shadow:0 3px 14px #0009}.judgment-hud .hud-label{font:800 italic 9px 'Arial Black';color:#b7cce7}.judgment-hud .hud-count{font-size:10px}.judgment-hud .hud-max,.judgment-hud .hud-score{border-color:#3a435c}
.judgment-results{border-radius:0;border:2px solid transparent;border-image:linear-gradient(#4bdaff,#9792c8 45%,#f529cb) 1;background:repeating-linear-gradient(133deg,#ffffff03 0 1px,transparent 1px 5px),linear-gradient(140deg,#060d16f7,#030308fc);box-shadow:0 0 80px #000f,0 0 22px #9b2aa733;padding:28px 32px;width:min(650px,calc(100% - 45px));box-sizing:border-box;top:50%;transform:translate(-50%,-50%)}.judgment-results .result-kicker{font:900 italic 12px 'Arial Black';color:#88dfff;letter-spacing:4px}.judgment-results h2{font:900 italic 30px 'Arial Black';text-shadow:2px 3px #000,0 0 13px #49c8ff44;margin:16px 0}.judgment-results>p{font:800 14px 'Arial Black';color:#fff0d3}.result-grades{border-block:1px solid #62708b55;background:#0006;margin:20px 0}.result-grades>div{border-bottom-color:#44516b55;padding:9px 15px;font:800 italic 12px 'Arial Black'}.result-grades strong{font:900 23px 'Arial Black';font-variant-numeric:tabular-nums;text-shadow:0 0 7px currentColor}.result-totals>div{flex:1}.result-totals span{font:800 9px 'Arial Black';color:#aab8d2}.result-totals strong{font:900 italic 31px 'Arial Black';color:#ffe395;text-shadow:0 0 8px #ff7c0044}.judgment-results>small{color:#8b95ad;font-size:8px}
@media(max-width:700px){.login-screen .online-main #login{gap:25px}.login-entry{padding:22px 20px!important}.login-entry>h2{font-size:27px}.online-main .login-intro h1{font-size:64px}.login-intro h1>span{font-size:11px;letter-spacing:2px}.login-intro>p{font-size:14px}#lobby h1{font-size:26px}#lobby #new-room{font-size:10px;padding:12px 15px}#room-dialog.pump-create-dialog{padding:22px 18px}.create-room-header h2{font-size:24px}.create-mode strong{font-size:17px}.judgment-results{padding:20px;width:calc(100% - 24px)}.judgment-results h2{font-size:23px}.result-totals strong{font-size:25px}.result-grades>div{padding:7px 10px}.result-grades strong{font-size:19px}}
@media(prefers-reduced-motion:reduce){.online-main .room-card{transition:none}}
/* Keep the player illustration inside its own banner crop. */
.login-player-card{background:#03050b}.login-player-card:before{content:'';position:absolute;inset:0 0 0 auto;width:49%;background:linear-gradient(90deg,#03050b,transparent 35%,transparent 94%,#03050b),url('./lobby-assets/approved-room-reference.png') 17.37% 10.7%/auto 1775.47% no-repeat;pointer-events:none}.login-player-card>div{position:relative;z-index:1}
@media(min-width:701px) and (max-height:950px){.login-screen:has(#tab-register[aria-pressed=true]) .login-entry{padding-block:20px!important}.login-screen:has(#tab-register[aria-pressed=true]) .login-player-card{min-height:62px;margin-bottom:14px}.login-screen:has(#tab-register[aria-pressed=true]) .login-entry>h2{font-size:28px;margin:9px 0}.login-screen:has(#tab-register[aria-pressed=true]) .login-entry>p{margin:8px 0}.login-screen:has(#tab-register[aria-pressed=true]) #login-form{gap:10px;margin-top:13px}.login-screen:has(#tab-register[aria-pressed=true]) #login-form input{padding:10px}.login-screen:has(#tab-register[aria-pressed=true]) #login-form label{gap:5px}.login-screen:has(#tab-register[aria-pressed=true]) .login-entry .login-status{margin-top:14px}}
/* Isolate the red marquee chevron from the reference's square backing. */
.native-carousel #song-prev{width:120px;height:145px;filter:drop-shadow(0 0 5px #ff273f55)}.native-carousel #song-prev:before{width:115px;height:138px;clip-path:polygon(74% 6%,97% 6%,44% 50%,97% 94%,74% 94%,5% 50%);filter:brightness(1.12) saturate(1.15)}.native-carousel #song-prev:hover:enabled:before{transform:scale(1.06);filter:brightness(1.3) saturate(1.2)}@media(max-width:700px){.native-carousel #song-prev{width:55px;height:80px}.native-carousel #song-prev:before{width:53px;height:70px}}
/* Clean vector controls: transparent, symmetric, with inset arcade lamps. */
.native-carousel #song-prev,.native-carousel #song-next{width:120px;height:146px;background:none!important;border:0;clip-path:none;filter:none;overflow:visible}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:104px;height:139px;clip-path:none;background:url('./lobby-assets/selector-arrow-red.svg') center/contain no-repeat;transform:none;filter:none;transition:transform .18s ease,filter .18s ease}.native-carousel #song-next:before{background-image:url('./lobby-assets/selector-arrow-blue.svg');transform:scaleX(-1)}.native-carousel #song-prev:hover:enabled:before{transform:translateX(-3px) scale(1.05);filter:brightness(1.15)}.native-carousel #song-next:hover:enabled:before{transform:translateX(3px) scaleX(-1) scale(1.05);filter:brightness(1.15)}.native-carousel #song-prev:active:enabled:before,.native-carousel #song-next:active:enabled:before{scale:.96}@media(max-width:700px){.native-carousel #song-prev,.native-carousel #song-next{width:53px;height:80px}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:53px;height:71px}}@media(prefers-reduced-motion:reduce){.native-carousel #song-prev:before,.native-carousel #song-next:before{transition:none}}
/* Broad cyberpunk road-sign chevrons. */
.native-carousel #song-prev,.native-carousel #song-next{width:132px;height:154px}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:120px;height:144px;background-size:contain}@media(max-width:700px){.native-carousel #song-prev,.native-carousel #song-next{width:58px;height:80px}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:58px;height:70px}}
/* Reference: three hollow neon chevrons, illuminated from rear to tip. */
.native-carousel #song-prev,.native-carousel #song-next{width:164px;height:146px}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:160px;height:130px;background-size:contain}@media(max-width:700px){.native-carousel #song-prev,.native-carousel #song-next{width:65px;height:80px}.native-carousel #song-prev:before,.native-carousel #song-next:before{width:64px;height:70px}}
/* Fiery selection: white-hot core with a moving gold/orange flame halo. */
@property --selection-fire-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.native-selected-jacket{border:3px solid #ffadee;outline:1px solid #ffe1f9;outline-offset:0;box-shadow:inset 0 0 7px #ffb8f0,0 0 5px #ffc4f2,0 0 12px #ff2bd3,0 0 24px #ff00cecc,0 0 40px #ff00d388;animation:selection-fire-flicker 1.5s ease-in-out infinite alternate}
.native-selected-jacket:before,.native-selected-jacket:after{content:'';position:absolute;inset:-7px;padding:5px;pointer-events:none;background:conic-gradient(from var(--selection-fire-angle),#ff00d3,#ff00cc 12%,#ffd2f5 19%,#ff00cb 27%,#ff00d2 40%,#ffa1eb 47%,#ff00ce 58%,#ff00d3 70%,#ff84e5 83%,#ffd7f6 89%,#ff00d3);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;animation:selection-fire-travel 3.4s linear infinite;filter:blur(1.2px)}
.native-selected-jacket:after{inset:-13px;padding:8px;filter:blur(4px);opacity:.85;animation:selection-fire-travel 2.6s linear infinite reverse,selection-fire-breath .8s ease-in-out infinite alternate}
.native-selected-jacket>span{z-index:2;background:linear-gradient(#180014b8,transparent);text-shadow:0 1px 3px #000}
@keyframes selection-fire-travel{to{--selection-fire-angle:360deg}}
@keyframes selection-fire-flicker{0%,100%{border-color:#ffc5f3;box-shadow:inset 0 0 7px #ffb8f0,0 0 6px #ffd4f6,0 0 13px #ff2bd3,0 0 27px #ff00cedd,0 0 43px #ff00d399}32%{border-color:#ff7ce4;box-shadow:inset 0 0 6px #ffb8f0,0 0 4px #ffa0eb,0 0 10px #ff18d0,0 0 21px #ff00d0cc,0 0 34px #ff00d388}61%{border-color:#ffe4f9;box-shadow:inset 0 0 8px #ffb8f0,0 0 8px #ffd4f6,0 0 17px #ff4cd9,0 0 32px #ff00cddd,0 0 47px #ff00d399}}
@keyframes selection-fire-breath{from{opacity:.6;filter:blur(3px)}to{opacity:.95;filter:blur(5px)}}
@media(prefers-reduced-motion:reduce){.native-selected-jacket,.native-selected-jacket:before,.native-selected-jacket:after{animation:none}.native-selected-jacket:after{opacity:.7}}
.native-player-details .player-connection{display:grid;grid-template-columns:minmax(50px,1fr) auto;gap:3px 8px;margin-top:5px;min-width:0;font:700 9px Arial,sans-serif;letter-spacing:.3px}
.player-load-label{grid-column:1;white-space:nowrap;color:#d7d6eb;font-size:8px}.player-load-bar{grid-column:1;height:3px;background:#ffffff20;overflow:hidden;border-radius:2px}.player-load-bar i{display:block;height:100%;background:linear-gradient(90deg,#d337bc,#78edf8);transition:width .2s linear}.player-ping{grid-column:2;grid-row:1/3;align-self:center;font-size:10px;white-space:nowrap}.player-ping.good{color:#79f5b5}.player-ping.medium{color:#ffe087}.player-ping.slow{color:#ff899b}.player-ping.unknown{color:#a8a0b6}
.native-player-banner .native-player-details{flex:1;min-width:0}.native-player-banner:has(.player-connection){min-height:90px;height:auto}.native-player-status{flex-shrink:0}
/* Filled reference chevrons; sweep uses only transform/opacity on a small SVG. */
.native-carousel #song-prev,.native-carousel #song-next{--arrow-edge:#ff69da;--arrow-core:#721a83;width:164px;height:146px;display:grid;place-items:center;filter:none;touch-action:manipulation}
.native-carousel #song-next{--arrow-edge:#73efff;--arrow-core:#225caa}
.native-carousel #song-prev:before,.native-carousel #song-next:before{display:none}
.selector-neon-art{display:block;width:100%;height:100%;overflow:visible;transition:scale .18s ease,opacity .18s ease}
#song-prev .selector-neon-art{transform:scaleX(-1)}
.selector-light-sweep{opacity:1}
.native-song-arrow:hover:enabled .selector-neon-art{scale:1.06}
.native-song-arrow:active:enabled .selector-neon-art{scale:.96}
.native-song-arrow:disabled .selector-neon-art{opacity:.3}.native-song-arrow:disabled .selector-light-sweep{display:none}
.in-game .selector-light-sweep{display:none}
@media(max-width:700px){.native-carousel #song-prev,.native-carousel #song-next{width:65px;height:80px}}
@media(prefers-reduced-motion:reduce){.selector-light-sweep{display:none}.selector-neon-art{transition:none}}
/* Keep selection controls, remove the redundant card surrounding them. */
.native-room .native-difficulty-strip{background:transparent;border:0;border-radius:0;box-shadow:none;clip-path:none}
.native-room .native-difficulty-strip:before,.native-room .native-difficulty-strip:after{display:none}
.native-room .version-back,.native-room .scroll-speed summary{--control-edge:#f479d6;--control-dark:#3a1237;padding:9px 16px;border:1px solid var(--control-edge);border-radius:0;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);background:linear-gradient(120deg,var(--control-dark),#160c20 65%,#29122f);color:#fff0fc;font:900 italic 11px Arial,sans-serif;letter-spacing:.7px;box-shadow:inset 0 0 0 2px #150a1b,inset 0 -2px var(--control-edge);text-shadow:0 0 7px #f54ec755;transition:filter .18s,scale .18s}
.native-room .scroll-speed summary{--control-edge:#75e7f3;--control-dark:#163444;color:#d9fbff;text-shadow:0 0 7px #54e7f355}
.native-room .version-back:hover:enabled,.native-room .scroll-speed:not([data-locked]) summary:hover{filter:brightness(1.25)}
.native-room .version-back:active:enabled,.native-room .scroll-speed summary:active{scale:.96}
.native-room .scroll-speed-options{border-color:#d16ab5;border-radius:2px;background:linear-gradient(145deg,#28112e,#0e0a18);box-shadow:0 8px 24px #0009,inset 0 1px #ec93d333}
.native-room .scroll-speed-options button{border-color:#75416d;border-radius:1px;background:#27132e;color:#f5dcf1}
.native-room .scroll-speed-options button[aria-pressed=true]{border-color:#f479d6;background:#60234f;color:white;box-shadow:inset 0 -2px #f479d6}
@media(max-width:700px){.native-room .version-back,.native-room .scroll-speed summary{padding:8px 10px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.native-room .version-back,.native-room .scroll-speed summary{transition:none}}