/* ============== EGLE — Design Tokens (built on OWLE design language) ============== */
.pai-scope{
  /* Brand — PAI Chat teal */
  --primary: #1fc0ab;
  --primary-end: #7df0e0;
  --primary-hover: #28d7be;
  --primary-active: #15a892;
  --primary-light: #4ad8c4;
  --primary-muted-bg: #0a201d;
  --primary-subtle: rgba(31, 192, 171, 0.14);
  --primary-ring: rgba(31, 192, 171, 0.35);

  /* Backgrounds */
  --bg-deep: #000000;
  --bg-base: #18181b;
  --bg-surface: #1f1f22;
  --bg-elevated: #27272a;
  --bg-hover: #2a2a2e;
  --bg-interactive: #3f3f47;
  --bg-sidebar: #18181b;
  --bg-overlay: rgba(24, 24, 27, 0.80);
  --bg-scrim: rgba(0, 0, 0, 0.60);

  /* Shell hierarchy: sidebar+topbar (darkest) -> aux sidebar -> body (lightest) */
  --shell-bar: #000000;
  --shell-aux: #141418;
  --shell-body: #1f1f25;

  /* Borders */
  --border: #27272a;
  --border-strong: #3f3f47;
  --border-input: #4a4a51;
  --border-row: #1f1f22;
  --border-accent: rgba(31, 192, 171, 0.30);

  /* Text */
  --text-heading: #fafafa;
  --text-primary: #e5e5e5;
  --text-secondary: #d4d4d8;
  --text-tertiary: #a3a3a3;
  --text-quaternary: #71717a;
  --text-muted: #52525c;
  --text-placeholder: rgba(229, 229, 229, 0.50);
  --text-on-primary: #ffffff;

  /* Status — Success */
  --success-bg: #052e16;
  --success-fg: #4ade80;
  --success-border: #14532d;
  --success-ring: rgba(74, 222, 128, 0.22);

  /* Status — Warning */
  --warning-bg: #1c1400;
  --warning-fg: #fbbf24;
  --warning-border: #3f2e00;

  /* Status — Queue (sky blue, used for "Indexed", "Synced") */
  --queue-bg: #0f172a;
  --queue-fg: #7dd3fc;
  --queue-border: #1e293b;

  /* Status — Error */
  --error-bg: #1f0a0a;
  --error-fg: #f87171;
  --error-border: #3f1010;
  --error-ring: rgba(248, 113, 113, 0.22);

  /* Status — Purple (used for Pro / Premium) */
  --purple-bg: #1a0a3e;
  --purple-fg: #c084fc;
  --purple-border: #2e1065;

  /* Status — Info */
  --info-bg: #0c1a2e;
  --info-fg: #93c5fd;
  --info-border: #1e3a5f;

  /* Spacing — 4px scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* Radius */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 20px;
  --radius-full: 9999px;

  /* Typography */
  --font-size-2xs: 10px;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 30px;

  --hero-fade-rgb: 0, 0, 0;
  --section-label: #494847;
}

.pai-scope :root[data-theme="light"]{
  --primary: #1fc0ab;
  --primary-end: #15a892;
  --primary-hover: #15a892;
  --primary-active: #0e8a78;
  --primary-light: #7df0e0;
  --primary-muted-bg: #eafaf6;
  --primary-subtle: rgba(31, 192, 171, 0.08);
  --primary-ring: rgba(31, 192, 171, 0.25);

  --bg-deep: #f0f0f2;
  --bg-base: #f7f7f8;
  --bg-surface: #ededee;
  --bg-elevated: #ffffff;
  --bg-hover: #f4f4f5;
  --bg-interactive: #e4e4e7;
  --bg-sidebar: #fafafa;
  --bg-overlay: rgba(255, 255, 255, 0.85);
  --bg-scrim: rgba(24, 24, 27, 0.40);

  /* Shell hierarchy: sidebar+topbar (darkest) -> aux sidebar -> body (lightest) */
  --shell-bar: #ebebee;
  --shell-aux: #f4f4f6;
  --shell-body: #ffffff;

  --border: #e4e4e7;
  --border-strong: #d4d4d8;
  --border-input: #d4d4d8;
  --border-row: #f4f4f5;
  --border-accent: rgba(31, 192, 171, 0.25);

  --text-heading: #09090b;
  --text-primary: #18181b;
  --text-secondary: #27272a;
  --text-tertiary: #52525c;
  --text-quaternary: #71717a;
  --text-muted: #a3a3a3;
  --text-placeholder: rgba(82, 82, 92, 0.60);
  --text-on-primary: #ffffff;

  --success-bg: #ecfdf5;
  --success-fg: #059669;
  --success-border: #a7f3d0;
  --warning-bg: #fffbeb;
  --warning-fg: #b45309;
  --warning-border: #fde68a;
  --queue-bg: #eff6ff;
  --queue-fg: #0369a1;
  --queue-border: #bfdbfe;
  --error-bg: #fef2f2;
  --error-fg: #dc2626;
  --error-border: #fecaca;
  --purple-bg: #faf5ff;
  --purple-fg: #7e22ce;
  --purple-border: #e9d5ff;
  --info-bg: #eff6ff;
  --info-fg: #1d4ed8;
  --info-border: #bfdbfe;

  --hero-fade-rgb: 250, 250, 250;
  --section-label: #a1a1aa;
}

.pai-scope, .pai-scope *, .pai-scope *::before, .pai-scope *::after{ box-sizing: border-box; }
.pai-scope, .pai-scope{ margin: 0; padding: 0; background: var(--bg-deep); color: var(--text-heading); }
.pai-scope{
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
.pai-scope button{ font-family: inherit; border: none; background: none; cursor: pointer; color: inherit; padding: 0; }
.pai-scope a{ color: inherit; text-decoration: none; }
.pai-scope input, .pai-scope textarea, .pai-scope select{ font-family: inherit; outline: none; }
.pai-scope .icon{ width: 24px; height: 24px; flex-shrink: 0; }
.pai-scope .sr-only{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

.pai-scope .app{
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  width: 100%;
  background: var(--bg-deep);
}

.pai-scope .logo{
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  flex-shrink: 0;
}
.pai-scope .logo-img{
  display: block;
  height: 22px;
  width: auto;
  content: url('images/logo-egle-dark.svg');
}
.pai-scope :root[data-theme="light"] .logo-img{
  content: url('images/logo-egle-light.svg');
}
.pai-scope .logo-mark{
  width: 30px; height: 30px;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 700; color: #fff;
  flex-shrink: 0;
}
.pai-scope .logo-text{
  font-size: 18px; font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--text-heading);
}

.pai-scope .topbar{
  position: sticky;
  top: 0;
  height: 64px;
  padding: 0 24px;
  background: var(--bg-deep);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  z-index: 10;
}
.pai-scope .topbar-left{ display: flex; align-items: center; gap: 24px; min-width: 0; flex: 1; }
.pai-scope .topbar-right{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pai-scope .top-nav-list{
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
}
.pai-scope .top-nav-item{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  height: 36px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-tertiary);
  white-space: nowrap;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .top-nav-item:hover{ background: var(--bg-elevated); color: var(--text-secondary); }
.pai-scope :root[data-theme="light"] .top-nav-item:hover{ background: var(--bg-hover); }
.pai-scope .top-nav-item.active{
  background: var(--primary-muted-bg);
  color: var(--text-heading);
}
.pai-scope .top-nav-item.active svg{ color: var(--primary); }
.pai-scope .top-nav-item svg{ width: 16px; height: 16px; flex-shrink: 0; transition: color 0.15s; }

.pai-scope .topbar-divider{
  width: 1px;
  height: 24px;
  background: var(--border);
  flex-shrink: 0;
}

.pai-scope .topbar-title{ display: none; }

.pai-scope .usage-pill{
  display: inline-flex;
  align-items: stretch;
  height: 36px;
  padding: 2px;
  gap: 2px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  text-decoration: none;
  transition: border-color 0.15s;
  flex-shrink: 0;
}
.pai-scope .usage-pill:hover{ border-color: var(--border-strong); }

.pai-scope .usage-pill-info{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 8px 0 2px;
  border-radius: 9999px;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s;
}
.pai-scope .usage-pill-info:hover{ background: var(--bg-elevated); }

.pai-scope .usage-pill-cta{
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 9999px;
  background: var(--primary);
  color: var(--text-on-primary);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1px;
  text-decoration: none;
  transition: filter 0.15s;
  white-space: nowrap;
}
.pai-scope .usage-pill-cta:hover{ filter: brightness(1.1); }
.pai-scope .usage-pill-icon{
  position: relative;
  width: 28px; height: 28px;
  flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
}
.pai-scope .usage-pill-ring{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.pai-scope .usage-pill-ring-bg{
  fill: none;
  stroke: var(--bg-elevated);
}
.pai-scope :root[data-theme="light"] .usage-pill-ring-bg{ stroke: var(--bg-hover); }
.pai-scope .usage-pill-ring-fill{
  fill: none;
  stroke: var(--primary);
  stroke-linecap: round;
  transition: stroke-dasharray 0.4s ease;
}
.pai-scope .usage-pill-ring-fill.is-warning{ stroke: var(--warning-fg); }
.pai-scope .usage-pill-ring-fill.is-error{ stroke: var(--error-fg); }
.pai-scope .usage-pill-icon-glyph{
  position: relative;
  width: 11px; height: 11px;
  color: var(--primary);
  z-index: 1;
}
.pai-scope .usage-pill-text{ display: flex; flex-direction: column; gap: 2px; line-height: 1; }
.pai-scope .usage-pill-pct{
  font-size: 11px; font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .usage-pill-value{
  font-size: 10px;
  color: var(--text-quaternary);
}

.pai-scope .btn-upgrade{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 36px;
  padding: 0 14px;
  border-radius: 9999px;
  background: var(--primary);
  color: var(--text-on-primary);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: filter 0.15s;
  flex-shrink: 0;
}
.pai-scope .btn-upgrade:hover{ filter: brightness(1.1); }
.pai-scope .btn-upgrade svg{ width: 12px; height: 12px; }

.pai-scope .breadcrumbs-bar{
  display: flex; align-items: center; gap: 12px;
  padding: 14px 24px 0;
}
.pai-scope .breadcrumbs{
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; color: var(--text-quaternary);
}
.pai-scope .breadcrumbs a{ color: var(--text-quaternary); transition: color 0.15s; }
.pai-scope .breadcrumbs a:hover{ color: var(--text-secondary); }
.pai-scope .breadcrumbs-sep{ color: var(--text-muted); }
.pai-scope .breadcrumbs-current{ color: var(--text-heading); font-weight: 500; }

.pai-scope .search{
  display: flex; align-items: center; gap: 8px;
  padding: 0 14px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  width: 240px; height: 36px;
  transition: border-color 0.15s, width 0.2s;
  flex-shrink: 0;
}
.pai-scope .search:focus-within{ border-color: var(--border-strong); width: 280px; }
.pai-scope .search-icon{ width: 14px; height: 14px; color: var(--text-quaternary); flex-shrink: 0; }
.pai-scope .search input{
  flex: 1; background: transparent; border: none;
  font-size: 13px; color: var(--text-primary);
  min-width: 0;
}
.pai-scope .search input::placeholder{ color: var(--text-quaternary); }

/* Theme icon button (definition continues from above) */
}
.pai-scope .theme-icon-btn:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .theme-icon-btn svg{ width: 16px; height: 16px; }
.pai-scope .theme-icon-btn .theme-icon-moon{ display: none; }
.pai-scope :root[data-theme="light"] .theme-icon-btn .theme-icon-sun{ display: none; }
.pai-scope :root[data-theme="light"] .theme-icon-btn .theme-icon-moon{ display: block; }

.pai-scope .org-picker-wrap{ position: relative; }
.pai-scope .org-picker-trigger{
  display: inline-flex; align-items: center; gap: 8px;
  height: 36px; padding: 0 12px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  color: var(--text-secondary);
  font-size: 13px; font-weight: 500;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
  flex-shrink: 0;
  cursor: pointer;
}

.pai-scope .account-pill-wrap{ position: relative; flex-shrink: 0; }
.pai-scope .account-pill{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 38px;
  padding: 4px 12px 4px 5px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
  flex-shrink: 0;
}
.pai-scope .account-pill:hover{
  background: var(--bg-elevated);
  border-color: var(--border-strong);
}
.pai-scope .account-pill .org-emblem{
  width: 28px; height: 28px;
  border-radius: 9999px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12px; font-weight: 700;
  flex-shrink: 0;
}
.pai-scope .account-pill .avatar{
  width: 28px; height: 28px;
  margin-left: -8px;
  border: 2px solid var(--bg-base);
  font-size: 11px;
  flex-shrink: 0;
}
.pai-scope .account-pill:hover .avatar{ border-color: var(--bg-elevated); }
.pai-scope .account-pill .chev{
  width: 14px; height: 14px;
  color: var(--text-quaternary);
  margin-left: 4px;
  transition: transform 0.18s;
  flex-shrink: 0;
}
.pai-scope .account-pill-wrap.open .chev{ transform: rotate(180deg); }

.pai-scope .account-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 300px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  padding: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 50;
}
.pai-scope :root[data-theme="light"] .account-menu{ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12); }
.pai-scope .account-pill-wrap.open .account-menu{ display: flex; }

.pai-scope .account-menu-section-label{
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.5px;
  color: var(--text-quaternary);
  text-transform: uppercase;
  padding: 8px 10px 4px;
}

.pai-scope .account-menu-ws-row{
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  font-size: 13px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
  background: transparent;
  border: none;
  width: 100%;
  text-align: left;
}
.pai-scope .account-menu-ws-row:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .account-menu-ws-row.is-active{ background: var(--primary-subtle); }
.pai-scope .account-menu-ws-row.is-active .account-menu-ws-name{ color: var(--text-heading); }
.pai-scope .account-menu-ws-row .org-emblem{
  width: 28px; height: 28px;
  border-radius: 8px;
  font-size: 12px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  flex-shrink: 0;
}
.pai-scope .account-menu-ws-text{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pai-scope .account-menu-ws-name{
  font-size: 13px; font-weight: 500;
  color: var(--text-secondary);
  line-height: 1.2;
}
.pai-scope .account-menu-ws-meta{
  font-size: 11px; color: var(--text-quaternary);
  line-height: 1.2;
}
.pai-scope .account-menu-ws-check{
  width: 14px; height: 14px;
  color: var(--primary);
  flex-shrink: 0;
}

.pai-scope .account-menu-user{
  display: flex; align-items: center; gap: 10px;
  padding: 10px;
  margin: 4px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.pai-scope .account-menu-user .avatar{ width: 32px; height: 32px; font-size: 12px; }
.pai-scope .account-menu-user-text{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pai-scope .account-menu-user-name{ font-size: 13px; font-weight: 600; color: var(--text-heading); line-height: 1.2; }
.pai-scope .account-menu-user-email{ font-size: 11px; color: var(--text-quaternary); line-height: 1.2; }
.pai-scope .org-picker-trigger:hover{
  background: var(--bg-elevated);
  border-color: var(--border-strong);
  color: var(--text-heading);
}
.pai-scope .org-picker-trigger .org-emblem{
  width: 22px; height: 22px;
  border-radius: 6px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 11px; font-weight: 700;
  flex-shrink: 0;
}
.pai-scope .org-picker-trigger .chev{ width: 14px; height: 14px; transition: transform 0.18s; }
.pai-scope .org-picker-wrap.open .org-picker-trigger .chev{ transform: rotate(180deg); }

.pai-scope .org-picker-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 240px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  padding: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 50;
}
.pai-scope :root[data-theme="light"] .org-picker-menu{ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12); }
.pai-scope .org-picker-wrap.open .org-picker-menu{ display: flex; }
.pai-scope .org-picker-item{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  color: var(--text-secondary);
  font-size: 13px; font-weight: 500;
  transition: background 0.12s, color 0.12s;
  cursor: pointer;
}
.pai-scope .org-picker-item:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .org-picker-item .org-emblem{ width: 22px; height: 22px; }
.pai-scope .org-picker-item.active{ background: var(--primary-subtle); color: var(--text-heading); }
.pai-scope .org-picker-item-meta{
  margin-left: auto;
  font-size: 11px; color: var(--text-quaternary);
}
.pai-scope .org-picker-divider{ height: 1px; background: var(--border); margin: 4px 2px; }

.pai-scope .btn{
  display: inline-flex; align-items: center; justify-content: center;
  gap: 6px;
  height: 40px;
  padding: 0 20px;
  border-radius: 100px;
  font-size: 14px; font-weight: 500; line-height: 1;
  white-space: nowrap;
  transition: filter 0.15s, background 0.15s, color 0.15s, border-color 0.15s;
  cursor: pointer;
  border: none;
}
.pai-scope .btn:hover{ filter: brightness(1.1); }
.pai-scope .btn-primary{ background: var(--primary); color: var(--text-on-primary); }
.pai-scope .btn-secondary{
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  color: var(--text-secondary);
}
.pai-scope .btn-secondary:hover{ filter: none; background: var(--bg-elevated); border-color: var(--border-input); color: var(--text-heading); }
.pai-scope .btn-ghost{
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--text-heading);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.pai-scope .btn-ghost:hover{ filter: none; background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.16); color: var(--text-heading); }
.pai-scope .btn-danger{ background: var(--error-fg); color: #fff; }
.pai-scope .btn-sm{ height: 32px; padding: 0 14px; font-size: 13px; }
.pai-scope .btn-lg{ height: 54px; padding: 0 8px 0 24px; font-size: 15px; font-weight: 500; gap: 10px; }
.pai-scope .btn-lg.btn-flat{ padding: 0 26px; }
.pai-scope .btn-icon-left svg{ width: 16px; height: 16px; }
.pai-scope .btn-block{ width: 100%; }

.pai-scope .btn .btn-arrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-left: 2px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.18);
  transition: transform 0.5s cubic-bezier(0.32, 0.72, 0, 1), background 0.3s cubic-bezier(0.32, 0.72, 0, 1);
}
.pai-scope .btn .btn-arrow svg{ width: 14px; height: 14px; }
.pai-scope .btn-lg .btn-arrow{ width: 36px; height: 36px; }
.pai-scope .btn-lg .btn-arrow svg{ width: 15px; height: 15px; }
.pai-scope .btn:hover .btn-arrow{ transform: translate(2px, -1px); background: rgba(255, 255, 255, 0.30); }
.pai-scope .btn-ghost .btn-arrow{ background: rgba(255, 255, 255, 0.06); }
.pai-scope .btn-ghost:hover .btn-arrow{ background: rgba(255, 255, 255, 0.14); }
.pai-scope .btn-primary{ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20), 0 14px 36px -18px var(--primary-ring); }
.pai-scope .btn-primary:hover{ background: var(--primary-hover); }
.pai-scope .btn:active{ transform: scale(0.98); }

