/*
 * Aris888 AI system theme
 * Carries the graphite, cyan and violet workspace atmosphere across every route.
 */

:root {
  --aris-canvas: #f4f5f6;
  --aris-canvas-deep: #eceef1;
  --aris-text: #1e2635;
  --aris-muted: #687489;
  --aris-line: rgba(64, 75, 98, .12);
  --aris-line-strong: rgba(100, 74, 190, .22);
  --aris-cyan: #22b8f0;
  --aris-violet: #8b5cf6;
  --aris-magenta: #b632d6;
  --aris-glow-cyan: rgba(34, 184, 240, .09);
  --aris-glow-violet: rgba(139, 92, 246, .11);
  --aris-grid-line: rgba(92, 76, 151, .04);
  --aris-bar: rgba(248, 248, 246, .82);
  --aris-sidebar: rgba(250, 250, 248, .9);
  --aris-surface-base: rgba(255, 255, 255, .72);
  --aris-surface-raised: rgba(255, 255, 255, .86);
  --aris-field: rgba(255, 255, 255, .68);
  --aris-shadow: 0 1.15rem 3.2rem rgba(43, 49, 72, .09);
  --aris-shadow-hover: 0 1.4rem 3.8rem rgba(63, 52, 116, .14);
  --aris-backdrop:
    radial-gradient(circle at 8% 9%, var(--aris-glow-cyan), transparent 31rem),
    radial-gradient(circle at 92% 88%, var(--aris-glow-violet), transparent 38rem),
    linear-gradient(145deg, #f8f8f5, var(--aris-canvas));
  --aris-surface: rgba(255, 255, 255, .78);
  --aris-surface-soft: rgba(255, 255, 255, .58);
}

html[data-theme="dark"] {
  --bg: #19191d;
  --panel: #202024;
  --panel2: #26262b;
  --line: rgba(255, 255, 255, .085);
  --text: #f3f4f8;
  --muted: #9ca4b3;
  --aris-canvas: #19191d;
  --aris-canvas-deep: #151517;
  --aris-text: #f3f4f8;
  --aris-muted: #9ca4b3;
  --aris-line: rgba(255, 255, 255, .08);
  --aris-line-strong: rgba(174, 140, 235, .24);
  --aris-cyan: #62d7f2;
  --aris-violet: #b29af4;
  --aris-magenta: #d58ae7;
  --aris-glow-cyan: rgba(34, 184, 240, .055);
  --aris-glow-violet: rgba(139, 92, 246, .085);
  --aris-grid-line: rgba(137, 111, 218, .045);
  --aris-bar: rgba(24, 24, 27, .84);
  --aris-sidebar: rgba(23, 23, 25, .92);
  --aris-surface-base: rgba(255, 255, 255, .035);
  --aris-surface-raised: rgba(38, 38, 43, .88);
  --aris-field: rgba(27, 27, 31, .92);
  --aris-shadow: 0 1.2rem 3.6rem rgba(0, 0, 0, .25);
  --aris-shadow-hover: 0 1.5rem 4.2rem rgba(0, 0, 0, .34);
  --aris-backdrop:
    radial-gradient(circle at 8% 9%, var(--aris-glow-cyan), transparent 32rem),
    radial-gradient(circle at 92% 88%, var(--aris-glow-violet), transparent 39rem),
    linear-gradient(145deg, #1c1c1c, var(--aris-canvas));
  --aris-surface: rgba(32, 32, 36, .9);
  --aris-surface-soft: rgba(255, 255, 255, .028);
  color-scheme: dark;
}

html,
body,
#app {
  min-height: 100%;
}

body {
  color: var(--aris-text);
  background-color: var(--aris-canvas) !important;
  background-image: var(--aris-backdrop) !important;
  background-attachment: fixed !important;
}

body ::selection {
  color: #fff;
  background: rgba(126, 91, 224, .72);
}

/* Route canvases */
html body :is(
  .marketing-page,
  .workspace-layout,
  .admin-workspace,
  .chatbot-workspace,
  .account-settings-page,
  .account-gate,
  .conversation-share-import
) {
  color: var(--aris-text);
  background-color: transparent !important;
  background-image: none !important;
}

html body :is(
  .workspace-main,
  .admin-content,
  .chatbot-workspace-main,
  .account-settings-main,
  .settings-page-content,
  .subscription-page-content
) {
  color: var(--aris-text);
  background-color: transparent !important;
  background-image: none !important;
}

html body :is(
  .marketing-hero,
  .trust-strip,
  .feature-showcase,
  .workflow-block,
  .capability-block,
  .assistants-showcase,
  .pricing-showcase
) {
  background-color: transparent !important;
}

/* Glass navigation and persistent chrome */
html body :is(
  .site-header,
  .workspace-top,
  .admin-head,
  .chatbot-workspace-main > header,
  .account-settings-top,
  .marketing-footer,
  .subscription-footer
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-bar) !important;
  box-shadow: 0 1px rgba(255, 255, 255, .035), 0 .7rem 2rem rgba(0, 0, 0, .08) !important;
  backdrop-filter: blur(1.15rem) saturate(1.08);
  -webkit-backdrop-filter: blur(1.15rem) saturate(1.08);
}

html body :is(
  .workspace-sidebar,
  .admin-sidebar,
  .chatbot-workspace-side
) {
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 8% 8%, var(--aris-glow-cyan), transparent 13rem),
    radial-gradient(circle at 100% 92%, var(--aris-glow-violet), transparent 15rem),
    var(--aris-sidebar) !important;
  box-shadow: .65rem 0 2.4rem rgba(0, 0, 0, .11) !important;
  backdrop-filter: blur(1rem) saturate(1.06);
  -webkit-backdrop-filter: blur(1rem) saturate(1.06);
}

/* Shared glass material */
html body :is(
  .ai-preview,
  .feature-card,
  .workflow-step,
  .capability-card,
  .assistant-card,
  .plan-card,
  .account-card,
  .admin-metric,
  .admin-demand-panel,
  .admin-assistant-panel,
  .admin-users-panel,
  .users-overview article,
  .users-control-panel,
  .system-card,
  .overview-panel,
  .assistants-lead,
  .my-assistant-admin-empty,
  .assistant-manage-card,
  .admin-workspace .settings-card,
  .assistant-settings-panel,
  .knowledge-panel,
  .models-list-panel,
  .model-editor,
  .chatbot-stat-grid article,
  .chatbot-usage-chart,
  .chatbot-recent,
  .chatbot-form-panel,
  .chatbot-training-panel,
  .chatbot-script-card,
  .chatbot-preview-card,
  .chatbot-settings-list,
  .chatbot-assistant-grid > article,
  .chatbot-empty-v2,
  .chatbot-workspace-empty,
  .chatbots-hero,
  .account-setting-card,
  .current-plan-card,
  .subscription-summary,
  .plans-page-head,
  .plans-frame,
  .subscription-choice,
  .subscription-benefits article,
  .billing-subscription,
  .billing-invoice,
  .billing-empty,
  .billing-cycle,
  .wallet-card,
  .session-item,
  .passkey-item,
  .otp-option,
  .archived-conversation-list article,
  .developer-mode-console,
  .developer-mode-records,
  .developer-mode-record,
  .developer-mode-activation
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface) !important;
  box-shadow: var(--aris-shadow) !important;
  backdrop-filter: blur(1rem) saturate(1.06);
  -webkit-backdrop-filter: blur(1rem) saturate(1.06);
}

html body :is(
  .preview-cards article,
  .preview-stats span,
  .user-line,
  .service-list article,
  .distribution-list > div,
  .my-assistant-dashboard-list > a,
  .knowledge-source,
  .developer-mode-value,
  .developer-mode-value-control,
  .developer-mode-email,
  .developer-mode-records-empty,
  .billing-filter,
  .billing-filter-empty,
  .subscription-cancellation-state,
  .passkey-intro,
  .otp-accordion-panel
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
}

/* Selected and featured surfaces retain a stronger brand rim. */
html body :is(
  .subscription-choice.selected,
  .subscription-choice.pro-choice,
  .pricing-showcase .pro-plan,
  .pricing-showcase .chatbot-marketing-plan,
  .assistant-manage-card:hover,
  .overview-panel:hover,
  .feature-card:hover,
  .capability-card:hover,
  .plan-card:hover
) {
  border-color: var(--aris-line-strong) !important;
  box-shadow: var(--aris-shadow-hover) !important;
}

/* Forms and editable controls */
html body :is(
  .account-card,
  .admin-content,
  .chatbot-workspace-main,
  .account-settings-main,
  .modal,
  .model-editor-popover,
  .developer-mode-shell
) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  textarea,
  select
) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

html body :is(
  .account-card,
  .admin-content,
  .chatbot-workspace-main,
  .account-settings-main,
  .modal,
  .model-editor-popover,
  .developer-mode-shell
) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  textarea,
  select
):focus {
  border-color: rgba(154, 118, 231, .52) !important;
  background: var(--aris-surface-raised) !important;
  box-shadow: 0 0 0 .2rem rgba(139, 92, 246, .09), 0 .75rem 2rem rgba(0, 0, 0, .08) !important;
  outline: 0;
}

html body :is(input, textarea)::placeholder {
  color: var(--aris-muted) !important;
  opacity: .7;
}

/* Popovers, dialogs and transient feedback */
html body .modal-back,
html body :is(.assistant-modal-back, .otp-login-back, .otp-setup-back, .passkey-name-back, .conversation-share-back) {
  background:
    radial-gradient(circle at 18% 12%, rgba(34, 184, 240, .09), transparent 28rem),
    radial-gradient(circle at 84% 86%, rgba(139, 92, 246, .12), transparent 34rem),
    rgba(7, 7, 10, .68) !important;
  backdrop-filter: blur(.7rem) saturate(1.05);
  -webkit-backdrop-filter: blur(.7rem) saturate(1.05);
}

html body :is(
  .modal,
  .legal-modal,
  .assistant-edit-modal,
  .assistant-builder-modal,
  .limit-modal,
  .otp-login-modal,
  .otp-setup-modal,
  .avatar-modal,
  .passkey-name-modal,
  .conversation-share-modal,
  .model-editor-popover,
  .workspace-usermenu,
  .assistant-popover,
  .conversation-actions-menu,
  .toast
) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background: var(--aris-surface) !important;
  box-shadow: 0 1.45rem 4rem rgba(0, 0, 0, .3) !important;
  backdrop-filter: blur(1.25rem) saturate(1.08);
  -webkit-backdrop-filter: blur(1.25rem) saturate(1.08);
}

/* One panel owns one neutral surface; accent colors stay on borders and actions. */
html[data-theme] body .conversation-share-modal {
  background: var(--aris-surface-raised) !important;
  background-image: none !important;
}

html[data-theme] body :is(.conversation-share-link, .conversation-share-notice) {
  background: var(--aris-field) !important;
  background-image: none !important;
}

/* Primary gradient and tactile states */
html body :is(
  .btn.primary,
  .admin-create-btn,
  .workspace-send,
  .assistant-modal-save,
  .assistant-builder-submit,
  .model-form-actions button:last-child,
  .setting-primary,
  .subscription-choice > button,
  .developer-mode-generator button,
  .developer-mode-activation button,
  .chatbot-form-panel > button.primary
) {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(110deg, #22bdd5, #705ee5 56%, #ad34d4) !important;
  box-shadow: 0 .65rem 1.65rem rgba(92, 70, 190, .22) !important;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

html body :is(
  .btn.primary,
  .admin-create-btn,
  .assistant-modal-save,
  .assistant-builder-submit,
  .model-form-actions button:last-child,
  .setting-primary,
  .subscription-choice > button,
  .developer-mode-generator button,
  .developer-mode-activation button,
  .chatbot-form-panel > button.primary
):not(:disabled):hover {
  filter: brightness(1.08) saturate(1.08);
  transform: translateY(-.1rem);
  box-shadow: 0 .85rem 2rem rgba(92, 70, 190, .3) !important;
}

/* The send control brightens in place so the composer never jumps. */
html body .workspace-send:not(:disabled):hover {
  filter: brightness(1.08) saturate(1.08);
  transform: none !important;
  box-shadow: 0 .8rem 1.9rem rgba(92, 70, 190, .3) !important;
}

html body :is(
  .admin-nav button,
  .chatbot-workspace-side nav a,
  .settings-tabs button,
  .workspace-conversation,
  .workspace-suggestions button,
  .workspace-userline,
  .workspace-new-chat,
  .overview-shortcuts button
) {
  transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

html body :is(
  .admin-nav button:hover,
  .admin-nav button.active,
  .chatbot-workspace-side nav a:hover,
  .chatbot-workspace-side nav a.active,
  .settings-tabs button:hover,
  .settings-tabs button.active,
  .workspace-conversation:hover,
  .workspace-conversation.active,
  .overview-shortcuts button:hover
) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background: linear-gradient(110deg, rgba(34, 184, 240, .055), rgba(139, 92, 246, .1)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

html body :is(
  .admin-metric,
  .overview-panel,
  .assistant-manage-card,
  .users-overview article,
  .feature-card,
  .workflow-step,
  .capability-card,
  .assistant-card,
  .plan-card,
  .chatbot-stat-grid article,
  .subscription-benefits article,
  .billing-subscription,
  .billing-invoice,
  .developer-mode-record
) {
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

html body :is(
  .admin-metric,
  .overview-panel,
  .assistant-manage-card,
  .users-overview article,
  .feature-card,
  .workflow-step,
  .capability-card,
  .assistant-card,
  .plan-card,
  .chatbot-stat-grid article,
  .subscription-benefits article,
  .billing-subscription,
  .developer-mode-record
):hover {
  border-color: var(--aris-line-strong) !important;
  transform: translateY(-.12rem);
  box-shadow: var(--aris-shadow-hover) !important;
}

/* Brand light on headings and icons */
html body :is(
  .section-kicker,
  .workspace-welcome-kicker,
  .admin-page-title small,
  .chatbot-section-lead small,
  .account-kicker,
  .account-form-kicker,
  .account-settings-title > span,
  .setting-card-head small,
  .subscription-center-head > span,
  .plan-change-intro small,
  .developer-mode-header small,
  .developer-mode-records-head small
) {
  color: var(--aris-violet) !important;
}

html body :is(
  .admin-metric > span,
  .users-overview-icon,
  .settings-icon,
  .setting-card-head > span:first-child,
  .chatbot-stat-grid article > span,
  .developer-mode-header-icon,
  .workspace-orb
) {
  border-color: rgba(139, 92, 246, .16) !important;
  background: linear-gradient(145deg, rgba(34, 184, 240, .18), rgba(139, 92, 246, .22)) !important;
  box-shadow: 0 .8rem 2rem rgba(78, 71, 169, .14), inset 0 1px rgba(255, 255, 255, .1) !important;
}

html body :is(
  .workspace-new-chat,
  .workspace-suggestions button,
  .workspace-menu-usage,
  .account-tabs,
  .settings-tabs,
  .developer-mode-record-filters
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
}

html body .workspace-sidebar .workspace-new-chat {
  background:
    radial-gradient(circle at 12% 25%, rgba(34, 184, 240, .18), transparent 36%),
    linear-gradient(110deg, rgba(34, 184, 240, .095), rgba(139, 92, 246, .14)) !important;
}

html body .theme-toggle {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 .45rem 1.1rem rgba(0, 0, 0, .08);
  backdrop-filter: blur(.75rem);
  -webkit-backdrop-filter: blur(.75rem);
  transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease;
}

html body .theme-toggle:hover {
  color: var(--aris-violet) !important;
  border-color: var(--aris-line-strong) !important;
  background: linear-gradient(145deg, rgba(34, 184, 240, .08), rgba(139, 92, 246, .12)) !important;
  transform: rotate(7deg);
}

html body :focus-visible {
  outline: .14rem solid rgba(98, 215, 242, .72);
  outline-offset: .14rem;
}

html body * {
  scrollbar-color: rgba(145, 128, 188, .35) transparent;
}

html body *::-webkit-scrollbar {
  width: .42rem;
  height: .42rem;
}

html body *::-webkit-scrollbar-thumb {
  border: .08rem solid transparent;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(34, 184, 240, .35), rgba(139, 92, 246, .42));
  background-clip: padding-box;
}

html body *::-webkit-scrollbar-track {
  background: transparent;
}

/* Page entrance is quiet, fast and disabled when reduced motion is requested. */
@keyframes aris-surface-enter {
  from {
    opacity: 0;
    transform: translateY(.45rem) scale(.995);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

html body :is(
  .marketing-hero,
  .account-card,
  .workspace-welcome,
  .admin-page-title,
  .chatbot-section-lead,
  .settings-tab-panel,
  .subscription-page-content,
  .conversation-share-modal
) {
  animation: aris-surface-enter .42s cubic-bezier(.2, .72, .28, 1) both;
}

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

@media (max-width: 47.5rem) {
  html body :is(.workspace-sidebar, .admin-sidebar, .chatbot-workspace-side) {
    background:
      radial-gradient(circle at 8% 8%, var(--aris-glow-cyan), transparent 13rem),
      radial-gradient(circle at 100% 92%, var(--aris-glow-violet), transparent 15rem),
      var(--aris-sidebar) !important;
  }

  html body :is(
    .ai-preview,
    .account-card,
    .overview-panel,
    .assistant-manage-card,
    .account-setting-card,
    .subscription-choice,
    .chatbot-form-panel,
    .chatbot-training-panel
  ) {
    backdrop-filter: blur(.7rem) saturate(1.04);
    -webkit-backdrop-filter: blur(.7rem) saturate(1.04);
  }
}

/*
 * Management workspaces use older dark-theme rules with higher specificity.
 * Keep their entire canvas, chrome and nested panels on the system material.
 */
html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) {
  color: var(--aris-text) !important;
  background-color: var(--aris-canvas) !important;
  background-image: var(--aris-backdrop) !important;
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) > :is(.admin-content, .chatbot-workspace-main) {
  min-height: 100vh;
  min-height: 100dvh;
  color: var(--aris-text) !important;
  background-color: var(--aris-canvas) !important;
  background-image: var(--aris-backdrop) !important;
  background-position: center top !important;
  background-size: cover !important;
  background-attachment: local !important;
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) > :is(.admin-sidebar, .chatbot-workspace-side) {
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 8% 8%, var(--aris-glow-cyan), transparent 13rem),
    radial-gradient(circle at 100% 92%, var(--aris-glow-violet), transparent 15rem),
    var(--aris-sidebar) !important;
  box-shadow: .65rem 0 2.4rem rgba(0, 0, 0, .12) !important;
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) > :is(.admin-content, .chatbot-workspace-main) > :is(.admin-head, .chatbot-workspace-head) {
  border-color: var(--aris-line) !important;
  background: var(--aris-bar) !important;
  box-shadow: 0 1px rgba(255, 255, 255, .03), 0 .7rem 2rem rgba(0, 0, 0, .1) !important;
  backdrop-filter: blur(1.15rem) saturate(1.08);
  -webkit-backdrop-filter: blur(1.15rem) saturate(1.08);
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) :is(#adminBody, #myAssistantBody, .chatbot-workspace-content, .chatbots-page) {
  background: transparent !important;
  background-image: none !important;
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) :is(
  .admin-intro,
  .admin-metric,
  .admin-demand-panel,
  .admin-assistant-panel,
  .admin-users-panel,
  .overview-panel,
  .assistants-lead,
  .assistant-manage-card,
  .assistant-settings-panel,
  .assistant-detail-stats article,
  .knowledge-panel,
  .users-page-lead,
  .users-overview article,
  .users-control-panel,
  .system-card,
  .models-page-lead,
  .models-list-panel,
  .model-editor,
  .chatbot-admin-intro,
  .chatbots-hero,
  .chatbot-section-lead,
  .chatbot-stat-grid article,
  .chatbot-usage-chart,
  .chatbot-recent,
  .chatbot-form-panel,
  .chatbot-editor-card,
  .chatbot-training-panel,
  .chatbot-locked-training,
  .chatbot-script-card,
  .chatbot-preview-card,
  .chatbot-settings-list,
  .chatbot-assistant-grid > article,
  .chatbot-card,
  .chatbot-empty,
  .chatbot-empty-v2,
  .chatbot-workspace-empty,
  .wallet-topup-panel,
  .wallet-history-panel,
  .billing-subscription,
  .billing-invoice,
  .developer-mode-console,
  .developer-mode-records,
  .developer-mode-record,
  .developer-mode-activation
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface) !important;
  box-shadow: var(--aris-shadow) !important;
  backdrop-filter: blur(1rem) saturate(1.06);
  -webkit-backdrop-filter: blur(1rem) saturate(1.06);
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) :is(
  .overview-shortcuts button,
  .my-assistant-dashboard-list > a,
  .my-assistant-request-history article,
  .chatbot-source-row,
  .chatbot-training-actions label
) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035) !important;
}

html[data-theme] body :is(
  .admin-workspace,
  .user-assistant-workspace,
  .admin-workspace.chatbot-workspace
) .admin-nav button:is(:hover, .active) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background: linear-gradient(110deg, rgba(34, 184, 240, .055), rgba(139, 92, 246, .1)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 .55rem 1.35rem rgba(0, 0, 0, .08) !important;
}

/* Account settings owns one full-width backdrop; nested content stays clear. */
html[data-theme] body .account-settings-page,
html[data-theme] body .account-settings-main {
  background-color: var(--aris-canvas) !important;
  background-image: var(--aris-backdrop) !important;
}

html[data-theme] body .account-settings-main:has(> .settings-page-content) {
  position: relative;
  isolation: isolate;
  background-image: var(--aris-backdrop) !important;
  background-size: auto !important;
  background-position: center top !important;
  background-attachment: scroll !important;
}

html[data-theme] body .account-settings-main > :is(.settings-page-content, .subscription-page-content) {
  background: transparent !important;
  background-image: none !important;
}

html[data-theme] body .settings-page-content::before {
  content: none !important;
  display: none !important;
}

html[data-theme] body .account-settings-main :is(.settings-tabs, .account-setting-card) {
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 4% 0%, rgba(34, 184, 240, .055), transparent 14rem),
    radial-gradient(circle at 100% 100%, rgba(139, 92, 246, .065), transparent 16rem),
    linear-gradient(145deg, #fbfcfd, #eef0f4) !important;
  box-shadow: var(--aris-shadow) !important;
  background-clip: padding-box !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme="dark"] body .account-settings-main :is(.settings-tabs, .account-setting-card) {
  background:
    radial-gradient(circle at 4% 0%, rgba(34, 184, 240, .04), transparent 14rem),
    radial-gradient(circle at 100% 100%, rgba(139, 92, 246, .055), transparent 17rem),
    linear-gradient(145deg, #28282e, #222226) !important;
}

html[data-theme] body .account-settings-main :is(
  .settings-tab-panel,
  .account-setting-card,
  .platform-usage-grid article
) {
  animation: none !important;
  transform: none !important;
  will-change: auto !important;
}

/* Marketing routes use one full-width atmosphere and the same content grid as chrome. */
html[data-theme] body #app:has(> .site-header) {
  min-height: 100vh;
  min-height: 100dvh;
  color: var(--aris-text) !important;
  background-color: var(--aris-canvas) !important;
  background-image: var(--aris-backdrop) !important;
  background-attachment: fixed !important;
}

html[data-theme] body #app:has(> .site-header) > .home-content {
  width: min(var(--marketing-chrome-width), 100%);
  max-width: none !important;
  margin-inline: auto;
  padding-inline: var(--marketing-chrome-gutter);
  box-sizing: border-box;
  overflow: visible;
  background: transparent !important;
}

