/* 小鸡过马路 —— 黑金柠檬(design/dark-neon/screens/30–31)
 * 图片只剩角色:小鸡四个姿势、四种车、路障、撞飞的羽毛。
 * 柏油路、车道虚线、井盖圈、标签、按钮全是 CSS。
 * 轨道上的位置还是用设计稿像素算(--u 是一个设计稿像素在屏幕上的大小),这样车和小鸡的比例不变。
 */
.road {
  position: fixed; inset: 0; z-index: 10; overflow: hidden;
  display: flex; flex-direction: column;
  padding: var(--safe-t, 0px) 0 calc(var(--safe-b, 0px) + 10px);
  --lane: 229;            /* 一条车道宽(设计稿像素) */
  --u: calc(min(100vw, var(--app-max-width, 520px)) / 904); /* 按内容宽度排四条道,不是电脑全屏宽 */
  --bg: #0a0a0a; --surface: #151515; --surface-2: #1c1c1c; --line: #242424;
  --ink: #fff; --ink-2: #8a8a8a; --ink-3: #5c5c5c; --neon: #e5ff3d; --neon-ink: #0a0a0a; --bad: #ff5a5a;
  --sans: system-ui, -apple-system, "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--ink); font-family: var(--sans);
  -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;
}
.road[hidden] { display: none; }
.road p, .road h2 { margin: 0; }
.road button { appearance: none; border: 0; margin: 0; font: inherit; color: inherit; background: none; cursor: pointer; }
.road button:focus-visible { outline: 2px solid var(--neon); outline-offset: 2px; }
.road img { -webkit-user-drag: none; pointer-events: none; }

/* ---------- 顶栏 ---------- */
.rd-top { flex: none; display: flex; align-items: center; gap: 12px; padding: 10px 16px; }
.rd-back { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.rd-back svg { width: 20px; height: 20px; }
/* 背景音乐开关:跟返回钮同一颗圆钮,开着点缀黄、关了灰(跟大厅顶上那颗一样) */
.rd-music { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border: 0; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); cursor: pointer; }
/* 颜色要压过上面 .road button { color: inherit } */
.road .rd-music { color: var(--gold); }
.road .rd-music[aria-pressed="false"] { color: var(--ink-2); }
/* 320 宽的小手机:收一点间距和字号,中文名字排得进一行、各语言最多两行 */
@media (max-width: 340px) { .rd-top { gap: 8px; padding-left: 12px; padding-right: 12px; } .rd-title { font-size: 15px; } .rd-bal { padding: 7px 10px; } }
.rd-music svg { width: 20px; height: 20px; }
/* 多了音符钮之后,马来文 / 菲律宾文的名字(Ayam Lintas Jalan)一行放不下:最多折两行,行高压在两颗 40px 圆钮的高度里,
   顶栏不会变高、不会把下面的「走」挤出画面;真放不下第三行才省略号。中文一行,照旧 18px */
