:root{
  --bg:#070a10;
  --fg:#e9eefb;
  --muted:rgba(233,238,251,.72);
  --glass:rgba(12,16,28,.55);
  --stroke:rgba(255,255,255,.12);
  --shadow: 0 24px 70px rgba(0,0,0,.55);
  --sans: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;color:var(--fg);font-family:var(--sans);background:var(--bg);overflow-x:hidden}
.bg-photo{
  position:fixed; inset:0;
  background:
    radial-gradient(1200px 800px at 15% 10%, rgba(75,120,255,.12), transparent 60%),
    radial-gradient(900px 700px at 85% 80%, rgba(42,211,160,.10), transparent 55%),
    url("../img/background.jpg");
  background-size: cover;
  background-position:center;
  filter: saturate(1.05) contrast(1.05) brightness(.62);
  transform: scale(1.02);
  z-index:-3;
}
#particles{position:fixed; inset:0; z-index:-2}
.topbar{
  position:fixed; top:0; left:0; right:0;
  padding:14px 18px;
  backdrop-filter: blur(10px);
  background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,0));
  z-index:5;
}
.topbar-inner{
  max-width:1100px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
}
.brand{display:flex; flex-direction:column; line-height:1.1}
.domain{font-family:var(--mono); font-size:12px; opacity:.85}
.org{font-size:14px; opacity:.9}

.lang{display:flex; gap:8px}
.lang-btn{
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.06);
  color:var(--fg);
  padding:7px 10px;
  border-radius:12px;
  cursor:pointer;
  font-size:12px;
  text-decoration:none;
}
.lang-btn:hover{background:rgba(255,255,255,.10)}
.lang-btn.is-active{
  border-color: rgba(112,168,255,.55);
  box-shadow: 0 0 0 3px rgba(112,168,255,.15);
}

.wrap{
  min-height:100%;
  display:grid;
  place-items:center;
  padding:96px 18px 36px;
}
.glass{
  width:min(680px, 100%);
  border:1px solid var(--stroke);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  background-color: var(--glass);
  box-shadow: var(--shadow);
  border-radius: 22px;
  padding: 22px;
  backdrop-filter: blur(16px);
}
.glass-header{text-align:center; padding:6px 6px 14px}
.logo{width:84px;height:84px;display:block;margin:4px auto 10px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.35))}
h1{margin:0;font-size:22px;letter-spacing:.2px}
.sub{margin:8px 0 0;color:var(--muted);font-size:13px}

.form{margin-top:10px}
.row{margin:14px 0}
label{display:block;font-size:13px;margin-bottom:7px;color:rgba(233,238,251,.92)}
input[type="text"]{
  width:100%; padding:12px 12px; border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,8,16,.55);
  color:var(--fg); outline:none; font-size:14px;
}
input[type="text"]::placeholder{color: rgba(233,238,251,.45)}
input[type="text"]:focus{border-color: rgba(112,168,255,.6); box-shadow:0 0 0 4px rgba(112,168,255,.16)}
.help{display:block;margin-top:8px;font-size:12px;color: rgba(233,238,251,.62)}

.captcha{
  display:flex; align-items:center; gap:10px;
  padding:12px 12px; border-radius:14px;
  border:1px dashed rgba(255,255,255,.20);
  background: rgba(255,255,255,.05);
}
.captcha input{width:18px;height:18px}
.captcha-note{margin-left:auto;font-size:11px;color: rgba(233,238,251,.55);max-width:340px;text-align:right}

.actions{display:flex;align-items:center;justify-content:flex-start;gap:12px;margin-top:18px}

.btn{
  position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  padding:12px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(112,168,255,.18);
  color:var(--fg);
  cursor:pointer;
  font-weight:600;
  min-width:150px;
  transition: transform .08s ease, background .18s ease, border-color .18s ease;
  overflow:hidden;
}
.btn:hover{background: rgba(112,168,255,.25)}
.btn:active{transform: translateY(1px)}
.btn-glow{
  position:absolute; inset:-40px;
  background: radial-gradient(circle at 20% 10%, rgba(255,255,255,.35), transparent 45%);
  transform: translateX(-35%);
  transition: transform .22s ease;
  pointer-events:none;
}
.btn:hover .btn-glow{transform: translateX(10%)}
.btn-ghost{background: rgba(255,255,255,.06); min-width:120px}
.btn-ghost:hover{background: rgba(255,255,255,.10)}
.footnote{margin-top:16px;text-align:center;font-size:12px;color: rgba(233,238,251,.58)}
.hidden{display:none !important}

.loading{margin-top:10px;padding:18px 10px 6px;text-align:center}
.spinner{
  width:46px;height:46px;border-radius:50%;
  border:3px solid rgba(255,255,255,.18);
  border-top-color: rgba(233,238,251,.95);
  margin:0 auto 14px;
  animation: spin 1s linear infinite;
}
@keyframes spin{to{transform: rotate(360deg)}}
.loading-lines .line{
  font-family:var(--mono);
  font-size:12px;
  color: rgba(233,238,251,.78);
  margin:8px 0;
  opacity:.2;
  transition: opacity .25s ease;
}
.loading-lines .line.is-on{opacity:1}

.result,.error{margin-top:10px}
.result-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.badge{padding:7px 10px;border-radius:999px;font-size:12px;border:1px solid rgba(255,255,255,.16);background: rgba(255,255,255,.06)}
.badge-ok{border-color: rgba(42,211,160,.35); color: rgba(42,211,160,.95)}
.badge-bad{border-color: rgba(255,77,109,.35); color: rgba(255,77,109,.95)}
.result-body h2{margin:10px 0 10px;font-size:18px}

/* Result card (transparent, no white table) */
.result-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,8,16,.35);
  backdrop-filter: blur(10px);
  padding:12px;
}
.kv{
  display:flex; gap:12px; align-items:flex-start;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  margin:10px 0;
}
.kv .k{width:42%; color: rgba(233,238,251,.85); font-weight:700; font-size:13px}
.kv .v{flex:1; color: rgba(233,238,251,.92); font-size:13px; word-break: break-word}
.copyhint{margin-top:12px;font-size:12px;color: rgba(233,238,251,.70)}
body.rtl .kv{flex-direction: row-reverse}
body.rtl .kv .k, body.rtl .kv .v{text-align:right}

/* Admin */
.admin-wrap{min-height:100%; display:flex}
.sidebar{
  width:260px; padding:18px;
  border-right:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(14px);
}
.sidebar .logo-mini{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.sidebar .logo-mini img{width:38px;height:38px}
.sidebar .logo-mini .t1{font-weight:800}
.sidebar a{
  display:block;
  padding:10px 12px;
  margin:8px 0;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: var(--fg);
  text-decoration:none;
  font-size:13px;
}
.sidebar a:hover{background: rgba(255,255,255,.10)}
.sidebar a.active{
  border-color: rgba(112,168,255,.55);
  box-shadow: 0 0 0 3px rgba(112,168,255,.14);
}
.admin-main{flex:1; padding:96px 18px 36px}
.card{
  max-width:980px; margin:0 auto;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(12,16,28,.55);
  border-radius:22px;
  padding:18px;
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}
.card h2{margin:6px 0 12px}
.table-admin{width:100%; border-collapse: collapse; font-size:13px; overflow:hidden; border-radius:16px}
.table-admin th,.table-admin td{border:1px solid rgba(255,255,255,.14); padding:10px; text-align:left}
.table-admin th{background: rgba(255,255,255,.06)}
.small{font-size:12px; color: rgba(233,238,251,.70)}
.notice{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  margin:10px 0;
}
.admin-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}