html[data-theme] body #app:has(> .site-header) > .home-content > main,
html[data-theme] body #app:has(> .site-header) :is(
  .marketing-hero,
  .feature-showcase,
  .workflow-block,
  .capability-block,
  .assistants-showcase,
  .pricing-showcase
) {
  min-width: 0;
  background: transparent !important;
  background-image: none !important;
}

html[data-theme] body #app:has(> .site-header) .marketing-hero {
  position: relative;
  isolation: isolate;
  margin-inline: 0 !important;
  padding-inline: 0 !important;
}

html[data-theme] body #app:has(> .site-header) .marketing-hero::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 50% !important;
  z-index: -1;
  width: 100vw;
  transform: translateX(-50%);
  pointer-events: none;
  border-bottom: 0;
  background:
    radial-gradient(circle at 13% 20%, var(--aris-glow-cyan), transparent 34rem),
    radial-gradient(circle at 86% 18%, var(--aris-glow-violet), transparent 40rem),
    linear-gradient(180deg, rgba(139, 92, 246, .025), transparent 92%) !important;
}

html[data-theme] body #app:has(> .site-header) :is(
  .ai-preview,
  .trust-strip,
  .feature-card,
  .workflow-step,
  .capability-card,
  .assistant-card,
  .plan-card
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface) !important;
  box-shadow: var(--aris-shadow) !important;
  backdrop-filter: blur(1rem) saturate(1.06);
  -webkit-backdrop-filter: blur(1rem) saturate(1.06);
}

html[data-theme] body #app:has(> .site-header) :is(
  .preview-cards article,
  .preview-stats span,
  .preview-chat,
  .user-line,
  .hero-pills span
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
}

/* Every persistent header shares the same illuminated glass edge. */
html[data-theme] body :is(
  .site-header,
  .workspace-top,
  .admin-head,
  .chatbot-workspace-main > header
) {
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 14% -130%, var(--aris-glow-cyan), transparent 24rem),
    radial-gradient(circle at 88% 180%, var(--aris-glow-violet), transparent 28rem),
    var(--aris-bar) !important;
  box-shadow: 0 1px rgba(255, 255, 255, .035), 0 .75rem 2.25rem rgba(0, 0, 0, .1) !important;
  backdrop-filter: blur(1.2rem) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(1.2rem) saturate(1.1) !important;
}

html[data-theme] body .chatbot-workspace-main > header {
  position: relative;
}

html[data-theme] body .account-settings-top {
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme] body .account-settings-top::before {
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 14% -130%, var(--aris-glow-cyan), transparent 24rem),
    radial-gradient(circle at 88% 180%, var(--aris-glow-violet), transparent 28rem),
    var(--aris-bar) !important;
  box-shadow: 0 1px rgba(255, 255, 255, .035), 0 .75rem 2.25rem rgba(0, 0, 0, .1) !important;
  backdrop-filter: blur(1.2rem) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(1.2rem) saturate(1.1) !important;
}

html[data-theme] body :is(
  .site-header,
  .workspace-top,
  .admin-head,
  .chatbot-workspace-main > header,
  .account-settings-top
)::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  z-index: 2;
  height: 1px;
  pointer-events: none;
  opacity: .62;
  background: linear-gradient(90deg, transparent 4%, var(--aris-cyan) 28%, var(--aris-violet) 72%, transparent 96%);
}

html[data-theme] body :is(.site-header .navlinks a, .account-settings-top .settings-nav a):is(:hover, .active) {
  color: var(--aris-text) !important;
  border-color: var(--aris-line-strong) !important;
  background: linear-gradient(110deg, rgba(34, 184, 240, .06), rgba(139, 92, 246, .11)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 .45rem 1.25rem rgba(0, 0, 0, .07);
}

/* Public and account footers use the same ambient material as the headers. */
html[data-theme] body :is(.marketing-footer, .subscription-footer) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--aris-text) !important;
  border-color: var(--aris-line) !important;
  background:
    radial-gradient(circle at 10% 0%, var(--aris-glow-cyan), transparent 27rem),
    radial-gradient(circle at 90% 100%, var(--aris-glow-violet), transparent 32rem),
    var(--aris-bar) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 -1.1rem 3rem rgba(0, 0, 0, .08) !important;
  backdrop-filter: blur(1.15rem) saturate(1.08);
  -webkit-backdrop-filter: blur(1.15rem) saturate(1.08);
}

html[data-theme] body :is(.marketing-footer, .subscription-footer)::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 2;
  height: 1px;
  pointer-events: none;
  opacity: .68;
  background: linear-gradient(90deg, transparent 4%, var(--aris-cyan) 30%, var(--aris-violet) 70%, transparent 96%);
}

