:root{
  --bg:#070d1f; --bg2:#0d1733; --panel:#111c3d; --panel2:#17244d; --line:#263766;
  --gold:#f2c14e; --gold2:#d79b1c; --text:#eef2ff; --muted:#9aa6c9; --ok:#34d399; --bad:#f87171; --blue:#3b82f6;
  --r:14px; --shadow:0 12px 40px rgba(0,0,0,.45);
  font-family: "Segoe UI", Tahoma, "Noto Sans Arabic", "Noto Sans", system-ui, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text)}
a{color:var(--gold);text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.btn{display:inline-flex;align-items:center;gap:.4em;justify-content:center;border:0;border-radius:10px;padding:.65em 1.15em;cursor:pointer;
  background:linear-gradient(180deg,var(--gold),var(--gold2));color:#1b1300;font-weight:700;transition:transform .1s, filter .2s}
.btn:hover{filter:brightness(1.08)} .btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn.small{padding:.4em .8em;font-size:.9em}
.btn.danger{background:#7f1d1d;color:#fff}
.btn:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{background:#0a1430;border:1px solid var(--line);border-radius:10px;padding:.6em .8em;width:100%;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--gold)}
label{display:block;font-size:.85em;color:var(--muted);margin:.6em 0 .25em}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:1.2em;box-shadow:var(--shadow)}
.grid{display:grid;gap:1em}
.g2{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.muted{color:var(--muted)} .ok{color:var(--ok)} .bad{color:var(--bad)} .gold{color:var(--gold)}
.row{display:flex;gap:.6em;align-items:center;flex-wrap:wrap}
.spacer{flex:1}
table{width:100%;border-collapse:collapse;font-size:.92em}
th,td{padding:.55em .5em;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
th{color:var(--muted);font-weight:600}
.badge{display:inline-block;padding:.15em .6em;border-radius:99px;font-size:.78em;background:var(--panel2);border:1px solid var(--line)}
.badge.ok{background:#064e3b;border-color:#065f46;color:#a7f3d0}
.badge.bad{background:#450a0a;border-color:#7f1d1d;color:#fecaca}
.badge.warn{background:#422006;border-color:#854d0e;color:#fde68a}
.topbar{display:flex;align-items:center;gap:1em;padding:.7em 1.2em;background:rgba(7,13,31,.85);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.brand{font-weight:800;letter-spacing:.3px;color:var(--gold);display:flex;align-items:center;gap:.5em}
.brand .crown{font-size:1.3em}
.toast{position:fixed;bottom:1.2em;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--gold);padding:.7em 1.2em;border-radius:12px;z-index:200;box-shadow:var(--shadow)}
.container{max-width:1200px;margin:0 auto;padding:1.4em}
.tabs{display:flex;gap:.4em;flex-wrap:wrap;margin-bottom:1em}
.tabs button{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:.5em 1em;cursor:pointer}
.tabs button.active{border-color:var(--gold);color:var(--gold)}
.stat{font-size:1.7em;font-weight:800}
.hidden{display:none!important}
.cover{width:100%;aspect-ratio:2/3;border-radius:6px;object-fit:cover;background:#222;display:block}

.ask-wrap{position:fixed;inset:0;background:rgba(3,6,18,.65);display:flex;align-items:center;justify-content:center;z-index:300;padding:1em}
.ask-box{max-width:460px;width:100%}
.ask-msg{white-space:pre-line;margin-top:0;line-height:1.7}
.ask-in{width:100%}