.rd-title { flex: 1; min-width: 0; text-align: center; font-size: 18px; font-weight: 700; line-height: 1.1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.rd-bal { flex: none; max-width: 42%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 7px 14px; border-radius: 999px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- 路面 ---------- */
.rd-field { position: relative; flex: 1; min-height: 180px; overflow: hidden; background: #0e0e0e; }
.rd-track { position: absolute; inset: 0 auto 0 0; will-change: transform; transition: transform var(--stepms, 220ms) cubic-bezier(.3, .9, .35, 1); }
.rd-slab { position: absolute; top: 0; bottom: 0; }
/* 起点的人行道:水泥色 + 右边一道路肩 */
.rd-slab.is-walk { background: repeating-linear-gradient(180deg, #202020 0 46px, #1b1b1b 46px 48px); box-shadow: inset -2px 0 0 #2b2b2b; }
/* 车道:柏油 + 左边一条白虚线 */
.rd-slab.is-lane { background: #171717; }
.rd-slab.is-lane::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: repeating-linear-gradient(180deg, rgba(255,255,255,.72) 0 34px, transparent 34px 68px); }

/* 井盖圈:走过的填满黄,脚下这一格描粗黄边,前面的只有一圈暗黄 */
.rd-hole {
  position: absolute; left: calc(var(--cx) * var(--u)); top: 50%;
  width: calc(174 * var(--u)); aspect-ratio: 1; transform: translate(-50%, -50%);
  display: grid; place-items: center; border-radius: 50%;
  background: #121212; box-shadow: inset 0 0 0 1.5px rgba(229, 255, 61, .38);
}
.rd-hole i { display: none; }
.rd-hole b { font-size: calc(40 * var(--u)); font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.rd-hole.is-past { background: var(--neon); box-shadow: none; }
.rd-hole.is-past b { color: var(--neon-ink); }
.rd-hole.is-now { box-shadow: inset 0 0 0 4px var(--neon), 0 0 22px rgba(229, 255, 61, .35); }
.rd-hole.is-now b { color: var(--ink); }
.rd-barrier { position: absolute; left: calc(var(--cx) * var(--u)); top: 16%; width: calc(190 * var(--u)); height: calc(112 * var(--u)); transform: translateX(-50%); background: url(/img/road/night/barrier.webp?v=1) center / 100% 100% no-repeat; opacity: .9; }

/* 小鸡:外框只管站在哪一格(transform 平移,交给合成器跑,不再改 left 每一帧重排);
   里面 .rd-sprite 是姿势图,跳的那一下也是 transform。
   --cx 是第几格的中心(设计稿像素),跟镜头 .rd-track 读同一个 --stepms,一起到位。 */
.rd-chick { position: absolute; left: 0; top: 50%; width: 0; height: 0; z-index: 2; transform: translate3d(calc(var(--cx) * var(--u)), 0, 0); transition: transform var(--stepms, 220ms) cubic-bezier(.3, .9, .35, 1); will-change: transform; }
.rd-chick i { position: absolute; left: 0; top: 0; }
/* 脚下一块固定的影子。以前是 filter:drop-shadow,每换一次姿势整只小鸡要重算一次模糊 */
.rd-chick .rd-shadow { width: calc(120 * var(--u)); height: calc(26 * var(--u)); transform: translate(-50%, calc(46 * var(--u))); border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); }
.rd-chick .rd-sprite { width: calc(var(--cw) * var(--u)); height: calc(190 * var(--u)); transform: translate(-50%, -66%); background: center bottom / contain no-repeat; }
.rd-chick.is-idle .rd-sprite { background-image: url(/img/road/chick-idle.webp?v=1); --cw: 130; }
.rd-chick.is-hop .rd-sprite { background-image: url(/img/road/chick-hop.webp?v=1); --cw: 202; animation: rd-hop var(--stepms, 220ms) ease-out; }
.rd-chick.is-win .rd-sprite { background-image: url(/img/road/chick-win.webp?v=1); --cw: 175; }
.rd-chick.is-hit .rd-sprite { background-image: url(/img/road/chick-hit.webp?v=1); --cw: 236; height: calc(152 * var(--u)); transform: translate(-50%, -46%); }
@keyframes rd-hop { 0%, 100% { transform: translate(-50%, -66%) translateY(0); } 45% { transform: translate(-50%, -66%) translateY(calc(-42 * var(--u))); } }

/* 车:从道上方开下来。怎么开由 road.js 用 Web Animations 驱动(只动 transform),这里只给大小和起点;
   没有动画的时候(比如浏览器太旧)车整辆藏在路面上方,不会卡在路中间。
   车高照图的高宽比写死(--ch),图还没下载完车也已经是对的大小 —— 行车的起点终点是按车高算的。 */
.rd-car { position: absolute; left: calc(var(--cx) * var(--u)); top: 0; width: calc(var(--cw) * var(--u)); height: calc(var(--ch) * var(--u)); transform: translate3d(-50%, -101%, 0); will-change: transform; }
.rd-fx { position: absolute; left: calc(var(--cx) * var(--u)); top: 50%; width: calc(230 * var(--u)); height: calc(200 * var(--u)); transform: translate(-50%, -58%); background: url(/img/road/fx-feathers.webp?v=1) center / contain no-repeat; animation: rd-pop .5s ease-out forwards; z-index: 3; pointer-events: none; }
@keyframes rd-pop { from { opacity: 0; transform: translate(-50%, -58%) scale(.5); } 60% { opacity: 1; transform: translate(-50%, -58%) scale(1.12); } to { opacity: 0; transform: translate(-50%, -64%) scale(1.3); } }

/* 结果条:飘在路面上方 */
.rd-flash { position: absolute; left: 16px; right: 16px; top: 16px; z-index: 4; display: grid; justify-items: center; gap: 4px; padding: 16px; border-radius: 20px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line), 0 10px 30px rgba(0, 0, 0, .7); animation: rd-fade .3s ease-out both; }
.rd-flash .rd-big { font-size: 30px; font-weight: 800; color: var(--neon); font-variant-numeric: tabular-nums; }
.rd-flash.is-bad .rd-big { color: var(--bad); }
.rd-flash small { font-size: 13px; color: var(--ink-2); text-align: center; }
/* 撞车那一行只有输掉的钱:红字、比说明字大一号,跟别的游戏的「−RM x」一样 */
.rd-flash .rd-loss { font-size: 17px; font-weight: 800; color: var(--bad); font-variant-numeric: tabular-nums; }
@keyframes rd-fade { from { opacity: 0; transform: translateY(-10px); } }

/* ---------- 信息带 ---------- */
.rd-strip { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; font-size: 13px; color: var(--ink-2); }
.rd-strip b { margin-left: 5px; font-size: 20px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.rd-strip span:last-child b { color: var(--neon); }
.rd-strip b.plain { color: var(--ink); }  /* 撞在第几格是坏消息,不用黄的去强调 */

/* ---------- 控制面板(设计稿 30) ---------- */
.rd-panel { flex: none; display: grid; gap: 10px; padding: 0 16px; }
/* 等服务器的时候不收第二下;等超过 300ms(road.js 的 WAIT_DIM_MS)才变灰,正常网速一步一闪灰反而像卡 */
.rd-panel.rd-busy { pointer-events: none; }
.rd-panel.rd-busy.rd-wait { opacity: .55; }
.rd-levels { display: flex; gap: 8px; }
.rd-level { flex: 1; min-width: 0; min-height: 40px; border-radius: 999px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); font-size: 14px; font-weight: 700; }
.rd-level.is-on { background: var(--neon); color: var(--neon-ink); box-shadow: none; }
.rd-level:disabled { opacity: .4; }

.rd-betrow { display: flex; align-items: stretch; gap: 8px; }
.rd-step { display: grid; place-items: center; width: 56px; flex: none; border-radius: 999px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); font-size: 24px; font-weight: 700; }
.rd-step:disabled { opacity: .35; }
.rd-bet { flex: 1; min-width: 0; display: grid; justify-items: center; align-content: center; gap: 1px; min-height: 60px; border-radius: 18px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.rd-bet small { font-size: 11px; color: var(--ink-2); }
.rd-bet b { font-size: 24px; font-weight: 800; font-variant-numeric: tabular-nums; }

.rd-quick { display: flex; gap: 8px; }
.rd-qbtn { flex: 1; min-width: 0; min-height: 38px; border-radius: 999px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rd-qbtn.is-on { box-shadow: inset 0 0 0 1px var(--neon); color: var(--neon); }
.rd-qbtn:disabled { opacity: .35; }

.rd-acts { display: flex; gap: 8px; }
.rd-btn { flex: 1; display: grid; justify-items: center; align-content: center; gap: 1px; min-height: 62px; border-radius: 18px; font-weight: 800; }
.rd-btn span { font-size: 18px; }
.rd-btn small { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rd-btn.ghost { background: var(--surface); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5); }
.rd-btn.primary { flex: 1.15; background: var(--neon); color: var(--neon-ink); font-size: 26px; }
.rd-btn:active:not(:disabled) { transform: scale(.985); }
.rd-btn:disabled { opacity: .35; }

.rd-hint { padding: 2px 0 0; font-size: 12px; color: var(--ink-3); text-align: center; }

/* 手机开了「减少动态效果」(iPhone:设置 → 辅助功能 → 动态效果)时:
   车流、小鸡跳格、镜头跟随是这个游戏本身,不是装饰 —— 关掉它们车就停在路口不动、小鸡瞬移(2026-09-27 玩家录屏「车子是不会动的」)。
   regal.css 有一条全站 `* { animation: none !important; transition: none !important }`,这里用更具体的选择器把这几样还回去;
   车流是 road.js 用 Web Animations 跑的,那条规则管不到,不用还。
   只有撞车的羽毛特效、结果浮层这种装饰性的继续关掉。 */
@media (prefers-reduced-motion: reduce) {
  .rd-fx, .rd-flash { animation: none; }
  /* 夜城那套装饰(呼吸光圈、光点、撞车震动和红光)照样关;::before/::after 不吃全站那条 *,写在这里要带 !important 才压得过后面的定义 */
  .rd-hole.is-now::after, .rd-chick.is-idle .rd-sprite, .rd-burst i, .rd-field.is-shake { animation: none !important; }
  .rd-field.is-shake::before { display: none; }
  .rd-chick { transition: transform var(--stepms, 220ms) cubic-bezier(.3, .9, .35, 1) !important; }
  .rd-chick.is-hop .rd-sprite { animation: rd-hop var(--stepms, 220ms) ease-out !important; }
  .rd-track { transition: transform var(--stepms, 220ms) cubic-bezier(.3, .9, .35, 1) !important; }
}
@media (max-height: 700px) {
  .rd-panel { gap: 8px; }
  .rd-btn { min-height: 54px; }
  .rd-bet { min-height: 54px; }
}
/* 赢大了那一下的光要压得过 theme.css 里的基础光晕,所以选择器要够具体 */
.rd-flash .rd-big.is-big { text-shadow: 0 0 26px rgba(229, 255, 61, .55); }

/* ==========================================================================
   10-15 改版「霓虹夜城」(老板从三个方向里选了 A;图由 Higgsfield 出,放在 /img/road/night/)
   只换外观:路面、人行道、井盖、车、路障、光影和几段演出。车流 / 碰撞 / 镜头的时间计算一律没动。
   图片网址要跟 road.js 的 PRELOAD 一字不差(NIGHT + ?v=1),不然等于没预载。
   ========================================================================== */
.rd-field { background: #050506; isolation: isolate; }
/* 暗角 + 上方一层薄雾:路面不再是一块平的黑,四周压暗、中间那一排井盖最亮 */
.rd-field::after {
  content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background:
    radial-gradient(120% 70% at 50% 50%, transparent 55%, rgba(0, 0, 0, .55) 100%),
    linear-gradient(180deg, rgba(5, 5, 6, .55) 0%, transparent 18%, transparent 82%, rgba(5, 5, 6, .6) 100%);
}
/* 湿柏油:贴图接着上一条道铺(--x 是这条道的起点),所以倒影不会每条道一模一样 */
.rd-slab.is-lane {
  background: #0b0b0c url(/img/road/night/asphalt.webp?v=1) repeat;
  background-size: calc(512 * var(--u)) calc(512 * var(--u));
  background-position: calc(var(--x, 0) * -1 * var(--u)) 0;
}
/* 车道白虚线带一点光,像被路灯照到 */
.rd-slab.is-lane::before { width: 3px; background: repeating-linear-gradient(180deg, rgba(255, 255, 255, .82) 0 34px, transparent 34px 68px); box-shadow: 0 0 6px rgba(255, 255, 255, .28); }
/* 起点人行道:水泥砖 + 右边路肩那条柠檬线(图里自带) */
.rd-slab.is-walk { background: #121212 url(/img/road/night/sidewalk.webp?v=1) repeat-y; background-size: 100% auto; box-shadow: none; }

/* 井盖:金属井盖图 + 倍数。前面的暗、只有字发亮;下一格一圈柠檬色在呼吸;走过的整块亮成柠檬色 */
.rd-hole { background: none; box-shadow: none; }
.rd-hole::before {
  content: ''; position: absolute; inset: 0; border-radius: 50%;
  background: url(/img/road/night/manhole.webp?v=1) center / contain no-repeat;
  filter: brightness(.62) saturate(.8);
  transition: filter .3s ease, transform .3s ease;
}
.rd-hole b { position: relative; padding: calc(4 * var(--u)) calc(14 * var(--u)); border-radius: 999px; background: rgba(8, 8, 9, .78); color: var(--neon); font-size: calc(38 * var(--u)); text-shadow: 0 0 calc(10 * var(--u)) rgba(229, 255, 61, .45); transition: background .3s ease, color .3s ease; }
.rd-hole.is-now::before { filter: brightness(.95); }
.rd-hole.is-now { box-shadow: 0 0 0 calc(5 * var(--u)) var(--neon), 0 0 calc(30 * var(--u)) rgba(229, 255, 61, .45); }
/* 呼吸光圈放在 ::after 上只动透明度和缩放(动 box-shadow 每帧都要重画,便宜手机会卡) */
.rd-hole.is-now::after { content: ''; position: absolute; inset: calc(-22 * var(--u)); border-radius: 50%; pointer-events: none; background: radial-gradient(circle, rgba(229, 255, 61, 0) 54%, rgba(229, 255, 61, .5) 64%, rgba(229, 255, 61, 0) 78%); animation: rd-breathe 1.4s ease-in-out infinite; will-change: opacity, transform; }
.rd-hole.is-now b { background: rgba(8, 8, 9, .86); color: #fff; }
.rd-hole.is-past { background: radial-gradient(circle, rgba(244, 255, 120, .95) 0 48%, rgba(229, 255, 61, .85) 62%, rgba(229, 255, 61, 0) 72%); box-shadow: 0 0 calc(38 * var(--u)) rgba(229, 255, 61, .5); }
.rd-hole.is-past::before { filter: brightness(1.15) sepia(1) hue-rotate(20deg) saturate(3.2); opacity: .55; mix-blend-mode: multiply; }
.rd-hole.is-past b { background: rgba(10, 10, 10, .12); color: var(--neon-ink); text-shadow: none; }
@keyframes rd-breathe { 0%, 100% { opacity: .35; transform: scale(.94); } 50% { opacity: 1; transform: scale(1.06); } }

/* 路障换成夜景那张(黑柠檬斜纹 + 一盏琥珀警示灯) */
.rd-barrier { opacity: 1; filter: drop-shadow(0 calc(10 * var(--u)) calc(12 * var(--u)) rgba(0, 0, 0, .7)); }

/* 车:车灯往前(画面下方)洒一片暖光、底下一圈影子。只是滤镜,不改车的大小,碰撞时机照旧 */
.rd-car { filter: drop-shadow(0 calc(46 * var(--u)) calc(30 * var(--u)) rgba(255, 236, 190, .3)); }

/* 小鸡:跳的时候先蹲、腾空拉长、落地压扁再弹回(squash & stretch);影子在最高点缩小变淡 */
.rd-chick .rd-sprite { transform-origin: 50% 100%; }
@keyframes rd-hop {
  0% { transform: translate(-50%, -66%) translateY(0) scale(1, 1); }
  14% { transform: translate(-50%, -66%) translateY(0) scale(1.08, .9); }
  45% { transform: translate(-50%, -66%) translateY(calc(-46 * var(--u))) scale(.95, 1.07); }
  82% { transform: translate(-50%, -66%) translateY(0) scale(1.07, .92); }
  100% { transform: translate(-50%, -66%) translateY(0) scale(1, 1); }
}
.rd-chick.is-hop .rd-shadow { animation: rd-hop-shadow var(--stepms, 220ms) ease-out; }
@keyframes rd-hop-shadow { 45% { transform: translate(-50%, calc(46 * var(--u))) scale(.68); opacity: .55; } }
/* 站着的时候轻轻呼吸,不是一张死图 */
.rd-chick.is-idle .rd-sprite { animation: rd-idle 2.4s ease-in-out infinite; }
@keyframes rd-idle { 0%, 100% { transform: translate(-50%, -66%) scale(1, 1); } 50% { transform: translate(-50%, -66%) scale(1.015, .985); } }
/* 赢了:身后一圈柠檬光 */
.rd-chick.is-win .rd-shadow { background: radial-gradient(closest-side, rgba(229, 255, 61, .55), rgba(229, 255, 61, 0)); width: calc(220 * var(--u)); height: calc(60 * var(--u)); }

/* 撞上那一下:整块路面震一下 + 一层红光(road.js showFeathers 加 is-shake) */
.rd-field.is-shake { animation: rd-shake .42s cubic-bezier(.36, .07, .19, .97); }
.rd-field.is-shake::before { content: ''; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: radial-gradient(80% 60% at 50% 50%, rgba(255, 70, 70, .35), rgba(255, 40, 40, 0) 70%); animation: rd-redflash .5s ease-out forwards; }
@keyframes rd-shake {
  10%, 90% { transform: translate(-2px, 0); } 20%, 80% { transform: translate(4px, 1px); } 30%, 50%, 70% { transform: translate(-6px, -1px); } 40%, 60% { transform: translate(6px, 1px); }
}
@keyframes rd-redflash { from { opacity: 1; } to { opacity: 0; } }

/* 结果条:半透明玻璃 + 柠檬描边;赢了从中间迸出一圈柠檬光点 */
.rd-flash { background: rgba(14, 14, 15, .92); box-shadow: inset 0 0 0 1px rgba(229, 255, 61, .35), 0 12px 34px rgba(0, 0, 0, .6); overflow: visible; }
.rd-flash.is-bad { box-shadow: inset 0 0 0 1px rgba(255, 90, 90, .45), 0 12px 34px rgba(0, 0, 0, .6); }
.rd-flash .rd-big { font-size: 34px; }
.rd-burst { position: absolute; left: 50%; top: 42%; width: 0; height: 0; pointer-events: none; }
.rd-burst i { position: absolute; left: 0; top: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 8px rgba(229, 255, 61, .8); opacity: 0; animation: rd-spark .9s cubic-bezier(.15, .7, .3, 1) forwards; }
.rd-burst i:nth-child(3n) { width: 5px; height: 5px; background: #fff; }
.rd-burst i:nth-child(1) { --a: 0deg; } .rd-burst i:nth-child(2) { --a: 26deg; } .rd-burst i:nth-child(3) { --a: 51deg; } .rd-burst i:nth-child(4) { --a: 77deg; }
.rd-burst i:nth-child(5) { --a: 103deg; } .rd-burst i:nth-child(6) { --a: 129deg; } .rd-burst i:nth-child(7) { --a: 154deg; } .rd-burst i:nth-child(8) { --a: 180deg; }
.rd-burst i:nth-child(9) { --a: 206deg; } .rd-burst i:nth-child(10) { --a: 231deg; } .rd-burst i:nth-child(11) { --a: 257deg; } .rd-burst i:nth-child(12) { --a: 283deg; }
.rd-burst i:nth-child(13) { --a: 309deg; } .rd-burst i:nth-child(14) { --a: 334deg; }
@keyframes rd-spark {
  0% { opacity: 1; transform: rotate(var(--a)) translateX(0) scale(1); }
  70% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--a)) translateX(120px) scale(.4); }
}

/* 面板:跟舞台同一套光 —— 选中的难度、走! 按钮带一点柠檬光晕 */
.rd-level.is-on { box-shadow: 0 0 16px rgba(229, 255, 61, .35); }
.rd-btn.primary { box-shadow: 0 6px 22px rgba(229, 255, 61, .28), inset 0 -3px 0 rgba(0, 0, 0, .12); }
.rd-btn.primary:not(:disabled):active { box-shadow: 0 2px 10px rgba(229, 255, 61, .3); }