/* One riding readout, followed by a quieter social roster. */
.score-panel{width:232px;text-shadow:0 1px 3px #07100cdd,0 0 10px #07100c70}
.ride-stats{display:grid;grid-template-columns:minmax(0,1fr) 80px;gap:18px;align-items:start}
.score-stat{min-width:0}.score-panel .micro,.score-panel .special-label{font:600 9px/1.2 var(--font);letter-spacing:1.6px;color:#e5ebdcbf}
.score-panel #score{font-size:42px;line-height:1.1;margin-top:4px;letter-spacing:0;overflow-wrap:anywhere}
.score-panel .special-label{margin:0 0 17px}.score-panel .special-track{height:4px;background:#f0f6df30;border-radius:2px;box-shadow:0 1px 4px #07100c55}
.special-stat{padding-top:1px}.special-active .special-stat #special-label{color:var(--acid)}
#lobby{position:relative;z-index:4;width:100%;margin-top:13px;padding-top:11px;border-top:1px solid #edf5dc24;color:#f3f5eb;font-size:12px;pointer-events:auto;transition:opacity .35s ease,visibility 0s linear}
.lobby-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;font-size:9px;font-weight:600;letter-spacing:1.5px;color:#d0dac7b0}
.lobby-heading b{font-weight:500;letter-spacing:0;margin-left:5px;color:#eef4e1;font-variant-numeric:tabular-nums}
#lobby button{border:0;background:none;padding:4px 0;color:#d7fc70;font:600 9px var(--font);letter-spacing:1px;cursor:pointer;text-shadow:inherit}
#lobby button[aria-pressed=false]{color:#c8d1c0}#lobby button:focus-visible{outline:2px solid #d7fc70;outline-offset:2px}
#lobby-name-form{display:flex;align-items:center;gap:7px;min-height:28px}
.lobby-dot{width:4px;height:4px;flex:none;background:#d7fc70;border-radius:50%}
#lobby-display{flex:1;min-width:0;overflow-wrap:anywhere;font-weight:600;line-height:1.35}
#lobby-name{display:none;width:0;min-width:0;flex:1;padding:4px 0;border:0;border-bottom:1px solid #d7fc70;background:transparent;color:inherit;font:600 12px var(--font);outline:0}
#lobby-name-form.is-editing #lobby-name{display:block}#lobby-name-form.is-editing #lobby-display{display:none}
#lobby-name-form small{font-size:8px;letter-spacing:.8px;color:#d8e3c6a0;flex:none}
#lobby #lobby-edit{width:28px;height:28px;display:grid;place-items:center;flex:none;padding:0;color:#edf5df;border-radius:5px}
#lobby-edit:hover,#lobby-name-form:focus-within #lobby-edit{background:#ffffff14}
#lobby-edit svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#lobby-players{list-style:none;padding:0;margin:0;max-height:100px;overflow:auto;scrollbar-width:thin}
#lobby-players:empty{display:none}#lobby-players li{position:relative;padding:5px 0 5px 11px;overflow-wrap:anywhere;line-height:1.35;color:#dfe7d5}
#lobby-players li:before{content:'';position:absolute;left:0;top:11px;width:3px;height:3px;border-radius:50%;background:#dfebca70}
#lobby-status{position:absolute;top:94px;right:30px;z-index:2;max-width:200px;margin:0;text-align:right;font:400 11px/1.5 var(--font);color:#dce5cfb0;text-shadow:0 1px 4px #07100c;pointer-events:none;transition:opacity .35s ease,visibility 0s linear}
#lobby-status.connection-issue{color:#f1d7ae}
body:has(#perf-diagnostics.expanded) #lobby-status{visibility:hidden}
body.tutorial-pending #lobby,body.tutorial-pending #lobby-status,body.learning #lobby-status{opacity:0;visibility:hidden;pointer-events:none}
@media(max-width:700px){
 .score-panel{width:194px}.ride-stats{grid-template-columns:minmax(0,1fr) 64px;gap:12px}
 .score-panel #score{font-size:35px}.score-panel .micro,.score-panel .special-label{font-size:8px;letter-spacing:1.2px}
 .score-panel .special-label{margin:0 0 15px}#lobby{margin-top:9px;padding-top:8px;font-size:11px}
 .lobby-heading{font-size:8px;margin-bottom:2px}#lobby-players{max-height:72px}#lobby-players li{padding-top:4px;padding-bottom:4px}
 #lobby-name-form.is-editing{flex-wrap:wrap}#lobby-name-form.is-editing #lobby-name{order:5;flex-basis:100%;width:100%}
 #lobby-status{top:calc(91px + env(safe-area-inset-top));right:18px;max-width:calc(100vw - 238px);font-size:10px}
 #lobby-status:not(.connection-issue){display:none}
}
@media(max-height:500px){#lobby{margin-top:6px;padding-top:6px}#lobby-players{max-height:48px}.score-panel .special-label{margin-top:0}#lobby-status{top:70px}}
@media(prefers-reduced-motion:reduce){#lobby,#lobby-status{transition:none}}