/* One quiet control language for navigation, difficulty and music. */
.select-control{position:relative;display:inline-flex;min-width:0;vertical-align:middle}
select[data-select-source][hidden]{display:none!important}
body .select-control>.select-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-width:0;min-height:44px;margin:0;padding:0 13px;border:0;border-radius:9px;background:var(--graphite-key,linear-gradient(155deg,#242424,#1c1c1c));box-shadow:var(--graphite-lift);color:#d2d2d2;font:400 14px var(--sans);text-align:left;cursor:pointer;touch-action:manipulation;transition:background .15s,box-shadow .15s}
.select-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.4}
.select-chevron{flex:none;width:6px;height:6px;margin-right:2px;border-right:1.3px solid #939393;border-bottom:1.3px solid #939393;transform:rotate(45deg) translateY(-2px);transition:transform .18s}
body .select-control>.select-trigger[aria-expanded=true]{background:#202020;box-shadow:var(--graphite-press)}
.select-trigger[aria-expanded=true] .select-chevron{transform:rotate(225deg) translate(-2px,-1px)}
body .select-control>.select-trigger:focus-visible{outline:1.5px solid #aaa;outline-offset:3px}
body .select-control>.select-trigger:disabled{opacity:.48;cursor:default}
.select-menu{position:fixed;inset:auto;z-index:1500;display:block;box-sizing:border-box;margin:0;padding:6px;border:0;border-radius:13px;background:linear-gradient(155deg,#303030,#242424);box-shadow:0 16px 48px #0009,0 4px 12px #0005,inset 0 1px 1px #ffffff12;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;scrollbar-width:thin;scrollbar-color:#555 transparent;color:#c6c6c6;font:400 14px var(--sans);text-align:left;animation:select-arrive .16s ease-out;transform-origin:top left;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.select-menu[data-side=above]{transform-origin:bottom left}
.select-menu[hidden]{display:none!important}
.select-menu::backdrop{background:transparent;pointer-events:none}
body .select-menu>.select-option{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;min-height:46px;margin:0;padding:0 12px;border:0;border-radius:8px;background:transparent;box-shadow:none;color:#acacac;font:inherit;line-height:1.4;text-align:left;cursor:pointer;touch-action:pan-y pinch-zoom;transition:background .12s,color .12s}
body .select-menu>.select-option[hidden]{display:none}
body .select-menu>.select-option[aria-selected=true]{color:#e4e4e4;background:#ffffff05}
body .select-menu>.select-option[data-active=true]{color:#eee;background:#ffffff0c}
body .select-menu>.select-option:active{background:#1f1f1f;color:#eee;box-shadow:inset 0 2px 5px #0004;transform:none}
body .select-menu>.select-option:disabled{opacity:.4;cursor:default}
.select-check{font-size:13px;color:#bfbfbf;visibility:hidden}
[aria-selected=true]>.select-check{visibility:visible}
.mobile-game-picker>.select-control,.chroma-difficulty>.select-control,.sound-panel>.select-control{width:100%}
.sound-panel>.select-control{margin-bottom:10px}
.difficulty-row>.select-control{min-width:130px}
.room-filter>.select-control{min-width:108px}
@keyframes select-arrive{from{opacity:0;transform:translateY(-3px) scale(.985)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.select-menu{animation:none}.select-chevron,.select-trigger{transition:none!important}}

/* No double-tap zoom; page scrolling and deliberate pinch zoom still work. */
html,body,dialog,:where(body *){touch-action:manipulation}
@media(any-pointer:coarse),(max-width:760px),(max-width:1000px) and (max-height:500px){
 body :is(textarea,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit])){font-size:16px}
 body .select-control>.select-trigger{font-size:14px}
 .mobile-game-picker .select-trigger{height:44px}
}