.pai-scope .back-btn{
  width: 32px; height: 32px;
  border-radius: 9999px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  color: var(--text-tertiary);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.pai-scope .back-btn:hover{ background: var(--bg-hover); border-color: var(--border-strong); color: var(--text-heading); }
.pai-scope .back-btn svg{ width: 16px; height: 16px; }

.pai-scope .icon-btn{
  width: 38px; height: 38px;
  border-radius: 9999px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--text-tertiary);
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pai-scope .icon-btn:hover{ background: var(--bg-elevated); border-color: var(--border-strong); color: var(--text-heading); }
.pai-scope .icon-btn svg{ width: 16px; height: 16px; }
.pai-scope .icon-btn-sm{ width: 32px; height: 32px; }
.pai-scope .icon-btn-sm svg{ width: 14px; height: 14px; }

.pai-scope .avatar{
  width: 36px; height: 36px;
  border-radius: 9999px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  cursor: pointer;
  border: none;
  outline: none;
  text-transform: uppercase;
}
.pai-scope .avatar-sm{ width: 28px; height: 28px; font-size: 11px; }
.pai-scope .avatar-md{ width: 36px; height: 36px; font-size: 12px; }
.pai-scope .avatar-lg{ width: 48px; height: 48px; font-size: 16px; }
.pai-scope .avatar:focus-visible{ box-shadow: 0 0 0 2px var(--primary-ring); }
.pai-scope .avatar-emerald{ background: linear-gradient(135deg, #34d399 0%, #059669 100%); color: #fff; }
.pai-scope .avatar-amber{ background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%); color: #fff; }
.pai-scope .avatar-rose{ background: linear-gradient(135deg, #fb7185 0%, #e11d48 100%); color: #fff; }

.pai-scope .profile-wrap{ position: relative; }
.pai-scope .profile-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 240px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  padding: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 50;
}
.pai-scope :root[data-theme="light"] .profile-menu{ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12); }
.pai-scope .profile-wrap.open .profile-menu{ display: flex; }
.pai-scope .profile-header{
  padding: 10px 10px 12px;
  border-bottom: 1px solid var(--border);
  margin: -2px 0 4px;
}
.pai-scope .profile-header-name{ font-size: 14px; font-weight: 600; color: var(--text-heading); margin-bottom: 2px; }
.pai-scope .profile-header-email{ font-size: 12px; color: var(--text-quaternary); }
.pai-scope .profile-item{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  color: var(--text-secondary);
  font-size: 14px; font-weight: 500;
  transition: background 0.12s, color 0.12s;
  cursor: pointer;
  background: transparent;
  border: none;
  width: 100%;
  text-align: left;
}
.pai-scope .profile-item:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .profile-item svg{ width: 18px; height: 18px; flex-shrink: 0; color: var(--text-quaternary); }
.pai-scope .profile-item:hover svg{ color: var(--text-heading); }
.pai-scope .profile-item.is-danger{ color: var(--error-fg); }
.pai-scope .profile-item.is-danger svg{ color: var(--error-fg); }
.pai-scope .profile-item.is-danger:hover{ background: var(--error-bg); }
.pai-scope .profile-divider{ height: 1px; background: var(--border); margin: 4px 2px; }

.pai-scope .new-job-wrap{ position: relative; }
.pai-scope .new-job-trigger{ gap: 6px; }
.pai-scope .new-job-trigger .chev{ width: 14px; height: 14px; transition: transform 0.18s; }
.pai-scope .new-job-wrap.open .new-job-trigger .chev{ transform: rotate(180deg); }
.pai-scope .new-job-menu{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 280px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-lg);
  padding: 6px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 50;
}
.pai-scope :root[data-theme="light"] .new-job-menu{ box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12); }
.pai-scope .new-job-wrap.open .new-job-menu{ display: flex; }
.pai-scope .new-job-item{
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  border-radius: var(--radius-md);
  color: var(--text-secondary);
  transition: background 0.12s, color 0.12s;
  cursor: pointer;
}
.pai-scope .new-job-item:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .new-job-item-icon{
  width: 32px; height: 32px;
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary-light);
  flex-shrink: 0;
}
.pai-scope .new-job-item:hover .new-job-item-icon{ background: var(--primary-subtle); color: var(--primary); }
.pai-scope .new-job-item-icon svg{ width: 16px; height: 16px; }
.pai-scope .new-job-item-text{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pai-scope .new-job-item-title{ font-size: 14px; font-weight: 500; color: var(--text-heading); line-height: 1.2; }
.pai-scope .new-job-item-sub{ font-size: 12px; color: var(--text-quaternary); line-height: 1.2; }

.pai-scope .main{
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  background: var(--bg-base);
  position: relative;
}
.pai-scope .main:not(:has(.body-with-side)){
  background: var(--bg-deep);
}
.pai-scope .main:has(.body-with-side){
  background: var(--bg-deep);
}
.pai-scope .main:has(.body-with-side)::before{
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 364px;
  background: var(--bg-base);
  border-radius: 0 24px 24px 0;
  pointer-events: none;
  z-index: 0;
}
.pai-scope .main > *{ position: relative; z-index: 1; }

.pai-scope .body{
  flex: 1;
  padding: 24px 24px 80px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-width: 0;
}
.pai-scope .body:not(:has(.body-with-side)){
  max-width: 1360px;
  margin: 0 auto;
}

.pai-scope .card, .pai-scope .stat-card, .pai-scope .bot-card, .pai-scope .table-row:not(.table-row-head), .pai-scope .kb-row, .pai-scope .role-card, .pai-scope .pm-row, .pai-scope .activity-row, .pai-scope .account-menu, .pai-scope .profile-menu, .pai-scope .new-job-menu, .pai-scope .org-picker-menu{
  background: var(--bg-surface);
}

.pai-scope .card, .pai-scope .stat-card, .pai-scope .table-row:not(.table-row-head), .pai-scope .kb-row, .pai-scope .role-card, .pai-scope .activity-row{
  border: 0;
}
.pai-scope .table-row.is-link:hover, .pai-scope .kb-row:hover, .pai-scope .activity-row:hover{
  background: var(--bg-elevated);
}
.pai-scope a.stat-card:hover, .pai-scope .bot-card:hover{
  background: var(--bg-elevated);
}

.pai-scope .body-with-side{
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 20px;
  align-items: start;
  flex: 1;
}
.pai-scope .body-main{
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}
.pai-scope .body-side{
  position: sticky;
  top: 80px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: calc(100vh - 96px);
}

.pai-scope .activity-panel{
  background: transparent;
  border: none;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: calc(100vh - 96px);
}
.pai-scope .activity-panel-head{
  padding: 18px 18px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex-shrink: 0;
}
.pai-scope .activity-panel-title-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pai-scope .activity-panel-title{
  font-size: 14px;
  font-weight: 700;
  color: var(--text-heading);
  margin: 0;
  letter-spacing: -0.1px;
}
.pai-scope .activity-panel-link{
  font-size: 12px;
  font-weight: 500;
  color: var(--primary);
}
.pai-scope .activity-panel-link:hover{ color: var(--primary-hover); }
.pai-scope .activity-panel-sub{
  font-size: 12px;
  color: var(--text-quaternary);
  line-height: 1.4;
  margin: 0;
}

.pai-scope .activity-filters{
  display: flex;
  gap: 6px;
  padding: 8px 14px 12px;
  flex-shrink: 0;
}
.pai-scope .activity-filter-select{ position: relative; flex: 1; min-width: 0; }
.pai-scope .activity-filter-trigger{
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  height: 32px;
  padding: 0 8px 0 10px;
  background: var(--bg-elevated);
  border: none;
  border-radius: 8px;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}
.pai-scope .activity-filter-trigger:hover{
  background: var(--bg-hover);
  color: var(--text-heading);
}
.pai-scope .activity-filter-trigger-label{
  flex: 1;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pai-scope .activity-filter-trigger > svg:first-child{
  width: 12px; height: 12px;
  flex-shrink: 0;
  color: var(--text-quaternary);
}
.pai-scope .activity-filter-trigger-chev{
  width: 12px; height: 12px;
  color: var(--text-quaternary);
  flex-shrink: 0;
  transition: transform 0.18s;
}
.pai-scope .activity-filter-select.open .activity-filter-trigger-chev{ transform: rotate(180deg); }
.pai-scope .activity-filter-select.open .activity-filter-trigger{
  background: var(--bg-hover);
  color: var(--text-heading);
}

.pai-scope .activity-filter-menu{
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  padding: 4px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.40);
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 20;
}
.pai-scope :root[data-theme="light"] .activity-filter-menu{ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10); }
.pai-scope .activity-filter-select.open .activity-filter-menu{ display: flex; }
.pai-scope .activity-filter-option{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  background: transparent;
  border: none;
  width: 100%;
  text-align: left;
  transition: background 0.12s, color 0.12s;
}
.pai-scope .activity-filter-option:hover{
  background: var(--bg-hover);
  color: var(--text-heading);
}
.pai-scope .activity-filter-option.is-selected{
  background: var(--primary-subtle);
  color: var(--text-heading);
}
.pai-scope .activity-filter-option-count{
  margin-left: auto;
  font-size: 11px;
  color: var(--text-quaternary);
  font-variant-numeric: tabular-nums;
}
.pai-scope .activity-filter-option.is-selected .activity-filter-option-count{ color: var(--primary-light); }

