/* tata letak baru (dashboard2, chart yang dibuka darinya, login/2FA): theme=dark (default) | theme=light (body.terang).
   Warna lewat variabel; tata letak sama untuk kedua tema. */
body{--sel:#0b0d10;--kepala:#14171c;--kepalateks:#9aa1ab;--hover:#12161c;--shover:#161c26;--sbiru:#5b8cff;--smerah:#ff5f5c;--skosong:#5d6570;
 --pilihbg:#18213a;--pilihgaris:#5b8cff;--terbuka:#111a2b;--tautan:#8fb0ff;--tombol:#1d222a;--tombolhover:#2a303a;--latarchart:#0b0d10}
body.terang{--bg:#f5f6f8;--panel:#fff;--teks:#1f2328;--redup:#6b7280;--biru:#2962ff;--merah:#f23645;--garis:#e3e6ea;
 --sel:#fff;--kepala:#eef0f3;--kepalateks:#4b5563;--hover:#f7f9fc;--shover:#eef3ff;--sbiru:#2962ff;--smerah:#e0312e;--skosong:#a0a6b0;
 --pilihbg:#e3ebff;--pilihgaris:#2962ff;--terbuka:#f0f4ff;--tautan:#1a56db;--tombol:#eef0f3;--tombolhover:#e6e9ee;--latarchart:#fff;
 background:var(--bg);color:var(--teks)}

/* light: bar, menu, input, strip */
.terang a,.terang .link,.terang .bar .navlink{color:var(--tautan)}
.terang .bar{background:var(--panel);border-bottom:1px solid var(--garis)}
.terang .grup,.terang .bar .kanan{border-left-color:var(--garis)}
.terang .bar input,.terang input{background:#fff;color:var(--teks);border:1px solid #cfd4db}
.terang .kecilbtn,.terang #tf button,.terang .menu button{background:var(--tombol);color:var(--teks)}
.terang .bar #tf button{border-right-color:#fff}
.terang #tf button.aktif{background:var(--biru);color:#fff}
.terang .menu,.terang .menuset .flyout{background:#fff;border-color:var(--garis);box-shadow:0 6px 20px rgba(0,0,0,.12)}
.terang .menu button:hover,.terang .menu .item:hover,.terang .menuset .sub:hover>.judulsub,.terang .menuset .sub.buka>.judulsub{background:var(--tombolhover)}
.terang .bar .chip.naik{color:#2962ff!important}.terang .bar .chip.turun{color:#f23645!important}.terang .bar .chip.kosong{color:#9aa1ab!important}
.terang .judul{color:#1f2328}
.terang .labeltf{text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 2px #fff}
.terang .atribusi{color:#9aa1ab}

/* pilihan Dark (centang) */
.tematog{display:inline-flex;align-items:center;gap:4px;margin:0;cursor:pointer;color:var(--teks);white-space:nowrap}
.tematog input,.bar .tematog input{width:auto!important;height:auto!important;margin:0!important;padding:0!important;accent-color:#2962ff}
.temalogin{position:fixed;top:14px;right:16px;z-index:5;font-size:13px;font-weight:600;color:#d6d9de}
.temalogin .tematog{color:inherit}

/* login/2FA light: latar terang, kotak kaca putih */
.terang .latar{background:radial-gradient(ellipse at 50% 40%,#ffffff 0%,#e9eef5 55%,#cfd8e3 100%)}
.terang .merek,.terang .merek2{color:#1f2328;text-shadow:none}.terang .merek3{color:#4b5563;text-shadow:none}.terang .versikotak{color:#6b7280}
.terang .kotak{background:rgba(255,255,255,.75);border:1px solid rgba(0,0,0,.08);box-shadow:0 10px 40px rgba(0,0,0,.12)}
.terang .kotak h1{color:#1f2328}.terang .kotak input{background:#fff}.terang .pesan{color:#c0362c}
.terang .temalogin{color:#1f2328}.terang .cadangan,.terang .kunci{background:#eef0f3}

/* dashboard2: tabel selebar layar, bisa digeser (HP), header & kolom Symbol terkunci */
.wrap2{flex:1 1 auto;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;--th:25px}
.tabel2{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
.tabel2 th,.tabel2 td{padding:5px 10px;border-bottom:1px solid var(--garis);text-align:center;white-space:nowrap}
.tabel2 th{position:sticky;top:0;z-index:3;background:var(--kepala);color:var(--kepalateks);font-weight:600}
.tabel2 th:first-child,.tabel2 td.kode{position:sticky;left:0;z-index:2;background:var(--sel);text-align:left;font-weight:600}
.tabel2 th:first-child{z-index:4;background:var(--kepala)}
.tabel2 td{background:var(--sel)}.tabel2 td.angka,.tabel2 th.angka{text-align:right}
.tabel2 tbody tr:hover td{background:var(--hover)}
.tabel2 td.s{cursor:pointer;font-weight:600;color:var(--skosong)}.tabel2 td.s.naik{color:var(--sbiru)}.tabel2 td.s.turun{color:var(--smerah)}
.tabel2 td.s:hover{background:var(--shover)}
.tabel2 td.s.pilih{background:var(--pilihbg);outline:1px solid var(--pilihgaris);outline-offset:-1px}
/* baris yang diklik tetap terlihat di atas chart */
.tabel2 tr.terbuka td{position:sticky;top:var(--th);z-index:3;background:var(--terbuka)}
.tabel2 tr.terbuka td.kode{z-index:4}
/* baris chart: lebar = layar (tetap di kiri walau tabel digeser), tinggi = sisa layar */
.tabel2 tr.barischart td{padding:0;background:var(--latarchart);border-bottom:2px solid #2962ff}
.tabel2 tr.barischart:hover td{background:var(--latarchart)}
.isichart{position:sticky;left:0;display:flex;flex-direction:column}
.isichart iframe{flex:1 1 auto;border:0;width:100%;background:var(--latarchart)}
/* ↗ chart memenuhi seluruh jendela (di atas bar & tabel); ↙ kembali ke bawah baris */
.isichart.penuh{position:fixed;inset:0;z-index:50;width:100vw!important;height:100vh!important;height:100dvh!important}
@media (max-width:600px){.tabel2 th,.tabel2 td{padding:5px 7px;font-size:12px}}

/* chart (embed dashboard2): ↗ dan ✕ di ujung kanan bar */
.bar .kontrol{gap:2px}.bar .kontrol button{color:var(--tautan);font-size:15px!important;padding:0 8px;background:none}
.bar .kontrol button:hover{background:var(--tombol)}
/* centang TF: panel sempit di kiri chart, di tengah tinggi chart, tidak menutupi chart */
.badan{flex:1 1 auto;min-height:0;display:flex}
.badan #chart{flex:1 1 auto;min-width:0}
/* panel kiri: CS/AS, Line/Dot/Hol, lalu TF; seluruh isi di tengah tinggi chart */
.panelkiri{flex:none;width:52px;overflow-y:auto;background:var(--panel);border-right:1px solid var(--garis);padding:4px 0;display:flex;flex-direction:column;justify-content:center}
.panelkiri>*{margin-top:0;margin-bottom:0}.panelkiri>.setkiri{margin-top:auto}.panelkiri>.stripkiri{margin-bottom:auto}
.panelkiri hr{width:70%;margin:4px auto;border:0;border-top:1px solid var(--garis)}
.setkiri label{display:flex;align-items:center;gap:3px;margin:0;padding:4px 4px;font-size:10.5px;font-weight:600;color:var(--teks);cursor:pointer;white-space:nowrap}
.setkiri label:hover{background:var(--tombol)}
.setkiri input{width:auto;margin:0;accent-color:#2962ff;transform:scale(.85)}
.stripkiri table,.stripkiri tbody,.stripkiri tr,.stripkiri td{display:block;border:0;padding:0}
.stripkiri td label{display:flex;align-items:center;gap:3px;margin:0;padding:4px 4px;font-size:10.5px;font-weight:600;color:var(--teks);cursor:pointer;white-space:nowrap}
.stripkiri td label:hover{background:var(--tombol)}
.stripkiri input{width:auto;margin:0;accent-color:#2962ff;transform:scale(.85)}
.stripkiri td.redup{opacity:.35}
.terang .kotak button{background:#2b3036;color:#fff;border:1px solid #2b3036}.terang .kotak button:hover{background:#3a4048}
.tabel2 td.kode.basi{color:#e0a100}
.bar .saring{gap:10px}.bar .saring label{display:inline-flex;align-items:center;gap:4px;margin:0;cursor:pointer;color:var(--teks)}
.bar .saring input{width:auto!important;height:auto!important;margin:0!important;padding:0!important;accent-color:#2962ff}
/* panel kiri chart: isi mulai dari atas */
.panelkiri{justify-content:flex-start}.panelkiri>.setkiri{margin-top:0}.panelkiri>.stripkiri{margin-bottom:0}.stripkiri table{margin:0}
/* panel kiri chart: label induk CHART (CS..Vol) dan TF (M1..Mn) */
.judulkiri{padding:4px 4px 2px;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--redup);white-space:nowrap}
.tabel2 td.kode,.tabel2 td.angka{cursor:pointer}
/* kredit kecil di samping logo TradingView (kiri bawah chart) */
.kredit{position:absolute;left:46px;bottom:36px;z-index:6;font-size:10px;color:var(--redup);opacity:.8;pointer-events:none;white-space:nowrap}
/* dropdown logic LURO4/LURO3/LURO2 (kiri atas dashboard & chart) */
.bar select{height:28px;margin:0;padding:0 6px;border-radius:5px;border:1px solid var(--garis);background:var(--tombol);color:var(--teks);font:inherit;cursor:pointer}

/* halaman admin: kartu bertumpuk, satu kolom, bisa digulir */
.adminwrap{flex:1 1 auto;min-height:0;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:16px;align-items:center}
.judulhal{font-size:12px;letter-spacing:.08em}
.bar .grup .navlink+.navlink{margin-left:4px}
.kartu{width:100%;max-width:860px;background:var(--panel);border:1px solid var(--garis);border-radius:8px;padding:16px 18px}
.kartu h2{margin:0 0 10px;font-size:15px;letter-spacing:.03em}.kartu h3{margin:18px 0 8px;font-size:13px;color:var(--redup);font-weight:600}
.kartu .isian{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 14px;align-items:end;margin:10px 0}
.kartu .isian.sebaris{grid-template-columns:repeat(auto-fit,minmax(160px,max-content))}
.kartu label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--redup)}
.kartu input,.kartu textarea{width:100%;margin:0;padding:7px 9px;border-radius:5px;border:1px solid var(--garis);background:var(--sel);color:var(--teks);font:inherit;font-size:13px}
.kartu textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.5;resize:vertical}
.kartu .aksi{display:flex;gap:8px}.kartu form.sebaris{margin:8px 0 0}
.kartu button.utama{margin:0;padding:8px 14px;background:var(--biru);color:#fff;border:0;border-radius:5px;font-weight:600;cursor:pointer}
.kartu button.utama:hover{filter:brightness(1.1)}
.catatan{font-size:12px;color:var(--redup);margin:8px 0}.catatan code,.kartu code{background:var(--tombol);padding:1px 4px;border-radius:3px}
.redup{color:var(--redup)}
.status{font-size:13px;padding:8px 10px;border-radius:5px;background:var(--tombol);margin:6px 0}
.status:empty{display:none}.status.baik{color:#2fbf71}.status.buruk{color:var(--merah)}.status.tunggu{color:#e0a100}
.kabar{width:100%;max-width:860px;padding:9px 12px;border-radius:6px;font-size:13px;margin:6px 0}
.kartu .kabar{max-width:none}
.kabar.ok{background:rgba(47,191,113,.12);border:1px solid rgba(47,191,113,.35)}
.kabar.galat{background:rgba(242,54,69,.10);border:1px solid rgba(242,54,69,.35);color:var(--merah)}
.tautan{display:flex;gap:6px;margin-top:8px}.tautan input{flex:1;font-family:ui-monospace,Menlo,monospace;font-size:12px}
.tabeladmin{width:100%;border-collapse:collapse;font-size:12.5px}
.tabeladmin th{text-align:left;color:var(--redup);font-weight:600;border-bottom:1px solid var(--garis);padding:6px 8px}
.tabeladmin td{border-bottom:1px solid var(--garis);padding:6px 8px}.tabeladmin form{margin:0}
@media (max-width:600px){.adminwrap{padding:10px}.kartu{padding:12px}.tabeladmin{display:block;overflow-x:auto;white-space:nowrap}}
.tabeladmin th,.tabeladmin td{text-align:left!important}

/* tautan versi -> /about */
.versikotak a{color:inherit;text-decoration:none}.versikotak a:hover{text-decoration:underline}

/* halaman about: latar & warna ikut tema login (dark default, body.terang = light) */
.tentangwrap{position:relative;z-index:1;flex:1 1 auto;min-height:0;overflow:auto;padding:0 16px 40px}
.tentangwrap .kembali{position:fixed;top:14px;left:16px;z-index:5;font-size:13px;font-weight:600;color:#d6d9de;text-decoration:none}
.tentangwrap .kembali:hover{text-decoration:underline}
.tentangkepala{text-align:center;margin:0 auto}
.tentangkepala .merek{margin-top:8vh}
.tentangkepala h1{margin:26px 0 6px;font-size:30px;letter-spacing:.06em;text-transform:uppercase;color:#eef1f5;text-shadow:0 0 14px rgba(0,0,0,.9)}
.tagline{margin:0;font-size:15px;font-style:italic;color:rgba(214,220,230,.8);text-shadow:0 0 10px rgba(0,0,0,.9)}
.tentang{max-width:760px;margin:28px auto 0;padding:8px 28px 18px;border-radius:12px;color:#dfe3e9;line-height:1.65;font-size:15px;
 background:rgba(12,14,18,.58);backdrop-filter:blur(14px) saturate(.8);-webkit-backdrop-filter:blur(14px) saturate(.8);
 border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 40px rgba(0,0,0,.55)}
.tentang section{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.tentang h2{margin:0 0 10px;font-size:19px;color:#f2f4f7}
.tentang h3{margin:0 0 4px;font-size:14.5px;color:#8fb0ff}
.tentang p{margin:0 0 10px}.tentang b{color:#f2f4f7}
.tentang .poin{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.tentang .poin>div{padding:12px 14px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}
.tentang .poin p{margin:0;font-size:14px}
.tentang .daftar{margin:0;padding-left:20px}.tentang .daftar li{margin:6px 0}
.tentang .ajakan{text-align:center;border-bottom:0}
.tentang .redup{color:rgba(214,220,230,.6);font-size:13px}
.tombolutama{display:inline-block;margin-top:6px;padding:9px 22px;border-radius:6px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);
 color:#e6e9ee;font-weight:600;letter-spacing:.03em;text-decoration:none}.tombolutama:hover{background:rgba(255,255,255,.16)}
.tentangkaki{padding-top:12px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:rgba(214,220,230,.55)}
.tentangkaki p{margin:4px 0}.tentangkaki p:first-child{font-style:italic;text-transform:lowercase}
.terang .tentangwrap .kembali,.terang .tentangkepala h1{color:#1f2328;text-shadow:none}.terang .tagline{color:#4b5563;text-shadow:none}
.terang .tentang{background:rgba(255,255,255,.78);color:#2b3036;border-color:rgba(0,0,0,.08);box-shadow:0 10px 40px rgba(0,0,0,.12)}
.terang .tentang h2,.terang .tentang b{color:#1f2328}.terang .tentang h3{color:#1a56db}
.terang .tentang section{border-bottom-color:rgba(0,0,0,.08)}
.terang .tentang .poin>div{background:rgba(0,0,0,.025);border-color:rgba(0,0,0,.07)}
.terang .tentang .redup,.terang .tentangkaki{color:#6b7280}.terang .tentangkaki{border-top-color:rgba(0,0,0,.08)}
.terang .tombolutama{background:#1f2328;border-color:#1f2328;color:#fff}.terang .tombolutama:hover{background:#343a42}
@media (max-width:600px){.tentang{padding:4px 16px 14px;font-size:14.5px}.tentangkepala h1{font-size:23px}.tentangkepala .merek{margin-top:10vh}}
.bar .infolink{color:inherit;text-decoration:none}.bar .infolink:hover{text-decoration:underline;color:var(--teks)}
.judul .infolink{pointer-events:auto;color:inherit;text-decoration:none}.judul .infolink:hover{text-decoration:underline}

/* alat ukur (Shift+klik) */
.ukur{position:absolute;display:none;border:1px solid;box-sizing:border-box}
.ukurlabel{position:absolute;left:0;top:0;display:none;padding:4px 9px;border-radius:4px;color:#fff;font-size:12px;font-weight:600;line-height:1.4;
 text-align:center;white-space:pre;box-shadow:0 2px 8px rgba(0,0,0,.35)}

/* tooltip panel kiri chart */
.tipkiri{position:fixed;z-index:50;display:none;max-width:260px;padding:6px 9px;border-radius:5px;font-size:12px;line-height:1.4;
 background:#1f242c;color:#e6e9ee;border:1px solid #2f3540;box-shadow:0 4px 14px rgba(0,0,0,.45);pointer-events:none;white-space:normal}
.terang .tipkiri{background:#fff;color:#1f2328;border-color:#d9dde3;box-shadow:0 4px 14px rgba(0,0,0,.15)}

/* label TF di ujung garis: tidak tebal */
.labeltf{font-weight:400!important}
/* tooltip info garis (LI) */
.tipgaris{position:absolute;left:0;top:0;display:none;z-index:7;padding:6px 9px;border-radius:5px;border:1px solid;font-size:12px;line-height:1.45;
 white-space:nowrap;background:rgba(20,24,30,.94);color:#dfe3e9;box-shadow:0 4px 14px rgba(0,0,0,.45);pointer-events:none}
.tipgaris .kepala{font-weight:700;font-size:12.5px}.tipgaris .bo{color:#e0a100}
.terang .tipgaris{background:rgba(255,255,255,.96);color:#2b3036;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.tipkiri{white-space:pre-line}

/* LD: dot candle 0 (lapisan atas, bukan penanda seri) */
.ldot{position:absolute;left:0;top:0;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border-radius:50%;background:currentColor;display:none}
.ldot.bo{width:9px;height:9px;margin:-4.5px 0 0 -4.5px;background:transparent;border:2px solid currentColor;box-sizing:border-box}

/* pengingat masa akses (2 hari sebelum habis) */
.bannerakses{flex:none;padding:7px 14px;font-size:12.5px;font-weight:600;text-align:center;background:rgba(224,161,0,.14);color:#e0a100;border-bottom:1px solid rgba(224,161,0,.35)}
.terang .bannerakses{background:#fff6d6;color:#8a6100;border-bottom-color:#f0d78a}
/* admin: baris masa akses */
.tabeladmin tr.hampir td{background:rgba(224,161,0,.10)}.tabeladmin tr.habis td{background:rgba(242,54,69,.10)}
.tabeladmin form.perpanjang{display:inline-flex;gap:4px;align-items:center;margin-right:4px}
.tabeladmin form.perpanjang input{width:70px;padding:4px 6px;font-size:12px}
/* about: Telegram */
.tentang a.telegram{color:#5aa9e6;font-weight:600;text-decoration:none}.tentang a.telegram:hover{text-decoration:underline}
.tomboltentang{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.tombolutama.telegramtombol{background:#229ed9;border-color:#229ed9;color:#fff}.tombolutama.telegramtombol:hover{background:#1b8cc2}
.tombolutama.kedua{background:transparent}
.terang .tentang a.telegram{color:#1a7bb8}.terang .tombolutama.kedua{background:transparent;color:#1f2328}
.tabel2 td.angka.lalu{color:var(--redup);font-style:italic}
/* /analytic (ex /chart4): grid 2x2 iframe chart (panel = /chart?embed=1&grid=1) */
.grid4{flex:1 1 auto;min-width:0;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:3px;background:var(--garis)}
.grid4 iframe{width:100%;height:100%;border:0;display:block;background:var(--bg)}
@media (max-width:700px){.grid4{grid-template-columns:1fr;grid-template-rows:repeat(4,minmax(320px,1fr));overflow-y:auto}}
body.modegrid .panelkiri{display:none}
/* /dashlevel: L = nama TF (warna arah), GAP = jarak bulat ke level di bawahnya */
.dlevel td.lv{font-weight:700}.dlevel td.lv.naik{color:var(--biru)}.dlevel td.lv.turun{color:var(--merah)}
.dlevel td.gap{color:var(--redup);font-variant-numeric:tabular-nums}
.dlevel td.lv i{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-left:3px;vertical-align:1px}
.dlevel td.lv.m1{animation:kedipm1 2s ease-in-out infinite}
@keyframes kedipm1{0%,100%{opacity:1}50%{opacity:.2}}
.dlevel tbody tr{cursor:pointer}

/* chart: pemisah tegas antara pilihan TF dan info level (GAP LEVEL) */
.bar #sinyal{border-left:2px solid #4a525e;margin-left:6px;padding-left:10px}
.terang .bar #sinyal{border-left-color:#aeb5bf}
.bar #sinyal .judulgap{font-size:10px;letter-spacing:.5px;margin-right:2px}
.bar #sinyal .gaplv{font-weight:400!important;font-size:11px}
/* bar atas halaman chart sedikit lebih kecil (muat tanpa scroll) */
.bar:has(#tf),.bar:has(#tf) button,.bar:has(#tf) input,.bar:has(#tf) select,.bar:has(#tf) .chip,.bar:has(#tf) .navlink{font-size:11px!important}
.bar:has(#tf) button,.bar:has(#tf) input,.bar:has(#tf) select,.bar:has(#tf) .chip{height:24px;line-height:24px}
.bar:has(#tf) #tf button{padding:0 5px}
.bar:has(#tf) .grup{padding:0 4px}
.bar #sinyal .judulgap{font-size:10px!important}
.bar #sinyal .gaplv{font-size:10px!important}
/* /trade: panel order minimalis di bawah chart */
.trade{flex:none;border-top:1px solid var(--garis,#252a31);background:var(--kepala,#14171c);font-size:12px}
.trade .tbaris{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 8px}
.trade button,.trade input{height:32px;border-radius:5px;border:1px solid var(--garis,#2c323b);background:var(--sel,#0b0d10);color:inherit;font:inherit;padding:0 8px}
.trade .tstatus{font-weight:700;font-size:11px;padding:2px 6px;border-radius:4px;background:#5a2726;color:#fff}.trade .tstatus.on{background:#1f4a45}
.trade .tlot{display:inline-flex}.trade .tlot button{width:30px;padding:0}.trade .tlot input{width:56px;text-align:center;margin:0 2px}
.trade .tsltp{width:78px}
.trade .tsell,.trade .tbuy{min-width:120px;font-weight:700;border:0;color:#fff}.trade .tsell{background:#ef5350}.trade .tbuy{background:#2962ff}
.trade .tsell b,.trade .tbuy b{font-weight:600;margin-left:4px}
.trade button:disabled{opacity:.45;cursor:not-allowed}
.trade .takun{color:var(--kepalateks,#9aa1ab);margin-left:auto}
.trade .tpos{max-height:30vh;overflow:auto;padding:0 8px 6px}.trade .tpos table{width:100%;border-collapse:collapse}
.trade .tpos th,.trade .tpos td{padding:4px 6px;text-align:right;border-bottom:1px solid var(--garis,#252a31)}.trade .tpos th:first-child,.trade .tpos td:first-child{text-align:left}
.trade .tpos .naik{color:#2962ff}.trade .tpos .turun{color:#ef5350}.trade .tkosong{text-align:center!important;color:var(--kepalateks,#9aa1ab)}
.trade .ttutup{height:24px;width:28px;padding:0}
.trade .tpesan{padding:0 8px 4px;color:var(--kepalateks,#9aa1ab);min-height:0}.trade .tpesan:empty{display:none}.trade .tpesan.err{color:#ef5350}
@media (max-width:700px){.trade .tsell,.trade .tbuy{flex:1 1 40%}.trade .takun{margin-left:0;width:100%}}
/* chart: popup ketebalan garis (klik garis level) */
.poptebal{position:absolute;left:0;top:0;display:none;align-items:center;gap:6px;z-index:8;padding:5px 7px;border-radius:6px;border:1px solid #3a414b;
 background:rgba(20,24,30,.96);color:#dfe3e9;font-size:12px;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.45)}
.poptebal b{font-size:12.5px}.poptebal .nilai{min-width:34px;text-align:center;font-variant-numeric:tabular-nums}
.poptebal button{height:24px;min-width:24px;padding:0 6px;border-radius:4px;border:1px solid #3a414b;background:#1d222a;color:inherit;font:inherit;cursor:pointer}
.poptebal button:disabled{opacity:.4;cursor:default}
.terang .poptebal{background:rgba(255,255,255,.98);color:#2b3036;border-color:#d0d5dc;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.terang .poptebal button{background:#f2f4f7;border-color:#d0d5dc}
/* SCALP: label tidak ada line lebih tinggi / lebih rendah */
.batasscalp{position:absolute;right:76px;display:none;z-index:5;font-size:11px;color:#8a929c;pointer-events:none;white-space:nowrap}
.batasscalp.atas{top:28px}.batasscalp.bawah{bottom:34px}
/* /alert */
.tabel2.alert{width:auto;min-width:min(100%,560px)}
.tabel2.alert td.al{font-weight:700}.tabel2.alert td.al.naik{color:var(--sbiru)}.tabel2.alert td.al.turun{color:var(--smerah)}
.tabel2.alert td.wkt{color:var(--kepalateks);font-variant-numeric:tabular-nums}
.tabel2.alert tbody tr[data-k]{cursor:pointer}
.tabel2.alert .baru{display:inline-block;margin-left:6px;padding:0 5px;border-radius:3px;background:#e0a100;color:#111;font-size:10px;font-weight:700;line-height:16px;vertical-align:1px}
.tabel2.alert tr.barubaris td{background:rgba(224,161,0,.10)}
.tabel2.alert tr.hilang td{opacity:.4}
.tabel2.alert td.kosong{color:var(--kepalateks);text-align:center;padding:18px}
/* /trade v2: lot maks, tab Positions/History, status akun real, total */
.trade .tlotmaks{color:var(--kepalateks,#9aa1ab);font-size:11px}
.trade .ttab{display:inline-flex;gap:4px}.trade .tpostombol.aktif{border-color:#2962ff;color:#fff;background:#1c2a4d}
.trade .tstatus.real{background:#b7791f}
.trade .takun .naik{color:#2962ff}.trade .takun .turun{color:#ef5350}
.trade .tpos tfoot td{font-weight:700;border-bottom:0}

/* /trade: panel order SATU baris di semua layar (sama dengan /app), lebar dibagi persentase; saldo di panel Positions/History */
.trade .tbaris.satu{flex-wrap:nowrap;gap:1%;padding:5px 1%}
.trade .tbaris.satu>*{min-width:0}
.trade .tbaris.satu .tstatus{flex:0 0 auto}
.trade .talgo{flex:0 0 auto;font-weight:700;font-size:10px;padding:2px 4px;border-radius:4px;background:#2a3038;color:#9aa1ab}
.trade .talgo.on{background:#1f4a45;color:#fff}.trade .talgo.off{background:#5a2726;color:#fff}
.trade .tbaris.satu .tlot{flex:0 1 20%;display:flex}
.trade .tbaris.satu .tlot button{flex:0 0 28%;width:auto;padding:0}
.trade .tbaris.satu .tlot input{flex:1 1 auto;width:0;min-width:0;text-align:center;margin:0 2px;padding:0 2px}
.trade .tbaris.satu .tsell,.trade .tbaris.satu .tbuy{flex:1 1 22%;min-width:0;padding:0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trade .tbaris.satu .tpostombol{flex:0 1 13%;padding:0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trade .tpos .takun{margin:4px 0 6px;font-size:12px}
@media (max-width:640px){.trade .tbaris.satu .tpostombol{font-size:0}.trade .tbaris.satu .tpostombol b{font-size:11px}
 .trade .tbaris.satu #tTabPos::before{content:'Pos ';font-size:11px}.trade .tbaris.satu #tTabRiw::before{content:'Hist ';font-size:11px}}
@media (max-width:440px){.trade .tbaris.satu,.trade .tbaris.satu .tlot button,.trade .tbaris.satu input{font-size:11px}
 .trade .tbaris.satu .tstatus,.trade .talgo{font-size:9px;padding:2px 3px}
 .trade .tbaris.satu .tlot{flex:0 0 74px}.trade .tbaris.satu .tlot button{flex:0 0 20px}
 .trade .tbaris.satu .tsell,.trade .tbaris.satu .tbuy{font-size:0;padding:0 3px}
 .trade .tbaris.satu .tsell b,.trade .tbaris.satu .tbuy b{font-size:11px;margin:0}}
@media (max-width:440px){.trade .tbaris.satu .tpostombol{flex:0 0 auto;padding:0 3px}}
@media (max-width:380px){.trade .tbaris.satu .tlot{flex:0 0 62px}.trade .tbaris.satu .tlot button{flex:0 0 17px}.trade .tbaris.satu .tstatus,.trade .talgo{font-size:8.5px;padding:2px 2px}}
/* ===== halaman login / 2FA / aktivasi (14-11): satu gaya dengan /app -- latar hitam, kepala macan, kotak panel gelap ===== */
.latar.hitam{background:#000}
.masuk-kepala{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;margin-top:9vh}
.masuk-macan{width:min(34vw,150px);height:auto}
.masuk-nama{margin-top:12px;font:600 13px -apple-system,system-ui,Roboto,"Segoe UI",sans-serif;letter-spacing:1px;color:#e6e9ee}
.kotak.masuk{max-width:340px;margin:3.5vh auto 0;padding:16px 18px 12px;background:#171b21;border:1px solid #2a3038;border-radius:8px;
  box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.kotak.masuk h1{font-size:14px;color:#e6e9ee}
.kotak.masuk label{font-size:12px;color:#7d8894}
.kotak.masuk input{background:#0f1216;border:1px solid #2a3038;color:#d8dde3;font-size:15px}
.kotak.masuk button{background:#2962ff;border:0;color:#fff;font-weight:600;letter-spacing:.02em}
.kotak.masuk button:hover{background:#3a6fff}
.kotak.masuk .versikotak{color:#7d8894}
.latar.hitam~.merek3{color:#5d6670;text-shadow:none;font-size:12px}
/* light */
.terang .latar.hitam{background:#f5f6f8}
.terang .masuk-nama{color:#1f2328}
.terang .kotak.masuk{background:#fff;border-color:#e3e6ea}
.terang .kotak.masuk h1{color:#1f2328}.terang .kotak.masuk input{background:#fff;border-color:#d0d5dc;color:#1f2328}
.terang .latar.hitam~.merek3{color:#8a929c}
.kotak.masuk button{width:100%;padding:10px;margin-top:6px}
.terang .masuk-macan{border-radius:22%;box-shadow:0 6px 18px rgba(0,0,0,.18)}
/* kotak form menyatu dengan latar (tanpa panel / garis): yang menonjol hanya kotak input, tombol, dan motto */
.kotak.masuk{background:transparent;border:0;box-shadow:none}
.kotak.masuk input{background:#14181e;border:1px solid #39414c}
.terang .kotak.masuk{background:transparent;border:0;box-shadow:none}
.terang .kotak.masuk input{background:#fff;border-color:#c3c9d1}
/* login: gambar macan (garis) sebagai LATAR di belakang form; gelap = dibalik jadi garis terang + redup, terang = apa adanya */
.latar.hitam::before{content:'';position:absolute;inset:0;background:url(/static/macan-latar.jpg) center/auto min(94vh,150vw) no-repeat;
  filter:invert(1);opacity:.2;pointer-events:none}
.terang .latar.hitam::before{filter:none;opacity:.16}
.masuk-kepala{margin-top:24vh}
.masuk-nama{font-size:14px;letter-spacing:2px;text-shadow:0 0 12px #000,0 0 4px #000}
.terang .masuk-nama{text-shadow:0 0 12px #fff,0 0 4px #fff}
.kotak.masuk label,.kotak.masuk .versikotak{text-shadow:0 0 6px #000,0 0 2px #000}.terang .kotak.masuk label,.terang .kotak.masuk .versikotak{text-shadow:0 0 6px #fff,0 0 2px #fff}
/* tombol login biometrik (passkey) di bawah tombol Login */
.kotak.masuk .bio{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px;padding:10px;background:transparent;border:1px solid #39414c;color:#d8dde3;font-weight:600}
.kotak.masuk .bio[hidden]{display:none}
.kotak.masuk .bio svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.kotak.masuk .bio:hover{background:rgba(255,255,255,.06)}
.pesanbio{margin:6px 0 0;font-size:12px;color:#8a929c;min-height:0}.pesanbio:empty{display:none}
.terang .kotak.masuk .bio{border-color:#c3c9d1;color:#1f2328}
.pesanbio{color:#8a929c}
.kotak.masuk label.percaya{display:flex;align-items:center;gap:8px;margin:10px 0 4px;font-size:13px;color:#c9ced6;cursor:pointer}
.kotak.masuk label.percaya input{width:auto;margin:0;accent-color:#2962ff;transform:scale(1.15)}
.terang .kotak.masuk label.percaya{color:#1f2328}
/* admin: izin trading akun real */
#real b.ok{color:#26a69a}#real b.real{color:#e0a100}
.utama.bahaya{background:#b7791f!important;border-color:#b7791f!important;color:#fff}
