#raceHUD{position:fixed;right:18px;top:90px;width:304px;max-height:calc(100dvh - 120px);overflow:auto;z-index:25;padding:18px;background:linear-gradient(180deg,rgba(18,22,31,.94),rgba(12,16,24,.92));color:#f6f7fb;border:1px solid rgba(255,255,255,.11);border-radius:20px;box-shadow:0 18px 52px rgba(5,8,15,.36),inset 0 1px rgba(255,255,255,.04);font:13px system-ui,sans-serif;backdrop-filter:blur(14px) saturate(1.12);-webkit-backdrop-filter:blur(14px) saturate(1.12)}
#raceHUD[hidden]{display:none}#raceHUD h2{font-size:21px;margin:16px 0 7px;letter-spacing:-.45px;color:#fff}#raceHUD p{line-height:1.48}.raceTop{display:flex;justify-content:space-between;align-items:center;gap:8px}.raceEyebrow{font-size:9px;color:#c7adff;letter-spacing:1.1px;font-weight:850}#raceLeave{border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.07);color:#ddd0ff;padding:8px 10px;font-size:11px;cursor:pointer;transition:background .16s ease,transform .16s ease}#raceLeave:hover{background:rgba(255,255,255,.12)}#raceLeave:active{transform:scale(.96)}.raceStats{display:flex;justify-content:space-between;padding:11px 12px;background:rgba(125,92,212,.15);border:1px solid rgba(184,153,255,.13);border-radius:11px}#raceHUD ol{padding:0;list-style-position:inside;counter-reset:race}#raceHUD li{display:flex;gap:8px;justify-content:space-between;align-items:center;padding:9px 7px;border-bottom:1px solid rgba(255,255,255,.07)}#raceBoard li:before{counter-increment:race;content:counter(race);color:#b99cff;font-weight:800}#raceBoard li b{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#raceBoard li span{font-size:11px;color:#aab1c0}#raceBoard .isMe{background:rgba(129,90,226,.15);border-radius:8px}#raceHUD summary{cursor:pointer;color:#c9b4ff;font-weight:750}#raceHUD .raceHelp{font-size:11px;color:#a8afbd;margin-bottom:0}#raceNotice{position:fixed;bottom:150px;left:50%;transform:translateX(-50%);z-index:40;max-width:90vw;background:rgba(25,17,21,.94);border:1px solid rgba(255,120,145,.18);color:#ffb2c1;padding:11px 16px;border-radius:12px;text-align:center;box-shadow:0 12px 32px rgba(0,0,0,.25);backdrop-filter:blur(10px)}#raceNotice:empty{display:none}#raceHUD button:focus-visible{outline:2px solid #b99aff;outline-offset:2px}
#raceLane{display:flex;align-items:center;gap:10px;margin:12px 0;font-size:11px;font-weight:800;color:#c9b5ff}#raceLane>div{position:relative;flex:1;height:10px;background:repeating-linear-gradient(90deg,rgba(181,160,231,.28) 0,rgba(181,160,231,.28) 24%,rgba(255,255,255,.07) 24%,rgba(255,255,255,.07) 25%);border-radius:7px}#raceLane i{position:absolute;top:-3px;width:12px;height:16px;background:#a77df1;border:2px solid #f7f2ff;border-radius:5px;transform:translateX(-50%);transition:left .08s linear;box-shadow:0 2px 8px rgba(119,78,218,.38)}#raceMap{display:block;margin:8px auto;max-width:100%;height:105px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);border-radius:12px}#raceBoard{max-height:220px;overflow:auto}#raceButtons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px}#raceButtons button{touch-action:none;min-height:42px;background:rgba(160,130,229,.14);color:#efe9ff;border:1px solid rgba(196,172,255,.15);border-radius:10px;font:750 13px system-ui}#raceButtons button:active{background:#7e59d8;color:white}#raceHUD [hidden]{display:none!important}#shotFeedback{min-height:18px;margin:8px 0 0;font-weight:800;color:#8ee1c4}