html[data-theme] body .marketing-footer .social {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

html[data-theme] body .marketing-footer .social:hover {
  border-color: var(--aris-line-strong) !important;
  background: var(--aris-surface-raised) !important;
  box-shadow: 0 .55rem 1.4rem rgba(0, 0, 0, .12);
}

/* Keep the assistant-access e-mail action inside its card at every scale. */
html[data-theme] body .assistant-viewer-add,
html[data-theme] body .assistant-viewer-add > div {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

html[data-theme] body .assistant-viewer-add > div {
  grid-template-columns: 1rem minmax(0, 1fr) max-content !important;
  border-color: var(--aris-line) !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
  overflow: hidden;
}

html[data-theme] body .assistant-viewer-add input,
html[data-theme] body .assistant-viewer-add input:is(:hover, :focus, :focus-visible) {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

html[data-theme] body .assistant-viewer-add > div:focus-within {
  border-color: var(--aris-line-strong) !important;
  box-shadow: 0 0 0 .18rem rgba(139, 92, 246, .075) !important;
}

html[data-theme] body .assistant-viewer-add button {
  width: auto;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
  white-space: nowrap;
}

@media (max-width: 48rem) {
  html[data-theme] body #app:has(> .site-header) > .home-content {
    padding-inline: var(--marketing-chrome-gutter);
    overflow: hidden;
  }

  html[data-theme] body .assistant-viewer-add > div {
    grid-template-columns: 1rem minmax(0, 1fr) !important;
  }

  html[data-theme] body .assistant-viewer-add button {
    width: 100%;
    grid-column: 1 / -1;
  }
}

/* Visual regression repair: remove stacked focus, shimmer and gradient layers. */
html[data-theme] body .workspace-composer textarea,
html[data-theme] body .workspace-composer textarea:is(:hover, :focus, :focus-visible) {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme] body .workspace-composer:focus-within {
  border-color: var(--aris-line-strong) !important;
  background: var(--aris-surface-raised) !important;
  box-shadow: 0 1rem 2.8rem rgba(0, 0, 0, .2), 0 0 0 .16rem rgba(139, 92, 246, .055) !important;
}

/* The send control deliberately uses the same restrained material as user messages. */
html[data-theme] body .workspace-messages .msg.me:is(.assistant-color-message, .admin-effect-message) .bubble {
  border-color: color-mix(in srgb, var(--message-accent, #7054c7) 30%, var(--aris-line)) !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, .075), transparent 38%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--message-accent, #7054c7) 34%, #304257),
      color-mix(in srgb, var(--message-accent, #7054c7) 34%, #30253d)) !important;
  background-size: 100% 100% !important;
  text-shadow: none !important;
  box-shadow: 0 .55rem 1.35rem color-mix(in srgb, var(--message-accent, #7054c7) 12%, transparent), inset 0 1px rgba(255, 255, 255, .1) !important;
  animation: none !important;
}

html[data-theme] body .workspace-send:is(.assistant-color-send, .admin-effect-send),
html[data-theme] body .workspace-send:is(.assistant-color-send, .admin-effect-send)[aria-busy="true"] {
  border-color: color-mix(in srgb, var(--send-accent, #7054c7) 30%, var(--aris-line)) !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, .075), transparent 38%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--send-accent, #7054c7) 34%, #304257),
      color-mix(in srgb, var(--send-accent, #7054c7) 34%, #30253d)) !important;
  background-size: 100% 100% !important;
  text-shadow: none !important;
  box-shadow: 0 .5rem 1.25rem color-mix(in srgb, var(--send-accent, #7054c7) 13%, transparent), inset 0 1px rgba(255, 255, 255, .1) !important;
  animation: none !important;
}

html[data-theme] body .workspace-messages .msg.me:is(.assistant-color-message, .admin-effect-message) .bubble::before,
html[data-theme] body .workspace-messages .msg.me:is(.assistant-color-message, .admin-effect-message) .bubble::after,
html[data-theme] body .workspace-send:is(.assistant-color-send, .admin-effect-send)::before,
html[data-theme] body .workspace-send:is(.assistant-color-send, .admin-effect-send)::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}

html[data-theme] body .workspace-send:is(.assistant-color-send, .admin-effect-send):not(:disabled):hover {
  filter: brightness(1.025) saturate(1.02) !important;
  transform: none !important;
}

/* Sidebar account control keeps a truly circular hit surface. */
html[data-theme] body .workspace-layout:not(.sidebar-collapsed) .workspace-sidebar .workspace-userline {
  padding: .55rem !important;
}

html[data-theme] body .workspace-sidebar .account-menu-trigger {
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  border: 1px solid transparent !important;
  border-radius: 50% !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme] body .workspace-sidebar .account-menu-trigger:is(:hover, [aria-expanded="true"]) {
  color: var(--aris-violet) !important;
  border-color: var(--aris-line-strong) !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, rgba(34, 184, 240, .09), rgba(139, 92, 246, .15)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 .45rem 1.1rem rgba(0, 0, 0, .08) !important;
}

/* Account controls: rounded silhouettes, softer light and no colored edge streaks. */
html[data-theme] body :is(
  .account-settings-main .setting-primary,
  .passkey-intro > button,
  .passkey-name-actions button:last-child,
  .otp-login-modal > button,
  .otp-setup-modal > div:last-child button:last-child
) {
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(129, 126, 207, .25) !important;
  border-radius: 999px !important;
  color: #f8fbff !important;
  background:
    radial-gradient(circle at 22% 0%, rgba(255, 255, 255, .11), transparent 40%),
    linear-gradient(135deg, #467f99, #6255a6 58%, #72519d) !important;
  background-size: 100% 100% !important;
  background-clip: padding-box !important;
  box-shadow: 0 .55rem 1.35rem rgba(54, 55, 112, .2), inset 0 1px rgba(255, 255, 255, .12) !important;
  animation: none !important;
}

html[data-theme] body :is(
  .account-settings-main .setting-primary,
  .passkey-intro > button,
  .passkey-name-actions button:last-child,
  .otp-login-modal > button,
  .otp-setup-modal > div:last-child button:last-child
)::before,
html[data-theme] body :is(
  .account-settings-main .setting-primary,
  .passkey-intro > button,
  .passkey-name-actions button:last-child,
  .otp-login-modal > button,
  .otp-setup-modal > div:last-child button:last-child
)::after {
  content: none !important;
  display: none !important;
}

html[data-theme] body :is(
  .account-settings-main .setting-primary,
  .passkey-intro > button,
  .passkey-name-actions button:last-child,
  .otp-login-modal > button,
  .otp-setup-modal > div:last-child button:last-child
):not(:disabled):hover {
  filter: brightness(1.035) saturate(1.03) !important;
  transform: translateY(-1px);
}

html[data-theme] body :is(
  .account-settings-main .setting-primary,
  .account-settings-main .setting-secondary,
  .passkey-intro > button,
  .session-intro > button,
  .session-end-button,
  .passkey-name-actions button,
  .otp-login-modal > button
):focus-visible {
  outline: 0 !important;
  box-shadow: 0 0 0 .2rem rgba(98, 215, 242, .14), 0 .55rem 1.35rem rgba(54, 55, 112, .2) !important;
}

html[data-theme] body .account-settings-main .setting-secondary,
html[data-theme] body .passkey-name-actions button:first-child {
  border-color: var(--aris-line) !important;
  border-radius: 999px !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

html[data-theme] body :is(.session-intro > button, .session-end-button) {
  border-color: rgba(228, 99, 121, .2) !important;
  border-radius: 999px !important;
  color: #f09aaa !important;
  background:
    radial-gradient(circle at 20% 0%, rgba(255, 255, 255, .06), transparent 42%),
    rgba(190, 65, 86, .095) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 .35rem .9rem rgba(96, 22, 37, .08);
}

/* Security cards inherit distinct tab-like icon tones instead of flat gray tiles. */
html[data-theme] body #profileForm { --setting-accent-rgb: 34, 184, 240; }
html[data-theme] body #passwordForm { --setting-accent-rgb: 139, 92, 246; }
html[data-theme] body .email-security-card { --setting-accent-rgb: 34, 184, 240; }
html[data-theme] body .otp-setting-card { --setting-accent-rgb: 16, 185, 129; }
html[data-theme] body .passkey-setting-card { --setting-accent-rgb: 139, 92, 246; }
html[data-theme] body .session-setting-card { --setting-accent-rgb: 245, 158, 11; }

html[data-theme] body .account-settings-main :is(
  .setting-card-head > span:first-child,
  .otp-accordion-toggle .setting-card-head > span:first-child
) {
  border: 1px solid rgba(var(--setting-accent-rgb, 139, 92, 246), .22) !important;
  border-radius: .82rem !important;
  color: rgb(var(--setting-accent-rgb, 139, 92, 246)) !important;
  background:
    radial-gradient(circle at 25% 18%, rgba(255, 255, 255, .14), transparent 36%),
    linear-gradient(145deg, rgba(var(--setting-accent-rgb, 139, 92, 246), .18), rgba(139, 92, 246, .13)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .06), 0 .45rem 1.15rem rgba(var(--setting-accent-rgb, 139, 92, 246), .08) !important;
}

html[data-theme] body .account-settings-main :is(
  .otp-panel-intro > span,
  .otp-option > i:first-child,
  .passkey-item > span,
  .session-device-icon
) {
  border: 1px solid rgba(var(--setting-accent-rgb, 139, 92, 246), .18) !important;
  border-radius: .78rem !important;
  color: rgb(var(--setting-accent-rgb, 139, 92, 246)) !important;
  background:
    radial-gradient(circle at 24% 18%, rgba(255, 255, 255, .13), transparent 38%),
    linear-gradient(145deg, rgba(var(--setting-accent-rgb, 139, 92, 246), .17), rgba(139, 92, 246, .1)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 .35rem .9rem rgba(var(--setting-accent-rgb, 139, 92, 246), .06) !important;
}

html[data-theme] body .account-settings-main :is(
  .passkey-item,
  .session-item:not(.is-current),
  .otp-panel-intro,
  .otp-option
) {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface-raised) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .03), 0 .45rem 1.2rem rgba(0, 0, 0, .055);
}

html[data-theme] body .account-settings-main .session-item.is-current {
  border-color: rgba(16, 185, 129, .2) !important;
  background: linear-gradient(115deg, rgba(16, 185, 129, .075), var(--aris-surface-raised)) !important;
}

/* Profile avatar and assistant artwork controls now use the same field material. */
html[data-theme] body .account-settings-main .avatar-change-control > div {
  border-color: var(--aris-line) !important;
  border-radius: .9rem !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
}

html[data-theme] body .account-settings-main .current-profile-avatar {
  border-radius: 50% !important;
}

html[data-theme] body .account-settings-main .avatar-change-control button {
  border-color: var(--aris-line-strong) !important;
  border-radius: 999px !important;
  color: var(--aris-text) !important;
  background: linear-gradient(135deg, rgba(34, 184, 240, .085), rgba(139, 92, 246, .14)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .04);
}

html[data-theme] body .assistant-icon-control {
  border-color: var(--aris-line) !important;
  border-radius: 1rem !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
}

html[data-theme] body .assistant-icon-control label {
  border-color: var(--aris-line-strong) !important;
  border-radius: 999px !important;
  color: var(--aris-text) !important;
  background: linear-gradient(135deg, rgba(34, 184, 240, .08), rgba(139, 92, 246, .14)) !important;
}

html[data-theme] body .assistant-icon-control button {
  border-color: rgba(228, 99, 121, .18) !important;
  border-radius: 999px !important;
  color: #e58496 !important;
  background: rgba(190, 65, 86, .075) !important;
}

/* Composite search controls own their surface; the nested input stays transparent. */
html[data-theme] body .knowledge-search {
  border-color: var(--aris-line) !important;
  border-radius: .82rem !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
}

html[data-theme] body .knowledge-search input,
html[data-theme] body .knowledge-search input:is(:hover, :focus, :focus-visible) {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme] body .knowledge-search:focus-within {
  border-color: var(--aris-line-strong) !important;
  box-shadow: 0 0 0 .18rem rgba(139, 92, 246, .07) !important;
}

/* The chatbot list itself is clear; only each chatbot owns a material surface. */
html[data-theme] body .chatbot-workspace .chatbot-settings-list.chatbot-settings-refresh {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme] body .chatbot-workspace .chatbot-settings-refresh .chatbot-settings-card {
  border-color: var(--aris-line) !important;
  background: var(--aris-surface) !important;
  box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .12) !important;
  backdrop-filter: blur(1rem) saturate(1.05);
  -webkit-backdrop-filter: blur(1rem) saturate(1.05);
}

/* Benefit separators float inside the glass panel instead of touching its edges. */
html[data-theme] body #app:has(> .site-header) .trust-strip article {
  position: relative;
  border-right: 0 !important;
  border-bottom: 0 !important;
}

@media (min-width: 65.0625rem) {
  html[data-theme] body #app:has(> .site-header) .trust-strip article:not(:last-child)::after {
    content: "";
    position: absolute;
    top: .7rem;
    right: 0;
    bottom: .7rem;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--aris-line-strong) 25%, var(--aris-line-strong) 75%, transparent);
  }
}

@media (min-width: 47.5625rem) and (max-width: 65rem) {
  html[data-theme] body #app:has(> .site-header) .trust-strip article:nth-child(odd)::after {
    content: "";
    position: absolute;
    top: .7rem;
    right: 0;
    bottom: .7rem;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--aris-line-strong) 25%, var(--aris-line-strong) 75%, transparent);
  }
}

@media (max-width: 47.5rem) {
  html[data-theme] body #app:has(> .site-header) .trust-strip article:not(:last-child)::after {
    content: "";
    position: absolute;
    right: .75rem;
    bottom: 0;
    left: .75rem;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--aris-line-strong) 25%, var(--aris-line-strong) 75%, transparent);
  }
}

/* OTP entry modal keeps the same colored glass language as security settings. */
html[data-theme] body :is(.otp-login-modal, .otp-setup-modal) {
  border-color: var(--aris-line-strong) !important;
  border-radius: 1.5rem !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface) !important;
  box-shadow: 0 2rem 5rem rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .045) !important;
  backdrop-filter: blur(1.25rem) saturate(1.08);
  -webkit-backdrop-filter: blur(1.25rem) saturate(1.08);
}

html[data-theme] body .otp-login-modal > span {
  border: 1px solid rgba(139, 92, 246, .2) !important;
  border-radius: 1rem !important;
  color: var(--aris-violet) !important;
  background: linear-gradient(145deg, rgba(34, 184, 240, .11), rgba(139, 92, 246, .17)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 .6rem 1.5rem rgba(74, 55, 145, .1) !important;
}

html[data-theme] body :is(.otp-login-modal, .otp-setup-modal) input {
  border-color: var(--aris-line) !important;
  border-radius: 1rem !important;
  color: var(--aris-text) !important;
  background: var(--aris-field) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025) !important;
}

/* Answer sources and export controls share one in-bubble toolbar instead of splitting across rows. */
html[data-theme] body .assistant-answer-bubble,
html[data-theme] body .assistant-answer-bubble:has(.message-pdf-download) {
  padding-right: .875rem !important;
  padding-bottom: .75rem !important;
}

html[data-theme] body .assistant-answer-tools {
  min-width: 0;
  margin-top: .8rem;
  padding-top: .625rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .75rem;
  border-top: 1px solid var(--aris-line);
}

html[data-theme] body .assistant-answer-tools .message-citations {
  min-width: 0;
  margin: 0 auto 0 0;
}

html[data-theme] body .assistant-answer-tools .message-actions {
  position: static !important;
  inset: auto !important;
  margin: 0 0 0 auto !important;
  flex: 0 0 auto;
  transform: none !important;
}

html[data-theme] body .assistant-answer-tools .message-pdf-download {
  height: 2rem;
  padding: 0 .65rem;
  border: 1px solid var(--aris-line) !important;
  border-radius: .65rem !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
}

html[data-theme] body .assistant-answer-tools .message-pdf-download i {
  color: var(--aris-violet) !important;
}

html[data-theme] body .assistant-answer-tools .message-pdf-download:hover {
  border-color: var(--aris-line-strong) !important;
  color: var(--aris-text) !important;
  background: linear-gradient(135deg, rgba(34, 184, 240, .08), rgba(139, 92, 246, .13)) !important;
}

html[data-theme] body .assistant-answer-tools .message-actions button {
  width: 2rem !important;
  min-width: 2rem !important;
  height: 2rem !important;
  border: 1px solid var(--aris-line) !important;
  border-radius: 50% !important;
  color: var(--aris-muted) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
}

html[data-theme] body .assistant-answer-tools .message-actions button:is(:hover, .is-speaking) {
  border-color: var(--aris-line-strong) !important;
  color: var(--aris-text) !important;
  background: linear-gradient(135deg, rgba(34, 184, 240, .08), rgba(139, 92, 246, .12)) !important;
}

html[data-theme] body .assistant-message-meta {
  width: auto;
  justify-content: flex-start;
}

html[data-theme] body .assistant-message-meta:has(.message-answer-jump) {
  width: calc(100% - .5rem);
  justify-content: space-between;
}

html[data-theme] body .assistant-message-meta .message-answer-jump {
  width: 1.375rem;
  min-width: 1.375rem;
  height: 1.375rem;
  padding: 0;
  display: inline-grid;
  place-items: center;
  flex: 0 0 1.375rem;
  border: 1px solid var(--aris-line) !important;
  border-radius: .45rem !important;
  color: var(--aris-violet) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
  font: inherit;
  cursor: pointer;
}

html[data-theme] body .assistant-message-meta .message-answer-jump i {
  font-size: .5rem;
}

html[data-theme] body .assistant-message-meta .message-answer-jump:is(:hover, :focus-visible) {
  border-color: var(--aris-line-strong) !important;
  color: var(--aris-text) !important;
  background: linear-gradient(135deg, rgba(34, 184, 240, .1), rgba(139, 92, 246, .16)) !important;
}

html[data-theme] body .assistant-message-meta .message-answer-jump:focus-visible {
  outline: 2px solid rgba(139, 92, 246, .32);
  outline-offset: 2px;
}

html[data-theme] body .assistant-answer-bubble.is-single-line,
html[data-theme] body .assistant-answer-bubble.is-single-line:has(.message-pdf-download) {
  padding-right: .375rem !important;
  padding-bottom: .375rem !important;
}

html[data-theme] body .assistant-answer-bubble.is-single-line .assistant-answer-tools {
  margin: 0 0 0 auto;
  padding: 0 0 0 .5rem;
  border-top: 0;
}

@media (max-width: 36rem) {
  html[data-theme] body .assistant-answer-tools {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .5rem;
  }

  html[data-theme] body .assistant-answer-tools .message-actions {
    margin-left: 0 !important;
  }
}

/* 2026-08 visual refinement: one theme language across admin, chatbot and billing. */

/* Admin overview labels no longer sit on alternating text-row surfaces. */
html[data-theme] body .distribution-list > div {
  border-color: var(--aris-line) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Public user assistants remain visible to admins, with explicit scope/status filters. */
html[data-theme] body .admin-assistant-filters {
  margin: 0 0 .9rem;
  padding: .55rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
  border: 1px solid var(--aris-line);
  border-radius: 1rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body .admin-assistant-filters label {
  min-height: 2.35rem;
  padding: 0 .7rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border: 1px solid var(--aris-line);
  border-radius: .75rem;
  color: var(--aris-muted);
  background: var(--aris-field);
  font-size: .55rem;
  font-weight: 800;
}

html[data-theme] body .admin-assistant-filters label > i {
  color: var(--aris-violet);
}

html[data-theme] body .admin-assistant-filters select {
  min-width: 9.5rem;
  height: 2rem;
  padding: 0 1.75rem 0 .45rem;
  border: 0 !important;
  color: var(--aris-text) !important;
  background-color: transparent !important;
  box-shadow: none !important;
  font: inherit;
  font-weight: 750;
  outline: 0;
}

html[data-theme] body #adminAssistantFilterCount {
  margin-left: auto;
  padding: .5rem .75rem;
  border-radius: 999px;
  color: var(--aris-violet);
  background: rgba(139, 92, 246, .1);
  font-size: .52rem;
  font-weight: 850;
}

html[data-theme] body [data-admin-assistant-card][hidden] {
  display: none !important;
}

html[data-theme] body .admin-assistant-empty {
  padding: 2.5rem 1rem;
  place-items: center;
  gap: .35rem;
  color: var(--aris-muted);
  text-align: center;
}

html[data-theme] body .admin-assistant-empty:not([hidden]) {
  display: grid;
}

html[data-theme] body .admin-assistant-empty > i {
  margin-bottom: .25rem;
  color: var(--aris-violet);
  font-size: 1.25rem;
}

html[data-theme] body .assistant-manage-card.is-user-assistant {
  box-shadow: inset 0 .16rem 0 var(--assistant-color), var(--aris-shadow) !important;
}

html[data-theme] body .assistant-status-only {
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(110deg, #17a879, #22c997) !important;
  box-shadow: 0 .55rem 1.35rem rgba(23, 168, 121, .18) !important;
}

html[data-theme] body .assistant-status-only.is-active {
  background: linear-gradient(110deg, #d84a63, #b83250) !important;
  box-shadow: 0 .55rem 1.35rem rgba(190, 50, 77, .18) !important;
}

/* Answer controls stay inside the answer without a separator or a blank toolbar row. */
html[data-theme] body .assistant-answer-tools {
  border-top: 0 !important;
}

html[data-theme] body .assistant-answer-bubble:not(:has(.message-citations)) {
  padding-right: 3.25rem !important;
  padding-bottom: .75rem !important;
}

html[data-theme] body .assistant-answer-bubble:not(:has(.message-citations)) .assistant-answer-tools {
  position: absolute;
  right: .5rem;
  bottom: .42rem;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-theme] body .assistant-answer-bubble:has(.message-citations) .assistant-answer-tools {
  margin-top: .45rem;
  padding-top: 0;
}

html[data-theme] body .assistant-answer-bubble.is-single-line:not(:has(.message-citations)) .assistant-answer-tools {
  right: .45rem;
  bottom: 50%;
  transform: translateY(50%) !important;
}

/* Chatbot dashboards use one neutral card material in both themes. */
html[data-theme] body .chatbot-dashboard-grid :is(.overview-panel, .chatbot-recent),
html[data-theme] body .wallet-chart-grid :is(.overview-panel, .chatbot-recent) {
  background: var(--aris-surface) !important;
  background-image: none !important;
}

html[data-theme] body .chatbot-dashboard-grid :is(.overview-panel, .chatbot-recent)::before,
html[data-theme] body .wallet-chart-grid :is(.overview-panel, .chatbot-recent)::before {
  content: none !important;
  display: none !important;
}

html[data-theme] body .chatbot-recent > a {
  border-color: var(--aris-line) !important;
  background: transparent !important;
  background-image: none !important;
}

/* Each chatbot card takes its top accent directly from that chatbot's selected color. */
html[data-theme] body .chatbot-assistant-grid .chatbot-compact-card {
  border-top-color: var(--assistant-color) !important;
  box-shadow: inset 0 .14rem 0 var(--assistant-color), var(--aris-shadow) !important;
}

html[data-theme] body .chatbot-assistant-grid .chatbot-compact-card::after {
  content: none !important;
}

/* Compound domain field owns one background; its prefix and input remain transparent. */
html[data-theme] body .chatbot-domain-entry,
html[data-theme] body .chatbot-domain-entry.verified {
  border-color: var(--aris-line-strong) !important;
  background: var(--aris-field) !important;
  background-image: none !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .03) !important;
}

html[data-theme] body .chatbot-domain-entry > span,
html[data-theme] body .chatbot-domain-entry input,
html[data-theme] body .chatbot-domain-entry.verified > span,
html[data-theme] body .chatbot-domain-entry.verified input {
  background: transparent !important;
  background-image: none !important;
}

/* Preview actions behave like the other primary product actions. */
html[data-theme] body .chatbot-script-refresh .chatbot-script-actions {
  border-top: 0 !important;
  gap: .55rem;
}

html[data-theme] body .chatbot-script-refresh .chatbot-script-actions button,
html[data-theme] body .chatbot-script-refresh .chatbot-script-actions button:first-child {
  min-width: 9.4rem;
  height: 2.35rem !important;
  padding: 0 1rem !important;
  justify-content: center;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(110deg, #22bdd5, #705ee5 56%, #ad34d4) !important;
  box-shadow: 0 .65rem 1.55rem rgba(92, 70, 190, .2) !important;
}

html[data-theme] body .chatbot-script-refresh .chatbot-script-actions button:is(:hover, :focus-visible),
html[data-theme] body .chatbot-script-refresh .chatbot-script-actions button:first-child:is(:hover, :focus-visible) {
  color: #fff !important;
  background: linear-gradient(110deg, #28c8df, #7d69ed 56%, #bb40df) !important;
  filter: brightness(1.05) saturate(1.06);
  transform: translateY(-.1rem);
  box-shadow: 0 .85rem 1.9rem rgba(92, 70, 190, .28) !important;
}

/* Ready is green; its actual inverse is visibly red. */
html[data-theme] body .chatbot-script-state.is-ready {
  border-color: rgba(34, 197, 139, .28) !important;
  color: #15966c !important;
  background: rgba(34, 197, 139, .1) !important;
}

html[data-theme] body .chatbot-script-state.is-not-ready,
html[data-theme] body .chatbot-status:not(.active) {
  border-color: rgba(232, 75, 102, .26) !important;
  color: #d84a63 !important;
  background: rgba(232, 75, 102, .1) !important;
}

html[data-theme="dark"] body .chatbot-script-state.is-ready {
  color: #68e2b7 !important;
}

html[data-theme="dark"] body .chatbot-script-state.is-not-ready,
html[data-theme="dark"] body .chatbot-status:not(.active) {
  color: #ff8297 !important;
}

/* Rebuilt chatbot settings: colorful overview, compact metadata, equal pill actions. */
html[data-theme] body .chatbot-settings-hero {
  padding: 1.15rem 1.25rem !important;
  display: grid;
  grid-template-columns: 3rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .9rem;
  border: 1px solid var(--aris-line-strong) !important;
  border-radius: 1.15rem !important;
  background:
    radial-gradient(circle at 3% 10%, rgba(34, 184, 240, .14), transparent 14rem),
    radial-gradient(circle at 94% 90%, rgba(173, 52, 212, .12), transparent 16rem),
    var(--aris-surface) !important;
  box-shadow: var(--aris-shadow) !important;
}

html[data-theme] body .chatbot-settings-hero-icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(139, 92, 246, .22);
  border-radius: .9rem;
  color: var(--aris-violet);
  background: linear-gradient(145deg, rgba(34, 184, 240, .16), rgba(139, 92, 246, .2));
  box-shadow: 0 .65rem 1.5rem rgba(89, 70, 180, .12);
}

html[data-theme] body .chatbot-settings-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(3.8rem, 1fr));
  gap: .45rem;
}

html[data-theme] body .chatbot-settings-summary > span {
  min-height: 2.75rem;
  padding: .45rem .65rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--aris-line);
  border-radius: .8rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body .chatbot-settings-summary b {
  color: var(--aris-text);
  font-size: .75rem;
}

html[data-theme] body .chatbot-settings-summary small {
  color: var(--aris-muted) !important;
  font-size: .45rem !important;
  letter-spacing: 0 !important;
}

html[data-theme] body .chatbot-workspace .chatbot-settings-refresh .chatbot-settings-card {
  min-height: 6rem;
  padding: .85rem 1rem;
  grid-template-columns: minmax(13rem, 1.25fr) minmax(9rem, .8fr) auto auto;
  gap: .9rem;
  border-color: color-mix(in srgb, var(--chatbot-card-color) 34%, var(--aris-line)) !important;
  border-radius: 1rem;
  background: var(--aris-surface) !important;
  box-shadow: inset .2rem 0 0 var(--chatbot-card-color), var(--aris-shadow) !important;
}

html[data-theme] body .chatbot-settings-brand {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .75rem;
}

html[data-theme] body .chatbot-settings-identity {
  min-width: 0;
}

html[data-theme] body .chatbot-settings-identity > small,
html[data-theme] body .chatbot-settings-identity > b,
html[data-theme] body .chatbot-settings-identity > span {
  display: block;
}

html[data-theme] body .chatbot-settings-identity > small {
  margin: 0 0 .2rem;
  color: var(--chatbot-card-color) !important;
  font-size: .42rem;
  font-weight: 900;
  letter-spacing: .1em;
}

html[data-theme] body .chatbot-settings-identity > b {
  overflow: hidden;
  color: var(--aris-text) !important;
  font-size: .78rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme] body .chatbot-settings-identity > span {
  margin-top: .2rem;
  overflow: hidden;
  color: var(--aris-muted);
  font-size: .48rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme] body .chatbot-settings-meta {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

html[data-theme] body .chatbot-settings-meta > span {
  min-height: 1.7rem;
  padding: 0 .55rem;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  border: 1px solid var(--aris-line);
  border-radius: 999px;
  color: var(--aris-muted);
  background: var(--aris-surface-soft);
  font-size: .46rem;
}

html[data-theme] body .chatbot-settings-meta i {
  color: var(--chatbot-card-color);
}

html[data-theme] body .chatbot-settings-actions a,
html[data-theme] body .chatbot-settings-actions button {
  min-height: 2rem;
  padding: 0 .7rem;
  border: 1px solid var(--aris-line) !important;
  border-radius: 999px !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
}

html[data-theme] body .chatbot-settings-actions :is(a, button):hover {
  border-color: var(--aris-line-strong) !important;
  background: linear-gradient(110deg, rgba(34, 184, 240, .08), rgba(139, 92, 246, .14)) !important;
  transform: translateY(-.08rem);
}

html[data-theme] body .chatbot-settings-actions .danger {
  border-color: rgba(232, 75, 102, .2) !important;
  color: #d84a63 !important;
  background: rgba(232, 75, 102, .075) !important;
}

/* Subscription cards use distinct accents, colorful feature icons and equal pill buttons. */
html[data-theme] body .plans-frame .subscription-choice {
  --plan-tone: 34, 184, 213;
  border-color: rgba(var(--plan-tone), .3) !important;
  background:
    radial-gradient(circle at 100% 100%, rgba(var(--plan-tone), .13), transparent 15rem),
    linear-gradient(145deg, rgba(var(--plan-tone), .07), transparent 48%),
    var(--aris-surface) !important;
  box-shadow: inset 0 .16rem 0 rgb(var(--plan-tone)), var(--aris-shadow) !important;
}

html[data-theme] body .plans-frame .pro-choice {
  --plan-tone: 139, 92, 246;
}

html[data-theme] body .plans-frame .chatbot-choice {
  --plan-tone: 190, 55, 211;
}

html[data-theme] body .plans-frame .subscription-choice li {
  --feature-tone: 34, 184, 213;
  border-color: rgba(var(--feature-tone), .17) !important;
  background: rgba(var(--feature-tone), .055) !important;
}

html[data-theme] body .plans-frame .subscription-choice li:nth-child(2) { --feature-tone: 139, 92, 246; }
html[data-theme] body .plans-frame .subscription-choice li:nth-child(3) { --feature-tone: 236, 72, 153; }
html[data-theme] body .plans-frame .subscription-choice li:nth-child(4) { --feature-tone: 245, 158, 11; }
html[data-theme] body .plans-frame .subscription-choice li:nth-child(5) { --feature-tone: 16, 185, 129; }

html[data-theme] body .plans-frame .subscription-choice li i {
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  flex: 0 0 1.25rem;
  border-radius: 50%;
  color: rgb(var(--feature-tone)) !important;
  background: rgba(var(--feature-tone), .13);
}

html[data-theme] body .plans-frame .subscription-choice > button,
html[data-theme] body .plans-frame .subscription-management-actions > button {
  min-height: 2.7rem;
  padding: .65rem 1rem;
  border-radius: 999px !important;
}

html[data-theme] body .plans-frame .free-choice > button:disabled {
  border: 1px solid var(--aris-line) !important;
  color: var(--aris-muted) !important;
  background: var(--aris-surface-soft) !important;
  background-image: none !important;
  box-shadow: none !important;
  opacity: 1;
}

html[data-theme] body .plans-frame .subscription-management-actions > button.subscription-cancel-button {
  border: 1px solid rgba(232, 75, 102, .24) !important;
  color: #d84a63 !important;
  background: rgba(232, 75, 102, .08) !important;
  box-shadow: none !important;
}

/* Current subscription page gets a livelier focal card and equal rounded CTA. */
html[data-theme] body .subscription-summary {
  border-color: var(--aris-line-strong) !important;
  background:
    radial-gradient(circle at 4% 20%, rgba(34, 184, 240, .16), transparent 18rem),
    radial-gradient(circle at 96% 82%, rgba(173, 52, 212, .14), transparent 20rem),
    var(--aris-surface) !important;
  box-shadow: 0 1.45rem 3.8rem rgba(68, 49, 141, .14) !important;
}

html[data-theme] body .subscription-change-link {
  min-height: 2.65rem;
  padding: .65rem 1.05rem;
  border: 0 !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: linear-gradient(110deg, #22bdd5, #705ee5 56%, #ad34d4) !important;
  box-shadow: 0 .65rem 1.6rem rgba(92, 70, 190, .22) !important;
}

html[data-theme] body .subscription-benefits article {
  border-top-width: .16rem !important;
  background: var(--aris-surface) !important;
}

/* The developer credit is an explicit external brand link. */
html[data-theme] body .footer-credit-link {
  display: inline-flex;
  color: var(--aris-text) !important;
  text-decoration: none;
}

html[data-theme] body .footer-credit-link strong {
  display: inline;
  margin: 0;
  color: inherit !important;
}

html[data-theme] body .footer-credit-link:hover {
  color: var(--aris-violet) !important;
  text-decoration: underline;
  text-underline-offset: .18rem;
}

/* Widget management owns one intentional, self-contained header surface. */
html[data-theme] body .admin-content #adminBody > .admin-chatbot-lead {
  position: relative;
  min-width: 0;
  min-height: 7.25rem;
  margin: 0 0 1rem;
  padding: 1.1rem 1.2rem;
  display: grid;
  grid-template-columns: 3rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .9rem;
  overflow: hidden;
  border: 1px solid var(--aris-line) !important;
  border-radius: 1.1rem;
  color: var(--aris-text);
  background: var(--aris-surface) !important;
  background-image: none !important;
  box-shadow: var(--aris-shadow) !important;
  backdrop-filter: blur(1rem) saturate(1.06);
  -webkit-backdrop-filter: blur(1rem) saturate(1.06);
  isolation: isolate;
}

html[data-theme] body .admin-content #adminBody > .admin-chatbot-lead::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: .2rem;
  border-radius: 1.1rem 0 0 1.1rem;
  background: linear-gradient(180deg, var(--aris-cyan), var(--aris-violet) 58%, var(--aris-magenta));
}

html[data-theme] body .admin-content #adminBody > .admin-chatbot-lead::after {
  content: none !important;
  display: none !important;
}

html[data-theme] body .admin-chatbot-lead-mark {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(139, 92, 246, .2);
  border-radius: .9rem;
  color: var(--aris-violet);
  background: linear-gradient(145deg, rgba(34, 184, 240, .14), rgba(139, 92, 246, .18));
  box-shadow: 0 .65rem 1.45rem rgba(71, 58, 153, .12);
  font-size: .9rem;
}

html[data-theme] body .admin-chatbot-lead-copy {
  min-width: 0;
}

html[data-theme] body .admin-chatbot-lead-copy > small {
  display: block;
  color: var(--aris-violet);
  font-size: .46rem;
  font-weight: 900;
  letter-spacing: .14em;
}

html[data-theme] body .admin-chatbot-lead-copy > h2 {
  margin: .32rem 0 .22rem;
  color: var(--aris-text);
  font-size: clamp(.95rem, 1.45vw, 1.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

html[data-theme] body .admin-chatbot-lead-copy > p {
  max-width: 42rem;
  margin: 0;
  color: var(--aris-muted);
  font-size: .58rem;
  line-height: 1.55;
}

html[data-theme] body .admin-chatbot-lead-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .55rem;
}

html[data-theme] body .admin-chatbot-security {
  min-height: 2.8rem;
  padding: .45rem .7rem;
  display: flex;
  align-items: center;
  gap: .55rem;
  border: 1px solid var(--aris-line);
  border-radius: .8rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body .admin-chatbot-security > i {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: .58rem;
  color: var(--aris-violet);
  background: rgba(139, 92, 246, .12);
  font-size: .62rem;
}

html[data-theme] body .admin-chatbot-security small,
html[data-theme] body .admin-chatbot-security b {
  display: block;
  white-space: nowrap;
}

html[data-theme] body .admin-chatbot-security small {
  color: var(--aris-muted);
  font-size: .38rem;
  font-weight: 850;
  letter-spacing: .1em;
}

html[data-theme] body .admin-chatbot-security b {
  margin-top: .12rem;
  color: var(--aris-text);
  font-size: .5rem;
}

html[data-theme] body .admin-chatbot-live {
  min-height: 2rem;
  padding: 0 .65rem;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  border: 1px solid rgba(34, 197, 139, .2);
  border-radius: 999px;
  color: #148866;
  background: rgba(34, 197, 139, .08);
  font-size: .46rem;
  white-space: nowrap;
}

html[data-theme] body .admin-chatbot-live > i {
  width: .34rem;
  height: .34rem;
  border-radius: 50%;
  background: #22c98b;
  box-shadow: 0 0 0 .2rem rgba(34, 201, 139, .1);
}

html[data-theme="dark"] body .admin-chatbot-live {
  color: #6fe0b8;
}

@media (max-width: 62rem) {
  html[data-theme] body .admin-content #adminBody > .admin-chatbot-lead {
    grid-template-columns: 3rem minmax(0, 1fr);
  }

  html[data-theme] body .admin-chatbot-lead-status {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-left: 3.9rem;
  }

  html[data-theme] body .chatbot-settings-hero {
    grid-template-columns: 3rem minmax(0, 1fr);
  }

  html[data-theme] body .chatbot-settings-summary {
    grid-column: 1 / -1;
  }

  html[data-theme] body .chatbot-workspace .chatbot-settings-refresh .chatbot-settings-card {
    grid-template-columns: minmax(13rem, 1fr) auto;
  }

  html[data-theme] body .chatbot-settings-meta,
  html[data-theme] body .chatbot-settings-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 42rem) {
  html[data-theme] body .admin-content #adminBody > .admin-chatbot-lead {
    grid-template-columns: 2.65rem minmax(0, 1fr);
    padding: .9rem;
  }

  html[data-theme] body .admin-chatbot-lead-mark {
    width: 2.65rem;
    height: 2.65rem;
  }

  html[data-theme] body .admin-chatbot-lead-status {
    padding-left: 0;
    flex-wrap: wrap;
  }

  html[data-theme] body .admin-chatbot-security {
    flex: 1 1 10rem;
  }

  html[data-theme] body .admin-assistant-filters {
    align-items: stretch;
    flex-direction: column;
  }

  html[data-theme] body .admin-assistant-filters label,
  html[data-theme] body .admin-assistant-filters select {
    width: 100%;
  }

  html[data-theme] body #adminAssistantFilterCount {
    margin-left: 0;
    text-align: center;
  }

  html[data-theme] body .chatbot-settings-hero {
    grid-template-columns: 1fr;
  }

  html[data-theme] body .chatbot-settings-hero-icon {
    width: 2.6rem;
    height: 2.6rem;
  }

  html[data-theme] body .chatbot-workspace .chatbot-settings-refresh .chatbot-settings-card {
    grid-template-columns: 1fr;
  }

  html[data-theme] body .chatbot-settings-meta,
  html[data-theme] body .chatbot-settings-status,
  html[data-theme] body .chatbot-settings-actions {
    grid-column: 1;
    flex-wrap: wrap;
  }

  html[data-theme] body .chatbot-settings-actions :is(a, button) {
    flex: 1 1 8rem;
    justify-content: center;
  }

  html[data-theme] body .chatbot-script-refresh .chatbot-script-actions button {
    width: 100%;
  }
}

