/* ============================================================
   THEME NEON v n5 - PORT 1:1 dari dummy /tema2/ (Opsi 2 Dark Neon)
   Deep Charcoal #121212 / Neon Purple #B026FF / Cyber Blue #00F0FF / Bright Yellow #FFD700
   ============================================================ */
:root{
  --bg:#121212; --text:#EDEDED; --muted:#9A9A9A;
  --neon:#B026FF; --cyber:#00F0FF; --yellow:#FFD700;
  --card:#1B1B1B; --line:#2B2B2B;
  --brand:#B026FF; --violet:#B026FF; --cyan:#00F0FF; --amber:#FFD700;
}
html,body{background:var(--bg) !important;background-image:none !important;color:var(--text) !important}
.wrap{background:transparent !important}
.topbar,.head,.bar{background:#161616 !important;background-image:none !important;border-bottom:1px solid #2E2E2E !important;box-shadow:0 2px 14px rgba(176,38,255,.18) !important}
.topbar .t,.brand .t,.head h1,.bar .t{color:var(--cyber) !important;text-shadow:0 0 12px rgba(0,240,255,.35) !important}
.card{background:var(--card) !important;background-image:none !important;border:1px solid var(--line) !important;border-radius:16px !important;box-shadow:0 4px 16px rgba(0,0,0,.45) !important}
h1,h2,h3,.card .h,.gm-h2,.gm-ch-name{color:var(--cyber) !important;text-shadow:0 0 10px rgba(0,240,255,.3) !important}
/* .dot: biarkan warna inline (hijau/kuning/merah legend) */
.nav,.op3-nav,.sidenav{background:#161616 !important;background-image:none !important;border-right:1px solid #2E2E2E !important;box-shadow:none !important}
.sn-item,.op3-nav-it{background:#202020 !important;background-image:none !important;border:1px solid var(--line) !important;border-radius:11px !important;color:var(--text) !important;box-shadow:none !important;font-weight:400 !important}
.sn-item.active,.sn-item.on,.op3-nav-it.on{background:#241537 !important;background-image:none !important;border:1px solid var(--neon) !important;color:#fff !important;font-weight:800 !important;box-shadow:0 0 10px rgba(176,38,255,.35) !important}
.sn-group,.sn-head,.op3-nav .g{color:var(--muted) !important;font-size:10.5px !important;letter-spacing:1.5px !important;text-transform:uppercase}
.tabs button{background:#202020 !important;background-image:none !important;border:1px solid var(--line) !important;border-radius:11px !important;color:var(--text) !important;box-shadow:none !important}
.tabs button.active{background:#241537 !important;background-image:none !important;border-color:var(--neon) !important;color:#fff !important;font-weight:800 !important;box-shadow:0 0 10px rgba(176,38,255,.35) !important}
.btn{border-radius:12px !important;font-weight:700 !important}
.btn:not(.sec):not(.sec2):not(.ghost):not(.warn):not(.danger):not(.eye){background:var(--neon) !important;background-image:none !important;color:#fff !important;border:none !important;box-shadow:0 0 14px rgba(176,38,255,.55) !important}
.btn.sec,.btn.sec2{background:transparent !important;color:var(--cyber) !important;border:1px solid rgba(0,240,255,.5) !important;box-shadow:none !important}
.btn.ghost{background:#222 !important;border:1px solid #3A3A3A !important;color:var(--text) !important;box-shadow:none !important}
.pill{background:#20232B !important;color:var(--cyber) !important;border:1px solid rgba(0,240,255,.25) !important;border-radius:999px !important}
.badge.b-good,.chip.ok{background:rgba(0,240,255,.1) !important;color:var(--cyber) !important;border:1px solid rgba(0,240,255,.3) !important}
.badge.b-warn,.chip.warn{background:rgba(255,215,0,.1) !important;color:var(--yellow) !important;border:1px solid rgba(255,215,0,.35) !important}
.badge.b-bad{background:rgba(255,77,109,.12) !important;color:#FF5D7A !important;border:1px solid rgba(255,77,109,.4) !important}
.note{background:rgba(0,240,255,.07) !important;border:1px solid rgba(0,240,255,.3) !important;color:var(--cyber) !important;border-radius:12px !important}
.warnbox,.op3-warn-item{background:rgba(255,215,0,.07) !important;border:1px solid rgba(255,215,0,.35) !important;color:var(--yellow) !important;border-radius:12px !important}
table{border-collapse:collapse}
th{color:var(--muted) !important;font-size:11px !important;letter-spacing:1px !important;border-bottom:2px solid var(--line) !important;background:transparent !important}
td{border-bottom:1px solid var(--line) !important}
tr:nth-child(even) td{background:#1F1F1F !important}
.in{color:var(--cyber) !important;font-weight:700}
.out{color:var(--yellow) !important;font-weight:700}
input,select,textarea{background:#1E1E1E !important;border:1px solid #333 !important;color:var(--text) !important;border-radius:11px !important}
input:focus,select:focus,textarea:focus{border-color:var(--neon) !important;outline:none !important;box-shadow:0 0 10px rgba(176,38,255,.35) !important}
input::placeholder,textarea::placeholder{color:#777 !important}
.op3-bigtitle,.op3-judul{background:#1E1430 !important;border:2px solid var(--neon) !important;border-radius:14px !important;color:#fff !important;box-shadow:0 0 16px rgba(176,38,255,.3), inset 0 0 22px rgba(176,38,255,.12) !important}
.race,.track{background:#191D22 !important;border:1px solid #2C3440 !important}
.lane-time,.timer,.op3-lt{font-family:monospace !important;color:var(--cyber) !important}
.finish{border-color:var(--cyber) !important;box-shadow:0 0 10px rgba(0,240,255,.5) !important}
.kpi,.stat,.sbox,.sw{background:#1E1E1E !important;background-image:none !important;border:1px solid var(--line) !important}
.kpi .l,.stat .l,.sbox .l{color:var(--muted) !important}
.botnav,.fin-nav{background:#161616 !important;border-top:1px solid #2E2E2E !important;box-shadow:0 -3px 14px rgba(176,38,255,.15) !important}
.fin-nav-it{color:var(--muted) !important;background:transparent !important}
.fin-nav-it.on{background:#241537 !important;background-image:none !important;border:1px solid var(--neon) !important;color:#fff !important;box-shadow:0 0 10px rgba(176,38,255,.35) !important}
.muted{color:var(--muted) !important}
.toast{background:#241537 !important;border:1px solid var(--neon) !important;color:#fff !important;box-shadow:0 0 14px rgba(176,38,255,.5) !important}

/* --- n6 patch --- */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 100px #1E1E1E inset !important;-webkit-text-fill-color:#EDEDED !important;caret-color:#EDEDED !important;border:1px solid #333 !important}
#op3BotNav{background:#161616 !important;background-image:none !important;border-right:1px solid #2E2E2E !important;box-shadow:none !important}
#op3BotNav .op3-nav-it{background:#202020 !important}
#op3BotNav .op3-nav-it.on{background:#241537 !important;border-color:#B026FF !important}

/* --- n7 patch --- */
.pill.r{background:rgba(255,77,109,.12) !important;color:#FF5D7A !important;border:1px solid rgba(255,77,109,.4) !important}
.pill.y{background:rgba(255,215,0,.1) !important;color:#FFD700 !important;border:1px solid rgba(255,215,0,.35) !important}
.pill.g{background:rgba(0,240,255,.1) !important;color:#00F0FF !important;border:1px solid rgba(0,240,255,.3) !important}

/* --- n8 patch: ENGINE START bulat metalik ring ungu (persis tema2) --- */
.engineBtn,.btn.engineBtn,button.engineBtn{
  width:50px !important;height:50px !important;min-width:50px !important;padding:0 !important;
  border-radius:50% !important;
  background:radial-gradient(circle at 50% 32%, #4c5055 0%, #33363a 48%, #1c1e21 100%) !important;
  border:2px solid #23262a !important;color:#e9ebed !important;
  box-shadow:0 0 0 2px #B026FF, 0 0 12px 3px rgba(176,38,255,.6), 0 0 0 5px #c9ced4, 0 0 0 6px #585d63, 0 5px 12px rgba(0,0,0,.55) !important;
}
.engineBtn .engineLed,.engineLed{width:15px !important;height:5px !important;border-radius:3px !important;background:#B026FF !important;box-shadow:0 0 8px 2px rgba(176,38,255,.9) !important}
