:root{--bg:#0f1420;--bg2:#161d2e;--card:#1a2236;--gold:#d4a74a;--gold2:#f0d28a;--tq:#2bb5a8;--red:#d9534f;--txt:#e8e2d0;--mut:#8e98ad;}
*{box-sizing:border-box}
body{margin:0;font-family:'Vazirmatn',sans-serif;color:var(--txt);background:var(--bg);
background-image:
radial-gradient(circle at 20% 0%,rgba(43,181,168,.10),transparent 40%),
radial-gradient(circle at 90% 100%,rgba(212,167,74,.10),transparent 45%),
repeating-linear-gradient(45deg,rgba(212,167,74,.035) 0 2px,transparent 2px 28px),
repeating-linear-gradient(-45deg,rgba(43,181,168,.035) 0 2px,transparent 2px 28px);
min-height:100vh}
.card{background:linear-gradient(180deg,rgba(30,40,62,.92),rgba(22,29,46,.92));border:1px solid rgba(212,167,74,.25);border-radius:14px;padding:14px;position:relative;box-shadow:0 6px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(240,210,138,.08)}
.card::before{content:"";position:absolute;inset:4px;border:1px dashed rgba(212,167,74,.12);border-radius:11px;pointer-events:none}
.ttl{font-weight:900;color:var(--gold2);font-size:1.05rem;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.ttl::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(212,167,74,.5),transparent)}
.btn{background:rgba(212,167,74,.12);border:1px solid rgba(212,167,74,.4);color:var(--gold2);padding:6px 12px;border-radius:9px;font-weight:700;font-size:.85rem;transition:.15s;cursor:pointer;white-space:nowrap}
.btn:hover:not(:disabled){background:rgba(212,167,74,.28);transform:translateY(-1px)}
.btn:disabled{opacity:.35;cursor:not-allowed}
.btn.tq{background:rgba(43,181,168,.14);border-color:rgba(43,181,168,.5);color:#8ff0e5}
.btn.rd{background:rgba(217,83,79,.15);border-color:rgba(217,83,79,.5);color:#ffb3b0}
.btn.on{background:var(--gold);color:#1a1405}
.chip{display:flex;align-items:center;gap:4px;background:rgba(0,0,0,.25);border:1px solid rgba(212,167,74,.18);padding:3px 8px;border-radius:999px;font-size:.78rem;white-space:nowrap}
.mut{color:var(--mut)}
.bar{height:8px;background:rgba(255,255,255,.07);border-radius:99px;overflow:hidden}
.bar>div{height:100%;border-radius:99px;transition:width .4s}
input[type=range]{accent-color:var(--gold);width:100%}
.fade{animation:fade .35s ease both}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.toast{animation:tin .3s ease both}
@keyframes tin{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:none}}
.navb{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;color:var(--mut);font-weight:700;transition:.15s;width:100%;text-align:right}
.navb:hover{color:var(--gold2);background:rgba(212,167,74,.07)}
.navb.act{color:#1a1405;background:linear-gradient(90deg,var(--gold),var(--gold2))}
.modalbg{position:fixed;inset:0;background:rgba(5,8,15,.75);backdrop-filter:blur(4px);z-index:50;display:flex;align-items:center;justify-content:center;padding:16px}
.tbl td,.tbl th{padding:5px 6px;border-bottom:1px solid rgba(255,255,255,.05);font-size:.85rem}
.cell{cursor:pointer;transition:opacity .2s}
.cell:hover{opacity:.8}
.pulse{animation:pl 1.2s infinite}
@keyframes pl{50%{opacity:.4}}
input,select{background:#0c111c;border:1px solid rgba(212,167,74,.3);border-radius:8px;padding:6px 10px;color:var(--txt)}
.scroll::-webkit-scrollbar{width:6px;height:6px}.scroll::-webkit-scrollbar-thumb{background:rgba(212,167,74,.3);border-radius:9px}