@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn.woff2) format('woff2');font-weight:100 900;font-display:swap}
:root{--bg:#0a0f1f;--s1:#0f1524;--s2:#161e33;--s3:#1e2742;--bd:#27345f;--tx:#eef2ff;--t2:#a5b2d4;--t3:#6f7ca0;--br:#5b8dff;--ok:#34d399;--wn:#fbbf24;--er:#f87171;--pu:#a78bfa;
--c0:#818cf8;--c1:#60a5fa;--c2:#a78bfa;--c3:#f472b6;--c4:#34d399;--c5:#fbbf24;--c6:#fb923c;--sh:0 12px 32px rgba(0,0,0,.45);--r:12px}
[data-theme=light]{--bg:#f4f7fc;--s1:#fff;--s2:#f0f4fa;--s3:#e4eaf5;--bd:#d3dcec;--tx:#0e1530;--t2:#4a5878;--t3:#7b88a8;--br:#3b6eff;--sh:0 12px 32px rgba(40,56,110,.16)}
[data-theme=sepia]{--bg:#f5ecd7;--s1:#fbf5e6;--s2:#f0e4c8;--s3:#e6d7b3;--bd:#d4c49e;--tx:#2e2411;--t2:#6a5530;--t3:#9c8760;--br:#a86b16;--sh:0 12px 32px rgba(80,60,20,.18)}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;overflow:hidden}
body{display:flex;flex-direction:column;height:100dvh;font:400 14px/1.7 Vazirmatn,system-ui,Tahoma,sans-serif;background:var(--bg);color:var(--tx);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0}
:focus-visible{outline:2px solid var(--br);outline-offset:2px}
.sp{flex:1}.mu{color:var(--t3);font-size:.85em}
#top{display:flex;align-items:center;gap:6px;padding:6px 12px;padding-top:calc(6px + env(safe-area-inset-top,0px));background:var(--s1);border-bottom:1px solid var(--bd);overflow-x:auto;scrollbar-width:none;flex:none}
#top::-webkit-scrollbar{display:none}#top>*{flex:none}
#brand{font-weight:800;padding:0 8px;white-space:nowrap}#brand small{display:block;font-weight:400;font-size:.7em;color:var(--t3);line-height:1.1}
#tabs{display:flex;gap:2px;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:3px}
#tabs button{padding:5px 11px;border-radius:9px;color:var(--t2);font-weight:600;font-size:.85em;display:flex;gap:5px;white-space:nowrap}
#tabs button:hover{color:var(--tx);background:var(--s3)}#tabs button.on{background:var(--br);color:#fff}
.ib{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:16px;color:var(--t2);transition:background .15s}
.ib:hover{background:var(--s2);color:var(--tx)}.ib.on{background:var(--br);color:#fff}.ib:disabled{opacity:.35;pointer-events:none}.ib.sm{width:28px;height:28px;font-size:13px}
#views{flex:1;position:relative;min-height:0}
#views>section{position:absolute;inset:0;overflow:auto;display:none}#views>section.on{display:block}
#foot{display:flex;gap:12px;padding:3px 12px;padding-bottom:calc(3px + env(safe-area-inset-bottom,0px));background:var(--s1);border-top:1px solid var(--bd);font-size:.72em;color:var(--t3);flex:none}
.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:10px;background:var(--s2);border:1px solid var(--bd);font-weight:600;font-size:.85em;white-space:nowrap;transition:background .15s}
.btn:hover{background:var(--s3)}.btn.pri{background:var(--br);border-color:var(--br);color:#fff}.btn.ok{background:var(--ok);border-color:var(--ok);color:#04231a}.btn.dng{color:var(--er);border-color:var(--er)}.btn.sm{padding:3px 10px;font-size:.78em}
.in,.ta,.sel{width:100%;background:var(--s2);border:1px solid var(--bd);border-radius:10px;padding:7px 10px;outline:none;line-height:1.6}.ta{resize:vertical;min-height:60px}
.in:focus,.ta:focus,.sel:focus{border-color:var(--br);box-shadow:0 0 0 3px color-mix(in srgb,var(--br) 20%,transparent)}
.card{background:var(--s1);border:1px solid var(--bd);border-radius:14px;padding:16px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{padding:2px 10px;border-radius:99px;background:var(--s3);font-size:.78em;font-weight:600;border:1px solid var(--bd)}
.chip.ok{color:var(--ok)}.chip.wn{color:var(--wn)}.chip.er{color:var(--er)}.chip.br{color:var(--br)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:8px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:var(--s1);border:1px solid var(--bd);border-radius:14px;padding:14px}.stat b{display:block;font-size:1.7em;color:var(--br);line-height:1.2}.stat span{font-size:.8em;color:var(--t2)}
.page{max-width:1000px;margin:0 auto;padding:24px 20px 60px}.page h1{font-size:1.6em;margin-bottom:4px}.page .sub{color:var(--t2);margin-bottom:20px}
.bar{height:8px;background:var(--s3);border-radius:9px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--br),var(--pu));border-radius:9px}
dialog.dlg{margin:auto;border:1px solid var(--bd);border-radius:18px;background:var(--s1);color:var(--tx);padding:0;width:min(560px,calc(100vw - 24px));max-height:90vh;box-shadow:var(--sh);overflow:hidden}
dialog.dlg.wide{width:min(760px,calc(100vw - 24px))}dialog.dlg[open]{display:flex;flex-direction:column}
dialog.dlg::backdrop{background:rgba(3,6,16,.62);backdrop-filter:blur(5px)}
.dh{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--bd)}.dh h3{flex:1;font-size:1.05em}
.db{padding:16px;overflow:auto;flex:1}.df{display:flex;gap:8px;padding:10px 16px;border-top:1px solid var(--bd);background:var(--s2)}.df:empty{display:none}
dialog.pal{margin-top:12vh}dialog.pal .dh{display:none}dialog.pal .db{padding:10px}.plist{max-height:50vh;overflow:auto;margin-top:8px}
.pit{display:flex;gap:10px;align-items:center;padding:7px 10px;border-radius:9px;cursor:pointer}.pit i{font-style:normal;color:var(--t3);font-size:.8em;margin-right:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:45%}
.pit:hover,.pit.on{background:color-mix(in srgb,var(--br) 16%,transparent)}
.set{display:grid;grid-template-columns:1fr auto;gap:10px 14px;align-items:center}.set input[type=range]{width:150px}.set input[type=checkbox]{width:20px;height:20px;accent-color:var(--br)}.set .sel,.set .in{width:170px}
#toasts{position:fixed;bottom:44px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:999;pointer-events:none;max-width:calc(100vw - 24px)}
.toast{display:flex;gap:10px;align-items:center;padding:9px 16px;background:var(--s1);border:1px solid var(--bd);border-radius:12px;box-shadow:var(--sh);pointer-events:auto;animation:ti .25s}
.toast.success{border-color:var(--ok)}.toast.error{border-color:var(--er)}.toast.warn{border-color:var(--wn)}.toast button{background:var(--br);color:#fff;border-radius:7px;padding:1px 10px;font-weight:700}
@keyframes ti{from{opacity:0;transform:translateY(14px)}}
@media(max-width:700px){#brand small,#tabs button b{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
