/* ==== نظام ألوان وهوية موحّدة، محسّن للأداء والتجاوب ==== */
:root{
  --bg:#0b1220;--surface:#101a2e;--surface-2:#15233d;--elev:#0e172b;
  --text:#eaf1ff;--muted:#9ab0d3;--border:#253656;
  --brand:#3b82f6;--brand-600:#2563eb;--brand-700:#1d4ed8;
  --ok:#22c55e;--warn:#f59e0b;--err:#ef4444;--info:#38bdf8;
  --radius-xl:16px;--radius-lg:12px;--radius:10px;
  --shadow:0 10px 24px rgba(0,0,0,.28);
  --shadow-sm:0 6px 16px rgba(0,0,0,.22);
  --fs-h1:clamp(24px,3vw,32px);--fs-h2:clamp(18px,2.2vw,20px);--fs-body:clamp(14px,1.6vw,15px);
  color-scheme:dark;
}

/* Reset مختصر ومحافظة على الأداء */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font:var(--fs-body)/1.7 "IBM Plex Sans Arabic","Alexandria",system-ui,sans-serif;
  background:
    radial-gradient(1100px 700px at 70% -10%, rgba(59,130,246,.12), transparent 60%),
    var(--bg);
  color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  padding-bottom:76px;
}

/* مناطق قابلة للطي للرسم المسبق */
.island{content-visibility:auto;contain-intrinsic-size:auto 300px}

/* حاوية */
.container{max-width:1200px;padding:28px 16px 88px;margin-inline:auto;display:grid;row-gap:28px}

/* Header */
.site-header{position:sticky;inset-block-start:0;z-index:50;background:linear-gradient(90deg,var(--brand-600),var(--brand));box-shadow:0 4px 14px rgba(0,0,0,.35)}
.header-inner{max-width:1200px;margin-inline:auto;padding:12px 16px;display:flex;justify-content:center;align-items:center}
.logo{color:#fff;font-weight:800;font-size:20px;letter-spacing:.2px;cursor:pointer;transition:transform .12s ease}
.logo:hover{transform:scale(1.03)}
.logo:focus-visible{outline:3px solid rgba(59,130,246,.5);outline-offset:3px;border-radius:8px}

/* Footer ثابت */
.site-footer{position:fixed;inset-inline:0;inset-block-end:0;background:linear-gradient(90deg,#101826,#0c1322);color:#9fb0ce;border-top:1px solid var(--border);box-shadow:0 -6px 16px rgba(0,0,0,.3);text-align:center;padding:14px 12px;font-size:13px}

/* Hero */
.hero{margin-top:24px}
h1{margin:4px 0 8px;font-size:var(--fs-h1);text-align:center}
.subtitle{margin:0 auto 14px;color:var(--muted);text-align:center}

/* Search */
.search-box{
  display:grid;grid-template-columns:1fr auto;gap:10px;max-width:760px;margin:10px auto 0;
  background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 40%),var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:10px 10px 10px 12px;backdrop-filter:saturate(110%) blur(6px)
}
.domain-input{
  height:52px;padding:0 14px;border:1px solid transparent;border-radius:var(--radius);background:var(--surface-2);color:var(--text);
}
.domain-input::placeholder{color:#96a9cb}
.domain-input:focus{outline:none;border-color:rgba(59,130,246,.55);box-shadow:0 0 0 4px rgba(59,130,246,.16);background:#192a46}
.btn{height:52px;padding:0 18px;border:0;border-radius:var(--radius);font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:filter .18s ease, transform .06s ease}
.btn:active{transform:translateY(1px)}
.btn.primary{background:linear-gradient(180deg,var(--brand),var(--brand-600));color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),var(--shadow-sm)}
.btn.primary:hover{filter:brightness(1.06)}
.btn.primary:focus-visible{outline:3px solid rgba(59,130,246,.35);outline-offset:2px}

/* Card */
.card{background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 45%),var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow);padding:16px}
h2{margin:0 0 12px;font-size:var(--fs-h2);color:#b7c6df;font-weight:800}

/* جدول متجاوب عالي الأداء */
.table-wrapper{overflow:hidden;border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--border)}
table{width:100%;border-collapse:collapse;background:var(--elev)}
thead th{
  background:linear-gradient(180deg,rgba(59,130,246,.22),rgba(37,99,235,.14)),#0f172a;color:#ecf2ff;
  padding:12px 10px;text-align:center;font-weight:900;border-bottom:1px solid var(--border)
}
tbody td{padding:12px 10px;text-align:center;border-bottom:1px solid rgba(255,255,255,.05);color:#dfe8ff}
tbody tr:nth-child(even){background:rgba(255,255,255,.02)}
tbody tr:hover{background:rgba(59,130,246,.06);transition:background .15s ease}
td.age-strong{font-weight:900;color:#c6ffdd;text-shadow:0 0 8px rgba(198,255,221,.10)}

/* شارات */
.tag-list{display:flex;flex-wrap:wrap;gap:8px}
.tag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:13px;font-weight:800;background:#132241;color:#d9e6ff;border:1px solid rgba(255,255,255,.06)}

/* أقسام إضافية */
.extra-info{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
.ns-section,.host-section,.status-section{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:12px;box-shadow:var(--shadow-sm)}
.extra-info h3{margin:0 0 8px;font-size:15px;color:#a8b8d6;letter-spacing:.2px}

/* تنبيهات */
.alert{position:sticky;top:10px;margin:0 auto 6px;max-width:640px;padding:10px 12px;border-radius:12px;font-weight:800;text-align:center;border:1px solid var(--border);box-shadow:var(--shadow-sm);background:#0f213e;color:#dfe8ff;z-index:60}
.alert.ok{background:rgba(34,197,94,.14);border-color:rgba(34,197,94,.35);color:#caffdf}
.alert.err{background:rgba(239,68,68,.14);border-color:rgba(239,68,68,.35);color:#ffd7d7}

/* تفضيل تقليل الحركة */
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* تجاوب */
@media (max-width:900px){
  .search-box{grid-template-columns:1fr}
  .btn.primary{width:100%}
  .extra-info{grid-template-columns:1fr}
}
@media (max-width:720px){
  .table-wrapper{border-radius:var(--radius)}
  table,thead,tbody,th,td,tr{display:block}
  thead{display:none}
  tbody tr{background:var(--surface-2);margin:10px 10px 14px;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm)}
  tbody td{display:grid;grid-template-columns:1fr auto;gap:8px;text-align:right;padding:12px 14px;border-bottom:1px dashed rgba(255,255,255,.06)}
  tbody td::before{content:attr(data-label);color:var(--muted);font-weight:800}
  td.age-strong{justify-content:end}
}