/* Rooftop Hoops — open court launch scene and touch-safe game controls. */
.rh-stage { background:#101b2c; }
.rh-menu { position:absolute;inset:0;z-index:4;overflow:hidden;pointer-events:none;color:#fff6e7;font-family:Rubik,Arial,sans-serif;background:linear-gradient(180deg,#07101c66,transparent 25%,transparent 66%,#07101cca); }
.rh-brand { position:absolute;left:32px;top:27px; }
.rh-kicker { display:flex;align-items:center;gap:8px;color:#94e9d7;font-size:9px;font-weight:800;letter-spacing:2.4px; }
.rh-kicker i { width:6px;height:6px;border-radius:50%;background:#99f4d8;box-shadow:0 0 12px #8decc6; }
.rh-brand h2 { margin:11px 0 6px;font:400 clamp(28px,4vw,46px)/1.05 'Russo One',Impact,sans-serif;letter-spacing:-1px;text-shadow:0 3px 15px #030a14; }
.rh-brand h2 span { color:#ffc990; }
.rh-brand p { margin:0;color:#b2c4d3;font-size:12px; }
.rh-match-info { position:absolute;right:34px;top:31px;display:grid;gap:8px;text-align:right; }
.rh-match-info span { color:#8eead4;font-size:9px;font-weight:800;letter-spacing:2px; }
.rh-match-info b { font-size:12px;letter-spacing:.9px; }
.rh-match-info small { color:#95abbf;font-size:10px; }
.rh-launch-dock { position:absolute;left:32px;bottom:max(28px,env(safe-area-inset-bottom));pointer-events:auto; }
.rh-launch-actions { display:flex;align-items:center;gap:18px; }
.rh-tipoff { display:flex;align-items:center;justify-content:space-between;gap:28px;min-width:202px;height:62px;padding:0 22px;border-radius:14px;border:1px solid #ffe2aa;background:linear-gradient(135deg,#ffdda3,#ffb264);color:#252432;font:900 16px Rubik,Arial,sans-serif;letter-spacing:1px;box-shadow:0 4px 0 #955336,0 13px 30px #0004;cursor:pointer;transition:transform .15s,filter .15s;touch-action:manipulation; }
.rh-tipoff span { font-size:23px;font-weight:500; }
.rh-tipoff:hover { filter:brightness(1.07);transform:translateY(-2px); }
.rh-tipoff:active { transform:translateY(2px);box-shadow:0 2px 0 #955336,0 10px 20px #0004; }
.rh-opponent { display:grid;gap:5px;color:#a6bece;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1px; }
.rh-opponent select { appearance:auto;padding:7px 9px;border:1px solid #90aebe38;border-radius:7px;background:#122234;color:#e1eee9;font:600 12px Rubik,Arial,sans-serif;cursor:pointer;min-width:115px; }
.rh-opponent option { background:#122234; }
.rh-launch-note { margin:13px 0 0;color:#bed0dc;font-size:10px; }
.rh-attract-help { position:absolute;right:32px;bottom:32px;display:grid;grid-template-columns:auto auto;gap:13px 19px;color:#92acbe;font-size:8px;font-weight:700;letter-spacing:.8px; }
.rh-attract-help span,.rh-help span { display:flex;align-items:center;gap:6px; }
.rh-menu kbd,.rh-help kbd { display:inline-flex;align-items:center;justify-content:center;min-width:18px;min-height:18px;padding:2px 4px;border:1px solid #a5bfd133;border-bottom-width:2px;border-radius:4px;color:#dfebe9;font:700 8px Rubik,Arial,sans-serif; }
.rh-controls { position:absolute;inset:auto 18px max(21px,env(safe-area-inset-bottom)) auto;display:flex;align-items:end;gap:10px;z-index:2;pointer-events:none;user-select:none; }
.rh-controls[hidden],.rh-help[hidden] { display:none; }
.rh-action { width:66px;height:66px;border-radius:18px;border:1px solid #91e1d359;background:linear-gradient(145deg,#234350ed,#101f33f2);color:#b4f9e3;font:800 10px Rubik,Arial,sans-serif;letter-spacing:.5px;touch-action:none;pointer-events:auto;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;box-shadow:0 5px 0 #080f1a,0 10px 25px #0004,inset 0 1px #ffffff21;transition:transform .08s; }
.rh-action.rh-shoot { width:88px;height:88px;border-radius:23px;background:linear-gradient(150deg,#ffda9d,#ff9f59);color:#2c2330;border:2px solid #ffe0a4;box-shadow:0 5px 0 #8d492f,0 8px 26px #ffae4826,inset 0 1px #fff6; }
.rh-action.rh-steal { background:linear-gradient(145deg,#3b3b5fed,#171e35f2);color:#d4c6ff;border-color:#b5a7ef4a; }
.rh-action:active,.rh-action.pressed { transform:translateY(4px);filter:brightness(1.12);box-shadow:0 1px 0 #080f1a; }
.rh-action small { font-size:8px;opacity:.67;letter-spacing:0; }
.rh-action i { font-style:normal;font-size:20px;line-height:18px; }
.rh-help { position:absolute;bottom:31px;left:155px;right:285px;display:flex;justify-content:center;flex-wrap:wrap;gap:12px;color:#a8bfcb;font:9px/1.8 Rubik,Arial,sans-serif;pointer-events:none; }
.rh-stick.arcade-joystick .arcade-joystick-ring { border-color:#95efd24f;background:radial-gradient(circle,#3153679c,#0b192ccc);box-shadow:inset 0 0 0 14px #95edff07,0 6px 22px #0004; }
.rh-stick.arcade-joystick .arcade-joystick-knob { border-color:#bff9dfbc;background:linear-gradient(145deg,#8ef1d6,#368d94); }
.rh-stick.arcade-joystick .arcade-joystick-label { color:#9dbece;font-size:9px; }
.rh-tipoff:focus-visible,.rh-opponent select:focus-visible,.rh-action:focus-visible { outline:3px solid #fff;outline-offset:4px; }
@media(max-width:720px) { .rh-attract-help{display:none}.rh-match-info{right:22px}.rh-brand{left:22px}.rh-launch-dock{left:22px}.rh-help{display:none} }
@media(pointer:coarse),(max-width:600px) {
 .rh-controls{right:12px;bottom:max(21px,env(safe-area-inset-bottom));gap:8px}.rh-action{width:55px;height:59px;font-size:9px;border-radius:16px}.rh-action.rh-shoot{width:75px;height:79px;border-radius:20px}.rh-action small{display:none}
 .rh-brand{top:24px}.rh-brand h2{font-size:29px;letter-spacing:-.8px}.rh-brand p{font-size:11px}.rh-kicker{font-size:8px;letter-spacing:1.8px}.rh-match-info{top:auto;bottom:150px;right:22px;gap:6px}.rh-match-info span{display:none}.rh-match-info b{font-size:9px}.rh-match-info small{font-size:9px}
 .rh-launch-dock{left:22px;right:22px;bottom:max(27px,env(safe-area-inset-bottom))}.rh-launch-actions{gap:16px}.rh-tipoff{flex:1;min-width:0;height:61px;font-size:14px;padding:0 17px}.rh-opponent select{min-width:105px}.rh-launch-note{font-size:9px;margin-top:13px}
}
@media(max-width:350px) { .rh-brand{left:16px}.rh-brand h2{font-size:25px}.rh-launch-dock{left:16px;right:16px}.rh-launch-actions{gap:11px}.rh-opponent select{min-width:94px}.rh-action{width:44px;height:50px}.rh-action.rh-shoot{width:60px;height:68px}.rh-controls{gap:5px;right:7px}.rh-launch-note{font-size:8px} }
@media(max-height:500px) and (min-width:600px) { .rh-brand{top:12px;left:20px}.rh-brand h2{font-size:27px;margin:7px 0}.rh-brand p{display:none}.rh-kicker{font-size:7px}.rh-match-info{top:16px;right:21px;bottom:auto;gap:5px}.rh-match-info b{font-size:9px}.rh-match-info small{display:none}.rh-launch-dock{left:20px;right:auto;bottom:16px}.rh-tipoff{height:47px;min-width:157px;font-size:12px;gap:15px;border-radius:10px}.rh-opponent{font-size:7px}.rh-opponent select{font-size:10px;padding:5px 8px;min-width:100px}.rh-launch-note,.rh-attract-help,.rh-help{display:none}.rh-controls{bottom:12px}.rh-action{width:51px;height:53px;border-radius:15px}.rh-action.rh-shoot{width:65px;height:68px;border-radius:18px}.rh-action small{display:none} }
@media(prefers-reduced-motion:reduce) { .rh-tipoff,.rh-action { transition:none; }.rh-tipoff:hover { transform:none; } }

.rh-mode-choice{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;color:#c5ded7;font:700 10px Rubik,Arial,sans-serif}.rh-mode-choice select{padding:8px;background:#143248;border:1px solid #7babaa70;border-radius:8px;color:#eef7e6;font:700 11px Rubik,Arial,sans-serif}.rh-mode-choice>span{flex-basis:100%;font-size:9px;color:#90b9c3}@media(max-height:510px){.rh-mode-choice{margin-bottom:7px}.rh-mode-choice>span{font-size:8px}}