:root{--bg:#0a0e16;--panel:#111827;--panel2:#0f1522;--line:#1e293b;--txt:#e5e7eb;--mut:#8b97ab;--acc:#3b82f6;--acc2:#14b8a6;--grn:#22c55e;--red:#ef4444;--yel:#f59e0b}
body.light{--bg:#f3f5f9;--panel:#ffffff;--panel2:#f8fafc;--line:#e2e8f0;--txt:#0f172a;--mut:#64748b}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--txt);font-family:"Segoe UI",Tahoma,"Noto Sans Arabic",Arial,sans-serif;font-size:14px;display:flex}
.side{width:230px;min-height:100vh;background:var(--panel);border-inline-end:1px solid var(--line);display:flex;flex-direction:column;padding:18px 12px;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:10px;align-items:center;margin-bottom:26px;padding:0 6px}
.brand small{display:block;color:var(--mut);font-size:11px}
.logo{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--acc),var(--acc2));display:grid;place-items:center;font-weight:800;font-size:20px;color:#fff}
nav a{display:flex;gap:10px;align-items:center;padding:11px 12px;border-radius:9px;color:var(--mut);cursor:pointer;margin-bottom:4px;font-weight:600}
nav a:hover{background:var(--panel2);color:var(--txt)}
nav a.active{background:rgba(59,130,246,.14);color:var(--acc)}
.ic{width:20px;text-align:center}
.side-bottom{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
.disc-link{width:100%;color:var(--yel);font-size:12px;cursor:pointer;margin-top:6px}
main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;justify-content:space-between;align-items:center;padding:16px 26px;border-bottom:1px solid var(--line);background:var(--panel);position:sticky;top:0;z-index:5;gap:10px;flex-wrap:wrap}
.top h1{font-size:20px;margin:0}
.top-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#content{padding:22px 26px;flex:1}
.foot{padding:12px 26px;color:var(--mut);font-size:12px;border-top:1px solid var(--line)}
.badge{padding:5px 11px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid var(--line);background:var(--panel2);white-space:nowrap}
.b-green{color:var(--grn);border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.1)}
.b-red{color:var(--red);border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.1)}
.b-yel{color:var(--yel);border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.1)}
.b-blue{color:var(--acc);border-color:rgba(59,130,246,.4);background:rgba(59,130,246,.1)}
.live-banner{background:var(--red);color:#fff;text-align:center;padding:8px;font-weight:700}
.hidden{display:none!important}
.grid{display:grid;gap:14px}
.cards{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px}
.card h3{margin:0 0 12px;font-size:15px}
.kpi .lbl{color:var(--mut);font-size:12px;margin-bottom:8px}
.kpi .val{font-size:22px;font-weight:800;direction:ltr;text-align:start;unicode-bidi:plaintext}
.pos{color:var(--grn)}.neg{color:var(--red)}.mut{color:var(--mut)}
.row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.two{grid-template-columns:2fr 1fr}
@media(max-width:1100px){.two{grid-template-columns:1fr}}
table{width:100%;border-collapse:collapse}
th,td{padding:9px 8px;text-align:start;border-bottom:1px solid var(--line);font-size:13px;white-space:nowrap}
th{color:var(--mut);font-weight:600;font-size:12px}
td.num{direction:ltr;unicode-bidi:plaintext}
.tbl-wrap{overflow:auto}
button{font-family:inherit;cursor:pointer;border-radius:9px;border:1px solid var(--line);padding:8px 14px;font-weight:700;background:var(--panel2);color:var(--txt)}
button.primary{background:var(--acc);border-color:var(--acc);color:#fff}
button.danger{background:var(--red);border-color:var(--red);color:#fff}
button.ghost{background:transparent}
button.sm{padding:4px 10px;font-size:12px}
button:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{font-family:inherit;background:var(--panel2);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13px;width:100%}
input[type=checkbox]{width:auto}
label.f{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--mut)}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.fgroup{margin-bottom:16px}
.fgroup h4{margin:0 0 10px;font-size:13px;color:var(--acc2)}
.switch{position:relative;display:inline-block;width:42px;height:23px}
.switch input{opacity:0;width:0;height:0}
.switch i{position:absolute;inset:0;background:#374151;border-radius:999px;transition:.2s;cursor:pointer}
.switch i:before{content:"";position:absolute;width:17px;height:17px;inset-inline-start:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch input:checked+i{background:var(--grn)}
.switch input:checked+i:before{transform:translateX(19px)}
[dir=rtl] .switch input:checked+i:before{transform:translateX(-19px)}
.switch-wrap{display:flex;gap:8px;align-items:center;font-weight:700;font-size:13px}
.tabs{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}
.tabs button{background:transparent}
.tabs button.active{background:var(--acc);border-color:var(--acc);color:#fff}
.note{background:var(--panel2);border:1px dashed var(--line);border-radius:10px;padding:12px;color:var(--mut);font-size:12.5px;line-height:1.8}
.warn{background:rgba(245,158,11,.08);border:1px solid rgba(245,158,11,.35);border-radius:10px;padding:12px;font-size:12.5px;line-height:1.8}
.warn b{color:var(--yel)}
.modecard{border:2px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;background:var(--panel2)}
.modecard.sel{border-color:var(--acc)}
.modecard.live.sel{border-color:var(--red)}
.modecard h4{margin:0 0 6px}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:grid;place-items:center;z-index:50}
.modal-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;max-width:560px;width:92%;max-height:88vh;overflow:auto;line-height:1.8}
.toast{position:fixed;bottom:20px;inset-inline-start:20px;background:var(--panel);border:1px solid var(--line);padding:12px 18px;border-radius:10px;z-index:60;box-shadow:0 8px 30px rgba(0,0,0,.4)}
canvas{width:100%;height:220px;display:block}
.progress{height:8px;background:var(--panel2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}
.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--acc2))}
.ev{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.ev time{color:var(--mut);white-space:nowrap;direction:ltr}
.lv{font-size:10px;padding:2px 7px;border-radius:6px;font-weight:700;height:fit-content}
.lv-trade{background:rgba(34,197,94,.15);color:var(--grn)}.lv-signal{background:rgba(59,130,246,.15);color:var(--acc)}
.lv-warn{background:rgba(245,158,11,.15);color:var(--yel)}.lv-error{background:rgba(239,68,68,.15);color:var(--red)}.lv-info{background:var(--panel2);color:var(--mut)}
code,pre{direction:ltr;text-align:left;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:2px 6px;font-size:12px}
pre{padding:10px;white-space:pre-wrap;word-break:break-all}
details summary{cursor:pointer;color:var(--acc);font-weight:700;margin:8px 0}

.auth{position:fixed;inset:0;background:var(--bg);z-index:80;display:grid;place-items:center}
.auth-box{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;width:min(400px,92%)}
.auth-box h2{margin:10px 0 4px}
.userbox{width:100%;font-size:12px;color:var(--mut);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:10px}
body.role-viewer #content button.primary, body.role-viewer #content button.danger, body.role-viewer .switch, body.role-viewer #content button.sm{pointer-events:none;opacity:.35}
body:not(.role-admin):not(.role-manager) nav a[data-page=link]{display:none}
.qr{background:#fff;padding:10px;border-radius:12px;width:220px;height:220px}
.qr img{width:100%;height:100%}
@media(max-width:800px){body{flex-direction:column}.side{width:100%;height:auto;min-height:0;position:static;flex-direction:row;flex-wrap:wrap;padding:8px}.brand{margin:0 8px 0 0}nav{display:flex;flex-wrap:wrap}nav a{padding:8px}.side-bottom{margin:0;width:100%}.top{position:static}#content{padding:12px}}

.modal-box.wide{max-width:820px}
.unitrow{display:flex;gap:4px}
.unitrow select.unit{width:62px;flex:none;font-weight:800;color:var(--acc2);text-align:center}
.cond{border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--panel2)}
.logic-sep{text-align:center;font-weight:800;color:var(--acc);margin:6px 0;font-size:12px}
@media(max-width:600px){.form{grid-template-columns:1fr 1fr}.modal-box{padding:14px;width:98%}}

.ro button,.ro input,.ro select{pointer-events:none;opacity:.45}
.ro input#pubUrl{pointer-events:auto;opacity:1}

.code-wrap{position:relative;height:380px;border:1px solid var(--line);border-radius:10px;background:#0b1220;margin:10px 0;overflow:hidden}
.code-hl,.code-ta{position:absolute;inset:0;margin:0;padding:12px;font:13px/1.55 Consolas,"Cascadia Mono","Courier New",monospace;white-space:pre;overflow:auto;tab-size:4;text-align:left;direction:ltr;box-sizing:border-box;border:0}
.code-hl{color:#e2e8f0;pointer-events:none}
.code-ta{background:transparent;color:transparent;caret-color:#fff;resize:none;outline:none;width:100%;height:100%}
.code-ta::selection{background:#3b82f655;color:transparent}
.hl-c{color:#7f8ea3;font-style:italic}.hl-s{color:#fbbf24}.hl-n{color:#f472b6}.hl-k{color:#60a5fa;font-weight:600}.hl-f{color:#34d399}
.code-out{background:#0b1220;color:#cbd5e1;padding:8px;border-radius:8px;max-height:160px;overflow:auto;font:12px Consolas,monospace}
table.kv td{padding:5px 8px}
.atr-grid{margin-top:14px}
.atr-card table.kv td:last-child{text-align:end}
.atr-price{font-size:26px;margin:8px 0 4px;text-align:start}.atr-price b{font-size:30px}
.goal-bar{display:flex;align-items:center;gap:0;margin:14px 0 4px;direction:ltr}
.goal-bar .gb-loss,.goal-bar .gb-win{flex:1;height:14px;background:var(--line);overflow:hidden}
.goal-bar .gb-loss{border-radius:8px 0 0 8px;display:flex;justify-content:flex-end}.goal-bar .gb-win{border-radius:0 8px 8px 0}
.goal-bar .gb-loss i{display:block;height:100%;background:var(--red)}.goal-bar .gb-win i{display:block;height:100%;background:var(--grn)}
.goal-bar .gb-mid{width:3px;height:22px;background:var(--mut)}
.goal-card .grid.cards{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}