/* ════════════════════════════════════════════════════════════════════
 * BUILD 140 · 轮盘「赛道」(老板参考图):号码按轮盘上的顺序排成一圈,点一个号 = 押它和左右各 N 个邻居;
 *   里面四块 = 三分之一 / 孤注 / 零旁 / 零区(法式押法)。台面 ⇄ 赛道 在顶栏切。总后台关掉 = 回到 BUILD 139 的旧版(这些都不出现)。
 * ════════════════════════════════════════════════════════════════════ */
/* 顶栏:台面 / 赛道 两段式开关 */
#app .rlwrap .rlview{flex:0 0 auto;display:flex;align-items:center;height:26px;padding:2px;gap:2px;border-radius:99px;border:1px solid var(--stroke);
  background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.015))}
#app .rlwrap .rlview button{position:relative;display:flex;align-items:center;gap:4px;height:20px;padding:0 9px;border-radius:99px;border:0;background:transparent;
  color:var(--muted);font-family:var(--display);font-weight:800;font-size:10.5px;letter-spacing:.05em;cursor:pointer;transition:background .2s,color .2s}
#app .rlwrap .rlview button svg{width:14px;height:14px}
#app .rlwrap .rlview button.on{background:linear-gradient(180deg,#ffe38a,#d4a437);color:#2a1a04;box-shadow:0 0 10px rgba(255,209,102,.35)}
#app .rlwrap .rlview .rlnew{position:absolute;top:-7px;right:-6px;font-style:normal;font:900 8px/1 var(--display);padding:2px 4px;border-radius:6px;background:#e8394a;color:#fff;letter-spacing:.02em;
  box-shadow:0 0 0 1.5px #140f1c;animation:rlnewp 1.6s ease-in-out infinite}
@keyframes rlnewp{50%{transform:scale(1.12)}}

/* 赛道盒子:和台面同一个位置,切过来就把台面藏起来 */
#app .rlwrap .rltrack{display:none;flex:1 1 auto;min-width:0;min-height:0;gap:4px;align-items:stretch}
#app .rlwrap.trk .rltrack{display:flex}
#app .rlwrap.trk .rlboard{display:none}
#app .rlwrap .rltk{position:relative;flex:1 1 auto;min-width:0;min-height:0}
#app .rlwrap .rltk svg{position:absolute;left:0;top:0;display:block;overflow:visible;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
/* 邻居几个:右边一竖排 + / 数字 / −(参考图) */
#app .rlwrap .rlnb{flex:0 0 auto;width:40px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
#app .rlwrap .rlnb i{font-style:normal;font:800 9.5px/1.1 var(--display);color:rgba(235,245,238,.8);letter-spacing:.04em;text-align:center}
#app .rlwrap .rlnb button{width:32px;height:32px;border-radius:50%;border:1.5px solid rgba(255,255,255,.75);background:radial-gradient(circle at 40% 30%,rgba(255,255,255,.22),rgba(0,0,0,.35));
  color:#fff;font:800 19px/1 var(--num);display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.45);transition:transform .12s,opacity .2s}
#app .rlwrap .rlnb button:active{transform:scale(.9)}
#app .rlwrap .rlnb button:disabled{opacity:.3;cursor:default}
#app .rlwrap .rlnb b{min-width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font:900 18px/1 var(--num);color:#ffd166;
  background:rgba(0,0,0,.35);border:1px solid rgba(255,209,102,.45);text-shadow:0 0 8px rgba(255,209,102,.4)}