/* Keep the composer interaction ring in sync with the selected assistant/send color. */
html[data-theme] body .workspace-composer {
  --composer-accent: #22b8f0;
  padding: .5rem .5625rem !important;
  border-radius: 1.875rem !important;
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

html[data-theme] body .workspace-composer .composer-assistant,
html[data-theme] body .workspace-composer :is(.workspace-tool, .workspace-send) {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
}

html[data-theme] body .workspace-composer .composer-assistant {
  max-width: 2.5rem;
  align-self: flex-end;
}

html[data-theme] body .workspace-composer .composer-assistant > span,
html[data-theme] body .workspace-composer .composer-assistant > .assistant-brand-avatar {
  width: 2.5rem !important;
  height: 2.5rem !important;
}

html[data-theme] body .workspace-composer .workspace-tools {
  width: auto;
  height: 2.5rem;
  min-width: 0;
  align-items: center;
  align-self: flex-end;
  flex: 0 0 auto;
  padding-right: 0;
}

html[data-theme] body .workspace-composer:is(:hover, :focus-within) {
  border-color: color-mix(in srgb, var(--composer-accent) 38%, var(--aris-line)) !important;
  box-shadow: 0 1rem 2.8rem rgba(0, 0, 0, .18) !important;
}

@media (max-width: 47.5rem) {
  html[data-theme] body .workspace-composer {
    height: 3.35rem;
    padding: .35rem .4rem !important;
    align-items: center;
    border-radius: 999px !important;
  }

  html[data-theme] body .workspace-composer .composer-assistant {
    align-self: center;
  }

  html[data-theme] body .workspace-composer .workspace-tools {
    align-self: center;
  }
}

/* Rounded assistant picker surface and option cards. */
html[data-theme] body .assistant-popover {
  padding: .55rem !important;
  gap: .3rem;
  border-radius: 1.4rem !important;
  overflow-x: hidden !important;
}

html[data-theme] body .assistant-popover-title {
  min-height: 2rem;
  margin-bottom: .1rem;
  padding: .3rem .65rem !important;
  border: 0 !important;
  border-radius: .9rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body .assistant-popover button {
  min-height: 2.85rem;
  padding: .38rem .55rem !important;
  border-radius: 999px !important;
  overflow: hidden;
  background-clip: padding-box !important;
  transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

html[data-theme] body .assistant-popover button:is(:hover, :focus-visible) {
  border-radius: 999px !important;
  border-color: color-mix(in srgb, var(--aris-violet) 24%, var(--aris-line)) !important;
  background: color-mix(in srgb, var(--aris-violet) 7%, var(--aris-surface)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .035);
}

html[data-theme] body .assistant-popover button.active {
  border-radius: 999px !important;
  border-color: color-mix(in srgb, var(--aris-violet) 32%, var(--aris-line)) !important;
  background: color-mix(in srgb, var(--aris-violet) 11%, var(--aris-surface)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05);
}

html[data-theme] body .assistant-popover button > i:last-child {
  width: 1.35rem;
  height: 1.35rem;
  display: grid;
  place-items: center;
  flex: 0 0 1.35rem;
  border-radius: 50%;
  color: #21bf9a;
  background: rgba(33, 191, 154, .1);
}

/* Live user presence in the admin user table. */
html[data-theme] body .user-presence {
  display: grid;
  justify-items: start;
  gap: .25rem;
}

html[data-theme] body .user-presence .user-status {
  min-height: 1.55rem;
  padding: 0 .55rem;
  border: 1px solid var(--aris-line);
  border-radius: 999px;
  color: var(--aris-muted);
  background: var(--aris-surface-soft);
  font-size: .5rem;
  font-weight: 800;
}

html[data-theme] body .user-presence .user-status.online {
  border-color: rgba(34, 197, 139, .24);
  color: #20a87f;
  background: rgba(34, 197, 139, .09);
}

html[data-theme] body .user-presence .user-status.online i {
  background: #22c98b;
  box-shadow: 0 0 0 .2rem rgba(34, 201, 139, .11), 0 0 .7rem rgba(34, 201, 139, .34);
}

html[data-theme] body .user-presence .user-status.offline {
  border-color: rgba(225, 82, 105, .2);
  color: #d75d72;
  background: rgba(225, 82, 105, .075);
}

html[data-theme] body .user-presence .user-status.offline i {
  background: #dc6075;
  box-shadow: 0 0 0 .2rem rgba(220, 96, 117, .09);
}

html[data-theme] body .user-presence .user-status.disabled {
  border-color: rgba(245, 158, 11, .2);
  color: #c88918;
  background: rgba(245, 158, 11, .075);
}

html[data-theme] body .user-presence > small {
  color: var(--aris-muted);
  font-size: .43rem;
  white-space: nowrap;
}

html[data-theme="dark"] body .user-presence .user-status.online {
  color: #67ddb4;
}

html[data-theme="dark"] body .user-presence .user-status.offline {
  color: #f08ca0;
}
.chatbot-source-visibility {
  display: grid;
  gap: .1875rem;
  margin: .5rem 0;
  color: var(--aris-muted);
  font-size: .5rem;
  font-weight: 750;
}

.chatbot-source-visibility select {
  width: 100%;
  height: 2.0625rem;
  margin: 0;
  padding: 0 .625rem;
  border: 1px solid var(--aris-line);
  border-radius: .5625rem;
  background: var(--aris-field);
  color: inherit;
  font-size: .59375rem;
  font-weight: 400;
}

.chatbot-source-visibility small {
  color: var(--aris-muted);
  font-size: .46875rem;
  font-weight: 400;
  line-height: 1.35;
}

/* 2026-08 marketing rebuild: product-led story for assistants, knowledge and web chatbots. */
html[data-theme] body #app:has(> .site-header) > .home-content.landing-v3,
html[data-theme] body #app:has(> .site-header) > .home-content {
  --landing-cyan: #22b8f0;
  --landing-violet: #8157e6;
  --landing-magenta: #b632d6;
  --landing-green: #18a875;
}

html[data-theme] body #app .landing-hero-v2 {
  min-height: min(50rem, calc(100svh - 4.5rem));
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(31rem, .98fr);
  align-items: center;
  gap: clamp(2.5rem, 6vw, 6.5rem);
  padding-block: clamp(4.5rem, 8vw, 7.5rem) !important;
}

html[data-theme] body #app .landing-hero-v2 .hero-copy {
  max-width: 43rem;
  padding: 0;
}

