html[data-theme~='xai'] body:not(.mode-app) { background: #080808; }
html[data-theme~='xai'] #landing {
  --bg: #080808; --bg-2: #0c0c0c; --panel: #0f0f0f; --panel-2: #181818;
  --line: #1c1c1c; --line-2: #2a2a2a;
  --text: #fff; --text-2: #a3a3a3; --muted: #6b6b6b;
  --blue: #2563eb; --blue-hover: #1d4ed8; --blue-text: #3b82f6; --blue-soft: rgba(59, 130, 246, 0.14);
  --gold: var(--blue-text); --gold-2: #60a5fa; --gold-ink: #fff;
  --serif: 'Geist', system-ui, sans-serif; --sans: 'Geist', system-ui, sans-serif;
  --mono: 'Geist Mono', ui-monospace, monospace;
  font-family: var(--sans);
}
html[data-theme~='xai'] #landing em { font-family: inherit; font-style: normal; font-weight: inherit; color: #7c7c7c; }

html[data-theme~='xai'] .l-header { background: rgba(8, 8, 8, 0.6); }
html[data-theme~='xai'] .wordmark { letter-spacing: 0.22em; font-weight: 600; }
html[data-theme~='xai'] .wm-mark { background: #fff; box-shadow: none; }
html[data-theme~='xai'] .wm-mark::before, html[data-theme~='xai'] .wm-mark::after { background: #080808; }
html[data-theme~='xai'] .l-nav a { font-size: 14px; color: #a3a3a3; }
html[data-theme~='xai'] .l-nav a.active { background: var(--blue-soft); color: var(--blue-text); }

html[data-theme~='xai'] #landing .btn { border-radius: 999px; font-weight: 500; }
html[data-theme~='xai'] #landing .btn-primary { background: var(--blue); color: #fff; }
@media (hover: hover) { html[data-theme~='xai'] #landing .btn-primary:hover { background: var(--blue-hover); } }
html[data-theme~='xai'] #landing :focus-visible { outline-color: var(--blue-text); }
html[data-theme~='xai'] #landing .btn-ghost { background: #1a1a1a; border-color: transparent; color: #fff; }
@media (hover: hover) { html[data-theme~='xai'] #landing .btn-ghost:hover { background: #262626; } }

html[data-theme~='xai'] #landing .kicker,
html[data-theme~='xai'] .dc-n,
html[data-theme~='xai'] .price-name,
html[data-theme~='xai'] .mo-step,
html[data-theme~='xai'] .mo-side-kicker { font-family: var(--mono); font-weight: 400; letter-spacing: 0.14em; color: var(--blue-text); }
html[data-theme~='xai'] .dc-n { color: #8a8a8a; }

html[data-theme~='xai'] .hero {
  padding: 96px 0 40px;
  background:
    radial-gradient(1px 1px at 12% 22%, rgba(255, 255, 255, 0.5), transparent 60%),
    radial-gradient(1px 1px at 78% 12%, rgba(255, 255, 255, 0.4), transparent 60%),
    radial-gradient(1px 1px at 64% 38%, rgba(255, 255, 255, 0.35), transparent 60%),
    radial-gradient(1px 1px at 28% 54%, rgba(255, 255, 255, 0.3), transparent 60%),
    radial-gradient(1px 1px at 90% 48%, rgba(255, 255, 255, 0.35), transparent 60%),
    radial-gradient(1.5px 1.5px at 42% 8%, rgba(255, 255, 255, 0.55), transparent 60%),
    radial-gradient(60% 45% at 50% 0%, rgba(37, 99, 235, 0.16), transparent 70%),
    #080808;
}
html[data-theme~='xai'] .hero-in { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 56px; }
html[data-theme~='xai'] .hero-copy { max-width: 980px; }
html[data-theme~='xai'] .hero-title { font-size: clamp(46px, 6.4vw, 92px); font-weight: 500; line-height: 0.95; letter-spacing: -0.045em; }
html[data-theme~='xai'] .hero-title em { display: block; }
html[data-theme~='xai'] .hero-sub .sub-short { display: none; }
@media (max-width: 600px) {
  html[data-theme~='xai'] .hero { padding-top: 48px; }
  html[data-theme~='xai'] .hero-title { font-size: min(46px, (100vw - 32px) / 8.1); text-wrap: balance; }
  html[data-theme~='xai'] .hero-title em { display: inline; }
  html[data-theme~='xai'] .hero-sub { text-wrap: balance; }
  html[data-theme~='xai'] .hero-sub .sub-full { display: none; }
  html[data-theme~='xai'] .hero-sub .sub-short { display: inline; }
}
html[data-theme~='xai'] .hero-sub { margin-inline: auto; max-width: 620px; font-size: 18px; color: #a3a3a3; }
html[data-theme~='xai'] .hero-cta { justify-content: center; }
html[data-theme~='xai'] .hero-fine { font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
html[data-theme~='xai'] .hero-visual { width: 100%; max-width: 1000px; height: 560px; border-radius: 28px; background: radial-gradient(70% 70% at 50% 100%, #1b1b1b, #070707); border: 1px solid #1a1a1a; overflow: hidden; }
html[data-theme~='xai'] .hero-docs { margin: 40px auto 0; max-width: 760px; right: 0; }
html[data-theme~='xai'] .hero-visual { height: 648px; }
@media (max-width: 640px) { html[data-theme~='xai'] .hero-visual { height: 506px; } }

html[data-theme~='xai'] .l-section { border-top: 0; padding: 120px 0; }
html[data-theme~='xai'] .l-section--alt { background: #080808; }
html[data-theme~='xai'] .l-h2 { font-size: clamp(36px, 4.6vw, 64px); font-weight: 500; letter-spacing: -0.04em; line-height: 1; }
html[data-theme~='xai'] .l-lead { color: #8a8a8a; }

html[data-theme~='xai'] .doc-cards { gap: 14px; background: transparent; border: 0; border-radius: 0; overflow: visible; }
html[data-theme~='xai'] .doc-card { background: #0c0c0c; border: 1px solid #1a1a1a; border-radius: 24px; overflow: hidden; }
@media (hover: hover) { html[data-theme~='xai'] .doc-card:hover { background: #121212; } }
html[data-theme~='xai'] .doc-snip { background: #161616; border-bottom-color: #1a1a1a; }
html[data-theme~='xai'] .doc-snip::after { background: linear-gradient(to bottom, rgba(22, 22, 22, 0), #161616); }
html[data-theme~='xai'] .doc-card h3 { font-size: 24px; font-weight: 500; letter-spacing: -0.02em; }
html[data-theme~='xai'] .dc-preview { color: var(--blue-text); }
@media (hover: hover) { html[data-theme~='xai'] .dc-preview:hover { color: #60a5fa; } }
html[data-theme~='xai'] .compare-col--new li::before { background: var(--blue); color: #fff; }

html[data-theme~='xai'] .compare-col, html[data-theme~='xai'] .step { border-radius: 24px; background: #0c0c0c; border-color: #1a1a1a; }
html[data-theme~='xai'] .compare-col h3, html[data-theme~='xai'] .step h3 { font-weight: 500; letter-spacing: -0.02em; }
html[data-theme~='xai'] .step-n { border-color: #333; color: #fff; font-family: var(--mono); font-size: 14px; }

html[data-theme~='xai'] .price-card { border-radius: 28px; background: #0c0c0c; border-color: #1f1f1f; box-shadow: none; }
html[data-theme~='xai'] .price-amount { font-weight: 500; letter-spacing: -0.04em; }
html[data-theme~='xai'] .includes li::before { filter: none; background: #2563eb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8'%3E%3Cpath d='M1 4l2.6 2.6L9 1' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center no-repeat; }
html[data-theme~='xai'] .faq-title { font-weight: 500; letter-spacing: -0.02em; }
html[data-theme~='xai'] .faq summary::after { color: var(--blue-text); }

html[data-theme~='xai'] .mo-frame { border-radius: 28px; border-color: #1c1c1c; background: radial-gradient(90% 70% at 50% 0%, #141414, #080808 70%); }
html[data-theme~='xai'] .mo-line, html[data-theme~='xai'] .mo-end-title { font-weight: 500; letter-spacing: -0.03em; }

html[data-theme~='xai'] .mo-links path { stroke: rgba(59, 130, 246, 0.5); }
html[data-theme~='xai'] .mo-links circle { fill: var(--blue-text); }
html[data-theme~='xai'] .mo-dot.on { background: var(--blue-text); box-shadow: 0 0 0 4px var(--blue-soft); }
html[data-theme~='xai'] .mo-input.focus { border-color: var(--blue-text); box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2); }
html[data-theme~='xai'] .mo-swatches i.on { box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px var(--blue-text); }
html[data-theme~='xai'] .mo-hl { background: rgba(37, 99, 235, 0.3); box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3); }

html[data-theme~='xai'] .dlg-root { --gold: #3b82f6; --gold-2: #60a5fa; }

html[data-theme~='xai'] .hero-visual { text-align: left; }
html[data-theme~='xai'] #landing { color: var(--text); }

html[data-theme~='xai'] #landing .btn-cta { background: linear-gradient(180deg, #3b82f6, #2563eb); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 10px 28px -10px rgba(37, 99, 235, 0.75); transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), filter 0.2s var(--ease); }
@media (hover: hover) { html[data-theme~='xai'] #landing .btn-cta:hover { background: linear-gradient(180deg, #4a8df8, #2a6af0); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 16px 36px -12px rgba(37, 99, 235, 0.9); } }
html[data-theme~='xai'] #landing .btn-cta:active { transform: translateY(0); filter: brightness(0.95); }
.btn-arrow { flex: none; margin-right: -2px; transition: transform 0.2s var(--ease); }
@media (hover: hover) { .btn-cta:hover .btn-arrow { transform: translateX(3px); } }
html.film-fs, html.film-fs body { overflow: hidden; overscroll-behavior: none; }