:root{
  --ink:#111827;
  --muted:#6b7280;
  --card:#ffffff;
  --soft:#f6f7fb;
  --line:#e8eaf0;
  --accent:#6d5dfc;
  --accent-2:#8b7cff;
  --accent-dark:#4e3ff0;
  --success:#16a34a;
  --danger:#dc2626;
  --shadow:0 14px 40px rgba(17,24,39,.06);
}
body{
  background:
    radial-gradient(circle at top left, rgba(109,93,252,.08), transparent 22%),
    radial-gradient(circle at top right, rgba(139,124,255,.08), transparent 22%),
    #f7f8fc;
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.brand-dot{color:var(--accent)}
.hero{
  padding:90px 0 80px;
  background:
    radial-gradient(circle at 20% 10%,#ece9ff 0,transparent 35%),
    linear-gradient(180deg,#fff,#f7f8fb);
}
.hero h1{font-size:clamp(2.3rem,5vw,4.9rem);letter-spacing:-.045em;line-height:.95}
.navbar{
  background:rgba(255,255,255,.86)!important;
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(232,234,240,.9)!important;
}
.navbar-brand{font-weight:900;letter-spacing:-.03em}
.nav-link{font-weight:500;color:#374151!important}
.nav-link:hover{color:var(--accent)!important}
.card,.stat-box{
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:var(--shadow);
  background:#fff;
}
.card:hover,.stat-box:hover{transform:translateY(-1px);transition:.2s ease}
.metric{font-size:2.15rem;font-weight:900;letter-spacing:-.045em;line-height:1}
.soft{background:var(--soft)}
.badge-soft{background:#efefff;color:#5546d9}
.engine-card{min-height:220px}
.engine-card.done{background:#f0fff5;border-color:#b7ebc6}
.timer{font-variant-numeric:tabular-nums;font-size:2.3rem;font-weight:800}
.progress{height:10px;border-radius:999px}
.progress-bar{background:linear-gradient(90deg,var(--accent),var(--accent-2))}
.section-title{letter-spacing:-.02em}
.table>:not(caption)>*>*{vertical-align:middle}
.form-control,.form-select{
  border-radius:14px;
  padding:.78rem .9rem;
  border:1px solid #d9deea;
  box-shadow:none!important;
}
.form-control:focus,.form-select:focus{
  border-color:rgba(109,93,252,.45);
  box-shadow:0 0 0 4px rgba(109,93,252,.12)!important;
}
.btn{
  border-radius:14px;
  padding:.72rem 1rem;
  font-weight:700;
}
.btn-dark{
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  border-color:transparent;
}
.btn-dark:hover{filter:brightness(1.03);border-color:transparent}
.btn-outline-dark:hover{
  background:#111827;
  border-color:#111827;
}
.sidebar-chip{
  display:inline-flex;gap:.45rem;align-items:center;padding:.5rem .78rem;
  border:1px solid #e5e7eb;border-radius:999px;background:#fff;
  box-shadow:var(--shadow)
}
textarea.arabic{direction:rtl;text-align:right;font-size:1.15rem;line-height:2}
.ref-card a{text-decoration:none}
.stat-box{padding:20px}
.app-hero-card{
  background:linear-gradient(135deg,#18122b,#312e81 65%, #6d5dfc);
  color:#fff;border:0;
}
.app-hero-card .small,.app-hero-card .text-secondary{color:rgba(255,255,255,.76)!important}
.quick-link{
  text-decoration:none;color:inherit;
}
.quick-link .icon{
  width:56px;height:56px;border-radius:18px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#efeefe,#ddd8ff);
  font-size:1.45rem;
}
.kpi-card .label{font-size:.88rem;color:var(--muted)}
.kpi-card .trend{font-size:.9rem;color:#16a34a;font-weight:700}
.switch-card{
  border:1px solid #dedcf8;
  background:linear-gradient(135deg,#f8f7ff,#ffffff);
  border-radius:22px;
  padding:20px;
}
.toggle-row{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #ebe9ff;
}
.toggle-title{font-weight:800;font-size:1.08rem}
.toggle-help{color:var(--muted);font-size:.92rem}
.switch{
  position:relative;display:inline-block;width:72px;height:40px;flex:0 0 auto;
}
.switch input{opacity:0;width:0;height:0}
.slider{
  position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;
  background:#d1d5db;border-radius:999px;transition:.25s;
}
.slider:before{
  position:absolute;content:"";height:30px;width:30px;left:5px;top:5px;
  background:#fff;border-radius:50%;transition:.25s;box-shadow:0 2px 10px rgba(0,0,0,.12)
}
input:checked + .slider{background:linear-gradient(135deg,var(--accent-dark),var(--accent))}
input:checked + .slider:before{transform:translateX(32px)}
.status-pill{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.48rem .8rem;border-radius:999px;font-size:.88rem;font-weight:800
}
.status-pill.success{background:#eaf9ef;color:#0f8a3b}
.status-pill.muted{background:#eef2f7;color:#64748b}
.step-card{
  border:1px dashed #d9def7;
  border-radius:20px;
  padding:18px;background:#fff;
}
.step-no{
  width:34px;height:34px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--accent-dark),var(--accent));
  color:#fff;font-weight:800;margin-bottom:12px;
}
.mono-box{
  background:#111827;color:#fff;padding:12px 14px;border-radius:14px;
  overflow:auto;font-size:.88rem
}
.table-modern thead th{
  font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;border-bottom-width:1px
}
.empty-soft{
  border:1px dashed #d7dbe6;border-radius:18px;padding:26px;background:#fafbfe;color:#6b7280
}
footer{background:transparent!important}
@media (max-width:768px){
  .hero{padding:64px 0 50px}
  .metric{font-size:1.8rem}
  .toggle-row{align-items:flex-start;flex-direction:column}
}