/* Reusable activity interaction prompt — one component for every minigame */
#activityPrompt{position:fixed;left:50%;bottom:28px;z-index:36;display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:14px;width:min(356px,calc(100vw - 32px));padding:14px 16px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:linear-gradient(180deg,rgba(17,20,27,.92),rgba(12,15,21,.90));color:#fff;box-shadow:0 18px 54px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.045);backdrop-filter:blur(13px) saturate(1.12);-webkit-backdrop-filter:blur(13px) saturate(1.12);font:600 13px/1.2 system-ui,sans-serif;appearance:none;text-align:left;cursor:pointer;opacity:0;pointer-events:none;transform:translate(-50%,12px) scale(.96);transition:opacity .22s ease,transform .22s cubic-bezier(.2,.75,.25,1),border-color .18s ease,box-shadow .18s ease}
#activityPrompt[hidden]{display:none!important}#activityPrompt.isVisible{opacity:1;pointer-events:auto;transform:translate(-50%,0) scale(1)}#activityPrompt:hover{border-color:rgba(255,203,124,.24);box-shadow:0 20px 58px rgba(0,0,0,.38),0 0 0 1px rgba(255,172,82,.04)}#activityPrompt:focus-visible{outline:2px solid #d2b4ff;outline-offset:3px}
#activityPrompt .activityIcon{display:grid;place-items:center;width:50px;height:50px;border-radius:14px;background:radial-gradient(circle at 35% 28%,rgba(255,193,111,.28),rgba(126,84,207,.15) 64%,rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.09);box-shadow:inset 0 1px rgba(255,255,255,.055),0 8px 18px rgba(0,0,0,.16)}#activityPrompt .activityIcon svg{width:27px;height:27px;fill:none;stroke:#ffc175;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#activityPrompt .activityCopy{min-width:0;display:flex;flex-direction:column;gap:4px}#activityPrompt .activityCopy strong{font-size:17px;line-height:1.1;letter-spacing:-.25px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#activityPrompt .activityCopy small{font-size:12px;font-weight:500;color:#adb3c0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#activityPrompt .activityAction{display:flex;align-items:center;gap:9px;padding-left:13px;border-left:1px solid rgba(255,255,255,.11);white-space:nowrap}#activityPrompt .activityAction kbd{display:grid;place-items:center;min-width:35px;height:35px;padding:0 7px;border-radius:9px;border:1px solid rgba(255,255,255,.42);background:linear-gradient(#fbfbfc,#d6dae2);color:#262b34;font:850 15px/1 system-ui;box-shadow:0 3px 0 #a6adb7,0 6px 14px rgba(0,0,0,.20);transition:transform .12s ease,box-shadow .12s ease,background .12s ease}#activityPrompt .activityAction b{font-size:13px;letter-spacing:.1px}#activityPrompt.isPressing .activityAction kbd{transform:translateY(2px) scale(.9);box-shadow:0 1px 0 #a6adb7,0 2px 7px rgba(0,0,0,.18);background:#ffd18a}
.activityWorldLabel{position:fixed;top:0;left:0;z-index:18;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:86px;padding:5px 8px;border-radius:9px;background:rgba(14,18,25,.58);border:1px solid rgba(255,255,255,.075);box-shadow:0 7px 20px rgba(0,0,0,.18);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);color:#fff;font:700 10px/1.1 system-ui,sans-serif;text-align:center;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .08s linear}.activityWorldLabel.isVisible{opacity:.78}.activityWorldLabel strong{font-size:10px;text-transform:uppercase;letter-spacing:.45px}.activityWorldLabel span{font-size:10px;color:#d4d9e4;font-weight:600}

@media(max-width:700px){#raceHUD{top:78px;right:10px;width:214px;padding:13px;max-height:47dvh}#raceHUD h2{font-size:18px;margin-top:12px}.raceTop{align-items:flex-start}.raceEyebrow{max-width:90px}#raceHUD li{padding:6px 4px}#raceHUD .raceHelp{font-size:10px}#raceHUD details{display:none}#raceMap{height:70px}#raceBoard{max-height:90px}#raceButtons button{min-height:44px}#raceButtons{position:sticky;bottom:0;width:100%;padding:6px;background:rgba(12,16,24,.94);border-radius:12px}#raceHUD[data-mode="target"]{top:auto;bottom:12px;left:10px;right:10px;width:auto;max-height:190px}#raceHUD[data-mode="target"] h2{font-size:16px;margin:8px 0}#raceHUD[data-mode="target"] #raceBoard{max-height:55px}#raceHUD[data-mode="target"] .raceHelp{display:none}#activityPrompt{bottom:calc(env(safe-area-inset-bottom,0px) + 104px);width:calc(100vw - 32px);max-width:360px;grid-template-columns:46px minmax(0,1fr) auto;padding:12px 13px;gap:11px}#activityPrompt .activityIcon{width:42px;height:42px;border-radius:12px}#activityPrompt .activityIcon svg{width:24px;height:24px}#activityPrompt .activityCopy strong{font-size:15px}#activityPrompt .activityCopy small{font-size:11px}#activityPrompt .activityAction{padding-left:9px;gap:7px}#activityPrompt .activityAction kbd{min-width:32px;height:32px}.activityWorldLabel{padding:5px 7px;min-width:78px}}

#raceStartClock{text-align:center;padding:16px;border-radius:18px;background:linear-gradient(135deg,#35265f,#172a42);border:1px solid #b59bff;margin:12px 0}#raceStartClock>span{display:block;font-size:11px;letter-spacing:.15em}#raceStartClock strong{display:block;font-size:64px;line-height:1.2;font-variant-numeric:tabular-nums}#raceStartClock progress{width:100%;height:7px;accent-color:#ad89ff}.raceLights{display:flex;justify-content:center;gap:10px;margin-top:10px}.raceLights i{width:18px;height:18px;border-radius:50%;background:#4a3652}.raceLights i.lit{background:#ff626e;box-shadow:0 0 18px #ff626e}#raceIdle{background:#57351c;border:1px solid #ffb55d;border-radius:10px;padding:10px;color:#ffe0b2}
