:root{--bg:#070B14;--card:#0E1524;--cy:#00E5FF;--gr:#00FF9C;--rd:#FF3B5C;--am:#FFB020;--mut:#7d8aa5}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:#dbe4f5;font-family:'Vazirmatn',sans-serif;
background-image:radial-gradient(circle at 15% 0%,rgba(0,229,255,.10),transparent 40%),radial-gradient(circle at 90% 100%,rgba(0,255,156,.08),transparent 45%),linear-gradient(rgba(0,229,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,255,.035) 1px,transparent 1px);
background-size:auto,auto,32px 32px,32px 32px;background-attachment:fixed;min-height:100vh}
.mono{font-family:'JetBrains Mono',monospace;direction:ltr;unicode-bidi:embed}
.card{background:rgba(14,21,36,.82);border:1px solid rgba(0,229,255,.13);border-radius:16px;backdrop-filter:blur(10px);transition:transform .25s,border-color .25s,box-shadow .25s}
.card:hover{border-color:rgba(0,229,255,.3)}
.lift:hover{transform:translateY(-3px);box-shadow:0 10px 30px -10px rgba(0,229,255,.25)}
.glow-g{box-shadow:inset 0 0 0 1px rgba(0,255,156,.25),0 0 24px -8px rgba(0,255,156,.5)}
.glow-r{box-shadow:inset 0 0 0 1px rgba(255,59,92,.25),0 0 24px -8px rgba(255,59,92,.5)}
.logo{background:linear-gradient(90deg,var(--cy),var(--gr));-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:900}
.fade{animation:fade .45s ease both}
@keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.pulse{animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 currentColor}50%{box-shadow:0 0 0 6px transparent}}
.shake{animation:shake .6s}
@keyframes shake{0%,100%{transform:none}20%{transform:translate(-8px,3px)}40%{transform:translate(7px,-4px)}60%{transform:translate(-5px,2px)}80%{transform:translate(4px,-1px)}}
.kill{background:radial-gradient(circle at 50% 30%,#ff5a76,#c4102f);box-shadow:0 0 40px -6px rgba(255,59,92,.7),inset 0 -6px 0 rgba(0,0,0,.25);transition:transform .15s}
.kill:hover{transform:scale(1.02)}.kill:active{transform:scale(.97)}
.shimmer{background:linear-gradient(90deg,rgba(0,229,255,.05),rgba(0,229,255,.2),rgba(0,229,255,.05));background-size:200% 100%;animation:sh 1.2s linear infinite}
@keyframes sh{to{background-position:-200% 0}}
input[type=range]{accent-color:var(--cy);width:100%}
.ticker{animation:tick 30s linear infinite}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(50%)}}
.confetti{position:fixed;top:-20px;font-size:24px;animation:fall 3s linear forwards;pointer-events:none;z-index:99}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
.scroll-x::-webkit-scrollbar{height:0}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#1c2a44;border-radius:8px}
select,input,textarea{background:#0a1120;border:1px solid rgba(0,229,255,.18);border-radius:10px;padding:8px 10px;color:#dbe4f5;outline:none}
select:focus,input:focus,textarea:focus{border-color:var(--cy)}
.btn{border-radius:12px;padding:9px 16px;font-weight:700;transition:all .2s}
.btn-g{background:linear-gradient(90deg,#00c97c,#00FF9C);color:#03140c}
.btn-g:hover{filter:brightness(1.1);box-shadow:0 0 20px -4px var(--gr)}
.btn-o{border:1px solid rgba(0,229,255,.35);color:var(--cy)}
.btn-o:hover{background:rgba(0,229,255,.08)}
.seg{border:1px solid rgba(0,229,255,.18);border-radius:10px;padding:7px 12px;transition:all .2s}
.seg.on{background:rgba(0,229,255,.14);border-color:var(--cy);color:var(--cy);box-shadow:0 0 14px -6px var(--cy)}
.tg{width:42px;height:24px;border-radius:99px;background:#1c2a44;position:relative;transition:.2s;flex-shrink:0}
.tg.on{background:var(--gr)}
.tg::after{content:'';position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}
.tg.on::after{right:21px}
pre.code{background:#050912;border:1px solid rgba(0,229,255,.15);border-radius:12px;padding:14px;overflow:auto;max-height:380px;font-size:12.5px;line-height:1.6}
body.light{background:#eef3f9;color:#0f1a2e;background-image:none}
body.light .card{background:rgba(255,255,255,.92);border-color:rgba(0,120,160,.2)}
body.light header,body.light nav.fixed{background:rgba(238,243,249,.95)!important}
body.light select,body.light input,body.light textarea{background:#fff;color:#0f1a2e}
body.light .text-slate-300,body.light .text-slate-400{color:#475569!important}
body.light .text-cyan-200,body.light .text-cyan-300{color:#0369a1!important}
body.light .text-emerald-300{color:#047857!important}
.kw{color:#00E5FF}.str{color:#00FF9C}.num{color:#FFB020}.cm{color:#56637e}