/**
 * ParsExam Enterprise Design System — tokens + primitives
 * Source of truth for shared chrome (admin first). Dark-mode ready via data-theme.
 * Do not put page-specific one-offs here.
 */
:root,
[data-theme="light"] {
  --ep-font-sans: "Vazirmatn", "Vazir", system-ui, sans-serif;
  --ep-font-mono: ui-monospace, Consolas, "Cascadia Mono", monospace;

  --ep-space-1: 4px;
  --ep-space-2: 8px;
  --ep-space-3: 12px;
  --ep-space-4: 16px;
  --ep-space-5: 20px;
  --ep-space-6: 24px;
  --ep-space-8: 32px;
  --ep-space-10: 40px;
  --ep-space-12: 48px;

  --ep-radius-sm: 8px;
  --ep-radius-md: 12px;
  --ep-radius-lg: 16px;
  --ep-radius-full: 999px;

  --ep-color-bg: #f7f8fc;
  --ep-color-surface: #ffffff;
  --ep-color-surface-2: #f8fafc;
  --ep-color-border: #e2e8f0;
  --ep-color-border-strong: #cbd5e1;
  --ep-color-text: #0f172a;
  --ep-color-text-muted: #64748b;
  --ep-color-text-subtle: #94a3b8;
  --ep-color-primary: #4f46e5;
  --ep-color-primary-hover: #4338ca;
  --ep-color-primary-soft: #eef2ff;
  --ep-color-success: #059669;
  --ep-color-success-soft: #ecfdf5;
  --ep-color-warning: #d97706;
  --ep-color-warning-soft: #fffbeb;
  --ep-color-danger: #dc2626;
  --ep-color-danger-soft: #fef2f2;
  --ep-color-info: #0284c7;
  --ep-color-info-soft: #f0f9ff;

  --ep-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --ep-shadow-md: 0 4px 16px rgba(15, 23, 42, 0.08);
  --ep-shadow-lg: 0 12px 40px rgba(15, 23, 42, 0.14);

  --ep-z-toast: 1400;
  --ep-z-dialog: 1300;
  --ep-z-backdrop: 1290;
  --ep-z-cmdk: 1350;

  --ep-focus-ring: 0 0 0 3px rgba(79, 70, 229, 0.35);
  --ep-motion-fast: 120ms ease;
  --ep-motion: 180ms ease;
}

[data-theme="dark"] {
  --ep-color-bg: #0b1220;
  --ep-color-surface: #111827;
  --ep-color-surface-2: #1f2937;
  --ep-color-border: #334155;
  --ep-color-border-strong: #475569;
  --ep-color-text: #f8fafc;
  --ep-color-text-muted: #94a3b8;
  --ep-color-text-subtle: #64748b;
  --ep-color-primary: #818cf8;
  --ep-color-primary-hover: #a5b4fc;
  --ep-color-primary-soft: #1e1b4b;
  --ep-color-success: #34d399;
  --ep-color-success-soft: #064e3b;
  --ep-color-warning: #fbbf24;
  --ep-color-warning-soft: #78350f;
  --ep-color-danger: #f87171;
  --ep-color-danger-soft: #7f1d1d;
  --ep-color-info: #38bdf8;
  --ep-color-info-soft: #0c4a6e;
  --ep-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --ep-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --ep-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.5);
}

