/* ATHAR — black & white home (desktop dashboard). Loaded last; scoped to .rd-desk-dash. */
html:root .rd-desk-dash {
  --hm-fg: #0a0a0a; --hm-mu: #6b6b6b; --hm-ln: #e4e4e4; --hm-bg: #fff; --hm-sf: #f5f5f5;
}
[data-theme="dark"] html:root .rd-desk-dash, html:root[data-theme="dark"] .rd-desk-dash {
  --hm-fg: #f2f2f2; --hm-mu: #a3a3a3; --hm-ln: #262626; --hm-bg: #0f0f0f; --hm-sf: #181818;
}
html:root .rd-desk-dash__name { font-family: 'Readex Pro','IBM Plex Sans Arabic',sans-serif; font-weight: 600; letter-spacing: -.01em; color: var(--hm-fg); }
html:root .rd-desk-dash__date { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 12px; color: var(--hm-mu); }
/* flat cards */
html:root .rd-desk-streak, html:root .rd-desk-metric, html:root .rd-desk-stat,
html:root .rd-desk-dist, html:root .rd-desk-activity {
  background: var(--hm-bg) !important; border: 1px solid var(--hm-ln) !important;
  border-radius: 4px !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root .rd-desk-mini { background: var(--hm-sf) !important; border-radius: 4px !important; box-shadow: none !important; }
html:root .rd-desk-stat__val, html:root .rd-desk-mini__val, html:root .rd-desk-metric__val {
  color: var(--hm-fg) !important; font-family: 'IBM Plex Mono', ui-monospace, monospace; font-weight: 500;
}
html:root .rd-desk-stat__lbl, html:root .rd-desk-mini__lbl, html:root .rd-desk-metric__label,
html:root .rd-desk-metric__sub, html:root .rd-desk-dist__label { color: var(--hm-mu) !important; }
/* neutral icon chips */
html:root .rd-desk-stat__ico, html:root .rd-desk-dist__ico {
  background: var(--hm-sf) !important; color: var(--hm-fg) !important; border-radius: 4px !important;
}
html:root .rd-desk-stat__ico i, html:root .rd-desk-dist__ico i { color: var(--hm-fg) !important; }
/* section titles + links */
html:root .rd-desk-sec__title { font-family: 'Readex Pro','IBM Plex Sans Arabic',sans-serif; font-weight: 600; color: var(--hm-fg); }
html:root .rd-desk-sec__link { color: var(--hm-fg) !important; text-decoration: underline; text-underline-offset: 3px; }
/* distribution rows: hairline list, count in mono, color only as a small dot */
html:root .rd-desk-dist { overflow: hidden; }
html:root .rd-desk-dist__row { background: transparent !important; border-radius: 0 !important; border-bottom: 1px solid var(--hm-ln) !important; }
html:root .rd-desk-dist__row:last-child { border-bottom: 0 !important; }
html:root .rd-desk-dist__row:hover { background: var(--hm-sf) !important; }
html:root .rd-desk-dist__count { font-family: 'IBM Plex Mono', ui-monospace, monospace; }
/* streak badge: outlined chip */
html:root .rd-desk-streak__badge { background: transparent !important; border: 1px solid var(--hm-ln); border-radius: 999px; color: var(--hm-fg) !important; }

/* ---- role dashboards ---- */
html:root .rd-rl-hero { display: grid; grid-template-columns: minmax(280px, 1fr) 2fr; gap: 16px; }
html:root .rd-rl-score, html:root .rd-rl-kpi, html:root .rd-rl-table {
  background: var(--hm-bg); border: 1px solid var(--hm-ln); border-radius: 4px; box-shadow: none;
}
html:root .rd-rl-score { padding: 20px; display: flex; flex-direction: column; gap: 10px; }
html:root .rd-rl-score__t { font-size: 13px; color: var(--hm-mu); }
html:root .rd-rl-score__v { display: flex; align-items: baseline; gap: 12px; }
html:root .rd-rl-score__v .rd-rl-num { font-size: 44px; line-height: 1; color: var(--hm-fg); }
html:root .rd-rl-score__s { font-size: 12px; color: var(--hm-mu); }
html:root .rd-rl-bar { height: 4px; background: var(--hm-sf); border-radius: 2px; overflow: hidden; }
html:root .rd-rl-bar i { display: block; height: 100%; background: var(--hm-fg); }
html:root .rd-rl-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
html:root .rd-rl-kpi { padding: 20px; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }
html:root .rd-rl-kpi__v .rd-rl-num { font-size: 32px; color: var(--hm-fg); }
html:root .rd-rl-kpi__l { font-size: 12px; color: var(--hm-mu); }
html:root .rd-rl-num { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-weight: 500; font-variant-numeric: tabular-nums; }
html:root .rd-rl-sub { font-size: 12px; color: var(--hm-mu); }
html:root .rd-rl-table { overflow: hidden; }
html:root .rd-rl-tr { display: grid; grid-template-columns: 2fr repeat(calc(var(--c) - 1), 1fr); gap: 8px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--hm-ln); font-size: 13px; color: var(--hm-fg); text-align: start; }
html:root .rd-rl-tr:last-child { border-bottom: 0; }
html:root .rd-rl-tr--h { font-size: 11px; color: var(--hm-mu); background: var(--hm-sf); }
html:root .rd-rl-tr[role="button"] { cursor: pointer; }
html:root .rd-rl-tr[role="button"]:hover { background: var(--hm-sf); }
html:root .rd-rl-empty { padding: 20px; text-align: center; color: var(--hm-mu); font-size: 13px; }
/* colors only on band chips */
html:root .rd-rl-chip { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; justify-self: start; }
html:root .rd-rl-chip--ex { background: #dcfce7; color: #166534; }
html:root .rd-rl-chip--gd { background: #dbeafe; color: #1e40af; }
html:root .rd-rl-chip--md { background: #fef3c7; color: #92400e; }
html:root .rd-rl-chip--bd { background: #fee2e2; color: #991b1b; }
html:root[data-theme="dark"] .rd-rl-chip--ex { background: #14532d; color: #bbf7d0; }
html:root[data-theme="dark"] .rd-rl-chip--gd { background: #1e3a8a; color: #bfdbfe; }
html:root[data-theme="dark"] .rd-rl-chip--md { background: #78350f; color: #fde68a; }
html:root[data-theme="dark"] .rd-rl-chip--bd { background: #7f1d1d; color: #fecaca; }
html:root .rd-desk-dash--role .rd-desk-dash__main { display: flex; flex-direction: column; gap: 20px; }
@media (max-width: 1100px) { html:root .rd-rl-hero { grid-template-columns: 1fr; } }
html:root .rd-desk-dash--role .rd-rl-hero { margin-bottom: 24px; }
html:root .rd-desk-dash--role .rd-desk-sec__head { margin-bottom: 10px; display: flex; justify-content: space-between; align-items: baseline; }

/* ---- design-faithful home layout (rd-h-*) ---- */
html:root .rd-desk-dash--h { display: flex; flex-direction: column; gap: 20px; }
html:root .rd-h-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
html:root .rd-h-kick { font-family: 'IBM Plex Mono', ui-monospace, monospace; font-size: 12px; letter-spacing: .08em; color: var(--hm-mu); direction: ltr; text-align: start; }
html:root .rd-h-head h1 { margin: 6px 0 0; font-family: 'Readex Pro','IBM Plex Sans Arabic',sans-serif; font-weight: 600; font-size: 34px; color: var(--hm-fg); }
html:root .rd-h-theme { display: inline-flex; border: 1px solid var(--hm-ln); border-radius: 4px; overflow: hidden; }
html:root .rd-h-theme button { width: 40px; height: 38px; border: 0; background: transparent; color: var(--hm-fg); cursor: pointer; }
html:root .rd-h-theme button:hover { background: var(--hm-sf); }
html:root .rd-h-row { display: grid; gap: 20px; align-items: start; }
html:root .rd-h-row--a { grid-template-columns: 1.15fr 1fr; }
html:root .rd-h-row--b { grid-template-columns: 1.3fr 1fr; }
html:root .rd-h-card { background: var(--hm-bg); border: 1px solid var(--hm-ln); border-radius: 4px; padding: 20px; min-width: 0; }
html:root .rd-h-card__t { font-size: 13px; font-weight: 600; color: var(--hm-mu); margin-bottom: 12px; }
html:root .rd-h-hero__row { display: flex; align-items: center; gap: 22px; margin-bottom: 18px; }
html:root .rd-h-ring { position: relative; width: 124px; height: 124px; flex: none; }
html:root .rd-h-ring__n { position: absolute; inset: 0; display: grid; place-items: center; font-family: 'IBM Plex Mono', monospace; font-size: 34px; color: var(--hm-fg); }
html:root .rd-h-hero__txt p { margin: 10px 0 0; font-size: 13px; line-height: 1.7; color: var(--hm-fg); }
html:root .rd-h-band__bar { position: relative; display: flex; height: 8px; gap: 2px; border-radius: 2px; }
html:root .rd-h-band__bar i { display: block; height: 100%; }
html:root .rd-h-band__bar b { position: absolute; top: -4px; width: 3px; height: 16px; background: var(--hm-fg); transform: translateX(50%); }
html:root .rd-h-band__lg { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 10px; font-size: 11px; color: var(--hm-mu); }
html:root .rd-h-band__lg u { display: inline-block; width: 8px; height: 8px; margin-inline-end: 5px; text-decoration: none; }
html:root .rd-h-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--hm-ln); }
html:root .rd-h-stats > div { padding-inline: 14px; border-inline-start: 1px solid var(--hm-ln); }
html:root .rd-h-stats > div:first-child { border-inline-start: 0; padding-inline-start: 0; }
html:root .rd-h-stats__v .rd-rl-num { font-size: 26px; color: var(--hm-fg); }
html:root .rd-h-stats__l { font-size: 12px; color: var(--hm-mu); margin-top: 2px; }
html:root .rd-h-rank { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 12px; border-bottom: 1px solid var(--hm-ln); }
html:root .rd-h-rank__n .rd-rl-num { font-size: 36px; color: var(--hm-fg); }
html:root .rd-h-rank__n small { font-size: 12px; color: var(--hm-mu); margin-inline-start: 6px; }
html:root .rd-h-list { display: flex; flex-direction: column; }
html:root .rd-h-list__r { display: grid; grid-template-columns: 24px 1fr 1fr 40px; gap: 10px; align-items: center; padding: 9px 0; font-size: 13px; color: var(--hm-fg); border-bottom: 1px solid var(--hm-ln); }
html:root .rd-h-list__r.is-me { font-weight: 700; }
html:root .rd-h-mu { color: var(--hm-mu); }
html:root .rd-h-meter { height: 6px; background: var(--hm-sf); border-radius: 3px; overflow: hidden; }
html:root .rd-h-meter i { display: block; height: 100%; }
html:root .rd-h-tk { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border: 0; border-bottom: 1px solid var(--hm-ln); background: transparent; text-align: start; cursor: pointer; color: var(--hm-fg); }
html:root .rd-h-tk b { display: block; font-size: 14px; }
html:root .rd-h-tk small, html:root .rd-h-nt small { display: block; font-size: 11px; color: var(--hm-mu); font-family: 'IBM Plex Mono', monospace; }
html:root .rd-h-pill { border: 1px solid var(--hm-fg); border-radius: 999px; padding: 2px 12px; font-size: 11px; white-space: nowrap; }
html:root .rd-h-nt { padding: 12px 0; border-bottom: 1px solid var(--hm-ln); font-size: 13px; color: var(--hm-fg); }
html:root .rd-h-tiles { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1100px) { html:root .rd-h-row--a, html:root .rd-h-row--b { grid-template-columns: 1fr; } }

.rd-h-row--a.rd-h-row--1{grid-template-columns:1fr !important}
html:root.mr-mobile-ui .rd-mob-dash .rd-h-row--a.rd-h-row--1{grid-template-columns:1fr !important}

html:root .rd-h-list__r.is-me { background: rgba(128,128,128,.14); margin: 0 -10px; padding: 9px 10px; border-radius: 4px; border-bottom-color: transparent; font-weight: 700; }

/* admin: «التذاكر حسب المرحلة» sits beside «آخر التذاكر», equal size */
html:root .rd-h-row--b.rd-h-row--eq{grid-template-columns:1fr 1fr;align-items:stretch}
html:root .rd-h-row--eq>.rd-h-card,html:root .rd-h-row--eq>.rd-h-side{min-width:0}
html:root .rd-h-side{display:flex;flex-direction:column;background:var(--hm-bg);border:1px solid var(--hm-ln);border-radius:4px;padding:20px}
html:root .rd-h-side>.rd-desk-sec{margin:0;padding:0;border:0;background:transparent;flex:1;display:flex;flex-direction:column}
html:root .rd-h-side .rd-desk-sec__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
html:root .rd-h-side .rd-rl-table{flex:1}
@media (max-width:1100px){html:root .rd-h-row--b.rd-h-row--eq{grid-template-columns:1fr}}