html[data-theme] body #app .landing-hero-v2 .section-kicker,
html[data-theme] body #app .landing-product-suite .section-kicker,
html[data-theme] body #app .landing-partners .section-kicker,
html[data-theme] body #app .grounding-showcase .section-kicker,
html[data-theme] body #app .landing-capability-suite .section-kicker,
html[data-theme] body #app .landing-setup-section .section-kicker,
html[data-theme] body #app .landing-use-cases .section-kicker,
html[data-theme] body #app .landing-pricing .section-kicker,
html[data-theme] body #app .landing-final-cta .section-kicker {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 1.25rem;
  color: var(--landing-violet);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .14em;
}

html[data-theme] body #app .landing-hero-v2 .section-kicker::before,
html[data-theme] body #app .landing-product-suite .section-kicker::before,
html[data-theme] body #app .landing-partners .section-kicker::before,
html[data-theme] body #app .grounding-showcase .section-kicker::before,
html[data-theme] body #app .landing-capability-suite .section-kicker::before,
html[data-theme] body #app .landing-setup-section .section-kicker::before,
html[data-theme] body #app .landing-use-cases .section-kicker::before,
html[data-theme] body #app .landing-pricing .section-kicker::before,
html[data-theme] body #app .landing-final-cta .section-kicker::before {
  content: "";
  width: 1.7rem;
  height: .13rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--landing-cyan), var(--landing-violet));
}

html[data-theme] body #app .landing-hero-v2 .hero-copy h1 {
  max-width: 46rem;
  margin: 0;
  color: var(--aris-text);
  font-size: clamp(3.25rem, 5.4vw, 5.75rem);
  font-weight: 840;
  letter-spacing: -.065em;
  line-height: .98;
}

html[data-theme] body #app .landing-hero-v2 .hero-copy h1 span {
  display: block;
  margin-top: .35rem;
  color: transparent;
  background: linear-gradient(102deg, var(--landing-cyan), var(--landing-violet) 56%, var(--landing-magenta));
  background-clip: text;
  -webkit-background-clip: text;
}

html[data-theme] body #app .landing-hero-v2 .hero-copy > p {
  max-width: 41rem;
  margin: 1.65rem 0 0;
  color: var(--aris-muted);
  font-size: clamp(1rem, 1.3vw, 1.17rem);
  line-height: 1.8;
}

html[data-theme] body #app .landing-hero-v2 .hero-actions {
  margin-top: 2rem;
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
}

html[data-theme] body #app .landing-hero-v2 .hero-actions .btn,
html[data-theme] body #app .landing-final-cta .btn {
  min-height: 2.85rem;
  max-width: 100%;
  padding-inline: 1.1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
  background-clip: padding-box !important;
  border-radius: 999px !important;
  font-size: .75rem;
  font-weight: 820;
}

html[data-theme] body #app .landing-hero-v2 .hero-actions .primary,
html[data-theme] body #app .landing-final-cta .primary {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(112deg, #22b8f0, #795ce2 58%, #a63ad7) !important;
  box-shadow: 0 .8rem 2rem rgba(111, 82, 215, .24) !important;
}

html[data-theme] body #app .landing-hero-v2 .hero-actions .secondary,
html[data-theme] body #app .landing-final-cta .secondary {
  border: 1px solid var(--aris-line-strong) !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
}

html[data-theme] body #app .landing-hero-v2 .hero-pills {
  margin-top: 1.35rem;
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}

html[data-theme] body #app .landing-hero-v2 .hero-pills span {
  min-height: 2.15rem;
  padding: .45rem .72rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border: 1px solid var(--aris-line);
  border-radius: 999px;
  color: var(--aris-muted);
  background: var(--aris-surface-soft) !important;
  font-size: .68rem;
  font-weight: 720;
}

html[data-theme] body #app .landing-hero-v2 .hero-pills i {
  color: var(--landing-violet);
}

/* Static hero illustration mirrors the public widget's geometry and theme tokens.
   Keep these values aligned with public/widget/v1/widget.js; no chat API is called. */
html[data-theme] body #app .landing-chatbot-preview {
  --demo-color: #1bb5e5;
  --demo-bg: #f7f6f2;
  --demo-panel: #f1f0ec;
  --demo-soft: #fff;
  --demo-field: #fff;
  --demo-text: #121c32;
  --demo-muted: #667082;
  --demo-border: rgba(18, 28, 50, .12);
  --demo-bubble-border: color-mix(in srgb, var(--demo-color), transparent 75%);
  --demo-input-border: color-mix(in srgb, var(--demo-color), transparent 58%);
  --demo-head: linear-gradient(115deg, rgba(25,190,208,.2), rgba(112,110,228,.16) 52%, rgba(168,50,207,.13)), #f7f6f2;
  --demo-control-border: rgba(18,28,50,.14);
  --demo-control-bg: rgba(255,255,255,.45);
  --demo-control-color: #4e5c72;
  --demo-subtitle: #526078;
  --demo-close: #c43f55;
  width: min(410px, 100%);
  min-width: 0;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  color: var(--demo-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="dark"] body #app .landing-chatbot-preview {
  --demo-bg: #161616;
  --demo-panel: #1c1c1c;
  --demo-soft: #272727;
  --demo-field: #202020;
  --demo-text: #f2f2f2;
  --demo-muted: #a4a4a4;
  --demo-border: #383838;
  --demo-bubble-border: #383838;
  --demo-input-border: #383838;
  --demo-head: linear-gradient(115deg, rgba(25,190,208,.38), rgba(112,110,228,.28) 52%, rgba(168,50,207,.22)), #0d1320;
  --demo-control-border: rgba(203,183,250,.23);
  --demo-control-bg: rgba(255,255,255,.025);
  --demo-control-color: #d8e0ec;
  --demo-subtitle: #d8cef1;
  --demo-close: #fb7185;
}

html[data-theme] body #app .landing-chatbot-panel {
  width: 100%;
  height: 660px;
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  overflow: hidden;
  border: 1px solid var(--demo-border);
  border-radius: 34px;
  background: var(--demo-bg);
  box-shadow: 0 30px 92px rgba(11,8,27,.16);
}

html[data-theme="dark"] body #app .landing-chatbot-panel {
  box-shadow: 0 30px 92px rgba(11,8,27,.46);
}

html[data-theme] body #app .landing-chatbot-head {
  min-height: 72px;
  padding: 13px 13px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--demo-border);
  background: var(--demo-head);
}

html[data-theme] body #app .landing-chatbot-avatar {
  width: 39px;
  height: 39px;
  flex: 0 0 39px;
  display: block;
  border-radius: 50%;
  object-fit: cover;
}

html[data-theme] body #app .landing-chatbot-identity {
  min-width: 0;
  flex: 1;
}

html[data-theme] body #app .landing-chatbot-identity strong,
html[data-theme] body #app .landing-chatbot-identity small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme] body #app .landing-chatbot-identity strong {
  color: var(--demo-text);
  font-size: 15.5px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: -.01em;
}

html[data-theme] body #app .landing-chatbot-identity small {
  margin-top: 4px;
  color: var(--demo-subtitle);
  font-size: 9px;
  font-weight: 650;
}

html[data-theme] body #app .landing-chatbot-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 6px;
}

html[data-theme] body #app .landing-chatbot-actions > span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--demo-control-border);
  border-radius: 50%;
  background: var(--demo-control-bg);
  color: var(--demo-control-color);
  font-size: 12px;
}

html[data-theme] body #app .landing-chatbot-actions > .is-close {
  border-color: color-mix(in srgb, var(--demo-close) 26%, transparent);
  background: color-mix(in srgb, var(--demo-close) 8%, transparent);
  color: var(--demo-close);
}

html[data-theme] body #app .landing-chatbot-messages {
  min-height: 0;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--demo-color), transparent 91%), transparent 40%), var(--demo-panel);
}

html[data-theme="dark"] body #app .landing-chatbot-messages { background: var(--demo-panel); }

html[data-theme] body #app .landing-chatbot-date {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 3px 0 8px;
  color: var(--demo-muted);
  font-size: 9px;
  font-weight: 800;
}

html[data-theme] body #app .landing-chatbot-date::before,
html[data-theme] body #app .landing-chatbot-date::after {
  content: "";
  flex: 1;
  height: 1px;
  background: color-mix(in srgb, var(--demo-text), transparent 90%);
}

html[data-theme] body #app .landing-chatbot-date > span {
  padding: 5px 11px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--demo-text), transparent 95%);
}

html[data-theme] body #app .landing-chatbot-message { max-width: 85%; }

html[data-theme] body #app .landing-chatbot-bubble {
  padding: 11px 13px;
  display: flex;
  align-items: center;
  gap: 14px;
  overflow: hidden;
  overflow-wrap: anywhere;
  border: 1px solid var(--demo-bubble-border);
  border-radius: 18px;
  background: var(--demo-soft);
  color: var(--demo-text);
  font-size: 16px;
  line-height: 1.4;
}

html[data-theme] body #app .landing-chatbot-bubble > i {
  flex: 0 0 auto;
  color: var(--demo-muted);
  font-size: 11px;
}

html[data-theme] body #app .landing-chatbot-message > time {
  display: block;
  margin-top: 5px;
  color: var(--demo-muted);
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
}

html[data-theme] body #app .landing-chatbot-composer {
  min-width: 0;
  padding: 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  border-top: 1px solid var(--demo-border);
  background: var(--demo-bg);
}

html[data-theme] body #app .landing-chatbot-input {
  min-width: 0;
  height: 44px;
  flex: 1;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--demo-input-border);
  border-radius: 22px;
  background: var(--demo-field);
  color: var(--demo-muted);
  font-size: 16px;
}

html[data-theme] body #app .landing-chatbot-input > i { font-size: 14px; }

html[data-theme] body #app .landing-chatbot-send {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, color-mix(in srgb, var(--demo-color), white 18%) 0%, var(--demo-color) 52%, color-mix(in srgb, var(--demo-color), black 16%) 100%);
  color: #fff;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--demo-color), transparent 72%);
  font-size: 18px;
}

html[data-theme] body #app .landing-chatbot-brand {
  width: max-content;
  min-width: 128px;
  min-height: 31px;
  padding: 5px 16px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--demo-bg);
}

html[data-theme] body #app .landing-chatbot-brand img {
  width: 82px;
  height: 18px;
  object-fit: contain;
  opacity: .82;
}

html[data-theme="dark"] body #app .landing-chatbot-brand img { filter: brightness(0) invert(1); }

@media (max-width: 42rem) {
  html[data-theme] body #app .landing-chatbot-panel { height: min(660px, 78svh); min-height: 460px; }
}

@media (max-width: 26rem) {
  html[data-theme] body #app .landing-chatbot-head { gap: 8px; padding-inline: 10px; }
  html[data-theme] body #app .landing-chatbot-actions { gap: 4px; }
  html[data-theme] body #app .landing-chatbot-actions > span { width: 27px; height: 27px; }
  html[data-theme] body #app .landing-chatbot-avatar { width: 33px; height: 33px; flex-basis: 33px; }
}

html[data-theme] body #app .landing-proof-strip {
  margin: 0 0 2.5rem;
  padding: .65rem .75rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--aris-line);
  border-radius: 1.35rem;
  background: var(--aris-surface-soft) !important;
  box-shadow: none !important;
}

html[data-theme] body #app .landing-proof-strip article {
  min-width: 0;
  min-height: 0;
  padding: .45rem .75rem;
  position: relative;
  display: flex;
  align-items: center;
  gap: .75rem;
  border: 0 !important;
}

html[data-theme] body #app .landing-proof-strip article:not(:last-child)::after {
  content: "";
  position: absolute;
  top: .6rem;
  right: 0;
  bottom: .6rem;
  width: 1px;
  background: var(--aris-line);
}