/* —— Buttons —— */
.ep-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ep-space-2);
  min-height: 40px;
  padding: 0 var(--ep-space-4);
  border-radius: var(--ep-radius-sm);
  border: 1px solid transparent;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--ep-motion-fast), border-color var(--ep-motion-fast), color var(--ep-motion-fast);
}
.ep-btn:focus-visible { outline: none; box-shadow: var(--ep-focus-ring); }
.ep-btn:disabled { opacity: 0.55; cursor: not-allowed; }
.ep-btn-primary { background: var(--ep-color-primary); color: #fff; }
.ep-btn-primary:hover:not(:disabled) { background: var(--ep-color-primary-hover); }
.ep-btn-secondary { background: var(--ep-color-surface); color: var(--ep-color-text); border-color: var(--ep-color-border); }
.ep-btn-secondary:hover:not(:disabled) { border-color: var(--ep-color-primary); color: var(--ep-color-primary); }
.ep-btn-danger { background: var(--ep-color-danger); color: #fff; }
.ep-btn-ghost { background: transparent; color: var(--ep-color-primary); }

/* —— Cards / surface —— */
.ep-card {
  background: var(--ep-color-surface);
  border: 1px solid var(--ep-color-border);
  border-radius: var(--ep-radius-md);
  box-shadow: var(--ep-shadow-sm);
  padding: var(--ep-space-4) var(--ep-space-5);
}
.ep-card-title { margin: 0 0 var(--ep-space-2); font-size: 14px; font-weight: 700; color: var(--ep-color-text); }
.ep-card-sub { margin: 0; font-size: 12px; color: var(--ep-color-text-muted); line-height: 1.6; }

/* —— Empty / error / loading —— */
.ep-state {
  text-align: center;
  padding: var(--ep-space-8) var(--ep-space-4);
  border: 1px dashed var(--ep-color-border);
  border-radius: var(--ep-radius-md);
  background: var(--ep-color-surface-2);
  color: var(--ep-color-text-muted);
  line-height: 1.7;
}
.ep-state strong { display: block; color: var(--ep-color-text); margin-bottom: var(--ep-space-2); font-size: 14px; }
.ep-state-error { border-color: #fecaca; background: var(--ep-color-danger-soft); }
.ep-state-error strong { color: var(--ep-color-danger); }
.ep-skeleton {
  background: linear-gradient(90deg, var(--ep-color-border) 25%, var(--ep-color-surface-2) 50%, var(--ep-color-border) 75%);
  background-size: 200% 100%;
  animation: ep-shimmer 1.2s infinite;
  border-radius: var(--ep-radius-sm);
  min-height: 12px;
}
@keyframes ep-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.ep-spinner {
  width: 28px; height: 28px;
  border: 3px solid var(--ep-color-border);
  border-top-color: var(--ep-color-primary);
  border-radius: 50%;
  animation: ep-spin 0.7s linear infinite;
  margin: 0 auto var(--ep-space-3);
}
@keyframes ep-spin { to { transform: rotate(360deg); } }

/* —— Toast —— */
.ep-toast-host {
  position: fixed;
  z-index: var(--ep-z-toast);
  inset-inline-end: var(--ep-space-4);
  bottom: var(--ep-space-4);
  display: flex;
  flex-direction: column;
  gap: var(--ep-space-2);
  max-width: min(400px, calc(100vw - 32px));
  pointer-events: none;
}
.ep-toast {
  pointer-events: auto;
  background: var(--ep-color-surface);
  border: 1px solid var(--ep-color-border);
  border-radius: var(--ep-radius-md);
  box-shadow: var(--ep-shadow-lg);
  padding: var(--ep-space-3) var(--ep-space-4);
  display: flex;
  gap: var(--ep-space-3);
  align-items: flex-start;
  animation: ep-toast-in var(--ep-motion);
  font-size: 13px;
  color: var(--ep-color-text);
}
.ep-toast-ok { border-inline-start: 4px solid var(--ep-color-success); }
.ep-toast-warn { border-inline-start: 4px solid var(--ep-color-warning); }
.ep-toast-error { border-inline-start: 4px solid var(--ep-color-danger); }
.ep-toast-info { border-inline-start: 4px solid var(--ep-color-info); }
.ep-toast button {
  margin-inline-start: auto;
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--ep-color-text-muted);
  font-size: 18px;
  line-height: 1;
  padding: 0 4px;
}
@keyframes ep-toast-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

/* —— Dialog —— */
.ep-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--ep-z-backdrop);
  background: rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(2px);
  animation: ep-fade var(--ep-motion);
}
.ep-dialog {
  position: fixed;
  z-index: var(--ep-z-dialog);
  inset-inline-start: 50%;
  top: 12%;
  transform: translateX(-50%);
  width: min(480px, calc(100vw - 32px));
  background: var(--ep-color-surface);
  border: 1px solid var(--ep-color-border);
  border-radius: var(--ep-radius-lg);
  box-shadow: var(--ep-shadow-lg);
  padding: var(--ep-space-6);
  animation: ep-dialog-in var(--ep-motion);
}
[dir="rtl"] .ep-dialog { transform: translateX(50%); }
.ep-dialog h3 { margin: 0 0 var(--ep-space-2); font-size: 16px; }
.ep-dialog p { margin: 0 0 var(--ep-space-5); color: var(--ep-color-text-muted); font-size: 13px; line-height: 1.7; }
.ep-dialog-actions { display: flex; gap: var(--ep-space-2); justify-content: flex-end; flex-wrap: wrap; }
@keyframes ep-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ep-dialog-in {
  from { opacity: 0; transform: translateX(-50%) translateY(10px); }
  to { opacity: 1; transform: translateX(-50%); }
}
[dir="rtl"] @keyframes ep-dialog-in {
  from { opacity: 0; transform: translateX(50%) translateY(10px); }
  to { opacity: 1; transform: translateX(50%); }
}

