/* roster */
.chip{display:inline-flex;align-items:center;gap:8px;background:#0d0d2c;border:2px solid #3a3a9e;
  color:#ffde00;font-size:9px;padding:9px 11px;margin:0 8px 8px 0;letter-spacing:1px;max-width:100%}
.chip b{color:#ff3b30;cursor:pointer;font-weight:normal;padding-left:4px}
#chips{margin-bottom:14px;line-height:2.6}

/* timer */
#timerwrap{text-align:center;margin-bottom:16px;display:none}
#timerwrap.on{display:block}
#timer{font-size:38px;color:#ffde00;text-shadow:0 0 20px rgba(255,222,0,.7);letter-spacing:3px}
#timer.low{color:#ff3b30;text-shadow:0 0 22px rgba(255,59,48,.8);animation:pulse .5s infinite}
#tbar{height:7px;background:#14143a;margin-top:9px;overflow:hidden}
#tfill{height:100%;width:100%;background:#ffde00;box-shadow:0 0 12px rgba(255,222,0,.8);
  transition:width .25s linear}
@keyframes pulse{50%{opacity:.35}}

/* terminal */
#term{font-size:10px;line-height:2.3;color:#00e676;white-space:pre-wrap;
  text-shadow:0 0 9px rgba(0,230,118,.55);min-height:200px}

/* countdown */
#cd{text-align:center}
#cdgrid{display:flex;justify-content:center;gap:9px;margin:22px 0}
.cdbox{border:3px solid #2121de;padding:13px 8px;min-width:66px;background:rgba(4,4,20,.8);
  box-shadow:inset 0 0 18px rgba(33,33,222,.25)}
.cdnum{font-size:21px;color:#ffde00;text-shadow:0 0 14px rgba(255,222,0,.6)}
.cdlab{font-size:7px;color:#6b6b9e;letter-spacing:2px;margin-top:7px}
#cd-doors-open{font-size:19px;color:#00e676;text-align:center;letter-spacing:3px;
  text-shadow:0 0 20px rgba(0,230,118,.65);margin:22px 0 6px;line-height:1.7}
#coin{width:100%;text-align:center;padding:26px 0;cursor:pointer}
#coin .slot{width:74px;height:11px;background:#0a0a2a;border:3px solid #ffde00;margin:0 auto 14px;
  box-shadow:0 0 18px rgba(255,222,0,.4)}
#coinbtn-wrap{animation:coinIn .5s ease-out}
@keyframes coinIn{
  0%{opacity:0;transform:translateY(18px) scale(.96)}
  60%{transform:translateY(-4px) scale(1.01)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

/* PAC-50 loader */
#ldcv{display:block;width:100%;height:46px;margin-bottom:22px}
#ld-label{font-size:13px;color:#ffde00;letter-spacing:3px;line-height:1.8;
  text-shadow:0 0 14px rgba(255,222,0,.55);margin-bottom:18px}
#ldbar{height:16px;border:3px solid #2121de;background:#05051a;
  box-shadow:0 0 18px rgba(33,33,222,.35);margin-bottom:22px}
#ldfill{height:100%;width:0%;background:#ffde00;box-shadow:0 0 14px rgba(255,222,0,.85)}
#ldlines{font-size:9px;line-height:2.4;color:#00e676;text-align:left;
  text-shadow:0 0 9px rgba(0,230,118,.5);min-height:120px;white-space:pre-wrap}
#ldfoot{margin-top:16px}

/* press & hold */
.hold{position:relative;overflow:hidden}
.hold .fill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.28)}

/* race */
#racecv{display:block;width:100%;height:190px;touch-action:none;background:#02020a}
#racehud{display:flex;justify-content:space-between;align-items:center;border-top:3px solid #2121de;
  background:#08081c;padding:11px 12px;font-size:10px;letter-spacing:2px}
#rdist{color:#ffde00;text-shadow:0 0 10px rgba(255,222,0,.5)}
#rpos{color:#00e676}
#rtime{color:#ff3b30}
#rtime.low{animation:pulse .4s infinite}
.standings div{display:flex;justify-content:space-between;font-size:9px;margin-top:11px;letter-spacing:1px}
.standings .me{color:#ffde00;text-shadow:0 0 10px rgba(255,222,0,.5)}
.standings .other{color:#7a7ab0}

/* distance */
.dbar{height:9px;background:#1a1400;border:2px solid #4a3a00}
.dbar i{display:block;height:100%;background:#ffde00;box-shadow:0 0 12px rgba(255,222,0,.8)}