/* Website preferences are independent of the signed-in console preferences. */
html[data-website-theme] { background: var(--ob-canvas, #f6f7fa); color-scheme: light; }
html[data-website-theme='dark'] {
  color-scheme: dark;
  --ob-canvas: #0f1014; --ob-surface: #191a20; --ob-panel: #212229;
  --ob-border: #303139; --ob-separator: #27282f; --ob-line: #42444f;
  --ob-ink: #f3f3f6; --ob-secondary: #c4c5ce; --ob-muted: #a1a3b1; --ob-quiet: #9295a5;
  --ob-detail: #797d8e; --ob-connector: #666a7a; --ob-grid: #26272f; --ob-shadow: #000000;
  --ob-border-rgb: 48,49,57; --ob-ink-rgb: 243,243,246; --ob-muted-rgb: 161,163,177; --ob-shadow-rgb: 0,0,0;
  --ob-brand: #9b83ff; --ob-accent: #ad99ff; --ob-accent-hover: #c5b7ff;
  --ob-accent-soft: #262235; --ob-accent-subtle: #1c1a25; --ob-accent-border: #483d68;
  --ob-accent-mid: #7865af; --ob-accent-muted: #332b48; --ob-accent-decoration: #7865af;
  --ob-accent-rgb: 173,153,255; --ob-accent-mid-rgb: 120,101,175;
  --ob-action: #6d4ee8; --ob-action-hover: #795bf0; --ob-on-accent: #ffffff;
  --ob-success: #8ecfa9; --ob-success-soft: #192b22; --ob-success-border: #355442;
  --ob-warning: #e9c17c; --ob-warning-soft: #30281a; --ob-warning-border: #5e4c2d;
  --ob-danger: #f2a4b2; --ob-danger-soft: #321f26; --ob-danger-border: #663844;
  --ob-info: #a8c2f1; --ob-info-soft: #202a3a; --ob-info-border: #3d5272;
  --ob-site-section: #14151a;
}

/* Large page surfaces stay neutral so the product and actions carry the color. */
html[data-website-theme='dark'] .mp-site :is(.mh-bold, .mp-page-sections, .mp-product-section) {
  background: var(--ob-canvas);
}
html[data-website-theme='dark'] .mp-site :is(.mp-channel-strip, .muc-section, .mp-pricing, .mt-control-section) {
  background: var(--ob-site-section);
  border-color: var(--ob-separator);
}
html[data-website-theme='dark'] .mp-site .mp-header {
  background: color-mix(in srgb, var(--ob-canvas) 94%, transparent);
  border-color: var(--ob-separator);
}
html[data-website-theme='dark'] .mp-site .mh-bold::before { opacity: .45; }
html[data-website-theme='dark'] .mp-site :is(.mh-bold-window, .mp-demo-frame, .mcc-story, .mcs-workspace, .mt-board) {
  box-shadow: 0 24px 64px rgba(0,0,0,.2);
}
html[data-website-theme='dark'] .mp-site :is(.mh-arrival, .mh-bold-handoff) {
  background: var(--ob-surface);
  border-color: var(--ob-border);
}
html[data-website-theme='dark'] .mp-site :is(.mh-bold-window-heading, .mh-bold-compose) {
  background: var(--ob-surface);
}
html[data-website-theme='dark'] .mp-site .mh-bold-message-body { background: var(--ob-panel); }
html[data-website-theme='dark'] .mp-site .mh-bold-bubble.is-incoming {
  background: var(--ob-surface);
  border-color: var(--ob-border);
  color: var(--ob-ink);
}

/* Active controls use a quiet tint; solid buttons keep OmniBox's purple. */
html[data-website-theme='dark'] .mp-site .mp-console-link { border-color: var(--ob-action); }
html[data-website-theme='dark'] .mp-site .mp-demo-switch>button.is-active {
  background: var(--ob-accent-soft);
  border-color: var(--ob-accent-border);
}
html[data-website-theme='dark'] .mp-site .mp-price-workspace {
  border-color: var(--ob-accent-border);
  background: linear-gradient(150deg, var(--ob-accent-subtle), var(--ob-surface) 46%);
  box-shadow: inset 0 2px var(--ob-action);
}
html[data-website-theme='dark'] .mp-site .mp-price-workspace>.mp-plan-button { border-color: var(--ob-action); }
html[data-website-theme='dark'] .mp-site .mp-final-cta {
  background: linear-gradient(115deg, #3a2a78, #241c48 62%, #1c1734);
  border: 1px solid var(--ob-accent-border);
}
html[data-website-theme='dark'] .mp-site .mp-final-actions>.mp-button {
  background: #f3efff;
  color: #3b1f8c!important;
  border-color: #f3efff;
  box-shadow: none;
}
html[data-website-theme='dark'] .mp-site .mp-final-actions>.mp-button:hover { background: #ffffff; }
html[data-website-theme='dark'] .mp-site .mp-closing-light {
  background: radial-gradient(ellipse at 30% 35%,rgba(255,255,255,.04),transparent 40%), radial-gradient(ellipse at 80% 80%,rgba(255,255,255,.025),transparent 40%);
}
html[data-website-theme='dark'] .mp-site :is(.mf-scene-card, .mf-scene-pause) { box-shadow: 0 8px 20px rgba(0,0,0,.16); }
html[data-website-theme='dark'] .mp-site .mp-hero-backdrop-tile { box-shadow: 0 3px 12px rgba(0,0,0,.12); }


/* Policy and help pages keep a readable page width and reachable links on phones.
   These selectors never apply to the console or the animated marketing site. */
.ob-public-page :is(main, .shell, .header, .hero, .card, .contact-strip, .details,
  .contact, .contact-action, .follow-up) { min-width: 0; }
.ob-public-page :is(h1, h2, h3, p, li, address, .label, .contact-owner) { overflow-wrap: anywhere; }
.ob-public-page :is(nav a, footer a, .brand) { min-height: 44px; }
.ob-public-page nav a { display: inline-flex; align-items: center; }
.ob-public-page .brand img { flex-shrink: 0; }
.ob-public-page :is(.contact-action a, .contact-email, .contact-phone) { max-width: 100%; }

@media (max-width: 700px) {
  .ob-public-page { padding-bottom: env(safe-area-inset-bottom); }
  .ob-public-page.ob-public-document > main {
    margin: 0;
    padding: 24px max(20px, env(safe-area-inset-left)) 32px;
    border: 0;
    border-radius: 0;
    min-height: 100svh;
  }
  .ob-public-page.ob-public-hub .shell {
    padding: 24px max(20px, env(safe-area-inset-left)) 32px;
  }
  .ob-public-page .header { gap: 18px; padding-bottom: 22px; }
  .ob-public-page nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    width: 100%;
    gap: 8px;
    margin-block: 20px 28px;
  }
  .ob-public-page .header nav { margin-block: 0; }
  .ob-public-page nav a {
    min-width: 0;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid #e1e4ed;
    border-radius: 10px;
    background: #fff;
    line-height: 1.5;
    text-decoration: none;
  }
  .ob-public-page nav a[aria-current] {
    background: #f2edff;
    border-color: #ded5fa;
    color: #6040d0;
  }
  .ob-public-page h1 { line-height: 1.2; letter-spacing: -.8px; }
  .ob-public-page .hero { padding-block: 28px; }
  .ob-public-page :is(.callout, .notice, .contact-strip, .card, .details, .contact) {
    padding: 20px;
    border-radius: 14px;
  }
  .ob-public-page .section { margin-top: 32px; }
  .ob-public-page :is(ul, ol) { padding-inline-start: 22px; }
  .ob-public-page li { padding-inline-start: 2px; }
  .ob-public-page footer { line-height: 1.7; }
  .ob-public-page footer > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; width: 100%; }
  .ob-public-page footer a { display: inline-flex; align-items: center; }
  .ob-public-page .button { min-height: 48px; }
}

@media (max-width: 370px) {
  .ob-public-page.ob-public-document > main,
  .ob-public-page.ob-public-hub .shell { padding-inline: max(16px, env(safe-area-inset-left)); }
  .ob-public-page :is(.callout, .notice, .contact-strip, .card, .details, .contact) { padding: 18px; }
  .ob-public-page nav a { padding-inline: 10px; }
}