@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&family=Vazirmatn:wght@400;600;800&family=JetBrains+Mono:wght@500&display=swap");
:root{--bg:#05070D;--mid:#081323;--gr:#111827;--ice:#8BE9FF;--cy:#39CFFF;--fr:#F2FAFF;--deep:#153B62;--gold:#D8B15C;--champ:#F6D98A;--sil:#C9D7E5;
--up:#10b981;--down:#e5484d;--mut:#7b8aa0;--glass:rgba(16,28,48,.55);--bd:rgba(139,233,255,.16);--r:18px}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fr);font:15px/1.55 Inter,Vazirmatn,system-ui,sans-serif;min-height:100vh}
html[dir=rtl] body{font-family:Vazirmatn,Inter,system-ui,sans-serif}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:radial-gradient(60% 50% at 15% 0%,rgba(57,207,255,.14),transparent 60%),
radial-gradient(50% 40% at 100% 20%,rgba(216,177,92,.10),transparent 60%),radial-gradient(70% 60% at 50% 110%,rgba(21,59,98,.55),transparent 70%),
linear-gradient(180deg,#05070D,#081323 60%,#05070D)}
body:after{content:"";position:fixed;inset:0;z-index:-2;opacity:.18;background-image:linear-gradient(rgba(139,233,255,.07) 1px,transparent 1px),
linear-gradient(90deg,rgba(139,233,255,.07) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(circle at 50% 30%,#000,transparent 75%)}
#snow{position:fixed;inset:0;z-index:-1;pointer-events:none}
.crystals{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.crystals i{position:absolute;display:block;clip-path:polygon(50% 0,100% 38%,50% 100%,0 38%);background:linear-gradient(135deg,rgba(242,250,255,.22),rgba(139,233,255,.08) 45%,rgba(21,59,98,.25));
border:1px solid rgba(255,255,255,.2);filter:drop-shadow(0 0 18px rgba(57,207,255,.25));animation:drift 24s ease-in-out infinite alternate}
@keyframes drift{to{transform:translateY(-30px) rotate(8deg)}}
body.calm .crystals i,body.calm *{animation:none!important;transition:none!important}body.calm #snow{display:none}
a{color:var(--ice);text-decoration:none}
.wrap{max-width:1280px;margin:auto;padding:0 18px}
header{position:sticky;top:0;z-index:20;background:rgba(5,7,13,.72);backdrop-filter:blur(16px);border-bottom:1px solid var(--bd)}
.nav{display:flex;align-items:center;gap:10px;padding:10px 0;flex-wrap:wrap}
.brand{display:flex;gap:10px;align-items:center;margin-inline-end:auto}.brand img{width:38px;filter:drop-shadow(0 0 10px rgba(139,233,255,.6))}
.brand b{font-size:19px;font-weight:800;background:linear-gradient(90deg,var(--fr),var(--ice),var(--champ));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand small{display:block;font-size:10px;letter-spacing:3px;color:var(--gold)}
.links{display:flex;gap:2px;flex-wrap:wrap}.links a{padding:8px 12px;border-radius:12px;color:var(--sil);font-size:14px}
.links a.on,.links a:hover{background:rgba(139,233,255,.08);color:var(--fr);box-shadow:inset 0 0 0 1px var(--bd)}
.mode{padding:4px 10px;border-radius:99px;font-size:11px;font-weight:800;letter-spacing:1px}
.mode.paper{background:rgba(139,233,255,.12);color:var(--ice)}.mode.testnet{background:rgba(246,217,138,.14);color:var(--champ)}.mode.live{background:rgba(229,72,77,.18);color:#ff9a9d}
.glass{background:linear-gradient(160deg,rgba(242,250,255,.06),rgba(21,59,98,.18) 60%,rgba(5,7,13,.3));border:1px solid var(--bd);border-radius:var(--r);
backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(242,250,255,.08);position:relative;overflow:hidden}
.glass:before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(216,177,92,.55),transparent 30%,transparent 70%,rgba(139,233,255,.4));
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.glass:hover{box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 26px rgba(57,207,255,.12)}
.page{padding:22px 0 60px;animation:in .45s ease}@keyframes in{from{opacity:0;transform:translateY(10px)}}
h1,h2,h3{margin:0 0 12px;font-weight:800}h2{font-size:22px}h3{font-size:16px;color:var(--champ)}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:14px 0}
.kpi{padding:14px 16px}.kpi small{color:var(--mut);display:block;font-size:12px}.kpi b{font-size:24px;font-family:"JetBrains Mono",monospace;font-variant-numeric:tabular-nums;color:var(--fr)}
.kpi b.up{color:var(--up)}.kpi b.down{color:var(--down)}.kpi .sub{font-size:12px;color:var(--mut)}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}@media(max-width:900px){.grid2{grid-template-columns:1fr}}
.panel{padding:18px}.row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.btn{border:0;cursor:pointer;font:inherit;font-weight:700;padding:10px 18px;border-radius:12px;color:#05070D;background:linear-gradient(135deg,var(--fr),var(--ice) 45%,var(--cy));
box-shadow:0 6px 20px rgba(57,207,255,.25);transition:.2s}.btn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.btn.gold{background:linear-gradient(135deg,var(--champ),var(--gold));box-shadow:0 6px 20px rgba(216,177,92,.25)}
.btn.ghost{background:rgba(139,233,255,.06);color:var(--fr);box-shadow:inset 0 0 0 1px var(--bd)}.btn.red{background:linear-gradient(135deg,#ff8a8d,#e5484d);color:#fff}
.btn.sm{padding:6px 12px;font-size:13px}.btn:disabled{opacity:.4;cursor:not-allowed}
label{display:block;font-size:12px;color:var(--sil);margin:10px 0 5px}
input,select{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--bd);background:rgba(5,7,13,.6);color:var(--fr);font:inherit;outline:none}
input:focus,select:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(139,233,255,.12)}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:4px 14px}
table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:8px;border-bottom:1px solid rgba(139,233,255,.08);text-align:start}
th{color:var(--mut);font-weight:600}td.n,.mono{font-family:"JetBrains Mono",monospace;font-variant-numeric:tabular-nums}
.scroll{overflow-x:auto}.tag{padding:3px 9px;border-radius:99px;font-size:11px;font-weight:800}
.buy{color:var(--up)}.sell{color:var(--down)}.tag.running{background:rgba(16,185,129,.15);color:var(--up)}.tag.paused{background:rgba(246,217,138,.15);color:var(--champ)}
.tag.stopped,.tag.draft{background:rgba(123,138,160,.15);color:var(--sil)}
.msg{padding:12px 14px;border-radius:14px;margin:10px 0;font-size:14px}.msg.warn{background:rgba(246,217,138,.1);border:1px solid rgba(246,217,138,.35);color:var(--champ)}
.msg.err{background:rgba(229,72,77,.12);border:1px solid rgba(229,72,77,.4);color:#ffb3b5}.msg.info{background:rgba(139,233,255,.07);border:1px solid var(--bd)}
canvas.chart{width:100%;height:320px;display:block}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-inline-end:6px}.dot.ok{background:var(--up);box-shadow:0 0 10px var(--up)}.dot.bad{background:var(--down)}
.login{max-width:400px;margin:9vh auto;padding:30px;text-align:center}.login img{width:84px;filter:drop-shadow(0 0 22px rgba(139,233,255,.7));animation:spin 9s linear infinite}
@keyframes spin{50%{transform:rotateY(180deg)}}
.hero-t{font-size:30px;font-weight:800;background:linear-gradient(90deg,var(--fr),var(--ice),var(--champ),var(--fr));background-size:200%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sh 8s linear infinite}
@keyframes sh{to{background-position:200%}}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:50}
#toast div{padding:12px 20px;border-radius:12px;background:rgba(8,19,35,.95);border:1px solid var(--ice);margin-top:8px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
#toast div.err{border-color:var(--down)}
.skel{height:120px;border-radius:var(--r);background:linear-gradient(100deg,rgba(255,255,255,.03) 30%,rgba(139,233,255,.08) 50%,rgba(255,255,255,.03) 70%);background-size:300%;animation:sk 1.3s infinite}
@keyframes sk{to{background-position:-150%}}
.levels{max-height:300px;overflow:auto;font-size:13px}.levels div{display:flex;justify-content:space-between;padding:4px 8px;border-bottom:1px dashed rgba(139,233,255,.08)}
@media(max-width:640px){.links{width:100%;overflow-x:auto;flex-wrap:nowrap}.kpi b{font-size:19px}}
/* ===== v2: themes, aurora, live P&L, app feel ===== */
body{--accent:var(--ice);--snow:rgba(242,250,255,.7);--a1:rgba(57,207,255,.16);--a2:rgba(216,177,92,.12);--a3:rgba(21,59,98,.6)}
body[data-theme=gold]{--ice:#F0B90B;--cy:#F8D12F;--fr:#EAECEF;--deep:#2B3139;--gold:#F0B90B;--champ:#FCD535;--accent:#F0B90B;--up:#0ECB81;--down:#F6465D;
  --bd:rgba(240,185,11,.18);--a1:rgba(240,185,11,.14);--a2:rgba(14,203,129,.08);--a3:rgba(43,49,57,.7);--snow:rgba(252,213,53,.45)}
body[data-theme=bybit]{--ice:#F7A600;--cy:#FFB11A;--fr:#F5F5F5;--deep:#17181E;--gold:#F7A600;--champ:#FFC24D;--accent:#F7A600;--up:#20B26C;--down:#EF454A;
  --bd:rgba(247,166,0,.2);--a1:rgba(247,166,0,.14);--a2:rgba(239,69,74,.08);--a3:rgba(23,24,30,.8);--snow:rgba(255,194,77,.4)}
body[data-theme=emerald]{--ice:#34F5C5;--cy:#10B981;--deep:#064E3B;--gold:#E6C068;--champ:#F3DA8C;--accent:#34F5C5;--bd:rgba(52,245,197,.16);
  --a1:rgba(16,185,129,.18);--a2:rgba(230,192,104,.1);--a3:rgba(6,78,59,.55);--snow:rgba(167,243,208,.55)}
body[data-theme=violet]{--ice:#C4B5FD;--cy:#A855F7;--deep:#3B0764;--gold:#F0ABFC;--champ:#F5D0FE;--accent:#C4B5FD;--bd:rgba(196,181,253,.18);
  --a1:rgba(168,85,247,.2);--a2:rgba(236,72,153,.12);--a3:rgba(59,7,100,.55);--snow:rgba(233,213,255,.55)}
body:before{background:radial-gradient(55% 45% at 12% 0%,var(--a1),transparent 60%),radial-gradient(45% 40% at 100% 18%,var(--a2),transparent 60%),
  radial-gradient(70% 60% at 50% 115%,var(--a3),transparent 70%),linear-gradient(180deg,#05070D,#080c16 60%,#05070D)!important;animation:aurora 22s ease-in-out infinite alternate}
@keyframes aurora{0%{filter:hue-rotate(0deg) brightness(1)}100%{filter:hue-rotate(18deg) brightness(1.15)}}
.brand b{background:linear-gradient(90deg,var(--fr),var(--ice),var(--champ))!important;-webkit-background-clip:text!important;background-clip:text!important}
.btn{background:linear-gradient(135deg,var(--fr),var(--ice) 45%,var(--cy))}
.mode{display:inline-flex;align-items:center;gap:6px}.pulse,.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--up);box-shadow:0 0 0 0 var(--up);animation:pl 1.8s infinite}
@keyframes pl{70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
select.mini{width:auto;padding:6px 8px;font-size:12px;border-radius:10px}
#main{padding:18px 0 90px}#main.enter{animation:enter .35s cubic-bezier(.2,.8,.2,1)}
@keyframes enter{from{opacity:0;transform:translateY(8px) scale(.995)}to{opacity:1;transform:none}}
.glass{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}.glass.kpi:hover,.scard:hover{transform:translateY(-3px)}
.glass:after{content:"";position:absolute;top:-60%;left:-30%;width:40%;height:220%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.07),transparent);
  transform:rotate(18deg);animation:shimmer 9s ease-in-out infinite;pointer-events:none}
@keyframes shimmer{0%,70%{left:-40%}100%{left:130%}}
.hero-pnl{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px;margin:14px 0;flex-wrap:wrap;
  box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 60px -10px var(--up)}.hero-pnl.neg{box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 60px -10px var(--down)}
.hero-pnl small{color:var(--mut)}.hero-pnl .big{font:800 46px/1.1 "JetBrains Mono",monospace;letter-spacing:-1px;margin:4px 0}
.hero-pnl .big.up{color:var(--up);text-shadow:0 0 24px color-mix(in srgb,var(--up) 50%,transparent)}.hero-pnl .big.down{color:var(--down);text-shadow:0 0 24px color-mix(in srgb,var(--down) 50%,transparent)}
.hero-side{display:grid;grid-template-columns:repeat(3,auto);gap:8px 22px}.hero-side b{display:block;font:700 18px "JetBrains Mono",monospace}
.up{color:var(--up)!important}.down{color:var(--down)!important}
.flash-up{animation:fu .7s}.flash-down{animation:fd .7s}@keyframes fu{0%{background:color-mix(in srgb,var(--up) 35%,transparent)}100%{background:transparent}}
@keyframes fd{0%{background:color-mix(in srgb,var(--down) 35%,transparent)}100%{background:transparent}}
.chartbox{padding:14px 16px;margin:14px 0}canvas.chart.tall{height:440px}.big2{font-size:26px;font-weight:800;color:var(--accent)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 8px}.chip{border:1px solid var(--bd);background:rgba(255,255,255,.04);color:var(--fr);padding:6px 12px;border-radius:99px;
  font:600 12px Inter,Vazirmatn,sans-serif;cursor:pointer;transition:.18s}.chip:hover{border-color:var(--accent)}
.chip.on{background:linear-gradient(135deg,var(--ice),var(--cy));color:#05070D;border-color:transparent;box-shadow:0 4px 14px color-mix(in srgb,var(--accent) 35%,transparent)}
details.adv summary{cursor:pointer;color:var(--champ);font-weight:700;margin:12px 0 4px;list-style:none}details.adv summary::-webkit-details-marker{display:none}
.scard{display:block;padding:14px;margin:10px 0;color:var(--fr)}.mut{color:var(--mut)}.small{font-size:12px}.disc{color:var(--mut);font-size:12px;margin-top:28px}
.msg.slim{padding:8px 12px;font-size:13px}.tagline{color:var(--gold);letter-spacing:4px;font-size:11px}
tr.fade{animation:enter .4s}
.tabbar{display:none}
@media(max-width:760px){header .links{display:none}.tabbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;justify-content:space-around;
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));background:rgba(5,7,13,.82);backdrop-filter:blur(18px);border-top:1px solid var(--bd)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--mut);font-size:11px;padding:4px 10px;border-radius:12px;transition:.2s}
  .tabbar a span{font-size:20px}.tabbar a.on{color:var(--accent);background:rgba(255,255,255,.05);transform:translateY(-2px)}
  .hero-pnl .big{font-size:36px}.hero-side{grid-template-columns:repeat(3,1fr);width:100%}canvas.chart.tall{height:360px}.brand small{display:none}}
canvas{direction:ltr}
.kpi b,.hero-pnl .big,.hero-side b,.big2,.mono,td.n,.hero-pnl .sub,.scard .row span{direction:ltr;unicode-bidi:isolate}