.pai-scope .activity-side-list{
  display: flex;
  flex-direction: column;
  padding: 4px 14px 14px;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.pai-scope .activity-side-row{
  display: grid;
  grid-template-columns: 32px 1fr auto;
  gap: 10px;
  padding: 12px 4px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  align-items: center;
}
.pai-scope :root[data-theme="light"] .activity-side-row{
  border-bottom-color: rgba(0, 0, 0, 0.06);
}
.pai-scope .activity-side-row:last-child{ border-bottom: none; }
.pai-scope .activity-side-icon{
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--bg-surface) !important;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.30), 0 1px 2px rgba(0, 0, 0, 0.20);
}
.pai-scope :root[data-theme="light"] .activity-side-icon{
  background: var(--bg-surface) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
}
.pai-scope .activity-side-icon svg{ width: 14px; height: 14px; }
.pai-scope .activity-side-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .activity-side-title{
  font-size: 13px;
  font-weight: 500;
  color: var(--text-heading);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pai-scope .activity-side-bot{
  font-size: 11px;
  color: var(--text-quaternary);
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pai-scope .activity-side-time{
  font-size: 11px;
  color: var(--text-muted);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.pai-scope .page-header{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 4px 0 0;
  margin-bottom: 4px;
}
.pai-scope .page-header-left{ min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.pai-scope .page-title{
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.4px;
  line-height: 1;
  color: var(--text-heading);
  margin: 0;
}
.pai-scope .page-subtitle{
  font-size: 13px;
  color: var(--text-quaternary);
  line-height: 1.4;
  margin: 0;
}
.pai-scope .page-header-right{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pai-scope .section-title{
  font-size: 13px;
  font-weight: 500;
  color: var(--text-quaternary);
  letter-spacing: 0.2px;
  text-transform: uppercase;
  padding: 0 4px;
  margin: 0;
}

.pai-scope .notice{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px;
  background: var(--primary-subtle);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius-lg);
  color: var(--text-secondary);
  font-size: 13px;
}
.pai-scope .notice-icon{
  width: 28px; height: 28px;
  border-radius: 8px;
  background: var(--primary-muted-bg);
  color: var(--primary-light);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pai-scope .notice-icon svg{ width: 14px; height: 14px; }
.pai-scope .notice strong{ color: var(--text-heading); font-weight: 600; }
.pai-scope .notice a{ color: var(--primary); font-weight: 500; }
.pai-scope .notice a:hover{ text-decoration: underline; }
.pai-scope .notice-cta{ margin-left: auto; flex-shrink: 0; }

.pai-scope .card{
  background: var(--bg-base);
  border: 0;
  border-radius: 24px;
  padding: 17px;
}
.pai-scope .card-pad-lg{ padding: 24px; }
.pai-scope .card-title{
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  color: var(--text-heading);
  margin: 0;
  letter-spacing: -0.1px;
}
.pai-scope .card-subtitle{
  font-size: 12px;
  color: var(--text-quaternary);
  margin: 4px 0 0;
  line-height: 1.4;
}
.pai-scope .card-head{
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.pai-scope .card-head-text{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pai-scope .card-head-actions{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pai-scope .pro-banner{
  position: relative;
  display: grid;
  grid-template-columns: 1fr 380px;
  align-items: center;
  gap: 32px;
  background:
    radial-gradient(ellipse 80% 60% at 100% 50%, rgba(74, 216, 196, 0.45), transparent 60%),
    radial-gradient(ellipse 100% 80% at 0% 100%, rgba(31, 192, 171, 0.55), transparent 70%),
    linear-gradient(135deg, #0a1f3d 0%, #0a0a0e 100%);
  border-radius: 24px;
  padding: 36px 40px;
  overflow: hidden;
  text-decoration: none;
  min-height: 240px;
  transition: transform 0.18s ease;
}
.pai-scope .pro-banner::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.025) 0 1px, transparent 1px 12px);
  pointer-events: none;
}
.pai-scope .pro-banner:hover{
  transform: translateY(-2px);
}
.pai-scope .pro-banner-content{
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  max-width: 480px;
}
.pai-scope .pro-banner-eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.10);
  padding: 5px 10px;
  border-radius: 9999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.pai-scope .pro-banner-eyebrow svg{ width: 12px; height: 12px; }
.pai-scope .pro-banner-title{
  font-family: 'Geist', sans-serif;
  font-size: 34px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: -0.8px;
  line-height: 1.02;
  text-transform: uppercase;
}
.pai-scope .pro-banner-sub{
  font-size: 14px;
  color: rgba(255, 255, 255, 0.72);
  margin: 0;
  line-height: 1.5;
  max-width: 460px;
}
.pai-scope .pro-banner-cta{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  color: #1fc0ab;
  padding: 0 20px;
  height: 42px;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.1px;
  margin-top: 4px;
  transition: filter 0.15s, transform 0.15s;
}
.pai-scope .pro-banner:hover .pro-banner-cta{ filter: brightness(0.95); }
.pai-scope .pro-banner-cta svg{ width: 14px; height: 14px; }
.pai-scope .pro-banner-cta-icon{
  width: 18px; height: 18px;
  border-radius: 50%;
  background: rgba(31, 192, 171, 0.12);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pai-scope .pro-banner-cta-icon svg{ width: 10px; height: 10px; }

.pai-scope .pro-banner-visual{
  position: relative;
  height: 100%;
  min-height: 200px;
  z-index: 2;
}
.pai-scope .pro-mock{
  position: absolute;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  padding: 12px 14px;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.30);
}
.pai-scope .pro-mock-icon{
  width: 28px; height: 28px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pai-scope .pro-mock-icon svg{ width: 14px; height: 14px; }
.pai-scope .pro-mock-meta{ font-size: 10px; color: rgba(255,255,255,0.55); margin-top: 2px; font-weight: 400; }
.pai-scope .pro-mock-text{ display: flex; flex-direction: column; min-width: 0; }
.pai-scope .pro-mock-1{
  top: 12px;
  right: 32px;
  transform: rotate(-3deg);
}
.pai-scope .pro-mock-1 .pro-mock-icon{ background: rgba(74, 216, 196, 0.20); color: #4ad8c4; }
.pai-scope .pro-mock-2{
  top: 90px;
  right: 140px;
  transform: rotate(2deg);
}
.pai-scope .pro-mock-2 .pro-mock-icon{ background: rgba(94, 234, 212, 0.18); color: #5eead4; }
.pai-scope .pro-mock-3{
  bottom: 16px;
  right: 0;
  transform: rotate(-1deg);
}
.pai-scope .pro-mock-3 .pro-mock-icon{ background: rgba(192, 132, 252, 0.20); color: #c084fc; }

.pai-scope .pro-banner-sparkle{
  position: absolute;
  pointer-events: none;
  z-index: 1;
  color: rgba(255, 255, 255, 0.35);
}
.pai-scope .pro-banner-sparkle-1{ top: 18%; right: 56%; width: 16px; height: 16px; }
.pai-scope .pro-banner-sparkle-2{ bottom: 28%; right: 70%; width: 12px; height: 12px; color: rgba(74, 216, 196, 0.5); }

@media (max-width: 1280px) {
  .pai-scope .pro-banner{ grid-template-columns: 1fr; }
  .pai-scope .pro-banner-visual{ display: none; }
}

.pai-scope .overview-card{
  padding: 0;
  overflow: hidden;
  background: #131316;
  border: none;
}
.pai-scope :root[data-theme="light"] .overview-card{ background: #ededee; }
.pai-scope .overview-grid{
  display: grid;
  grid-template-columns: minmax(280px, 320px) 1fr;
}
.pai-scope .overview-info{
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
}
.pai-scope .overview-info::before{
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 80% 60% at 0% 0%, rgba(31, 192, 171, 0.16), transparent 70%),
    radial-gradient(ellipse 60% 50% at 30% 100%, rgba(192, 132, 252, 0.08), transparent 70%);
  pointer-events: none;
  border-radius: inherit;
}
.pai-scope :root[data-theme="light"] .overview-info::before{
  background:
    radial-gradient(ellipse 80% 60% at 0% 0%, rgba(31, 192, 171, 0.08), transparent 70%),
    radial-gradient(ellipse 60% 50% at 30% 100%, rgba(192, 132, 252, 0.05), transparent 70%);
}
.pai-scope .overview-info > *{ position: relative; z-index: 1; }

.pai-scope .overview-info-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pai-scope .overview-info-title{
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.1px;
  color: var(--text-heading);
  margin: 0;
}
.pai-scope .overview-info-sub{
  font-size: 13px;
  color: var(--text-quaternary);
  line-height: 1.5;
  margin: 0 0 6px;
}
.pai-scope .overview-info-sub strong{ color: var(--text-secondary); font-weight: 600; }

.pai-scope .overview-legend{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pai-scope .overview-legend li{
  display: grid;
  grid-template-columns: 14px 1fr auto;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--text-tertiary);
}
.pai-scope .overview-dot{
  width: 14px; height: 14px;
  border-radius: 5px;
  flex-shrink: 0;
}
.pai-scope .overview-legend strong{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
  letter-spacing: -0.1px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .overview-legend-with-delta .legend-stat{
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}
.pai-scope .overview-legend-with-delta .legend-delta{
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.pai-scope .overview-legend-with-delta .legend-delta.up{ color: var(--success-fg); }
.pai-scope .overview-legend-with-delta .legend-delta.down{ color: var(--error-fg); }

.pai-scope .overview-legend-horizontal{
  list-style: none;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  padding: 6px 0 0;
  margin: 0;
  border-top: 1px solid var(--border);
}
.pai-scope .overview-legend-horizontal li{
  display: grid;
  grid-template-columns: 12px 1fr;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 0 0;
}
.pai-scope .overview-legend-horizontal .overview-dot{
  width: 12px;
  height: 12px;
  border-radius: 4px;
  margin-top: 4px;
}
.pai-scope .overview-legend-horizontal .legend-label-stack{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.pai-scope .overview-legend-horizontal .legend-name{
  font-size: 12px;
  color: var(--text-tertiary);
  font-weight: 500;
}
.pai-scope .overview-legend-horizontal .legend-stat{
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
}
.pai-scope .overview-legend-horizontal strong{
  font-size: 18px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.3px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .overview-legend-horizontal .legend-delta{
  font-size: 11px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.pai-scope .overview-legend-horizontal .legend-delta.up{ color: var(--success-fg); }
.pai-scope .overview-legend-horizontal .legend-delta.down{ color: var(--error-fg); }

.pai-scope .overview-card-full .overview-stack{
  display: flex;
  flex-direction: column;
}
.pai-scope .overview-card-full .overview-chart{
  min-height: 220px;
}

.pai-scope .overview-chart{
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-height: 240px;
}
.pai-scope .overview-chart-head{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.pai-scope .overview-chart-bars{
  flex: 1;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  align-items: end;
  gap: 12px;
  padding: 8px 8px 0;
}
.pai-scope .ov-day{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  height: 100%;
}
.pai-scope .ov-day-label{
  font-size: 11px;
  color: var(--text-quaternary);
  letter-spacing: 0.3px;
}
.pai-scope .ov-bars-pair{
  flex: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
}
.pai-scope .ov-bar{
  width: 20px;
  height: 100%;
  border-radius: 8px;
  display: flex;
  flex-direction: column-reverse;
  overflow: hidden;
  transition: filter 0.18s ease;
  position: relative;
}
.pai-scope .ov-bar-fill{
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: transparent;
  border-radius: 8px;
  display: flex;
  flex-direction: column-reverse;
  overflow: hidden;
}
.pai-scope .ov-bar-seg{ width: 100%; flex-shrink: 0; }
.pai-scope .ov-bar-seg.s-msg{ background: var(--primary); }
.pai-scope .ov-bar-seg.s-ses{ background: #fbbf24; }
.pai-scope .ov-bar-seg.s-tok{ background: #4ad8c4; }
.pai-scope .ov-bar-seg.s-avg{ background: #5eead4; }
.pai-scope .ov-day .ov-bar{ filter: saturate(0.55) brightness(0.85); }
.pai-scope .ov-day:hover .ov-bar, .pai-scope .ov-day.is-active .ov-bar{ filter: saturate(1) brightness(1); }
.pai-scope .ov-day.is-active .ov-day-label{ color: var(--text-heading); font-weight: 600; }

.pai-scope .overview-chart-bars{ position: relative; }
.pai-scope .ov-day{ position: relative; cursor: pointer; }
.pai-scope .ov-tooltip{
  position: absolute;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 10px 12px;
  min-width: 168px;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.40);
  z-index: 5;
  display: none;
  flex-direction: column;
  gap: 6px;
  pointer-events: none;
  transition: left 0.18s ease;
}
.pai-scope .ov-tooltip.is-shown{ display: flex; }
.pai-scope :root[data-theme="light"] .ov-tooltip{ box-shadow: 0 12px 24px rgba(0, 0, 0, 0.10); }
.pai-scope .ov-tooltip-date{
  font-size: 11px;
  color: var(--text-quaternary);
  letter-spacing: 0.3px;
  margin-bottom: 2px;
}
.pai-scope .ov-tooltip-row{
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--text-tertiary);
}
.pai-scope .ov-tooltip-row .overview-dot{ width: 10px; height: 10px; border-radius: 3px; }
.pai-scope .ov-tooltip-row strong{
  font-size: 12px;
  font-weight: 600;
  color: var(--text-heading);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 1280px) {
  .pai-scope .overview-grid{ grid-template-columns: 1fr; }
  .pai-scope .overview-info{ border-right: none; border-bottom: 1px solid var(--border); }
}

.pai-scope .stats-row{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.pai-scope .stats-row-3{ grid-template-columns: repeat(3, 1fr); }
.pai-scope .stats-row-2{ grid-template-columns: repeat(2, 1fr); }
.pai-scope .stat-card{
  background: var(--bg-base);
  border: 0;
  border-radius: 24px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 120px;
  transition: background 0.15s, border-color 0.15s;
}
.pai-scope a.stat-card{ text-decoration: none; }
.pai-scope a.stat-card:hover{ background: var(--bg-surface); border-color: var(--border-strong); }
.pai-scope a.stat-card:hover .stat-arrow{ color: var(--text-heading); transform: translateX(2px); }
.pai-scope .stat-head{ display: flex; align-items: center; gap: 10px; }
.pai-scope .stat-icon-wrap{
  width: 32px; height: 32px;
  border-radius: var(--radius-full);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  color: var(--text-secondary);
  flex-shrink: 0;
}
.pai-scope .stat-icon-wrap svg{ width: 14px; height: 14px; }
.pai-scope .stat-label{
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.4px;
  line-height: 1;
  color: var(--text-quaternary);
  text-transform: uppercase;
}
.pai-scope .stat-arrow{
  margin-left: auto;
  width: 16px; height: 16px;
  color: var(--text-quaternary);
  transition: color 0.15s, transform 0.15s;
}
.pai-scope .stat-body{ display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.pai-scope .stat-value{
  font-size: 28px;
  font-weight: 700;
  line-height: 1;
  color: var(--text-heading);
  letter-spacing: -0.5px;
}
.pai-scope .stat-delta{
  font-size: 12px; font-weight: 500;
  display: inline-flex; align-items: center; gap: 4px;
  color: var(--text-quaternary);
}
.pai-scope .stat-delta.up{ color: var(--success-fg); }
.pai-scope .stat-delta.down{ color: var(--error-fg); }
.pai-scope .stat-delta svg{ width: 12px; height: 12px; }
.pai-scope .stat-foot{
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.3;
}

.pai-scope .badge{
  display: inline-flex; align-items: center; justify-content: center;
  gap: 5px;
  min-height: 22px;
  padding: 0 8px;
  border-radius: var(--radius-full);
  font-size: 12px; font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  border: none;
}
.pai-scope .badge svg{ width: 11px; height: 11px; }
.pai-scope .badge-dot{
  width: 6px; height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.pai-scope .badge-primary{ background: var(--primary-subtle); color: var(--primary-light); }
.pai-scope .badge-success{ background: var(--success-bg); color: var(--success-fg); }
.pai-scope .badge-warning{ background: var(--warning-bg); color: var(--warning-fg); }
.pai-scope .badge-queue{ background: var(--queue-bg);   color: var(--queue-fg); }
.pai-scope .badge-error{ background: var(--error-bg);   color: var(--error-fg); }
.pai-scope .badge-purple{ background: var(--purple-bg);  color: var(--purple-fg); }
.pai-scope .badge-info{ background: var(--info-bg);    color: var(--info-fg); }
.pai-scope .badge-neutral{ background: var(--bg-elevated); color: var(--text-tertiary); }

.pai-scope .table-card{
  background: transparent;
  border: none;
  padding: 0;
}
.pai-scope .table-head{
  display: flex; justify-content: space-between; align-items: center;
  padding: 0 0 12px;
}
.pai-scope .table-head-text{ display: flex; flex-direction: column; gap: 2px; }
.pai-scope .link-primary{
  font-size: 13px;
  font-weight: 500;
  color: var(--primary);
}
.pai-scope .link-primary:hover{ color: var(--primary-hover); }

.pai-scope .table{ display: flex; flex-direction: column; gap: 6px; }
.pai-scope .table-row{
  display: grid;
  gap: 16px;
  padding: 14px 18px;
  align-items: center;
  background: var(--bg-base);
  border: 0;
  border-radius: 16px;
  transition: background 0.15s, border-color 0.15s;
}
.pai-scope .table-row.is-link{ cursor: pointer; }
.pai-scope .table-row.is-link:hover{ background: var(--bg-hover); border-color: var(--border-strong); }
.pai-scope .table-row-head{
  cursor: default;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 4px 18px 8px;
}
.pai-scope .table-row-head:hover{ background: transparent; border-color: transparent; }
.pai-scope .table-row-head .col{
  font-size: 11px;
  font-weight: 500;
  color: var(--text-quaternary);
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.pai-scope .col{ font-size: 14px; color: var(--text-tertiary); line-height: 1.3; min-width: 0; }
.pai-scope .col-strong{ color: var(--text-heading); font-weight: 500; }
.pai-scope .col-sub{ font-size: 12px; color: var(--text-quaternary); margin-top: 2px; }
.pai-scope .col-actions{
  display: flex; align-items: center; justify-content: flex-end; gap: 8px;
}
.pai-scope .col-actions .row-action{
  font-size: 13px; font-weight: 500;
  color: var(--text-quaternary);
  padding: 6px 12px;
  border-radius: var(--radius-full);
  background: transparent;
  border: 1px solid transparent;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  cursor: pointer;
}
.pai-scope .col-actions .row-action:hover{
  background: var(--bg-elevated);
  border-color: var(--border-strong);
  color: var(--text-heading);
}
.pai-scope .col-actions .row-action.is-danger{ color: var(--error-fg); }
.pai-scope .col-actions .row-action.is-danger:hover{ background: var(--error-bg); border-color: var(--error-border); color: var(--error-fg); }

.pai-scope .col-with-thumb{ display: flex; align-items: center; gap: 12px; }
.pai-scope .bot-thumb{
  width: 40px; height: 40px;
  border-radius: 12px;
  background: var(--bg-elevated);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary-light);
  flex-shrink: 0;
  font-size: 18px;
}
.pai-scope .bot-thumb svg{ width: 20px; height: 20px; }
.pai-scope .bot-thumb-emerald{ background: rgba(52, 211, 153, 0.14); color: #34d399; }
.pai-scope .bot-thumb-amber{ background: rgba(251, 191, 36, 0.14); color: #fbbf24; }
.pai-scope .bot-thumb-purple{ background: rgba(192, 132, 252, 0.14); color: #c084fc; }
.pai-scope .bot-thumb-rose{ background: rgba(251, 113, 133, 0.14); color: #fb7185; }

.pai-scope .form-group{ display: flex; flex-direction: column; gap: 8px; }
.pai-scope .form-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pai-scope .form-label{
  font-size: 13px;
  font-weight: 500;
  color: var(--text-secondary);
  line-height: 1;
}
.pai-scope .form-help{
  font-size: 12px;
  color: var(--text-quaternary);
  line-height: 1.4;
}
.pai-scope .form-input, .pai-scope .form-textarea, .pai-scope .form-select{
  width: 100%;
  height: 40px;
  padding: 0 14px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  color: var(--text-primary);
  font-size: 14px;
  font-family: inherit;
  transition: border-color 0.15s, box-shadow 0.15s, background 0.15s;
}
.pai-scope .form-textarea{
  height: auto;
  min-height: 96px;
  padding: 12px 14px;
  resize: vertical;
  line-height: 1.5;
}
.pai-scope .form-select{
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23a3a3a3' stroke-width='1.67' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
}
.pai-scope .form-input::placeholder, .pai-scope .form-textarea::placeholder{ color: var(--text-placeholder); }
.pai-scope .form-input:focus, .pai-scope .form-textarea:focus, .pai-scope .form-select:focus{
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}
.pai-scope .form-input.is-mono, .pai-scope .form-textarea.is-mono{ font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace; font-size: 13px; }

.pai-scope .toggle{
  position: relative;
  width: 38px; height: 22px;
  background: var(--bg-interactive);
  border-radius: 9999px;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.18s;
}
.pai-scope .toggle::after{
  content: '';
  position: absolute;
  top: 2px; left: 2px;
  width: 18px; height: 18px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.18s;
  box-shadow: 0 1px 2px rgba(0,0,0,0.2);
}
.pai-scope .toggle.is-on{ background: var(--primary); }
.pai-scope .toggle.is-on::after{ transform: translateX(16px); }
.pai-scope .toggle.is-disabled{ opacity: 0.4; cursor: not-allowed; }
.pai-scope .toggle-row{
  display: grid;
  grid-template-columns: 38px 1fr auto;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 0;
}
.pai-scope .toggle-row + .toggle-row{ border-top: 1px solid var(--border); }
.pai-scope .toggle-row-text{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pai-scope .toggle-row-title{ font-size: 14px; font-weight: 500; color: var(--text-heading); line-height: 1.2; }
.pai-scope .toggle-row-sub{ font-size: 12px; color: var(--text-quaternary); line-height: 1.4; }
.pai-scope .toggle-row-cta{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pai-scope .slider-row{
  display: flex; flex-direction: column; gap: 8px;
}
.pai-scope .slider-labels{
  display: flex; justify-content: space-between;
  font-size: 11px; color: var(--text-quaternary);
}
.pai-scope .slider{
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  background: var(--bg-elevated);
  border-radius: 9999px;
  outline: none;
}
.pai-scope .slider::-webkit-slider-thumb{
  -webkit-appearance: none;
  appearance: none;
  width: 16px; height: 16px;
  background: var(--primary);
  border-radius: 50%;
  border: 3px solid var(--bg-base);
  box-shadow: 0 0 0 1px var(--primary);
  cursor: pointer;
}
.pai-scope .slider::-moz-range-thumb{
  width: 16px; height: 16px;
  background: var(--primary);
  border-radius: 50%;
  border: 3px solid var(--bg-base);
  cursor: pointer;
}

.pai-scope .checkbox-row{
  display: flex; align-items: center; gap: 10px;
  font-size: 14px;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 6px 0;
}
.pai-scope .checkbox-row input{ display: none; }
.pai-scope .check-box{
  width: 18px; height: 18px;
  border-radius: var(--radius-xs);
  border: 1.5px solid var(--border-input);
  background: var(--bg-base);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background 0.12s, border-color 0.12s;
}
.pai-scope .check-box svg{ width: 12px; height: 12px; color: #fff; opacity: 0; transition: opacity 0.12s; }
.pai-scope .checkbox-row input:checked ~ .check-box{ background: var(--primary); border-color: var(--primary); }
.pai-scope .checkbox-row input:checked ~ .check-box svg{ opacity: 1; }

.pai-scope .tabs{
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.pai-scope .tabs::-webkit-scrollbar{ display: none; }
.pai-scope .tab{
  position: relative;
  padding: 8px 14px;
  background: transparent;
  border: none;
  border-radius: 9999px;
  font-size: 13px; font-weight: 500;
  color: var(--text-tertiary);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .tab:hover{
  color: var(--text-secondary);
  background: var(--bg-hover);
}
.pai-scope .tab.active{
  color: var(--text-heading);
  background: var(--bg-elevated);
  font-weight: 600;
}
.pai-scope .tab.is-danger{ color: var(--error-fg); }
.pai-scope .tab.is-danger:hover{ background: var(--error-bg); color: var(--error-fg); }
.pai-scope .tab.is-danger.active{ background: var(--error-bg); color: var(--error-fg); }

.pai-scope .tab-panel{ display: none; }
.pai-scope .tab-panel.active{ display: flex; flex-direction: column; gap: 16px; }

.pai-scope .tab-panel[data-panel="knowledge"] > .card{
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 8px 0 0;
}

.pai-scope .bots-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pai-scope .bot-card{
  background: var(--bg-elevated);
  border: none;
  border-radius: 24px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: background 0.18s ease, transform 0.18s ease;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  position: relative;
}
.pai-scope .bot-card:hover{
  background: var(--bg-hover);
  transform: translateY(-2px);
}
.pai-scope .bot-card:active{ transform: translateY(0); }
.pai-scope .bot-card > *{ position: relative; z-index: 1; }

.pai-scope .bot-card-head{
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}
.pai-scope .bot-card-thumb{
  width: 56px; height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end) 100%);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: #fff;
  transition: transform 0.18s ease;
}
.pai-scope .bot-card:hover .bot-card-thumb{ transform: scale(1.04); }
.pai-scope .bot-card-thumb svg{ width: 26px; height: 26px; }

.pai-scope .bot-thumb-emerald{
  background: linear-gradient(135deg, #34d399 0%, #059669 100%);
}
.pai-scope .bot-thumb-amber{
  background: linear-gradient(135deg, #fbbf24 0%, #d97706 100%);
}
.pai-scope .bot-thumb-rose{
  background: linear-gradient(135deg, #fb7185 0%, #e11d48 100%);
}

.pai-scope .bot-card-info{ display: flex; flex-direction: column; gap: 4px; }
.pai-scope .bot-card-name{
  font-size: 16px; font-weight: 600;
  color: var(--text-heading);
  line-height: 1.2;
  margin: 0;
  letter-spacing: -0.1px;
}
.pai-scope .bot-card-type{
  font-size: 12px; color: var(--text-quaternary);
  margin-top: 2px;
}
.pai-scope .bot-card-stats{
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  padding-top: 4px;
}
.pai-scope .bot-card-stat{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  position: relative;
  cursor: help;
}
.pai-scope .bot-card-stat-icon{
  width: 16px; height: 16px;
  color: var(--text-quaternary);
  flex-shrink: 0;
  display: inline-flex;
  transition: color 0.15s;
}
.pai-scope .bot-card-stat-icon svg{ width: 16px; height: 16px; }
.pai-scope .bot-card-stat-value{
  font-size: 14px; font-weight: 600;
  color: var(--text-heading);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.pai-scope .bot-card-stat:hover .bot-card-stat-icon{ color: var(--text-secondary); }

.pai-scope .bot-card-stat[data-tooltip]::after{
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: var(--bg-deep);
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 500;
  color: var(--text-heading);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease, transform 0.15s ease;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.40);
  z-index: 10;
  letter-spacing: 0.1px;
}
.pai-scope :root[data-theme="light"] .bot-card-stat[data-tooltip]::after{
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.10);
}
.pai-scope .bot-card-stat[data-tooltip]::before{
  content: '';
  position: absolute;
  bottom: calc(100% + 1px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  border: 5px solid transparent;
  border-top-color: var(--border-strong);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease, transform 0.15s ease;
  z-index: 10;
}
.pai-scope .bot-card-stat[data-tooltip]:hover::after, .pai-scope .bot-card-stat[data-tooltip]:hover::before{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.pai-scope .bot-card-usage{
  display: flex; flex-direction: column; gap: 6px;
  margin-top: auto;
}
.pai-scope .bot-card-usage-head{
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 11px;
}
.pai-scope .bot-card-usage-label{
  color: var(--text-quaternary);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.pai-scope .bot-card-usage-value{
  color: var(--text-secondary);
  font-weight: 600;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .bot-card-progress{
  height: 6px;
  width: 100%;
  background: rgba(255, 255, 255, 0.06);
  border-radius: 9999px;
  overflow: hidden;
}
.pai-scope :root[data-theme="light"] .bot-card-progress{ background: rgba(0, 0, 0, 0.06); }
.pai-scope .bot-card-progress-fill{
  height: 100%;
  background: linear-gradient(90deg, var(--primary) 0%, var(--primary-end) 100%);
  border-radius: 9999px;
}
.pai-scope .bot-card-actions{
  display: flex; gap: 8px;
}
.pai-scope .bot-card-actions .btn{ flex: 1; }

.pai-scope .bot-card-locked{
  background: transparent;
  border: 1px dashed var(--border-strong);
  border-radius: 24px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  min-height: 224px;
}
.pai-scope .bot-card-locked-icon{
  width: 48px; height: 48px;
  border-radius: 9999px;
  background: var(--primary-subtle);
  color: var(--primary-light);
  display: flex; align-items: center; justify-content: center;
}
.pai-scope .bot-card-locked-icon svg{ width: 20px; height: 20px; }
.pai-scope .bot-card-locked-title{ font-size: 14px; font-weight: 600; color: var(--text-secondary); }
.pai-scope .bot-card-locked-sub{ font-size: 12px; color: var(--text-quaternary); }

.pai-scope .chart-card{ padding: 20px; display: flex; flex-direction: column; gap: 16px; }
.pai-scope .chart{
  display: flex;
  flex-direction: column;
  height: 260px;
}
.pai-scope .chart-bars{
  flex: 1;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  padding: 8px 0 0;
  min-height: 180px;
}
.pai-scope .bar-wrap{
  flex: 1;
  height: 100%;
  display: flex;
  align-items: flex-end;
  position: relative;
}
.pai-scope .bar{
  width: 100%;
  background: var(--bg-elevated);
  border-radius: 6px 6px 0 0;
  position: relative;
  overflow: hidden;
  transition: filter 0.15s;
}
.pai-scope .bar-fill{
  position: absolute;
  bottom: 0; left: 0; right: 0;
  background: var(--primary);
  border-radius: 6px 6px 0 0;
}
.pai-scope .bar-wrap:hover .bar-fill{ filter: brightness(1.15); }
.pai-scope .bar-wrap:last-child .bar-fill{ background: linear-gradient(180deg, var(--primary-end) 0%, var(--primary) 100%); }
.pai-scope .chart-axis{
  display: flex; justify-content: space-between;
  padding: 12px 0 0;
  margin-top: 4px;
  font-size: 11px;
  color: var(--text-muted);
  letter-spacing: 0.3px;
}

.pai-scope .range-picker{
  display: inline-flex; align-items: center; gap: 2px;
  padding: 3px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius-full);
}
.pai-scope .range-picker-btn{
  height: 28px;
  padding: 0 12px;
  border-radius: var(--radius-full);
  background: transparent;
  color: var(--text-quaternary);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .range-picker-btn:hover{ color: var(--text-secondary); }
.pai-scope .range-picker-btn[aria-pressed="true"]{
  background: var(--bg-base);
  color: var(--text-heading);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
.pai-scope :root[data-theme="light"] .range-picker-btn[aria-pressed="true"]{ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06); }

.pai-scope .bar-list{ display: flex; flex-direction: column; gap: 14px; }
.pai-scope .bar-list-row{ display: flex; flex-direction: column; gap: 6px; }
.pai-scope .bar-list-row-head{
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px;
}
.pai-scope .bar-list-row-name{
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text-secondary);
  min-width: 0;
}
.pai-scope .bar-list-row-name-text{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pai-scope .bar-list-row-value{
  font-size: 13px; font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .bar-list-row-track{
  height: 4px; width: 100%;
  background: var(--bg-elevated);
  border-radius: 9999px;
  overflow: hidden;
}
.pai-scope .bar-list-row-fill{
  height: 100%;
  background: var(--primary);
  border-radius: 9999px;
}

.pai-scope .q-list{ display: flex; flex-direction: column; gap: 4px; }
.pai-scope .q-row{
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 10px 4px;
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.4;
}
.pai-scope .q-row:last-child{ border-bottom: none; }
.pai-scope .q-row-text{ min-width: 0; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pai-scope .q-row-count{
  font-size: 12px; font-weight: 600;
  color: var(--text-quaternary);
  flex-shrink: 0;
}

.pai-scope .locked-card{ position: relative; overflow: hidden; }
.pai-scope .locked-card-content{ filter: blur(8px); opacity: 0.6; pointer-events: none; user-select: none; }
.pai-scope .locked-overlay{
  position: absolute;
  inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  gap: 6px;
  background: linear-gradient(180deg, rgba(24,24,27,0.4) 0%, rgba(24,24,27,0.85) 100%);
  border-radius: 24px;
  padding: 24px;
}
.pai-scope :root[data-theme="light"] .locked-overlay{
  background: linear-gradient(180deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.9) 100%);
}
.pai-scope .locked-icon{
  width: 44px; height: 44px;
  border-radius: 9999px;
  background: var(--primary-subtle);
  color: var(--primary-light);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 4px;
}
.pai-scope .locked-icon svg{ width: 18px; height: 18px; }
.pai-scope .locked-title{ font-size: 14px; font-weight: 700; color: var(--text-heading); margin: 0; }
.pai-scope .locked-sub{ font-size: 12px; color: var(--text-quaternary); max-width: 280px; line-height: 1.5; margin: 0 0 8px; }

.pai-scope .kb-list{ display: flex; flex-direction: column; gap: 8px; }
.pai-scope .kb-row{
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  background: var(--bg-base);
  border: 0;
  border-radius: 14px;
  transition: background 0.15s, border-color 0.15s;
}
.pai-scope .kb-row:hover{ background: var(--bg-hover); border-color: var(--border-strong); }
.pai-scope .kb-icon{
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--bg-elevated);
  display: flex; align-items: center; justify-content: center;
  color: var(--text-tertiary);
}
.pai-scope .kb-icon svg{ width: 18px; height: 18px; }
.pai-scope .kb-row-name{
  font-size: 14px; font-weight: 500;
  color: var(--text-heading);
  line-height: 1.2;
  margin-bottom: 4px;
}
.pai-scope .kb-row-meta{
  font-size: 11px; color: var(--text-quaternary);
  line-height: 1;
}

.pai-scope .code-box{
  background: var(--bg-deep);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.6;
  overflow-x: auto;
  position: relative;
}
.pai-scope .code-box code{ color: var(--primary-light); }
.pai-scope .code-box .code-copy{
  position: absolute;
  top: 8px; right: 8px;
}

.pai-scope .widget-preview{
  background: var(--bg-elevated);
  border-radius: 16px;
  padding: 16px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 380px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--border);
}
.pai-scope .widget-preview-bg{
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 30% 30%, var(--primary-subtle), transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(192, 132, 252, 0.10), transparent 50%);
  opacity: 0.7;
}
.pai-scope .widget-preview-window{
  position: relative;
  width: 320px;
  background: var(--bg-base);
  border: 1px solid var(--border-strong);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 24px 48px rgba(0,0,0,0.30), 0 8px 16px rgba(0,0,0,0.16);
}
.pai-scope :root[data-theme="light"] .widget-preview-window{ box-shadow: 0 24px 48px rgba(0,0,0,0.10), 0 8px 16px rgba(0,0,0,0.06); }
.pai-scope .widget-preview-header{
  padding: 14px 16px;
  background: var(--primary);
  color: #fff;
}
.pai-scope .widget-preview-title{ font-size: 14px; font-weight: 600; margin: 0; }
.pai-scope .widget-preview-status{
  font-size: 11px; opacity: 0.85;
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 4px;
}
.pai-scope .widget-preview-status::before{
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #4ade80;
  box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.25);
}
.pai-scope .widget-preview-body{ padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.pai-scope .widget-preview-msg{
  background: var(--bg-elevated);
  padding: 10px 12px;
  border-radius: 12px 12px 12px 4px;
  font-size: 13px;
  color: var(--text-primary);
  line-height: 1.4;
  max-width: 80%;
}
.pai-scope .widget-preview-chip{
  align-self: flex-end;
  background: var(--primary-subtle);
  color: var(--primary);
  padding: 8px 12px;
  border-radius: 12px 12px 4px 12px;
  font-size: 13px;
  font-weight: 500;
}
.pai-scope .widget-preview-input{
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid var(--border);
}
.pai-scope .widget-preview-input-field{
  flex: 1;
  height: 32px;
  border: 1px solid var(--border-strong);
  border-radius: 9999px;
  padding: 0 12px;
  font-size: 12px;
  color: var(--text-quaternary);
  display: flex; align-items: center;
}
.pai-scope .widget-preview-send{
  width: 32px; height: 32px;
  background: var(--primary);
  color: #fff;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.pai-scope .widget-preview-send svg{ width: 14px; height: 14px; }
.pai-scope .widget-preview-footer{
  text-align: center;
  font-size: 10px;
  color: var(--text-muted);
  padding: 6px 12px 10px;
}
.pai-scope .widget-preview-fab{
  position: absolute;
  bottom: 16px; right: 16px;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--primary);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  box-shadow: 0 8px 16px rgba(31, 192, 171, 0.30);
}
.pai-scope .widget-preview-fab svg{ width: 22px; height: 22px; }

.pai-scope .roles-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pai-scope .role-card{
  padding: 18px;
  border-radius: 16px;
  border: 0;
  background: var(--bg-base);
  display: flex; flex-direction: column; gap: 10px;
}
.pai-scope .role-card.is-current{
  background: var(--primary-subtle);
  border-color: var(--border-accent);
}
.pai-scope .role-card-head{
  display: flex; align-items: center; gap: 10px;
}
.pai-scope .role-card-name{
  font-size: 14px; font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .role-card-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex; flex-direction: column; gap: 6px;
}
.pai-scope .role-card-list li{
  font-size: 12px;
  color: var(--text-tertiary);
  display: flex; align-items: flex-start; gap: 8px;
  line-height: 1.4;
}
.pai-scope .role-card-list li::before{
  content: '';
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--text-muted);
  margin-top: 7px;
  flex-shrink: 0;
}

.pai-scope .plans-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.pai-scope .plan-card{
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 24px;
  padding: 24px;
  display: flex; flex-direction: column; gap: 16px;
  position: relative;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .plan-card.is-featured{
  border-color: var(--primary);
  background: linear-gradient(180deg, var(--primary-subtle) 0%, var(--bg-base) 60%);
}
.pai-scope .plan-card-badge{
  position: absolute;
  top: -10px; left: 24px;
}
.pai-scope .plan-card-name{
  font-size: 18px; font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
  margin: 0;
}
.pai-scope .plan-card-price{
  display: flex; align-items: baseline; gap: 4px;
}
.pai-scope .plan-card-price-num{
  font-size: 36px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -1px;
  line-height: 1;
}
.pai-scope .plan-card-price-unit{
  font-size: 13px;
  color: var(--text-quaternary);
}
.pai-scope .plan-card-tagline{
  font-size: 13px;
  color: var(--text-quaternary);
  line-height: 1.5;
}
.pai-scope .plan-card-list{
  list-style: none;
  padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
  flex: 1;
}
.pai-scope .plan-card-list li{
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13px;
  color: var(--text-secondary);
  line-height: 1.4;
}
.pai-scope .plan-card-list li.is-off{ color: var(--text-muted); }
.pai-scope .plan-card-list li svg{ width: 14px; height: 14px; flex-shrink: 0; margin-top: 2px; }
.pai-scope .plan-card-list li .check-on{ color: var(--success-fg); }
.pai-scope .plan-card-list li .check-off{ color: var(--text-muted); }

.pai-scope .usage-block{ display: flex; flex-direction: column; gap: 18px; }
.pai-scope .usage-row{ display: flex; flex-direction: column; gap: 6px; }
.pai-scope .usage-row-head{
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px;
}
.pai-scope .usage-row-name{
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 500;
  color: var(--text-secondary);
}
.pai-scope .usage-row-name svg{ width: 14px; height: 14px; color: var(--text-quaternary); }
.pai-scope .usage-row-value{
  font-size: 12px;
  color: var(--text-quaternary);
}
.pai-scope .usage-row-track{
  height: 6px;
  background: var(--bg-elevated);
  border-radius: 9999px;
  overflow: hidden;
}
.pai-scope .usage-row-fill{
  height: 100%;
  background: var(--primary);
  border-radius: 9999px;
}
.pai-scope .usage-row-fill.is-warning{ background: var(--warning-fg); }
.pai-scope .usage-row-fill.is-error{ background: var(--error-fg); }
.pai-scope .usage-block-total{
  display: flex; justify-content: space-between;
  padding-top: 14px;
  border-top: 1px solid var(--border);
  font-size: 14px; font-weight: 600;
  color: var(--text-heading);
}

.pai-scope .pm-row{
  display: flex; align-items: center; gap: 14px;
  padding: 14px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 14px;
}
.pai-scope .pm-icon{
  width: 44px; height: 32px;
  border-radius: 6px;
  background: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}
.pai-scope .pm-info{ flex: 1; min-width: 0; }
.pai-scope .pm-info-name{ font-size: 14px; font-weight: 500; color: var(--text-heading); margin-bottom: 4px; }
.pai-scope .pm-info-sub{ font-size: 12px; color: var(--text-quaternary); }
.pai-scope .pm-actions{ display: flex; align-items: center; gap: 8px; flex-shrink: 0; }

.pai-scope .danger-block{
  border: 1px solid var(--error-border);
  background: var(--error-bg);
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pai-scope .danger-block-title{ font-size: 14px; font-weight: 700; color: var(--error-fg); margin: 0; }
.pai-scope .danger-block-sub{ font-size: 13px; color: var(--text-secondary); line-height: 1.5; margin: 0; }

.pai-scope .activity-list{ display: flex; flex-direction: column; gap: 4px; }
.pai-scope .activity-row{
  display: grid;
  grid-template-columns: 36px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  background: var(--bg-base);
  border: 0;
  border-radius: 14px;
  transition: background 0.15s, border-color 0.15s;
}
.pai-scope .activity-row:hover{ background: var(--bg-hover); border-color: var(--border-strong); }
.pai-scope .activity-icon{
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--bg-elevated);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: var(--primary-light);
}
.pai-scope .activity-icon svg{ width: 16px; height: 16px; }
.pai-scope .activity-text-wrap{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pai-scope .activity-title-text{
  font-size: 14px;
  font-weight: 500;
  color: var(--text-heading);
  line-height: 1.2;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pai-scope .activity-meta{ font-size: 12px; color: var(--text-quaternary); line-height: 1.2; }
.pai-scope .activity-time{ font-size: 12px; color: var(--text-quaternary); white-space: nowrap; }

.pai-scope .wizard-main{ padding-top: 4px; }
.pai-scope .wizard-body{ padding-top: 8px; padding-bottom: 56px; }
.pai-scope .wizard-autosave{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-quaternary);
  padding-right: 8px;
  font-weight: 500;
}
.pai-scope .wizard-autosave svg{ width: 14px; height: 14px; color: var(--success-fg); }

.pai-scope .wizard-layout{
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
}

.pai-scope .wizard-stepper-top{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0 0 24px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--border);
}
.pai-scope .wizard-stepper-dots{
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0;
  padding: 4px 0 14px;
  margin: 0;
  position: relative;
}
.pai-scope .step-dot{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  flex: 1;
  min-width: 0;
}
.pai-scope .step-dot:not(:last-child)::after{
  content: '';
  position: absolute;
  top: 11px;
  left: calc(50% + 14px);
  right: calc(-50% + 14px);
  height: 2px;
  background: var(--border);
  z-index: 0;
}
.pai-scope .step-dot.is-done:not(:last-child)::after{ background: var(--primary); }
.pai-scope .step-dot-num{
  position: relative;
  z-index: 1;
  width: 24px;
  height: 24px;
  border-radius: 9999px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  color: var(--text-quaternary);
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  font-variant-numeric: tabular-nums;
}
.pai-scope .step-dot.is-active .step-dot-num{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  box-shadow: 0 0 0 4px rgba(31, 192, 171,0.15);
  transform: scale(1.06);
}
.pai-scope .step-dot.is-done .step-dot-num{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  font-size: 0;
}
.pai-scope .step-dot.is-done .step-dot-num::before{
  content: '';
  width: 8px;
  height: 4px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(0px, -1px);
}
.pai-scope .step-dot-label{
  font-size: 11px;
  font-weight: 500;
  color: var(--text-quaternary);
  white-space: nowrap;
  transition: color 0.2s;
}
.pai-scope .step-dot.is-active .step-dot-label{
  color: var(--text-heading);
  font-weight: 600;
}
.pai-scope .step-dot.is-done .step-dot-label{ color: var(--text-tertiary); }
.pai-scope .step-dot:hover .step-dot-label{ color: var(--text-secondary); }
.pai-scope .wizard-stepper-meta{
  font-size: 11px;
  font-weight: 500;
  color: var(--text-quaternary);
  letter-spacing: 0.2px;
  text-align: center;
}
@media (max-width: 700px) {
  .pai-scope .step-dot-label{ display: none; }
  .pai-scope .step-dot:not(:last-child)::after{ left: calc(50% + 12px); right: calc(-50% + 12px); }
}

.pai-scope .wizard-content{
  background: transparent;
  border: 0;
  padding: 0;
  min-height: auto;
  display: flex;
  flex-direction: column;
}
.pai-scope .wizard-step{ display: none; flex: 1; flex-direction: column; gap: 22px; padding: 24px 0 8px; animation: wizardFadeIn 0.3s ease-out; }
.pai-scope .wizard-step.is-active{ display: flex; }
@keyframes wizardFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.pai-scope .wizard-step-head{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 4px;
}
.pai-scope .wizard-step-eyebrow{
  display: none;
}
.pai-scope .wizard-step-title{
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.6px;
  color: var(--text-heading);
  margin: 0;
  line-height: 1.2;
}
.pai-scope .wizard-step-sub{
  font-size: 14px;
  color: var(--text-tertiary);
  line-height: 1.55;
  margin: 0;
  max-width: 640px;
}

.pai-scope .wizard-choice-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.pai-scope .wizard-choice-grid-compact{ gap: 12px; }
@media (max-width: 700px) {
  .pai-scope .wizard-choice-grid{ grid-template-columns: 1fr; }
}
.pai-scope .wizard-choice{
  position: relative;
  display: flex;
  gap: 16px;
  padding: 18px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  border-radius: 14px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.pai-scope .wizard-choice:hover{ border-color: var(--border-strong); background: var(--bg-hover); }
.pai-scope .wizard-choice.is-selected{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
}
.pai-scope .wizard-choice input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.pai-scope .wizard-choice-thumb{
  width: 52px;
  height: 52px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pai-scope .wizard-choice-thumb-sm{ width: 40px; height: 40px; border-radius: 10px; }
.pai-scope .wizard-choice-thumb svg{ width: 24px; height: 24px; }
.pai-scope .wizard-choice-thumb-sm svg{ width: 18px; height: 18px; }
.pai-scope .wizard-choice-text{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.pai-scope .wizard-choice-title{
  font-size: 15px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .wizard-choice-badge{
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  padding: 2px 6px;
  border-radius: 6px;
  background: var(--bg-hover);
  color: var(--text-tertiary);
}
.pai-scope .wizard-choice-badge-pro{
  background: rgba(192,132,252,0.16);
  color: #c084fc;
}
.pai-scope .wizard-choice-sub{
  font-size: 13px;
  color: var(--text-tertiary);
  line-height: 1.5;
}
.pai-scope .wizard-choice-pills{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 4px 0 0;
  margin: 0;
}
.pai-scope .wizard-choice-pills li{
  font-size: 11px;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 9999px;
  background: var(--bg-hover);
  color: var(--text-tertiary);
}
.pai-scope .wizard-choice.is-selected .wizard-choice-pills li{
  background: rgba(31, 192, 171,0.12);
  color: var(--primary-light);
}
.pai-scope .wizard-choice-check{
  position: absolute;
  top: 14px;
  right: 14px;
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(0.6);
  transition: opacity 0.15s, transform 0.15s;
}
.pai-scope .wizard-choice-check svg{ width: 12px; height: 12px; }
.pai-scope .wizard-choice.is-selected .wizard-choice-check{
  opacity: 1;
  transform: scale(1);
}

.pai-scope .wizard-pill-group{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pai-scope .wizard-pill{
  position: relative;
  padding: 8px 14px;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--bg-base);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.15s;
}
.pai-scope .wizard-pill input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.pai-scope .wizard-pill:hover{ border-color: var(--border-strong); background: var(--bg-hover); }
.pai-scope .wizard-pill.is-selected{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.pai-scope .wizard-form{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.pai-scope .model-section{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pai-scope .model-section-label{
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--text-quaternary);
}
.pai-scope .model-cards{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 700px) { .pai-scope .model-cards{ grid-template-columns: 1fr; } }
.pai-scope .model-card{
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  border-radius: 14px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.pai-scope .model-card input{ position: absolute; opacity: 0; pointer-events: none; }
.pai-scope .model-card:hover{ border-color: var(--border-strong); }
.pai-scope .model-card.is-selected{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
}
.pai-scope .model-card-top{
  display: flex;
  align-items: center;
  gap: 12px;
}
.pai-scope .model-card-icon{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pai-scope .model-card-icon svg{ width: 18px; height: 18px; }
.pai-scope .model-card-titles{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .model-card-name{
  font-size: 15px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .model-card-badge{ font-size: 10px; padding: 2px 6px; }
.pai-scope .model-card-price{
  font-size: 12px;
  color: var(--text-quaternary);
  font-variant-numeric: tabular-nums;
}
.pai-scope .model-card-price strong{
  color: var(--text-secondary);
  font-weight: 600;
  margin-left: 2px;
}
.pai-scope .model-card-check{
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  opacity: 0;
  transform: scale(0.6);
  transition: all 0.15s;
}
.pai-scope .model-card-check svg{ width: 12px; height: 12px; }
.pai-scope .model-card.is-selected .model-card-check{
  opacity: 1;
  transform: scale(1);
}
.pai-scope .model-card-desc{
  font-size: 13px;
  color: var(--text-tertiary);
  line-height: 1.5;
  margin: 0;
}
.pai-scope .model-card-specs{
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 0 0;
  margin: 0;
  border-top: 1px solid var(--border);
}
.pai-scope .model-card-specs li{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-tertiary);
}
.pai-scope .model-card-specs .dot{
  width: 4px;
  height: 4px;
  border-radius: 9999px;
  background: var(--text-quaternary);
}
.pai-scope .model-card.is-selected .model-card-specs .dot{ background: var(--primary); }
.pai-scope .model-card.is-selected .model-card-specs{ border-top-color: rgba(31, 192, 171,0.2); }

.pai-scope .creativity-section{
  padding: 18px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  overflow: hidden;
}
.pai-scope .creativity-section::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 80% 60% at 0% 0%, rgba(31, 192, 171,0.1), transparent 70%);
  pointer-events: none;
}
.pai-scope .creativity-section > *{ position: relative; z-index: 1; }
.pai-scope .creativity-head{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.pai-scope .creativity-label{
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
  margin-bottom: 2px;
}
.pai-scope .creativity-sub{
  display: block;
  font-size: 12px;
  color: var(--text-tertiary);
}
.pai-scope .creativity-value{
  font-size: 22px;
  font-weight: 700;
  color: var(--primary-light);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.4px;
  flex-shrink: 0;
}
.pai-scope .creativity-slider{
  position: relative;
  height: 24px;
  display: flex;
  align-items: center;
}
.pai-scope .creativity-track{
  position: absolute;
  left: 0;
  right: 0;
  height: 6px;
  background: var(--bg-hover);
  border-radius: 9999px;
  overflow: hidden;
}
.pai-scope .creativity-fill{
  height: 100%;
  background: linear-gradient(90deg, #4ad8c4, #c084fc, #fb923c);
  border-radius: 9999px;
  transition: width 0.2s;
}
.pai-scope .creativity-stops{
  position: absolute;
  left: 6px;
  right: 6px;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
}
.pai-scope .creativity-stops span{
  width: 4px;
  height: 4px;
  border-radius: 9999px;
  background: var(--text-quaternary);
  opacity: 0.5;
}
.pai-scope .creativity-input{
  position: absolute;
  inset: 0;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
  z-index: 2;
  width: 100%;
  margin: 0;
}
.pai-scope .creativity-input::-webkit-slider-thumb{
  -webkit-appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  background: #fff;
  border: 4px solid var(--primary);
  box-shadow: 0 2px 10px rgba(31, 192, 171,0.5), 0 0 0 1px var(--primary-end);
  cursor: grab;
  transition: transform 0.1s;
  margin-top: 2px;
}
.pai-scope .creativity-input::-webkit-slider-thumb:hover{ transform: scale(1.08); }
.pai-scope .creativity-input::-webkit-slider-thumb:active{ cursor: grabbing; }
.pai-scope .creativity-input::-moz-range-thumb{
  width: 22px;
  height: 22px;
  border-radius: 9999px;
  background: #fff;
  border: 4px solid var(--primary);
  box-shadow: 0 2px 10px rgba(31, 192, 171,0.5);
  cursor: grab;
}
.pai-scope .creativity-input:focus{ outline: 0; }
.pai-scope .creativity-labels{
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--text-quaternary);
  font-weight: 500;
}
.pai-scope .creativity-labels span{
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 6px;
  transition: color 0.15s;
}
.pai-scope .creativity-labels span:hover{ color: var(--text-secondary); }
.pai-scope .creativity-labels .is-active{
  color: var(--text-heading);
  font-weight: 700;
}

.pai-scope .advanced-params{
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-base);
  overflow: hidden;
}
.pai-scope .advanced-params-summary{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.pai-scope .advanced-params-summary::-webkit-details-marker{ display: none; }
.pai-scope .advanced-params-summary:hover{ background: var(--bg-hover); }
.pai-scope .advanced-params-title{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .advanced-params-meta{
  font-size: 11px;
  color: var(--text-quaternary);
  margin-left: auto;
}
.pai-scope .advanced-params-chev{
  width: 14px;
  height: 14px;
  color: var(--text-quaternary);
  transition: transform 0.2s;
  flex-shrink: 0;
}
.pai-scope .advanced-params[open] .advanced-params-chev{ transform: rotate(180deg); }
.pai-scope .advanced-params[open] .advanced-params-summary{ border-bottom: 1px solid var(--border); }
.pai-scope .advanced-params-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 18px;
}
@media (max-width: 600px) { .pai-scope .advanced-params-grid{ grid-template-columns: 1fr; } }

.pai-scope .tone-slider{
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 6px 4px 0;
}
.pai-scope .tone-slider-wrap{
  position: relative;
  height: 24px;
  display: flex;
  align-items: center;
}
.pai-scope .tone-slider-track{
  position: absolute;
  left: 8px;
  right: 8px;
  height: 4px;
  background: var(--bg-hover);
  border-radius: 9999px;
  z-index: 0;
  overflow: hidden;
}
.pai-scope .tone-slider-fill{
  height: 100%;
  background: linear-gradient(90deg, var(--primary), var(--primary-end));
  border-radius: 9999px;
  transition: width 0.2s;
}
.pai-scope .tone-slider-ticks{
  position: absolute;
  left: 8px;
  right: 8px;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
  z-index: 1;
}
.pai-scope .tone-tick{
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  background: var(--bg-elevated);
  border: 1.5px solid var(--bg-hover);
  margin-top: -2px;
}
.pai-scope .tone-slider-input{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 24px;
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
  z-index: 2;
  margin: 0;
  padding: 0;
}
.pai-scope .tone-slider-input::-webkit-slider-runnable-track{
  height: 24px;
  background: transparent;
  border: 0;
}
.pai-scope .tone-slider-input::-moz-range-track{
  height: 24px;
  background: transparent;
  border: 0;
}
.pai-scope .tone-slider-input::-webkit-slider-thumb{
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: #fff;
  border: 4px solid var(--primary);
  box-shadow: 0 2px 8px rgba(31, 192, 171,0.5), 0 0 0 1px var(--primary-end);
  margin-top: 3px;
  cursor: grab;
  transition: transform 0.1s, box-shadow 0.15s;
}
.pai-scope .tone-slider-input::-webkit-slider-thumb:hover{
  transform: scale(1.1);
}
.pai-scope .tone-slider-input::-webkit-slider-thumb:active{
  cursor: grabbing;
  transform: scale(1.15);
  box-shadow: 0 2px 12px rgba(31, 192, 171,0.7), 0 0 0 1px var(--primary-end), 0 0 0 6px rgba(31, 192, 171,0.15);
}
.pai-scope .tone-slider-input::-moz-range-thumb{
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: #fff;
  border: 4px solid var(--primary);
  box-shadow: 0 2px 8px rgba(31, 192, 171,0.5), 0 0 0 1px var(--primary-end);
  cursor: grab;
  transition: transform 0.1s;
}
.pai-scope .tone-slider-input::-moz-range-thumb:hover{
  transform: scale(1.1);
}
.pai-scope .tone-slider-input:focus{ outline: 0; }
.pai-scope .tone-slider-input:focus-visible::-webkit-slider-thumb{
  box-shadow: 0 0 0 6px rgba(31, 192, 171,0.2), 0 2px 8px rgba(31, 192, 171,0.5), 0 0 0 1px var(--primary-end);
}
.pai-scope .tone-slider-labels{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 4px;
  font-size: 12px;
  color: var(--text-quaternary);
  font-weight: 500;
  text-align: center;
  user-select: none;
}
.pai-scope .tone-slider-labels span{
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 6px;
  transition: color 0.15s, background 0.15s;
  white-space: nowrap;
}
.pai-scope .tone-slider-labels span:first-child{ text-align: left; padding-left: 0; }
.pai-scope .tone-slider-labels span:last-child{ text-align: right; padding-right: 0; }
.pai-scope .tone-slider-labels span:hover{ color: var(--text-secondary); }
.pai-scope .tone-slider-labels .is-active{
  color: var(--text-heading);
  font-weight: 700;
}

.pai-scope .logo-upload{
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
.pai-scope .logo-upload::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 100% 0%, rgba(31, 192, 171,0.1), transparent 70%);
  pointer-events: none;
}
.pai-scope .logo-upload-preview{
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}
.pai-scope .logo-upload-img{
  width: 80px;
  height: 80px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0,0,0,0.3);
}
.pai-scope .logo-upload-img svg{ width: 32px; height: 32px; opacity: 0.9; }
.pai-scope .logo-upload-placeholder svg{ opacity: 0.6; }
.pai-scope .logo-upload-info{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  position: relative;
  z-index: 1;
}
.pai-scope .logo-upload-title{
  font-size: 14px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
}
.pai-scope .logo-upload-sub{
  font-size: 12px;
  color: var(--text-quaternary);
  line-height: 1.5;
}
.pai-scope .logo-upload-btns{
  display: flex;
  gap: 6px;
  padding-top: 8px;
}

.pai-scope .avatar-upload{
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 14px 18px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 14px;
}
.pai-scope .avatar-upload-preview{
  flex-shrink: 0;
}
.pai-scope .avatar-upload-img{
  width: 72px;
  height: 72px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.pai-scope .avatar-upload-img svg{ width: 32px; height: 32px; }
.pai-scope .avatar-upload-actions{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.pai-scope .avatar-upload-title{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .avatar-upload-sub{
  font-size: 12px;
  color: var(--text-quaternary);
  line-height: 1.45;
}
.pai-scope .avatar-upload-btns{
  display: flex;
  gap: 6px;
  padding-top: 6px;
}
.pai-scope .avatar-presets{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding-top: 10px;
}
.pai-scope .avatar-presets-label{
  font-size: 12px;
  color: var(--text-quaternary);
  font-weight: 500;
}
.pai-scope .avatar-presets-grid{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.pai-scope .avatar-preset{
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  border: 2px solid transparent;
  cursor: pointer;
  padding: 0;
  transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
  position: relative;
}
.pai-scope .avatar-preset:hover{
  transform: scale(1.1);
}
.pai-scope .avatar-preset.is-selected{
  border-color: var(--text-heading);
  box-shadow: 0 0 0 2px var(--bg-base), 0 0 0 4px var(--primary);
}

.pai-scope .lang-select{
  position: relative;
  max-width: 320px;
}
.pai-scope .lang-select-trigger{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  padding: 0 14px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text-heading);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .lang-select-trigger:hover{ border-color: var(--border-strong); }
.pai-scope .lang-select.is-open .lang-select-trigger{
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}
.pai-scope .lang-flag{
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
}
.pai-scope .lang-name{
  flex: 1;
  text-align: left;
}
.pai-scope .lang-chev{
  width: 14px;
  height: 14px;
  color: var(--text-quaternary);
  transition: transform 0.2s;
  flex-shrink: 0;
}
.pai-scope .lang-select.is-open .lang-chev{ transform: rotate(180deg); }

.pai-scope .lang-select-menu{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 50;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 6px;
  margin: 0;
  list-style: none;
  max-height: 320px;
  overflow-y: auto;
  box-shadow: 0 12px 36px rgba(0,0,0,0.45), 0 0 0 1px var(--border);
  opacity: 0;
  transform: translateY(-4px) scale(0.98);
  pointer-events: none;
  transition: opacity 0.15s, transform 0.15s;
}
.pai-scope .lang-select.is-open .lang-select-menu{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.pai-scope .lang-option{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-secondary);
  transition: background 0.1s;
}
.pai-scope .lang-option:hover{
  background: var(--bg-hover);
  color: var(--text-heading);
}
.pai-scope .lang-option .lang-name{
  flex: 1;
  font-weight: 500;
}
.pai-scope .lang-option .lang-meta{
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.pai-scope .lang-check{
  width: 16px;
  height: 16px;
  color: var(--primary);
  opacity: 0;
  flex-shrink: 0;
}
.pai-scope .lang-check svg{ width: 14px; height: 14px; }
.pai-scope .lang-option.is-selected{
  background: var(--primary-muted-bg);
  color: var(--text-heading);
}
.pai-scope .lang-option.is-selected .lang-meta{ color: var(--primary-light); }
.pai-scope .lang-option.is-selected .lang-check{ opacity: 1; }
.pai-scope .lang-option-divider{
  height: 1px;
  background: var(--border);
  margin: 6px 4px;
  list-style: none;
}

.pai-scope .lang-select-menu::-webkit-scrollbar{ width: 6px; }
.pai-scope .lang-select-menu::-webkit-scrollbar-track{ background: transparent; }
.pai-scope .lang-select-menu::-webkit-scrollbar-thumb{
  background: var(--bg-hover);
  border-radius: 9999px;
}
.pai-scope .lang-select-menu::-webkit-scrollbar-thumb:hover{ background: var(--border-strong); }
.pai-scope .wizard-form .form-input-lg{
  height: 48px;
  font-size: 15px;
}
.pai-scope .form-required{ color: var(--error-fg); margin-left: 2px; }
.pai-scope .form-optional{
  font-size: 11px;
  font-weight: 500;
  color: var(--text-quaternary);
  margin-left: 6px;
  text-transform: lowercase;
  letter-spacing: 0.2px;
}

.pai-scope .multiselect{
  position: relative;
}
.pai-scope .multiselect-trigger{
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 44px;
  padding: 6px 36px 6px 10px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 10px;
  cursor: text;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.pai-scope .multiselect-trigger:hover{ border-color: var(--border-strong); }
.pai-scope .multiselect.is-open .multiselect-trigger{
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}
.pai-scope .multiselect-chips{
  display: contents;
}
.pai-scope .multiselect-chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 4px 4px 10px;
  border-radius: 9999px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  font-size: 12px;
  font-weight: 500;
  color: var(--text-heading);
  position: relative;
}
.pai-scope .multiselect-chip-dot{
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: var(--chip-color, var(--primary));
}
.pai-scope .multiselect-chip-x{
  width: 18px;
  height: 18px;
  border-radius: 9999px;
  background: transparent;
  border: 0;
  color: var(--text-quaternary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  margin-left: 2px;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .multiselect-chip-x:hover{
  background: var(--bg-hover);
  color: var(--text-heading);
}
.pai-scope .multiselect-chip-x svg{ width: 11px; height: 11px; }
.pai-scope .multiselect-search{
  flex: 1;
  min-width: 100px;
  background: transparent;
  border: 0;
  outline: 0;
  color: var(--text-heading);
  font-size: 13px;
  font-family: inherit;
  padding: 4px 0;
}
.pai-scope .multiselect-search::placeholder{ color: var(--text-quaternary); }
.pai-scope .multiselect-chev{
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  color: var(--text-quaternary);
  pointer-events: none;
  transition: transform 0.2s;
}
.pai-scope .multiselect.is-open .multiselect-chev{
  transform: translateY(-50%) rotate(180deg);
}

.pai-scope .multiselect-menu{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 50;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 6px;
  margin: 0;
  list-style: none;
  max-height: 360px;
  overflow-y: auto;
  box-shadow: 0 12px 36px rgba(0,0,0,0.45), 0 0 0 1px var(--border);
  opacity: 0;
  transform: translateY(-4px) scale(0.98);
  pointer-events: none;
  transition: opacity 0.15s, transform 0.15s;
}
.pai-scope .multiselect.is-open .multiselect-menu{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.pai-scope .multiselect-option{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 9px;
  cursor: pointer;
  transition: background 0.1s;
}
.pai-scope .multiselect-option:hover{
  background: var(--bg-hover);
}
.pai-scope .multiselect-icon{
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .multiselect-icon svg{ width: 16px; height: 16px; }
.pai-scope .multiselect-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .multiselect-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .multiselect-sub{
  font-size: 11px;
  color: var(--text-quaternary);
  line-height: 1.4;
}
.pai-scope .multiselect-check{
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.15s;
}
.pai-scope .multiselect-check svg{ width: 12px; height: 12px; }
.pai-scope .multiselect-option.is-selected .multiselect-check{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.pai-scope .multiselect-option.is-selected{
  background: var(--primary-muted-bg);
}
.pai-scope .multiselect-empty{
  padding: 14px 12px;
  text-align: center;
  font-size: 13px;
  color: var(--text-quaternary);
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.pai-scope .multiselect-empty[hidden]{ display: none; }

.pai-scope .multiselect-menu::-webkit-scrollbar{ width: 6px; }
.pai-scope .multiselect-menu::-webkit-scrollbar-track{ background: transparent; }
.pai-scope .multiselect-menu::-webkit-scrollbar-thumb{ background: var(--bg-hover); border-radius: 9999px; }
.pai-scope .multiselect-menu::-webkit-scrollbar-thumb:hover{ background: var(--border-strong); }

.pai-scope .wizard-guardrails{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 600px) {
  .pai-scope .wizard-guardrails{ grid-template-columns: 1fr; }
}
.pai-scope .wizard-guardrail{
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.15s;
}
.pai-scope .wizard-guardrail input{ position: absolute; opacity: 0; pointer-events: none; }
.pai-scope .wizard-guardrail:hover{ border-color: var(--border-strong); }
.pai-scope .wizard-guardrail.is-on{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
}
.pai-scope .wizard-guardrail-icon{
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .wizard-guardrail-icon svg{ width: 16px; height: 16px; }
.pai-scope .wizard-guardrail-text{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
  flex: 1;
}
.pai-scope .wizard-guardrail-check{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: var(--bg-hover);
  border: 1px solid var(--border);
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
}
.pai-scope .wizard-guardrail-check svg{ width: 12px; height: 12px; }
.pai-scope .wizard-guardrail.is-on .wizard-guardrail-check{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.pai-scope .wizard-plan-notice{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--primary-muted-bg);
  border: 1px solid rgba(31, 192, 171,0.3);
  border-radius: 12px;
}
.pai-scope .wizard-plan-notice-icon{
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(31, 192, 171,0.18);
  color: var(--primary-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .wizard-plan-notice-icon svg{ width: 16px; height: 16px; }
.pai-scope .wizard-plan-notice-text{
  font-size: 13px;
  color: var(--text-secondary);
}
.pai-scope .wizard-plan-notice-text strong{ color: var(--text-heading); }
.pai-scope .wizard-plan-notice-text a{
  color: var(--primary-light);
  font-weight: 600;
}

.pai-scope .wizard-dropzone{
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 32px 32px;
  background: var(--bg-base);
  border: 1.5px dashed var(--border-strong);
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.15s;
  position: relative;
  overflow: hidden;
}
.pai-scope .wizard-dropzone::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 60% at 0% 0%, rgba(31, 192, 171,0.1), transparent 70%);
  pointer-events: none;
  opacity: 0.6;
}
.pai-scope .wizard-dropzone:hover{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
  transform: translateY(-1px);
}
.pai-scope .wizard-dropzone:hover::before{ opacity: 1; }
.pai-scope .wizard-dropzone-icon{
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: var(--bg-hover);
  color: var(--primary-light);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
.pai-scope .wizard-dropzone-icon svg{ width: 30px; height: 30px; }
.pai-scope .wizard-dropzone-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
  position: relative;
  z-index: 1;
}
.pai-scope .wizard-dropzone-title{
  font-size: 16px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
}
.pai-scope .wizard-dropzone-sub{
  font-size: 13px;
  color: var(--text-tertiary);
  line-height: 1.5;
}
.pai-scope .wizard-dropzone > .btn{ position: relative; z-index: 1; }

.pai-scope .wizard-file-list{ display: flex; flex-direction: column; gap: 8px; }
.pai-scope .wizard-file-row{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.pai-scope .wizard-file-icon{
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .wizard-file-icon svg{ width: 16px; height: 16px; }
.pai-scope .wizard-file-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .wizard-file-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .wizard-file-meta{
  font-size: 11px;
  color: var(--text-quaternary);
}

.pai-scope .wizard-form-divider{
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 4px 0;
}
.pai-scope .wizard-form-divider::before, .pai-scope .wizard-form-divider::after{
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border);
}
.pai-scope .wizard-form-divider span{
  font-size: 11px;
  color: var(--text-quaternary);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-weight: 600;
}

.pai-scope .wizard-url-row{ display: flex; gap: 8px; }
.pai-scope .wizard-url-row .form-input{ flex: 1; }

.pai-scope .features-summary{
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 14px 20px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
}
.pai-scope .features-summary::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 100% 100%, rgba(192,132,252,0.1), transparent 70%);
  pointer-events: none;
}
.pai-scope .features-summary > *{ position: relative; z-index: 1; }
.pai-scope .features-summary-stat{
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .features-summary-num{
  font-size: 22px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.4px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.pai-scope .features-summary-label{
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--text-quaternary);
}
.pai-scope .features-summary-divider{
  width: 1px;
  height: 32px;
  background: var(--border);
}
.pai-scope .features-summary-cta{
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 9999px;
  background: rgba(192,132,252,0.16);
  color: #c084fc;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s;
}
.pai-scope .features-summary-cta:hover{ background: rgba(192,132,252,0.26); }

.pai-scope .features-section{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pai-scope .features-section-head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 0 2px;
}
.pai-scope .features-section-label{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-secondary);
}
.pai-scope .features-section-label-pro{
  color: #c084fc;
}
.pai-scope .features-section-sub{
  display: block;
  font-size: 11px;
  color: var(--text-quaternary);
  margin-top: 2px;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
}
.pai-scope .features-section-cta{
  font-size: 12px;
  font-weight: 600;
  color: #c084fc;
  text-decoration: none;
}
.pai-scope .features-section-cta:hover{ text-decoration: underline; }

.pai-scope .features-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 700px) { .pai-scope .features-grid{ grid-template-columns: 1fr; } }

.pai-scope .feat-card{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 12px;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .feat-card:hover{ border-color: var(--border-strong); }
.pai-scope .feat-card.is-on{
  border-color: rgba(31, 192, 171,0.4);
  background: var(--primary-muted-bg);
}
.pai-scope .feat-card.is-locked{
  opacity: 0.75;
}
.pai-scope .feat-card.is-locked:hover{ opacity: 1; }
.pai-scope .feat-card-icon{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .feat-card-icon svg{ width: 18px; height: 18px; }
.pai-scope .feat-card-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .feat-card-title{
  font-size: 13px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.1px;
}
.pai-scope .feat-card-sub{
  font-size: 11px;
  color: var(--text-tertiary);
  line-height: 1.45;
}
.pai-scope .feat-card-lock{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px;
  border-radius: 9999px;
  background: rgba(192,132,252,0.16);
  color: #c084fc;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}

.pai-scope .wizard-features{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pai-scope .wizard-feature{
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 12px;
  transition: border-color 0.15s;
}
.pai-scope .wizard-feature:hover{ border-color: var(--border-strong); }
.pai-scope .wizard-feature.is-locked{ opacity: 0.7; }
.pai-scope .wizard-feature.is-locked:hover{ opacity: 1; }
.pai-scope .wizard-feature-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.pai-scope .wizard-feature-title{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .wizard-feature-sub{
  font-size: 12px;
  color: var(--text-tertiary);
  line-height: 1.5;
}
.pai-scope .wizard-feature-cta{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.pai-scope .wizard-split{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 900px) {
  .pai-scope .wizard-split{ grid-template-columns: 1fr; }
}
.pai-scope .wizard-color-row{
  display: flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .wizard-color-swatch{
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 2px solid var(--border);
  flex-shrink: 0;
  cursor: pointer;
}

.pai-scope .wizard-preview{
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: sticky;
  top: 24px;
}
.pai-scope .wizard-preview-label{
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--text-quaternary);
}
.pai-scope .wizard-preview-frame{
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 20px;
  min-height: 380px;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
.pai-scope .wizard-preview-widget{
  width: 100%;
  max-width: 320px;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 48px rgba(0,0,0,0.35);
}
.pai-scope .wizard-preview-head{
  padding: 12px 14px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pai-scope .wizard-preview-head-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .wizard-preview-head-text > span:first-child{
  font-size: 13px;
  font-weight: 600;
}
.pai-scope .wizard-preview-head-status{
  font-size: 10px;
  opacity: 0.75;
}
.pai-scope .wizard-preview-head-close{
  background: none;
  border: 0;
  color: #fff;
  opacity: 0.7;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.pai-scope .wizard-preview-body{
  flex: 1;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 220px;
}
.pai-scope .wizard-preview-msg{
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.pai-scope .wizard-preview-avatar{
  width: 24px;
  height: 24px;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pai-scope .wizard-preview-bubble{
  padding: 8px 10px;
  background: var(--bg-hover);
  border-radius: 10px;
  font-size: 12px;
  color: var(--text-heading);
  max-width: 220px;
}
.pai-scope .wizard-preview-starters{
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: auto;
}
.pai-scope .wizard-preview-starters button{
  text-align: left;
  padding: 8px 10px;
  background: var(--bg-hover);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 11.5px;
  color: var(--text-secondary);
  cursor: pointer;
}
.pai-scope .wizard-preview-starters button:hover{
  background: var(--bg-elevated);
}
.pai-scope .wizard-preview-input{
  padding: 10px 12px;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--bg-base);
}
.pai-scope .wizard-preview-input > span{
  flex: 1;
  font-size: 12px;
  color: var(--text-quaternary);
}
.pai-scope .wizard-preview-input button{
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  border: 0;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.pai-scope .wizard-preview-input button svg{ width: 14px; height: 14px; }

.pai-scope .wizard-review{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 700px) {
  .pai-scope .wizard-review{ grid-template-columns: 1fr; }
}
.pai-scope .wizard-review-card{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 12px;
}
.pai-scope .wizard-review-head{
  display: flex;
  align-items: center;
  gap: 10px;
}
.pai-scope .wizard-review-step{
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: var(--text-quaternary);
  padding: 2px 6px;
  background: var(--bg-hover);
  border-radius: 5px;
}
.pai-scope .wizard-review-title{
  font-size: 13px;
  font-weight: 700;
  color: var(--text-heading);
  flex: 1;
}
.pai-scope .wizard-review-edit{
  font-size: 12px;
  font-weight: 600;
  color: var(--primary-light);
  background: none;
  border: 0;
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 6px;
}
.pai-scope .wizard-review-edit:hover{ background: var(--bg-hover); }
.pai-scope .wizard-review-body{
  font-size: 13px;
  color: var(--text-tertiary);
  line-height: 1.5;
}
.pai-scope .wizard-review-body strong{ color: var(--text-heading); font-weight: 600; }

.pai-scope .wizard-launch-card{
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  background: linear-gradient(135deg, rgba(31, 192, 171,0.16), rgba(74, 216, 196,0.08));
  border: 1px solid rgba(31, 192, 171,0.3);
  border-radius: 14px;
  margin-top: 4px;
}
.pai-scope .wizard-launch-icon{
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .wizard-launch-icon svg{ width: 22px; height: 22px; }
.pai-scope .wizard-launch-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .wizard-launch-title{
  font-size: 14px;
  font-weight: 700;
  color: var(--text-heading);
}
.pai-scope .wizard-launch-sub{
  font-size: 12px;
  color: var(--text-tertiary);
  line-height: 1.5;
}

.pai-scope .wizard-foot{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 22px 0 4px;
  margin-top: 14px;
  border-top: 1px solid var(--border);
}
.pai-scope .wizard-foot-progress{
  display: none;
}
.pai-scope .wizard-foot-actions{
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.pai-scope .stepper{
  display: flex; align-items: center; gap: 10px;
  padding: 4px 4px 8px;
}
.pai-scope .step{
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text-quaternary);
}
.pai-scope .step-num{
  width: 22px; height: 22px;
  border-radius: 50%;
  border: 1px solid var(--border-strong);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600;
  background: var(--bg-base);
  color: var(--text-quaternary);
}
.pai-scope .step.is-active .step-num{ background: var(--primary); border-color: var(--primary); color: #fff; }
.pai-scope .step.is-active{ color: var(--text-heading); font-weight: 500; }
.pai-scope .step.is-done .step-num{ background: var(--success-bg); border-color: var(--success-border); color: var(--success-fg); }
.pai-scope .step.is-done{ color: var(--text-tertiary); }
.pai-scope .step-bar{
  flex: 1; height: 1px;
  background: var(--border);
  max-width: 40px;
}

.pai-scope .split{
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 16px;
  align-items: start;
}

.pai-scope .fab{
  position: fixed;
  bottom: 32px; right: 32px;
  width: 48px; height: 48px;
  border-radius: 9999px;
  background: var(--primary);
  box-shadow: 0 20px 25px -5px rgba(0,0,0,0.25), 0 8px 10px -6px rgba(0,0,0,0.25);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  z-index: 50;
  transition: transform 0.15s;
  border: none;
  cursor: pointer;
}
.pai-scope .fab:hover{ transform: translateY(-2px); }
.pai-scope .fab svg{ width: 20px; height: 20px; }

.pai-scope .menu-btn{
  display: none;
  align-items: center; justify-content: center;
  width: 36px; height: 36px;
  border-radius: 9999px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  color: var(--text-tertiary);
  cursor: pointer;
  flex-shrink: 0;
}
.pai-scope .menu-btn:hover{ background: var(--bg-elevated); color: var(--text-heading); }

.pai-scope .mobile-nav-drawer{
  display: none;
  position: fixed;
  top: 64px; left: 0; right: 0;
  background: var(--bg-base);
  border-bottom: 1px solid var(--border);
  z-index: 9;
  padding: 16px;
  flex-direction: column;
  gap: 4px;
  transform: translateY(-8px);
  opacity: 0;
  transition: transform 0.18s, opacity 0.18s;
  pointer-events: none;
}
.pai-scope .mobile-nav-drawer.open{
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.pai-scope .mobile-nav-drawer .top-nav-item{
  width: 100%;
  height: 44px;
  justify-content: flex-start;
  padding: 0 14px;
  border-radius: 12px;
}
.pai-scope .mobile-nav-divider{
  height: 1px;
  background: var(--border);
  margin: 8px 0;
}

.pai-scope .overview-token{
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-left: 1px solid var(--border);
  background: linear-gradient(135deg, rgba(31, 192, 171,0.06), transparent 60%);
  position: relative;
}
.pai-scope .overview-token-head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.pai-scope .overview-token-label{
  font-size: 12px;
  font-weight: 600;
  color: var(--text-tertiary);
}
.pai-scope .overview-token-delta{
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.pai-scope .overview-token-delta.up{ background: var(--success-bg); color: var(--success-fg); }
.pai-scope .overview-token-delta.down{ background: var(--error-bg); color: var(--error-fg); }
.pai-scope .overview-token-hero{
  font-size: 32px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.8px;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}
.pai-scope .overview-token-meta{
  font-size: 12px;
  color: var(--text-quaternary);
}
.pai-scope .overview-token-breakdown{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 4px;
}
.pai-scope .overview-token-breakdown-bar{
  display: flex;
  height: 6px;
  border-radius: 9999px;
  overflow: hidden;
  background: var(--bg-hover);
  gap: 2px;
}
.pai-scope .overview-token-breakdown-input{ background: var(--primary); height: 100%; }
.pai-scope .overview-token-breakdown-output{ background: #4ad8c4; height: 100%; }
.pai-scope .overview-token-breakdown-legend{
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.pai-scope .overview-token-breakdown-item{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-tertiary);
}
.pai-scope .overview-token-breakdown-item strong{
  color: var(--text-heading);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}
.pai-scope .overview-token-dot{
  width: 8px;
  height: 8px;
  border-radius: 9999px;
}
.pai-scope .overview-token-name{
  font-weight: 500;
}

.pai-scope .kpi-strip{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
@media (max-width: 900px) {
  .pai-scope .kpi-strip{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 500px) {
  .pai-scope .kpi-strip{ grid-template-columns: 1fr; }
}
.pai-scope .kpi-tile{
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 18px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  position: relative;
  overflow: hidden;
  transition: border-color 0.15s;
}
.pai-scope .kpi-tile:hover{ border-color: var(--border-strong); }
.pai-scope .kpi-tile::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 80% at 100% 0%, rgba(31, 192, 171,0.08), transparent 70%);
  pointer-events: none;
}
.pai-scope .kpi-tile > *{ position: relative; z-index: 1; }
.pai-scope .kpi-tile-head{
  display: flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .kpi-tile-icon{
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .kpi-tile-icon svg{ width: 14px; height: 14px; }
.pai-scope .kpi-tile-label{
  font-size: 12px;
  font-weight: 600;
  color: var(--text-tertiary);
  flex: 1;
  min-width: 0;
}
.pai-scope .kpi-tile-delta{
  display: inline-flex;
  align-items: center;
  padding: 2px 6px;
  border-radius: 9999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .kpi-tile-delta.up{
  background: var(--success-bg);
  color: var(--success-fg);
}
.pai-scope .kpi-tile-delta.down{
  background: var(--error-bg);
  color: var(--error-fg);
}
.pai-scope .kpi-tile-value{
  font-size: 30px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.8px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}
.pai-scope .kpi-tile-meta{
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 500;
}

.pai-scope .overview-mini-legend{
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  padding: 12px 22px 22px;
  font-size: 12px;
  color: var(--text-tertiary);
}
.pai-scope .overview-mini-legend-item{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pai-scope .overview-mini-legend-item .overview-dot{
  width: 8px;
  height: 8px;
  border-radius: 9999px;
}

.pai-scope .analytics-grid{
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 16px;
  align-items: start;
}
@media (max-width: 900px) {
  .pai-scope .analytics-grid{ grid-template-columns: 1fr; }
}
.pai-scope .analytics-side{
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.pai-scope .donut-chart{
  position: relative;
  width: 56px;
  height: 56px;
  flex-shrink: 0;
}
.pai-scope .donut-chart svg{
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.pai-scope .donut-chart svg circle{
  fill: none;
  stroke-width: 4;
}
.pai-scope .donut-track{ stroke: var(--bg-hover); }
.pai-scope .donut-fill{
  stroke-linecap: round;
  transition: stroke-dasharray 0.4s;
}
.pai-scope .donut-fill.is-success{ stroke: var(--success-fg); }
.pai-scope .donut-fill.is-purple{ stroke: #c084fc; }
.pai-scope .donut-fill.is-muted{ stroke: var(--text-muted); }
.pai-scope .donut-center{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pai-scope .donut-pct{
  font-size: 13px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.3px;
  font-variant-numeric: tabular-nums;
}

.pai-scope .outcomes-card{
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-self: stretch;
}
.pai-scope .outcomes-list{
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
  justify-content: center;
}
.pai-scope .outcomes-card-horizontal .outcomes-list{
  flex-direction: row;
  gap: 0;
  justify-content: stretch;
  align-items: stretch;
}
.pai-scope .outcomes-card-horizontal .outcome-row{
  flex: 1;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
  padding: 18px 12px 14px;
  background: transparent;
  border: 0;
  border-left: 1px solid var(--border);
}
.pai-scope .outcomes-card-horizontal .outcome-row:first-child{
  border-left: 0;
}

.pai-scope .outcomes-card-horizontal .outcome-text{
  align-items: center;
  text-align: center;
  gap: 2px;
}
.pai-scope .outcomes-card-horizontal .outcome-label{
  font-size: 12px;
  font-weight: 600;
}
.pai-scope .outcomes-card-horizontal .outcome-meta{
  font-size: 11px;
  color: var(--text-tertiary);
}

.pai-scope .outcomes-card-horizontal .donut-chart{
  width: 78px;
  height: 78px;
}
.pai-scope .outcomes-card-horizontal .donut-chart svg circle{
  stroke-width: 3;
}
.pai-scope .outcomes-card-horizontal .donut-pct{
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.3px;
}

.pai-scope .outcome-row{
  display: flex;
  align-items: center;
  gap: 12px;
}
.pai-scope .outcome-text{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .outcome-label{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .outcome-meta{
  font-size: 11px;
  color: var(--text-quaternary);
}
.pai-scope .outcome-value{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.2px;
}

.pai-scope .token-usage-card{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.pai-scope .token-hero{
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pai-scope .token-hero-main{
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.pai-scope .token-hero-value{
  font-size: 36px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -1px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.pai-scope .token-hero-delta{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 9999px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .token-hero-delta svg{ width: 12px; height: 12px; }
.pai-scope .token-hero-delta.up{
  color: var(--success-fg);
  background: var(--success-bg);
}
.pai-scope .token-hero-delta.down{
  color: var(--error-fg);
  background: var(--error-bg);
}
.pai-scope .token-hero-label{
  font-size: 13px;
  color: var(--text-tertiary);
}

.pai-scope .token-progress{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .token-progress-head{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
}
.pai-scope .token-progress-head-label{
  color: var(--text-secondary);
  font-weight: 600;
}
.pai-scope .token-progress-head-value{
  color: var(--text-quaternary);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.pai-scope .token-progress-track{
  height: 8px;
  background: var(--bg-hover);
  border-radius: 9999px;
  overflow: hidden;
  position: relative;
}
.pai-scope .token-progress-fill{
  height: 100%;
  background: linear-gradient(90deg, var(--primary), var(--primary-end));
  border-radius: 9999px;
  transition: width 0.4s;
}

.pai-scope .token-breakdown{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pai-scope .token-breakdown-head{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pai-scope .token-breakdown-title{
  font-size: 12px;
  color: var(--text-quaternary);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.pai-scope .token-breakdown-bar{
  display: flex;
  height: 8px;
  border-radius: 9999px;
  overflow: hidden;
  background: var(--bg-hover);
  gap: 2px;
}
.pai-scope .token-breakdown-bar-input{
  background: var(--primary);
  height: 100%;
}
.pai-scope .token-breakdown-bar-output{
  background: #4ad8c4;
  height: 100%;
}
.pai-scope .token-breakdown-legend{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.pai-scope .token-breakdown-item{
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.pai-scope .token-breakdown-dot{
  width: 10px;
  height: 10px;
  border-radius: 3px;
  flex-shrink: 0;
  margin-top: 5px;
}
.pai-scope .token-breakdown-text{
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.pai-scope .token-breakdown-label{
  font-size: 12px;
  color: var(--text-tertiary);
  font-weight: 500;
}
.pai-scope .token-breakdown-value{
  font-size: 16px;
  color: var(--text-heading);
  font-weight: 700;
  letter-spacing: -0.2px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .token-breakdown-value .muted{
  font-size: 12px;
  font-weight: 500;
  color: var(--text-quaternary);
  margin-left: 2px;
  letter-spacing: 0;
}

.pai-scope .token-insights{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  border-top: 1px solid var(--border);
  padding-top: 14px;
}
.pai-scope .token-insight{
  display: flex;
  align-items: center;
  gap: 12px;
}
.pai-scope .token-insight-icon{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .token-insight-icon svg{ width: 16px; height: 16px; }
.pai-scope .token-insight-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .token-insight-label{
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 500;
}
.pai-scope .token-insight-value{
  font-size: 15px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.2px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .token-insight-value .muted{
  font-size: 12px;
  font-weight: 500;
  color: var(--text-quaternary);
}

.pai-scope .persona-card{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.pai-scope .bot-detail-header{
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 4px 4px;
}
.pai-scope .bot-detail-thumb{
  width: 56px;
  height: 56px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
  background: linear-gradient(135deg, #1fc0ab 0%, #7df0e0 100%);
}
.pai-scope .bot-detail-thumb.bot-thumb-emerald{
  background: linear-gradient(135deg, #34d399 0%, #059669 100%);
}
.pai-scope .bot-detail-thumb svg{ width: 28px; height: 28px; }
.pai-scope .bot-detail-info{
  flex: 1;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.pai-scope .bot-detail-title-row{
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.pai-scope .bot-detail-name{
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.3px;
  color: var(--text-heading);
  margin: 0;
  line-height: 1.2;
}
.pai-scope .bot-detail-meta{
  font-size: 13px;
  color: var(--text-quaternary);
}
.pai-scope .bot-detail-usage{
  margin-left: 4px;
  height: 32px;
}
.pai-scope .bot-detail-usage .usage-pill-info{
  padding: 0 12px 0 2px;
  gap: 6px;
}
.pai-scope .bot-detail-usage .usage-pill-icon{
  width: 24px; height: 24px;
}
.pai-scope .bot-detail-actions{
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}

.pai-scope .chat-layout{
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 16px;
  align-items: stretch;
}
.pai-scope .chat-list-panel{
  display: flex;
  flex-direction: column;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  min-height: 620px;
  max-height: 760px;
}
.pai-scope .chat-list-head{
  padding: 14px 14px 10px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pai-scope .chat-list-search{
  position: relative;
  display: flex;
  align-items: center;
}
.pai-scope .chat-list-search svg{
  position: absolute;
  left: 12px;
  width: 14px;
  height: 14px;
  color: var(--text-quaternary);
  pointer-events: none;
}
.pai-scope .chat-list-search input{
  flex: 1;
  width: 100%;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  padding: 7px 12px 7px 32px;
  font-size: 12px;
  color: var(--text-primary);
  outline: none;
  transition: border-color .15s, background .15s;
}
.pai-scope .chat-list-search input:focus{
  border-color: var(--primary);
  background: var(--bg-elevated);
}
.pai-scope .chat-list-search input::placeholder{ color: var(--text-quaternary); }

.pai-scope .chat-filter-select{
  position: relative;
}
.pai-scope .chat-filter-trigger{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text-heading);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .chat-filter-trigger:hover{ border-color: var(--border-strong); }
.pai-scope .chat-filter-select.is-open .chat-filter-trigger{
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-ring);
}
.pai-scope .chat-filter-dot{
  width: 8px;
  height: 8px;
  border-radius: 9999px;
  flex-shrink: 0;
}
.pai-scope .chat-filter-dot.is-all{ background: var(--primary); }
.pai-scope .chat-filter-dot.is-active{ background: var(--success-fg); }
.pai-scope .chat-filter-dot.is-escalated{ background: #c084fc; }
.pai-scope .chat-filter-dot.is-resolved{ background: var(--text-quaternary); }
.pai-scope .chat-filter-name{
  flex: 1;
  text-align: left;
  color: var(--text-heading);
  font-weight: 600;
}
.pai-scope .chat-filter-trigger-count{
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 9999px;
  background: var(--bg-hover);
  color: var(--text-tertiary);
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.pai-scope .chat-filter-chev{
  width: 14px;
  height: 14px;
  color: var(--text-quaternary);
  transition: transform 0.2s;
  flex-shrink: 0;
}
.pai-scope .chat-filter-select.is-open .chat-filter-chev{ transform: rotate(180deg); }

.pai-scope .chat-filter-menu{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 50;
  background: var(--bg-elevated);
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  padding: 6px;
  margin: 0;
  list-style: none;
  box-shadow: 0 12px 36px rgba(0,0,0,0.45), 0 0 0 1px var(--border);
  opacity: 0;
  transform: translateY(-4px) scale(0.98);
  pointer-events: none;
  transition: opacity 0.15s, transform 0.15s;
}
.pai-scope .chat-filter-select.is-open .chat-filter-menu{
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.pai-scope .chat-filter-option{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  color: var(--text-secondary);
  transition: background 0.1s;
}
.pai-scope .chat-filter-option:hover{ background: var(--bg-hover); color: var(--text-heading); }
.pai-scope .chat-filter-option-text{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .chat-filter-option-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
  line-height: 1.3;
}
.pai-scope .chat-filter-option-meta{
  font-size: 11px;
  color: var(--text-quaternary);
  line-height: 1.3;
}
.pai-scope .chat-filter-option-count{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 22px;
  padding: 0 8px;
  border-radius: 9999px;
  background: var(--bg-base);
  color: var(--text-tertiary);
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
.pai-scope .chat-filter-check{
  width: 18px;
  height: 18px;
  color: var(--primary);
  opacity: 0;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pai-scope .chat-filter-check svg{ width: 14px; height: 14px; }
.pai-scope .chat-filter-option.is-selected{
  background: var(--primary-muted-bg);
}
.pai-scope .chat-filter-option.is-selected .chat-filter-option-count{
  background: var(--primary);
  color: #fff;
}
.pai-scope .chat-filter-option.is-selected .chat-filter-check{ opacity: 1; }
.pai-scope .chat-filter-dot{
  flex-shrink: 0;
  margin-left: 2px;
}

.pai-scope .chat-list-filters{
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.pai-scope .chat-filter-chip{
  background: var(--bg-base);
  border: 1px solid var(--border);
  color: var(--text-tertiary);
  border-radius: 9999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: all .15s;
}
.pai-scope .chat-filter-chip:hover{
  border-color: var(--border-strong);
  color: var(--text-secondary);
}
.pai-scope .chat-filter-chip.is-active{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.pai-scope .chat-filter-chip-count{
  background: rgba(255,255,255,0.18);
  padding: 1px 6px;
  border-radius: 9999px;
  font-size: 10px;
  font-weight: 600;
}
.pai-scope .chat-filter-chip:not(.is-active) .chat-filter-chip-count{
  background: var(--bg-hover);
  color: var(--text-tertiary);
}

.pai-scope .chat-list-items{
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.pai-scope .chat-list-item{
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background .15s;
  align-items: flex-start;
  text-decoration: none;
}
.pai-scope .chat-list-item:hover{
  background: var(--bg-hover);
}
.pai-scope .chat-list-item.is-active{
  background: var(--primary-subtle);
  border-left: 2px solid var(--primary);
  padding-left: 12px;
}
.pai-scope .chat-list-item-avatar{
  width: 36px;
  height: 36px;
  border-radius: 9999px;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  flex-shrink: 0;
  position: relative;
}
.pai-scope .chat-list-item-avatar.is-online::after{
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 10px;
  background: var(--success-fg);
  border: 2px solid var(--bg-elevated);
  border-radius: 9999px;
}
.pai-scope .chat-list-item-body{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .chat-list-item-name-row{
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.pai-scope .chat-list-item-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}
.pai-scope .chat-list-item-preview{
  font-size: 12px;
  color: var(--text-tertiary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.4;
}
.pai-scope .chat-list-item-meta{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  flex-shrink: 0;
}
.pai-scope .chat-list-item-time{
  font-size: 11px;
  color: var(--text-quaternary);
  white-space: nowrap;
}
.pai-scope .chat-list-item-badge{
  background: var(--primary);
  color: #fff;
  border-radius: 9999px;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 600;
  min-width: 18px;
  text-align: center;
}
.pai-scope .chat-list-item-tag{
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  padding: 1px 6px;
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.pai-scope .chat-list-item-tag.is-escalated{
  background: rgba(192,132,252,0.14);
  color: #c084fc;
}
.pai-scope .chat-list-item-tag.is-active{
  background: var(--success-bg);
  color: var(--success-fg);
}
.pai-scope .chat-list-item-tag.is-resolved{
  background: var(--bg-hover);
  color: var(--text-quaternary);
}
.pai-scope .chat-list-item-tag.is-handoff{
  background: rgba(74, 216, 196,0.14);
  color: #4ad8c4;
}

.pai-scope .chat-detail-panel{
  display: flex;
  flex-direction: column;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  min-height: 620px;
  max-height: 760px;
  position: relative;
  transition: max-height 0.25s, min-height 0.25s;
}
.pai-scope .chat-layout.is-expanded{
  position: fixed;
  top: 64px;            /* below topbar */
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 90;
  padding: 16px;
  background: var(--bg-deep);
  gap: 16px;
  max-height: none;
  margin: 0;
  border-radius: 0;
}
.pai-scope .chat-layout.is-expanded .chat-list-panel{
  max-height: none;
  height: 100%;
}
.pai-scope .chat-layout.is-expanded .chat-detail-panel{
  max-height: none;
  height: 100%;
}
.pai-scope .chat-detail-panel.is-expanded{
  /* legacy state — only used when no parent layout to expand */
  max-height: none;
  min-height: 100%;
}
.pai-scope .chat-detail-header{
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}
.pai-scope .chat-detail-header-left{
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
}
.pai-scope .chat-detail-header-avatar{
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
}
.pai-scope .chat-detail-header-info{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .chat-detail-header-name{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
  display: flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .chat-detail-header-meta{
  font-size: 12px;
  color: var(--text-tertiary);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pai-scope .chat-detail-header-meta-sep{ color: var(--text-muted); }
.pai-scope .chat-detail-header-actions{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.pai-scope .chat-detail-header-icon-actions{
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
}
.pai-scope .icon-btn{
  width: 30px;
  height: 30px;
  border-radius: 9999px;
  background: transparent;
  border: 0;
  color: var(--text-tertiary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .icon-btn:hover{
  background: var(--bg-hover);
  color: var(--text-heading);
}
.pai-scope .icon-btn svg{ width: 15px; height: 15px; }
.pai-scope .icon-btn-sm{ width: 26px; height: 26px; }
.pai-scope .icon-btn-sm svg{ width: 13px; height: 13px; }

.pai-scope .icon-collapse{ display: none; }
.pai-scope .chat-detail-panel.is-expanded [data-chat-expand] .icon-expand{ display: none; }
.pai-scope .chat-detail-panel.is-expanded [data-chat-expand] .icon-collapse{ display: block; }

.pai-scope .chat-summary-panel{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 360px;
  background: var(--bg-base);
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  z-index: 5;
  transform: translateX(100%);
  transition: transform 0.25s ease-out;
  box-shadow: -12px 0 32px rgba(0,0,0,0.3);
}
.pai-scope .chat-detail-panel.is-summary-open .chat-summary-panel{
  transform: translateX(0);
}
.pai-scope .chat-detail-panel.is-summary-open .chat-summary-btn{
  background: var(--primary-muted-bg);
  color: var(--primary-light);
}
.pai-scope .chat-summary-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
}
.pai-scope .chat-summary-eyebrow{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--primary-light);
}
.pai-scope .chat-summary-section{
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .chat-summary-section:last-of-type{ border-bottom: 0; }
.pai-scope .chat-summary-title{
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--text-quaternary);
}
.pai-scope .chat-summary-text{
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0;
}
.pai-scope .chat-summary-text strong{ color: var(--text-heading); font-weight: 600; }

.pai-scope .chat-summary-mood{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pai-scope .chat-summary-mood-bar{
  height: 6px;
  background: var(--bg-hover);
  border-radius: 9999px;
  overflow: hidden;
}
.pai-scope .chat-summary-mood-fill{
  height: 100%;
  background: linear-gradient(90deg, var(--error-fg), #fbbf24, var(--success-fg));
  border-radius: 9999px;
}
.pai-scope .chat-summary-mood-labels{
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--text-quaternary);
}
.pai-scope .chat-summary-mood-value{
  color: var(--success-fg);
  font-weight: 600;
}

.pai-scope .chat-summary-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.pai-scope .chat-summary-chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 9999px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  font-size: 11px;
  color: var(--text-secondary);
  font-weight: 500;
}
.pai-scope .chat-summary-chip-dot{
  width: 6px;
  height: 6px;
  border-radius: 9999px;
}

.pai-scope .chat-summary-actions{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .chat-summary-actions li{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .chat-summary-actions li:hover{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
  color: var(--text-heading);
}
.pai-scope .chat-summary-action-icon{
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .chat-summary-action-icon svg{ width: 14px; height: 14px; }

.pai-scope .chat-summary-foot{
  margin-top: auto;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.pai-scope .chat-summary-foot-meta{
  font-size: 11px;
  color: var(--text-quaternary);
}

.pai-scope @media (max-width: 700px){
  .chat-summary-panel { width: 100%; }
}

.pai-scope .chat-detail-thread{
  flex: 1;
  overflow-y: auto;
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--bg-base);
}
.pai-scope .chat-day-divider{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
}
.pai-scope .chat-day-divider::before, .pai-scope .chat-day-divider::after{
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border);
}
.pai-scope .chat-day-divider span{
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 500;
}
.pai-scope .chat-system-msg{
  align-self: center;
  background: rgba(192,132,252,0.10);
  border: 1px solid rgba(192,132,252,0.24);
  color: #c084fc;
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pai-scope .chat-system-msg svg{ width: 12px; height: 12px; }

.pai-scope .chat-msg{
  display: flex;
  gap: 10px;
  max-width: 78%;
}
.pai-scope .chat-msg-avatar{
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  margin-top: auto;
}
.pai-scope .chat-msg-avatar.is-bot{
  background: linear-gradient(135deg, #34d399, #059669);
  color: #fff;
}
.pai-scope .chat-msg-avatar.is-user{
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
}
.pai-scope .chat-msg-avatar.is-agent{
  background: linear-gradient(135deg, #1fc0ab, #7df0e0);
}
.pai-scope .chat-msg-avatar svg{ width: 16px; height: 16px; }
.pai-scope .chat-msg-body{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.pai-scope .chat-msg-bubble{
  padding: 10px 14px;
  border-radius: 14px 14px 14px 4px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-primary);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  word-wrap: break-word;
}
.pai-scope .chat-msg-meta{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--text-quaternary);
  padding: 0 4px;
}
.pai-scope .chat-msg-meta strong{ color: var(--text-tertiary); font-weight: 600; }

.pai-scope .chat-msg.is-user{
  align-self: flex-end;
  flex-direction: row-reverse;
}
.pai-scope .chat-msg.is-user .chat-msg-bubble{
  background: var(--primary-subtle);
  color: var(--text-primary);
  border-color: rgba(31, 192, 171,0.24);
  border-radius: 14px 14px 4px 14px;
}
.pai-scope .chat-msg.is-user .chat-msg-meta{ justify-content: flex-end; }

.pai-scope .chat-msg.is-agent .chat-msg-bubble{
  background: rgba(31, 192, 171,0.10);
  border-color: rgba(31, 192, 171,0.24);
  border-radius: 14px 14px 14px 4px;
}

.pai-scope .chat-detail-actions{
  border-top: 1px solid var(--border);
  padding: 12px 18px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  background: var(--bg-elevated);
}
.pai-scope .chat-detail-input-wrap{
  flex: 1;
  display: flex;
  gap: 8px;
  align-items: center;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  padding: 8px 14px;
  min-width: 200px;
}
.pai-scope .chat-detail-input-wrap input{
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  font-size: 13px;
  color: var(--text-primary);
}
.pai-scope .chat-detail-input-wrap input::placeholder{ color: var(--text-quaternary); }

.pai-scope .team-stats-row{
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 4px 0 8px;
}
.pai-scope .team-stat{
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 6px 28px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
  min-width: 0;
  position: relative;
}
.pai-scope .team-stat:first-child{ padding-left: 4px; }
.pai-scope .team-stat:not(:first-child)::before{
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 1px;
  background: var(--border);
}
.pai-scope .team-stat-label{
  order: 2;
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pai-scope .team-stat-label svg{ display: none; }
.pai-scope .team-stat-value{
  order: 1;
  font-size: 24px;
  font-weight: 700;
  color: var(--text-heading);
  letter-spacing: -0.4px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.pai-scope .team-stat-foot{
  order: 3;
  font-size: 11px;
  color: var(--text-quaternary);
  font-weight: 500;
}

@media (max-width: 900px) {
  .pai-scope .team-stats-row{ flex-wrap: wrap; }
  .pai-scope .team-stat{ flex: 0 0 calc(50% - 0px); padding-left: 4px; padding-right: 4px; }
  .pai-scope .team-stat:not(:first-child)::before{ display: none; }
}

.pai-scope .team-member-row{
  display: grid;
  grid-template-columns: 1.6fr 1fr 0.7fr 0.6fr 110px;
  gap: 12px;
  padding: 14px 16px;
  align-items: center;
  border-bottom: 1px solid var(--border);
}
.pai-scope .team-member-row:last-child{ border-bottom: 0; }
.pai-scope .team-member-row:hover{ background: var(--bg-hover); }
.pai-scope .team-member-cell{
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.pai-scope .team-member-avatar{
  width: 36px;
  height: 36px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  position: relative;
}
.pai-scope .team-member-avatar.is-online::after, .pai-scope .team-member-avatar.is-away::after, .pai-scope .team-member-avatar.is-offline::after{
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 10px;
  border: 2px solid var(--bg-elevated);
  border-radius: 9999px;
}
.pai-scope .team-member-avatar.is-online::after{ background: var(--success-fg); }
.pai-scope .team-member-avatar.is-away::after{ background: #fbbf24; }
.pai-scope .team-member-avatar.is-offline::after{ background: var(--text-muted); }

.pai-scope .team-member-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pai-scope .team-member-email{
  font-size: 11px;
  color: var(--text-quaternary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pai-scope .team-member-info{ min-width: 0; display: flex; flex-direction: column; gap: 1px; }

.pai-scope .status-dot-row{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-secondary);
}
.pai-scope .status-dot-row::before{
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 9999px;
}
.pai-scope .status-dot-row.is-online{ color: var(--success-fg); }
.pai-scope .status-dot-row.is-online::before{ background: var(--success-fg); }
.pai-scope .status-dot-row.is-away{ color: #fbbf24; }
.pai-scope .status-dot-row.is-away::before{ background: #fbbf24; }
.pai-scope .status-dot-row.is-offline{ color: var(--text-quaternary); }
.pai-scope .status-dot-row.is-offline::before{ background: var(--text-muted); }

.pai-scope .team-member-stat{
  font-size: 13px;
  color: var(--text-heading);
  font-weight: 600;
}
.pai-scope .team-member-stat-sub{
  font-size: 11px;
  color: var(--text-quaternary);
}

.pai-scope ::-webkit-scrollbar{ width: 6px; height: 6px; }
.pai-scope ::-webkit-scrollbar-track{ background: transparent; }
.pai-scope ::-webkit-scrollbar-thumb{ background: var(--border-strong); border-radius: 3px; }
.pai-scope ::-webkit-scrollbar-thumb:hover{ background: var(--text-muted); }

.pai-scope @media (max-width: 1440px){
  .top-nav-item { padding: 0 12px; }
}

@media (max-width: 1280px) {
  .pai-scope .stats-row{ grid-template-columns: repeat(2, 1fr); }
  .pai-scope .bots-grid{ grid-template-columns: repeat(2, 1fr); }
  .pai-scope .plans-grid{ grid-template-columns: 1fr; }
  .pai-scope .roles-grid{ grid-template-columns: 1fr; }
  .pai-scope .split{ grid-template-columns: 1fr; }
  .pai-scope .search{ width: 200px; }
  .pai-scope .top-nav-item span{ display: none; }
  .pai-scope .top-nav-item{ padding: 0; width: 36px; height: 36px; justify-content: center; }
  .pai-scope .top-nav-item svg{ width: 18px; height: 18px; }
  .pai-scope .body-with-side{ grid-template-columns: 1fr 300px; }
  .pai-scope .main::before{ right: 324px; }
}

@media (max-width: 1200px) {
  .pai-scope .chat-layout{ grid-template-columns: 320px 1fr; }
  .pai-scope .team-stats-row{ grid-template-columns: repeat(2, 1fr); }
  .pai-scope .team-member-row{ grid-template-columns: 1.6fr 0.9fr 0.6fr 110px; }
  .pai-scope .team-member-row .team-member-col-tickets{ display: none; }
}

@media (max-width: 1100px) {
  .pai-scope .body-with-side{ grid-template-columns: 1fr; }
  .pai-scope .body-side{ position: static; max-height: none; }
  .pai-scope .activity-panel{ max-height: none; }
  .pai-scope .main::before{ display: none; }
  .pai-scope .main:has(.body-with-side){ background: var(--bg-base); }
}

@media (max-width: 900px) {
  .pai-scope .menu-btn{ display: inline-flex; }
  .pai-scope .top-nav-list{ display: none; }
  .pai-scope .topbar-divider{ display: none; }
  .pai-scope .search{ display: none; }
  .pai-scope .usage-pill{ display: none; }
  .pai-scope .org-picker-trigger span:not(.org-emblem){ display: none; }
  .pai-scope .org-picker-trigger{ padding: 0 8px; }
  .pai-scope .topbar{ padding: 0 16px; gap: 8px; }
  .pai-scope .mobile-nav-drawer{ display: flex; }
  .pai-scope .body{ padding: 16px 16px 96px; }
  .pai-scope .stats-row{ grid-template-columns: 1fr; }
  .pai-scope .bots-grid{ grid-template-columns: 1fr; }
  .pai-scope .form-row{ grid-template-columns: 1fr; }
  .pai-scope .table-row{ grid-template-columns: 1fr !important; gap: 8px; padding: 14px; }
  .pai-scope .table-row-head{ display: none; }
  .pai-scope .col-actions{ justify-content: flex-start; }
  .pai-scope .page-header{ flex-direction: column; align-items: stretch; }
  .pai-scope .page-header-right{ justify-content: flex-start; }
  .pai-scope .breadcrumbs-bar{ padding: 12px 16px 0; }
  .pai-scope .chat-layout{ grid-template-columns: 1fr; }
  .pai-scope .chat-list-panel{ max-height: 320px; min-height: 280px; }
  .pai-scope .chat-detail-panel{ min-height: 480px; }
  .pai-scope .team-stats-row{ grid-template-columns: 1fr; }
  .pai-scope .team-member-row{ grid-template-columns: 1fr; gap: 10px; padding: 14px; }
  .pai-scope .team-member-row .team-member-col-status, .pai-scope .team-member-row .team-member-col-tickets, .pai-scope .team-member-row .team-member-col-actions{ justify-content: flex-start; }
}

.pai-scope .radio-group{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
}
.pai-scope .radio-group-row{
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
}
.pai-scope .radio-row{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: var(--bg-base);
  border: 1.5px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  font-size: 13px;
  color: var(--text-primary);
  user-select: none;
}
.pai-scope .radio-row:hover{ border-color: var(--border-strong); }
.pai-scope .radio-row.is-selected{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
  color: var(--text-heading);
}
.pai-scope .radio-row input[type="radio"]{
  appearance: none;
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 1.5px solid var(--border-strong);
  background: transparent;
  flex-shrink: 0;
  margin: 0;
  position: relative;
  transition: border-color 0.15s;
}
.pai-scope .radio-row.is-selected input[type="radio"]{
  border-color: var(--primary);
  background: var(--primary);
  box-shadow: inset 0 0 0 3px var(--bg-base);
}

.pai-scope .integration-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pai-scope .integration-row{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--bg-base);
  border-radius: 12px;
}
.pai-scope .integration-row-icon{
  width: 40px; height: 40px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .integration-row-icon svg{ width: 20px; height: 20px; }
.pai-scope .integration-row-text{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pai-scope .integration-row-name{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .integration-row-meta{
  font-size: 12px;
  color: var(--text-quaternary);
}
.pai-scope .integration-row-actions{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.pai-scope .multiselect-chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
}
.pai-scope .multiselect-chip-dot{
  width: 6px; height: 6px;
  border-radius: 999px;
}
.pai-scope .multiselect-chip svg{
  width: 12px; height: 12px;
  opacity: 0.6;
  cursor: pointer;
}
.pai-scope .multiselect-chip svg:hover{ opacity: 1; }

.pai-scope .toast-stack{
  position: fixed;
  left: 50%;
  top: 84px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 2000;
  pointer-events: none;
}
.pai-scope .toast{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px 10px 12px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text-primary);
  font-size: 13px;
  line-height: 1.4;
  box-shadow: 0 8px 24px rgba(0,0,0,0.4);
  pointer-events: auto;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.2s, transform 0.2s;
  max-width: 360px;
}
.pai-scope .toast.is-shown{ opacity: 1; transform: translateY(0); }
.pai-scope .toast.is-success{ border-color: rgba(74,222,128,0.32); }
.pai-scope .toast.is-success .toast-icon{ color: var(--success-fg); background: rgba(74,222,128,0.14); }
.pai-scope .toast.is-error{ border-color: rgba(244,63,94,0.32); }
.pai-scope .toast.is-error .toast-icon{ color: var(--error-fg); background: rgba(244,63,94,0.14); }
.pai-scope .toast-icon{
  width: 22px; height: 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(31, 192, 171,0.14);
  color: var(--primary-light);
  flex-shrink: 0;
}
.pai-scope .toast-icon svg{ width: 12px; height: 12px; }
.pai-scope .toast-text{ min-width: 0; }
.pai-scope .toast-title{ font-weight: 600; color: var(--text-heading); }
.pai-scope .toast-body{ color: var(--text-tertiary); font-size: 12px; }

.pai-scope .confirm-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
  padding: 20px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  opacity: 0;
  transition: opacity 0.15s;
}
.pai-scope .confirm-backdrop.is-shown{ opacity: 1; }
.pai-scope .confirm-dialog{
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 24px;
  width: 100%;
  max-width: 440px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.pai-scope .confirm-icon{
  width: 40px; height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(244,63,94,0.14);
  color: var(--error-fg);
  margin-bottom: 14px;
}
.pai-scope .confirm-icon svg{ width: 20px; height: 20px; }
.pai-scope .confirm-title{
  font-size: 16px;
  font-weight: 700;
  color: var(--text-heading);
  margin: 0 0 6px;
}
.pai-scope .confirm-body{
  font-size: 13px;
  color: var(--text-tertiary);
  margin: 0 0 18px;
  line-height: 1.5;
}
.pai-scope .confirm-actions{
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.pai-scope .q-row{ cursor: pointer; transition: background 0.15s; }
.pai-scope .q-row:hover{ background: var(--bg-elevated); }

.pai-scope .outcome-row{ cursor: default; transition: background 0.15s; }

.pai-scope .role-card{ cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.pai-scope .role-card:not(.is-current):hover{
  border-color: var(--border-strong);
  background: var(--bg-elevated);
}

.pai-scope .legend-stat{ transition: opacity 0.15s; }
.pai-scope .overview-legend li:hover .legend-stat{ opacity: 0.85; }

.pai-scope .split-btn-wrap{
  position: relative;
  display: inline-flex;
}
.pai-scope .split-btn-menu{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 220px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 6px;
  display: none;
  flex-direction: column;
  gap: 2px;
  z-index: 100;
  box-shadow: 0 12px 32px rgba(0,0,0,0.4);
}
.pai-scope .split-btn-wrap.is-open .split-btn-menu{ display: flex; }
.pai-scope .split-btn-item{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 8px;
  text-decoration: none;
  color: var(--text-primary);
  cursor: pointer;
  transition: background 0.15s;
}
.pai-scope .split-btn-item:hover{ background: var(--bg-base); }
.pai-scope .split-btn-item-icon{
  width: 32px; height: 32px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pai-scope .split-btn-item-icon svg{ width: 16px; height: 16px; }
.pai-scope .split-btn-item-text{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pai-scope .split-btn-item-title{ font-size: 13px; font-weight: 600; color: var(--text-heading); }
.pai-scope .split-btn-item-sub{ font-size: 11px; color: var(--text-quaternary); line-height: 1.4; }

.pai-scope .filter-popover-wrap{
  position: relative;
  display: inline-flex;
}
.pai-scope .filter-count-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 9999px;
  background: var(--primary);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  margin-left: 4px;
}
.pai-scope .filter-popover{
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 320px;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px;
  display: none;
  flex-direction: column;
  gap: 14px;
  z-index: 100;
  box-shadow: 0 16px 40px rgba(0,0,0,0.45);
}
.pai-scope .filter-popover-wrap.is-open .filter-popover{ display: flex; }
.pai-scope .filter-popover-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pai-scope .filter-popover-title{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .filter-popover-head .link-primary{ font-size: 12px; }
.pai-scope .filter-group{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .filter-group-label{
  font-size: 10px;
  font-weight: 600;
  color: var(--text-quaternary);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.pai-scope .filter-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.pai-scope .filter-chip{
  padding: 5px 10px;
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 9999px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.pai-scope .filter-chip:hover{
  border-color: var(--border-strong);
  color: var(--text-heading);
}
.pai-scope .filter-chip.is-active{
  background: var(--primary-muted-bg);
  border-color: var(--primary);
  color: var(--primary-light);
}
.pai-scope .filter-popover-foot{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.pai-scope .filter-popover-count{
  font-size: 12px;
  color: var(--text-quaternary);
}
.pai-scope .bots-empty{
  grid-column: 1 / -1;
  padding: 32px 24px;
  text-align: center;
  color: var(--text-quaternary);
  font-size: 13px;
  background: var(--bg-surface);
  border-radius: 16px;
}

.pai-scope .daterange-wrap{ position: relative; display: inline-flex; }
.pai-scope .daterange-popover{
  position: fixed;
  display: none;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 16px 40px rgba(0,0,0,0.45);
  z-index: 1500;
  overflow: hidden;
  width: 660px;
  max-width: calc(100vw - 32px);
  flex-direction: row;
}
.pai-scope .daterange-wrap.is-open .daterange-popover, .pai-scope .daterange-popover.is-open{ display: flex; }

.pai-scope .daterange-presets{
  list-style: none;
  margin: 0;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--bg-base);
  border-right: 1px solid var(--border);
  width: 160px;
  flex-shrink: 0;
}
.pai-scope .daterange-presets li{ margin: 0; }
.pai-scope .daterange-preset{
  display: block;
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 13px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .daterange-preset:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .daterange-preset.is-active{
  background: var(--primary-muted-bg);
  color: var(--primary-light);
  font-weight: 500;
}

.pai-scope .daterange-cal-wrap{
  flex: 1;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pai-scope .daterange-cal-nav{
  display: grid;
  grid-template-columns: 28px 1fr 28px;
  align-items: center;
  gap: 8px;
}
.pai-scope .daterange-cal-months{
  display: grid;
  grid-template-columns: 1fr 1fr;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .daterange-nav-btn{
  width: 28px; height: 28px;
  border-radius: 8px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-secondary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pai-scope .daterange-nav-btn:hover{ background: var(--bg-base); color: var(--text-heading); border-color: var(--border-strong); }
.pai-scope .daterange-nav-btn svg{ width: 14px; height: 14px; }

.pai-scope .daterange-cals{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.pai-scope .daterange-cal{
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  font-size: 12px;
}
.pai-scope .daterange-cal-head{
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  color: var(--text-quaternary);
  text-transform: uppercase;
  letter-spacing: 0.4px;
  padding: 4px 0;
}
.pai-scope .daterange-day{
  position: relative;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--text-primary);
  cursor: pointer;
  background: transparent;
  border: 0;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  transition: background 0.1s, color 0.1s;
}
.pai-scope .daterange-day.is-out{ color: var(--text-quaternary); opacity: 0.45; }
.pai-scope .daterange-day:hover:not(:disabled){ background: var(--bg-base); }
.pai-scope .daterange-day.is-in-range{
  background: var(--primary-muted-bg);
  border-radius: 0;
  color: var(--text-heading);
}
.pai-scope .daterange-day.is-range-start, .pai-scope .daterange-day.is-range-end{
  background: var(--primary);
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  z-index: 1;
}
.pai-scope .daterange-day.is-range-start{ border-radius: 6px 0 0 6px; }
.pai-scope .daterange-day.is-range-end{ border-radius: 0 6px 6px 0; }
.pai-scope .daterange-day.is-range-start.is-range-end{ border-radius: 6px; }
.pai-scope .daterange-day.is-today:not(.is-range-start):not(.is-range-end){
  outline: 1px solid var(--border-strong);
}

.pai-scope .daterange-foot{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.pai-scope .daterange-input{
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 12px;
  font-family: 'JetBrains Mono', monospace;
  color: var(--text-primary);
  outline: none;
  transition: border-color 0.15s;
}
.pai-scope .daterange-input:focus{ border-color: var(--primary); }

.pai-scope .modal-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1200;
  padding: 20px;
  opacity: 0;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition: opacity 0.15s;
}
.pai-scope .modal-backdrop[hidden]{ display: none !important; }
.pai-scope .modal-backdrop.is-shown{ opacity: 1; }
.pai-scope .modal-dialog{
  width: 100%;
  max-width: 480px;
  max-height: calc(100vh - 40px);
  background: var(--bg-base);
  border: 1px solid var(--border);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(0,0,0,0.6);
  transform: translateY(10px);
  transition: transform 0.2s;
}
.pai-scope .modal-backdrop.is-shown .modal-dialog{ transform: translateY(0); }
.pai-scope .modal-dialog-md{ max-width: 560px; }
.pai-scope .modal-dialog-lg{ max-width: 720px; }
.pai-scope .modal-head{
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 22px 22px 14px;
}
.pai-scope .modal-head-icon{
  width: 40px; height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .modal-head-icon svg{ width: 20px; height: 20px; }
.pai-scope .modal-head-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.pai-scope .modal-title{ font-size: 16px; font-weight: 700; color: var(--text-heading); margin: 0; }
.pai-scope .modal-subtitle{ font-size: 13px; color: var(--text-tertiary); margin: 0; line-height: 1.5; }
.pai-scope .modal-close{
  width: 32px; height: 32px;
  border-radius: 8px;
  background: transparent;
  border: 0;
  color: var(--text-quaternary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .modal-close:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .modal-close svg{ width: 16px; height: 16px; }
.pai-scope .modal-body{
  padding: 4px 22px 18px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pai-scope .modal-foot{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 14px 22px;
  border-top: 1px solid var(--border);
}

.pai-scope .invite-role-list{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pai-scope .invite-role-row{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--bg-elevated);
  border: 1.5px solid var(--border);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.pai-scope .invite-role-row:hover{ border-color: var(--border-strong); }
.pai-scope .invite-role-row.is-selected{
  border-color: var(--primary);
  background: var(--primary-muted-bg);
}
.pai-scope .invite-role-row input[type="radio"]{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.pai-scope .invite-role-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pai-scope .invite-role-name{ font-size: 13px; font-weight: 600; color: var(--text-heading); }
.pai-scope .invite-role-sub{ font-size: 11px; color: var(--text-quaternary); line-height: 1.4; }
.pai-scope .invite-role-check{
  width: 22px; height: 22px;
  border-radius: 999px;
  border: 1.5px solid var(--border-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  flex-shrink: 0;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.pai-scope .invite-role-row.is-selected .invite-role-check{
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.pai-scope .invite-role-check svg{ width: 12px; height: 12px; }

.pai-scope .invite-row-head{
  display: grid;
  grid-template-columns: 1fr 160px 32px;
  gap: 8px;
  margin-bottom: 6px;
  padding: 0 2px;
}
.pai-scope .invite-row-head-label{
  font-size: 10px;
  font-weight: 600;
  color: var(--text-quaternary);
  text-transform: uppercase;
  letter-spacing: 0.6px;
}
.pai-scope .invite-rows{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .invite-row{
  display: grid;
  grid-template-columns: 1fr 160px 32px;
  gap: 8px;
  align-items: center;
}
.pai-scope .invite-row .invite-row-email, .pai-scope .invite-row .invite-row-role{
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  color: var(--text-primary);
  outline: none;
  transition: border-color 0.15s;
  width: 100%;
}
.pai-scope .invite-row .invite-row-email:focus, .pai-scope .invite-row .invite-row-role:focus{ border-color: var(--primary); }
.pai-scope .invite-row.is-invalid .invite-row-email{ border-color: var(--error-fg); }
.pai-scope .invite-row .invite-row-role{
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23a3a3a3' stroke-width='1.67' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 32px;
  cursor: pointer;
}
.pai-scope .invite-row-remove{
  width: 32px; height: 32px;
  background: transparent;
  border: 0;
  color: var(--text-quaternary);
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .invite-row-remove:hover{ background: var(--bg-elevated); color: var(--error-fg); }
.pai-scope .invite-row-remove svg{ width: 14px; height: 14px; }

.pai-scope .invite-link{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--bg-elevated);
  border: 1px dashed var(--border-strong);
  border-radius: 10px;
}
.pai-scope .invite-link-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pai-scope .invite-link-title{ font-size: 12px; font-weight: 600; color: var(--text-heading); }
.pai-scope .invite-link-sub{ font-size: 11px; color: var(--text-quaternary); line-height: 1.4; }

.pai-scope .member-detail-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 8px;
  flex-wrap: wrap;
}
.pai-scope .member-detail-left{
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}
.pai-scope .avatar-xl{
  width: 64px;
  height: 64px;
  border-radius: 9999px;
  font-size: 20px;
  font-weight: 700;
}
.pai-scope .member-detail-info{ display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pai-scope .member-detail-title-row{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.pai-scope .member-detail-name{
  font-size: 22px;
  font-weight: 700;
  color: var(--text-heading);
  margin: 0;
  letter-spacing: -0.3px;
}
.pai-scope .member-detail-meta{
  font-size: 13px;
  color: var(--text-tertiary);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pai-scope .member-detail-meta-sep{ color: var(--text-quaternary); }
.pai-scope .member-detail-meta strong{ color: var(--text-secondary); font-weight: 500; }
.pai-scope .member-detail-actions{ display: inline-flex; gap: 8px; align-items: center; flex-shrink: 0; }

.pai-scope .member-detail-grid{
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 16px;
  align-items: start;
}
.pai-scope .member-detail-side{ display: flex; flex-direction: column; gap: 16px; }

.pai-scope .member-perms{
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pai-scope .member-perm{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text-secondary);
  padding: 4px 0;
}
.pai-scope .member-perm svg{ width: 14px; height: 14px; flex-shrink: 0; }
.pai-scope .member-perm.is-allowed{ color: var(--text-primary); }
.pai-scope .member-perm.is-allowed svg{ color: var(--success-fg); }
.pai-scope .member-perm.is-denied{ color: var(--text-quaternary); }
.pai-scope .member-perm.is-denied svg{ color: var(--error-fg); opacity: 0.7; }

.pai-scope .member-bots{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .member-bot{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--bg-elevated);
  border-radius: 12px;
}
.pai-scope .member-bot-thumb{
  width: 36px; height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pai-scope .member-bot-thumb svg{ width: 18px; height: 18px; }
.pai-scope .member-bot-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pai-scope .member-bot-name{ font-size: 13px; font-weight: 600; color: var(--text-heading); }
.pai-scope .member-bot-sub{ font-size: 11px; color: var(--text-quaternary); }

.pai-scope .member-sessions{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .member-session{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--bg-elevated);
  border-radius: 12px;
}
.pai-scope .member-session-icon{
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--bg-base);
  color: var(--text-tertiary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .member-session-icon svg{ width: 16px; height: 16px; }
.pai-scope .member-session-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pai-scope .member-session-name{ font-size: 13px; font-weight: 600; color: var(--text-heading); }
.pai-scope .member-session-meta{ font-size: 11px; color: var(--text-quaternary); }

@media (max-width: 1100px) {
  .pai-scope .member-detail-grid{ grid-template-columns: 1fr; }
  .pai-scope .member-detail-header{ flex-direction: column; align-items: flex-start; }
  .pai-scope .member-detail-actions{ width: 100%; }
}

.pai-scope .app-shell{
  display: grid;
  grid-template-columns: 248px 1fr;
  min-height: 100vh;
  background: var(--shell-body);
}
.pai-scope .app-sidebar{
  position: sticky;
  top: 0;
  height: 100vh;
  width: 248px;
  flex-shrink: 0;
  background: var(--shell-bar);
  border-right: 0;
  display: flex;
  flex-direction: column;
  padding: 16px 12px;
  gap: 16px;
  overflow-y: auto;
}
.pai-scope .app-sidebar-head{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 12px;
  flex-shrink: 0;
}

.pai-scope .app-sidebar-ws-wrap{
  position: relative;
  padding: 0 4px 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 4px;
  flex-shrink: 0;
}
.pai-scope .app-sidebar-ws{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  background: var(--bg-elevated);
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: background 0.15s, border-color 0.15s;
}
.pai-scope .app-sidebar-ws:hover{ background: var(--bg-base); border-color: var(--border); }
.pai-scope .app-sidebar-ws-wrap.open .app-sidebar-ws{ border-color: var(--border-strong); }
.pai-scope .app-sidebar-ws .org-emblem{
  width: 32px;
  height: 32px;
  border-radius: 9999px;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-end, #7df0e0) 100%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}
.pai-scope .app-sidebar-ws-text{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
  overflow: hidden;
}
.pai-scope .app-sidebar-ws-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pai-scope .app-sidebar-ws-meta{
  font-size: 11px;
  color: var(--text-quaternary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pai-scope .app-sidebar-ws-chev{
  flex-shrink: 0;
  color: var(--text-quaternary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pai-scope .app-sidebar-ws-chev svg{ width: 14px; height: 14px; }
.pai-scope .app-sidebar-ws-wrap.open .app-sidebar-ws-chev{ color: var(--text-secondary); }
.pai-scope .app-sidebar-logo{
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  text-decoration: none;
}
.pai-scope .app-sidebar-logo img{ height: 22px; }
.pai-scope .app-sidebar-workspace{
  flex: 1;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 0;
  padding: 6px 8px;
  border-radius: 8px;
  cursor: pointer;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 500;
  transition: background 0.15s;
  min-width: 0;
}
.pai-scope .app-sidebar-workspace:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .app-sidebar-workspace span:nth-child(2){ flex: 1; text-align: left; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pai-scope .app-sidebar-workspace svg{ width: 14px; height: 14px; flex-shrink: 0; opacity: 0.5; }

.pai-scope .app-sidebar-nav{
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow-y: auto;
  min-height: 0;
}
.pai-scope .app-sidebar-section{ display: flex; flex-direction: column; gap: 2px; }
.pai-scope .app-sidebar-label{
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--text-quaternary);
  padding: 6px 10px;
}
.pai-scope .app-sidebar-item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  text-decoration: none;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
  background: transparent;
  border: 0;
  text-align: left;
  width: 100%;
}
.pai-scope .app-sidebar-item:hover{ background: var(--bg-elevated); color: var(--text-heading); }
.pai-scope .app-sidebar-item.is-active{
  background: var(--primary-muted-bg);
  color: var(--primary-light);
}
.pai-scope .app-sidebar-item-icon{
  width: 18px; height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  opacity: 0.85;
}
.pai-scope .app-sidebar-item-icon svg{ width: 18px; height: 18px; }
.pai-scope .app-sidebar-item.is-active .app-sidebar-item-icon{ opacity: 1; }
.pai-scope .app-sidebar-item-text{ flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pai-scope .app-sidebar-count{
  background: var(--bg-elevated);
  color: var(--text-quaternary);
  font-size: 11px;
  font-weight: 600;
  padding: 1px 7px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}
.pai-scope .app-sidebar-item.is-active .app-sidebar-count{ background: rgba(31, 192, 171,0.24); color: var(--primary-light); }

.pai-scope .app-sidebar-sub{
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-left: 28px;
  margin-top: 2px;
}
.pai-scope .app-sidebar-sub a{
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 400;
  border-radius: 6px;
  color: var(--text-tertiary);
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.pai-scope .app-sidebar-sub a:hover{ background: var(--bg-elevated); color: var(--text-heading); }

.pai-scope .app-sidebar-bots{
  padding-left: 8px;
  gap: 2px;
}
.pai-scope .app-sidebar-bot{
  display: flex !important;
  align-items: center;
  gap: 8px;
  padding: 6px 8px !important;
  font-size: 12px !important;
  color: var(--text-secondary) !important;
  border-radius: 7px !important;
}
.pai-scope .app-sidebar-bot-thumb{
  width: 20px;
  height: 20px;
  border-radius: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .app-sidebar-bot-thumb svg{
  width: 12px;
  height: 12px;
  color: #fff;
}
.pai-scope .app-sidebar-bot-name{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1;
}
.pai-scope .app-sidebar-sub a.app-sidebar-bot.is-active{
  background: var(--primary-muted-bg);
  color: var(--primary-light) !important;
}

.pai-scope .app-sidebar-foot{
  border-top: 1px solid var(--border);
  padding-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex-shrink: 0;
}
.pai-scope .app-sidebar-user-wrap{
  margin-top: 8px;
  position: relative;
}
.pai-scope .app-sidebar-user{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: var(--bg-elevated);
  border: 1px solid transparent;
  border-radius: 10px;
  width: 100%;
  cursor: pointer;
  text-align: left;
  transition: background 0.15s, border-color 0.15s;
  font: inherit;
  color: inherit;
}
.pai-scope .app-sidebar-user:hover{ background: var(--bg-base); border-color: var(--border); }
.pai-scope .app-sidebar-user-wrap.open .app-sidebar-user{ border-color: var(--border-strong); }
.pai-scope .app-sidebar-user-text{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; overflow: hidden; }
.pai-scope .app-sidebar-user-name{ font-size: 12px; font-weight: 600; color: var(--text-heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pai-scope .app-sidebar-user-meta{ font-size: 10px; color: var(--text-quaternary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pai-scope .app-sidebar-user-chev{
  color: var(--text-quaternary);
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.15s;
}
.pai-scope .app-sidebar-user-chev svg{ width: 14px; height: 14px; }
.pai-scope .app-sidebar-user-wrap.open .app-sidebar-user-chev{ transform: rotate(180deg); color: var(--text-secondary); }

.pai-scope .app-content{
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.pai-scope .app-content-topbar{
  height: 56px;
  min-height: 56px;
  flex-shrink: 0;
  padding: 0 24px;
  background: var(--shell-bar);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  position: sticky;
  top: 0;
  z-index: 10;
}
.pai-scope .app-content-topbar-left{ display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.pai-scope .app-content-topbar-title{ font-size: 15px; font-weight: 700; color: var(--text-heading); }
.pai-scope .app-content-topbar-meta{ font-size: 12px; color: var(--text-quaternary); }
.pai-scope .app-content-topbar-right{ display: inline-flex; align-items: center; gap: 8px; }
.pai-scope .app-content-body{
  flex: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  background: var(--shell-body);
  position: relative;
  padding: 0;
  border-top-left-radius: 20px;
}
.pai-scope .app-content-body:has(.detail-shell){
  border-top-left-radius: 0;
}
.pai-scope .app-content-topbar{ border-bottom: 0 !important; }
.pai-scope .app-content{ background: var(--shell-bar); }
.pai-scope .app-content-body > .stats-row, .pai-scope .app-content-body > .form-row, .pai-scope .app-content-body > .card, .pai-scope .app-content-body > .grid{
  margin-left: 24px;
  margin-right: 24px;
}
.pai-scope .app-content-body > .stats-row:first-child, .pai-scope .app-content-body > .form-row:first-child, .pai-scope .app-content-body > .card:first-child, .pai-scope .app-content-body > .grid:first-child{
  margin-top: 24px;
}

@media (max-width: 900px) {
  .pai-scope .app-shell{ grid-template-columns: 1fr; }
  .pai-scope .app-sidebar{ position: relative; height: auto; }
}

.pai-scope .detail-shell{
  display: grid;
  grid-template-columns: 216px 1fr;
  gap: 0;
  align-items: flex-start;
  flex: 1;
  width: 100%;
  background: var(--shell-body);
}
.pai-scope .detail-nav{
  position: sticky;
  top: 56px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 16px 12px;
  background: var(--shell-aux);
  border-right: 1px solid var(--border);
  align-self: stretch;
  min-height: calc(100vh - 56px);
  border-top-left-radius: 20px;
}
.pai-scope .detail-nav-label{ display: none; }
.pai-scope .detail-nav-item{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: transparent;
  border: 1px solid transparent;
  color: var(--text-secondary);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  text-align: left;
  width: 100%;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  text-decoration: none;
}
.pai-scope .detail-nav-item svg{ display: none; }
.pai-scope .detail-nav-item:hover{
  background: var(--bg-elevated);
  color: var(--text-primary);
}
.pai-scope .detail-nav-item.is-active, .pai-scope .detail-nav-item.active{
  background: var(--primary-muted-bg);
  color: var(--primary-light);
  font-weight: 600;
}
.pai-scope .detail-nav-item.is-danger{
  color: var(--danger-fg);
}
.pai-scope .detail-nav-item.is-danger:hover{ background: rgba(239,68,68,0.08); }
.pai-scope .detail-nav-item.is-danger.is-active, .pai-scope .detail-nav-item.is-danger.active{
  background: rgba(239,68,68,0.12);
  color: var(--danger-fg);
}
.pai-scope .detail-nav-divider{
  height: 1px;
  background: var(--border);
  margin: 8px 6px;
}
.pai-scope .detail-main{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  background: var(--shell-body);
  border-top-left-radius: 20px;
}
.pai-scope .detail-main > .bot-detail-header{
  margin: 0 0 8px;
}
.pai-scope .detail-main #tabPanels{ display: contents; }
.pai-scope .detail-main .tab-panel{ display: none; flex-direction: column; gap: 16px; }
.pai-scope .detail-main .tab-panel.active{ display: flex; }

@media (max-width: 1100px) {
  .pai-scope .detail-shell{ grid-template-columns: 184px 1fr; gap: 18px; }
}
@media (max-width: 900px) {
  .pai-scope .detail-shell{ grid-template-columns: 1fr; padding: 0 16px 16px; }
  .pai-scope .detail-nav{
    position: relative;
    top: auto;
    flex-direction: row;
    overflow-x: auto;
    flex-wrap: nowrap;
    border-right: none;
    border-bottom: 1px solid var(--border);
    padding: 8px 0;
    min-height: 0;
    align-self: auto;
  }
  .pai-scope .detail-nav-label{ display: none; }
  .pai-scope .detail-nav-item{ flex-shrink: 0; }
}

.pai-scope .guidance-groups{
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pai-scope .guidance-group{
  padding: 20px 0;
  border-bottom: 1px solid var(--border);
}
.pai-scope .guidance-group:last-child{ border-bottom: 0; padding-bottom: 0; }
.pai-scope .guidance-group:first-child{ padding-top: 4px; }
.pai-scope .guidance-group-head{
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}
.pai-scope .guidance-group-icon{
  width: 26px;
  height: 26px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--primary-subtle);
  color: var(--primary-light);
  flex-shrink: 0;
}
.pai-scope .guidance-group-icon svg{ width: 15px; height: 15px; }
.pai-scope .guidance-group-title{
  font-size: 14px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .guidance-rules{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}
.pai-scope .guidance-rule{
  display: flex;
  align-items: center;
  gap: 8px;
}
.pai-scope .guidance-rule-input{ flex: 1; min-width: 0; }
.pai-scope .guidance-rule-del{
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--text-quaternary);
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pai-scope .guidance-rule-del svg{ width: 16px; height: 16px; }
.pai-scope .guidance-rule-del:hover{
  background: var(--error-bg);
  color: var(--error-fg);
  border-color: var(--error-border);
}
.pai-scope .guidance-suggest{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 12px;
}
.pai-scope .guidance-suggest-label{
  font-size: 12px;
  color: var(--text-quaternary);
  margin-right: 2px;
}
.pai-scope .guidance-chip{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px 5px 9px;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-secondary);
  background: var(--bg-elevated);
  border: 1px dashed var(--border-strong);
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pai-scope .guidance-chip::before{
  content: "+";
  font-size: 13px;
  line-height: 1;
  color: var(--text-quaternary);
  transition: color 0.15s;
}
.pai-scope .guidance-chip:hover{
  background: var(--primary-subtle);
  border-color: var(--primary);
  border-style: solid;
  color: var(--primary-light);
}
.pai-scope .guidance-chip:hover::before{ color: var(--primary-light); }
.pai-scope .guidance-chip.is-used{
  opacity: 0.4;
  pointer-events: none;
}
.pai-scope .guidance-add-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px 7px 8px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--primary-light);
  background: transparent;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s;
}
.pai-scope .guidance-add-btn svg{ width: 16px; height: 16px; }
.pai-scope .guidance-add-btn:hover{ background: var(--primary-subtle); }

.pai-scope .convos-toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px 12px;
  border-bottom: 1px solid var(--border);
}
.pai-scope .convos-bot-filters{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.pai-scope .convos-bot-pill{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 6px;
  border-radius: 999px;
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-secondary);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.pai-scope .convos-bot-pill:hover{ background: var(--bg-elevated); color: var(--text-heading); border-color: var(--border-strong); }
.pai-scope .convos-bot-pill.is-active{
  background: var(--primary-muted-bg);
  color: var(--primary-light);
  border-color: rgba(31, 192, 171,0.35);
}
.pai-scope .convos-bot-pill-icon{
  width: 20px;
  height: 20px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pai-scope .convos-bot-pill-count{
  font-size: 11px;
  color: var(--text-quaternary);
  background: var(--bg-elevated);
  padding: 1px 7px;
  border-radius: 999px;
  font-weight: 600;
}
.pai-scope .convos-bot-pill.is-active .convos-bot-pill-count{ background: rgba(31, 192, 171,0.18); color: var(--primary-light); }

.pai-scope .convos-layout{
  flex: 1;
  display: grid;
  grid-template-columns: 360px 1fr;
  min-height: 0;
}

.pai-scope .chat-list-item-avatar{
  position: relative;
}
.pai-scope .chat-bot-dot{
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid var(--shell-body);
  flex-shrink: 0;
}
.pai-scope .chat-list-item.is-active .chat-bot-dot{ border-color: var(--primary-muted-bg); }

.pai-scope .chat-list-item-bot{
  color: var(--text-tertiary);
  font-weight: 600;
}

.pai-scope .chat-detail-header-bot{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: var(--text-secondary);
}

.pai-scope .test-chat{
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 !important;
  overflow: hidden;
  position: fixed;
  top: 80px;
  right: 24px;
  bottom: 24px;
  width: clamp(360px, 38vw, 560px);
  z-index: 50;
}
.pai-scope .tab-panel[data-panel="persona"] .split{
  grid-template-columns: 1fr;
  padding-right: clamp(384px, calc(38vw + 24px), 584px);
}
.pai-scope .body:has(.tab-panel[data-panel="persona"].active) > .bot-detail-header{
  padding-right: clamp(384px, calc(38vw + 24px), 584px);
}
.pai-scope .body:has(.tab-panel[data-panel="persona"].active) > .tabs{
  max-width: calc(100% - clamp(384px, calc(38vw + 24px), 584px));
}
.pai-scope .test-chat-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--border);
}
.pai-scope .test-chat-head-left{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.pai-scope .test-chat-avatar{
  width: 36px; height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.pai-scope .test-chat-avatar svg{ width: 18px; height: 18px; }
.pai-scope .test-chat-head-text{
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.pai-scope .test-chat-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text-heading);
}
.pai-scope .test-chat-status{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--text-quaternary);
}
.pai-scope .test-chat-status-dot{
  width: 6px; height: 6px;
  border-radius: 999px;
  background: var(--success-fg);
  box-shadow: 0 0 6px rgba(74,222,128,0.6);
}
.pai-scope .test-chat-messages{
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pai-scope .test-chat-msg{
  display: flex;
  gap: 10px;
  max-width: 90%;
}
.pai-scope .test-chat-msg.is-user{
  flex-direction: row-reverse;
  align-self: flex-end;
}
.pai-scope .test-chat-msg-avatar{
  width: 28px;
  height: 28px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  margin-top: auto;
}
.pai-scope .test-chat-msg.is-user .test-chat-msg-avatar{
  background: linear-gradient(135deg, #8b5cf6, #6d28d9);
}
.pai-scope .test-chat-msg-avatar svg{ width: 14px; height: 14px; }
.pai-scope .test-chat-msg-body{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  max-width: calc(100% - 38px);
}
.pai-scope .test-chat-msg-bubble{
  padding: 10px 14px;
  border-radius: 14px 14px 14px 4px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-primary);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  word-wrap: break-word;
  white-space: pre-wrap;
}
.pai-scope .test-chat-msg.is-user .test-chat-msg-bubble{
  background: var(--primary-subtle);
  color: var(--text-primary);
  border-color: rgba(31, 192, 171,0.24);
  border-radius: 14px 14px 4px 14px;
}
.pai-scope .test-chat-msg-meta{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: var(--text-quaternary);
  padding: 0 4px;
}
.pai-scope .test-chat-msg.is-user .test-chat-msg-meta{ justify-content: flex-end; }
.pai-scope .test-chat-msg-meta-name{ color: var(--text-tertiary); font-weight: 600; }
.pai-scope .test-chat-msg-bubble.is-typing{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 12px 14px;
}
.pai-scope .test-chat-msg-bubble.is-typing span{
  width: 6px; height: 6px;
  border-radius: 999px;
  background: var(--text-tertiary);
  animation: dotPulse 1.4s infinite ease-in-out;
}
.pai-scope .test-chat-msg-bubble.is-typing span:nth-child(2){ animation-delay: 0.2s; }
.pai-scope .test-chat-msg-bubble.is-typing span:nth-child(3){ animation-delay: 0.4s; }
@keyframes dotPulse {
  0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-2px); }
}
.pai-scope .test-chat-starters{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 18px 12px;
}
.pai-scope .test-chat-starter{
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 12px;
  color: var(--text-secondary);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s;
}
.pai-scope .test-chat-starter:hover{
  border-color: var(--primary);
  color: var(--text-heading);
}
.pai-scope .test-chat-input{
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid var(--border);
}
.pai-scope .test-chat-textarea{
  flex: 1;
  resize: none;
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
  color: var(--text-primary);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  max-height: 140px;
  overflow-y: auto;
  outline: none;
  transition: border-color 0.15s;
}
.pai-scope .test-chat-textarea:focus{ border-color: var(--primary); }
.pai-scope .test-chat-send{
  width: 36px; height: 36px;
  border-radius: 10px;
  background: var(--primary);
  color: #fff;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s, opacity 0.15s;
}
.pai-scope .test-chat-send:hover{ background: var(--primary-end, var(--primary)); }
.pai-scope .test-chat-send:disabled{
  opacity: 0.4;
  cursor: not-allowed;
}
.pai-scope .test-chat-send svg{ width: 16px; height: 16px; }
.pai-scope .test-chat-foot{
  padding: 0 18px 14px;
  font-size: 11px;
  color: var(--text-quaternary);
}
.pai-scope .test-chat-starters:empty, .pai-scope .test-chat-starters[hidden]{ display: none; }