html[data-theme] body #app .landing-proof-strip article:nth-child(1) { --proof-accent: #087fa4; }
html[data-theme] body #app .landing-proof-strip article:nth-child(2) { --proof-accent: #13825e; }
html[data-theme] body #app .landing-proof-strip article:nth-child(3) { --proof-accent: #7650d0; }
html[data-theme] body #app .landing-proof-strip article:nth-child(4) { --proof-accent: #b0338e; }
html[data-theme="dark"] body #app .landing-proof-strip article:nth-child(1) { --proof-accent: #62d7f2; }
html[data-theme="dark"] body #app .landing-proof-strip article:nth-child(2) { --proof-accent: #64d8a8; }
html[data-theme="dark"] body #app .landing-proof-strip article:nth-child(3) { --proof-accent: #bda2ff; }
html[data-theme="dark"] body #app .landing-proof-strip article:nth-child(4) { --proof-accent: #f29edb; }

html[data-theme] body #app .landing-proof-strip article > i {
  width: 2.2rem;
  height: 2.2rem;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: .82rem;
  color: var(--proof-accent) !important;
  background: color-mix(in srgb, var(--proof-accent) 10%, transparent) !important;
}

html[data-theme] body #app .landing-proof-strip span {
  min-width: 0;
  display: grid;
  gap: .18rem;
}

html[data-theme] body #app .landing-proof-strip b {
  color: var(--proof-accent) !important;
  font-size: .72rem;
}

html[data-theme] body #app .landing-proof-strip small {
  color: var(--aris-muted);
  font-size: .58rem;
  line-height: 1.4;
}

html[data-theme] body #app :is(.landing-product-suite, .landing-capability-suite, .landing-use-cases, .landing-pricing) {
  padding-block: clamp(5.5rem, 8vw, 8rem) !important;
}

html[data-theme] body #app :is(.landing-product-suite, .landing-capability-suite, .landing-use-cases, .landing-pricing)::before {
  content: none !important;
  display: none !important;
}

html[data-theme] body #app :is(.landing-product-suite, .landing-partners, .landing-capability-suite, .landing-use-cases, .landing-pricing) .section-head {
  max-width: 49rem;
  margin-inline: auto;
}

html[data-theme] body #app :is(.landing-product-suite, .landing-partners, .landing-capability-suite, .landing-use-cases, .landing-pricing, .landing-setup-section) .section-head h2 {
  margin: 0;
  color: var(--aris-text);
  font-size: clamp(2.35rem, 4vw, 4rem);
  font-weight: 830;
  letter-spacing: -.05em;
  line-height: 1.04;
}

html[data-theme] body #app :is(.landing-product-suite, .landing-partners, .landing-capability-suite, .landing-use-cases, .landing-pricing, .landing-setup-section) .section-head h2 span {
  color: var(--landing-violet);
}

html[data-theme] body #app :is(.landing-product-suite, .landing-partners, .landing-capability-suite, .landing-use-cases, .landing-pricing, .landing-setup-section) .section-head > p {
  max-width: 46rem;
  margin: 1rem auto 0;
  color: var(--aris-muted);
  font-size: .95rem;
  line-height: 1.75;
}

html[data-theme] body #app .product-suite-grid {
  margin-top: 3.25rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
}

/* Product suites: scoped glass surfaces and illustrative, non-interactive UI. */
html[data-theme] body #app .product-suite-card {
  position: relative;
  isolation: isolate;
  min-width: 0;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--suite-accent) 20%, var(--aris-line));
  border-radius: 1.65rem;
  background: linear-gradient(155deg, color-mix(in srgb, var(--suite-accent) 6%, transparent), transparent 36%), var(--aris-surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), var(--aris-shadow);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

html[data-theme] body #app .product-suite-card::before {
  content: "";
  position: absolute;
  inset: 0 12% auto;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--suite-accent), transparent);
  box-shadow: 0 0 1.4rem color-mix(in srgb, var(--suite-accent) 40%, transparent);
  pointer-events: none;
}

@supports (grid-template-rows: subgrid) {
  html[data-theme] body #app .product-suite-card {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 5;
    row-gap: 0;
  }
}

html[data-theme] body #app .product-suite-card.is-workspace { --suite-accent: #087ea4; --suite-glow: #64dafa; }
html[data-theme] body #app .product-suite-card.is-assistant { --suite-accent: #7650d0; --suite-glow: #bda2ff; }
html[data-theme] body #app .product-suite-card.is-chatbot { --suite-accent: #af3397; --suite-glow: #f29edb; }

html[data-theme="dark"] body #app .product-suite-card.is-workspace { --suite-accent: #64dafa; }
html[data-theme="dark"] body #app .product-suite-card.is-assistant { --suite-accent: #bda2ff; }
html[data-theme="dark"] body #app .product-suite-card.is-chatbot { --suite-accent: #f29edb; }

html[data-theme] body #app .product-suite-top {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-width: 0;
}

html[data-theme] body #app .product-suite-icon {
  width: 3rem;
  height: 3rem;
  flex: 0 0 3rem;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--suite-accent) 22%, transparent);
  border-radius: 1rem;
  color: var(--suite-accent);
  background: color-mix(in srgb, var(--suite-accent) 8%, transparent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16);
  font-size: 1.05rem;
}

html[data-theme] body #app .product-suite-top > div {
  min-width: 0;
  display: grid;
  gap: .35rem;
}

html[data-theme] body #app .product-suite-top em {
  color: var(--suite-accent);
  font-size: .59rem;
  font-style: normal;
  font-weight: 850;
  letter-spacing: .1em;
}

html[data-theme] body #app .product-suite-top > div > span {
  color: var(--aris-muted);
  font-size: .64rem;
  line-height: 1.45;
}

html[data-theme] body #app .suite-orbit-mark {
  position: relative;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 1.65rem;
  margin-left: auto;
  border: 1px solid color-mix(in srgb, var(--suite-accent) 24%, transparent);
  border-radius: 50%;
}

html[data-theme] body #app .suite-orbit-mark::before {
  content: "";
  position: absolute;
  inset: .35rem;
  border: 1px dashed color-mix(in srgb, var(--suite-accent) 50%, transparent);
  border-radius: 50%;
}

html[data-theme] body #app .suite-orbit-mark::after {
  content: "";
  position: absolute;
  top: .08rem;
  right: .12rem;
  width: .32rem;
  height: .32rem;
  border-radius: 50%;
  background: var(--suite-accent);
}

html[data-theme] body #app .product-suite-intro {
  min-height: 10.5rem;
  padding-block: 1.45rem 1.25rem;
}

html[data-theme] body #app .product-suite-intro h3 {
  margin: 0 0 .7rem;
  color: var(--aris-text);
  font-size: clamp(1.25rem, 1.5vw, 1.5rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.22;
  text-wrap: balance;
}

html[data-theme] body #app .product-suite-intro p {
  margin: 0;
  color: var(--aris-muted);
  font-size: .78rem;
  line-height: 1.7;
}

html[data-theme] body #app .product-suite-stage {
  position: relative;
  isolation: isolate;
  min-width: 0;
  height: 12rem;
  flex: 0 0 12rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--suite-glow) 28%, #253144);
  border-radius: 1rem;
  color: #eff3ff;
  background:
    radial-gradient(ellipse at 80% 0, color-mix(in srgb, var(--suite-glow) 14%, transparent), transparent 65%),
    linear-gradient(rgba(255, 255, 255, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .022) 1px, transparent 1px),
    #101724;
  background-size: auto, 1.1rem 1.1rem, 1.1rem 1.1rem, auto;
  box-shadow: 0 .7rem 1.4rem rgba(12, 18, 32, .12), inset 0 1px 0 rgba(255, 255, 255, .06);
}

html[data-theme] body #app .suite-stage-bar {
  height: 2.1rem;
  padding-inline: .75rem;
  display: flex;
  align-items: center;
  gap: .55rem;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
  background: rgba(255, 255, 255, .025);
}

html[data-theme] body #app .suite-stage-bar > span {
  display: flex;
  gap: .2rem;
}

html[data-theme] body #app .suite-stage-bar > span > i {
  width: .23rem;
  height: .23rem;
  border-radius: 50%;
  background: #596477;
}

html[data-theme] body #app .suite-stage-bar > b {
  color: #dde5f5;
  font-size: .52rem;
  font-weight: 700;
  letter-spacing: .07em;
}

html[data-theme] body #app .suite-stage-bar > small {
  margin-left: auto;
  color: #a4b1c6;
  font-size: .5rem;
}

html[data-theme] body #app .suite-chat-demo {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: .7rem;
  padding: .85rem .8rem;
}

html[data-theme] body #app .suite-demo-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .55rem;
  padding-top: .15rem;
}

html[data-theme] body #app .suite-demo-rail > span {
  width: 1.65rem;
  height: 1.65rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: .55rem;
  color: #a4b1c6;
  font-size: .65rem;
}

html[data-theme] body #app .suite-demo-rail > .selected {
  color: var(--suite-glow);
  background: color-mix(in srgb, var(--suite-glow) 12%, transparent);
  border-color: color-mix(in srgb, var(--suite-glow) 35%, transparent);
  box-shadow: 0 0 1rem color-mix(in srgb, var(--suite-glow) 12%, transparent);
}

html[data-theme] body #app .suite-demo-thread {
  min-width: 0;
  display: grid;
  gap: .7rem;
}

html[data-theme] body #app .suite-demo-prompt {
  justify-self: end;
  padding: .55rem .7rem;
  border: 1px solid color-mix(in srgb, var(--suite-glow) 25%, transparent);
  border-radius: .65rem .65rem .15rem .65rem;
  color: #e4f7ff;
  background: color-mix(in srgb, var(--suite-glow) 12%, transparent);
  font-size: .57rem;
  line-height: 1.5;
}

html[data-theme] body #app .suite-demo-response {
  display: grid;
  grid-template-columns: 1rem minmax(0, 1fr);
  gap: .5rem;
  padding: .65rem;
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: .15rem .65rem .65rem .65rem;
  background: rgba(255, 255, 255, .035);
}

html[data-theme] body #app .suite-demo-response > i {
  padding-top: .15rem;
  color: var(--suite-glow);
  font-size: .65rem;
}

html[data-theme] body #app .suite-demo-response b {
  display: block;
  margin-bottom: .55rem;
  color: #dce7f7;
  font-size: .58rem;
  font-weight: 600;
}

html[data-theme] body #app .suite-demo-lines {
  display: grid;
  gap: .3rem;
}

html[data-theme] body #app .suite-demo-lines > i {
  display: block;
  height: .2rem;
  border-radius: 1rem;
  background: rgba(207, 222, 246, .2);
}

html[data-theme] body #app .suite-demo-lines > i:last-child { width: 60%; }
html[data-theme] body #app .suite-demo-lines > i:nth-child(2) { width: 82%; }

html[data-theme] body #app .suite-demo-tools {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  color: #b4c4d9;
  font-size: .53rem;
}

html[data-theme] body #app .suite-demo-tools i {
  margin-right: .1rem;
  color: var(--suite-glow);
}

html[data-theme] body #app .suite-knowledge-demo {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 5.2rem minmax(0, 1fr);
  align-items: center;
  gap: .7rem;
  padding: 1.1rem .75rem .9rem;
}

html[data-theme] body #app .suite-knowledge-demo::before {
  content: "";
  position: absolute;
  inset: 50% 2rem auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--suite-glow), transparent);
  opacity: .5;
  z-index: -1;
}

html[data-theme] body #app :is(.suite-source-nodes, .suite-access-nodes) {
  display: grid;
  gap: .8rem;
}

html[data-theme] body #app :is(.suite-source-nodes, .suite-access-nodes) > span {
  padding: .6rem .25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  border: 1px solid rgba(189, 162, 255, .2);
  border-radius: .55rem;
  color: #e2d8ff;
  background: #1c2134;
  font-size: .55rem;
}

html[data-theme] body #app .suite-ai-core {
  position: relative;
  width: 5.2rem;
  height: 5.2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: .5rem;
  border: 1px solid rgba(189, 162, 255, .45);
  border-radius: 50%;
  color: var(--suite-glow);
  background: radial-gradient(circle at 45% 30%, #423064, #1d243b 75%);
  box-shadow: 0 0 1.75rem rgba(145, 99, 240, .17), inset 0 0 1rem rgba(189, 162, 255, .08);
}

html[data-theme] body #app .suite-ai-core::before {
  content: "";
  position: absolute;
  inset: -.35rem;
  border: 1px dashed rgba(189, 162, 255, .25);
  border-radius: 50%;
}

html[data-theme] body #app .suite-ai-core > i { font-size: 1.4rem; }
html[data-theme] body #app .suite-ai-core > b { font-size: .47rem; letter-spacing: .09em; }

html[data-theme] body #app .suite-demo-caption {
  text-align: center;
  color: #b7aecb;
  font-size: .55rem;
  line-height: 1.5;
}

html[data-theme] body #app .suite-demo-caption i {
  margin-right: .25rem;
  color: var(--suite-glow);
}

html[data-theme] body #app .suite-site-demo {
  position: relative;
  height: calc(100% - 2.1rem);
  padding: 1.1rem .85rem;
}

html[data-theme] body #app .suite-site-content {
  width: 51%;
  display: grid;
  gap: .75rem;
  opacity: .6;
}

html[data-theme] body #app .suite-site-brand {
  width: 3rem;
  height: .55rem;
  border-radius: .2rem;
  background: linear-gradient(90deg, var(--suite-glow), #b995ff);
}

html[data-theme] body #app .suite-site-tiles {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .4rem;
}

html[data-theme] body #app .suite-site-tiles i {
  height: 2.5rem;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: .35rem;
  background: linear-gradient(135deg, rgba(242, 158, 219, .08), transparent);
}

html[data-theme] body #app .suite-widget-demo {
  position: absolute;
  top: .8rem;
  right: .75rem;
  width: 66%;
  max-width: 13rem;
  padding: .65rem;
  border: 1px solid rgba(242, 158, 219, .28);
  border-radius: .75rem;
  background: #242134;
  box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .3), 0 0 2rem rgba(242, 158, 219, .07);
}

html[data-theme] body #app .suite-widget-demo > div {
  display: flex;
  align-items: center;
  gap: .35rem;
  color: #f5e5f7;
}

html[data-theme] body #app .suite-widget-demo > div > i { color: var(--suite-glow); font-size: .8rem; }
html[data-theme] body #app .suite-widget-demo b { font-size: .58rem; font-weight: 650; }

html[data-theme] body #app .suite-widget-demo > div > span {
  flex: 0 0 .25rem;
  height: .25rem;
  margin-left: auto;
  border-radius: 50%;
  background: #6ee7b7;
}

html[data-theme] body #app .suite-widget-demo p {
  margin: .65rem 0;
  padding: .5rem .6rem;
  border-radius: .1rem .5rem .5rem .5rem;
  color: #ece1f0;
  background: rgba(242, 158, 219, .09);
  font-size: .57rem;
  line-height: 1.6;
}

html[data-theme] body #app .suite-widget-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .3rem;
  padding-top: .45rem;
  border-top: 1px solid rgba(255, 255, 255, .09);
  color: #b7a9c3;
  font-size: .53rem;
}

html[data-theme] body #app .suite-widget-input i {
  padding: .25rem;
  border-radius: 50%;
  color: #201828;
  background: var(--suite-glow);
}

html[data-theme] body #app .suite-widget-launcher {
  position: absolute;
  right: .85rem;
  bottom: .55rem;
  width: 1.6rem;
  height: 1.6rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 50%;
  color: #291c35;
  background: linear-gradient(135deg, #f4b1e1, #bda2ff);
  box-shadow: 0 0 1rem rgba(242, 158, 219, .2);
  font-size: .65rem;
}

/* Light product previews: scoped to the illustrative screens; dark styles stay intact. */
html[data-theme="light"] body #app .product-suite-stage {
  --suite-preview-canvas: #f7f9fc;
  --suite-preview-surface: #ffffff;
  --suite-preview-muted: #526178;
  --suite-glow: var(--suite-accent);
  color: var(--aris-text);
  border-color: color-mix(in srgb, var(--suite-accent) 20%, #dbe3ed);
  background-color: var(--suite-preview-canvas);
  background-image:
    radial-gradient(ellipse at 80% 0, color-mix(in srgb, var(--suite-accent) 7%, transparent), transparent 65%),
    linear-gradient(rgba(76, 94, 124, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76, 94, 124, .045) 1px, transparent 1px);
  box-shadow: 0 .55rem 1.3rem rgba(26, 38, 62, .07), inset 0 1px 0 #fff;
}

html[data-theme="light"] body #app .product-suite-stage :is(.suite-stage-bar > b, .suite-demo-response b, .suite-widget-demo > div) {
  color: var(--aris-text);
}

html[data-theme="light"] body #app .product-suite-stage :is(.suite-stage-bar > small, .suite-demo-rail > span:not(.selected), .suite-demo-tools, .suite-demo-caption, .suite-widget-input) {
  color: var(--suite-preview-muted);
}

html[data-theme="light"] body #app .product-suite-stage :is(.suite-stage-bar, .suite-demo-rail > span:not(.selected), .suite-demo-response, .suite-widget-input, .suite-site-tiles i) {
  border-color: var(--aris-line);
}

html[data-theme="light"] body #app .product-suite-stage .suite-stage-bar {
  background: var(--suite-preview-surface);
}

html[data-theme="light"] body #app .product-suite-stage .suite-stage-bar > span > i {
  background: #94a3b8;
}

html[data-theme="light"] body #app .product-suite-stage .suite-demo-rail > span:not(.selected) {
  background: var(--suite-preview-surface);
}

html[data-theme="light"] body #app .product-suite-stage .suite-demo-prompt {
  color: var(--aris-text);
  background: color-mix(in srgb, var(--suite-accent) 8%, var(--suite-preview-surface));
}