/* ── SVG 本体 ── */
#app .rltk .tko{fill:rgba(0,0,0,.24);stroke:rgba(255,255,255,.88);stroke-width:1.6}
#app .rltk .tki{fill:rgba(0,0,0,.08);stroke:rgba(255,255,255,.88);stroke-width:1.6}
#app .rltk .tkl{fill:none;stroke:rgba(255,255,255,.7);stroke-width:1.3}
/* 号码格:白线格 + 红 / 黑 / 绿椭圆徽章(和台面同一个样子) */
#app .rltk .tc{cursor:pointer;outline:none}
#app .rltk .tcb{fill:rgba(255,255,255,0);stroke:rgba(255,255,255,.78);stroke-width:1.1;transition:fill .12s}
#app .rltk .tco{stroke:rgba(255,255,255,.28);stroke-width:.8}
#app .rltk .tc.c-red .tco{fill:url(#rlgR)}#app .rltk .tc.c-black .tco{fill:url(#rlgB)}#app .rltk .tc.c-green .tco{fill:url(#rlgG)}
#app .rltk .tcn{fill:#fff;font-family:var(--num);font-weight:800;text-anchor:middle;dominant-baseline:central;letter-spacing:-.03em;pointer-events:none;paint-order:stroke;stroke:rgba(0,0,0,.35);stroke-width:1.2px}
#app .rltk .tc:hover .tcb,#app .rltk .tc:focus-visible .tcb{fill:rgba(255,255,255,.1)}
/* 按着 / 停在一个号上:会押到的那几格先亮 */
#app .rltk .tc.pre .tcb{fill:rgba(255,209,102,.34);stroke:#ffd166;stroke-width:1.6}
#app .rltk .tc.pre .tco{stroke:#fff3c4;stroke-width:1.4}
@keyframes rltcov{0%{fill:rgba(255,245,200,.75)}100%{fill:rgba(255,245,200,0)}}
#app .rltk .tc.cov .tcb{animation:rltcov .55s ease-out}
/* 押了(直注):格子描金边 + 筹码 */
#app .rltk .tc.has .tcb{stroke:#ffd166;stroke-width:1.8;fill:rgba(255,209,102,.12)}
#app .rltk .tch{opacity:0;transition:opacity .14s;pointer-events:none}
#app .rltk .tc.has .tch{opacity:1}
#app .rltk .tch circle{fill:url(#rlgC);stroke:#fff;stroke-width:1.1}
#app .rltk .tch text{fill:#2a1d05;font-family:var(--num);font-weight:900;text-anchor:middle;dominant-baseline:central;letter-spacing:-.04em}
/* 摆上去还没确认:和台面一样 —— 虚线金圈、半透明、轻轻呼吸 */
#app .rltk .tc.staged .tch,#app .rltk .ts.staged .tsc{animation:rltpend 1.5s ease-in-out infinite}
#app .rltk .tc.staged .tch circle,#app .rltk .ts.staged .tsc rect{stroke:#ffd166;stroke-width:1.5;stroke-dasharray:2.6 1.7}
@keyframes rltpend{0%,100%{opacity:.78}50%{opacity:1}}
/* 冷热号:格子外沿一个小点(热 = 橙,冷 = 蓝) */
#app .rltk .tmk{opacity:0;pointer-events:none;stroke:#140f1c;stroke-width:1}
#app .rltk .tc.hot .tmk{opacity:1;fill:#ff8a3a;filter:drop-shadow(0 0 3px rgba(255,138,58,.9))}
#app .rltk .tc.cold .tmk{opacity:1;fill:#4aa3ff;filter:drop-shadow(0 0 3px rgba(74,163,255,.9))}
/* 开出的号 / 中了 / 没中 */
#app .rltk .tc.hit .tcb{fill:rgba(255,255,255,.3);stroke:#fff;stroke-width:2.4}
#app .rltk .tc.hit .tco{stroke:#fff;stroke-width:1.8;filter:drop-shadow(0 0 6px rgba(255,255,255,.95))}
#app .rltk .tc.won .tcb{fill:rgba(95,245,177,.3);stroke:#5ff5b1;stroke-width:2.4}
#app .rltk .tc.lost .tch{opacity:.4}
/* 里面四块 */
#app .rltk .ts{cursor:pointer;outline:none}
#app .rltk .tsb{fill:rgba(255,255,255,0);transition:fill .15s}
#app .rltk .ts:hover .tsb,#app .rltk .ts:focus-visible .tsb{fill:rgba(255,255,255,.07)}
#app .rltk .ts.pre .tsb{fill:rgba(255,209,102,.2)}
#app .rltk .ts.has .tsb{fill:rgba(255,209,102,.1)}
#app .rltk .ts.hit .tsb{fill:rgba(255,255,255,.12)}
#app .rltk .ts.won .tsb{fill:rgba(95,245,177,.2);stroke:#5ff5b1;stroke-width:2.2}
#app .rltk .ts.lost .tsc{opacity:.4}
#app .rltk .tsn{fill:#fff;font-family:var(--display);font-weight:900;text-anchor:middle;dominant-baseline:central;letter-spacing:.06em;pointer-events:none;
  paint-order:stroke;stroke:rgba(0,0,0,.35);stroke-width:2px}
#app .rltk .tsf{fill:rgba(235,245,238,.62);font-family:var(--display);font-weight:700;text-anchor:middle;dominant-baseline:central;letter-spacing:.08em;pointer-events:none}
#app .rltk .tsp{pointer-events:none}
#app .rltk .tsp rect{fill:rgba(0,0,0,.42);stroke:rgba(255,255,255,.22);stroke-width:.8}
#app .rltk .tsp text{fill:#fff;font-family:var(--num);font-weight:800;text-anchor:middle;dominant-baseline:central}
#app .rltk .ts.nopct .tsp{display:none}
#app .rltk .tsc{opacity:0;pointer-events:none;transition:opacity .14s}
#app .rltk .ts.has .tsc{opacity:1}
#app .rltk .tsc rect{fill:url(#rlgC);stroke:#fff;stroke-width:1}
#app .rltk .tsc text{fill:#2a1d05;font-family:var(--num);font-weight:900;text-anchor:middle;dominant-baseline:central}
#app .rltk .tcap{fill:rgba(235,245,238,.45);font-family:var(--display);font-weight:700;text-anchor:middle;letter-spacing:.04em;pointer-events:none}
/* 不在下注时间:点不了(看得到结果) */
#app .rltk svg.off .tc,#app .rltk svg.off .ts{cursor:default;pointer-events:none}
#app .rltk svg.off .tco{opacity:.92}
@media (prefers-reduced-motion:reduce){#app .rlwrap .rlview .rlnew{animation:none}#app .rltk .tc.cov .tcb{animation:none}#app .rltk .tc.staged .tch,#app .rltk .ts.staged .tsc{animation:none;opacity:.9}}