/* —— Command palette —— */
.ep-cmdk-backdrop {
  position: fixed;
  inset: 0;
  z-index: var(--ep-z-cmdk);
  background: rgba(15, 23, 42, 0.4);
}
.ep-cmdk {
  position: fixed;
  z-index: calc(var(--ep-z-cmdk) + 1);
  inset-inline-start: 50%;
  top: 14%;
  transform: translateX(-50%);
  width: min(560px, calc(100vw - 24px));
  background: var(--ep-color-surface);
  border: 1px solid var(--ep-color-border);
  border-radius: var(--ep-radius-lg);
  box-shadow: var(--ep-shadow-lg);
  overflow: hidden;
}
[dir="rtl"] .ep-cmdk { transform: translateX(50%); }
.ep-cmdk input {
  width: 100%;
  border: none;
  border-bottom: 1px solid var(--ep-color-border);
  padding: var(--ep-space-4);
  font: inherit;
  font-size: 14px;
  background: transparent;
  color: var(--ep-color-text);
  outline: none;
}
.ep-cmdk-list { max-height: 320px; overflow: auto; padding: var(--ep-space-2); }
.ep-cmdk-item {
  display: flex;
  align-items: center;
  gap: var(--ep-space-3);
  padding: var(--ep-space-3) var(--ep-space-3);
  border-radius: var(--ep-radius-sm);
  cursor: pointer;
  font-size: 13px;
  color: var(--ep-color-text);
}
.ep-cmdk-item:hover,
.ep-cmdk-item[aria-selected="true"] { background: var(--ep-color-primary-soft); }
.ep-cmdk-item small { color: var(--ep-color-text-muted); margin-inline-start: auto; font-size: 11px; }
.ep-cmdk-empty { padding: var(--ep-space-6); text-align: center; color: var(--ep-color-text-muted); font-size: 13px; }

/* —— Badge / chip —— */
.ep-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 8px;
  border-radius: var(--ep-radius-full);
  font-size: 11px;
  font-weight: 700;
  background: var(--ep-color-primary-soft);
  color: var(--ep-color-primary);
}
.ep-badge-ok { background: var(--ep-color-success-soft); color: var(--ep-color-success); }
.ep-badge-warn { background: var(--ep-color-warning-soft); color: var(--ep-color-warning); }
.ep-badge-bad { background: var(--ep-color-danger-soft); color: var(--ep-color-danger); }

/* —— Table shell —— */
.ep-table-wrap { overflow: auto; border: 1px solid var(--ep-color-border); border-radius: var(--ep-radius-md); background: var(--ep-color-surface); }
.ep-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ep-table th, .ep-table td { padding: 10px 12px; border-bottom: 1px solid var(--ep-color-border); text-align: start; }
.ep-table th { background: var(--ep-color-surface-2); color: var(--ep-color-text-muted); font-weight: 700; position: sticky; top: 0; }
.ep-table tr:hover td { background: var(--ep-color-surface-2); }

/* —— Responsive helpers —— */
@media (max-width: 900px) {
  .ep-hide-mobile { display: none !important; }
}
@media (min-width: 901px) {
  .ep-hide-desktop { display: none !important; }
}

/* —— Reduced motion —— */
@media (prefers-reduced-motion: reduce) {
  .ep-toast, .ep-dialog, .ep-backdrop, .ep-skeleton, .ep-spinner { animation: none !important; }
}