html[data-theme="light"] body #app .product-suite-stage .suite-demo-response {
  background: var(--suite-preview-surface);
}

html[data-theme="light"] body #app .product-suite-stage .suite-demo-lines > i {
  background: #ccd6e3;
}

html[data-theme="light"] body #app .product-suite-stage :is(.suite-source-nodes, .suite-access-nodes) > span {
  border-color: color-mix(in srgb, var(--suite-accent) 20%, #e1e7f0);
  color: var(--suite-accent);
  background: var(--suite-preview-surface);
}

html[data-theme="light"] body #app .product-suite-stage .suite-ai-core {
  border-color: color-mix(in srgb, var(--suite-accent) 30%, var(--suite-preview-surface));
  background: radial-gradient(circle at 45% 30%, var(--suite-preview-surface), color-mix(in srgb, var(--suite-accent) 12%, var(--suite-preview-surface)) 75%);
  box-shadow: 0 0 1.75rem rgba(118, 80, 208, .1), inset 0 0 1rem #fff;
}

html[data-theme="light"] body #app .product-suite-stage .suite-ai-core::before {
  border-color: color-mix(in srgb, var(--suite-accent) 28%, transparent);
}

html[data-theme="light"] body #app .product-suite-stage .suite-site-content {
  opacity: .85;
}

html[data-theme="light"] body #app .product-suite-stage .suite-site-tiles i {
  background: linear-gradient(135deg, color-mix(in srgb, var(--suite-accent) 5%, var(--suite-preview-surface)), var(--suite-preview-surface));
}

html[data-theme="light"] body #app .product-suite-stage .suite-widget-demo {
  border-color: color-mix(in srgb, var(--suite-accent) 20%, #dbe3ed);
  background: var(--suite-preview-surface);
  box-shadow: 0 .55rem 1.2rem rgba(43, 49, 72, .1), 0 0 1.5rem rgba(175, 51, 151, .04);
}

html[data-theme="light"] body #app .product-suite-stage .suite-widget-demo > div > span {
  background: #059669;
}

html[data-theme="light"] body #app .product-suite-stage .suite-widget-demo p {
  color: var(--aris-text);
  background: color-mix(in srgb, var(--suite-accent) 8%, var(--suite-preview-surface));
}

html[data-theme="light"] body #app .product-suite-stage .suite-widget-input i {
  color: #fff;
}

html[data-theme="light"] body #app .product-suite-stage .suite-widget-launcher {
  color: #fff;
  border-color: rgba(255, 255, 255, .9);
  background: linear-gradient(135deg, var(--suite-accent), #7650d0);
  box-shadow: 0 .25rem .75rem rgba(175, 51, 151, .18);
}
/* End light product previews. */

html[data-theme] body #app .product-suite-benefits {
  margin: 1.5rem 0;
  padding: 0;
  display: grid;
  gap: 1.15rem;
  list-style: none;
}

html[data-theme] body #app .product-suite-benefits > li {
  display: grid;
  grid-template-columns: 1.9rem minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
}

html[data-theme] body #app .product-suite-benefits > li > i {
  width: 1.9rem;
  height: 1.9rem;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--suite-accent) 12%, transparent);
  border-radius: .65rem;
  color: var(--suite-accent);
  background: color-mix(in srgb, var(--suite-accent) 6%, transparent);
  font-size: .76rem;
}

html[data-theme] body #app .product-suite-benefits b {
  display: block;
  color: var(--aris-text);
  font-size: .76rem;
  font-weight: 740;
  line-height: 1.5;
}

html[data-theme] body #app .product-suite-benefits small {
  display: block;
  margin-top: .25rem;
  color: var(--aris-muted);
  font-size: .71rem;
  line-height: 1.65;
}

html[data-theme] body #app .product-suite-foot {
  margin-top: auto;
  padding-top: 1.1rem;
  display: grid;
  gap: .85rem;
  border-top: 1px solid var(--aris-line);
  color: var(--aris-muted);
  font-size: .64rem;
  font-weight: 600;
}

html[data-theme] body #app .product-suite-foot > span {
  display: flex;
  align-items: center;
  gap: .35rem;
  line-height: 1.5;
}

html[data-theme] body #app .product-suite-foot > span > i { color: var(--suite-accent); }

html[data-theme] body #app .product-suite-foot > a {
  position: relative;
  isolation: isolate;
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  padding: .75rem .9rem;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--suite-accent) 25%, transparent);
  border-radius: .85rem;
  color: var(--suite-accent);
  background: linear-gradient(110deg, color-mix(in srgb, var(--suite-accent) 10%, transparent), color-mix(in srgb, var(--suite-accent) 3%, transparent));
  font-size: .75rem;
  font-weight: 750;
  line-height: 1.45;
  text-decoration: none;
  transition: background-color .2s ease, border-color .2s ease;
}

html[data-theme] body #app .product-suite-foot > a > i { flex-shrink: 0; }

html[data-theme] body #app .product-suite-foot > a:focus-visible {
  outline: 2px solid var(--suite-accent);
  outline-offset: 3px;
}

@media (hover: hover) {
  html[data-theme] body #app .product-suite-card {
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
  }

  html[data-theme] body #app .product-suite-card:hover {
    transform: translateY(-.25rem);
    border-color: color-mix(in srgb, var(--suite-accent) 45%, var(--aris-line));
    box-shadow: 0 1.3rem 3rem color-mix(in srgb, var(--suite-accent) 12%, transparent), inset 0 1px 0 rgba(255, 255, 255, .2);
  }

  html[data-theme] body #app .product-suite-foot > a:hover {
    border-color: var(--suite-accent);
    background-color: color-mix(in srgb, var(--suite-accent) 8%, transparent);
  }
}

@media (max-width: 70rem) {
  html[data-theme] body #app .product-suite-grid {
    width: min(100%, 38rem);
    margin-inline: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
  }

  html[data-theme] body #app .product-suite-intro { min-height: 0; }

  html[data-theme] body #app .product-suite-stage {
    width: 100%;
    max-width: 27rem;
    margin-inline: auto;
  }
}

@media (max-width: 26rem) {
  html[data-theme] body #app .product-suite-card { padding: 1.1rem; border-radius: 1.25rem; }
  html[data-theme] body #app .suite-orbit-mark { display: none; }
  html[data-theme] body #app .suite-chat-demo { gap: .4rem; padding-inline: .55rem; }
  html[data-theme] body #app .suite-knowledge-demo { gap: .5rem; padding-inline: .55rem; }
  html[data-theme] body #app .suite-stage-bar { gap: .4rem; padding-inline: .55rem; }
  html[data-theme] body #app .suite-widget-demo { width: 73%; }
}

/* Linked partner marquee. Equal groups loop without a visible reset. */
html[data-theme] body #app .landing-partners {
  --partner-gap: clamp(1.25rem, 2.5vw, 2rem);
  --partner-ink: #3e4654;
  --partner-logo-filter: grayscale(1) brightness(0) opacity(.72);
  min-width: 0;
  margin-top: 1.5rem;
  padding-block: clamp(3rem, 5vw, 5rem) 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

html[data-theme="dark"] body #app .landing-partners {
  --partner-ink: #a3a9b4;
  --partner-logo-filter: grayscale(1) brightness(0) invert(.7) opacity(.85);
}

html[data-theme] body #app .partner-heading {
  padding-inline: .75rem;
  margin-bottom: 0;
  text-align: center;
}

html[data-theme] body #app .partner-heading h2 {
  text-wrap: balance;
}

html[data-theme] body #app .partner-heading h2 span {
  display: block;
}

html[data-theme] body #app .partner-marquee {
  min-width: 0;
  margin-top: clamp(2rem, 4vw, 3rem);
  padding-block: 1rem;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}

html[data-theme] body #app .partner-track {
  display: flex;
  width: 100%;
}

html[data-theme] body #app .partner-group {
  flex: 0 0 auto;
  min-width: 0;
  padding-inline: calc(var(--partner-gap) / 2);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--partner-gap);
  animation: partner-marquee-left var(--partner-duration, 30s) linear infinite;
}

html[data-theme] body #app .partner-link {
  flex: 0 0 12.5rem;
  width: 12.5rem;
  min-width: 0;
  min-height: 5rem;
  padding: .6rem .4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--partner-ink);
  text-decoration: none;
  cursor: pointer;
}

html[data-theme] body #app .partner-link img {
  display: block;
  width: 100%;
  height: 3rem;
  object-fit: contain;
  filter: var(--partner-logo-filter);
  transition: filter .2s ease;
}

/* Preserve the contrast between an emblem's fill and its internal lettering. */
html[data-theme] body #app .partner-link.has-tonal-logo {
  --partner-logo-filter: grayscale(1) brightness(.7);
}

html[data-theme="dark"] body #app .partner-link.has-tonal-logo {
  --partner-logo-filter: grayscale(1) invert(.85);
}

/* Ignore transparent source padding without modifying the supplied artwork. */
html[data-theme] body #app .partner-logo-frame {
  position: relative;
  display: block;
  flex: 0 1 auto;
  width: min(100%, calc(3rem * var(--partner-logo-ratio)));
  aspect-ratio: var(--partner-logo-ratio);
  overflow: hidden;
}

html[data-theme] body #app .partner-logo-frame img {
  position: absolute;
  left: var(--partner-image-left);
  top: var(--partner-image-top);
  width: var(--partner-image-width);
  height: var(--partner-image-height);
  max-width: none;
}

html[data-theme] body #app .partner-link .partner-logo-dark,
html[data-theme="dark"] body #app .partner-link .partner-logo-light { display: none; }
html[data-theme="dark"] body #app .partner-link .partner-logo-dark { display: block; }

html[data-theme] body #app .partner-link.has-wordmark img {
  flex: 0 0 2.8rem;
  width: 2.8rem;
  height: 2.8rem;
}

html[data-theme] body #app .partner-link.has-wordmark > span {
  color: var(--partner-ink);
  font-size: 1.8rem;
  font-weight: 800;
  letter-spacing: -.065em;
  line-height: 1;
}

html[data-theme] body #app .partner-link:is(:hover, :focus-visible) img {
  filter: none;
}

html[data-theme] body #app .partner-link:is(:hover, :focus-visible) > span {
  color: var(--aris-text);
}

html[data-theme] body #app .partner-link:focus-visible {
  outline: 2px solid var(--aris-violet);
  outline-offset: -2px;
}

html[data-theme] body #app .partner-marquee:hover .partner-group {
  animation-play-state: paused;
}

/* Keyboard focus reveals every original link; clones never enter tab order. */
html[data-theme] body #app .partner-marquee:has(.partner-link:focus-visible) {
  mask-image: none;
  -webkit-mask-image: none;
}

html[data-theme] body #app .partner-marquee:has(.partner-link:focus-visible) .partner-group {
  width: 100%;
  min-width: 0;
  flex-wrap: wrap;
  justify-content: center;
  gap: .75rem 2rem;
  animation: none;
  transform: none;
}

html[data-theme] body #app .partner-marquee:has(.partner-link:focus-visible) .partner-group.is-copy {
  display: none;
}

@keyframes partner-marquee-left {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

@media (max-width: 42rem) {
  html[data-theme] body #app .partner-link { flex-basis: 10.5rem; width: 10.5rem; }
  html[data-theme] body #app .partner-link.has-wordmark > span { font-size: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme] body #app .partner-marquee { mask-image: none; -webkit-mask-image: none; }
  html[data-theme] body #app .partner-group {
    width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    justify-content: center;
    gap: .75rem 2rem;
    animation: none;
    transform: none;
  }
  html[data-theme] body #app .partner-group.is-copy { display: none; }
  html[data-theme] body #app .partner-link img { transition: none; }
}

html[data-theme] body #app .grounding-showcase {
  margin: 0 !important;
  padding-block: clamp(5.5rem, 8vw, 8rem) !important;
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(30rem, 1.08fr);
  align-items: center;
  gap: clamp(2.5rem, 6vw, 6rem);
  background: transparent !important;
}

html[data-theme] body #app .grounding-copy h2 {
  margin: 0;
  color: var(--aris-text);
  font-size: clamp(2.65rem, 4.8vw, 4.75rem);
  font-weight: 840;
  letter-spacing: -.055em;
  line-height: 1.02;
}

html[data-theme] body #app .grounding-copy h2 span {
  display: block;
  color: var(--landing-violet);
}

html[data-theme] body #app .grounding-copy > p {
  margin: 1.2rem 0 0;
  color: var(--aris-muted);
  font-size: .9rem;
  line-height: 1.78;
}

html[data-theme] body #app .grounding-principles {
  margin-top: 1.6rem;
  display: grid;
  gap: .7rem;
}

html[data-theme] body #app .grounding-principles article {
  padding: .85rem;
  display: grid;
  grid-template-columns: 2.35rem minmax(0, 1fr);
  gap: .75rem;
  border: 1px solid var(--aris-line);
  border-radius: 1rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .grounding-principles article > i {
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  border-radius: .78rem;
  color: var(--landing-violet);
  background: color-mix(in srgb, var(--landing-violet), transparent 90%);
}

html[data-theme] body #app .grounding-principles article > div {
  display: grid;
  gap: .18rem;
}

html[data-theme] body #app .grounding-principles b {
  color: var(--aris-text);
  font-size: .72rem;
}

html[data-theme] body #app .grounding-principles small {
  color: var(--aris-muted);
  font-size: .61rem;
  line-height: 1.55;
}

html[data-theme] body #app .grounding-guarantee {
  margin-top: .75rem;
  padding: .85rem 1rem;
  display: flex;
  align-items: center;
  gap: .7rem;
  border: 1px solid rgba(24, 168, 117, .2);
  border-radius: 1rem;
  color: #16855f;
  background: rgba(24, 168, 117, .07);
}

html[data-theme] body #app .grounding-guarantee > i {
  width: 2rem;
  height: 2rem;
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: .65rem;
  background: rgba(24, 168, 117, .1);
}

html[data-theme] body #app .grounding-guarantee span {
  display: grid;
  gap: .15rem;
}

html[data-theme] body #app .grounding-guarantee b { font-size: .67rem; }
html[data-theme] body #app .grounding-guarantee small { color: var(--aris-muted); font-size: .56rem; line-height: 1.4; }

html[data-theme] body #app .grounding-console {
  padding: 1.15rem;
  display: grid;
  gap: .7rem;
  border: 1px solid var(--aris-line-strong);
  border-radius: 1.6rem;
  background:
    radial-gradient(circle at 100% 0, rgba(139, 92, 246, .1), transparent 16rem),
    var(--aris-surface) !important;
  box-shadow: var(--aris-shadow);
}

html[data-theme] body #app .grounding-console-head {
  padding: .2rem .25rem .75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--aris-line);
  color: var(--aris-muted);
  font-size: .57rem;
}

html[data-theme] body #app .grounding-console-head span {
  display: flex;
  align-items: center;
  gap: .45rem;
  color: #16855f;
  font-weight: 820;
}

html[data-theme] body #app .grounding-console-head span i {
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: #20b67d;
  box-shadow: 0 0 0 .22rem rgba(32, 182, 125, .11);
}

html[data-theme] body #app .grounding-console-head em {
  font-style: normal;
}

html[data-theme] body #app .grounding-source-list {
  padding: .75rem;
  display: grid;
  gap: .5rem;
  border: 1px solid var(--aris-line);
  border-radius: 1rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .grounding-source-list > small,
html[data-theme] body #app .grounding-query > small {
  color: var(--aris-muted);
  font-size: .5rem;
  font-weight: 850;
  letter-spacing: .1em;
}

html[data-theme] body #app .grounding-source-list article {
  padding: .55rem;
  display: grid;
  grid-template-columns: 1.75rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .5rem;
  border-radius: .75rem;
  background: color-mix(in srgb, var(--aris-surface-raised), transparent 8%);
}

html[data-theme] body #app .grounding-source-list article > i {
  width: 1.75rem;
  height: 1.75rem;
  display: grid;
  place-items: center;
  border-radius: .55rem;
  color: var(--landing-violet);
  background: color-mix(in srgb, var(--landing-violet), transparent 90%);
}

html[data-theme] body #app .grounding-source-list article > span {
  min-width: 0;
  display: grid;
  gap: .08rem;
}

html[data-theme] body #app .grounding-source-list b { color: var(--aris-text); font-size: .59rem; }
html[data-theme] body #app .grounding-source-list article small { color: var(--aris-muted); font-size: .49rem; }
html[data-theme] body #app .grounding-source-list article em { color: #16855f; font-size: .49rem; font-style: normal; font-weight: 820; }

html[data-theme] body #app .grounding-query {
  padding: .75rem;
  display: grid;
  gap: .38rem;
  border: 1px solid var(--aris-line);
  border-radius: 1rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .grounding-query p {
  margin: 0;
  color: var(--aris-text);
  font-size: .7rem;
  font-weight: 720;
}

html[data-theme] body #app .grounding-route {
  padding-inline: .3rem;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .5rem;
  color: var(--aris-muted);
}

html[data-theme] body #app .grounding-route span {
  min-height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .38rem;
  border: 1px solid rgba(24, 168, 117, .16);
  border-radius: 999px;
  color: #16855f;
  background: rgba(24, 168, 117, .06);
  font-size: .52rem;
  font-weight: 820;
}

html[data-theme] body #app .grounding-answer {
  padding: .8rem;
  display: grid;
  gap: .6rem;
  border: 1px solid color-mix(in srgb, var(--landing-violet), transparent 78%);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--landing-violet), transparent 94%);
}

