/* Image3D public shell fallback.
   Loaded on sitemap pages after the approved V3.2 design stylesheet.
   It normalizes legacy Tailwind dark tokens without recoloring 3D canvases,
   code samples, or modal backdrops. */

html[data-design-variant="light_v32"] {
  color-scheme: light;
  --i3d-shell-bg: #f5f5f2;
  --i3d-shell-surface: #ffffff;
  --i3d-shell-soft: #f0f2f4;
  --i3d-shell-ink: #111318;
  --i3d-shell-muted: #5f6672;
  --i3d-shell-line: #d9dce2;
}

html[data-design-variant="light_v32"] body {
  background: var(--i3d-shell-bg) !important;
  color: var(--i3d-shell-ink) !important;
}

html[data-design-variant="light_v32"] body > header,
html[data-design-variant="light_v32"] body > nav,
html[data-design-variant="light_v32"] body > footer {
  color: var(--i3d-shell-ink) !important;
  border-color: var(--i3d-shell-line) !important;
  background: rgba(255, 255, 255, .96) !important;
}
html[data-design-variant="light_v32"] body > header a,
html[data-design-variant="light_v32"] body > header .brand,
html[data-design-variant="light_v32"] body > header nav a {
  color: var(--i3d-shell-ink) !important;
}
html[data-design-variant="light_v32"] body > header .brand span { color: #315ef7 !important; }
html[data-design-variant="light_v32"] body > header a.cta,
html[data-design-variant="light_v32"] body > header a.button:not(.secondary),
html[data-design-variant="light_v32"] body > header a[class*="bg-primary"],
html[data-design-variant="light_v32"] body > header a[class*="bg-blue"] { color: #fff !important; }
html[data-design-variant="light_v32"] body > nav #navCtaBtn {
  color: #fff !important;
  background: linear-gradient(135deg, #315ef7, #0b8fba) !important;
  box-shadow: 0 8px 22px rgba(49, 94, 247, .2) !important;
}

html[data-design-variant="light_v32"] body > main,
html[data-design-variant="light_v32"] body > article {
  color: var(--i3d-shell-ink);
  background-color: var(--i3d-shell-bg);
}

html[data-design-variant="light_v32"] .bg-background,
html[data-design-variant="light_v32"] .bg-surface,
html[data-design-variant="light_v32"] .bg-surface\/80,
html[data-design-variant="light_v32"] .bg-surface\/90 {
  background-color: var(--i3d-shell-bg) !important;
}

html[data-design-variant="light_v32"] .bg-surface-container,
html[data-design-variant="light_v32"] .bg-surface-container-high,
html[data-design-variant="light_v32"] .bg-surface-container-highest,
html[data-design-variant="light_v32"] .bg-surface-container-low,
html[data-design-variant="light_v32"] .bg-surface-container-lowest,
html[data-design-variant="light_v32"] .bg-surface-variant,
html[data-design-variant="light_v32"] .bg-surface-variant\/20,
html[data-design-variant="light_v32"] .bg-surface-variant\/30,
html[data-design-variant="light_v32"] .bg-white\/\[\.03\],
html[data-design-variant="light_v32"] .bg-white\/\[\.035\],
html[data-design-variant="light_v32"] .bg-white\/\[\.04\],
html[data-design-variant="light_v32"] .bg-white\/\[\.045\],
html[data-design-variant="light_v32"] .bg-white\/\[\.05\] {
  background-color: var(--i3d-shell-surface) !important;
}

html[data-design-variant="light_v32"] .border-outline,
html[data-design-variant="light_v32"] .border-outline-variant,
html[data-design-variant="light_v32"] [class*="border-surface"] {
  border-color: var(--i3d-shell-line) !important;
}

html[data-design-variant="light_v32"] .text-on-surface,
html[data-design-variant="light_v32"] .text-white:not(button):not(.button):not(.cta):not([class*="bg-primary"]):not([class*="bg-blue"]):not([class*="bg-purple"]),
html[data-design-variant="light_v32"] .text-gray-100,
html[data-design-variant="light_v32"] .text-slate-100 {
  color: var(--i3d-shell-ink) !important;
}

html[data-design-variant="light_v32"] .text-on-surface-variant,
html[data-design-variant="light_v32"] .text-gray-300,
html[data-design-variant="light_v32"] .text-gray-400,
html[data-design-variant="light_v32"] .text-slate-300,
html[data-design-variant="light_v32"] .text-slate-400,
html[data-design-variant="light_v32"] .text-slate-500 {
  color: var(--i3d-shell-muted) !important;
}

/* Functional dark surfaces are intentional, not page-theme leftovers. */
html[data-design-variant="light_v32"] model-viewer,
html[data-design-variant="light_v32"] canvas,
html[data-design-variant="light_v32"] pre,
html[data-design-variant="light_v32"] code,
html[data-design-variant="light_v32"] #viewerContainer,
html[data-design-variant="light_v32"] #modelViewer,
html[data-design-variant="light_v32"] .viewer-stage,
html[data-design-variant="light_v32"] .model-stage,
html[data-design-variant="light_v32"] .modal-backdrop {
  color-scheme: dark;
}

html[data-design-variant="light_v32"] .i3d-lang-wrap {
  color: #263247 !important;
  border-color: #cfd5df !important;
  background: #eef2f7 !important;
  box-shadow: none !important;
}
html[data-design-variant="light_v32"] .i3d-lang-wrap label { color: #526071 !important; }

html[data-design-variant="light_v32"] .i3d-lang-icon { color: #315ef7 !important; }
html[data-design-variant="light_v32"] .i3d-lang-select {
  color: #172033 !important;
  color-scheme: light !important;
  background: #ffffff !important;
}
html[data-design-variant="light_v32"] .i3d-lang-select option {
  color: #172033 !important;
  background: #ffffff !important;
}

/* Legacy editorial templates used dark typography and dark cards without a
   shared page class. Keep the whole reading surface light and high contrast. */
html[data-design-variant="light_v32"] body > main article {
  color: var(--i3d-shell-ink) !important;
  background: transparent !important;
}
html[data-design-variant="light_v32"] body > main article h1,
html[data-design-variant="light_v32"] body > main article h2,
html[data-design-variant="light_v32"] body > main article h3,
html[data-design-variant="light_v32"] body > main article h4,
html[data-design-variant="light_v32"] body > main article p,
html[data-design-variant="light_v32"] body > main article li,
html[data-design-variant="light_v32"] body > main article th,
html[data-design-variant="light_v32"] body > main article td,
html[data-design-variant="light_v32"] body > main article nav {
  color: var(--i3d-shell-ink) !important;
}
html[data-design-variant="light_v32"] body > main article strong { color: inherit !important; }
html[data-design-variant="light_v32"] body > main article > section,
html[data-design-variant="light_v32"] body > main article > div > section,
html[data-design-variant="light_v32"] body > main article + aside > div,
html[data-design-variant="light_v32"] body > main article table,
html[data-design-variant="light_v32"] body > main article [class*="answer"],
html[data-design-variant="light_v32"] body > main article [class*="card"] {
  border-color: var(--i3d-shell-line) !important;
  background-color: var(--i3d-shell-surface) !important;
  background-image: none !important;
}
html[data-design-variant="light_v32"] body > main article table {
  color: var(--i3d-shell-ink) !important;
}
html[data-design-variant="light_v32"] body > main article thead,
html[data-design-variant="light_v32"] body > main article th {
  background: var(--i3d-shell-soft) !important;
}
html[data-design-variant="light_v32"] body > main article a[class*="bg-primary"],
html[data-design-variant="light_v32"] body > main article a[class*="bg-blue"],
html[data-design-variant="light_v32"] body > main article button[class*="bg-primary"] {
  color: #fff !important;
}

html[data-design-variant="light_v32"] .pricing-truth-card {
  color: var(--i3d-shell-ink) !important;
  border: 1px solid var(--i3d-shell-line) !important;
  background: var(--i3d-shell-surface) !important;
}
html[data-design-variant="light_v32"] .pricing-truth-card small { color: #315ef7 !important; }
html[data-design-variant="light_v32"] .pricing-truth-card span { color: var(--i3d-shell-muted) !important; }

/* Privacy and Terms are older legal templates whose local --ink/--muted
   variables were authored for a dark page. Keep their reading hierarchy
   explicit instead of relying on inherited theme tokens. */
html[data-design-variant="light_v32"] .legal-container h1,
html[data-design-variant="light_v32"] .legal-container h2,
html[data-design-variant="light_v32"] .legal-container h3,
html[data-design-variant="light_v32"] .legal-container strong {
  color: var(--i3d-shell-ink) !important;
}
html[data-design-variant="light_v32"] .legal-container p,
html[data-design-variant="light_v32"] .legal-container li,
html[data-design-variant="light_v32"] .legal-container .last-updated {
  color: #4d5664 !important;
}
html[data-design-variant="light_v32"] .legal-container a { color: #1457c7 !important; }
html[data-design-variant="light_v32"] body > footer a { color: #4d5664 !important; }
html[data-design-variant="light_v32"] body > footer p { color: #4d5664 !important; }

/* Legacy editorial and answer templates used dark information panels even
   after the page shell moved to light. These are ordinary reading surfaces,
   not 3D viewports, so keep them consistent with the public light system. */
html[data-design-variant="light_v32"] main .answer-panel,
html[data-design-variant="light_v32"] main .answer-box,
html[data-design-variant="light_v32"] main .panel,
html[data-design-variant="light_v32"] main .table-wrap,
html[data-design-variant="light_v32"] main .category-board,
html[data-design-variant="light_v32"] main .case-panel,
html[data-design-variant="light_v32"] article .article-card,
html[data-design-variant="light_v32"] main .article-card,
html[data-design-variant="light_v32"] main .check-table,
html[data-design-variant="light_v32"] article figure.card,
html[data-design-variant="light_v32"] main figure.card,
html[data-design-variant="light_v32"] main .visual-side,
html[data-design-variant="light_v32"] main .i3d-photo-hero__evidence {
  background: #fff !important;
  color: var(--i3d-shell-ink) !important;
  border-color: #dce3ec !important;
  box-shadow: 0 12px 32px rgba(34, 49, 70, .07) !important;
}
html[data-design-variant="light_v32"] .i3d-blender-page main .hero-shell .article-card,
html[data-design-variant="light_v32"] body.i3d-blender-page main .hero-shell .article-card {
  background: #fff !important;
  color: var(--i3d-shell-ink) !important;
  border-color: #dce3ec !important;
}

html[data-design-variant="light_v32"] main :is(.answer-panel,.answer-box,.panel,.table-wrap,.category-board,.case-panel,.visual-side) :is(.text-white,.text-slate-100,.text-slate-200,.text-slate-300),
html[data-design-variant="light_v32"] article :is(.article-card,figure.card) :is(.text-white,.text-slate-100,.text-slate-200,.text-slate-300) {
  color: var(--i3d-shell-ink) !important;
}
html[data-design-variant="light_v32"] main :is(.article-card,.check-table) :is(.text-white,.text-slate-100,.text-slate-200,.text-slate-300) {
  color: var(--i3d-shell-ink) !important;
}

html[data-design-variant="light_v32"] main :is(.answer-panel,.answer-box,.panel,.table-wrap,.category-board,.case-panel,.visual-side) :is(.text-slate-400,.text-gray-400),
html[data-design-variant="light_v32"] article :is(.article-card,figure.card) :is(.text-slate-400,.text-gray-400) {
  color: var(--i3d-shell-muted) !important;
}
html[data-design-variant="light_v32"] main :is(.article-card,.check-table) :is(.text-slate-400,.text-gray-400) {
  color: var(--i3d-shell-muted) !important;
}

html[data-design-variant="light_v32"] main :is(.answer-panel,.answer-box,.panel,.table-wrap,.category-board,.case-panel) :is(.text-sky-300,.text-cyan-300) {
  color: #1457c7 !important;
}

html[data-design-variant="light_v32"] main :is(.answer-panel,.answer-box,.panel,.table-wrap,.category-board,.case-panel) .text-emerald-300 {
  color: #087454 !important;
}

/* Close the remaining contrast gaps in legacy dark-authored public templates.
   These selectors are page-scoped so functional dark canvases and commercial
   surfaces retain their intentional treatment. */
html[data-design-variant="light_v32"] .about-image3d-page .pill {
  color: #1457c7 !important;
  border-color: #b9d5f4 !important;
  background: #edf6ff !important;
}
html[data-design-variant="light_v32"] .about-image3d-page .soft,
html[data-design-variant="light_v32"] .about-image3d-page .muted,
html[data-design-variant="light_v32"] .about-image3d-page .faq p {
  color: #4d5664 !important;
}
html[data-design-variant="light_v32"] .about-image3d-page .secondary {
  color: #273245 !important;
  border-color: #cfd5df !important;
  background: #fff !important;
}
html[data-design-variant="light_v32"] .about-image3d-page :is(.fact,.link-card,.faq details) {
  color: var(--i3d-shell-ink) !important;
  border-color: var(--i3d-shell-line) !important;
  background: #fff !important;
}
html[data-design-variant="light_v32"] .about-image3d-page .fact dt { color: #1457c7 !important; }
html[data-design-variant="light_v32"] .about-image3d-page :is(.fact dd,.faq summary) { color: var(--i3d-shell-ink) !important; }
html[data-design-variant="light_v32"] .about-image3d-page :is(th,td) { color: #273245 !important; }

html[data-design-variant="light_v32"] .blog-index-page .guide-hero {
  border-color: var(--i3d-shell-line) !important;
  background: linear-gradient(135deg, #fff, #f4f8fb 58%, #eef8f6) !important;
}
html[data-design-variant="light_v32"] .blog-index-page .guide-kicker { color: #1457c7 !important; }
html[data-design-variant="light_v32"] .blog-index-page .column-card {
  color: var(--i3d-shell-ink) !important;
  border-color: var(--i3d-shell-line) !important;
  background: #fff !important;
  box-shadow: 0 12px 32px rgba(34, 49, 70, .07) !important;
}
html[data-design-variant="light_v32"] .blog-index-page .column-card h2 { color: var(--i3d-shell-ink) !important; }
html[data-design-variant="light_v32"] .blog-index-page .column-card > p,
html[data-design-variant="light_v32"] .blog-index-page .feed-heading p { color: #4d5664 !important; }
html[data-design-variant="light_v32"] .blog-index-page .column-links a {
  color: #334155 !important;
  border-color: #d5dbe4 !important;
  background: #eef2f6 !important;
}
html[data-design-variant="light_v32"] .blog-index-page .column-links a:hover {
  color: #111318 !important;
  border-color: #8ba5c7 !important;
  background: #e7edf4 !important;
}
html[data-design-variant="light_v32"] .blog-index-page .guide-hero a[style*="linear-gradient"] { color: #fff !important; }

html[data-design-variant="light_v32"] .gallery-page #gal3d-astro-ultra-status { color: #fff !important; }
html[data-design-variant="light_v32"] .gallery-page #gal3d-astro-ultra-load {
  color: #111827 !important;
  border: 1px solid #d79a08 !important;
  background: #fbbf24 !important;
}

html[data-design-variant="light_v32"] body.showcase-page .btn-gradient.text-white:not(button):not(.button):not(.cta):not([class*="bg-primary"]):not([class*="bg-blue"]):not([class*="bg-purple"]) { color: #fff !important; }
html[data-design-variant="light_v32"] body.showcase-page .card-glow > .p-5 .text-white:not(button):not(.button):not(.cta):not([class*="bg-primary"]):not([class*="bg-blue"]):not([class*="bg-purple"]) { color: #f8fafc !important; }
html[data-design-variant="light_v32"] .showcase-page .card-glow > .p-5 .text-gray-400 { color: #b8c2cf !important; }
html[data-design-variant="light_v32"] .showcase-page #showcaseUploadTitle { color: #111318 !important; }

/* Model canvases, embedded renderers and modal backdrops intentionally keep
   their dark functional surface; the selectors above do not target them. */