/* —— M1 shell: skip link, QA badge, topbar buttons, mobile cards —— */
.ep-skip-link{
  position:absolute;inset-inline-start:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.ep-skip-link:focus{
  position:fixed;inset-inline-start:12px;top:12px;z-index:2000;width:auto;height:auto;
  padding:10px 14px;background:var(--ep-color-primary);color:#fff;border-radius:8px;
  font-weight:700;text-decoration:none;box-shadow:var(--ep-shadow-md);
}
.ep-qa-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:36px;height:28px;padding:0 8px;border-radius:999px;
  background:#fef3c7;color:#92400e;font-size:11px;font-weight:800;letter-spacing:.04em;
  border:1px solid #fcd34d;flex-shrink:0;
}
[data-theme="dark"] .ep-qa-badge{background:#78350f;color:#fde68a;border-color:#b45309}
.ep-env-strip{
  display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  padding:6px 12px;font-size:11px;font-weight:600;
  background:linear-gradient(90deg,#fffbeb,#ecfeff);color:#0f172a;
  border-bottom:1px solid #fde68a;
}
.ep-env-strip strong{color:#b45309}
[data-theme="dark"] .ep-env-strip{background:#1c1917;color:#e7e5e4;border-color:#44403c}
[data-theme="dark"] .ep-env-strip strong{color:#fbbf24}
.ep-topbar-btn{
  width:36px;height:36px;border:none;border-radius:10px;background:#f1f5f9;color:#334155;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;
  font-size:15px;line-height:1;
}
.ep-topbar-btn:hover{background:#e2e8f0;color:#0f172a}
.ep-topbar-btn:focus-visible{outline:none;box-shadow:var(--ep-focus-ring)}
[data-theme="dark"] .ep-topbar-btn{background:#1f2937;color:#e2e8f0}
[data-theme="dark"] .ep-topbar-btn:hover{background:#334155}
.ep-list-host{position:relative}
.ep-mobile-cards{display:none;flex-direction:column;gap:10px;padding:10px}
.ep-mcard{
  background:var(--ep-color-surface);border:1px solid var(--ep-color-border);
  border-radius:var(--ep-radius-md);padding:12px 14px;box-shadow:var(--ep-shadow-sm);
}
.ep-mcard-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.ep-mcard-head h4{margin:0;font-size:14px;font-weight:800;color:var(--ep-color-text)}
.ep-mcard-meta{display:flex;justify-content:space-between;gap:8px;font-size:11px;padding:4px 0;border-top:1px dashed var(--ep-color-border)}
.ep-mcard-meta span{color:var(--ep-color-text-muted)}
.ep-mcard-meta strong{color:var(--ep-color-text);font-weight:600;text-align:end}
.ep-mcard-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.ep-mcard-actions .btn,.ep-mcard-actions button{min-height:36px}
@media (max-width:900px){
  .ep-hide-mobile{display:none!important}
  .ep-mobile-cards.ep-hide-desktop{display:flex!important}
  .ep-list-host table.ep-hide-mobile{display:none!important}
}
@media (min-width:901px){
  .ep-hide-desktop{display:none!important}
}

/* Theme-aware admin body surfaces */
[data-theme="dark"] body{background:var(--ep-color-bg);color:var(--ep-color-text)}
[data-theme="dark"] .topbar,
[data-theme="dark"] .tcard,
[data-theme="dark"] .content,
[data-theme="dark"] .tab-panel{background:var(--ep-color-bg);color:var(--ep-color-text)}
[data-theme="dark"] .topbar{background:var(--ep-color-surface);border-bottom:1px solid var(--ep-color-border)}
[data-theme="dark"] .tcard{background:var(--ep-color-surface);border-color:var(--ep-color-border)}
[data-theme="dark"] table th{background:var(--ep-color-surface-2);color:var(--ep-color-text-muted)}
[data-theme="dark"] table td{border-color:var(--ep-color-border);color:var(--ep-color-text)}
[data-theme="dark"] .form-input,.toolbar input,.toolbar select,
[data-theme="dark"] input[type="text"],[data-theme="dark"] input[type="search"],
[data-theme="dark"] select,[data-theme="dark"] textarea{
  background:var(--ep-color-surface-2);color:var(--ep-color-text);border-color:var(--ep-color-border);
}
[data-theme="dark"] .btn-secondary{background:var(--ep-color-surface-2);color:var(--ep-color-text);border-color:var(--ep-color-border)}
[data-theme="dark"] .mon-section,[data-theme="dark"] .mon-card{background:var(--ep-color-surface);border-color:var(--ep-color-border);color:var(--ep-color-text)}
[data-theme="dark"] .topbar-bell{background:var(--ep-color-surface-2);color:var(--ep-color-text)}
[data-theme="dark"] .topbar-date,[data-theme="dark"] .topbar-time{color:var(--ep-color-text-muted)}
[data-theme="dark"] h1,[data-theme="dark"] h2,[data-theme="dark"] h3{color:var(--ep-color-text)}

/* ═══════════════════════════════════════════════════════════
   M2 Enterprise Operations — components (charts, metrics, grid)
   ═══════════════════════════════════════════════════════════ */
.ep-metric-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;
}
.ep-metric-card{
  background:var(--ep-color-surface);border:1px solid var(--ep-color-border);
  border-radius:var(--ep-radius-md);padding:14px 16px;box-shadow:var(--ep-shadow-sm);
  display:flex;flex-direction:column;gap:6px;min-height:96px;
}
.ep-metric-card .ep-metric-label{
  font-size:11px;font-weight:700;color:var(--ep-color-text-muted);letter-spacing:.02em;
}
.ep-metric-card .ep-metric-value{
  font-size:22px;font-weight:800;color:var(--ep-color-text);line-height:1.15;font-variant-numeric:tabular-nums;
  direction:ltr;text-align:start;
}
.ep-metric-card .ep-metric-unit{font-size:11px;color:var(--ep-color-text-subtle);font-weight:600}
.ep-metric-card .ep-metric-def{font-size:10px;color:var(--ep-color-text-subtle);line-height:1.35;margin-top:auto}
.ep-metric-card[data-tone="ok"]{border-color:color-mix(in srgb,var(--ep-color-success) 35%,var(--ep-color-border))}
.ep-metric-card[data-tone="warn"]{border-color:color-mix(in srgb,var(--ep-color-warning) 40%,var(--ep-color-border));background:var(--ep-color-warning-soft)}
.ep-metric-card[data-tone="bad"]{border-color:color-mix(in srgb,var(--ep-color-danger) 40%,var(--ep-color-border));background:var(--ep-color-danger-soft)}
.ep-metric-card[data-tone="info"]{border-color:color-mix(in srgb,var(--ep-color-info) 30%,var(--ep-color-border))}
.ep-metric-card[data-state="unavailable"] .ep-metric-value{font-size:13px;font-weight:700;color:var(--ep-color-text-muted)}
.ep-metric-card[data-state="empty"] .ep-metric-value{color:var(--ep-color-text-subtle)}

.ep-chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:16px}
.ep-chart-card{
  background:var(--ep-color-surface);border:1px solid var(--ep-color-border);
  border-radius:var(--ep-radius-md);padding:14px 16px;box-shadow:var(--ep-shadow-sm);
}
.ep-chart-card h3{margin:0 0 4px;font-size:13px;font-weight:800}
.ep-chart-card .ep-chart-sub{margin:0 0 10px;font-size:11px;color:var(--ep-color-text-muted)}
.ep-chart-canvas-wrap{position:relative;height:200px}
.ep-bars{display:flex;align-items:flex-end;gap:4px;height:160px;padding-top:8px}
.ep-bar{
  flex:1;min-width:6px;background:var(--ep-color-primary);border-radius:4px 4px 0 0;opacity:.85;
  position:relative;
}
.ep-bar:hover{opacity:1}
.ep-bar-labels{display:flex;gap:4px;margin-top:4px}
.ep-bar-labels span{flex:1;font-size:9px;color:var(--ep-color-text-subtle);text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.ep-tabs{display:flex;flex-wrap:wrap;gap:6px;border-bottom:1px solid var(--ep-color-border);padding-bottom:8px;margin-bottom:14px}
.ep-tab{
  border:1px solid transparent;background:transparent;color:var(--ep-color-text-muted);
  padding:8px 12px;border-radius:999px;font-size:12px;font-weight:700;cursor:pointer;
  font-family:inherit;
}
.ep-tab:hover{background:var(--ep-color-surface-2);color:var(--ep-color-text)}
.ep-tab[aria-selected="true"]{
  background:var(--ep-color-primary-soft);color:var(--ep-color-primary);border-color:color-mix(in srgb,var(--ep-color-primary) 25%,transparent);
}
.ep-tab:focus-visible{outline:none;box-shadow:var(--ep-focus-ring)}

.ep-timeline{display:flex;flex-direction:column;gap:0;position:relative;padding-inline-start:18px}
.ep-timeline::before{
  content:"";position:absolute;inset-inline-start:5px;top:4px;bottom:4px;width:2px;background:var(--ep-color-border);
}
.ep-timeline-item{position:relative;padding:10px 0 10px 12px;border-bottom:1px dashed var(--ep-color-border)}
.ep-timeline-item::before{
  content:"";position:absolute;inset-inline-start:-16px;top:16px;width:10px;height:10px;border-radius:50%;
  background:var(--ep-color-primary);border:2px solid var(--ep-color-surface);box-shadow:0 0 0 1px var(--ep-color-border);
}
.ep-timeline-item[data-ok="false"]::before{background:var(--ep-color-danger)}
.ep-timeline-item[data-ok="true"]::before{background:var(--ep-color-success)}
.ep-timeline-meta{font-size:11px;color:var(--ep-color-text-muted);display:flex;flex-wrap:wrap;gap:8px}
.ep-timeline-title{font-size:13px;font-weight:700;color:var(--ep-color-text);margin:2px 0}
.ep-timeline-body{font-size:12px;color:var(--ep-color-text-muted);word-break:break-word}

.ep-activity-feed{display:flex;flex-direction:column;gap:8px}
.ep-activity-row{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:start;
  padding:10px 12px;border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-sm);
  background:var(--ep-color-surface);
}
.ep-activity-badge{
  font-size:10px;font-weight:800;padding:3px 7px;border-radius:999px;background:var(--ep-color-primary-soft);color:var(--ep-color-primary);
  white-space:nowrap;
}

.ep-data-grid{width:100%;border-collapse:collapse;font-size:12px}
.ep-data-grid th,.ep-data-grid td{padding:9px 10px;border-bottom:1px solid var(--ep-color-border);text-align:start;vertical-align:top}
.ep-data-grid th{background:var(--ep-color-surface-2);font-weight:700;color:var(--ep-color-text-muted);position:sticky;top:0;z-index:1}
.ep-data-grid tr:hover td{background:var(--ep-color-surface-2)}
.ep-data-grid-wrap{overflow:auto;max-height:480px;border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-md);background:var(--ep-color-surface)}

.ep-side-sheet{
  position:fixed;inset-block:0;inset-inline-end:0;width:min(420px,100vw);z-index:1280;
  background:var(--ep-color-surface);border-inline-start:1px solid var(--ep-color-border);
  box-shadow:var(--ep-shadow-lg);transform:translateX(110%);transition:transform var(--ep-motion);
  display:flex;flex-direction:column;
}
[dir="rtl"] .ep-side-sheet{transform:translateX(-110%)}
.ep-side-sheet[data-open="true"]{transform:translateX(0)}
.ep-side-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--ep-color-border)}
.ep-side-sheet-body{padding:14px 16px;overflow:auto;flex:1}

.ep-inspector{border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-md);background:var(--ep-color-surface);padding:12px}
.ep-inspector dt{font-size:10px;font-weight:700;color:var(--ep-color-text-muted);margin-top:8px}
.ep-inspector dd{margin:2px 0 0;font-size:12px;color:var(--ep-color-text);word-break:break-word}

.ep-split{display:grid;grid-template-columns:1fr 320px;gap:14px}
@media (max-width:1000px){.ep-split{grid-template-columns:1fr}}

.ep-stepper{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.ep-step{
  display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--ep-color-text-muted);
  padding:6px 10px;border-radius:999px;border:1px solid var(--ep-color-border);background:var(--ep-color-surface);
}
.ep-step[data-active="true"]{color:var(--ep-color-primary);border-color:var(--ep-color-primary);background:var(--ep-color-primary-soft)}
.ep-step[data-done="true"]{color:var(--ep-color-success)}

.ep-wizard{border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-lg);background:var(--ep-color-surface);padding:16px}
.ep-tree{list-style:none;margin:0;padding:0}
.ep-tree ul{list-style:none;margin:0;padding-inline-start:16px;border-inline-start:1px dashed var(--ep-color-border)}
.ep-tree li{padding:4px 0;font-size:12px}

.ep-ops-root{padding:4px 2px 24px;dir:rtl}
.ep-ops-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.ep-ops-head h2{margin:0;font-size:20px;font-weight:800}
.ep-ops-eyebrow{display:block;font-size:11px;font-weight:800;color:var(--ep-color-primary);letter-spacing:.04em;margin-bottom:4px}
.ep-ops-sub{margin:4px 0 0;font-size:12px;color:var(--ep-color-text-muted);max-width:640px;line-height:1.5}
.ep-ops-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ep-ops-search{
  min-width:220px;flex:1;max-width:420px;height:38px;border:1px solid var(--ep-color-border);
  border-radius:10px;padding:0 12px;font-family:inherit;font-size:13px;background:var(--ep-color-surface);color:var(--ep-color-text);
}
.ep-ops-search:focus{outline:none;box-shadow:var(--ep-focus-ring);border-color:var(--ep-color-primary)}
.ep-ops-panel{display:none}
.ep-ops-panel[data-active="true"]{display:block}
.ep-ops-linkrow{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.ep-ops-chip{
  display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;
  border:1px solid var(--ep-color-border);background:var(--ep-color-surface);font-size:12px;font-weight:700;
  color:var(--ep-color-text);cursor:pointer;font-family:inherit;text-decoration:none;
}
.ep-ops-chip:hover{border-color:var(--ep-color-primary);color:var(--ep-color-primary)}
.ep-search-hits{display:flex;flex-direction:column;gap:8px}
.ep-search-hit{
  display:flex;justify-content:space-between;gap:10px;padding:12px 14px;
  border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-md);background:var(--ep-color-surface);cursor:pointer;
}
.ep-search-hit:hover{border-color:var(--ep-color-primary)}
.ep-search-hit h4{margin:0;font-size:13px;font-weight:800}
.ep-search-hit p{margin:2px 0 0;font-size:11px;color:var(--ep-color-text-muted)}
.ep-entity-tag{
  font-size:10px;font-weight:800;padding:2px 8px;border-radius:999px;background:var(--ep-color-surface-2);color:var(--ep-color-text-muted);height:fit-content;
}
.ep-high-contrast body,.ep-hc{
  /* opt-in high contrast via html.ep-hc */
}
html.ep-hc{
  --ep-color-border:#000;
  --ep-color-text:#000;
  --ep-color-text-muted:#111;
  --ep-color-primary:#0000cc;
  --ep-color-bg:#fff;
  --ep-color-surface:#fff;
}
html.ep-hc[data-theme="dark"]{
  --ep-color-border:#fff;
  --ep-color-text:#fff;
  --ep-color-text-muted:#eee;
  --ep-color-primary:#9cf;
  --ep-color-bg:#000;
  --ep-color-surface:#000;
}

/* ═══════════════════════════════════════════════════════════
   M3 Visual Intelligence
   ═══════════════════════════════════════════════════════════ */
.ep-vi-root{padding:2px 0 28px}
.ep-vi-body{display:flex;flex-direction:column;gap:16px}
.ep-vi-section{margin-top:4px}
.ep-vi-section-title{margin:0 0 10px;font-size:14px;font-weight:800;color:var(--ep-color-text)}
.ep-vi-summary{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;
}
.ep-vi-summary-card{
  background:linear-gradient(145deg,var(--ep-color-surface),var(--ep-color-surface-2));
  border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-md);
  padding:14px 16px;box-shadow:var(--ep-shadow-sm);display:flex;flex-direction:column;gap:4px;
}
.ep-vi-summary-card span{font-size:11px;font-weight:700;color:var(--ep-color-text-muted)}
.ep-vi-summary-card strong{font-size:20px;font-weight:800;color:var(--ep-color-text);direction:ltr}
.ep-vi-summary-card small{font-size:11px;font-weight:700;color:var(--ep-color-primary)}
.ep-vi-insights{display:flex;flex-direction:column;gap:8px}
.ep-vi-insights-title{font-size:12px;font-weight:800;color:var(--ep-color-primary);letter-spacing:.03em}
.ep-vi-insight{
  border:1px solid var(--ep-color-border);border-radius:var(--ep-radius-md);
  padding:10px 12px;background:var(--ep-color-surface);display:flex;flex-direction:column;gap:4px;
  border-inline-start:4px solid var(--ep-color-info);
}
.ep-vi-insight strong{font-size:13px;font-weight:700;line-height:1.45}
.ep-vi-insight-positive{border-inline-start-color:var(--ep-color-success);background:var(--ep-color-success-soft)}
.ep-vi-insight-warning{border-inline-start-color:var(--ep-color-warning);background:var(--ep-color-warning-soft)}
.ep-vi-insight-critical{border-inline-start-color:var(--ep-color-danger);background:var(--ep-color-danger-soft)}
.ep-vi-insight-info{border-inline-start-color:var(--ep-color-info)}
.ep-vi-kpi-grid{margin-top:4px}
.ep-vi-kpi-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.ep-vi-kpi-click{cursor:pointer;transition:transform var(--ep-motion),box-shadow var(--ep-motion)}
.ep-vi-kpi-click:hover{box-shadow:var(--ep-shadow-md);transform:translateY(-1px)}
.ep-vi-kpi-click:focus-visible{outline:none;box-shadow:var(--ep-focus-ring)}
.ep-vi-trend{font-size:11px;font-weight:800;padding:2px 6px;border-radius:999px}
.ep-vi-trend-up{color:var(--ep-color-success);background:var(--ep-color-success-soft)}
.ep-vi-trend-down{color:var(--ep-color-danger);background:var(--ep-color-danger-soft)}
.ep-vi-trend-flat{color:var(--ep-color-text-muted);background:var(--ep-color-surface-2)}
.ep-vi-spark-host{margin-top:4px;min-height:28px}
.ep-vi-spark{width:96px;height:28px;display:block}
.ep-currency-badge{
  display:inline-flex;align-items:center;padding:1px 6px;border-radius:999px;
  font-size:9px;font-weight:800;background:var(--ep-color-primary-soft);color:var(--ep-color-primary);
  vertical-align:middle;margin-inline-start:4px;
}
.ep-vi-chart{position:relative}
.ep-vi-chart-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px}
.ep-vi-chart-head h3{margin:0;font-size:13px;font-weight:800}
.ep-vi-chart-actions{display:flex;gap:4px}
.ep-vi-empty{
  padding:28px 16px;text-align:center;color:var(--ep-color-text-muted);font-size:12px;
  border:1px dashed var(--ep-color-border);border-radius:var(--ep-radius-md);background:var(--ep-color-surface-2);
}
.ep-vi-gauge{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px}
.ep-vi-gauge-ring{
  --p:0;width:120px;height:120px;border-radius:50%;
  background:conic-gradient(var(--ep-color-primary) calc(var(--p)*1%),var(--ep-color-border) 0);
  display:grid;place-items:center;position:relative;
}
.ep-vi-gauge-ring::before{
  content:"";position:absolute;inset:12px;border-radius:50%;background:var(--ep-color-surface);
}
.ep-vi-gauge-ring span{position:relative;z-index:1;font-size:18px;font-weight:800}
.ep-vi-dash-banner{
  margin:0 0 14px;padding:14px 16px;border-radius:var(--ep-radius-lg);
  border:1px solid color-mix(in srgb,var(--ep-color-primary) 30%,var(--ep-color-border));
  background:linear-gradient(120deg,var(--ep-color-primary-soft),var(--ep-color-surface));
  box-shadow:var(--ep-shadow-sm);
}
.ep-vi-banner-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.ep-vi-banner-inner p{margin:4px 0 0;font-size:12px;color:var(--ep-color-text-muted)}
.ep-vi-banner-inner strong{font-size:15px}
@media print{
  .sidebar,.topbar,.ep-env-strip,.ep-ops-toolbar,.ep-tabs{display:none!important}
  .ep-vi-root,.content,.main{padding:0!important;background:#fff!important}
  .ep-chart-card,.ep-metric-card{break-inside:avoid;box-shadow:none!important}
}
@media (prefers-reduced-motion:reduce){
  .ep-vi-kpi-click{transition:none}
}
html.ep-hc .ep-vi-insight{border-width:2px}
html.ep-hc .ep-vi-trend{border:1px solid currentColor}