html[data-theme] body #app .grounding-answer > div {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  align-items: center;
  gap: .65rem;
}

html[data-theme] body #app .grounding-answer > div > span {
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border-radius: .65rem;
  color: #fff;
  background: linear-gradient(135deg, var(--landing-cyan), var(--landing-violet));
}

html[data-theme] body #app .grounding-answer b {
  color: var(--aris-text);
  font-size: .64rem;
  line-height: 1.5;
}

html[data-theme] body #app .grounding-answer > small {
  padding-top: .5rem;
  border-top: 1px solid var(--aris-line);
  color: var(--aris-muted);
  font-size: .5rem;
}

html[data-theme] body #app .grounding-reject {
  padding: .65rem .75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  border: 1px solid rgba(225, 82, 105, .16);
  border-radius: .85rem;
  color: var(--aris-muted);
  background: rgba(225, 82, 105, .055);
  font-size: .52rem;
}

html[data-theme] body #app .grounding-reject b {
  color: #c44e63;
  font-size: .51rem;
  text-align: right;
}

html[data-theme] body #app .landing-capability-suite .capability-grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}

html[data-theme] body #app .landing-capability-suite .capability-card {
  min-width: 0;
  min-height: 14rem;
  grid-column: auto !important;
  padding: 1.2rem !important;
  display: flex !important;
  flex-direction: column;
  border: 1px solid var(--aris-line) !important;
  border-radius: 1.25rem !important;
  background: var(--aris-surface) !important;
  box-shadow: none !important;
}

html[data-theme] body #app .landing-capability-suite .capability-card::after {
  content: none !important;
  display: none !important;
}

html[data-theme] body #app .landing-capability-suite .capability-icon {
  width: 2.65rem;
  height: 2.65rem;
  border-radius: .88rem;
  color: var(--landing-violet);
  background: color-mix(in srgb, var(--landing-violet), transparent 90%);
}

html[data-theme] body #app .landing-capability-suite .capability-badge {
  border: 0;
  color: var(--aris-muted);
  background: transparent;
  font-size: .51rem;
  letter-spacing: .1em;
}

html[data-theme] body #app .landing-capability-suite .capability-copy h3 {
  margin: 1.15rem 0 .55rem;
  color: var(--aris-text);
  font-size: .95rem;
  line-height: 1.25;
}

html[data-theme] body #app .landing-capability-suite .capability-copy p {
  margin: 0;
  color: var(--aris-muted);
  font-size: .66rem;
  line-height: 1.65;
}

html[data-theme] body #app .landing-capability-suite .capability-arrow {
  width: 1.85rem;
  height: 1.85rem;
  margin-top: auto;
  display: grid;
  place-items: center;
  border: 1px solid var(--aris-line);
  border-radius: 50%;
  color: var(--aris-muted);
  background: transparent;
  font-size: .55rem;
  transform: rotate(-35deg);
}

html[data-theme] body #app .landing-setup-section {
  margin-block: 1rem 4rem;
  padding: clamp(2rem, 4vw, 3.5rem);
  position: relative;
  overflow: hidden;
  border: 1px solid var(--aris-line-strong);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 8% 0, rgba(34, 184, 240, .1), transparent 22rem),
    radial-gradient(circle at 94% 100%, rgba(139, 92, 246, .11), transparent 24rem),
    var(--aris-surface);
  box-shadow: var(--aris-shadow);
}

html[data-theme] body #app .landing-setup-grid {
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .8rem;
}

html[data-theme] body #app .landing-setup-grid article {
  min-height: 14rem;
  padding: 1.15rem;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--aris-line);
  border-radius: 1.15rem;
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .landing-setup-grid article > span {
  position: absolute;
  top: .9rem;
  right: .95rem;
  color: color-mix(in srgb, var(--landing-violet), transparent 35%);
  font-size: .58rem;
  font-weight: 850;
  letter-spacing: .08em;
}

html[data-theme] body #app .landing-setup-grid article > i {
  width: 2.55rem;
  height: 2.55rem;
  display: grid;
  place-items: center;
  border-radius: .85rem;
  color: var(--landing-violet);
  background: color-mix(in srgb, var(--landing-violet), transparent 90%);
}

html[data-theme] body #app .landing-setup-grid h3 {
  margin: 1.15rem 0 .5rem;
  color: var(--aris-text);
  font-size: .9rem;
}

html[data-theme] body #app .landing-setup-grid p {
  margin: 0;
  color: var(--aris-muted);
  font-size: .65rem;
  line-height: 1.62;
}

html[data-theme] body #app .landing-install-bar {
  margin-top: .8rem;
  padding: .75rem;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr) max-content;
  align-items: center;
  gap: .75rem;
  border: 1px solid var(--aris-line);
  border-radius: 1rem;
  background: color-mix(in srgb, var(--aris-canvas-deep), transparent 28%);
}

html[data-theme] body #app .landing-install-bar > span {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: #16855f;
  font-size: .55rem;
  font-weight: 820;
}

html[data-theme] body #app .landing-install-bar code {
  min-width: 0;
  padding: .62rem .75rem;
  overflow: hidden;
  border: 1px solid var(--aris-line);
  border-radius: .72rem;
  color: var(--aris-text);
  background: var(--aris-field);
  font-size: .57rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-theme] body #app .landing-install-bar > a {
  display: flex;
  align-items: center;
  gap: .45rem;
  color: var(--landing-violet);
  font-size: .58rem;
  font-weight: 820;
  white-space: nowrap;
}

html[data-theme] body #app .landing-use-cases .use-case-grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

html[data-theme] body #app .landing-use-cases .assistant-card {
  min-height: 20.5rem;
  padding: 1.45rem !important;
  border: 1px solid var(--aris-line) !important;
  border-radius: 1.35rem !important;
  background: var(--aris-surface) !important;
  box-shadow: none !important;
}

html[data-theme] body #app .landing-use-cases .assistant-card::after {
  content: none !important;
  display: none !important;
}

html[data-theme] body #app .landing-use-cases .recommended {
  border-color: color-mix(in srgb, var(--landing-violet), transparent 68%) !important;
  box-shadow: inset 0 .18rem 0 var(--landing-violet) !important;
}

html[data-theme] body #app .landing-use-cases .assistant-symbol {
  width: 3rem;
  height: 3rem;
  border-radius: 1rem;
  color: var(--landing-violet);
  background: color-mix(in srgb, var(--landing-violet), transparent 90%);
}

html[data-theme] body #app .landing-use-cases .assistant-status {
  color: #16855f;
  background: rgba(24, 168, 117, .075);
}

html[data-theme] body #app .landing-use-cases .assistant-card-copy small {
  color: var(--landing-violet);
}

html[data-theme] body #app .landing-use-cases .assistant-card h3 {
  color: var(--aris-text);
  font-size: 1.25rem;
}

html[data-theme] body #app .landing-use-cases .assistant-card p {
  color: var(--aris-muted);
  font-size: .73rem;
  line-height: 1.7;
}

html[data-theme] body #app .landing-use-cases .assistant-tags span {
  border-color: var(--aris-line);
  color: var(--aris-muted);
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .landing-use-cases .assistant-link {
  color: var(--landing-violet);
}

html[data-theme] body #app .landing-pricing .plan-grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 1rem;
}

html[data-theme] body #app .landing-pricing .plan-card {
  min-height: 34rem;
  padding: 1.4rem !important;
  display: flex;
  flex-direction: column;
  border: 1px solid var(--aris-line) !important;
  border-radius: 1.45rem !important;
  background: var(--aris-surface) !important;
  box-shadow: none !important;
}

html[data-theme] body #app .landing-pricing .pro-plan {
  border-color: color-mix(in srgb, var(--landing-violet), transparent 62%) !important;
  box-shadow: inset 0 .2rem 0 var(--landing-violet), var(--aris-shadow) !important;
}

html[data-theme] body #app .landing-pricing .chatbot-marketing-plan {
  border-color: color-mix(in srgb, var(--landing-magenta), transparent 68%) !important;
  box-shadow: inset 0 .2rem 0 var(--landing-magenta) !important;
}

html[data-theme] body #app .landing-pricing .plan-card-head {
  min-height: 2.8rem;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

html[data-theme] body #app .landing-pricing .simple-plan-label {
  color: var(--aris-text);
  font-size: .75rem;
  font-weight: 850;
}

html[data-theme] body #app .landing-pricing .price {
  margin-top: .85rem;
  color: var(--aris-text);
  font-size: 2.3rem;
  letter-spacing: -.05em;
}

html[data-theme] body #app .landing-pricing .price span {
  color: var(--aris-muted);
  font-size: .68rem;
  letter-spacing: 0;
}

html[data-theme] body #app .landing-pricing .plan-card > p {
  min-height: 3.5rem;
  margin: .65rem 0 0;
  color: var(--aris-muted);
  font-size: .7rem;
  line-height: 1.65;
}

html[data-theme] body #app .landing-pricing .plan-card ul {
  margin: 1rem 0 0;
  padding: 1rem 0 0;
  display: grid;
  gap: .55rem;
  border-top: 1px solid var(--aris-line);
}

html[data-theme] body #app .landing-pricing .plan-card li {
  display: flex;
  min-height: 2.1rem;
  padding: .4rem .65rem;
  align-items: center;
  gap: .55rem;
  color: var(--aris-text);
  font-size: .66rem;
  line-height: 1.45;
}

html[data-theme] body #app .landing-pricing .plan-card li i {
  margin-top: .15rem;
  color: #18a875;
}

html[data-theme] body #app .landing-pricing .plan-context {
  margin-top: auto;
  padding: .7rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  border-radius: .8rem;
  color: var(--aris-muted);
  background: var(--aris-surface-soft);
  font-size: .54rem;
  line-height: 1.4;
}

html[data-theme] body #app .landing-pricing .plan-context i {
  color: var(--landing-violet);
}

html[data-theme] body #app .landing-pricing .plan-card > .btn {
  min-height: 2.75rem;
  margin-top: .75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
  background-clip: padding-box !important;
  border-radius: 999px !important;
  font-size: .65rem;
  font-weight: 820;
}

html[data-theme] body #app .landing-pricing .plan-card > .primary {
  color: #fff !important;
  background: linear-gradient(112deg, #22b8f0, #795ce2 58%, #a63ad7) !important;
}

html[data-theme] body #app .landing-pricing .plan-card > .secondary {
  border-color: var(--aris-line-strong) !important;
  color: var(--aris-text) !important;
  background: var(--aris-surface-soft) !important;
}

/* One clipped paint layer prevents gradient/shadow halos at pill ends. */
html[data-theme] body #app .landing-v3 :is(.hero-actions, .landing-pricing, .landing-final-cta) .btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-image: none !important;
  background-clip: padding-box !important;
  clip-path: inset(0 round 999px);
  box-shadow: none !important;
  filter: none !important;
}

html[data-theme] body #app .landing-v3 :is(.hero-actions, .landing-pricing, .landing-final-cta) .btn.primary {
  border: 0 !important;
  background-origin: border-box !important;
  background-clip: border-box !important;
}

html[data-theme] body #app .landing-v3 :is(.hero-actions, .landing-pricing, .landing-final-cta) .btn::before,
html[data-theme] body #app .landing-v3 :is(.hero-actions, .landing-pricing, .landing-final-cta) .btn::after {
  content: none !important;
  display: none !important;
}

html[data-theme] body #app .landing-v3 :is(.hero-actions, .landing-pricing, .landing-final-cta) .btn:focus-visible {
  outline: 2px solid var(--aris-text) !important;
  outline-offset: -4px;
}

html[data-theme] body #app .pricing-note {
  max-width: 43rem;
  margin: 1rem auto 0;
  padding: .8rem 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  border: 1px solid var(--aris-line);
  border-radius: 999px;
  color: var(--aris-muted);
  background: var(--aris-surface-soft);
}

html[data-theme] body #app .pricing-note > i {
  color: var(--landing-violet);
}

html[data-theme] body #app .pricing-note p {
  margin: 0;
  font-size: .6rem;
  line-height: 1.5;
}

html[data-theme] body #app .pricing-note b {
  color: var(--aris-text);
}

html[data-theme] body #app .landing-final-cta {
  margin: 0 0 clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 3.4vw, 3.25rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: 2rem;
  border: 1px solid var(--aris-line-strong);
  border-radius: 2rem;
  background:
    radial-gradient(circle at 8% 10%, rgba(34, 184, 240, .14), transparent 22rem),
    radial-gradient(circle at 94% 90%, rgba(139, 92, 246, .17), transparent 24rem),
    var(--aris-surface);
  box-shadow: var(--aris-shadow);
}

html[data-theme] body #app .landing-final-cta h2 {
  max-width: 45rem;
  margin: 0;
  color: var(--aris-text);
  font-size: clamp(2.15rem, 4vw, 3.8rem);
  letter-spacing: -.05em;
  line-height: 1.05;
}

html[data-theme] body #app .landing-final-cta p {
  max-width: 42rem;
  margin: .85rem 0 0;
  color: var(--aris-muted);
  font-size: .8rem;
  line-height: 1.65;
}

html[data-theme] body #app .landing-final-cta > div:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .65rem;
  margin-right: 4.5rem;
}

html[data-theme] body #app .landing-final-cta .btn {
  width: auto;
  min-width: 11.5rem;
}

@media (hover: hover) {
  html[data-theme] body #app :is(.landing-capability-suite .capability-card, .landing-use-cases .assistant-card) {
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  }

  html[data-theme] body #app :is(.landing-capability-suite .capability-card, .landing-use-cases .assistant-card):hover {
    transform: translateY(-.28rem);
    border-color: var(--aris-line-strong) !important;
    box-shadow: var(--aris-shadow-hover) !important;
  }
}

@media (max-width: 70rem) {
  html[data-theme] body #app .landing-hero-v2,
  html[data-theme] body #app .grounding-showcase {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .landing-hero-v2 .hero-copy {
    max-width: 52rem;
  }

  html[data-theme] body #app .grounding-console {
    width: min(100%, 46rem);
    margin-inline: auto;
  }

  html[data-theme] body #app .landing-capability-suite .capability-grid,
  html[data-theme] body #app .landing-setup-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 56rem) {
  html[data-theme] body #app .product-suite-grid,
  html[data-theme] body #app .landing-pricing .plan-grid {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .product-suite-card,
  html[data-theme] body #app .landing-pricing .plan-card {
    min-height: 0;
  }

  html[data-theme] body #app .landing-proof-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-theme] body #app .landing-proof-strip article:nth-child(2)::after {
    content: none;
  }

  html[data-theme] body #app .landing-use-cases .use-case-grid {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .landing-install-bar,
  html[data-theme] body #app .landing-final-cta {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .landing-install-bar > a {
    justify-self: start;
  }

  html[data-theme] body #app .landing-final-cta > div:last-child {
    width: min(100%, 22rem);
    margin-right: 0;
  }
}

@media (max-width: 42rem) {
  html[data-theme] body #app .landing-hero-v2 {
    min-height: 0;
    padding-block: 3.6rem 4.5rem !important;
  }

  html[data-theme] body #app .landing-hero-v2 .hero-copy h1 {
    font-size: clamp(2.75rem, 13vw, 4.2rem);
  }

  html[data-theme] body #app .landing-hero-v2 .hero-actions,
  html[data-theme] body #app .landing-hero-v2 .hero-actions .btn {
    width: 100%;
  }

  html[data-theme] body #app .landing-hero-v2 .hero-actions .btn {
    justify-content: center;
  }

  html[data-theme] body #app .landing-hero-v2 .hero-pills {
    display: grid;
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .landing-hero-v2 .hero-pills span {
    width: 100%;
  }

  html[data-theme] body #app .landing-proof-strip,
  html[data-theme] body #app .landing-capability-suite .capability-grid,
  html[data-theme] body #app .landing-setup-grid {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .landing-proof-strip article::after {
    content: none !important;
  }

  html[data-theme] body #app .landing-pricing .plan-card-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  html[data-theme] body #app .landing-pricing .free-plan .plan-card-head {
    align-items: center;
    flex-wrap: nowrap;
  }

  html[data-theme] body #app .grounding-showcase {
    grid-template-columns: minmax(0, 1fr);
  }

  html[data-theme] body #app .grounding-console {
    padding: .8rem;
    border-radius: 1.25rem;
  }

  html[data-theme] body #app .grounding-route {
    grid-template-columns: 1fr;
  }

  html[data-theme] body #app .grounding-route > i {
    transform: rotate(90deg);
    justify-self: center;
  }

  html[data-theme] body #app .grounding-reject {
    align-items: flex-start;
    flex-direction: column;
  }

  html[data-theme] body #app .grounding-reject b {
    text-align: left;
  }

  html[data-theme] body #app .landing-setup-section,
  html[data-theme] body #app .landing-final-cta {
    padding: 1.35rem;
    border-radius: 1.35rem;
  }

  html[data-theme] body #app .landing-final-cta > div:last-child {
    width: 100%;
  }

  html[data-theme] body #app .landing-install-bar code {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  html[data-theme] body #app .pricing-note {
    align-items: flex-start;
    border-radius: 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme] body #app :is(.product-suite-card, .product-suite-foot > a, .landing-capability-suite .capability-card, .landing-use-cases .assistant-card) {
    transition: none !important;
  }

  html[data-theme] body #app .product-suite-card:hover { transform: none; }
}