:root{--bg:#0b0f17;--panel:#131a26;--panel2:#18202f;--line:#243044;--txt:#e6ecf5;--mut:#8b9ab1;--acc:#22c55e;--acc2:#3b82f6;--red:#ef4444;--amb:#f59e0b}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font:15px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
header{background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
header .wrap{display:flex;align-items:center;gap:26px;height:62px}
.brand{font-weight:800;font-size:19px;letter-spacing:-.4px}
.brand span{color:var(--acc)}
.brand.big{font-size:28px;margin:0 0 4px}
header nav{display:flex;gap:20px;flex:1;flex-wrap:wrap}
header nav a{color:var(--mut);font-weight:500;padding:6px 0;border-bottom:2px solid transparent}
header nav a:hover{color:var(--txt)}
header nav a.on{color:var(--txt);border-bottom-color:var(--acc)}
.out{color:var(--mut);font-size:14px}
main{padding:28px 20px 60px}
footer{border-top:1px solid var(--line);padding:18px 0;color:var(--mut);font-size:13px}
h1{font-size:24px;margin:0 0 4px}
h2{font-size:17px;margin:0 0 14px}
.muted{color:var(--mut)}
.sub{color:var(--mut);margin:0 0 22px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:18px}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.g2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.stat .k{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.6px}
.stat .v{font-size:26px;font-weight:700;margin-top:4px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.5px}
tr:last-child td{border-bottom:0}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid}
.badge.active{color:var(--acc);border-color:#1e5b38;background:#0f2c1d}
.badge.inactive{color:var(--mut);border-color:var(--line);background:var(--panel2)}
.badge.live{color:var(--red);border-color:#5b1e1e;background:#2c0f0f}
.badge.paper{color:var(--acc2);border-color:#1e3a5b;background:#0f1c2c}
label{display:block;margin-bottom:14px;font-size:13px;color:var(--mut);font-weight:600}
input,select,textarea{width:100%;margin-top:6px;background:var(--panel2);border:1px solid var(--line);color:var(--txt);border-radius:9px;padding:10px 12px;font:inherit}
textarea{min-height:76px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--acc2)}
.btn{display:inline-block;border:1px solid var(--line);background:var(--panel2);color:var(--txt);border-radius:9px;padding:10px 16px;font:inherit;font-weight:600;cursor:pointer}
.btn:hover{border-color:var(--mut)}
.btn.primary{background:var(--acc);border-color:var(--acc);color:#04220f}
.btn.danger{background:transparent;border-color:#5b1e1e;color:#f87171}
.btn.sm{padding:6px 11px;font-size:13px}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.row>*{flex:1;min-width:160px}
.row.tight>*{flex:0 0 auto;min-width:0}
.flash{padding:11px 14px;border-radius:9px;margin-bottom:18px;font-size:14px;border:1px solid}
.flash.ok{background:#0f2c1d;border-color:#1e5b38;color:#86efac}
.flash.err{background:#2c0f0f;border-color:#5b1e1e;color:#fca5a5}
.flash.warn{background:#2c220f;border-color:#5b451e;color:#fcd34d}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;flex-wrap:wrap}
body.auth{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.auth-card{width:100%;max-width:390px;margin:0}
pre{background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:14px;overflow:auto;font-size:13px;margin:0}
code{background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:13px}
.lvl{font-size:12px;font-weight:700;text-transform:uppercase}
.lvl.error{color:#f87171}.lvl.order{color:#f59e0b}.lvl.signal{color:#60a5fa}.lvl.info{color:var(--mut)}.lvl.warn{color:#fcd34d}

/* charts + history */
.chartwrap { position: relative; background: #0f1620; border: 1px solid var(--line); border-radius: 8px; padding: 10px; }
#chart, .bpchart { width: 100%; height: 420px; display: block; cursor: crosshair; }
.readout { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--mut); min-height: 20px; padding: 4px 2px 10px; }
.readout b { color: var(--txt); font-weight: 600; }
.readout .ro-t { color: var(--txt); font-weight: 600; }
.readout .up { color: #26a66d; }
.readout .dn { color: #e24a4a; }
.legend { display: flex; gap: 14px; font-size: 12px; color: var(--mut); padding: 6px 2px 0; }
.legend .sw { display: inline-block; width: 12px; height: 3px; border-radius: 2px; vertical-align: middle; margin-right: 5px; }
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin-bottom: 14px; }
.toolbar .fld { display: flex; flex-direction: column; gap: 4px; }
.toolbar label { font-size: 11px; color: var(--mut); text-transform: uppercase; letter-spacing: .04em; }
.toolbar input, .toolbar select { min-width: 130px; }
.tf { display: inline-flex; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.tf a { padding: 7px 12px; font-size: 13px; color: var(--mut); text-decoration: none; border-right: 1px solid var(--line); }
.tf a:last-child { border-right: 0; }
.tf a.on { background: var(--acc); color: #06101a; font-weight: 600; }
.buy { color: #26a66d; font-weight: 600; }
.sell { color: #e24a4a; font-weight: 600; }
.pl-pos { color: #26a66d; }
.pl-neg { color: #e24a4a; }
.statgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.statgrid .card { padding: 12px 14px; }
.statgrid .k { font-size: 11px; color: var(--mut); text-transform: uppercase; letter-spacing: .04em; }
.statgrid .v { font-size: 20px; font-weight: 600; margin-top: 4px; }
.pill { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 11px; border: 1px solid var(--line); color: var(--mut); }
.watch td { cursor: pointer; }
.watch tr:hover td { background: #16202c; }
.nowrap { white-space: nowrap; }

/* block strategy forms */
.f{display:flex;flex-direction:column;gap:4px;font-size:13px}
.f>span{color:var(--mut);font-size:12px}
.f>em{color:var(--mut);font-size:11px;font-style:normal;line-height:1.35}
.f input,.f select{background:var(--panel2);border:1px solid var(--line);color:var(--txt);
  border-radius:6px;padding:7px 8px;font-size:13px;width:100%}
.f input:focus,.f select:focus{outline:none;border-color:var(--acc2)}
.f.cb{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px}
.f.cb input{width:auto}
.f.cb>span{color:var(--txt);font-size:13px}
.f.cb>em{width:100%}
.grid{display:grid;gap:14px}
.grid.g2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.g4{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
table.wide{width:100%;border-collapse:collapse;font-size:13px}
table.wide th{text-align:left;color:var(--mut);font-weight:600;font-size:11px;
  text-transform:uppercase;letter-spacing:.4px;padding:8px 10px;border-bottom:1px solid var(--line)}
table.wide td{padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.wide tr:last-child td{border-bottom:none}

.statgrid .stat .v{font-size:18px;line-height:1.3;word-break:break-word}
.statgrid .stat{min-width:0}
.card>.head{margin-bottom:12px}
.row.tight{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}

/* ================= responsive / mobile ================= */
.navtog{display:none}
.burger{display:none}
.navout{display:none}
.navscrim{display:none}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
img,canvas,svg{max-width:100%}
@media (max-width:900px){
  html{-webkit-text-size-adjust:100%}
  .wrap{padding:0 14px}
  main{padding:16px 14px 46px}
  header .wrap{position:relative;height:56px;gap:10px}
  .brand{font-size:17px}
  .burger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    margin:0 0 0 auto;width:44px;height:44px;border:1px solid var(--line);border-radius:10px;
    background:var(--panel2);cursor:pointer;flex:0 0 auto}
  .burger i{display:block;width:18px;height:2px;background:var(--txt);border-radius:2px;transition:.18s}
  #navtog:checked ~ .burger i:nth-child(1){transform:translateY(7px) rotate(45deg)}
  #navtog:checked ~ .burger i:nth-child(2){opacity:0}
  #navtog:checked ~ .burger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  header nav{display:none;position:absolute;left:0;right:0;top:56px;flex-direction:column;gap:0;
    background:var(--panel);border:1px solid var(--line);border-top:0;border-radius:0 0 14px 14px;
    padding:4px 0;box-shadow:0 18px 44px rgba(0,0,0,.55);z-index:20;
    max-height:calc(100vh - 76px);overflow-y:auto}
  #navtog:checked ~ nav{display:flex}
  header nav a{padding:13px 18px;border-bottom:1px solid var(--line);font-size:15px;color:var(--txt)}
  header nav a:last-child{border-bottom:0}
  header nav a.on{color:var(--acc);border-bottom-color:var(--line);background:rgba(34,197,94,.08)}
  .out{display:none}
  .navout{display:block;color:var(--red)}
  #navtog:checked ~ .navscrim{display:block;position:fixed;left:0;right:0;top:56px;bottom:0;
    background:rgba(0,0,0,.45);z-index:10;margin:0}
  h1{font-size:20px}
  h2{font-size:16px}
  .brand.big{font-size:24px}
  .sub{font-size:14px;margin:0 0 16px}
  .card{padding:14px;border-radius:12px;margin-bottom:14px}
  .stat{padding:13px 14px;border-radius:12px}
  .stat .v,.statgrid .stat .v{font-size:20px}
  .statgrid{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:10px}
  .grid,.grid.g2,.grid.g4{grid-template-columns:1fr;gap:12px}
  .g2,.g4{grid-template-columns:1fr}
  .row{gap:10px}
  .row>*{min-width:100%;flex:1 1 100%}
  .row.tight>*{min-width:0;flex:0 0 auto}
  .head,.card>.head{flex-wrap:wrap;gap:8px}
  .btn{padding:11px 15px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
  .btn.sm{min-height:38px;padding:8px 12px}
  input,select,textarea{font-size:16px}
  .f input,.f select{font-size:16px;padding:9px 10px}
  th,td{padding:10px 8px}
  table{font-size:13px}
  .tscroll.tw table{width:auto;min-width:100%}
  .tscroll.tw th,.tscroll.tw td{white-space:nowrap}
  table.wide{min-width:620px}
  table.wide th,table.wide td{white-space:nowrap}
  #chart,.bpchart{height:300px}
  .chartwrap{padding:6px}
  .toolbar{gap:8px}
  .toolbar .fld{flex:1 1 46%;min-width:0}
  .tf{width:100%}
  .tf a{flex:1;text-align:center}
  .readout{gap:10px;font-size:11px}
  .legend{gap:10px;flex-wrap:wrap}
  .auth-card{margin:24px 14px;padding:20px;max-width:none}
  pre{font-size:12px;overflow-x:auto}
  footer{font-size:12px}
}
@media (max-width:430px){
  .statgrid{grid-template-columns:1fr 1fr}
  .stat .v,.statgrid .stat .v{font-size:18px}
  h1{font-size:18px}
  .brand{font-size:16px}
  .toolbar .fld{flex:1 1 100%}
  #chart,.bpchart{height:260px}
}
@media (max-width:900px){
  .grid.g4:has(> .stat),.grid.g2:has(> .stat){grid-template-columns:1fr 1fr}
  table.wide.list{min-width:0}
  table.wide.list th,table.wide.list td{white-space:normal}
  table.wide.list th:nth-child(n+3):nth-child(-n+6),
  table.wide.list td:nth-child(n+3):nth-child(-n+6){display:none}
  table.wide.list td:last-child .row,table.wide.list td:last-child{white-space:nowrap}
  table.wide.list td:last-child .btn{margin:2px 0}
  .tscroll.tw{position:relative}
}
@media (max-width:430px){
  .grid.g4:has(> .stat),.grid.g2:has(> .stat){grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  table.wide.list td:last-child,table.wide.list td:last-child .row{white-space:normal}
  table.wide.list td:last-child{min-width:76px;text-align:right}
  table.wide.list td:last-child .row{gap:4px;justify-content:flex-end}
  table.wide.list td:last-child .row>*{min-width:0;flex:0 0 auto}
  table.wide.list td:last-child .btn,table.wide.list td:last-child button{
    padding:6px 10px;min-height:32px;font-size:12px;margin:2px 0 0 0;width:100%}
  table.wide.list td:last-child form{width:100%}
  table.wide.list th,table.wide.list td{padding:10px 6px}
  table.wide.list td:first-child{word-break:break-word}
}
@media (max-width:900px){
  .row.tight>*{flex:0 1 auto;max-width:100%}
  .row.tight>span,.row.tight>.muted,.row>span.muted{flex:1 1 100%;max-width:100%;min-width:0}
  .card.row.tight{align-items:stretch}
  .card.row.tight>.btn{flex:1 1 auto}
  form .row.tight .btn{min-width:120px}
}
@media (max-width:900px){
  table.logs,table.logs tbody,table.logs tr,table.logs td{display:block;width:auto}
  table.logs thead,table.logs tr:first-child th{display:none}
  table.logs tr{border-bottom:1px solid var(--line);padding:10px 0}
  table.logs tr:last-child{border-bottom:0}
  table.logs td{border:0;padding:1px 0;white-space:normal}
  table.logs td:nth-child(1){display:inline-block;font-size:11px;color:var(--mut);margin-right:10px}
  table.logs td:nth-child(2){display:inline-block;font-size:11px}
  table.logs td:nth-child(3):not(:last-child){display:none}
  table.logs td:last-child{display:block;font-size:13px;color:var(--txt);padding-top:3px}
}

/* --- trade markers on chart --- */
.tradebar{min-height:26px;display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.tr-chip{display:inline-block;font-size:12px;padding:3px 9px;border-radius:999px;
  background:#141c26;border:1px solid #223041;color:#c7d3e1;white-space:nowrap}
.tr-chip.up{border-color:#00b386;color:#00b386}
.tr-chip.dn{border-color:#ff5b5b;color:#ff5b5b}
.sw.tri-up{width:0;height:0;background:transparent!important;border-left:5px solid transparent;
  border-right:5px solid transparent;border-bottom:9px solid #00b386;border-radius:0}
.sw.tri-dn{width:0;height:0;background:transparent!important;border-left:5px solid transparent;
  border-right:5px solid transparent;border-top:9px solid #ff5b5b;border-radius:0}


/* =====================================================================
   BillionProfit UI v3 — full site redesign
   Theme layer: redefines palette, shell, cards, tables, forms, controls.
   Structural rules from the base above are inherited where they work.
   ===================================================================== */

:root{
  --bg:#080b11; --bg2:#0c1119;
  --panel:#111826; --panel2:#161f2f; --panel3:#0b111b;
  --line:#1e2635; --line2:#2b3648;
  --ink:#e9eef6; --ink2:#98a6bc; --ink3:#647389;
  --acc:#10b981; --acc2:#34d399; --acc3:#6ee7b7;
  --blue:#3b82f6; --red:#f43f5e; --red2:#fb7185; --amber:#f59e0b;
  --r:14px; --r2:10px; --r3:8px;
  --sh:0 1px 2px rgba(0,0,0,.5), 0 12px 32px -18px rgba(0,0,0,.9);
}

*{box-sizing:border-box}
body{
  margin:0; min-height:100vh; color:var(--ink);
  background:
    radial-gradient(1100px 520px at 50% -240px, rgba(16,185,129,.10), transparent 62%),
    radial-gradient(820px 460px at 100% -80px, rgba(59,130,246,.07), transparent 58%),
    var(--bg);
  background-attachment:fixed;
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--acc2);text-decoration:none}
a:hover{color:var(--acc3)}
::selection{background:rgba(16,185,129,.28)}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#243044;border-radius:8px;border:3px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#31405a}

/* ---------- shell ---------- */
.wrap{max-width:1340px;margin:0 auto;padding:0 24px}
main.wrap{padding-top:28px;padding-bottom:60px}

header{
  position:sticky;top:0;z-index:60;
  background:rgba(8,11,17,.84);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid var(--line);
}
header .wrap{height:auto;min-height:62px;display:flex;align-items:center;gap:20px}
header .brand{font-size:19px;font-weight:800;letter-spacing:-.025em;color:#fff;flex:0 0 auto}
header .brand span{color:var(--acc)}
header nav{
  flex:1 1 auto;display:flex;flex-wrap:nowrap;gap:2px;padding:9px 0;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;
}
header nav::-webkit-scrollbar{display:none}
header nav a{
  flex:0 0 auto;padding:8px 13px;border-radius:999px;border-bottom:0;
  color:var(--ink2);font-size:13.5px;font-weight:500;white-space:nowrap;
  transition:background .15s,color .15s,box-shadow .15s;
}
header nav a:hover{background:rgba(255,255,255,.06);color:var(--ink)}
header nav a.on{
  background:linear-gradient(180deg,rgba(16,185,129,.22),rgba(16,185,129,.10));
  color:var(--acc2);box-shadow:inset 0 0 0 1px rgba(16,185,129,.34);
}
header .out{flex:0 0 auto;color:var(--ink3);font-size:13.5px;font-weight:500}
header .out:hover{color:var(--red2)}

footer{border-top:1px solid var(--line);margin-top:44px;padding:22px 0 36px;color:var(--ink3);font-size:12.5px}

/* ---------- type ---------- */
h1{font-size:28px;font-weight:750;letter-spacing:-.03em;margin:0 0 6px;color:#fff}
h2{font-size:16px;font-weight:650;letter-spacing:-.012em;margin:0;color:#fff}
.sub{color:var(--ink2);font-size:13.5px;margin:0 0 20px}
.muted{color:var(--ink3)}
.tiny{font-size:11.5px}
code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px}
code{background:var(--panel3);border:1px solid var(--line2);border-radius:6px;padding:1px 6px;color:var(--acc3)}

/* ---------- cards ---------- */
.card{
  position:relative;background:linear-gradient(180deg,var(--panel2),var(--panel));
  border:1px solid var(--line);border-radius:var(--r);
  padding:20px 22px;margin:0 0 18px;box-shadow:var(--sh);
  transition:border-color .18s;
}
.card::before{
  content:"";position:absolute;left:20px;right:20px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);
}
.card:hover{border-color:var(--line2)}
.card>.head,.head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px}

/* ---------- stats ---------- */
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:0 0 18px}
.statgrid .card,.stat{margin:0;padding:17px 19px}
.stat .k,.statgrid .k{font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.stat .v,.statgrid .v,.statgrid .stat .v{
  font-size:27px;font-weight:750;letter-spacing:-.035em;margin-top:7px;
  font-variant-numeric:tabular-nums;color:#fff;line-height:1.15;
}

/* ---------- grids / rows ---------- */
.grid{display:grid;gap:16px}
.grid.g2,.g2{grid-template-columns:repeat(2,1fr)}
.grid.g4,.g4{grid-template-columns:repeat(4,1fr)}
.row{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}
.row.tight{gap:8px;align-items:center}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:0 0 16px}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
th{
  text-align:left;padding:10px 12px;font-size:10.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);
  border-bottom:1px solid var(--line2);background:var(--panel);
  position:sticky;top:0;z-index:2;white-space:nowrap;
}
td{padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.045);color:var(--ink)}
tbody tr{transition:background .12s}
tbody tr:hover td{background:rgba(255,255,255,.038)}
tbody tr:last-child td{border-bottom:0}
.tscroll{overflow:auto;border-radius:var(--r2);border:1px solid var(--line);background:var(--panel)}
.tscroll table{font-size:13px}
.nowrap{white-space:nowrap}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 16px;border-radius:var(--r2);cursor:pointer;
  border:1px solid var(--line2);background:linear-gradient(180deg,#1d2739,#151d2c);
  color:var(--ink);font-size:13.5px;font-weight:600;line-height:1;
  transition:filter .15s,border-color .15s,transform .07s,box-shadow .15s;
}
.btn:hover{filter:brightness(1.2);border-color:#3b4a63}
.btn:active{transform:translateY(1px)}
.btn.primary{
  background:linear-gradient(180deg,var(--acc2),var(--acc));border-color:transparent;
  color:#03241a;box-shadow:0 8px 22px -10px rgba(16,185,129,.9);
}
.btn.danger{
  background:linear-gradient(180deg,var(--red2),var(--red));border-color:transparent;
  color:#3d0614;box-shadow:0 8px 22px -10px rgba(244,63,94,.9);
}
.btn.sm{padding:7px 12px;font-size:12.5px;border-radius:var(--r3)}
.btn.tiny{padding:5px 10px;font-size:11.5px;border-radius:7px}

/* ---------- forms ---------- */
label{display:block;font-size:12px;font-weight:600;color:var(--ink2);margin:0 0 6px}
input,select,textarea{
  width:100%;padding:9px 11px;border-radius:9px;font:inherit;font-size:13.5px;
  background:var(--panel3);border:1px solid var(--line2);color:var(--ink);
  transition:border-color .15s,box-shadow .15s;
}
input::placeholder,textarea::placeholder{color:var(--ink3)}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(16,185,129,.16);
}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--acc)}
.f,.fld{display:flex;flex-direction:column;gap:0}
.cb{display:flex;align-items:center;gap:8px}
.cb>span,.cb>em{font-size:13px;color:var(--ink2);font-style:normal}

/* ---------- badges, pills, flashes ---------- */
.badge,.pill{
  display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  border:1px solid var(--line2);background:rgba(255,255,255,.06);color:var(--ink2);
}
.badge.active{background:rgba(16,185,129,.14);color:var(--acc2);border-color:rgba(16,185,129,.36)}
.badge.inactive{background:rgba(148,163,184,.10);color:var(--ink3);border-color:var(--line2)}
.badge.live{background:rgba(244,63,94,.15);color:#fda4af;border-color:rgba(244,63,94,.4)}
.badge.paper{background:rgba(59,130,246,.15);color:#93c5fd;border-color:rgba(59,130,246,.4)}
.flash{padding:12px 16px;border-radius:var(--r2);margin:0 0 20px;font-size:13.5px;border:1px solid}
.flash.ok{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.34);color:var(--acc3)}
.flash.err{background:rgba(244,63,94,.10);border-color:rgba(244,63,94,.34);color:#fda4af}
.flash.warn{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.34);color:#fcd34d}
.lvl{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.lvl.error{color:var(--red2)}

/* ---------- market semantics ---------- */
.pl-pos,.up,.buy,.tri-up{color:var(--acc2)}
.pl-neg,.dn,.sell,.tri-dn{color:var(--red2)}
.warn{color:var(--amber)}
.danger{color:var(--red2)}

/* ---------- timeframe switcher ---------- */
.tf{display:inline-flex;gap:2px;padding:3px;background:var(--panel3);border:1px solid var(--line2);border-radius:var(--r2)}
.tf a{padding:5px 11px;border-radius:var(--r3);font-size:12.5px;font-weight:600;color:var(--ink2)}
.tf a:hover{background:rgba(255,255,255,.06);color:var(--ink)}
.tf a.on{background:var(--acc);color:#03241a}

/* ---------- charts (colour only, layout untouched) ---------- */
.chartwrap{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#0a0f18;box-shadow:var(--sh)}
.legend{font-size:12px;color:var(--ink2)}
.readout{font-variant-numeric:tabular-nums}

/* ---------- auth ---------- */
body.auth{display:flex;align-items:center;justify-content:center;padding:24px}
.auth-card{width:100%;max-width:390px;margin:0;padding:28px 26px}
.brand.big{font-size:30px;font-weight:800;letter-spacing:-.03em;text-align:center;margin:0 0 4px;color:#fff}
.auth-card .muted{text-align:center;margin:0 0 20px}
.auth-card label{margin-top:14px}
.auth-card .btn{width:100%;margin-top:20px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .wrap{padding:0 16px}
  header .wrap{min-height:56px;gap:12px}
  header nav{overflow:visible;flex-wrap:wrap;padding:0}
  header nav a{border-radius:var(--r3);width:100%;padding:11px 14px}
  header nav a.on{box-shadow:inset 0 0 0 1px rgba(16,185,129,.34)}
  h1{font-size:22px}
  .card{padding:16px;border-radius:12px}
  .statgrid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
  .stat .v,.statgrid .v,.statgrid .stat .v{font-size:21px}
  .grid.g2,.grid.g4,.g2,.g4{grid-template-columns:1fr}
  .btn{min-height:42px}
  th,td{padding:9px 10px}
}
@media (max-width:430px){
  .statgrid{grid-template-columns:1fr 1fr}
  .stat .v,.statgrid .v,.statgrid .stat .v{font-size:19px}
  h1{font-size:19px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- BP-UI-REFRESH ---------- */
:root{
  --r:16px; --r2:12px; --r3:10px;
  --sh:0 1px 1px rgba(0,0,0,.4), 0 10px 30px -18px rgba(0,0,0,.85);
  --glow:0 0 0 1px rgba(16,185,129,.28), 0 8px 26px -14px rgba(16,185,129,.55);
}
h1{letter-spacing:-.035em}
h2{letter-spacing:-.02em}
.card{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 42%),var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);position:relative}
.card::before{content:"";position:absolute;left:14px;right:14px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);pointer-events:none}
.card h2{font-size:15px;letter-spacing:.005em}
.stat{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 55%),var(--panel);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.stat:hover{transform:translateY(-2px);border-color:var(--line2);box-shadow:0 1px 1px rgba(0,0,0,.4),0 16px 34px -20px rgba(0,0,0,.95)}
.stat .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3)}
.stat .v{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.btn{border-radius:999px;transition:transform .14s ease,filter .18s ease,box-shadow .18s ease,background .18s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.primary{background:linear-gradient(180deg,var(--acc2),var(--acc));border-color:transparent;color:#04140d;font-weight:650;box-shadow:var(--glow)}
.btn.danger{box-shadow:0 0 0 1px rgba(244,63,94,.25),0 8px 24px -16px rgba(244,63,94,.8)}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--acc2);outline-offset:2px}
input,select,textarea{border-radius:var(--r3);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
input:focus,select:focus,textarea:focus{border-color:rgba(16,185,129,.55);box-shadow:0 0 0 3px rgba(16,185,129,.14);outline:none}
::placeholder{color:var(--ink3)}
th{font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);font-weight:600}
table tr{transition:background .14s ease}
table tbody tr:hover td,table tr:hover td{background:rgba(255,255,255,.022)}
td{font-variant-numeric:tabular-nums}
.badge{border-radius:999px;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:650;padding:3px 9px}
header nav a{border-radius:999px;transition:background .15s ease,color .15s ease}
.flash{border-radius:var(--r2)}
footer{opacity:.85}


/* ---------- BP-LIVEPL-CSS : profit green / loss red ---------- */
.pl-pos,.up,.buy,.tri-up{color:#22c55e}
.pl-neg,.dn,.sell,.tri-dn{color:#ef4444}
td.bp-ltp,td.bp-pl{font-variant-numeric:tabular-nums;font-weight:600}
td.bp-pl.pl-pos{color:#22c55e}
td.bp-pl.pl-neg{color:#ef4444}
td.bp-ltp{color:var(--txt)}


/* ---------- BP-ACCT-CSS : live broker positions ---------- */
#bp-acct-pos td.bp-a-ltp,#bp-acct-pos td.bp-a-un,#bp-acct-pos td.bp-a-re,#bp-acct-pos td.bp-a-tot{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}
#bp-acct-pos td.pl-pos{color:#22c55e}
#bp-acct-pos td.pl-neg{color:#ef4444}
#bp-acct-pos td.bp-a-ltp{color:var(--txt)}
#bp-acct-ts{font-size:12px}
/* BP-SKIPCHART-CSS */
.skipwrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:14px;align-items:start}
.skiptbl{min-width:0;overflow-x:auto;max-height:420px;overflow-y:auto}
.skiptbl table{margin:0}
tr.skiprow{cursor:pointer}
tr.skiprow:hover td{background:#1b2436}
tr.skiprow.sel td{background:#16304a;box-shadow:inset 2px 0 0 #2962ff}
td.bp-sltp{font-variant-numeric:tabular-nums;font-weight:700;text-align:right;white-space:nowrap}
td.bp-sltp.pos{color:#00b386}
td.bp-sltp.neg{color:#ff5b5b}
.skipchart{min-width:0;border:1px solid #263248;border-radius:10px;background:#0e1420;overflow:hidden}
.bpc-head{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid #263248;background:#131b2a;flex-wrap:wrap}
.bpc-sym{font-weight:800;letter-spacing:.4px;color:#e6edf7;font-size:14px}
.bpc-tf{font-size:11px;font-weight:700;color:#9fb0c9;border:1px solid #2f3d57;border-radius:4px;padding:1px 6px;background:#0e1420}
.bpc-price{font-variant-numeric:tabular-nums;font-weight:800;font-size:16px;color:#00b386;margin-left:auto}
.bpc-ro{font-size:11px;color:#8b9ab3;width:100%;font-variant-numeric:tabular-nums}
.bpc-cv{padding:4px 6px 0}
#bpcCanvas{display:block;width:100%;height:280px}
.bpc-foot{padding:6px 12px 10px;font-size:11px;color:#8b9ab3}
@media (max-width:1100px){.skipwrap{grid-template-columns:minmax(0,1fr)}.skiptbl{max-height:none}}
@media (max-width:700px){#bpcCanvas{height:220px}}

.bpc-price.pos{color:#00b386}
.bpc-price.neg{color:#ff5b5b}

/* BP-TVCHART-CSS */
.skipwrap{grid-template-columns:minmax(0,1fr) minmax(0,660px)}
.skiptbl{max-height:520px}
.bpc-cv{padding:0}
#bpcTv{width:100%;height:480px;border-radius:10px;overflow:hidden;background:#0f1621}
#bpcTv iframe{border:0;display:block;width:100%!important;height:100%!important}
.bpc-tf{white-space:nowrap}
@media (max-width:1250px){.skipwrap{grid-template-columns:minmax(0,1fr)}.skiptbl{max-height:none}}
@media (max-width:700px){#bpcTv{height:360px}}
/* BP-TVIND-CSS */
.bpc-head{align-items:center;flex-wrap:nowrap;min-width:0}/* BP-TVIND-NOWRAP */.bpc-sym{flex:0 0 auto;overflow:visible}.bpc-ro{flex:1 1 0;min-width:0;overflow:hidden}.bpc-max{flex:0 0 auto}
.bpc-price{color:#e6e9ef!important;font-weight:700}
.bpc-net{font-weight:700;font-size:13px;margin-left:10px;white-space:nowrap}
.bpc-net.pos{color:#26a69a}
.bpc-net.neg{color:#ef5350}
.bpc-max{margin-left:auto;background:#1b2333;color:#9fb0c9;border:1px solid #2a3550;border-radius:6px;padding:1px 9px;font-size:15px;line-height:1.5;cursor:pointer}
.bpc-max:hover{background:#243049;color:#fff}
.bpc-ind{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:7px 10px;border-bottom:1px solid #1e2740}
.bpc-ind-lbl{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#6b7a94;margin-right:2px}
.bpc-ind button{background:#161d2b;color:#8b9bb4;border:1px solid #263049;border-radius:999px;padding:3px 11px;font-size:11px;cursor:pointer}
.bpc-ind button:hover{color:#dfe6f2;border-color:#35446b}
.bpc-ind button.on{background:#16324d;color:#5aa9ff;border-color:#2e6ca8}
.skipchart.bpc-full{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9998;margin:0;border-radius:0;background:#0d1320;display:flex;flex-direction:column}
.skipchart.bpc-full .bpc-cv{flex:1;min-height:0}
.skipchart.bpc-full #bpcTv{height:100%}
body.bpc-noscroll{overflow:hidden}
td.bp-sltp{color:#e6e9ef!important;font-weight:600}
td.bp-npts{font-weight:700;white-space:nowrap}
td.bp-npts.pos{color:#26a69a}
td.bp-npts.neg{color:#ef5350}
/* BP-PAPER-CSS */
.pform{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-top:10px}
.pform label{display:flex;flex-direction:column;gap:5px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#8b9bb4}
.pform input,.pform select{background:#111a27;color:#e6e9ef;border:1px solid #263049;border-radius:8px;padding:8px 10px;font-size:14px;min-width:150px}
.pform select{max-width:260px}
.pform .btn{padding:9px 18px}
.ptiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:12px}
.ptile{background:#111a27;border:1px solid #1e2740;border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.ptile .ptl{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#6b7a94}
.ptile b{font-size:19px;font-weight:700;color:#e6e9ef}
.pbadge{font-size:10px;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:2px 9px;vertical-align:middle}
.pbadge.ok{background:#12331f;color:#4ade80;border:1px solid #1f5c37}
.pbadge.run{background:#1a2a44;color:#5aa9ff;border:1px solid #2e6ca8}
.pbadge.err{background:#3a1620;color:#ff6b7a;border:1px solid #7a2a38}
.ptblwrap{overflow-x:auto;margin-top:10px}
table.ptbl{min-width:960px}
table.ptbl td,table.ptbl th{white-space:nowrap}
table.ptbl td.pnet{font-weight:700}
table.ptbl tr.pskip td{opacity:.62}
table.ptbl tr.prcur{background:rgba(41,98,255,.10)}
.btn.tiny{padding:3px 9px;font-size:11px}
/* BP-MOBILE-NAV-FIX */
@media (max-width:900px){
  header .wrap{flex-wrap:wrap;position:relative}
  .burger{display:flex;order:3;margin-left:auto;position:relative;z-index:80}
  header nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;flex-wrap:nowrap;gap:2px;padding:8px 16px 14px;background:rgba(8,11,17,.98);border-bottom:1px solid var(--line);max-height:calc(100vh - 56px);overflow-y:auto;z-index:70}
  #navtog:checked ~ nav{display:flex}
  header nav a{width:100%}
  .navscrim{display:none}
  #navtog:checked ~ .navscrim{display:block;position:fixed;left:0;right:0;top:56px;bottom:0;background:rgba(0,0,0,.55);z-index:65}
}

/* ================= BP-CREATIVE v2 : atmosphere ================= */
:root{
  --bpg:#34d399; --bpb:#4f8cff; --bpr:#ff5d73; --bpa:#ffb454; --bpp:#a855f7;
  --bpmut:#8a94ad; --bpline:rgba(255,255,255,.07);
}
body{
  background:
    radial-gradient(1100px 520px at 12% -8%, rgba(79,140,255,.16), transparent 60%),
    radial-gradient(900px 500px at 92% 4%, rgba(52,211,153,.12), transparent 62%),
    radial-gradient(760px 440px at 50% 112%, rgba(168,85,247,.10), transparent 65%),
    #080b14;
  background-attachment:fixed;
}
main.wrap{animation:bpIn .42s ease both}
@keyframes bpIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes bpSpin{to{transform:rotate(360deg)}}

header{backdrop-filter:blur(14px);background:rgba(10,14,24,.74);border-bottom:1px solid var(--bpline)}
header nav a{border-radius:999px;transition:background .18s,color .18s,transform .18s}
header nav a:hover{transform:translateY(-1px)}

.card{
  background:linear-gradient(180deg,rgba(22,28,44,.86),rgba(15,20,33,.86));
  border:1px solid var(--bpline);
  border-radius:18px;
  box-shadow:0 18px 40px rgba(0,0,0,.34);
  transition:border-color .2s,box-shadow .2s;
}
.card:hover{border-color:rgba(255,255,255,.13)}
.btn{border-radius:999px;transition:transform .15s,box-shadow .2s,filter .2s}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:linear-gradient(135deg,#3ddc97,#2bb3ff);color:#04121f;border:0;font-weight:800;box-shadow:0 8px 22px rgba(45,190,255,.26)}
.btn.danger{background:linear-gradient(135deg,#ff5d73,#ff8a5b);color:#1a0508;border:0;font-weight:800}
input,select,textarea{transition:border-color .18s,box-shadow .18s}
input:focus,select:focus,textarea:focus{border-color:rgba(79,140,255,.55);box-shadow:0 0 0 3px rgba(79,140,255,.15);outline:0}
table tbody tr:hover{background:rgba(255,255,255,.03)}
details>summary{cursor:pointer;list-style:none}
details>summary::-webkit-details-marker{display:none}
.tiny{font-size:11.5px}

/* ---- access token countdown in the header ---- */
.tokchip{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;margin-right:12px;border-radius:999px;
  font-size:12px;font-weight:700;white-space:nowrap;border:1px solid var(--bpline);background:rgba(255,255,255,.04);color:var(--bpmut)}
.tokchip i{width:7px;height:7px;border-radius:50%;background:var(--bpmut);display:inline-block}
.tokchip b{font-variant-numeric:tabular-nums}
.tokchip.ok{color:#9df3d2;border-color:rgba(52,211,153,.3);background:rgba(52,211,153,.08)}
.tokchip.ok i{background:var(--bpg);animation:bpBlink 2.4s infinite}
.tokchip.warn{color:#ffd8a1;border-color:rgba(255,180,84,.36);background:rgba(255,180,84,.09)}
.tokchip.warn i{background:var(--bpa);animation:bpBlink 1s infinite}
.tokchip.bad{color:#ffb3bf;border-color:rgba(255,93,115,.4);background:rgba(255,93,115,.10)}
.tokchip.bad i{background:var(--bpr);animation:bpBlink .7s infinite}
@keyframes bpBlink{0%,100%{opacity:1}50%{opacity:.25}}

/* ================= BP-CREATIVE v2 : the engine bay ================= */
.enginebay{
  position:relative;display:grid;grid-template-columns:190px 1fr 330px;gap:26px;align-items:center;
  padding:26px 28px;margin:0 0 18px;border-radius:22px;overflow:hidden;
  background:linear-gradient(140deg,rgba(20,27,44,.94),rgba(11,15,26,.94));
  border:1px solid var(--bpline);box-shadow:0 24px 60px rgba(0,0,0,.45);
}
.enginebay:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(520px 220px at 13% 50%,rgba(52,211,153,.16),transparent 70%);transition:opacity .6s}
.enginebay.off:before{background:radial-gradient(520px 220px at 13% 50%,rgba(255,93,115,.13),transparent 70%)}
.enginebay>*{position:relative}

.engine{position:relative;width:170px;height:170px;margin:0 auto}
.ering{position:absolute;border-radius:50%;border:2px solid rgba(255,255,255,.09)}
.ering.r1{inset:0;border-top-color:var(--bpg);border-right-color:rgba(52,211,153,.35)}
.ering.r2{inset:19px;border-bottom-color:var(--bpb);border-left-color:rgba(79,140,255,.32)}
.ering.r3{inset:38px;border-top-color:var(--bpp);border-left-color:rgba(168,85,247,.32)}
.enginebay.on .ering.r1{animation:bpSpin 3.4s linear infinite}
.enginebay.on .ering.r2{animation:bpSpin 2.2s linear infinite reverse}
.enginebay.on .ering.r3{animation:bpSpin 1.5s linear infinite}
.enginebay.off .ering{border-color:rgba(255,255,255,.07);border-top-color:rgba(255,93,115,.45)}

.epis{position:absolute;left:50%;top:50%;width:5px;height:40px;margin:-20px 0 0 -2.5px;border-radius:4px;opacity:.22;
  background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,0))}
.epis.p1{transform:rotate(0deg) translateY(-62px)}
.epis.p2{transform:rotate(120deg) translateY(-62px)}
.epis.p3{transform:rotate(240deg) translateY(-62px)}
.enginebay.on .epis{animation:bpFire 1.05s ease-in-out infinite}
.enginebay.on .epis.p2{animation-delay:.35s}
.enginebay.on .epis.p3{animation-delay:.7s}
@keyframes bpFire{0%,100%{opacity:.18}50%{opacity:.95}}

.ecore{position:absolute;inset:55px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 32%,rgba(255,255,255,.13),rgba(8,11,20,.92));border:1px solid var(--bpline)}
.ecore b{font-size:21px;font-weight:900;letter-spacing:1px;line-height:1}
.ecore span{font-size:9px;letter-spacing:2.4px;text-transform:uppercase;color:var(--bpmut);margin-top:3px}
.enginebay.on .ecore{box-shadow:inset 0 0 34px rgba(52,211,153,.32),0 0 24px rgba(52,211,153,.16)}
.enginebay.on .ecore b{color:#5ef0b7}
.enginebay.off .ecore b{color:#ff8a99}

.ebody .ek{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--bpmut)}
.ebody .ev{font-size:38px;font-weight:900;line-height:1.08;margin:3px 0 6px}
.enginebay.on .ebody .ev{color:#5ef0b7}
.enginebay.off .ebody .ev{color:#ff8a99}
.ebody .em{max-width:48ch;margin:0 0 15px}

.ignite{position:relative;display:inline-flex;align-items:center;gap:12px;padding:12px 26px 12px 15px;border:0;border-radius:999px;
  cursor:pointer;font-size:15px;font-weight:800;color:#04121f;
  background:linear-gradient(135deg,#3ddc97,#2bb3ff);box-shadow:0 12px 26px rgba(45,190,255,.28);
  transition:transform .15s,box-shadow .2s,filter .2s}
.ignite:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(45,190,255,.42)}
.ignite:active{transform:translateY(1px) scale(.99)}
.ignite i{width:24px;height:24px;border-radius:50%;display:inline-block;border:3px solid rgba(4,18,31,.7);border-top-color:transparent}
.ignite.on{background:linear-gradient(135deg,#ff5d73,#ff8a5b);color:#1a0508;box-shadow:0 12px 26px rgba(255,93,115,.28)}
.ignite.on:hover{box-shadow:0 16px 34px rgba(255,93,115,.42)}
.ignite.on i{animation:bpSpin 1.5s linear infinite;border-color:rgba(26,5,8,.7);border-top-color:transparent}

.egauges{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.gauge{padding:11px 14px;border-radius:14px;background:rgba(255,255,255,.035);border:1px solid var(--bpline)}
.gauge .gk{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:var(--bpmut)}
.gauge .gv{font-size:21px;font-weight:800;margin-top:3px;font-variant-numeric:tabular-nums}
.gauge .gv small{font-size:13px;font-weight:600}
.gauge .gv.good{color:#5ef0b7}
.gauge .gv.warn{color:var(--bpa)}
.gauge .gv.bad{color:var(--bpr)}
@media(max-width:1040px){
  .enginebay{grid-template-columns:1fr;gap:18px;padding:22px 18px}
  .engine{margin:0 auto}
  .ebody{text-align:center}
  .ebody .em{margin-left:auto;margin-right:auto}
}

/* ================= BP-CREATIVE v2 : advice, viewer, python lab ================= */
.advicecard{border-left:3px solid var(--bpp)}
.advtext{white-space:pre-wrap;line-height:1.68;font-size:14.5px;color:#dbe3f2}
.advtext.big{font-size:15px}
.advicebody{margin-top:4px}
.advmain{border-left:3px solid var(--bpp)}
.bigask{padding:12px 24px;font-size:15px;display:inline-flex;align-items:center;gap:9px}
.bigask i{width:15px;height:15px;border-radius:50%;display:inline-block;border:3px solid rgba(4,18,31,.75);border-top-color:transparent}
.bigask.thinking i{animation:bpSpin .85s linear infinite}
.bigask.thinking{opacity:.7;pointer-events:none}
.advold{border-top:1px solid var(--bpline);padding:2px 0}
.advold summary{padding:10px 0;font-weight:700;color:var(--bpmut)}
.advold summary:hover{color:#fff}
.keycard{border-left:3px solid var(--bpb)}

.viewbar{margin:0 0 16px;padding:12px 16px;border-radius:14px;font-size:13.5px;line-height:1.55;
  background:linear-gradient(90deg,rgba(255,180,84,.15),rgba(255,180,84,.04));
  border:1px solid rgba(255,180,84,.3);color:#ffd8a1}
body.viewer .lockedform{opacity:.45;filter:grayscale(.45)}
body.viewer .ignite{pointer-events:none}
body.viewer .btn.danger{pointer-events:none;opacity:.4}

.pylab{border:1px solid rgba(168,85,247,.26);background:linear-gradient(180deg,rgba(28,21,45,.9),rgba(13,12,24,.92))}
.pylab h2:before{content:"</>";font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#c084fc;margin-right:10px;font-size:15px;opacity:.9}
.pylab .lead{max-width:70ch}
.pylab textarea{background:#080b14;border:1px solid rgba(255,255,255,.10);border-radius:14px;color:#d7e3ff;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.6;padding:14px 16px;tab-size:2}
.pylab textarea:focus{border-color:rgba(168,85,247,.55);box-shadow:0 0 0 3px rgba(168,85,247,.15)}
.pylab .keyrow{margin-top:16px;padding:13px 15px;border-radius:14px;background:rgba(255,255,255,.03);border:1px dashed rgba(255,255,255,.14)}
.pylab .keyrow .f{margin:0}
.pykey-ok{color:#5ef0b7;font-weight:700}
.pykey-no{color:var(--bpa);font-weight:700}

.botcard>summary{padding:10px 12px;margin-top:10px;border-radius:12px;background:rgba(255,255,255,.035);
  border:1px solid var(--bpline);font-weight:700;font-size:13.5px;transition:background .18s,border-color .18s}
.botcard>summary:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)}
.botcard>summary:after{content:" v";opacity:.5}
.botcard[open]>summary:after{content:" ^"}

/* ---- python lab layout + bot card toggles ---- */
.pylab .pytop{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}
.pylab .pyed{display:block;margin:0}
.pylab .pyed>span{display:block;margin-bottom:7px;font-size:11px;letter-spacing:1.6px;text-transform:uppercase;color:var(--bpmut)}
.pylab .pyed textarea{width:100%;display:block;box-sizing:border-box;min-height:300px;resize:vertical}
.pylab .pyact{display:flex;align-items:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.pylab .keyform{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:0}
.pylab .keyform .f{flex:1 1 320px;margin:0}
.pylab .keyform input{width:100%;box-sizing:border-box}
.pylab .keyrow p{margin:10px 0 0}
@media(max-width:820px){.pylab .pytop{grid-template-columns:1fr}}

.botopen{margin-top:12px}
.botopen>summary{padding:11px 14px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--bpline);
  font-size:13.5px;transition:background .18s,border-color .18s}
.botopen>summary:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.17)}
.botopen[open]>summary{background:rgba(79,140,255,.10);border-color:rgba(79,140,255,.3)}
.rulebook{margin-top:14px;border:1px solid var(--bpline);border-radius:12px;padding:2px 14px;background:rgba(255,255,255,.02)}
.rulebook>summary{padding:10px 0;font-size:13.5px}
.pylab .pform{display:block}
.pylab .pform>.f{width:auto}
.pylab .pytop>.f{margin:0;min-width:0}
.pylab .keyform{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:0}

/* ---- phone tuning ---- */
@media(max-width:900px){
  .tokchip{order:2;margin:0 8px 0 auto;font-size:11px;padding:5px 10px}
  header .burger{margin-left:8px}
  .enginebay{padding:20px 16px}
  .engine{width:132px;height:132px}
  .ecore{inset:42px}
  .ecore b{font-size:17px}
  .ering.r2{inset:15px}
  .ering.r3{inset:30px}
  .epis{display:none}
  .ebody .ev{font-size:30px}
  .egauges{grid-template-columns:1fr 1fr;gap:8px}
  .gauge .gv{font-size:18px}
  .ignite{width:100%;justify-content:center;padding:14px 20px}
  .advtext{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .ering,.epis,.ignite i,.tokchip i,main.wrap{animation:none!important}
}

/* ======= POWER UI v2 ======= */
body{position:relative}
body::before{content:"";position:fixed;inset:-20% -10% auto -10%;height:120%;z-index:-2;pointer-events:none;
 background:radial-gradient(38% 30% at 12% 0%,rgba(16,185,129,.16),transparent 70%),radial-gradient(34% 28% at 88% 6%,rgba(56,130,246,.14),transparent 70%),radial-gradient(40% 34% at 50% 100%,rgba(168,85,247,.10),transparent 70%);
 animation:aur 26s ease-in-out infinite alternate;filter:blur(6px)}
@keyframes aur{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(-2%,1.5%,0) scale(1.06)}100%{transform:translate3d(2%,-1%,0) scale(1.02)}}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.35;
 background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
 background-size:54px 54px;mask-image:radial-gradient(80% 60% at 50% 0%,#000,transparent 85%)}
.scrollprog{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;pointer-events:none;background:transparent}
.scrollprog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--acc),var(--blue) 55%,#a855f7);box-shadow:0 0 14px rgba(16,185,129,.7);transition:width .08s linear}
header{position:sticky;top:0;z-index:60;backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);background:linear-gradient(180deg,rgba(9,13,20,.92),rgba(9,13,20,.72));border-bottom:1px solid rgba(255,255,255,.06);transition:box-shadow .25s,border-color .25s}
body.scrolled header{box-shadow:0 14px 40px -22px rgba(0,0,0,.95);border-bottom-color:rgba(16,185,129,.22)}
header nav a{position:relative;transition:color .18s,background .18s,transform .18s}
header nav a:hover{transform:translateY(-1px)}
header nav a.active::after,header nav a[aria-current]::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--acc),var(--blue));box-shadow:0 0 12px rgba(16,185,129,.8)}
.brand{letter-spacing:-.02em}
.brand span{background:linear-gradient(92deg,var(--acc2),#4f8cff 60%,#a855f7);-webkit-background-clip:text;background-clip:text;color:transparent}
.rail{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) 1.6fr;gap:10px;margin:0 0 18px}
.rail .rc{display:flex;flex-direction:column;gap:4px;justify-content:center;padding:11px 13px;min-height:66px;border-radius:12px;text-decoration:none;color:inherit;position:relative;overflow:hidden;
 background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.075);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 26px -20px rgba(0,0,0,.9);transition:transform .18s,border-color .18s,box-shadow .18s}
.rail a.rc:hover{transform:translateY(-2px);border-color:rgba(16,185,129,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 16px 34px -22px rgba(0,0,0,.95),0 0 0 1px rgba(16,185,129,.12)}
.rail .rc::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.10) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s ease}
.rail a.rc:hover::after{transform:translateX(120%)}
.rail .rl{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);font-weight:700;display:flex;align-items:center;gap:6px}
.rail .rl em{font-style:normal;font-variant-numeric:tabular-nums;color:var(--ink2);letter-spacing:.04em}
.rail .rv{font-size:17px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.rail .rv.good{color:var(--acc2)}
.rail .rv.bad{color:var(--red)}
.rail .rv.warn{color:var(--amber)}
.rail .rv.sess{font-size:12.5px;font-weight:700;letter-spacing:0}
.rail .rv.sess.live{color:var(--acc2)}
.rail .rv.sess.soon{color:var(--amber)}
.rail .rv.sess.off{color:var(--ink3)}
.rail .rdot{width:8px;height:8px;border-radius:50%;background:var(--ink3);flex:none;display:inline-block}
.rail .rdot.live{background:var(--acc2);box-shadow:0 0 0 0 rgba(52,211,153,.75);animation:beat 1.9s infinite}
.rail .rdot.dead{background:var(--red);box-shadow:0 0 8px rgba(244,63,94,.7)}
@keyframes beat{0%{box-shadow:0 0 0 0 rgba(52,211,153,.65)}70%{box-shadow:0 0 0 9px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.rail .sessbar{height:4px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:5px}
.rail .sessbar i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,var(--acc),var(--blue));box-shadow:0 0 10px rgba(16,185,129,.6);transition:width .9s linear}
.rise{opacity:0;transform:translateY(14px) scale(.995);transition:opacity .5s cubic-bezier(.2,.7,.2,1),transform .5s cubic-bezier(.2,.7,.2,1)}
.rise.inview{opacity:1;transform:none}
main .card{position:relative;overflow:hidden}
main .card::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);opacity:.8}
main .card:hover{border-color:rgba(255,255,255,.11)}
.btn,button.ignite,.pill{position:relative;overflow:hidden}
.btn.primary{background:linear-gradient(135deg,#10b981,#0ea5e9 130%);border-color:transparent;color:#04120c;font-weight:800;box-shadow:0 10px 26px -14px rgba(16,185,129,.85)}
.btn.primary:hover{filter:brightness(1.07);box-shadow:0 14px 32px -14px rgba(16,185,129,.95)}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%);transform:translateX(-130%);transition:transform .65s ease}
.btn:hover::after{transform:translateX(130%)}
.rip{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:rgba(255,255,255,.45);pointer-events:none;animation:rip .55s ease-out forwards}
@keyframes rip{0%{transform:scale(1);opacity:.55}100%{transform:scale(16);opacity:0}}
main table td.pos{color:var(--acc2);font-weight:700;font-variant-numeric:tabular-nums}
main table td.neg{color:var(--red);font-weight:700;font-variant-numeric:tabular-nums}
main table tbody tr:hover td,main table tr:hover td{background:rgba(255,255,255,.028)}
main table th{position:sticky;top:0;z-index:2;backdrop-filter:blur(6px);background:rgba(12,17,25,.94)}
main .flash.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:130;min-width:280px;max-width:min(560px,92vw);cursor:pointer;
 box-shadow:0 26px 60px -24px rgba(0,0,0,.95);animation:tin .45s cubic-bezier(.2,.8,.2,1)}
@keyframes tin{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
main .flash.toast.gone{opacity:0;transform:translate(-50%,14px);transition:opacity .4s,transform .4s;pointer-events:none}
.palette{position:fixed;inset:0;z-index:200;display:none;background:rgba(4,7,12,.68);backdrop-filter:blur(8px)}
.palette.on{display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;animation:pf .18s ease}
@keyframes pf{from{opacity:0}to{opacity:1}}
.palbox{width:min(520px,92vw);background:linear-gradient(180deg,rgba(24,32,45,.98),rgba(14,20,29,.98));border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.95)}
.palbox input{width:100%;padding:16px 18px;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.08);color:var(--ink);font-size:15px;outline:none}
.pallist{max-height:46vh;overflow:auto;padding:6px}
.pallist a{display:block;padding:10px 13px;border-radius:9px;color:var(--ink2);text-decoration:none;font-size:14px}
.pallist a.sel{background:linear-gradient(90deg,rgba(16,185,129,.18),rgba(56,130,246,.1));color:#fff}
.palfoot{padding:9px 14px;font-size:11px;color:var(--ink3);border-top:1px solid rgba(255,255,255,.06);letter-spacing:.05em}
@media(max-width:1200px){.rail{grid-template-columns:repeat(3,minmax(0,1fr))}.rail .rc.wide{grid-column:span 3}}
@media(max-width:640px){.rail{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rail .rc{min-height:58px;padding:9px 11px}.rail .rv{font-size:15px}.rail .rc.wide{grid-column:span 2}}
@media(prefers-reduced-motion:reduce){body::before{animation:none}.rise{opacity:1;transform:none}.rail .rdot.live{animation:none}}
.heartcard .hh{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start;justify-content:space-between}
.heartcard .hh h2{margin:0 0 4px}
.heartcard .hh p{margin:0}
.hnums{display:flex;gap:10px}
.hnums span{display:flex;flex-direction:column;align-items:flex-end;padding:8px 14px;border-radius:11px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);min-width:96px}
.hnums b{font-size:20px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.hnums b.good{color:var(--acc2)}
.hnums b.warn{color:var(--amber)}
.hnums b.bad{color:var(--red)}
.hnums em{font-style:normal;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);font-weight:700;margin-top:2px}
.bars{display:flex;align-items:flex-end;gap:8px;height:150px;margin:18px 0 6px;padding:0 2px}
.bars .bar{flex:1 1 0;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;position:relative}
.bars .bar i{width:100%;max-width:46px;border-radius:7px 7px 3px 3px;position:relative;overflow:hidden;
 background:linear-gradient(180deg,rgba(52,211,153,.95),rgba(16,185,129,.30));box-shadow:0 0 18px -6px rgba(16,185,129,.65);
 transform-origin:bottom;animation:grow .6s cubic-bezier(.2,.8,.2,1) both;transition:filter .18s}
.bars .bar:hover i{filter:brightness(1.15)}
.bars .bar i u{position:absolute;left:0;right:0;bottom:0;display:block;text-decoration:none;background:linear-gradient(180deg,rgba(244,63,94,.85),rgba(244,63,94,.55))}
.bars .bar span{font-size:10px;color:var(--ink3);font-variant-numeric:tabular-nums;letter-spacing:.02em}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.barsfoot{font-size:11.5px}
@media(max-width:640px){.bars{height:120px;gap:5px}.bars .bar span{font-size:8.5px}.hnums{width:100%}.hnums span{flex:1;min-width:0;padding:7px 8px}}
main .stat{position:relative;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s}
main .stat:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.12);box-shadow:0 18px 40px -26px rgba(0,0,0,.95)}
main .stat::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--acc),var(--blue));opacity:.25}
main .stat .v{font-variant-numeric:tabular-nums;letter-spacing:-.02em}
main .stat .v.vpos{color:var(--acc2)}
main .stat .v.vneg{color:var(--red)}
#advicebody{max-height:250px;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
main .advicecard{position:relative}
main .card:has(canvas),main .card:has(.bpc-cv),main .card:has(.skipchart){overflow:visible}
body.bpc-full .rail,body.bpc-full .scrollprog{display:none}

/* ===== BP-POLISH: theme + animation layer ===== */
.stat{height:auto!important;min-height:0;transition:transform .18s ease,border-color .18s ease}
.stat:hover{transform:translateY(-2px);border-color:rgba(34,197,94,.3)}
.stat .k,.k{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.35!important;height:auto!important}
.stat .v{white-space:normal!important;overflow:visible!important}
.card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;animation:bpFadeUp .4s ease both}
.card:nth-of-type(2){animation-delay:.05s}
.card:nth-of-type(3){animation-delay:.1s}
.card:nth-of-type(4){animation-delay:.15s}
.card:hover{box-shadow:0 10px 30px rgba(0,0,0,.35);border-color:rgba(34,197,94,.22)}
@keyframes bpFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.btn{transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(34,197,94,.22);filter:brightness(1.08)}
.btn:active{transform:translateY(0) scale(.97)}
input,select,textarea{transition:border-color .15s ease,box-shadow .15s ease}
input:focus,select:focus,textarea:focus{outline:none;border-color:#22c55e!important;box-shadow:0 0 0 3px rgba(34,197,94,.14)}
table.logs tr,table.bpsig tr{transition:background .12s ease}
table.bpsig tbody tr:hover td,table.logs tr:hover td{background:rgba(34,197,94,.05)}
a{transition:color .15s ease,opacity .15s ease}
h1{background:linear-gradient(90deg,#fff,#a7f3d0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.rdot,.p_dot{animation:bpPulse 1.6s ease infinite}
@keyframes bpPulse{0%,100%{opacity:1}50%{opacity:.35}}
::selection{background:rgba(34,197,94,.35)}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}

/* ===== BP-POLISH-2: aurora + motion layer ===== */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(700px 480px at 12% -5%,rgba(34,197,94,.08),transparent 60%),radial-gradient(800px 560px at 88% 15%,rgba(99,102,241,.07),transparent 60%),radial-gradient(600px 480px at 50% 105%,rgba(236,72,153,.05),transparent 60%);animation:bpAurora 18s ease-in-out infinite alternate}
@keyframes bpAurora{from{filter:hue-rotate(0deg)}to{filter:hue-rotate(45deg)}}
.btn{position:relative;overflow:hidden}
.btn::after{content:'';position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-20deg);transition:left .5s ease;pointer-events:none}
.btn:hover::after{left:130%}
table.bpsig tbody tr,table.logs tr{animation:bpRow .3s ease both}
@keyframes bpRow{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.head h1{animation:bpTitle .5s ease both}
@keyframes bpTitle{from{opacity:0;letter-spacing:.06em}to{opacity:1;letter-spacing:0}}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(34,197,94,.22);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(34,197,94,.45)}
.brand{transition:filter .2s ease}
.brand:hover{filter:drop-shadow(0 0 10px rgba(34,197,94,.55))}
.pill,.badge{transition:transform .15s ease,box-shadow .15s ease}
.pill:hover,.badge:hover{transform:scale(1.06)}
select,input[type=number],input[type=date],input[type=text]{border-radius:10px}
.card h2{position:relative}
.card h2::after{content:'';display:block;height:2px;width:0;margin-top:4px;background:linear-gradient(90deg,#22c55e,transparent);transition:width .35s ease}
.card:hover h2::after{width:64px}
@media (prefers-reduced-motion: reduce){body::before,.head h1,table.bpsig tbody tr,table.logs tr{animation:none!important}}
/* BP-NAV-FIX: nav was a no-scrollbar strip that cut off Settings/Dhan/Greeks; wrap links instead */
@media (min-width:901px){
  header .wrap{flex-wrap:wrap}
  header nav{flex-wrap:wrap;overflow:visible;padding:6px 0;row-gap:0}
}
/* BP-STATUS badges */
.bp-live,.bp-idle,.bp-off{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:4px 10px;border-radius:999px}
.bp-live{color:#26a69a;background:rgba(38,166,154,.12)}
.bp-idle{color:#ffb454;background:rgba(255,180,84,.12)}
.bp-off{color:#ef5350;background:rgba(239,83,80,.12)}
.bp-live i,.bp-idle i,.bp-off i{width:8px;height:8px;border-radius:50%;background:currentColor}
.bp-live i{animation:bpblink 1.2s infinite}
.bp-idle i{animation:bpblink 2.4s infinite}
@keyframes bpblink{0%,100%{opacity:1}50%{opacity:.2}}

/* ============ BP FINAL THEME - PROFESSIONAL (Dhan-style) ============ */
:root{ --bg:#0d1117; --panel:#151b23; --panel2:#1a222c; --line:#232d3a;
  --txt:#e9eef4; --mut:#8b98a5; --acc:#00d09c; --acc2:#4f8ef7; --red:#f23645; --amb:#f0a500; }
body{ background:#0d1117; color:#e9eef4;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Inter',sans-serif; }
/* top panel: compact professional bar */
header{ position:sticky; top:0; left:auto; bottom:auto; width:auto; display:block;
  background:#10161d; border-right:none; border-bottom:1px solid #232d3a; padding:4px 0; z-index:20; overflow:visible; }
header nav{ display:flex; flex-direction:row; flex-wrap:wrap; gap:2px; margin-top:0; }
header nav a{ display:inline-block; padding:7px 12px; margin:0; border-radius:8px;
  font-size:13px; font-weight:600; color:#8b98a5; border:none; box-shadow:none; background:none; }
header nav a::before{ content:'' !important; }
header nav a:hover{ background:#1a222c; color:#e9eef4; }
header nav a.on{ background:none; color:#00d09c; border:none;
  box-shadow:inset 0 -2px 0 #00d09c; border-radius:0; }
main{ margin-left:0; padding:20px 26px 60px; }
footer{ margin-left:0; color:#5c6773; border-top:1px solid #1c242e; }
h1{ font-size:22px; font-weight:700; background:none; -webkit-background-clip:initial;
  background-clip:initial; color:#ffffff; letter-spacing:.2px; }
h2{ font-size:15px; font-weight:700; color:#e9eef4; border-bottom:1px solid #1e2731;
  padding-bottom:8px; text-transform:none; }
h2::before{ content:''; display:inline-block; width:3px; height:14px; background:#00d09c;
  border-radius:2px; margin-right:8px; vertical-align:-2px; }
/* status tiles: slim, clean, nothing hidden */
.rail{ display:flex; flex-wrap:wrap; gap:8px; }
.rail .rc{ background:#151b23; border:1px solid #232d3a; border-left:none; border-radius:10px;
  padding:8px 14px; min-width:130px; flex:0 1 auto; white-space:normal; overflow:visible; }
.rl{ font-size:10px; color:#8b98a5; letter-spacing:.6px; white-space:nowrap; }
.rv{ font-size:15px; font-weight:700; color:#fff; white-space:nowrap; }
.card{ background:#151b23; border:1px solid #232d3a; border-radius:12px; padding:18px;
  margin-bottom:16px; box-shadow:none; overflow:visible; }
.card:hover{ border-color:#2e3a49; box-shadow:none; }
.stat{ background:#1a222c; border:1px solid #232d3a; border-top:1px solid #232d3a;
  border-radius:10px; padding:12px 14px; }
.stat .k{ font-size:10px; color:#8b98a5; }
.stat .v{ font-size:22px; font-weight:700; color:#fff; }
.btn{ background:#1a222c; border:1px solid #2e3a49; color:#c8d2dc; border-radius:8px;
  padding:8px 15px; font-size:13px; font-weight:600; box-shadow:none; }
.btn:hover{ border-color:#00d09c; color:#00d09c; box-shadow:none; }
.btn.primary{ background:#00d09c; border:1px solid #00d09c; color:#06251c; box-shadow:none; }
.btn.primary:hover{ background:#00b98a; color:#06251c; }
.btn.danger{ background:transparent; border:1px solid #f23645; color:#f23645; }
.btn.danger:hover{ background:#2a1215; }
.badge{ font-size:11px; font-weight:700; border-radius:6px; padding:2px 8px; box-shadow:none; }
.badge.active{ background:rgba(0,208,156,.12); color:#00d09c; border:1px solid rgba(0,208,156,.4); }
.badge.inactive{ background:#1a222c; color:#8b98a5; border:1px solid #2e3a49; }
.badge.paper{ background:rgba(79,142,247,.12); color:#7fb0ff; border:1px solid rgba(79,142,247,.4); }
.badge.live{ background:rgba(242,54,69,.12); color:#f23645; border:1px solid rgba(242,54,69,.45); }
table{ font-size:13.5px; }
th{ color:#8b98a5; font-size:10.5px; letter-spacing:.5px; border-bottom:1px solid #232d3a; }
td{ border-bottom:1px solid #1a222c; }
table.logs tr:nth-child(even) td{ background:transparent; }
table.logs tr:hover td{ background:#1a222c; }
input,select,textarea{ background:#10161d; border:1px solid #2e3a49; color:#e9eef4; border-radius:8px; }
input:focus,select:focus,textarea:focus{ border-color:#00d09c; box-shadow:0 0 0 3px rgba(0,208,156,.12); }
label{ color:#8b98a5; }
.flash{ background:#141b24; border:1px solid #232d3a; border-left:3px solid #00d09c; }
/* PROPER pnl colours - broker green / broker red */
.pl-pos{ color:#00c853 !important; font-weight:700; text-shadow:none; }
.pl-neg{ color:#f23645 !important; font-weight:700; text-shadow:none; }
.muted{ color:#8b98a5; }
::selection{ background:#00d09c; color:#06251c; }
::-webkit-scrollbar{ width:8px; height:8px; } ::-webkit-scrollbar-thumb{ background:#2e3a49; border-radius:6px; }

/* BP FINAL THEME - solid green progress bars (remove purple mix) */
.scrollprog i{ background:var(--acc) !important; box-shadow:none !important }
.sessbar i, .rail .sessbar i{ background:var(--acc) !important; box-shadow:none !important }
header nav a.active::after, header nav a[aria-current]::after{ background:var(--acc) !important; box-shadow:none !important }

/* BP FINAL THEME - MOBILE FIX: phone layout for the new top-bar theme */
@media (max-width:900px){
header{ position:static; padding:6px 0 }
header nav{ flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:0 8px }
header nav a{ flex:0 0 auto; font-size:12.5px; padding:8px 10px }
main{ padding:10px 10px 40px }
.rail{ gap:6px; padding:6px 8px }
.rail .rc{ flex:1 1 42%; min-width:42%; padding:6px 10px }
}

@media (max-width:900px){
.card{ padding:12px; border-radius:10px; overflow-x:auto }
table{ display:block; overflow-x:auto; white-space:nowrap; max-width:100% }
input,select,textarea{ font-size:16px; max-width:100% }
h1{ font-size:18px }
.btn{ padding:8px 12px; font-size:13px }
}

/* BP MOBILE FIX 2: kill old hamburger/absolute-nav remnants under the new top-bar theme */
@media (max-width:900px){
header nav{ position:static !important; display:flex !important; top:auto; flex-direction:row }
.burger,.navscrim,.navout{ display:none !important }
header .wrap{ height:auto }
header nav a{ border-bottom:0 }
}

/* BP FLAT: remove mirror/glass shine everywhere - simple flat panels */
body{ background:#0d1117 !important; background-image:none !important }
body::before,body::after,main::before,main::after{ content:none !important; display:none !important }
.card,.rc,.rail .rc{ background:#151b23 !important; background-image:none !important; box-shadow:none !important }
.stat{ background:#1a222c !important; background-image:none !important; box-shadow:none !important }
.card::before,.card::after,.stat::before,.stat::after{ content:none !important; display:none !important }
.btn.primary{ background:#00d09c !important; background-image:none !important }
.btn,.badge,.flash{ background-image:none !important; box-shadow:none !important }
h1{ background:none !important }

/* BP MOBILE FIX 3: bigger, clearer text on phones */
@media (max-width:900px){
body{ font-size:15px }
header nav a{ font-size:14px; padding:10px 12px }
.rl{ font-size:11px; letter-spacing:.3px }
.rv{ font-size:16px }
.stat .k{ font-size:11px }
.stat .v{ font-size:18px }
table{ font-size:14px }
th{ font-size:11px }
h2{ font-size:16px }
.muted,label{ color:#aab7c4 }
.rail .rc{ padding:8px 12px }
}

/* BP FLAT 2: kill the sweeping mirror shine on tiles and buttons */
.rc::after,.rc::before,a.rc::after,div.rc::after{ content:none !important; display:none !important; background:none !important }
.btn::after,.btn::before,button.btn::after,a.btn::after{ content:none !important; display:none !important; background:none !important }
.card::after,.stat::after,.stat::before{ content:none !important; display:none !important }
h2::after{ content:none !important; display:none !important }

/* BP MOBILE FIX 4: wrap the menu so every item (incl Dashboard) is visible, no sideways scrolling */
@media (max-width:900px){
header nav{ flex-wrap:wrap !important; overflow-x:visible !important; row-gap:2px; justify-content:flex-start; padding:2px 8px 6px }
header nav a{ flex:0 0 auto; padding:7px 10px }
}

/* BP-NAVSEL: phone menu becomes one dropdown */
.navsel{ display:none }
@media (max-width:900px){
header.navselon nav{ display:none !important }
.navsel{ display:block; width:calc(100% - 20px); margin:4px 10px 8px; padding:10px 12px; font-size:15px; background:#151b23; color:#e6edf3; border:1px solid #2a3646; border-radius:8px }
}

/* BP-NAVSEL: phone menu becomes one dropdown */
.navsel{ display:none }
@media (max-width:900px){
header.navselon nav{ display:none !important }
.navsel{ display:block; width:calc(100% - 20px); margin:4px 10px 8px; padding:10px 12px; font-size:15px; background:#151b23; color:#e6edf3; border:1px solid #2a3646; border-radius:8px }
}

/* ===== BP-MOBRENDER =====
   The Bots page ships ~490 inputs, 113 selects and 22 chart blocks. A phone lays out
   every one of them at load, which is what makes the tab die. content-visibility lets
   the browser skip anything that is off screen and only build it when you scroll to it.
   Scoped to small screens so the desktop cascade is untouched. */
@media (max-width:900px){
  .card{ content-visibility:auto; contain-intrinsic-size:auto 700px; }
  details:not([open]) > *:not(summary){ content-visibility:hidden; }
  /* nothing may push the page sideways */
  html,body{ max-width:100%; overflow-x:hidden; }
  img,svg,canvas,iframe{ max-width:100%; height:auto; }
  input,select,textarea,button{ max-width:100%; box-sizing:border-box; }
  pre,code{ white-space:pre-wrap; word-break:break-word; }
  .pform{ display:block; }
}

/* BP-TIGHT: bot boxes were tall enough that only two fitted on screen. Shrink the box,
   keep START and STOP big so the one control that matters stays obvious. */
.card{padding:12px 14px;margin-bottom:10px}
.card h2{font-size:16px;line-height:1.25;margin:0}
.card .badge{font-size:10px;padding:2px 6px;letter-spacing:.02em}
.card .btn{font-size:12px;padding:6px 10px}
.card .btn.primary,.card .btn.danger{font-size:14px;font-weight:800;padding:9px 20px;letter-spacing:.04em}
.card details.botopen>summary{font-size:13px;padding:6px 0}
.card .muted.sm{font-size:11.5px;line-height:1.45}

/* BP-SECTIONS: real money on top and loud, test money underneath and quiet. */
.bpsechead{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;margin:18px 0 8px}
.bpsechead h2{margin:0;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.bpsec.bpreal .bpsechead h2{color:#ff8a8a}
.bpsec.bptest .bpsechead h2{color:#2dd4a7}
.bpsec.bpreal>.card{border-left:3px solid #ff8a8a}
.bpsec.bptest>.card{border-left:3px solid #23424f;opacity:.94}
/* the test half is deliberately smaller - it is not spending anything */
.bpsec.bptest .card{padding:9px 12px;margin-bottom:8px}
.bpsec.bptest .card h2{font-size:14px}
.bpsec.bptest .card .btn{font-size:11px;padding:4px 8px}
.bpsec.bptest .card .btn.primary,.bpsec.bptest .card .btn.danger{font-size:12px;padding:6px 12px}
/* RUNNING blinks only when real money is on the line */
@keyframes bpblink{0%,100%{opacity:1}50%{opacity:.28}}
.badge.bpblink{animation:bpblink 1.1s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.badge.bpblink{animation:none;outline:1px solid currentColor}}
#bpfind{display:block;width:100%;max-width:420px;margin:10px 0 0;padding:8px 12px;border-radius:8px;
  border:1px solid #2a3646;background:#0f1621;color:inherit;font-size:13px}
#bpfind:focus{outline:none;border-color:#8ab4ff}
#bpfindn{display:inline-block;margin-top:4px}

/* BP-TWOROW: real-money controls on top at full size, test-money underneath and quieter. */
.bpctl{display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.bpline{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end}
.bplab{font-size:9.5px;letter-spacing:.09em;font-weight:800;min-width:80px;text-align:right;opacity:.85}
.bpline.bpreal-line .bplab{color:#ff8a8a}
.bpline.bptest-line .bplab{color:#2dd4a7}
.bpline.bptest-line .btn{font-size:11px;padding:4px 9px;font-weight:600}
.bpline.bptest-line .btn.danger{font-size:11px;padding:4px 9px}
.bpline.bpextra .btn{font-size:10.5px;padding:3px 8px;opacity:.85}
.bpline.bpextra .bplab{content:none}
.bpronly{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;cursor:pointer;color:#9aa4b2}
.bpronly input{width:14px;height:14px}
@media (max-width:900px){.bpctl{align-items:stretch}.bpline{justify-content:flex-start}.bplab{text-align:left;min-width:70px}}

/* BP-FOLD */
.bpfoldbar{display:block;width:100%;margin:6px 0 2px;padding:7px 10px;border-radius:8px;cursor:pointer;
  background:rgba(148,163,184,.08);border:1px dashed #2a3646;color:#9aa4b2;font-size:12px;font-weight:600}
.bpfoldbar:hover{background:rgba(148,163,184,.14);color:#cbd5e1}

/* BP-RUNTOP */
.bpsec.bpidle .bpsechead h2{color:#8b95a5}
.bpsec.bpidle>.card{border-left:3px solid #1e2836;opacity:.8}
.bpsec.bpidle .card{padding:8px 12px;margin-bottom:6px}
.bpsec.bpidle .card h2{font-size:13px}
.bpsec.bpidle .card .btn{font-size:11px;padding:4px 8px}

/* ===== BP-GRID: bots as square tiles instead of full-width rows =====
   One bot per row meant scrolling past 36 of them. Tiles pack 4-5 across, and a tile
   that is opened takes the whole row so the settings form still has room to breathe. */
.bpgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;align-items:start}
.bpgrid>.card{margin:0;padding:12px;display:flex;flex-direction:column;min-height:225px;border-radius:12px}
/* the header row stacks inside a narrow tile */
.bpgrid>.card>div:first-child{display:block}
.bpgrid>.card>div:first-child>div:first-child{display:block;margin-bottom:6px}
.bpgrid>.card h2{font-size:14px;line-height:1.3;margin:0 0 6px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bpgrid>.card .badge{font-size:9px;padding:2px 5px;margin-right:3px}
/* controls go full width, stacked */
.bpgrid .bpctl{align-items:stretch;margin-top:6px;gap:5px}
.bpgrid .bpline{justify-content:stretch;gap:5px}
.bpgrid .bplab{min-width:100%;text-align:left;margin-bottom:-2px}
.bpgrid .bpline form,.bpgrid .bpline .btn{flex:1 1 0;min-width:0}
.bpgrid .bpline .btn{width:100%;text-align:center}
.bpgrid .bpline.bpextra{flex-wrap:wrap}
.bpgrid .bpline.bpextra .btn{flex:1 1 auto;font-size:10px;padding:3px 6px}
/* the long stuff only matters once you open the tile */
.bpgrid>.card>.muted.sm{font-size:11px;line-height:1.4;margin:8px 0 0}
.bpgrid>.card details{margin-top:auto}
.bpgrid>.card details.botopen>summary{font-size:12px;padding:6px 0 0}
/* an opened tile spans the full row */
.bpgrid>.card:has(details[open]){grid-column:1/-1}
@media (max-width:640px){.bpgrid{grid-template-columns:1fr}.bpgrid>.card{min-height:0}}

/* BP-GRID2: a closed tile shows only name, badges, controls, one summary line and the
   Open link. Paper-test buttons, saved-result text and the positions list only appear
   once the tile is opened - otherwise a 250px column turns into a 600px tower. */
@supports selector(:has(*)){.bpgrid>.card>*:not(:nth-child(1)):not(:nth-child(2)):not(:last-child){display:none}}
.bpgrid>.card:has(details[open])>*{display:revert}
.bpgrid>.card{max-height:none}
/* label and buttons on one line so each control row is a single row tall */
.bpgrid .bplab{min-width:0;width:auto;flex:0 0 auto;font-size:9px;letter-spacing:.06em;margin:0 2px 0 0}
.bpgrid .bpline{flex-wrap:nowrap;align-items:center}
.bpgrid .bpline.bpextra{flex-wrap:wrap}
.bpgrid .bpline .btn{font-size:11px;padding:5px 6px}
.bpgrid .bpline.bpreal-line .btn{font-size:12px;font-weight:800;padding:7px 6px}
.bpgrid>.card>div:nth-child(2){font-size:10.5px;line-height:1.45;margin-top:8px;opacity:.85}

/* BP-GRID3: badges on one line. The strategy-leg badge is a whole sentence and was
   eating two lines of every tile - it is already spelled out inside Open this bot, so
   the closed tile keeps only the two badges that tell you the state: RUNNING and LIVE. */
.bpgrid>.card>div:first-child>div:first-child{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.bpgrid>.card h2{flex:1 1 100%;margin:0 0 2px}
@supports selector(:has(*)){.bpgrid .badge:not(.active):not(.inactive):not(.paper):not(.live){display:none}}
.bpgrid>.card:has(details[open]) .badge{display:inline-block}
.bpgrid>.card{min-height:0}
.bpgrid>.card>div:nth-child(2){margin-top:6px}
.bpgrid>.card details.botopen>summary{margin-top:6px}

/* BP-GRID4: last of the height. The extras row (paper test / mirror / market price) wrapped
   onto two lines in every closed tile and the Open summary carried a second line of hint
   text. Both only matter once you are actually looking at the bot, so hide them until the
   tile is opened. Target is a tile roughly as tall as it is wide. */
.bpgrid>.card:not(:has(details[open])) .bpline.bpextra{display:none}
.bpgrid>.card:not(:has(details[open])) details.botopen>summary span{display:none}
.bpgrid>.card:not(:has(details[open]))>div:nth-child(2){
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bpgrid>.card details.botopen>summary{font-weight:700;opacity:.9}
.bpgrid>.card>div:first-child{padding-bottom:2px}

/* ===== BP-SEG: Off / Test / Real as one switch =====
   The lit segment IS the answer to "what is this bot doing". Off is grey, Test is green
   (safe), Real is red (spending). Real is never the eye-catching one. */
.bpseg{display:inline-flex;border:1px solid #2a3646;border-radius:9px;overflow:hidden;background:#0d141e}
.bpseg-b{appearance:none;border:0;background:transparent;color:#7c8798;cursor:pointer;
  font:700 11px/1 inherit;letter-spacing:.07em;text-transform:uppercase;padding:8px 14px;
  border-right:1px solid #2a3646;transition:background .12s,color .12s}
.bpseg form:last-child .bpseg-b{border-right:0}
.bpseg-b:hover{background:rgba(148,163,184,.1);color:#cbd5e1}
.bpseg-b.is-on{cursor:default}
.bpseg-off.is-on{background:#2b323d;color:#e2e8f0}
.bpseg-test.is-on{background:#0e3d2b;color:#2dd4a7;box-shadow:inset 0 0 0 1px #2dd4a7}
.bpseg-real.is-on{background:#3d1b1b;color:#ff8a8a;box-shadow:inset 0 0 0 1px #ff8a8a}
.bpseg-real:not(.is-on):hover{background:rgba(255,138,138,.12);color:#ff8a8a}
.bppause{appearance:none;border:1px solid #2a3646;background:transparent;color:#9aa4b2;
  border-radius:8px;padding:7px 12px;margin-left:6px;cursor:pointer;font:600 11px/1 inherit}
.bppause:hover{border-color:#8ab4ff;color:#cbd5e1}
.bppaused{margin-left:8px;font-size:11px;color:#f0a020;font-weight:700;letter-spacing:.06em}
.bpsegline{gap:0}
.bpgrid .bpsegline{flex-wrap:wrap;gap:6px}
.bpgrid .bpseg{width:100%}
.bpgrid .bpseg form{flex:1 1 0;display:flex}
.bpgrid .bpseg-b{width:100%;padding:9px 4px}
.bpgrid .bppause{margin-left:0;width:100%}

/* BP-MINI: minimised view - name and the Off/Test/Real switch, nothing else. Choice is
   remembered in localStorage so it survives a reload. */
body.bpminion .bpgrid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px}
body.bpminion .bpgrid>.card{min-height:0;padding:8px 10px}
body.bpminion .bpgrid>.card>div:first-child{display:flex;align-items:center;gap:8px}
body.bpminion .bpgrid>.card h2{flex:1 1 auto;font-size:12.5px;margin:0;-webkit-line-clamp:1}
body.bpminion .bpgrid>.card .badge{display:none}
body.bpminion .bpgrid>.card .badge.active,body.bpminion .bpgrid>.card .badge.inactive{display:none}
body.bpminion .bpgrid>.card>div:nth-child(2){display:none}
body.bpminion .bpgrid>.card details{display:none}
body.bpminion .bpgrid .bpctl{margin:0;flex:0 0 auto}
body.bpminion .bpgrid .bpline.bpextra{display:none}
body.bpminion .bpgrid .bpseg{width:auto}
body.bpminion .bpgrid .bpseg-b{padding:5px 9px;font-size:10px}
body.bpminion .bpgrid .bppause{display:none}
body.bpminion .bpsechead{margin:12px 0 6px}

/* ===== BP-CARD3: cleaner bot tiles, stat chips, tappable Positions strip ===== */
.bpgrid>.card{position:relative;padding:12px 12px 10px 14px;border-radius:14px;
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.008));
  transition:border-color .15s ease}
.bpgrid>.card::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;
  border-radius:0 3px 3px 0;background:#39404d}
.bpgrid>.card[data-bprun="1"]::before{background:#26a69a}
.bpgrid>.card[data-bprun="1"][data-bpreal="1"]::before{background:#ef5350}
.bpgrid>.card:hover{border-color:rgba(255,255,255,.20)}
.bpstat{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:5px}
.bpchip{display:inline-flex;align-items:center;gap:3px;font-size:10px;line-height:1;
  padding:4px 6px;border-radius:6px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.07);white-space:nowrap}
.bpchip b{font-size:11.5px;font-weight:800}
.bprules{font-size:10.5px;line-height:1.45;opacity:.72}
.bpgrid>.card>details.bppos{display:block !important;margin-top:8px}
.bpgrid>.card details.bppos>summary{list-style:none;cursor:pointer;font-size:11px;
  padding:5px 8px;border-radius:8px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09)}
.bpgrid>.card details.bppos>summary::-webkit-details-marker{display:none}
.bpgrid>.card details.bppos>summary:hover{background:rgba(255,255,255,.10)}
.bpgrid>.card details.bppos[open]>summary{background:rgba(79,140,255,.14);border-color:rgba(79,140,255,.40)}
.bpgrid>.card details.bppos .bpscroll{max-height:330px;overflow:auto;margin-top:8px}
.bpgrid>.card details.bppos table.bptbl{width:100%;font-size:11.5px}
.bpgrid>.card details.bppos table.bptbl th{position:sticky;top:0;background:#11151c;z-index:1}
body.bpminion .bpgrid>.card>details.bppos{display:none !important}

/* ===== BP-CARD4: opening Positions widens the tile so the table reads, but the
   rest of the card stays compact and the controls do not fly to the far right ===== */
.bpgrid>.card:has(details.bppos[open]):not(:has(details.botopen[open]))>*:not(:nth-child(1)):not(:nth-child(2)):not(:last-child):not(details.bppos){display:none !important}
.bpgrid>.card:has(details.bppos[open])>div:first-child{justify-content:flex-start !important;gap:14px}
.bpgrid>.card:has(details.bppos[open]) .bpctl{max-width:520px}
.bpgrid>.card:has(details.bppos[open]) .bpstatwrap{max-width:820px}

/* ===== BP-BOTNO: every bot carries its number, on the card and anywhere else ===== */
.bpbotno{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.03em;
  padding:2px 5px;margin-right:6px;border-radius:5px;vertical-align:middle;
  background:rgba(120,160,255,.16);color:#9dbcff;border:1px solid rgba(120,160,255,.30)}
.bpgrid>.card h2 .bpbotno{font-size:9.5px;padding:1px 4px;margin-right:5px}
td>.bpbotno,th>.bpbotno{margin-right:5px}

/* ===== BP-SEG2: one compact switch row. The colour tells you what it will spend:
   grey = nothing, green = test money, red = real money. Pause sits beside it. ===== */
.bpgrid .bpsegline{flex-wrap:nowrap;gap:6px;align-items:stretch}
.bpgrid .bpseg{flex:1 1 auto;width:auto;border-radius:9px}
.bpgrid .bpseg form{flex:1 1 0}
.bpgrid .bpseg-b{width:100%;padding:7px 4px;font-size:10.5px;font-weight:700;letter-spacing:.05em}
.bpgrid .bppause{flex:0 0 auto;width:auto;margin-left:0;padding:7px 11px;
  font-size:10.5px;font-weight:700;border-radius:9px}
.bpseg-off.is-on{background:#3a414e;color:#ffffff;box-shadow:none}
.bpseg-test.is-on{background:#12715c;color:#eafff8;box-shadow:none}
.bpseg-real.is-on{background:#b3312e;color:#ffffff;box-shadow:none}
.bpseg-real:not(.is-on){color:#ff8a8a}
.bpseg-b:not(.is-on):hover{background:rgba(148,163,184,.12)}

/* BP-PILL: the compact bot cards repeated one 130-char inline style on every
   badge, 293 times over. Same look, one rule. */
.bppill{display:inline-block;padding:2px 10px;border:1px solid rgba(148,163,184,.28);border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.04em}
.bppill.on{color:#2bd97c;border-color:rgba(43,217,124,.45)}
.bppill.offc{color:#8b93a7}
.bppill.pap{color:#8ecbff}
.bppill.rl{color:#ff6b6b;border-color:rgba(255,107,107,.5)}
.bppill.opp{color:#c084fc;border-color:rgba(192,132,252,.4)}
.bppill.ce{color:#2bd97c}
.bppill.pe{color:#ff8a80}
.bppill.au{color:#9fb2d8}
.bplite-badges{display:flex;gap:6px;margin:7px 0;flex-wrap:wrap;align-items:center}
.bplite-stats{display:flex;gap:12px;font-size:12px;opacity:.78;margin:0 0 8px;flex-wrap:wrap}

.bpseg{margin:8px 0}

.bpnew{background:#26a69a;color:#07131a;font-weight:700;font-size:10px;padding:1px 7px;border-radius:10px;vertical-align:middle;letter-spacing:.04em}

.bprules{margin:2px 0 10px;font-size:13px;letter-spacing:.04em;color:#9fb2d8}
.bprules b{color:#e6edf3}
/* BP-H1FIX 2026-08-30: style.css:945 makes every h1 a clipped gradient with
   -webkit-text-fill-color:transparent. The later BP FINAL THEME h1 rule resets
   the background but NOT the fill colour, so every h1 on the site painted as
   invisible text - including the BillionProfit wordmark on the sign-in page. */
h1 { -webkit-text-fill-color: currentColor; }
.brand span { -webkit-text-fill-color: transparent; }

/* BP-AUTOFILL: Chrome autofill black-box fix, sitewide */
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px #141b26 inset !important;-webkit-text-fill-color:#e8eef7 !important;caret-color:#e8eef7;transition:background-color 9999s ease-in-out 0s}
/* BP-TITLEWRAP - show the full bot name, wrap instead of clip */ .card h3 { white-space:normal !important; overflow:visible !important; text-overflow:clip !important; display:block !important; -webkit-line-clamp:unset !important; max-height:none !important; }
/* BP-THEME2 - subtle navy theme refresh (Aug 31) */ body{background:#0a0f1e !important} body.auth{background:radial-gradient(900px 500px at 50% -10%, #12294a 0%, #0a0f1e 62%) !important} .card{background:#0f1726 !important;border:1px solid #1d2a44 !important;border-radius:12px !important} header{background:#0a0f1ecc !important;border-bottom:1px solid #1d2a44 !important} .btn.primary,button.primary{background:linear-gradient(90deg,#00d09c,#00b8d9) !important;color:#04222b !important} .auth-card{border:1px solid #223a5e !important;box-shadow:0 10px 40px #000a !important}
/* BP-PYFOLD + BP-BOTBOX (Aug 31) */ .card.pylab{padding:10px 16px !important} .card.pylab h2{font-size:16px !important;margin:6px 0 !important;overflow:visible !important} .card.pylab h2::before{position:static !important;display:inline-block !important;margin-right:8px !important;transform:none !important} details.pyfold>summary{cursor:pointer;color:#00d09c;font-weight:600;display:inline-block;margin:2px 0 8px;list-style:none} details.pyfold>summary::before{content:"+ "} details.pyfold[open]>summary::before{content:"- "} .bpgrid>.card{content-visibility:visible !important;contain-intrinsic-size:auto !important;height:auto !important;min-height:0 !important;aspect-ratio:auto !important;background:linear-gradient(180deg,#13223d,#0f1726) !important;border:1px solid #29426e !important;border-left:3px solid #00d09c !important;border-radius:12px !important;padding:12px 14px !important} .bpgrid>.card>div{display:block !important} .bpgrid>.card>form{display:flex !important} .bpgrid>.card>h2{font-size:14px !important;line-height:1.4 !important;white-space:normal !important;overflow:visible !important;max-height:none !important;display:block !important}
.card.pylab h2::before{content:none !important}
/* BP-SINGLEWIDE - opened bot console uses the full PC width */ .bpgrid.bpsingle{display:block !important} .bpgrid.bpsingle>.card{width:100% !important;max-width:1100px !important;margin:0 auto 14px !important;height:auto !important} .bpgrid.bpsingle>.card input,.bpgrid.bpsingle>.card select{max-width:340px}

/* BP-CHARTUI - redesigned example-chart cards + twin long/short layout */
.bptwin{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px;margin:6px 0}
.bpchartbox{background:linear-gradient(180deg,#0e1626,#0b1220);border:1px solid #1d2a44;border-radius:14px;padding:14px 16px;box-shadow:0 6px 22px rgba(0,0,0,.35);margin:10px 0}
.bpchartbox svg{border-radius:10px;background:#0a0f1e;display:block;max-width:100%}
.bpchartbox > div:first-child{font-size:13.5px!important;letter-spacing:.2px;border-left:3px solid #00d09c;padding-left:9px;margin-bottom:8px!important;color:#dfe9ff!important}
.bptwin .bpchartbox{margin:0;height:100%}
/* BP-PTUI: refined, denser paper-test result tiles (desktop) - less casual */
@media (min-width:821px){
  .ptiles{grid-template-columns:repeat(auto-fill,minmax(138px,1fr)) !important;gap:8px !important}
  .ptile{background:linear-gradient(180deg,#0f1826,#0b1220) !important;border:1px solid #1d2a44 !important;border-radius:10px !important;padding:9px 12px !important;box-shadow:0 2px 8px rgba(0,0,0,.22);transition:border-color .15s}
  .ptile:hover{border-color:#2c3f63 !important}
  .ptile .ptl{font-size:9.5px !important;letter-spacing:.09em !important;color:#7f8ea3 !important}
  .ptile b{font-size:15px !important}
}

/* ================= BP-FIT =================
   Two things made every admin page waste space: .wrap was capped at
   1340px, so wide screens lost their sides; and bpcore gives .wrap
   min-height:100vh - which the FOOTER's inner wrap also inherited, so
   every page scrolled into a full screen of nothing. Fill the width,
   let main take the slack, and stop the page where its content ends. */
body:not(.auth){min-height:100vh;display:flex;flex-direction:column}
body:not(.auth)>header{flex:0 0 auto}
body:not(.auth)>footer{flex:0 0 auto}
body:not(.auth)>footer>.wrap{min-height:0;max-width:none;width:100%}
body:not(.auth)>main.wrap{
  flex:1 0 auto;min-height:0;max-width:none;width:100%;
  padding-left:clamp(14px,1.6vw,26px);padding-right:clamp(14px,1.6vw,26px);
  padding-bottom:22px;
}
body:not(.auth)>header>.wrap{
  min-height:62px;max-width:none;width:100%;
  padding-left:clamp(14px,1.6vw,26px);padding-right:clamp(14px,1.6vw,26px);
}

/* ===== BP-ANIMSWITCH: Settings -> Look and feel -> Animations OFF =====
   Quiets the admin site too: no motion anywhere, and the decorative
   reactor art does not draw at all. Nothing about trading changes. */
html[data-anim="off"] *,html[data-anim="off"] *::before,html[data-anim="off"] *::after{
  animation:none!important;transition:none!important;
}
html[data-anim="off"] #bpnuke,html[data-anim="off"] #bpdeco,
html[data-anim="off"] .enginebay,html[data-anim="off"] .bn-geiger{display:none!important}
