:root{--bg:#0b0f1a;--card:#141a2a;--bd:#1f2740;--ac:#22d3ee;--g:#22c55e;--r:#ef4444;--a:#f59e0b;--t:#e5e7eb;--m:#8b93a7}
*{font-family:Vazirmatn,sans-serif;-webkit-tap-highlight-color:transparent}
body{background:var(--bg);color:var(--t);margin:0;
background-image:radial-gradient(circle at 80% -10%,rgba(34,211,238,.12),transparent 40%),radial-gradient(circle at 0% 100%,rgba(34,197,94,.07),transparent 40%),linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
background-size:auto,auto,28px 28px,28px 28px;background-attachment:fixed;min-height:100vh}
.card{background:var(--card);border:1px solid var(--bd);border-radius:1rem;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.glow-g{box-shadow:0 0 0 1px rgba(34,197,94,.5),0 0 22px rgba(34,197,94,.25)}
.glow-r{box-shadow:0 0 0 1px rgba(239,68,68,.5),0 0 22px rgba(239,68,68,.25)}
.ltr{direction:ltr;unicode-bidi:embed}
.shimmer{background:linear-gradient(90deg,#141a2a 0%,#1f2740 50%,#141a2a 100%);background-size:200% 100%;animation:sh 1.3s infinite}
@keyframes sh{0%{background-position:200% 0}100%{background-position:-200% 0}}
.pulse{animation:pu 1.6s infinite}
@keyframes pu{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.5)}}
.spin{animation:spn 1s linear infinite}@keyframes spn{to{transform:rotate(360deg)}}
.rise{animation:rise .45s both}@keyframes rise{from{opacity:0;transform:translateY(12px)}}
.sheet{animation:up .3s cubic-bezier(.2,.9,.3,1)}@keyframes up{from{transform:translateY(100%)}}
.fade{animation:fd .2s}@keyframes fd{from{opacity:0}}
input[type=range]{accent-color:#22d3ee}
.no-sb::-webkit-scrollbar{display:none}