/* Aurora Operations: shared visual and interaction layer. */
:root {
  color-scheme: light;
  --ao-canvas-base: #f6f7fb;
  --ao-canvas-deep: #eef1f8;
  --ao-surface-1: rgba(255, 255, 255, .92);
  --ao-surface-2: rgba(249, 250, 253, .96);
  --ao-surface-3: #f1f3f8;
  --ao-surface-hover: #f7f8fc;
  --ao-text-primary: #11131a;
  --ao-text-secondary: #5f6675;
  --ao-text-tertiary: #8b93a3;
  --ao-text-disabled: #a8afbc;
  --ao-border-subtle: #e1e5ed;
  --ao-border-strong: #cfd5e1;
  --ao-divider: #e9ecf2;
  --ao-focus-ring: rgba(91, 92, 226, .18);
  --ao-indigo-700: #4338ca;
  --ao-indigo-600: #4f46e5;
  --ao-indigo-500: #5b5ce2;
  --ao-indigo-400: #818cf8;
  --ao-violet-600: #7c3aed;
  --ao-violet-500: #8b5cf6;
  --ao-blue-500: #3b82f6;
  --ao-cyan-500: #14b8a6;
  --ao-cyan-400: #2dd4bf;
  --ao-success: #10b981;
  --ao-info: #3b82f6;
  --ao-warning: #f59e0b;
  --ao-danger: #ef4444;
  --ao-neutral: #64748b;
  --ao-brand-gradient: linear-gradient(135deg, #4f46e5 0%, #7c3aed 58%, #3b82f6 100%);
  --ao-text-gradient: linear-gradient(100deg, #4f46e5 0%, #7c3aed 48%, #0ea5e9 100%);
  --ao-card-gradient: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(249,250,253,.92) 100%);
  --ao-shadow-rest: 0 1px 2px rgba(17,19,26,.04), 0 8px 24px rgba(76,86,110,.04);
  --ao-shadow-raised: 0 2px 6px rgba(17,19,26,.06), 0 16px 36px rgba(76,86,110,.10);
  --ao-space-1: 4px;
  --ao-space-2: 8px;
  --ao-space-3: 12px;
  --ao-space-4: 16px;
  --ao-space-5: 20px;
  --ao-space-6: 24px;
  --ao-space-7: 32px;
  --ao-space-8: 40px;
  --ao-space-9: 48px;
  --ao-space-10: 64px;
  --ao-radius-control: 8px;
  --ao-radius-row: 10px;
  --ao-radius-card: 12px;
  --ao-radius-panel: 16px;
  --ao-radius-hero: 20px;
  --ao-ease: cubic-bezier(.4, 0, .2, 1);
  --ao-duration-fast: 150ms;
  --ao-duration: 220ms;
  --ao-z-shell: 60;
  --ao-z-menu: 80;
  --ao-z-drawer: 100;
  --ao-z-dialog: 130;
  --ao-z-toast: 150;
  --bg: var(--ao-canvas-base);
  --bg2: var(--ao-surface-3);
  --card: var(--ao-surface-1);
  --card2: var(--ao-surface-2);
  --text: var(--ao-text-primary);
  --muted: var(--ao-text-secondary);
  --border: var(--ao-border-subtle);
  --border2: var(--ao-border-strong);
  --accent: var(--ao-indigo-600);
  --accent2: var(--ao-cyan-500);
  --green: var(--ao-success);
  --yellow: var(--ao-warning);
  --red: var(--ao-danger);
  --shadow: var(--ao-shadow-rest);
  --focus-ring: 0 0 0 4px var(--ao-focus-ring);
}

[data-theme="dark"] {
  color-scheme: dark;
  --ao-canvas-base: #090b12;
  --ao-canvas-deep: #0c1019;
  --ao-surface-1: rgba(17, 21, 32, .94);
  --ao-surface-2: rgba(22, 27, 40, .96);
  --ao-surface-3: #1b2130;
  --ao-surface-hover: #1e2535;
  --ao-text-primary: #f5f7fb;
  --ao-text-secondary: #a9b0bf;
  --ao-text-tertiary: #7d8698;
  --ao-text-disabled: #5c6474;
  --ao-border-subtle: #242b3b;
  --ao-border-strong: #343d50;
  --ao-divider: #202736;
  --ao-focus-ring: rgba(129, 140, 248, .22);
  --ao-card-gradient: linear-gradient(180deg, rgba(22,27,40,.96) 0%, rgba(17,21,32,.94) 100%);
  --ao-shadow-rest: 0 1px 2px rgba(0,0,0,.32), 0 10px 28px rgba(0,0,0,.22);
  --ao-shadow-raised: 0 4px 16px rgba(0,0,0,.40), 0 18px 48px rgba(79,70,229,.12);
  --bg: var(--ao-canvas-base);
  --bg2: var(--ao-surface-3);
  --card: var(--ao-surface-1);
  --card2: var(--ao-surface-2);
  --text: var(--ao-text-primary);
  --muted: var(--ao-text-secondary);
  --border: var(--ao-border-subtle);
  --border2: var(--ao-border-strong);
}

html { max-width: 100%; overflow-x: clip; background: var(--ao-canvas-base); }
body {
  min-width: 320px;
  max-width: 100%;
  overflow-x: clip;
  color: var(--ao-text-primary);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background-color: var(--ao-canvas-base);
  background-image:
    radial-gradient(circle at 10% -8%, rgba(79,70,229,.16) 0%, rgba(79,70,229,0) 34%),
    radial-gradient(circle at 92% 2%, rgba(124,58,237,.12) 0%, rgba(124,58,237,0) 30%),
    radial-gradient(circle at 52% 108%, rgba(20,184,166,.08) 0%, rgba(20,184,166,0) 34%),
    linear-gradient(180deg, rgba(255,255,255,.54) 0%, rgba(246,247,251,.90) 54%, rgba(238,241,248,.82) 100%);
}
[data-theme="dark"] body {
  background-image:
    radial-gradient(circle at 12% -6%, rgba(79,70,229,.24) 0%, rgba(79,70,229,0) 34%),
    radial-gradient(circle at 90% 0%, rgba(124,58,237,.18) 0%, rgba(124,58,237,0) 28%),
    radial-gradient(circle at 50% 108%, rgba(20,184,166,.10) 0%, rgba(20,184,166,0) 34%),
    linear-gradient(180deg, rgba(9,11,18,.70) 0%, rgba(9,11,18,.96) 48%, rgba(12,16,25,.98) 100%);
}
body.ao-atmosphere-subtle { background-image: linear-gradient(180deg, var(--ao-canvas-base), var(--ao-canvas-deep)); }
body.ao-atmosphere-off { background: var(--ao-canvas-base); }
html[lang="ar"] body {
  font-family: "IBM Plex Sans Arabic", Tahoma, "Segoe UI", Arial, sans-serif;
  line-height: 1.65;
}
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3, html[lang="ar"] .logo-copy strong {
  font-family: "Noto Kufi Arabic", "IBM Plex Sans Arabic", Tahoma, sans-serif;
  letter-spacing: 0;
}
.mono, .num, .metric-value, .target-value, .kpi .value, .keybadge, [data-numeric] {
  direction: ltr;
  unicode-bidi: isolate;
  font-family: "Geist Mono", "Cascadia Mono", Consolas, monospace;
  font-variant-numeric: tabular-nums;
}

#topbar {
  height: 64px;
  padding-inline: 16px;
  gap: 12px;
  position: sticky;
  inset-block-start: 0;
  z-index: var(--ao-z-shell);
  background: rgba(11, 14, 23, .88);
  border: 0;
  border-block-end: 1px solid rgba(129,140,248,.18);
  color: #f5f7fb;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 rgba(255,255,255,.03);
}
#topbar::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(91,92,226,.62), rgba(45,212,191,.38), transparent);
}
#topbar.ao-scrolled { box-shadow: 0 10px 28px rgba(5,7,12,.20); }
#topbar .logo { width: 232px; min-width: 232px; gap: 10px; transition: width var(--ao-duration) var(--ao-ease), min-width var(--ao-duration) var(--ao-ease); }
#topbar .logo-mark { width: 38px; height: 38px; display: grid; place-items: center; padding: 3px; border: 1px solid rgba(129,140,248,.26); border-radius: 10px; background: linear-gradient(145deg, rgba(79,70,229,.22), rgba(20,184,166,.10)); }
#topbar .logo-mark svg { width: 30px; height: 30px; margin: 0; }
#topbar .logo-copy strong, #topbar .topbar-context strong { color: #f8fafc; }
#topbar .logo-copy small, #topbar .topbar-context span { color: #98a2b3; }
#topbar .topbar-context { min-width: 0; padding-inline-start: 0; border: 0; }
#topbar .topbar-context span::after { color: #4b5567; }
#topbar .language-btn, #topbar .icon-btn, .ao-command-trigger {
  min-width: 38px;
  height: 38px;
  border: 1px solid #343d50;
  border-radius: 8px;
  background: rgba(255,255,255,.03);
  color: #dce3ea;
}
#topbar .language-btn:hover, #topbar .icon-btn:hover, .ao-command-trigger:hover { background: #1e2535; border-color: #4c5770; color: #fff; }
#topbar .mission-chip { margin-inline-start: 4px; background: rgba(16,185,129,.12); border: 1px solid rgba(16,185,129,.30); color: #7ee7bd; }
.ao-command-trigger { display: inline-flex; align-items: center; gap: 8px; padding: 0 11px; font: 600 12px/1 Inter, sans-serif; }
.ao-command-trigger > svg { width: 16px; height: 16px; flex: 0 0 16px; }
.ao-command-trigger kbd { color: #8993a6; font: 500 10px/1 "Geist Mono", monospace; }
.ao-top-new { min-height: 38px !important; white-space: nowrap; }

#layout {
  grid-template-columns: 248px minmax(0, 1fr);
  min-width: 0;
  height: calc(100vh - 64px);
  background: transparent;
  transition: grid-template-columns var(--ao-duration) var(--ao-ease);
}
body.has-right #layout { grid-template-columns: 248px minmax(0, 1fr) 324px; }
#sidebar {
  min-width: 0;
  padding: 16px 12px;
  gap: 4px;
  overflow-x: hidden;
  background: color-mix(in srgb, var(--ao-surface-1) 94%, transparent);
  border-inline-end: 1px solid var(--ao-border-subtle);
  box-shadow: inset -1px 0 0 rgba(255,255,255,.02);
}
[data-theme="dark"] #sidebar { background: rgba(13,17,27,.94); }
.nav-btn {
  min-height: 42px;
  gap: 11px;
  padding: 9px 11px;
  border-radius: 10px;
  color: var(--ao-text-secondary);
  transition: color var(--ao-duration-fast) var(--ao-ease), background var(--ao-duration-fast) var(--ao-ease), transform var(--ao-duration-fast) var(--ao-ease);
}
.nav-btn:hover { color: var(--ao-text-primary); background: rgba(91,92,226,.07); text-decoration: none; }
.nav-btn.active { color: var(--ao-indigo-600); background: rgba(91,92,226,.10); box-shadow: inset 2px 0 0 var(--ao-indigo-500); }
html[dir="rtl"] .nav-btn.active { box-shadow: inset -2px 0 0 var(--ao-indigo-500); }
[data-theme="dark"] .nav-btn.active { color: #c3c8ff; background: rgba(129,140,248,.12); }
.nav-btn.nav-primary { color: #fff; background: var(--ao-brand-gradient); box-shadow: 0 8px 20px rgba(79,70,229,.18); }
.nav-btn.nav-primary:hover { transform: translateY(-1px); filter: brightness(1.06); }
.sb-section > summary { color: var(--ao-text-tertiary); }
.sb-footer-note { margin-top: auto; border-radius: 12px; background: rgba(91,92,226,.08); border: 1px solid rgba(91,92,226,.17); }
.ao-nav-collapse { margin: 0 0 8px; justify-content: center; border: 1px solid var(--ao-divider); background: var(--ao-surface-2); }
body.ao-nav-collapsed #layout { grid-template-columns: 76px minmax(0, 1fr); }
body.ao-nav-collapsed.has-right #layout { grid-template-columns: 76px minmax(0, 1fr) 324px; }
body.ao-nav-collapsed #topbar .logo { width: 52px; min-width: 52px; }
body.ao-nav-collapsed #topbar .logo-copy { display: none; }
body.ao-nav-collapsed #sidebar { padding-inline: 10px; }
body.ao-nav-collapsed #sidebar .nav-btn > span:not(.ico), body.ao-nav-collapsed #sidebar .sb-section > summary, body.ao-nav-collapsed #sidebar .nav-sub, body.ao-nav-collapsed #sidebar .sb-footer-note { display: none; }
body.ao-nav-collapsed #sidebar .nav-btn { justify-content: center; padding-inline: 8px; }

#main {
  min-width: 0;
  contain: inline-size;
  padding: 32px 32px calc(64px + env(safe-area-inset-bottom));
  overflow-x: clip;
  background: transparent !important;
  background-image: none !important;
}
#main > * { width: 100%; max-width: 1440px; margin-inline: auto; }
#main.ao-page-enter > * { animation: ao-page-in 200ms var(--ao-ease) both; }
html[dir="rtl"] #main.ao-page-enter > * { animation-name: ao-page-in-rtl; }
@keyframes ao-page-in { from { opacity: 0; transform: translateX(4px); } to { opacity: 1; transform: none; } }
@keyframes ao-page-in-rtl { from { opacity: 0; transform: translateX(-4px); } to { opacity: 1; transform: none; } }

.card, .AppSurface, .settings-panel-block, .ops-shell > .card {
  border: 1px solid var(--ao-border-subtle);
  border-radius: var(--ao-radius-card);
  background: var(--ao-card-gradient);
  box-shadow: var(--ao-shadow-rest);
}
.card.interactive, .AppSurface[data-interactive="true"] { transition: transform var(--ao-duration-fast) var(--ao-ease), border-color var(--ao-duration-fast), box-shadow var(--ao-duration-fast); }
.card.interactive:hover, .AppSurface[data-interactive="true"]:hover { transform: translateY(-1px); border-color: var(--ao-border-strong); box-shadow: var(--ao-shadow-raised); }
.card h3, .settings-panel-head b { font-size: 16px; line-height: 1.35; font-weight: 600; }
.muted { color: var(--ao-text-secondary); }
.page-kicker, .card-kicker { color: var(--ao-indigo-600); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
html[lang="ar"] .page-kicker, html[lang="ar"] .card-kicker { letter-spacing: 0; text-transform: none; }

.btn {
  min-height: 40px;
  padding: 0 14px;
  border-radius: var(--ao-radius-control);
  border: 1px solid var(--ao-border-strong);
  background: var(--ao-surface-2);
  color: var(--ao-text-primary);
  font-size: 14px;
  font-weight: 600;
  transition: transform var(--ao-duration-fast) var(--ao-ease), filter var(--ao-duration-fast), box-shadow var(--ao-duration-fast), border-color var(--ao-duration-fast), background var(--ao-duration-fast);
}
.btn:hover { border-color: rgba(91,92,226,.45); background: rgba(91,92,226,.06); text-decoration: none; }
.btn:active { transform: scale(.99); }
.btn.primary { color: #fff; border-color: transparent; background: var(--ao-brand-gradient); box-shadow: 0 8px 18px rgba(79,70,229,.20); }
.btn.primary:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 12px 24px rgba(79,70,229,.26); }
.btn.danger { color: var(--ao-danger); border-color: rgba(239,68,68,.28); background: rgba(239,68,68,.07); }
.btn.small { min-height: 34px; padding-inline: 11px; font-size: 12px; }
.icon-btn, button, [role="button"] { touch-action: manipulation; }

input, textarea, select {
  min-height: 40px;
  border: 1px solid var(--ao-border-subtle);
  border-radius: var(--ao-radius-control);
  background: var(--ao-surface-2);
  color: var(--ao-text-primary);
  transition: border-color var(--ao-duration-fast), box-shadow var(--ao-duration-fast), background var(--ao-duration-fast);
}
input:hover, textarea:hover, select:hover { border-color: var(--ao-border-strong); }
input:focus, textarea:focus, select:focus { border-color: var(--ao-indigo-500); box-shadow: 0 0 0 4px var(--ao-focus-ring); }
input::placeholder, textarea::placeholder { color: var(--ao-text-tertiary); }
textarea { resize: vertical; }
.field > label { color: var(--ao-text-secondary); font-weight: 600; }
.switchline input[type="checkbox"] { accent-color: var(--ao-indigo-600); }

.badge, .chip, .ops-pill, .keybadge, .system-status {
  border-radius: 999px;
  border: 1px solid var(--ao-border-subtle);
  background: rgba(100,116,139,.09);
  color: var(--ao-text-secondary);
  font-weight: 600;
}
.ops-pill.ok, .keybadge.ok, .cost-good, .chip.completed { color: #047857; border-color: rgba(16,185,129,.30); background: rgba(16,185,129,.11); }
[data-theme="dark"] .ops-pill.ok, [data-theme="dark"] .keybadge.ok, [data-theme="dark"] .cost-good, [data-theme="dark"] .chip.completed { color: #6ee7b7; }
.ops-pill.warn, .cost-warn, .chip.partial, .chip.awaiting_approval { color: #b45309; border-color: rgba(245,158,11,.32); background: rgba(245,158,11,.12); }
[data-theme="dark"] .ops-pill.warn, [data-theme="dark"] .cost-warn, [data-theme="dark"] .chip.partial, [data-theme="dark"] .chip.awaiting_approval { color: #fbbf24; }
.keybadge.miss, .cost-high, .chip.failed, .chip.interrupted { color: #b91c1c; border-color: rgba(239,68,68,.30); background: rgba(239,68,68,.10); }
[data-theme="dark"] .keybadge.miss, [data-theme="dark"] .cost-high, [data-theme="dark"] .chip.failed, [data-theme="dark"] .chip.interrupted { color: #fca5a5; }
.chip.running { color: #1d4ed8; border-color: rgba(59,130,246,.30); background: rgba(59,130,246,.10); }

table.list { width: 100%; border-collapse: separate; border-spacing: 0; }
table.list th {
  position: sticky;
  inset-block-start: 0;
  z-index: 2;
  min-height: 44px;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--ao-surface-3) 88%, transparent);
  color: var(--ao-text-tertiary);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-block-end: 1px solid var(--ao-divider);
}
html[lang="ar"] table.list th { letter-spacing: 0; text-transform: none; }
table.list td { padding: 13px 14px; border-block-end: 1px solid var(--ao-divider); vertical-align: middle; }
table.list tbody tr { transition: background var(--ao-duration-fast), box-shadow var(--ao-duration-fast); }
table.list tbody tr:hover { background: rgba(91,92,226,.045); }
table.list tbody tr:focus-visible { outline: 2px solid var(--ao-indigo-500); outline-offset: -2px; }

.route-page-head, .ops-page-head, .setup-head, .route-settings > :first-child, .route-skills > :first-child {
  min-height: 132px;
  padding: 24px 28px;
  margin: 0 auto 24px !important;
  border: 1px solid rgba(91,92,226,.16);
  border-radius: var(--ao-radius-panel) !important;
  color: var(--ao-text-primary);
  background:
    radial-gradient(circle at 92% 0%, rgba(124,58,237,.13), transparent 36%),
    radial-gradient(circle at 8% 120%, rgba(20,184,166,.08), transparent 34%),
    var(--ao-card-gradient);
  box-shadow: var(--ao-shadow-rest) !important;
}
.route-page-head::after, .ops-page-head::after, .setup-head::after, .route-settings > :first-child::after, .route-skills > :first-child::after { display: none; }
.route-page-head h2, .ops-page-head h2, .setup-head h2, .route-settings > :first-child h2, .route-skills > :first-child h2 { color: var(--ao-text-primary); font-size: 30px; line-height: 1.15; }
.route-page-head p, .ops-page-head p, .setup-head .setup-sub, .route-settings > :first-child .muted, .route-skills > :first-child .muted { color: var(--ao-text-secondary); }
.route-page-head .badge { color: var(--ao-indigo-600); border-color: rgba(91,92,226,.24); background: rgba(91,92,226,.08); }

.route-dashboard > .workspace-hero,
.route-dashboard > .metric-row,
.route-dashboard > .dashboard-grid,
.route-sessions > .session-toolbar,
.route-sessions > .session-table,
.route-arena > .kpi-grid,
.route-arena > .arena-tabs,
.route-arena > .arena-workspace,
.route-leaderboard > .kpi-grid,
.route-leaderboard > .arena-tabs,
.route-leaderboard > .leaderboard-workspace,
.route-model-ops > .arena-tabs,
.route-model-ops > .ops-shell,
.route-model-ops > .card,
.route-settings > .settings-jump,
.route-settings > .card,
.route-settings > .grid2,
.route-skills > .card,
.route-skills > .arena-tabs,
.route-skills > #sk-grid {
  width: 100% !important;
  max-width: 1440px !important;
  margin-inline: auto !important;
  border-inline: 1px solid var(--ao-border-subtle) !important;
  border-radius: var(--ao-radius-card) !important;
  box-shadow: var(--ao-shadow-rest) !important;
}

.route-dashboard > .workspace-hero {
  position: relative;
  overflow: hidden;
  min-height: 320px;
  border: 1px solid rgba(91,92,226,.20);
  border-radius: var(--ao-radius-hero);
  background:
    radial-gradient(circle at 95% 5%, rgba(124,58,237,.18), transparent 32%),
    radial-gradient(circle at 3% 110%, rgba(20,184,166,.11), transparent 34%),
    var(--ao-card-gradient) !important;
  box-shadow: var(--ao-shadow-raised);
}
.route-dashboard .workspace-intro { min-height: 320px; padding: 40px; background: transparent !important; }
.route-dashboard .workspace-intro h1 { font-size: 38px; font-weight: 700; letter-spacing: -.035em; }
html[lang="ar"] .route-dashboard .workspace-intro h1 { letter-spacing: 0; }
.route-dashboard .workspace-intro h1 span { color: transparent; background: var(--ao-text-gradient); background-clip: text; -webkit-background-clip: text; }
.route-dashboard .target-panel {
  margin: 18px;
  min-height: 284px;
  border: 1px solid rgba(129,140,248,.26);
  border-radius: 16px;
  color: #f8fafc;
  background:
    radial-gradient(circle at 85% 8%, rgba(45,212,191,.17), transparent 32%),
    linear-gradient(150deg, #14182a 0%, #202052 48%, #172640 100%) !important;
  box-shadow: 0 20px 50px rgba(35,31,99,.20);
}
.route-dashboard .target-status-row { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.route-dashboard .target-status-row .system-status { padding: 6px 9px; border: 1px solid rgba(16,185,129,.26); border-radius: 999px; color: #8ee1c2; background: rgba(16,185,129,.10); font-weight: 650; }
.route-dashboard .savings-summary { width: 100%; display: grid; justify-items: center; align-content: center; gap: 12px; text-align: center; }
.route-dashboard .savings-ring { width: 128px; aspect-ratio: 1; display: grid; place-items: center; position: relative; border-radius: 50%; background: conic-gradient(from -90deg,var(--ao-cyan-400) calc(var(--ao-savings) * 1%),rgba(255,255,255,.10) 0); box-shadow: 0 12px 34px rgba(45,212,191,.10); }
.route-dashboard .savings-ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: linear-gradient(145deg,#191b3b,#172640); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.route-dashboard .savings-ring .target-value { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; width: 100%; height: 100%; margin: 0 !important; padding: 0 !important; font-size: 28px; line-height: 1; transform: translateY(-1px); }
.route-dashboard .target-panel .target-value { color: transparent; background: linear-gradient(100deg, #fff, #a5b4fc 46%, #5eead4); background-clip: text; -webkit-background-clip: text; }
.route-dashboard .metric-value.cost-good, .route-dashboard .metric-value.cost-warn, .route-dashboard .metric-value.cost-high { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; }
.route-dashboard > .metric-row { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-block: 20px !important; border: 0 !important; background: transparent; box-shadow: none !important; }
.route-dashboard .metric-tile { min-height: 132px; padding: 20px; border: 1px solid var(--ao-border-subtle) !important; border-radius: var(--ao-radius-card); background: var(--ao-card-gradient) !important; box-shadow: var(--ao-shadow-rest); }
.route-dashboard .metric-tile::before { width: 36px; height: 3px; border-radius: 999px; }
.route-dashboard > .dashboard-grid { gap: 16px; border: 0 !important; background: transparent; box-shadow: none !important; }
.route-dashboard .dashboard-grid > .card { border: 1px solid var(--ao-border-subtle); border-radius: var(--ao-radius-panel); box-shadow: var(--ao-shadow-rest); }

.session-toolbar { margin-block-end: 0 !important; padding: 16px; border: 1px solid var(--ao-border-subtle) !important; border-radius: 12px 12px 0 0 !important; background: var(--ao-card-gradient); }
.session-table { min-height: 360px; border-radius: 0 0 16px 16px !important; overflow: auto !important; }
.session-table table { min-width: 760px; }

.kpi-grid { gap: 16px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.kpi-grid > .kpi { min-height: 112px; padding: 18px; border: 1px solid var(--ao-border-subtle) !important; border-radius: var(--ao-radius-card) !important; background: var(--ao-card-gradient) !important; box-shadow: var(--ao-shadow-rest) !important; }
.kpi .value { font-size: 28px; }
.route-arena > .arena-tabs, .route-leaderboard > .arena-tabs { margin-block: 16px !important; padding: 6px; border-radius: 12px !important; background: var(--ao-surface-3); }
.arena-tabs button { min-height: 38px; border-radius: 8px; }
.arena-tabs button.on { color: #fff; border: 0; background: var(--ao-brand-gradient); box-shadow: 0 6px 14px rgba(79,70,229,.18); }
.route-arena > .arena-workspace { min-height: max(380px,calc(100vh - 420px)); padding: 28px; border-radius: var(--ao-radius-panel) !important; background: var(--ao-card-gradient); }
.route-arena #ar-prompt { min-height: 180px; }
.arena-versus { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; max-width: 620px; margin: 18px auto 24px; }
.anonymous-model { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--ao-divider); border-radius: 12px; background: var(--ao-surface-2); }
.anonymous-model > span { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #fff; font: 600 15px/1 "Geist Mono",monospace; background: var(--ao-brand-gradient); }
.anonymous-model small { color: var(--ao-text-secondary); font-weight: 600; }
.versus-node { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(91,92,226,.26); border-radius: 50%; color: var(--ao-indigo-600); background: rgba(91,92,226,.08); font: 700 11px/1 "Geist Mono",monospace; }
.arena-how { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-block-start: 22px; padding-block-start: 18px; border-block-start: 1px solid var(--ao-divider); }
.arena-how > div { display: flex; align-items: center; gap: 9px; color: var(--ao-text-secondary); font-size: 12px; }
.arena-how b { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: var(--ao-indigo-600); background: rgba(91,92,226,.10); }
.battle-loading { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-block-start: 18px; }
.battle-loading > span { grid-column: 1 / -1; color: var(--ao-text-secondary); text-align: center; }
.route-leaderboard > .leaderboard-workspace { padding: 24px; border-radius: var(--ao-radius-panel) !important; background: var(--ao-card-gradient); }
.leaderboard-workspace tr[role="button"] { cursor: pointer; }
.rank-badge { width: 28px; height: 28px; display: inline-grid; place-items: center; border-radius: 50%; color: var(--ao-text-secondary); background: var(--ao-surface-3); font: 600 12px/1 "Geist Mono",monospace; }
.rank-badge.rank-1 { color: #4a3200; background: #fbbf24; }
.rank-badge.rank-2 { color: #263140; background: #cbd5e1; }
.rank-badge.rank-3 { color: #fff7ed; background: #d97706; }
.elo-bar { display: block; width: 92px; height: 4px; margin-block-start: 5px; overflow: hidden; border-radius: 999px; background: var(--ao-surface-3); }
.elo-bar::before { content: ""; display: block; width: var(--elo); height: 100%; border-radius: inherit; background: var(--ao-brand-gradient); }
.scoring-disclosure { margin-block-start: 18px; border: 1px solid var(--ao-divider); border-radius: 12px; background: var(--ao-surface-2); }
.scoring-disclosure summary { padding: 12px 14px; cursor: pointer; color: var(--ao-text-secondary); font-size: 12px; font-weight: 600; }
.scoring-disclosure p { margin: 0; padding: 0 14px 14px; color: var(--ao-text-secondary); font-size: 12px; }

.ops-shell { gap: 16px; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.ops-shell > .card { border-radius: var(--ao-radius-panel); }
.ops-policy-banner { width: 100%; max-width: 1440px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 0 auto 16px; padding: 14px 16px; border: 1px solid rgba(59,130,246,.22); border-inline-start: 3px solid var(--ao-info); border-radius: 12px; background: rgba(59,130,246,.07); box-shadow: var(--ao-shadow-rest); }
.ops-policy-banner p { margin: 3px 0 0; color: var(--ao-text-secondary); font-size: 13px; }
.gate-row { border-radius: 10px; background: color-mix(in srgb,var(--ao-surface-3) 68%,transparent); }
.domain-team-actions { flex-wrap: wrap; justify-content: flex-end; }
.domain-header-actions { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.dom-header-refresh { white-space:nowrap; }
.domain-audit-status {
  display: grid;
  gap: 6px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--ao-border-subtle);
  border-radius: 10px;
  background: color-mix(in srgb, var(--ao-indigo-500) 5%, var(--ao-surface-2));
}
.domain-audit-status .ops-pill { margin-inline-start: 6px; }
@media (max-width: 767px) {
  .domain-accordion > div:first-child { align-items:flex-start !important; flex-wrap:wrap; gap:10px; }
  .domain-accordion > div:first-child > .row { flex:1 1 100%; flex-wrap:wrap; }
  .domain-header-actions { width:100%; justify-content:space-between; }
  .dom-header-refresh { min-height:40px; flex:1; }
  .domain-team-audit .auto-panel-top { align-items: flex-start; }
  .domain-team-actions { width: 100%; justify-content: stretch; }
  .domain-team-actions .btn { flex: 1 1 100%; }
  .bilingual-review { grid-template-columns:1fr; }
  .github-signal-card { flex-direction:column; }
  .github-signal-meta { width:100%; align-items:flex-start; flex-direction:row; }
}
.governance-rule, .recommendation-row, .approval-row { cursor: pointer; }
.governance-rule:hover, .approval-row:hover { background: rgba(91,92,226,.07); }
.governance-rule:focus-visible, .approval-row:focus-visible { outline: 2px solid var(--ao-indigo-500); outline-offset: 2px; }
.route-model-ops > .arena-tabs { position: sticky; inset-block-start: 0 !important; z-index: 8; padding: 6px 8px !important; border-radius: 12px !important; background: color-mix(in srgb,var(--ao-surface-1) 94%,transparent) !important; backdrop-filter: blur(8px); }

.route-settings { display: block; }
.route-settings > :first-child { text-align: start !important; }
.route-settings > .settings-jump { position: sticky; inset-block-start: 0 !important; z-index: 8; padding: 6px !important; border-radius: 12px !important; background: color-mix(in srgb,var(--ao-surface-1) 94%,transparent); backdrop-filter: blur(8px); }
.settings-panel-block { border-radius: var(--ao-radius-panel) !important; }
.settings-scroll { max-height: 560px; }
.prov-card { min-height: 62px; padding: 12px 14px; border: 1px solid var(--ao-divider); border-inline-start: 0; border-radius: 10px; background: transparent; cursor: pointer; }
.prov-card:hover { background: rgba(91,92,226,.045); }
.prov-card:focus-visible { outline: 2px solid var(--ao-indigo-500); outline-offset: 2px; }
.prov-card .avatar { width: 32px !important; height: 32px !important; }
@media (min-width: 1180px) {
  #st-provs .prov-card { display: grid; grid-template-columns: 32px minmax(220px,1fr) minmax(110px,auto) minmax(110px,auto) minmax(130px,auto) auto auto auto; align-items: center; gap: 10px; }
}
.cost-neutral { color: var(--ao-text-secondary); background: rgba(100,116,139,.09); }
.cost-balanced { color: #1d4ed8; border-color: rgba(59,130,246,.28); background: rgba(59,130,246,.10); }
[data-theme="dark"] .cost-balanced { color: #93c5fd; }
.ao-switch { display: inline-flex; align-items: center; gap: 7px; color: var(--ao-text-secondary); font-size: 12px; cursor: pointer; }
.ao-switch input { position: absolute; opacity: 0; pointer-events: none; }
.ao-switch > span { position: relative; width: 38px; height: 22px; border-radius: 999px; background: var(--ao-border-strong); transition: background 180ms var(--ao-ease); }
.ao-switch > span::after { content: ""; position: absolute; inset-block-start: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: inset-inline-start 180ms var(--ao-ease), transform 180ms var(--ao-ease); }
.ao-switch input:checked + span { background: var(--ao-brand-gradient); }
.ao-switch input:checked + span::after { inset-inline-start: calc(100% - 19px); }
.ao-switch input:focus-visible + span { box-shadow: 0 0 0 4px var(--ao-focus-ring); }

.route-new:has(#su-automode) { gap: 16px !important; padding-top: 32px !important; }
.route-new > .setup-head { margin-block-end: 0 !important; }
.route-new > .evidence-card, .route-new > .card:has(#su-automode) {
  width: 100% !important;
  margin-inline: 0 !important;
  border: 1px solid var(--ao-border-subtle) !important;
  border-radius: var(--ao-radius-panel) !important;
  background: var(--ao-card-gradient) !important;
  box-shadow: var(--ao-shadow-rest) !important;
}
.route-new > .card:has(#su-automode) { position: sticky; inset-block-start: 16px; align-self: start !important; }
.route-new .dropzone { min-height: 128px; border: 2px dashed var(--ao-border-strong); border-radius: 12px; }
.route-new .dropzone:hover { border-color: var(--ao-indigo-500); background: rgba(91,92,226,.045); }
.mode-btn { min-height: 42px; border-radius: 8px; }
.mode-btn.on { color: #fff; border-color: transparent; background: var(--ao-brand-gradient); box-shadow: 0 8px 16px rgba(79,70,229,.18); }
.actionbar { position: sticky !important; inset-block-end: 0 !important; z-index: 12 !important; padding: 12px 16px !important; border: 1px solid var(--ao-border-subtle); border-radius: 14px; background: color-mix(in srgb,var(--ao-surface-1) 96%,transparent) !important; box-shadow: 0 -8px 30px rgba(17,19,26,.08); backdrop-filter: blur(10px); }

.route-skills > .card, .route-skills #skills-always-on > .card { padding: 20px !important; border-radius: var(--ao-radius-panel) !important; background: var(--ao-card-gradient) !important; }
.route-skills > #sk-grid, .route-skills #sk-grid { padding: 20px !important; border-radius: var(--ao-radius-panel) !important; background: transparent; box-shadow: none !important; }
.underline-subnav { display: flex; align-items: center; gap: 20px; margin-block: 8px 18px; overflow-x: auto; border-block-end: 1px solid var(--ao-divider); }
.underline-subnav a { position: relative; flex: 0 0 auto; padding: 12px 2px; color: var(--ao-text-secondary); font-size: 13px; font-weight: 600; }
.underline-subnav a::after { content: ""; position: absolute; inset-inline: 0; inset-block-end: -1px; height: 3px; border-radius: 999px; background: transparent; }
.underline-subnav a.on { color: var(--ao-text-primary); }
.underline-subnav a.on::after { background: var(--ao-brand-gradient); }
.tool-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-block-start: 14px; }
.tool-choice { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; min-width: 0; padding: 14px; }
.tool-choice > label { display: flex; align-items: center; gap: 8px; min-height: 34px; }
.tool-choice > label input { width: 18px; height: 18px; accent-color: var(--ao-indigo-600); }
.tool-choice > .impact-list { grid-column: 1 / -1; }
.skill-card, .tool-choice { border-radius: 12px; border-color: var(--ao-border-subtle); background: var(--ao-card-gradient); }
.skill-card:hover, .tool-choice:hover { transform: translateY(-1px); border-color: var(--ao-border-strong); box-shadow: var(--ao-shadow-raised); }

.empty-state, .ao-empty-state { min-height: 220px; display: grid; place-content: center; gap: 8px; padding: 28px; border: 1px dashed var(--ao-border-strong); border-radius: 14px; background: radial-gradient(circle at 50% 0%,rgba(91,92,226,.08),transparent 50%); text-align: center; }
.ao-empty-state p { max-width: 480px; margin: 0 auto; color: var(--ao-text-secondary); }
.ao-empty-icon { width: 72px; height: 72px; margin: 0 auto 14px; display: grid; place-items: center; border-radius: 20px; color: var(--ao-indigo-600); background: rgba(91,92,226,.10); }

.ao-breadcrumb { display: flex; align-items: center; gap: 7px; margin-block-end: 10px; color: var(--ao-text-tertiary); font-size: 11px; font-weight: 600; }
.ao-breadcrumb a { color: var(--ao-text-secondary); }
.ao-breadcrumb a:hover { color: var(--ao-indigo-600); }
.ao-callout { margin-block: 14px; padding: 14px 16px; border: 1px solid var(--ao-border-subtle); border-inline-start-width: 3px; border-radius: 10px; background: var(--ao-surface-2); }
.ao-callout b { display: block; margin-block-end: 3px; }
.ao-callout p { margin: 0; color: var(--ao-text-secondary); }
.ao-callout.info { border-inline-start-color: var(--ao-info); background: rgba(59,130,246,.07); }
.ao-callout.warning { border-inline-start-color: var(--ao-warning); background: rgba(245,158,11,.08); }
.ao-record-list { display: grid; gap: 0; border: 1px solid var(--ao-divider); border-radius: 10px; overflow: hidden; }
.ao-record-row { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border-block-end: 1px solid var(--ao-divider); }
.ao-record-row:last-child { border-block-end: 0; }
.ao-record-row small { display: block; margin-block-start: 2px; color: var(--ao-text-tertiary); }
.ao-record-row > span, .ao-record-row > .mono { color: var(--ao-text-secondary); font-size: 12px; text-align: end; overflow-wrap: anywhere; }
.ao-record-skeleton { display: grid; gap: 14px; }
.ao-record-skeleton > div { height: 82px; border-radius: 12px; background: linear-gradient(100deg,var(--ao-surface-3) 20%,var(--ao-surface-hover) 40%,var(--ao-surface-3) 60%); background-size: 240% 100%; animation: ao-skeleton 1.3s linear infinite; }
.ao-record-skeleton > div:first-child { height: 42px; }
@keyframes ao-skeleton { to { background-position-x: -240%; } }

.ao-local-preferences { scroll-margin-block-start: 84px; }
.ao-preference-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 20px; }
.ao-preference-groups { display: grid; gap: 14px; }
.ao-preference-group { padding: 16px; border: 1px solid var(--ao-divider); border-radius: 12px; background: var(--ao-surface-2); }
.ao-preference-group h3 { margin: 0 0 10px; font-size: 14px; }
.ao-preference-field { min-height: 52px; display: grid; grid-template-columns: minmax(0,1fr) minmax(120px,190px); align-items: center; gap: 16px; padding-block: 9px; border-block-end: 1px solid var(--ao-divider); }
.ao-preference-field:last-child { border-block-end: 0; }
.ao-preference-field b { display: block; font-size: 13px; }
.ao-preference-field small { display: block; margin-block-start: 3px; color: var(--ao-text-tertiary); font-size: 11px; line-height: 1.45; }
.ao-preference-field > input[type="checkbox"] { justify-self: end; width: 20px; height: 20px; accent-color: var(--ao-indigo-600); }
.ao-appearance-preview { align-self: start; position: sticky; inset-block-start: 84px; padding: 18px; border: 1px solid rgba(91,92,226,.20); border-radius: 14px; background: radial-gradient(circle at 100% 0%,rgba(124,58,237,.14),transparent 42%),var(--ao-card-gradient); box-shadow: var(--ao-shadow-rest); }
.ao-appearance-preview h3 { margin: 6px 0 20px; }
.ao-preview-metric { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-block-end: 18px; padding-block-end: 14px; border-block-end: 1px solid var(--ao-divider); }
.ao-preview-metric span { color: var(--ao-text-secondary); font-size: 12px; }
.ao-preview-metric b { color: var(--ao-indigo-600); font-size: 28px; }
body.ao-muted-metrics .metric-value, body.ao-muted-metrics .target-value, body.ao-muted-metrics .kpi .value, body.ao-muted-metrics .ao-preview-metric b { color: var(--ao-text-primary) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }

@media (min-width: 1180px) {
  .route-settings { display: block; }
  .route-settings > .settings-jump { width: 100% !important; display: flex; flex-direction: row; align-items: center; gap: 4px; padding: 8px !important; overflow-x: auto; }
  .route-settings > .settings-jump button { width: auto; min-height: 40px; flex: 0 0 auto; justify-content: center; text-align: center; }
  .route-settings > .card, .route-settings > .grid2 { width: 100% !important; min-width: 0; margin-block: 0 !important; }
}

.skill-install-menu { position: relative; align-self: flex-end; margin-block-start: 12px; }
.skill-install-menu summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; }
.skill-install-menu summary::-webkit-details-marker { display: none; }
.skill-install-options { position: absolute; z-index: var(--ao-z-menu); inset-inline-end: 0; inset-block-start: calc(100% + 6px); min-width: 210px; display: grid; gap: 6px; padding: 8px; border: 1px solid var(--ao-border-strong); border-radius: 10px; background: var(--ao-surface-1); box-shadow: var(--ao-shadow-raised); }
.skill-install-options .btn { width: 100%; justify-content: flex-start; }

.ao-command-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--ao-z-dialog);
  display: none;
  place-items: start center;
  padding: min(14vh,120px) 16px 16px;
  background: rgba(5,8,15,.48);
  backdrop-filter: blur(2px);
}
.ao-command-overlay.open { display: grid; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.ao-command {
  width: min(640px,100%);
  overflow: hidden;
  border: 1px solid var(--ao-border-strong);
  border-radius: 16px;
  background: var(--ao-surface-1);
  box-shadow: 0 30px 80px rgba(4,6,12,.34);
}
.ao-command-search { display: flex; align-items: center; gap: 10px; padding: 14px; border-block-end: 1px solid var(--ao-divider); }
.ao-command-search input { flex: 1; border: 0; background: transparent; box-shadow: none; font-size: 16px; }
.ao-command-list { max-height: min(54vh,520px); overflow-y: auto; padding: 8px; }
.ao-command-item { width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--ao-text-primary); text-align: start; }
.ao-command-item:hover, .ao-command-item[aria-selected="true"] { background: rgba(91,92,226,.09); }
.ao-command-item small { color: var(--ao-text-tertiary); }

.ao-drawer-root { position: fixed; inset: 0; z-index: var(--ao-z-drawer); pointer-events: none; }
.ao-drawer-root[data-open="true"] { pointer-events: auto; }
.ao-drawer-backdrop { position: absolute; inset: 0; opacity: 0; background: rgba(15,20,25,.30); transition: opacity 200ms var(--ao-ease); }
[data-theme="dark"] .ao-drawer-backdrop { background: rgba(0,0,0,.48); }
.ao-drawer-root[data-open="true"] .ao-drawer-backdrop { opacity: 1; }
.ao-drawer {
  position: absolute;
  inset-block: 8px;
  inset-inline-end: 8px;
  width: min(var(--ao-drawer-width,520px),calc(100vw - 24px));
  display: grid;
  grid-template-rows: auto minmax(0,1fr) auto;
  overflow: hidden;
  border: 1px solid var(--ao-border-strong);
  border-radius: 16px;
  background: var(--ao-surface-1);
  box-shadow: 0 24px 70px rgba(6,8,15,.34);
  transform: translateX(calc(100% + 20px));
  opacity: 0;
  transition: transform 250ms var(--ao-ease), opacity 200ms var(--ao-ease), filter 200ms var(--ao-ease);
}
html[dir="rtl"] .ao-drawer { transform: translateX(calc(-100% - 20px)); }
.ao-drawer[data-active="true"] { transform: none; opacity: 1; }
html[dir="rtl"] .ao-drawer[data-active="true"] { transform: none; }
.ao-drawer[data-parent="true"] { transform: translateX(-12px) scale(.992); opacity: .78; pointer-events: none; }
html[dir="rtl"] .ao-drawer[data-parent="true"] { transform: translateX(12px) scale(.992); }
.ao-drawer-header { position: sticky; inset-block-start: 0; z-index: 2; padding: 20px 22px 16px; border-block-end: 1px solid var(--ao-divider); background: color-mix(in srgb,var(--ao-surface-1) 96%,transparent); }
.ao-drawer-headrow { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.ao-drawer-eyebrow { color: var(--ao-indigo-600); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
html[lang="ar"] .ao-drawer-eyebrow { letter-spacing: 0; text-transform: none; }
.ao-drawer-title { margin: 4px 0 0; font-size: 22px; line-height: 1.25; }
.ao-drawer-body { overflow-y: auto; padding: 22px; }
.ao-drawer-footer { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 14px 22px; border-block-start: 1px solid var(--ao-divider); background: var(--ao-surface-2); }
.ao-drawer-close, .ao-drawer-back { width: 38px; height: 38px; border: 1px solid var(--ao-border-subtle); border-radius: 8px; background: var(--ao-surface-2); color: var(--ao-text-secondary); }
.ao-inspector-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-block: 18px; }
.ao-inspector-stat { padding: 14px; border: 1px solid var(--ao-divider); border-radius: 10px; background: var(--ao-surface-2); }
.ao-inspector-stat span { display: block; color: var(--ao-text-tertiary); font-size: 11px; }
.ao-inspector-stat b { display: block; margin-block-start: 5px; font-size: 16px; }
.ao-inspector-section { padding-block: 16px; border-block-start: 1px solid var(--ao-divider); }
.ao-inspector-section h3 { margin: 0 0 10px; font-size: 14px; }
.ao-pre { white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.65 "Geist Mono",Consolas,monospace; }

.toast { z-index: var(--ao-z-toast); max-width: 420px; border: 1px solid var(--ao-border-strong); border-radius: 12px; background: var(--ao-surface-1); box-shadow: var(--ao-shadow-raised); }

body.ao-density-compact .card { padding: 14px; }
body.ao-density-compact table.list td { padding-block: 9px; }
body.ao-density-compact .nav-btn { min-height: 38px; }

@media (min-width: 1440px) {
  #main { padding-inline: 40px; }
}

@media (min-width: 768px) and (max-width: 1179px) {
  #layout, body.ao-nav-collapsed #layout { grid-template-columns: 72px minmax(0,1fr); }
  body.has-right #layout, body.ao-nav-collapsed.has-right #layout { grid-template-columns: 72px minmax(0,1fr); }
  #topbar .logo { width: 54px; min-width: 54px; }
  #topbar .logo-copy { display: none; }
  #sidebar { position: relative; inset: auto; width: auto; transform: none; padding-inline: 9px; }
  #sidebar .nav-btn > span:not(.ico), #sidebar .sb-section > summary, #sidebar .nav-sub, #sidebar .sb-footer-note { display: none; }
  #sidebar .nav-btn { justify-content: center; padding-inline: 8px; }
  #sidebar.open { position: fixed; inset-block: 64px 0; inset-inline-start: 0; z-index: 70; width: 288px; padding: 16px 12px; box-shadow: var(--ao-shadow-raised); }
  #sidebar.open .nav-btn > span:not(.ico), #sidebar.open .sb-section > summary, #sidebar.open .sb-footer-note { display: flex; }
  #sidebar.open .nav-btn { justify-content: flex-start; }
  #hamburger { display: inline-flex; }
  #main { padding: 24px; }
  .route-dashboard > .metric-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .route-dashboard > .workspace-hero { grid-template-columns: 1fr 340px; }
  .route-dashboard .workspace-intro { padding: 32px; }
  .route-dashboard .workspace-intro h1 { font-size: 34px; }
  .route-dashboard > .dashboard-grid { grid-template-columns: 1fr; }
  #rightpanel { position: fixed; inset-block: 64px 0; inset-inline-end: 0; width: min(440px,52vw); z-index: 65; }
  .tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 767px) {
  #topbar { height: 56px; padding-inline: 10px; gap: 8px; }
  #topbar .logo { width: 42px; min-width: 42px; }
  #topbar .logo-copy, #topbar .topbar-context, #topbar .mission-chip, .ao-top-new, .ao-command-trigger span, .ao-command-trigger kbd { display: none; }
  #topbar .spacer { min-width: 0; }
  #layout, body.ao-nav-collapsed #layout, body.has-right #layout, body.ao-nav-collapsed.has-right #layout { display: block; height: calc(100vh - 56px); }
  #sidebar { position: fixed; inset-block: 56px 0; inset-inline-start: 0; z-index: 70; width: min(340px,92vw); transform: translateX(-105%); padding: 18px 14px; box-shadow: var(--ao-shadow-raised); }
  html[dir="rtl"] #sidebar { transform: translateX(105%); }
  #sidebar.open { transform: none; }
  #sidebar .nav-btn > span:not(.ico), #sidebar .sb-section > summary, #sidebar .sb-footer-note { display: flex; }
  #sidebar .nav-btn { justify-content: flex-start; }
  #sidebar .ao-nav-collapse { display: none; }
  #main { height: 100%; padding: 20px 16px calc(96px + env(safe-area-inset-bottom)); }
  .route-page-head, .ops-page-head, .setup-head, .route-settings > :first-child, .route-skills > :first-child { min-height: 118px; padding: 20px; margin-block-end: 16px !important; border-radius: 16px !important; }
  .route-page-head h2, .ops-page-head h2, .setup-head h2, .route-settings > :first-child h2, .route-skills > :first-child h2 { font-size: 26px; }
  .route-dashboard > .workspace-hero { display: grid; grid-template-columns: 1fr; min-height: 0; border-radius: 16px; }
  .route-dashboard .workspace-intro { min-height: 0; padding: 24px 20px; }
  .route-dashboard .workspace-intro h1 { font-size: 30px; }
  .route-dashboard .target-panel { min-height: 230px; margin: 0 12px 12px; padding: 22px; }
  .route-dashboard > .metric-row { grid-template-columns: 1fr 1fr; gap: 12px; }
  .route-dashboard .metric-tile { min-height: 116px; padding: 16px; }
  .route-dashboard > .dashboard-grid { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
  .kpi-grid > .kpi { min-height: 96px; padding: 14px; }
  .route-arena > .arena-tabs, .route-leaderboard > .arena-tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .route-arena > .arena-workspace, .route-leaderboard > .leaderboard-workspace { padding: 18px; }
  .ops-policy-banner { align-items: flex-start; flex-direction: column; }
  .route-model-ops > .arena-tabs,
  .route-model-ops > .ops-shell,
  .route-model-ops > .card {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }
  .route-model-ops .ops-shell,
  .route-model-ops .ops-shell > .card,
  .route-model-ops .grid2,
  .route-model-ops .field { min-width: 0; }
  .route-model-ops .field > input,
  .route-model-ops .field > select,
  .route-model-ops .field > textarea { width: 100%; max-width: 100%; min-width: 0; }
  .route-arena #ar-prompt { min-height: 160px; }
  .route-new:has(#su-automode) { display: flex !important; padding: 20px 16px calc(104px + env(safe-area-inset-bottom)) !important; gap: 14px !important; }
  .route-new > .card:has(#su-automode) { position: static; }
  .actionbar { position: fixed !important; inset-inline: 0 !important; inset-block-end: 0 !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)) !important; border-radius: 16px 16px 0 0; }
  .actionbar > .muted { display: none; }
  .actionbar > .row { width: 100%; }
  .actionbar .btn { flex: 1 1 100%; min-height: 48px; }
  .actionbar .btn:not(.primary) { display: none; }
  .session-table { overflow: visible !important; border: 0 !important; background: transparent; box-shadow: none !important; }
  .session-table table, .leaderboard-workspace table.list { min-width: 0; }
  .session-table table.list thead, .leaderboard-workspace table.list thead { display: none; }
  .session-table table.list, .session-table table.list tbody, .leaderboard-workspace table.list, .leaderboard-workspace table.list tbody { display: block; }
  .session-table table.list tr, .leaderboard-workspace table.list tr { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin-block-end: 12px; padding: 16px; border: 1px solid var(--ao-border-subtle); border-radius: 12px; background: var(--ao-card-gradient); box-shadow: var(--ao-shadow-rest); }
  .session-table table.list td, .leaderboard-workspace table.list td { display: block; padding: 0; border: 0; text-align: start !important; }
  .session-table table.list td::before, .leaderboard-workspace table.list td::before { content: attr(data-label); display: block; margin-block-end: 3px; color: var(--ao-text-tertiary); font-size: 10px; font-weight: 700; }
  .session-table table.list td:first-child, .leaderboard-workspace table.list td:nth-child(2) { grid-column: 1 / -1; }

  .route-model-ops table.list:has(.rd-copy),
  .route-model-ops table.list:has(.rd-copy) tbody { display: block; width: 100%; }
  .route-model-ops table.list:has(.rd-copy) thead { display: none; }
  .route-model-ops table.list:has(.rd-copy) tr {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    gap: 12px 14px;
    margin-block-end: 12px;
    padding: 16px;
    border: 1px solid var(--ao-border-subtle);
    border-radius: 12px;
    background: var(--ao-card-gradient);
  }
  .route-model-ops table.list:has(.rd-copy) td {
    display: block;
    min-width: 0;
    padding: 0;
    border: 0;
    text-align: start !important;
    overflow-wrap: anywhere;
  }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(1),
  .route-model-ops table.list:has(.rd-copy) td:nth-child(4) { grid-column: 1 / -1; }
  .route-model-ops table.list:has(.rd-copy) td::before {
    display: block;
    margin-block-end: 4px;
    color: var(--ao-text-tertiary);
    font-size: 10px;
    font-weight: 700;
  }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(1)::before { content: "Domain"; }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(2)::before { content: "Source"; }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(3)::before { content: "Evidence"; }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(4)::before { content: "Blocking reason"; }
  .route-model-ops table.list:has(.rd-copy) td:nth-child(5)::before { content: "Request"; }
  html[lang="ar"] .route-model-ops table.list:has(.rd-copy) td:nth-child(1)::before { content: "المجال"; }
  html[lang="ar"] .route-model-ops table.list:has(.rd-copy) td:nth-child(2)::before { content: "المصدر"; }
  html[lang="ar"] .route-model-ops table.list:has(.rd-copy) td:nth-child(3)::before { content: "الدليل"; }
  html[lang="ar"] .route-model-ops table.list:has(.rd-copy) td:nth-child(4)::before { content: "سبب التعطيل"; }
  html[lang="ar"] .route-model-ops table.list:has(.rd-copy) td:nth-child(5)::before { content: "الطلب"; }
  .route-model-ops table.list:has(.rd-copy) .rd-copy { min-width: 72px; }
  .session-table table.list td:last-child { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; padding-block-start: 8px; border-block-start: 1px solid var(--ao-divider); }
  .settings-scroll { max-height: none; }
  .prov-card { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: start; padding: 14px; }
  .prov-card > .avatar { grid-column: 1; grid-row: 1; }
  .prov-card > .grow { grid-column: 1 / -1; grid-row: 1; padding-inline-start: 44px; }
  html[dir="rtl"] .prov-card > .grow { padding-inline-start: 44px; }
  .prov-card > .keybadge:not(.cost-good):not(.cost-balanced):not(.cost-warn):not(.cost-high):not(.cost-neutral) { grid-column: 1 / -1; }
  .prov-card > .ao-switch { grid-column: 1 / -1; }
  .prov-card > .btn { width: 100%; }
  .prov-card .grow { min-width: 0; }
  .ao-preference-layout { grid-template-columns: 1fr; }
  .ao-appearance-preview { position: static; }
  .ao-preference-field { grid-template-columns: minmax(0,1fr) minmax(108px,142px); }
  .skill-install-menu { align-self: stretch; }
  .skill-install-menu summary { width: 100%; justify-content: center; }
  .skill-install-options { position: static; margin-block-start: 6px; }
  .tool-grid { grid-template-columns: 1fr; }
  .arena-versus { gap: 8px; }
  .anonymous-model { padding: 8px; }
  .anonymous-model small { display: none; }
  .arena-how { grid-template-columns: 1fr; }
  .battle-loading { grid-template-columns: 1fr; }
  .battle-loading > span { grid-column: 1; }
  .ao-command-overlay { padding: 0; }
  .ao-command { width: 100%; height: 100%; border: 0; border-radius: 0; }
  .ao-command-list { max-height: calc(100vh - 74px); }
  .ao-drawer { inset: 0; width: 100%; border: 0; border-radius: 0; }
  .ao-drawer-header { padding-top: calc(16px + env(safe-area-inset-top)); }
  .ao-drawer-footer { padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .ao-inspector-grid { grid-template-columns: 1fr 1fr; }
  button, .btn, .icon-btn, .language-btn { min-height: 44px; }
}

@media (hover: none) and (pointer: coarse) and (max-width: 1024px) {
  #main.route-dashboard { padding-block-start: 16px; }
  .route-dashboard > .workspace-hero { grid-template-columns: 1fr !important; min-height: 0 !important; }
  .route-dashboard .workspace-intro { min-height: 0 !important; }
  .route-dashboard .target-panel { min-height: 238px; }
  .route-model-ops table.list { max-width: 100%; }
}

@media (max-width: 390px) {
  .route-dashboard > .metric-row { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr 1fr !important; }
  .ao-inspector-grid { grid-template-columns: 1fr; }
}

/* Ops benchmark workbench and structured discovery surfaces. */
.benchmark-workspace {
  background:
    radial-gradient(circle at 92% 0%,color-mix(in srgb,var(--ao-indigo-500) 10%,transparent),transparent 34%),
    linear-gradient(180deg,var(--ao-surface-1),var(--ao-surface-2)) !important;
}
.benchmark-composer {
  display:grid;
  grid-template-columns:minmax(180px,.28fr) minmax(0,1fr);
  gap:16px;
  align-items:start;
  margin-block:16px 12px;
}
.benchmark-run-list { display:grid; gap:12px; margin-block-start:18px; }
.benchmark-run-card {
  padding:16px;
  border:1px solid var(--ao-border-subtle);
  border-radius:12px;
  background:color-mix(in srgb,var(--ao-surface-1) 92%,transparent);
}
.benchmark-run-head,
.benchmark-run-head > div,
.benchmark-metrics {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.benchmark-run-head { justify-content:space-between; }
.benchmark-prompt-preview {
  margin:12px 0 8px;
  font-weight:600;
  color:var(--ao-text-primary);
  white-space:pre-wrap;
}
.benchmark-metrics { padding:10px 0; color:var(--ao-text-secondary); }
.benchmark-metrics span {
  padding-inline-end:12px;
  border-inline-end:1px solid var(--ao-divider);
}
.benchmark-metrics span:last-child { border-inline-end:0; }
.benchmark-run-card details { margin-block-start:12px; }
.benchmark-run-card summary { cursor:pointer; color:var(--ao-indigo-600); font-weight:650; }
.benchmark-answer {
  max-height:420px;
  overflow:auto;
  white-space:pre-wrap;
  margin-block:12px;
  padding:14px;
  border-radius:10px;
  border:1px solid var(--ao-border-subtle);
  background:var(--ao-surface-3);
  color:var(--ao-text-primary);
  direction:ltr;
  text-align:start;
}
.benchmark-reference-form { margin-block-start:12px; }
.manager-review-summary { display:grid; gap:10px; margin-block-start:12px; }
.manager-review-summary p { margin:0; line-height:1.65; color:var(--ao-text-secondary); }
.bilingual-review { display:grid; grid-template-columns:1fr 1fr; gap:8px; width:100%; }
.bilingual-review > div {
  padding:10px;
  border:1px solid var(--ao-border-subtle);
  border-radius:8px;
  background:color-mix(in srgb,var(--ao-surface-3) 72%,transparent);
}
.bilingual-review span,
.github-purpose span { color:var(--ao-indigo-500); font:600 11px/1 var(--ao-font-mono); }
.review-list { display:grid; gap:8px; margin-block-start:16px; }
.github-signal-grid { display:grid; gap:8px; margin-block-start:12px; }
.github-signal-card {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:12px;
  border:1px solid var(--ao-border-subtle);
  border-radius:10px;
  background:var(--ao-surface-2);
}
.github-signal-main { min-width:0; flex:1; }
.github-signal-meta { display:flex; align-items:flex-end; gap:6px; flex-direction:column; flex:0 0 auto; }
.github-purpose { margin-block-start:7px; color:var(--ao-text-secondary); line-height:1.5; }
.github-signal-card details { margin-block-start:8px; }
.github-signal-card summary { color:var(--ao-text-tertiary); cursor:pointer; font-size:12px; }
.github-signal-card p { margin:4px 0 0; color:var(--ao-text-secondary); line-height:1.5; }
.github-explainer, .manager-explainer { display:grid; gap:4px; }
.github-explainer b { color:var(--ao-text-primary); }
.signal-notice,
.settings-explainer {
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  margin-block:10px;
  border:1px solid color-mix(in srgb,var(--ao-blue-500) 28%,var(--ao-border-subtle));
  border-radius:10px;
  background:color-mix(in srgb,var(--ao-blue-500) 7%,var(--ao-surface-2));
  color:var(--ao-text-secondary);
}
.settings-explainer { flex-direction:column; gap:4px; }
.settings-explainer b { color:var(--ao-text-primary); }
.tool-add-row {
  display:flex;
  gap:8px;
  align-items:center;
  margin-block:14px;
}
.tool-add-row select { min-width:min(100%,320px); }
.custom-skill-form { margin-block-end:14px; }
.custom-skill-form select[multiple] { min-height:148px; }
.skill-source-link { display:inline-flex;align-items:center;gap:6px;margin-block-end:10px;color:var(--ao-indigo-600);font-size:12px;font-weight:700;text-decoration:none; }
.skill-source-link:hover { text-decoration:underline; }
.skill-summary { white-space:pre-line; }
.badge.github { margin-inline-start:6px;background:var(--ao-text-primary);border-color:var(--ao-text-primary);color:var(--ao-surface-1); }
.ao-page-loading { display:grid;gap:14px; }
.ao-skeleton { border-radius:12px;background:linear-gradient(100deg,var(--ao-surface-3) 20%,var(--ao-surface-hover) 40%,var(--ao-surface-3) 60%);background-size:240% 100%;animation:ao-skeleton 1.3s linear infinite; }

@media (max-width:720px) {
  .benchmark-composer { grid-template-columns:1fr; }
  .benchmark-metrics { display:grid; grid-template-columns:1fr 1fr; }
  .benchmark-metrics span { border-inline-end:0; }
  .tool-add-row { align-items:stretch; flex-direction:column; }
  .tool-add-row select,
  .tool-add-row .btn { width:100%; }
  .route-model-ops .card:has(> table.list) { overflow-x:auto; }
  .route-model-ops table.list:not(:has(.rd-copy)) { min-width:700px; font-size:12px; }
  .route-model-ops .arena-tabs { overflow-x:auto; flex-wrap:nowrap !important; scrollbar-width:none; }
  .route-model-ops .arena-tabs button { flex:0 0 auto; white-space:nowrap; }
}

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