:root {
  --madani-blue: #123ea3;
  --madani-royal: #071b63;
  --madani-red: #dc1f3d;
  --madani-yellow: #ffc51b;
  --navy-950: #041344;
  --navy-900: #071b63;
  --navy-800: #123582;
  --ink: #10204f;
  --muted: #68738e;
  --green: var(--madani-blue);
  --green-dark: var(--madani-royal);
  --green-soft: #edf2ff;
  --success: #078653;
  --success-soft: #eaf8f0;
  --blue-soft: #f0f3ff;
  --coral: var(--madani-red);
  --coral-soft: #fff0f2;
  --amber: #9b6b00;
  --amber-soft: #fff7d9;
  --paper: #fff;
  --bg: #f7f5ef;
  --line: #dfe3ee;
  --shadow: 0 15px 45px rgba(7, 27, 99, .08);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--bg); }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid rgba(18, 62, 163, .22); outline-offset: 2px; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.svg-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.eyebrow { margin: 0; color: var(--madani-red); font-size: 9px; font-weight: 850; letter-spacing: .16em; }

.login-view { position: relative; min-height: 100vh; display: grid; place-items: center; overflow: hidden; padding: 24px; background: radial-gradient(circle at 82% 18%, rgba(255,197,27,.2), transparent 29%), radial-gradient(circle at 12% 88%, rgba(18,62,163,.16), transparent 34%), #f8f3e8; }
.login-view::before, .login-view::after { content: ""; position: absolute; z-index: 0; left: -12vw; width: 124vw; height: 155px; background: linear-gradient(180deg, var(--madani-royal) 0 35%, #fff 35% 44%, var(--madani-red) 44% 58%, var(--madani-yellow) 58% 66%, transparent 66%); pointer-events: none; }
.login-view::before { top: -58px; transform: rotate(-4deg); transform-origin: center; }
.login-view::after { bottom: -73px; transform: rotate(176deg); transform-origin: center; }
.login-card { position: relative; z-index: 1; width: min(430px, 100%); overflow: hidden; padding: 38px; border: 1px solid rgba(18,62,163,.13); border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 28px 80px rgba(7,27,99,.2); }
.login-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, var(--madani-blue) 0 40%, var(--madani-red) 40% 70%, var(--madani-yellow) 70%); }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; }
.brand-mark { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(145deg, var(--madani-blue), var(--madani-royal)); box-shadow: inset 0 -3px var(--madani-yellow); }
.brand-mark svg { width: 21px; height: 21px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 12px; line-height: 1.15; letter-spacing: -.01em; }
.brand small { margin-top: 4px; color: var(--madani-red); font-size: 7px; font-weight: 900; letter-spacing: .2em; }
.login-copy { margin: 46px 0 27px; }
.login-copy h1 { margin: 8px 0; color: var(--navy-950); font-size: 34px; letter-spacing: -.045em; }
.login-copy > p:last-child { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
#login-form { display: grid; gap: 13px; }
#login-form .form-error { margin: 0; }
.back-link { display: block; margin-top: 22px; color: var(--madani-royal); font-size: 10px; font-weight: 750; text-align: center; text-decoration: none; }

.dashboard { min-height: 100vh; display: grid; grid-template-columns: 236px minmax(0, 1fr); }
.sidebar { position: sticky; z-index: 20; top: 0; height: 100vh; padding: 24px 17px 18px; display: flex; flex-direction: column; color: #fff; background: radial-gradient(circle at 18% 5%, rgba(36,84,200,.7), transparent 24%), linear-gradient(180deg, var(--madani-royal), var(--navy-950)); box-shadow: inset -1px 0 rgba(255,255,255,.08); }
.brand-light { color: #fff; padding: 0 8px; }
.brand-light .brand-mark { background: rgba(255,255,255,.12); box-shadow: inset 0 0 0 1px rgba(255,255,255,.13), inset 0 -3px var(--madani-yellow); }
.brand-light small { color: var(--madani-yellow); }
.nav-label { margin: 42px 12px 12px; color: #8398d2; font-size: 7px; font-weight: 900; letter-spacing: .18em; }
.admin-nav { display: grid; gap: 4px; }
.nav-item { width: 100%; min-height: 41px; padding: 0 12px; border: 0; border-radius: 9px; display: flex; align-items: center; gap: 11px; color: #bdc8ea; background: transparent; cursor: pointer; text-align: left; font-size: 10px; font-weight: 700; transition: .15s ease; }
.nav-item span { flex: 1; }
.nav-item b { min-width: 19px; height: 19px; padding: 0 5px; display: grid; place-items: center; border-radius: 99px; color: var(--madani-royal); background: var(--madani-yellow); font-size: 7px; }
.nav-item:hover, .nav-item.is-active { color: #fff; background: rgba(47,91,202,.34); }
.nav-item.is-active { box-shadow: inset 3px 0 var(--madani-yellow); }
.nav-item svg { width: 16px; height: 16px; }
.sidebar-health { margin-top: auto; padding: 15px 11px 4px; border-top: 1px solid rgba(255,255,255,.09); }
.sidebar-health strong { display: flex; align-items: center; gap: 7px; color: #e7ebfb; font-size: 8px; }
.sidebar-health p { margin: 8px 0 0; color: #8fa0cf; font-size: 8px; line-height: 1.5; }
.pulse-dot { width: 6px; height: 6px; flex: 0 0 auto; border-radius: 50%; background: #42cf8b; box-shadow: 0 0 0 4px rgba(66,207,139,.13); }

.main-shell { min-width: 0; }
.topbar { height: 59px; padding: 0 clamp(22px, 3vw, 43px); display: flex; align-items: center; justify-content: space-between; border-bottom: 3px solid transparent; border-image: linear-gradient(90deg, var(--madani-blue), var(--madani-red), var(--madani-yellow)) 1; background: rgba(255,255,255,.9); backdrop-filter: blur(14px); }
.breadcrumb { min-width: 0; display: flex; align-items: center; gap: 7px; color: #8a99a2; font-size: 9px; }
.breadcrumb svg { width: 12px; height: 12px; }
.breadcrumb strong { color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.live-pill { height: 27px; padding: 0 10px; display: flex; align-items: center; gap: 7px; border: 1px solid #cde9d9; border-radius: 99px; color: var(--success); background: var(--success-soft); font-size: 8px; font-weight: 750; }
.icon-button { width: 33px; height: 33px; padding: 0; border: 1px solid var(--line); border-radius: 9px; display: grid; place-items: center; color: var(--muted); background: #fff; cursor: pointer; }
.icon-button svg { width: 15px; height: 15px; }
.icon-button.is-loading svg, .button.is-loading svg { animation: spin .7s linear infinite; }
.admin-avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: #fff; background: var(--navy-800); font-size: 8px; font-weight: 900; }
.mobile-menu { display: none; color: var(--navy-950); font-size: 17px; }

.admin-main { width: 100%; min-width: 0; max-width: 1320px; margin: 0 auto; padding: 36px clamp(22px, 4vw, 52px) 60px; }
.page-header { margin-bottom: 27px; display: flex; justify-content: space-between; align-items: flex-end; gap: 22px; }
.page-header h1 { margin: 7px 0 5px; color: var(--navy-950); font-size: 30px; letter-spacing: -.045em; }
.page-header > div > p:last-child { margin: 0; color: var(--muted); font-size: 11px; }
.heading-actions, .card-heading-actions { display: flex; align-items: center; gap: 8px; }
.button { min-height: 38px; padding: 8px 13px; border: 0; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-size: 9px; font-weight: 800; cursor: pointer; transition: .15s ease; }
.button svg { width: 13px; height: 13px; }
.button:disabled { opacity: .5; cursor: not-allowed; }
.button-primary { color: #fff; background: linear-gradient(135deg, var(--madani-blue), var(--madani-royal)); box-shadow: 0 8px 20px rgba(18,62,163,.2), inset 0 -2px rgba(255,197,27,.9); }
.button-primary:hover:not(:disabled) { background: linear-gradient(135deg, #174cc3, #092276); transform: translateY(-1px); }
.button-secondary { color: var(--navy-800); border: 1px solid #d4dfe4; background: #fff; }
.button-secondary:hover:not(:disabled) { border-color: #b7c9d1; background: #fafcfd; }
.button-block { width: 100%; }
.text-button { border: 0; padding: 5px; color: var(--green-dark); background: transparent; cursor: pointer; font-size: 8px; font-weight: 800; }

.admin-section { min-width: 0; }
.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.stat-card { min-height: 119px; padding: 20px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.88); box-shadow: 0 7px 25px rgba(7,24,39,.025); }
.stat-card > span, .stat-card > strong, .stat-card > small { display: block; }
.stat-card > span { color: var(--muted); font-size: 9px; font-weight: 750; }
.stat-card > strong { margin: 10px 0 4px; color: var(--navy-950); font-size: 27px; letter-spacing: -.04em; }
.stat-card > small { color: #98a5ad; font-size: 8px; }
.stat-featured { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--madani-blue), var(--madani-royal)); box-shadow: inset 0 -4px var(--madani-yellow); }
.stat-featured > span, .stat-featured > strong, .stat-featured > small { color: #fff; }
.stat-featured > small { opacity: .7; }
.overview-grid { margin-top: 12px; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .8fr); gap: 12px; align-items: start; }
.overview-aside { display: grid; gap: 12px; }
.content-card { min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: 0 8px 30px rgba(7,24,39,.025); }
.card-heading { margin-bottom: 19px; display: flex; align-items: flex-start; justify-content: space-between; gap: 17px; }
.card-heading h2 { margin: 5px 0 0; color: var(--navy-950); font-size: 14px; letter-spacing: -.02em; }
.card-heading p:not(.eyebrow) { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.recent-list { display: grid; }
.recent-row { width: 100%; padding: 11px 4px; border: 0; border-bottom: 1px solid #edf1f3; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 10px; color: inherit; background: transparent; cursor: pointer; text-align: left; }
.recent-row:last-child { border-bottom: 0; }
.recent-row:hover { background: #fafcfc; }
.recent-row > svg { width: 12px; color: #a1aeb5; }
.job-activity-row { grid-template-columns: auto minmax(0, 1fr) minmax(125px, auto) auto; cursor: default; }
.job-activity-row:hover { background: transparent; }
.activity-coordinate { display: inline-flex; align-items: center; gap: 5px; color: var(--green-dark); font-size: 8px; font-weight: 750; text-decoration: none; white-space: nowrap; }
.activity-coordinate:hover { text-decoration: underline; }
.activity-coordinate svg { width: 12px; height: 12px; }
.recent-identity { min-width: 0; }
.recent-identity strong, .recent-identity small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.recent-identity strong { font-size: 10px; }
.recent-identity small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.compact-empty { padding: 38px 15px; color: var(--muted); text-align: center; font-size: 9px; }
.avatar { width: 35px; height: 35px; flex: 0 0 auto; border-radius: 9px; display: grid; place-items: center; color: var(--green-dark); background: var(--green-soft); font-size: 8px; font-weight: 900; }
.status-badge { min-height: 21px; padding: 4px 7px; display: inline-flex; align-items: center; border-radius: 99px; white-space: nowrap; font-size: 7px; font-weight: 850; }
.status-active { color: var(--success); background: var(--success-soft); }
.status-paused { color: var(--amber); background: var(--amber-soft); }
.status-inactive { color: #70808a; background: #edf1f3; }
.health-list { display: grid; gap: 12px; }
.health-list > div { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.health-list span { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 8px; }
.health-list span svg { width: 13px; color: #79909d; }
.health-list strong { color: var(--success); font-size: 8px; }
.summary-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.summary-metrics > div { padding: 12px; border-radius: 10px; background: var(--blue-soft); }
.summary-metrics span, .summary-metrics strong { display: block; }
.summary-metrics span { color: var(--muted); font-size: 7px; }
.summary-metrics strong { margin-top: 5px; font-size: 16px; }
.matching-summary > p { margin: 14px 0; color: var(--muted); font-size: 8px; line-height: 1.55; }

.section-toolbar { margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.search-input { width: min(390px, 100%); min-height: 39px; padding: 0 11px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.search-input svg { width: 14px; color: #82929b; }
.search-input input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 9px; }
.toolbar-select select { min-height: 39px; max-width: 185px; padding: 0 28px 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #fff; font-size: 8px; cursor: pointer; }
.toolbar-select select:disabled { color: #91a0a8; background: #f1f4f5; cursor: not-allowed; }
.toolbar-select.sort-select select { max-width: 175px; }
.filter-group { padding: 3px; display: flex; gap: 2px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.filter-button { min-height: 29px; padding: 0 8px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; cursor: pointer; font-size: 8px; font-weight: 750; }
.filter-button.is-active { color: var(--green-dark); background: var(--green-soft); }
.record-count { margin-left: auto; color: var(--muted); white-space: nowrap; font-size: 8px; }
.entrepreneur-list { display: grid; gap: 7px; }
.entrepreneur-row { min-width: 0; padding: 12px 14px; display: grid; grid-template-columns: minmax(250px, 1.15fr) minmax(220px, .9fr) minmax(170px, .65fr) max-content; gap: 10px; align-items: center; border: 1px solid var(--line); border-radius: 11px; background: #fff; }
.entrepreneur-row > *:not(:last-child) { min-width: 0; padding-right: 12px; border-right: 1px solid #edf1f3; }
.entrepreneur-profile { min-width: 0; display: flex; align-items: center; gap: 10px; }
.entrepreneur-profile > div { min-width: 0; }
.entrepreneur-profile h3 { margin: 0; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.entrepreneur-profile p, .row-detail p { margin: 3px 0 0; color: var(--muted); font-size: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.row-detail strong { display: block; font-size: 9px; }
.row-detail a { margin-top: 4px; display: inline-flex; align-items: center; color: var(--green-dark); font-size: 7px; text-decoration: none; }
.row-detail a svg { width: 10px; height: 10px; }
.row-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.row-tags span { padding: 4px 6px; border-radius: 5px; color: #58707d; background: #eef3f5; font-size: 7px; }
.row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
.action-button { min-height: 28px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: #fff; cursor: pointer; font-size: 7px; font-weight: 800; }
.action-primary { color: var(--navy-800); background: #f1f5f7; }
.dashboard-empty { padding: 56px 20px; border: 1px dashed #cbd7dc; border-radius: 14px; background: rgba(255,255,255,.6); text-align: center; }
.dashboard-empty > span, .dashboard-empty > svg { width: 45px; height: 45px; margin: 0 auto; display: grid; place-items: center; border-radius: 13px; color: var(--green); background: var(--green-soft); font-size: 23px; }
.dashboard-empty > svg { padding: 13px; }
.dashboard-empty h2 { margin: 13px 0 5px; font-size: 15px; }
.dashboard-empty p { margin: 0 auto 16px; max-width: 390px; color: var(--muted); font-size: 9px; }

.problem-admin-list { display: grid; gap: 7px; }
.problem-admin-row { padding: 9px 11px; display: grid; grid-template-columns: 28px 40px 88px 120px minmax(150px, .8fr) minmax(210px, 1.15fr) auto auto; gap: 8px; align-items: center; border: 1px solid #e7ecef; border-radius: 9px; background: #fbfcfc; }
.problem-ordering { display: grid; justify-items: center; gap: 2px; }
.move-button { width: 22px; height: 19px; padding: 0; border: 0; border-radius: 5px; color: #819099; background: transparent; cursor: pointer; font-size: 10px; }
.move-button:hover:not(:disabled) { color: var(--green-dark); background: var(--green-soft); }
.move-button:disabled { opacity: .2; }
.problem-position { color: #9aa6ad; font-size: 7px; }
.problem-identity { display: contents; }
.problem-code { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; color: var(--green-dark); background: var(--green-soft); font-size: 7px; font-weight: 900; }
.problem-admin-row input[type="text"] { width: 100%; min-height: 38px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; font-size: 9px; }
.problem-icon { width: 88px; min-height: 38px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: #fff; font-size: 7px; }
.problem-category { width: 120px; min-height: 38px; padding: 5px 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: #fff; font-size: 7px; }
.delete-problem, .delete-category { color: #a43b30; border-color: #e8cbc6; background: #fff8f6; }
.category-admin-list { display: grid; gap: 7px; }
.category-admin-row { padding: 9px 11px; display: grid; grid-template-columns: 28px minmax(110px, .35fr) minmax(200px, 1fr) auto; gap: 8px; align-items: center; border: 1px solid #e7ecef; border-radius: 9px; background: #fbfcfc; }
.category-position { color: #9aa6ad; font-size: 7px; }
.category-code { overflow: hidden; color: var(--green-dark); font-size: 8px; font-weight: 800; text-overflow: ellipsis; }
.category-name { width: 100%; min-height: 38px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 7px; font-size: 9px; }
.toggle-label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 8px; }
.toggle-label input { accent-color: var(--green); }

.settings-layout { display: grid; gap: 12px; }
.field-grid { display: grid; gap: 13px; }
.field-grid.two-columns { grid-template-columns: 1fr 1fr; }
.field { display: grid; gap: 6px; }
.field > span, .checkbox-fieldset legend { color: var(--ink); font-size: 9px; font-weight: 800; }
.field > span small { color: var(--muted); font-weight: 500; }
.field input, .field textarea, .field select { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: #fff; outline: 0; font-size: 9px; }
.field textarea { resize: vertical; line-height: 1.5; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--madani-blue); box-shadow: 0 0 0 3px rgba(18,62,163,.1); }
.field > small { color: var(--muted); font-size: 8px; line-height: 1.45; }
.password-wrap { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #fff; }
.password-wrap input { border: 0; box-shadow: none !important; }
.password-wrap button { border: 0; padding: 0 11px; color: var(--green-dark); background: transparent; font-size: 8px; font-weight: 800; cursor: pointer; }
.form-error { margin: 9px 0; padding: 9px 11px; border-radius: 8px; color: #a43b30; background: var(--coral-soft); font-size: 9px; }
.notification-card { border-color: #f0d0ca; }
.preview-badge { padding: 5px 8px; border-radius: 99px; color: var(--coral); background: var(--coral-soft); font-size: 7px; font-weight: 900; }
.notification-preview { margin-top: 16px; padding: 13px; display: flex; gap: 10px; align-items: flex-start; border-radius: 9px; background: var(--coral-soft); }
.notification-preview > span { width: 25px; height: 25px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; color: #fff; background: var(--coral); font-size: 9px; font-weight: 900; }
.notification-preview strong { font-size: 9px; }
.notification-preview p { margin: 3px 0 0; color: #765a54; font-size: 8px; line-height: 1.5; }
.locked-copy-note { margin-top: 13px; padding: 11px; display: grid; grid-template-columns: auto 1fr 1fr; gap: 8px; align-items: center; border-radius: 9px; color: #526772; background: var(--green-soft); font-size: 8px; }
.locked-copy-note strong { display: flex; align-items: center; gap: 5px; color: var(--green-dark); }
.locked-copy-note svg { width: 11px; }
.form-footer { margin-top: 17px; display: flex; justify-content: flex-end; }
.matching-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 12px; align-items: start; }
.matching-rule { margin-top: 18px; padding: 13px; display: flex; align-items: flex-start; gap: 10px; border-radius: 9px; color: #526772; background: var(--blue-soft); }
.matching-rule > svg { width: 18px; flex: 0 0 auto; color: var(--green-dark); }
.matching-rule strong { display: block; color: var(--navy-800); font-size: 9px; }
.matching-rule p { margin: 4px 0 0; font-size: 8px; line-height: 1.5; }
.calculator-map-inputs { margin-bottom: 13px; display: grid; gap: 9px; }
.calculator-location { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; }
.calculator-location .button { height: 38px; }
.map-resolve-message { grid-column: 1 / -1; color: var(--green-dark); font-size: 8px; line-height: 1.4; }
.map-resolve-message.is-error { color: var(--coral); }
.coordinate-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.distance-result { margin-top: 12px; padding: 15px; display: grid; gap: 3px; border: 1px dashed #c9d6dc; border-radius: 10px; background: #fafcfc; text-align: center; }
.distance-result span { color: var(--muted); font-size: 8px; font-weight: 750; }
.distance-result strong { font-size: 23px; }
.distance-result small { color: var(--muted); font-size: 7px; line-height: 1.4; }
.distance-result.is-success { border-color: #b9dfca; background: var(--success-soft); }
.distance-result.is-success strong { color: var(--success); }
.distance-result.is-warning { border-color: #ead5ad; background: var(--amber-soft); }
.distance-result.is-warning strong { color: var(--amber); }
.distance-result.is-error { border-color: #efc9c2; background: var(--coral-soft); }
.distance-result.is-error strong { color: var(--coral); }

.admin-settings-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .8fr); gap: 12px; align-items: start; }
.heading-icon { width: 19px; height: 19px; flex: 0 0 auto; color: var(--green-dark); }
.admin-summary-card { background: linear-gradient(135deg, #fff, #f4f6ff); }
.admin-account-row { padding: 14px; display: flex; align-items: center; gap: 11px; border: 1px solid #dce3f5; border-radius: 10px; background: #fff; }
.admin-account-icon { width: 39px; height: 39px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--green-dark); background: var(--green-soft); }
.admin-account-icon svg { width: 19px; height: 19px; }
.admin-account-row > div { min-width: 0; }
.admin-account-row span, .admin-account-row strong, .admin-account-row small { display: block; }
.admin-account-row > div > span { color: var(--muted); font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }
.admin-account-row strong { margin-top: 3px; font-size: 11px; }
.admin-account-row small { margin-top: 3px; color: var(--muted); font-size: 8px; overflow-wrap: anywhere; }
.security-facts { margin-top: 10px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.security-facts > div { padding: 11px; border-radius: 9px; background: var(--blue-soft); }
.security-facts span, .security-facts strong { display: block; }
.security-facts span { color: var(--muted); font-size: 7px; }
.security-facts strong { margin-top: 5px; color: var(--navy-800); font-size: 9px; }
.security-action { margin-top: 12px; }
.mfa-setup { margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line); display: grid; gap: 11px; }
.mfa-setup > p, .security-success p, .security-note, .recovery-card p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
.secret-key-row { padding: 10px; display: flex; align-items: center; gap: 8px; border-radius: 8px; background: var(--navy-950); }
.secret-key-row code { min-width: 0; flex: 1; color: #e4eaff; font-size: 9px; letter-spacing: .08em; overflow-wrap: anywhere; }
.secret-key-row .text-button { color: var(--madani-yellow); }
.security-success { margin-bottom: 13px; padding: 11px; display: flex; gap: 9px; align-items: flex-start; border-radius: 9px; color: var(--success); background: var(--success-soft); }
.security-success > svg { width: 17px; height: 17px; flex: 0 0 auto; }
.security-success strong { display: block; font-size: 9px; }
.security-success p { margin-top: 3px; }
.security-note { margin-top: 12px; padding: 10px; border-radius: 8px; background: var(--amber-soft); color: #785b32; }
.security-note code, .recovery-card code { font-size: inherit; }
.button-danger { color: #fff; background: #b9473a; }
.button-danger:hover:not(:disabled) { background: #9d392f; }
.danger-card { border-color: #efd3ce; }
.danger-card .eyebrow { color: var(--coral); }
.recovery-card { background: #fbfcfc; }
.recovery-card h2 { margin: 0 0 7px; font-size: 11px; }

.modal { width: min(760px, calc(100% - 28px)); max-height: calc(100vh - 28px); padding: 0; border: 0; border-radius: 17px; background: #fff; box-shadow: 0 30px 100px rgba(7,24,39,.28); }
.modal::backdrop { background: rgba(5,20,31,.64); backdrop-filter: blur(5px); }
.modal-shell { margin: 0; }
.modal-header, .modal-footer { padding: 17px 21px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.modal-header { border-bottom: 1px solid var(--line); }
.modal-header h2 { margin: 5px 0 0; font-size: 17px; }
.modal-footer { border-top: 1px solid var(--line); justify-content: flex-end; }
.modal-body { padding: 19px 21px 24px; max-height: calc(100vh - 170px); overflow: auto; }
.full-span { grid-column: 1 / -1; }
.form-divider { margin: 21px 0 12px; border-top: 1px solid var(--line); }
.form-divider span { display: inline-block; transform: translateY(-7px); padding-right: 9px; color: var(--muted); background: #fff; font-size: 8px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.location-link-row { margin-bottom: 11px; display: grid; grid-template-columns: 1fr auto; gap: 9px; align-items: end; }
.location-grid { grid-template-columns: 1fr 1fr 1fr auto; align-items: end; }
.location-button { height: 38px; }
.inline-message { margin: 8px 0 0; color: var(--green-dark); font-size: 8px; }
.inline-message.is-error { color: var(--coral); }
.checkbox-fieldset { padding: 0; margin: 0 0 14px; border: 0; }
.checkbox-fieldset legend { margin-bottom: 8px; }
.checkbox-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.checkbox-option { padding: 7px 9px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: #fff; font-size: 8px; cursor: pointer; }
.checkbox-option:has(input:checked) { color: var(--green-dark); border-color: #aebfe9; background: var(--green-soft); }
.checkbox-option input { accent-color: var(--green); }
.toast { position: fixed; z-index: 50; right: 21px; bottom: 21px; max-width: min(390px, calc(100% - 42px)); padding: 11px 14px; border-radius: 9px; color: #fff; background: var(--navy-800); box-shadow: 0 15px 40px rgba(0,0,0,.2); font-size: 9px; font-weight: 750; }
.toast.is-error { background: #a43b30; }

@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 1050px) {
  .overview-stats { grid-template-columns: repeat(2, 1fr); }
  .overview-grid, .matching-layout, .admin-settings-grid { grid-template-columns: 1fr; }
  .overview-aside { grid-template-columns: 1fr 1fr; }
  .entrepreneur-row { grid-template-columns: minmax(210px, 1.2fr) minmax(150px, .8fr) auto; }
  .entrepreneur-row > .row-detail { border-right: 0; }
  .row-tags { display: none; }
  .section-toolbar { flex-wrap: wrap; }
  .search-input { flex: 1 1 300px; }
  .record-count { margin-left: 0; }
}

@media (max-width: 820px) {
  .dashboard { display: block; }
  .sidebar { position: fixed; width: 236px; transform: translateX(-100%); transition: transform .2s ease; box-shadow: 20px 0 50px rgba(7,24,39,.2); }
  .sidebar.is-open { transform: translateX(0); }
  .mobile-menu { display: grid; }
  .topbar { padding: 0 14px; }
  .breadcrumb { margin-right: auto; margin-left: 9px; }
  .admin-main { padding-top: 28px; }
  .live-pill { display: none; }
}

@media (max-width: 620px) {
  .topbar { height: 54px; }
  .breadcrumb span, .breadcrumb svg { display: none; }
  .admin-avatar { display: none; }
  .admin-main { padding: 23px 13px 40px; }
  .page-header { margin-bottom: 21px; align-items: flex-start; }
  .page-header h1 { font-size: 24px; }
  .page-header > div > p:last-child, #heading-refresh { display: none; }
  .page-header .button { padding: 8px 9px; font-size: 8px; }
  .overview-stats { grid-template-columns: 1fr 1fr; gap: 7px; }
  .stat-card { min-height: 101px; padding: 14px; }
  .stat-card > strong { font-size: 22px; }
  .stat-card > small { line-height: 1.35; }
  .overview-aside { grid-template-columns: 1fr; }
  .content-card { padding: 16px; }
  .card-heading { flex-wrap: wrap; }
  .section-toolbar { display: grid; grid-template-columns: 1fr 1fr; }
  .search-input, .filter-group { grid-column: 1 / -1; width: 100%; }
  .toolbar-select select { width: 100%; max-width: none; }
  .toolbar-select.sort-select { grid-column: 1 / -1; }
  .toolbar-select.sort-select select { max-width: none; }
  .filter-group { overflow-x: auto; }
  .filter-button { flex: 1 0 auto; }
  .entrepreneur-row { grid-template-columns: 1fr auto; gap: 9px; }
  .entrepreneur-row > *:not(:last-child) { padding-right: 0; border-right: 0; }
  .entrepreneur-row > .row-detail { display: none; }
  .job-activity-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .job-activity-row .activity-coordinate { grid-column: 2 / -1; grid-row: 2; }
  .row-actions { grid-column: 1 / -1; justify-content: stretch; }
  .row-actions .action-button { flex: 1; }
  .row-actions .status-badge { margin-right: auto; }
  .problem-admin-row { grid-template-columns: 24px 68px minmax(0, 1fr) auto; gap: 7px; }
  .problem-ordering { grid-row: 1 / 4; }
  .problem-code { grid-column: 2; grid-row: 1; }
  .problem-title { grid-column: 3; grid-row: 1; }
  .toggle-label { grid-column: 4; grid-row: 1; }
  .problem-icon { width: 68px; grid-column: 2; grid-row: 2; }
  .problem-admin-row .problem-description { grid-column: 3 / -1; grid-row: 2; }
  .problem-category { width: 100%; grid-column: 2 / 4; grid-row: 3; }
  .delete-problem { grid-column: 4; grid-row: 3; }
  .category-admin-row { grid-template-columns: 24px minmax(80px, .4fr) minmax(0, 1fr) auto; }
  .card-heading-actions { width: 100%; flex-wrap: wrap; }
  .field-grid.two-columns, .coordinate-grid, .location-grid, .location-link-row, .calculator-location { grid-template-columns: 1fr; }
  .full-span { grid-column: auto; }
  .locked-copy-note { grid-template-columns: 1fr; }
  .security-facts { grid-template-columns: 1fr 1fr; }
  .login-card { padding: 28px 23px; }
  .modal-body, .modal-header, .modal-footer { padding-left: 15px; padding-right: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; }
}