:root[data-theme="light"] {
  color-scheme: light;
  --public-page: #edf0f3;
  --public-paper: #ffffff;
  --public-surface: #e2e7ec;
  --public-surface-strong: #d4dbe2;
  --public-cool-soft: #e8edf2;
  --public-cool-muted: #f0f2f4;
  --public-warm: #f5f1ec;
  --public-warm-strong: #e9e1d8;
  --public-ink: #111827;
  --public-ink-soft: #334155;
  --public-muted: #4b5563;
  --public-line: #b9c2cc;
  --public-cool: #4b6478;
  --public-cool-dark: #253746;
  --public-on-dark-accent: #d7e0e7;
  --public-warm-accent: #8a674d;
  --public-action-gradient: linear-gradient(#253746, #253746);
  --public-action-gradient-hover: linear-gradient(#34495e, #34495e);
  --public-success: #356b91;
  --paper: var(--public-paper);
  --surface: var(--public-page);
  --surface-strong: var(--public-surface);
  --line: var(--public-line);
  --ink: var(--public-ink);
  --ink-soft: var(--public-ink-soft);
  --muted: var(--public-muted);
  --teal: var(--public-cool);
  --teal-dark: var(--public-cool-dark);
  --success-accent: var(--public-success);
  --amber: var(--public-warm-accent);
}

/* Public pages use a fixed light canvas. Dark is reserved for navigation,
   media overlays, the footer and live browser surfaces. */
:root[data-theme="light"] body {
  color: var(--public-ink);
  background: var(--public-page);
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) main {
  color: var(--public-ink);
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) :is(input, select, textarea) {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) :is(input, select, textarea):focus {
  border-color: var(--public-cool);
  box-shadow: 0 0 0 3px rgb(53 107 145 / 14%);
}

:root[data-theme="light"] .auth-password-field input:focus {
  box-shadow: none;
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) :is(.button-primary, .home-button-primary) {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: var(--public-cool-dark);
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) :is(.button-primary, .home-button-primary):hover {
  color: #fff;
  background-color: var(--public-cool);
  background-image: var(--public-action-gradient-hover);
  border-color: #536a7d;
}

/* Homepage */
:root[data-theme="light"] .home-canvas:not(.about-canvas) {
  --home-paper: var(--public-page);
  --home-white: var(--public-paper);
  --home-ink: var(--public-ink);
  --home-line: var(--public-line);
  --home-accent: var(--public-cool);
  --home-accent-dark: var(--public-cool-dark);
  --home-accent-soft: var(--public-on-dark-accent);
  --home-coral: var(--public-warm-accent);
  background: var(--public-page);
}

:root[data-theme="light"] .home-canvas:not(.about-canvas) .home-kicker {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-proof {
  color: var(--public-ink);
  background: var(--public-surface);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-proof > div {
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-proof strong {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] .home-canvas .home-proof span {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-hero-slide {
  opacity: 1;
}

:root[data-theme="light"] .home-canvas .home-hero {
  color: var(--public-ink);
  background: var(--public-cool-muted);
}

:root[data-theme="light"] .home-canvas .home-hero-arrow {
  color: var(--public-cool-dark);
  background: rgb(255 255 255 / 92%);
  border-color: #b7cbdc;
  box-shadow: 0 8px 24px rgb(45 61 80 / 12%);
}

:root[data-theme="light"] .home-canvas .home-hero-arrow:hover {
  color: #fff;
  background: var(--public-cool);
  border-color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-hero-switcher button i {
  background: #aebdca;
}

:root[data-theme="light"] .home-canvas .home-hero-switcher button.is-active i {
  background: #d5e2ec;
}

:root[data-theme="light"] .home-canvas .home-hero-slide:not(.is-active) .home-hero-visual {
  opacity: 0.82;
}

:root[data-theme="light"] .home-canvas .home-hero-slide :is(h2, h3) {
  color: #fff;
}

:root[data-theme="light"] .home-canvas .home-hero-slide p {
  color: rgb(255 255 255 / 84%);
}

:root[data-theme="light"] .home-canvas .home-hero-slide.is-active {
  border-color: #78a7c7;
}

:root[data-theme="light"] .home-canvas :is(
  .home-media-card span,
  .home-infra-visual span,
  .home-hero-copy .home-kicker
) {
  color: var(--public-on-dark-accent);
}

:root[data-theme="light"] .home-canvas .home-media-card h3 {
  color: #fff;
}

:root[data-theme="light"] .home-canvas .home-media-card p {
  color: rgb(255 255 255 / 84%);
}

:root[data-theme="light"] .home-canvas :is(
  .home-capability-section,
  .home-infra-section,
  .home-difference-section
) {
  color: var(--public-ink);
  background: var(--public-paper);
}

:root[data-theme="light"] .home-canvas .home-flow-section {
  grid-template-columns: minmax(0, 0.68fr) minmax(0, 1.32fr);
  width: 100%;
  min-width: 0;
  color: var(--public-ink);
  background: var(--public-surface);
  overflow: hidden;
}

:root[data-theme="light"] .home-canvas :is(
  .home-flow-copy,
  .home-flow-board,
  .home-flow-board ol,
  .home-flow-board li,
  .home-flow-board li div
) {
  min-width: 0;
}

:root[data-theme="light"] .home-canvas :is(
  .home-flow-copy h2,
  .home-flow-copy p,
  .home-flow-board strong,
  .home-flow-board small
) {
  max-width: 100%;
  overflow-wrap: break-word;
}

:root[data-theme="light"] .home-canvas .home-flow-copy > p:last-child,
:root[data-theme="light"] .home-canvas .home-section-head-light > p,
:root[data-theme="light"] .home-canvas .home-section-head-dark > p {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-flow-board li {
  color: var(--public-muted);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-flow-board li.is-active {
  color: var(--public-ink);
  background: rgb(255 255 255 / 66%);
  box-shadow: inset 3px 0 0 var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-flow-board li > span {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-flow-line {
  background: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-flow-line span {
  background: linear-gradient(90deg, var(--public-cool-dark), #78a7c7);
}

:root[data-theme="light"] .home-canvas :is(.home-agents-section, .home-scenarios-section) {
  color: var(--public-ink);
  background: var(--public-page);
}

:root[data-theme="light"] .home-canvas :is(
  .home-agents-section,
  .home-scenarios-section
) .home-kicker {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-agent-stage {
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article {
  color: var(--public-ink);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(1) {
  background: var(--public-cool-soft);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(2) {
  background: var(--public-cool-muted);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(3) {
  background: var(--public-paper);
}

:root[data-theme="light"] .home-canvas .home-agent-number {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-agent-role {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(2) .home-agent-role {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article > p:not(.home-agent-role) {
  color: var(--public-ink-soft);
}

:root[data-theme="light"] .home-canvas .home-agent-stage li {
  color: var(--public-ink-soft);
  border-color: #b9c7d5;
  background: rgb(255 255 255 / 58%);
}

:root[data-theme="light"] .home-canvas .home-infra-status {
  color: var(--public-ink);
  background: var(--public-surface);
}

:root[data-theme="light"] .home-canvas .home-infra-control {
  color: var(--public-ink);
  background: var(--public-paper);
  border: 1px solid var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-infra-network {
  color: var(--public-ink);
  background: var(--public-cool-muted);
  border: 1px solid var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-infra-status dl {
  background: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-infra-status dl div {
  background: var(--public-paper);
}

:root[data-theme="light"] .home-canvas .home-infra-status dt {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-control-row span {
  color: var(--public-cool-dark);
  background: #f7fbff;
  border-color: #aebfd0;
}

:root[data-theme="light"] .home-canvas .home-scenarios-section {
  background: var(--public-surface);
}

:root[data-theme="light"] .home-canvas .home-scenario-mosaic article {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-scenario-mosaic article span {
  color: var(--public-on-dark-accent);
}

:root[data-theme="light"] .home-canvas .home-scenario-mosaic h3 {
  color: #fff;
}

:root[data-theme="light"] .home-canvas .home-scenario-mosaic p {
  color: rgb(255 255 255 / 84%);
}

:root[data-theme="light"] .home-canvas .home-scenario-feature,
:root[data-theme="light"] .home-canvas .home-scenario-feature p {
  color: #fff;
}

:root[data-theme="light"] .home-canvas .home-contact-section {
  color: var(--public-ink);
  background: var(--public-page);
}

:root[data-theme="light"] .home-canvas .home-contact-copy .home-kicker {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas .home-contact-copy > p {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-trust-strip {
  color: var(--public-ink);
  background: var(--public-cool-soft);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-trust-strip span + span {
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas :is(
  .home-roadmap-journey li > span,
  .home-roadmap-grid span
) {
  color: var(--public-cool);
}

:root[data-theme="light"] .home-canvas :is(
  .home-roadmap-journey small,
  .home-compare span
) {
  color: var(--public-muted);
}

:root[data-theme="light"] .home-canvas .home-lead-form {
  border: 1px solid var(--public-line);
  box-shadow: 0 18px 50px rgb(58 73 94 / 10%);
}

/* About Vecto */
:root[data-theme="light"] .about-canvas {
  --about-paper: var(--public-page);
  --about-panel: var(--public-surface);
  --about-line: var(--public-line);
  --about-ink: var(--public-ink);
  --about-muted: var(--public-muted);
  --about-mint: var(--public-cool);
  color: var(--public-ink);
  background: var(--public-page);
}

:root[data-theme="light"] .about-canvas :is(
  .about-positioning,
  .about-agents,
  .about-roadmap,
  .about-advantages
) {
  background: var(--public-paper);
}

:root[data-theme="light"] .about-canvas :is(
  .about-loop,
  .about-operation-scenes,
  .about-services
) {
  background: var(--public-page);
}

:root[data-theme="light"] .about-canvas .about-capabilities {
  color: var(--public-ink);
  background: var(--public-surface);
}

:root[data-theme="light"] .about-canvas .about-architecture {
  color: #f8fafc;
  background: #30353a;
}

:root[data-theme="light"] .about-canvas .about-proof {
  color: var(--public-ink);
  background:
    linear-gradient(rgb(226 231 236 / 88%), rgb(237 240 243 / 94%)),
    url("/assets/opc/vecto-ai-cockpit.png") center / cover;
}

:root[data-theme="light"] .about-canvas .about-section-head-light h2 {
  color: var(--public-ink);
}

:root[data-theme="light"] .about-canvas .about-section-head-light > p:last-child {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas :is(.about-module-grid, .about-roadmap-groups, .about-service-grid) {
  border-color: var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-module-grid article {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-module-grid article:nth-child(2n) {
  background: #f5f9fd;
}

:root[data-theme="light"] .about-canvas .about-module-grid p {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas .about-module-grid li {
  color: var(--public-ink-soft);
  background: var(--public-surface);
  border-color: #bcc9d6;
}

:root[data-theme="light"] .about-canvas .about-engine-grid article {
  color: var(--public-ink);
  background: var(--public-surface);
  border-color: var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-engine-grid article:nth-child(2) {
  background: var(--public-cool-muted);
}

:root[data-theme="light"] .about-canvas .about-engine-grid p {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas .about-architecture-flow {
  background: #252a2f;
  border-color: #59616a;
}

:root[data-theme="light"] .about-canvas .about-architecture-flow span {
  color: #f8fafc;
}

:root[data-theme="light"] .about-canvas .about-architecture-flow i {
  color: #c7d0d8;
}

:root[data-theme="light"] .about-canvas .about-value-strip {
  background: var(--public-surface);
  border: 1px solid var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-value-strip div {
  color: var(--public-ink);
  border-color: var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-value-strip span {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas .about-case-grid figure {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] .about-canvas .about-case-grid figcaption span {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas .about-index span {
  color: var(--public-cool);
}

:root[data-theme="light"] .about-canvas :is(
  .about-hero .about-kicker,
  .about-cta .about-kicker,
  .about-scene-grid span
) {
  color: var(--public-on-dark-accent);
}

:root[data-theme="light"] .about-canvas :is(
  .about-kicker,
  .about-facts dt,
  .about-loop-track span,
  .about-agent-list > article > span,
  .about-module-grid span,
  .about-engine-grid span,
  .about-roadmap-groups span,
  .about-service-grid span,
  .about-advantage-list li > span
) {
  color: var(--public-cool);
}

/* Subscription */
:root[data-theme="light"] body[data-login-redirect="/subscription.html"] {
  color: var(--public-ink);
  background: var(--public-page);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-page-hero .eyebrow {
  color: var(--public-on-dark-accent);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-public-section {
  color: var(--public-ink);
  background: transparent;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-packages-band {
  color: var(--public-ink);
  background: #f4f7f9;
  border-block: 1px solid #c7d1da;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] #plans {
  margin-block: clamp(28px, 4vw, 48px);
  padding-inline: clamp(16px, 2vw, 24px);
  background: #f8fafb;
  border: 1px solid #b8c5d0;
  box-shadow: 0 14px 34px rgb(37 55 70 / 6%);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-band {
  color: var(--public-ink);
  background: #e8edf2;
  border-block: 1px solid #bdc9d3;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-public-heading .eyebrow {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  align-items: center;
  padding: 4px 10px;
  color: var(--public-cool-dark);
  background: #dfe8ef;
  border: 1px solid #bac9d5;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-packages-band .eyebrow {
  background: #e8f0f5;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-band .eyebrow {
  background: #f7f9fb;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-package-card {
  border-color: #b9c6d1;
  box-shadow: 0 8px 20px rgb(37 55 70 / 5%);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-card {
  color: var(--public-ink);
  background: #f8fafb;
  border-color: #aebdca;
  box-shadow: 0 12px 28px rgb(37 55 70 / 8%);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-card :is(
  h3,
  .pricing-subscription-price,
  .pricing-subscription-price small,
  .pricing-subscription-features li
) {
  color: var(--public-ink);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-card .pricing-label {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-main {
  border-color: var(--public-line);
  background: #dfe7ed;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-details {
  background: #f8fafb;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-price small,
:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-subscription-features li {
  color: var(--public-ink-soft);
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-band {
  color: var(--public-ink);
  background: linear-gradient(180deg, #dfe6ec 0%, #edf1f4 100%);
  border-block: 1px solid #b7c3ce;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-heading .eyebrow,
:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-index {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-heading .eyebrow {
  background: #f8fafb;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] :is(
  .pricing-comparison-heading > p,
  .pricing-comparison-note,
  .pricing-tier-overview p
) {
  color: var(--public-muted);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview {
  background: transparent;
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article:nth-child(2) {
  background: #d8e3eb;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article:nth-child(3) {
  background: #edf2f6;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article:hover {
  background: #f5f7f9;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-scroll {
  scrollbar-color: #9aabbc var(--public-surface);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table {
  color: var(--public-ink-soft);
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table :is(th, td) {
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table thead th {
  color: var(--public-ink);
  background: var(--public-surface-strong);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table thead th small {
  color: var(--public-muted);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table tbody th[scope="rowgroup"] {
  color: var(--public-cool-dark);
  background: #edf4fa;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table tbody th[scope="row"] {
  color: var(--public-ink);
  background: #fafbfd;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table tbody tr:hover > * {
  background-color: var(--public-cool-soft);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-table td strong {
  color: var(--public-ink);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .tier-yes {
  color: #fff;
  background: var(--public-success);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .tier-no {
  color: var(--public-muted);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list {
  gap: 10px;
  border-top: 0;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list li,
:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list li + li {
  padding: 16px;
  background: rgb(255 255 255 / 78%);
  border: 1px solid #bcc9d3;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list > li > span {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] #usage {
  margin-block: clamp(20px, 3vw, 32px);
  padding: clamp(28px, 3vw, 40px) clamp(14px, 1.8vw, 20px);
  background: #f6f8fa;
  border: 1px solid #c0cad3;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] #usage .eyebrow {
  background: #e7edf2;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-action-table {
  padding-inline: clamp(10px, 1.4vw, 16px);
  background: #fff;
  border: 1px solid #b9c5cf;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-action-row:nth-child(even) {
  background: #f4f7f9;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] #rules {
  margin-bottom: clamp(38px, 5vw, 64px);
  padding-inline: clamp(16px, 2vw, 24px);
  background: #e4eaf0;
  border: 1px solid #b6c3ce;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] #rules .eyebrow {
  background: #f8fafb;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid article {
  background: #f9fafb;
  border-color: #b9c5cf;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid article:nth-child(2) {
  background: #eef3f6;
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid article:nth-child(3) {
  background: #dfe7ed;
}

/* Console, profile and admin stay light and share the same restrained accents. */
:root[data-theme="light"] .console-page {
  --bg: var(--public-page);
  --bg-glow: var(--public-page);
  --bg-deep: #e8edf3;
  --ink: var(--public-ink);
  --muted: var(--public-muted);
  --line: var(--public-line);
  --panel: rgb(255 255 255 / 96%);
  --panel-solid: var(--public-paper);
  --panel-2: var(--public-surface);
  --soft: #f8fafc;
  --accent: var(--public-cool);
  --accent-dark: var(--public-cool-dark);
  --accent-2: var(--public-warm-accent);
  --accent-ink: #fff;
  --chip-bg: #e8f0f7;
  --chip-ink: var(--public-cool-dark);
  --hover-border: #8eabc2;
  --hover-shadow: inset 0 0 0 1px rgb(53 107 145 / 12%), 0 0 0 3px rgb(53 107 145 / 8%);
  --active-shadow: inset 0 0 0 2px rgb(53 107 145 / 18%);
  --panel-shadow: 0 10px 30px rgb(49 65 85 / 6%);
  --vecto-action-border: #34495e;
  --vecto-action-static-gradient: var(--public-action-gradient);
  --vecto-action-running-gradient: var(--public-action-gradient);
}

:root[data-theme="light"] .console-page :is(.console-shell, .console-modal) :is(
  button.primary:not(.danger),
  .chip-button.primary:not(.danger),
  button[data-persona-run-threads],
  button[data-account-pool-run-threads],
  button[data-persona-regenerate-profile-content],
  button[data-browser-recommendation-refresh]
) {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: var(--vecto-action-border);
}

:root[data-theme="light"] .console-page :is(
  .console-sidebar,
  .console-topbar,
  .panel,
  .card,
  .persona-dashboard-main,
  .persona-sidebar-panel,
  .console-modal
) {
  color: var(--public-ink);
}

:root[data-theme="light"] .console-page :is(
  input:not([type="checkbox"]):not([type="radio"]),
  textarea,
  select
) {
  color: var(--public-ink);
  background-color: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] .console-page :is(
  input:not([type="checkbox"]):not([type="radio"]),
  textarea,
  select
):focus {
  border-color: var(--public-cool);
  box-shadow: 0 0 0 3px rgb(53 107 145 / 12%);
}

:root[data-theme="light"] .console-page :is(
  .publish-mode-tabs,
  .persona-group-tabs,
  .persona-subflow-tabs,
  .persona-draft-view-toggle,
  .persona-compose-toggle,
  .persona-source-toggle,
  .account-browser-tabs,
  .automation-capsule-tabs
) {
  background: var(--public-surface);
  border-color: var(--public-line);
}

:root[data-theme="light"] .console-page :is(
  .publish-mode-tabs,
  .persona-group-tabs,
  .persona-subflow-tabs,
  .persona-draft-view-toggle,
  .persona-compose-toggle,
  .persona-source-toggle,
  .account-browser-tabs,
  .account-pool-platforms,
  .automation-capsule-tabs
) button {
  min-width: 0;
  height: auto;
  min-height: 34px;
  line-height: 1.25;
  white-space: normal;
  overflow-wrap: break-word;
}

:root[data-theme="light"] .console-page .persona-content-tabs.persona-publish-content-tabs {
  border: 1px solid var(--public-line);
  border-radius: 8px;
  background: var(--public-paper);
}

:root[data-theme="light"] .console-page .persona-content-tabs.persona-publish-content-tabs button {
  border-color: transparent;
  border-radius: 6px;
  background: transparent;
  color: var(--public-ink);
  box-shadow: none;
}

:root[data-theme="light"] .console-page .shared-underline-tabs > button.is-active {
  border-color: transparent;
  background: transparent;
  background-image: none;
  color: #243b53;
  font-weight: 900;
  box-shadow: none;
}

:root[data-theme="light"] .console-page .mobile-task-dock-button.is-active {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: var(--vecto-action-border);
}

:root[data-theme="light"] .page-admin {
  --admin-ink: var(--public-ink);
  --admin-ink-soft: var(--public-ink-soft);
  --admin-muted: var(--public-muted);
  --admin-paper: #f8fafb;
  --admin-surface: #e3e8ec;
  --admin-line: #aeb8c1;
  --admin-teal: var(--public-cool);
  --admin-teal-dark: var(--public-cool-dark);
  --admin-success-accent: var(--public-success);
  --admin-coral: #d94c45;
  background: #dfe4e8;
}

:root[data-theme="light"] .page-admin .sidebar {
  color: #dbe3e9;
  background: #121a21;
  border-color: #2b3741;
  scrollbar-color: #667786 transparent;
}

:root[data-theme="light"] .page-admin :is(.brand, .admin-rail-note) {
  color: #eef3f6;
  background: #1a242d;
  border-color: #35424d;
}

:root[data-theme="light"] .page-admin :is(.brand p, .sidebar .small) {
  color: #aebbc5;
}

:root[data-theme="light"] .page-admin :is(.admin-brand-eyebrow, .section-kicker) {
  color: #b9cad7;
}

:root[data-theme="light"] .page-admin .admin-nav button {
  color: #b9c4cc;
}

:root[data-theme="light"] .page-admin .admin-nav button:hover {
  color: #fff;
  background: #25313b;
  border-color: #3a4854;
}

:root[data-theme="light"] .page-admin .admin-nav button.is-active {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: #587084;
}

:root[data-theme="light"] .page-admin .admin-nav button.is-active::before {
  display: none;
}

:root[data-theme="light"] .page-admin :is(button.primary, .btn.primary),
:root[data-theme="light"] body.profile-page .profile-save,
:root[data-theme="light"] body.page-auth-shell .auth-submit-row button[type="submit"] {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: var(--public-cool-dark);
}

:root[data-theme="light"] .page-admin :is(button.primary, .btn.primary):hover,
:root[data-theme="light"] body.profile-page .profile-save:hover,
:root[data-theme="light"] body.page-auth-shell .auth-submit-row button[type="submit"]:hover {
  color: #fff;
  background-image: var(--public-action-gradient-hover);
  border-color: var(--public-cool-dark);
}

:root[data-theme="light"] .page-admin .admin-page-title {
  color: var(--public-ink);
  background: linear-gradient(90deg, #f8fafb 0 58%, #dce3e8 58% 84%, #c6cdd2 84% 100%);
  border-color: var(--public-line);
}

:root[data-theme="light"] .page-admin .admin-page-title::before {
  background: transparent;
}

:root[data-theme="light"] .page-admin .admin-page-title :is(h2, .overview-value) {
  color: var(--public-ink);
}

:root[data-theme="light"] .page-admin .admin-page-title :is(.meta, .overview-label) {
  color: var(--public-muted);
}

:root[data-theme="light"] .page-admin .admin-page-title :is(.overview-pod, .admin-top-actions .ghost) {
  color: var(--public-ink);
  background: rgb(255 255 255 / 74%);
  border-color: #cbd8e4;
}

:root[data-theme="light"] .page-admin .admin-page-title .admin-top-actions .ghost:hover {
  background: #fff;
  border-color: var(--public-cool);
}

:root[data-theme="light"] .page-admin .admin-language-panel {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: var(--public-line);
  box-shadow: 0 18px 46px rgb(41 55 75 / 16%);
}

:root[data-theme="light"] .page-admin .admin-language-panel button {
  color: var(--public-ink-soft);
}

:root[data-theme="light"] .page-admin .admin-language-panel button:hover,
:root[data-theme="light"] .page-admin .admin-language-panel button:focus-visible {
  color: var(--public-ink);
  background: var(--public-surface);
  border-color: #b7c9d8;
}

:root[data-theme="light"] .page-admin .admin-language-panel button[aria-checked="true"] {
  color: var(--public-cool-dark);
  background: #e8f0f7;
  border-color: #9fb8cb;
}

:root[data-theme="light"] .page-admin .admin-language-panel button[aria-checked="true"]::before {
  background: var(--public-cool);
  box-shadow: 0 0 0 3px rgb(53 107 145 / 12%);
}

:root[data-theme="light"] .page-admin .admin-language-panel small {
  color: var(--public-muted);
}

:root[data-theme="light"] body.profile-page {
  --profile-ink: var(--public-ink);
  --profile-muted: var(--public-muted);
  --profile-line: var(--public-line);
  --profile-soft: var(--public-surface);
  --profile-accent: var(--public-cool);
  --profile-accent-hover: var(--public-cool-dark);
  --profile-shadow: 0 18px 46px rgb(45 61 80 / 9%);
  color: var(--public-ink);
  background: linear-gradient(180deg, #fff 0%, var(--public-page) 48%, var(--public-cool-muted) 100%);
}

:root[data-theme="light"] body.profile-page .profile-avatar-picker:focus-visible {
  outline-color: rgb(53 107 145 / 28%);
}

:root[data-theme="light"] body.profile-page .profile-avatar-add {
  box-shadow: 0 6px 14px rgb(53 107 145 / 22%);
}

:root[data-theme="light"] body.profile-page :is(.profile-field input, .profile-field textarea):focus {
  outline-color: rgb(53 107 145 / 12%);
}

:root[data-theme="light"] body.profile-page .profile-tag-chip {
  color: var(--public-cool-dark);
  background: #edf4fa;
  border-color: #c4d6e4;
}

:root[data-theme="light"] .auth-dialog {
  color: var(--public-ink);
  background: var(--public-paper);
  border-color: #aebfce;
  box-shadow: 0 24px 80px rgb(31 42 55 / 30%);
}

:root[data-theme="light"] .auth-dialog :is(input, select, textarea) {
  color: var(--public-ink);
  background: #fff;
  border-color: var(--public-line);
}

:root[data-theme="light"] .auth-dialog :is(input, select, textarea):focus {
  border-color: var(--public-cool);
  outline-color: rgb(53 107 145 / 14%);
}

:root[data-theme="light"] .auth-dialog :is(.auth-password-toggle:hover, .auth-password-toggle:focus-visible) {
  color: var(--public-cool-dark);
  background: transparent;
}

:root[data-theme="light"] .auth-dialog .auth-password-toggle:focus-visible {
  outline-color: var(--public-cool);
}

:root[data-theme="light"] .auth-dialog .auth-remember input {
  accent-color: var(--public-cool);
}

:root[data-theme="light"] .auth-dialog :is(.auth-guest-link, .auth-eyebrow) {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] .auth-dialog :is(
  button[type="submit"],
  .auth-primary,
  .auth-submit
) {
  color: #fff;
  background-color: var(--public-cool-dark);
  background-image: var(--public-action-gradient);
  border-color: var(--public-cool-dark);
}

:root[data-theme="light"] .auth-dialog :is(
  button[type="submit"],
  .auth-primary,
  .auth-submit
):hover {
  background-image: var(--public-action-gradient-hover);
}

@media (max-width: 1080px) {
  :root[data-theme="light"] .home-canvas .home-flow-section {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 760px) {
  :root[data-theme="light"] .console-page .mobile-task-dock-button > span {
    display: -webkit-box;
    overflow: hidden;
    line-height: 1.15;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  :root[data-theme="light"] .console-page :is(
    .publish-mode-tabs,
    .persona-group-tabs,
    .persona-subflow-tabs,
    .persona-draft-view-toggle,
    .persona-compose-toggle,
    .persona-source-toggle,
  .account-browser-tabs,
  .account-pool-platforms,
  .automation-capsule-tabs
) button:not(.is-active) {
    padding-inline: 8px;
    font-size: 13px;
  }
}

:root[data-theme="light"] .site-header a:focus-visible,
:root[data-theme="light"] .site-header button:focus-visible,
:root[data-theme="light"] .site-menu-toggle:focus-visible,
:root[data-theme="light"] .site-mobile-menu-panel a:focus-visible {
  outline-color: #78a7c7;
}

:root[data-theme="light"] .site-nav a[aria-current="page"]::after {
  background: linear-gradient(90deg, var(--public-cool-dark), #78a7c7);
}

:root[data-theme="light"] .site-nav-badge {
  color: #fff;
  background: var(--public-cool);
}

:root[data-theme="light"] .site-user {
  background: rgb(120 167 199 / 10%);
  border-color: rgb(120 167 199 / 38%);
}

:root[data-theme="light"] .site-user:hover,
:root[data-theme="light"] .site-account-menu.is-open .site-user {
  background: rgb(120 167 199 / 20%);
  border-color: #78a7c7;
  box-shadow: 0 0 0 4px rgb(120 167 199 / 12%);
}

:root[data-theme="light"] .site-skip-link {
  border-color: var(--public-cool);
}

:root[data-theme="light"] .site-skip-link:focus-visible {
  outline-color: rgb(120 167 199 / 72%);
}

:root[data-theme="light"] .site-subscription-link[aria-current="page"] {
  color: var(--public-on-dark-accent);
  background: rgb(120 167 199 / 18%);
  border-color: #78a7c7;
}

:root[data-theme="light"] .site-mobile-menu-close {
  color: var(--public-ink-soft);
  background: transparent;
  border-color: transparent;
}

:root[data-theme="light"] :is(
  .site-mobile-menu-close:hover,
  .site-mobile-menu-close:focus-visible,
  .site-mobile-menu-link:hover,
  .site-mobile-menu-link:focus-visible,
  .site-mobile-menu-link[aria-current="page"]
) {
  color: var(--public-ink);
  background: var(--public-cool-soft);
  border-color: transparent;
}

:root[data-theme="light"] .site-mobile-menu-link-icon {
  color: var(--public-cool-dark);
  background: transparent;
  border-color: transparent;
}

:root[data-theme="light"] .site-mobile-menu-link[aria-current="page"] .site-mobile-menu-link-icon {
  color: var(--public-cool);
  background: transparent;
}

:root[data-theme="light"] .site-account-avatar,
:root[data-theme="light"] .site-account-tags span {
  color: var(--public-cool-dark);
  background: #ffffff;
  border-color: #c4d6e4;
}

:root[data-theme="light"] .site-account-action-row button {
  color: var(--public-cool-dark);
  background: #ffffff;
  border-color: #c4d6e4;
}

:root[data-theme="light"] :is(
  .site-account-action-row button:hover,
  .site-account-action-row button:focus-visible
) {
  color: #fff;
  background: var(--public-cool);
  border-color: var(--public-cool);
}

:root[data-theme="light"] .site-account-preference {
  color: var(--public-ink-soft);
  background: #ffffff;
  border-color: var(--public-line);
}

:root[data-theme="light"] .site-account-preference:hover {
  color: var(--public-cool-dark);
  background: var(--public-cool-soft);
  border-color: #b7cbdc;
}

:root[data-theme="light"] .site-account-preference-icon {
  color: var(--public-cool);
}

:root[data-theme="light"] :is(.profile-page, .page-admin, .console-page) :is(
  .status-warning,
  .warning,
  [data-state="warning"]
) {
  --accent: var(--public-warm-accent);
}

@media (max-width: 760px) {
  :root[data-theme="light"] .home-canvas .home-proof > div {
    border-color: var(--public-line);
  }

  :root[data-theme="light"] .home-canvas .home-agent-stage article {
    border-bottom: 1px solid var(--public-line);
  }

  :root[data-theme="light"] .about-canvas .about-value-strip div {
    border-bottom: 1px solid var(--public-line);
  }

  :root[data-theme="light"] .about-canvas .about-hero h1 {
    max-width: 100%;
    font-size: 36px;
    line-height: 1.08;
    overflow-wrap: anywhere;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-mobile-tier-switch {
    color: var(--public-ink);
    background: var(--public-paper);
    border-color: var(--public-line);
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-mobile-tier-switch button {
    color: var(--public-ink-soft);
    background: transparent;
    border-color: var(--public-line);
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-mobile-tier-switch button[aria-pressed="true"] {
    color: #fff;
    background: var(--public-cool-dark);
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list > li > span {
    font-size: 10px;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list strong {
    font-size: 13px;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rights-list p {
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.45;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid span {
    font-size: 10px;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid h3 {
    font-size: 14px;
  }

  :root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-rule-grid p {
    font-size: 11px;
    line-height: 1.45;
  }
}

/* Light-theme depth: cool structure, restrained warm accents and subtle
   branded texture. Keep large canvases neutral and use warmth as punctuation. */
:root[data-theme="light"] {
  --public-cool-line: #aeb9c4;
  --public-warm-soft: #f5f1ec;
  --public-warm-line: var(--public-line);
  --public-warm-muted: #ece8e3;
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(2),
:root[data-theme="light"] .about-canvas .about-module-grid article:nth-child(3n + 2),
:root[data-theme="light"] .about-canvas .about-engine-grid article:nth-child(2) {
  background: var(--public-warm-muted);
  border-color: var(--public-line);
}

:root[data-theme="light"] .home-canvas .home-agent-stage article:nth-child(2) .home-agent-role,
:root[data-theme="light"] .about-canvas .about-module-grid article:nth-child(3n + 2) > span {
  color: var(--public-ink-soft);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] :is(
  .pricing-tier-overview article,
  .pricing-package-grid article
) {
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article:nth-child(2) {
  background: #d8e3eb;
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-tier-overview article:nth-child(3) {
  background: #edf2f6;
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-package-grid article:nth-child(2) {
  background: var(--public-paper);
  border-color: var(--public-line);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] :is(
  .pricing-tier-overview,
  .pricing-packages-band
) .pricing-label {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-package-grid .pricing-label {
  color: var(--public-ink-soft);
}

:root[data-theme="light"] .home-canvas :is(.home-flow-section, .home-difference-section) {
  background-image:
    linear-gradient(rgb(226 231 236 / 88%), rgb(237 240 243 / 94%)),
    url("/assets/opc/home/analytics-screen.jpg");
  background-position: center;
  background-size: cover;
}

:root[data-theme="light"] .about-canvas .about-proof {
  background-image:
    linear-gradient(rgb(226 231 236 / 88%), rgb(237 240 243 / 94%)),
    url("/assets/opc/vecto-ai-cockpit.png");
  background-position: center;
  background-size: cover;
}

:root[data-theme="light"] .home-canvas .home-infra-section {
  color: #f8fafc;
  background: #30353a;
}

:root[data-theme="light"] .home-canvas .home-infra-section > .home-section-head :is(h2, h3),
:root[data-theme="light"] .home-canvas .home-infra-section .home-infra-visual strong {
  color: #f8fafc;
}

:root[data-theme="light"] .home-canvas .home-infra-section > .home-section-head :is(p, span, small),
:root[data-theme="light"] .home-canvas .home-infra-section .home-infra-visual :is(p, span, small) {
  color: #c7d0d8;
}

:root[data-theme="light"] .home-canvas .home-infra-section :is(
  .home-infra-status,
  .home-infra-control,
  .home-infra-network
) {
  color: var(--public-ink);
}

:root[data-theme="light"] .home-canvas .home-infra-section :is(
  .home-infra-status,
  .home-infra-control,
  .home-infra-network
) :is(h3, strong) {
  color: var(--public-ink);
}

:root[data-theme="light"] .home-canvas .home-infra-section :is(
  .home-infra-status,
  .home-infra-control,
  .home-infra-network
) :is(p, span, small) {
  color: var(--public-muted);
}

:root[data-theme="light"] .about-canvas .about-architecture .about-section-head-light h2 {
  color: #f8fafc;
}

:root[data-theme="light"] .about-canvas .about-architecture .about-section-head-light > p:last-child {
  color: #c7d0d8;
}

:root[data-theme="light"] .about-canvas .about-architecture .about-engine-grid article {
  color: var(--public-ink);
}

:root[data-theme="light"] .about-canvas .about-architecture .about-engine-grid article h3 {
  color: var(--public-ink);
}

:root[data-theme="light"] .about-canvas .about-architecture .about-engine-grid article p {
  color: var(--public-muted);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-band :is(
  h2,
  h3
) {
  color: var(--public-ink);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-band .pricing-tier-index {
  color: var(--public-cool-dark);
}

:root[data-theme="light"] body[data-login-redirect="/subscription.html"] .pricing-comparison-band :is(
  .pricing-comparison-heading > p,
  .pricing-comparison-note,
  .pricing-tier-overview p
) {
  color: var(--public-muted);
}

:root[data-theme="light"] .auth-dialog .auth-close {
  background: transparent;
  border: 0;
}

:root[data-theme="light"] .auth-dialog .auth-close:hover {
  background: rgba(37, 55, 70, 0.08);
}

:root[data-theme="light"] .auth-dialog :is(.auth-eyebrow, .form-kicker) {
  color: var(--public-ink-soft);
}

/* Console work areas use the shared neutral canvas without a photographic backdrop. */
:root[data-theme="light"] .console-page .console-main {
  background-image: none;
}

:root[data-theme="light"] .console-page :is(
  .module-panel,
  .action-panel,
  .command-panel,
  .live-panel
) {
  background: rgb(255 255 255 / 96%);
  border-color: var(--public-line);
  box-shadow: var(--panel-shadow);
}

:root[data-theme="light"] .console-page :is(
  .status-warning,
  .warning,
  [data-state="warning"],
  [data-state="manual"],
  .is-manual
) {
  border-color: var(--public-line);
  box-shadow: inset 3px 0 0 #68727d;
}

:root[data-theme="light"] .site-account-popover {
  border-color: var(--public-cool-line);
  box-shadow: 0 18px 46px rgb(41 55 75 / 16%);
}

:root[data-theme="light"] .site-account-profile-field + .site-account-profile-field {
  border-left-color: var(--public-line);
}

/* Admin: neutral operational canvas with large, readable color blocks. */
:root[data-theme="light"] .page-admin .admin-page-title {
  background-image:
    linear-gradient(90deg, rgb(248 250 251 / 96%) 0 58%, rgb(220 227 232 / 94%) 58% 84%, rgb(198 205 210 / 92%) 84% 100%),
    url("/assets/opc/vecto-ai-cockpit.png");
  background-position: center;
  background-size: cover;
  border-color: #aeb8c1;
}

:root[data-theme="light"] .page-admin .admin-page-title::before {
  background: transparent;
}

:root[data-theme="light"] .page-admin .admin-page-title .section-kicker {
  color: #34495e;
}

:root[data-theme="light"] .page-admin .admin-page-view > .section-head {
  position: relative;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--public-line);
}

:root[data-theme="light"] .page-admin .admin-page-view > .section-head::after {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: min(112px, 28%);
  height: 2px;
  content: "";
  background: linear-gradient(90deg, var(--public-cool-dark), var(--public-cool-line));
}

:root[data-theme="light"] .page-admin :is(.admin-config-card, .admin-runtime-block) {
  background: #edf1f4;
  border-color: #b6c0c8;
}

:root[data-theme="light"] .page-admin :is(.card, .admin-page-view) {
  background: #f8fafb;
  border-color: #b6c0c8;
}

:root[data-theme="light"] .page-admin :is(
  .task-summary-shell,
  .admin-compose-shell,
  .admin-table-shell,
  .task-toolbar,
  .account-grid > div
) {
  background: #edf1f4;
  border-color: #b6c0c8;
}

:root[data-theme="light"] .page-admin .admin-governance-kpi {
  border-color: #aeb8c1;
  border-top-width: 4px;
  background: #f7f9fa;
  box-shadow: inset 0 -1px 0 rgb(64 78 91 / 8%);
}

:root[data-theme="light"] .page-admin .admin-governance-kpi.is-info {
  border-top-color: #4d718b;
  background: linear-gradient(90deg, #dce6ed 0 30%, #f8fafb 30% 100%);
}

:root[data-theme="light"] .page-admin :is(
  .admin-governance-kpi.is-success,
  .admin-governance-kpi.is-health
) {
  border-top-color: #526b7d;
  background: linear-gradient(90deg, #e0e6ec 0 30%, #f8fafb 30% 100%);
}

:root[data-theme="light"] .page-admin .admin-governance-kpi.is-warning {
  border-top-color: #8a7665;
  background: linear-gradient(90deg, #e9e4de 0 26%, #f8fafb 26% 100%);
}

:root[data-theme="light"] .page-admin .admin-governance-kpi.is-danger {
  border-top-color: #9c5960;
  background: linear-gradient(90deg, #ece2e3 0 26%, #f8fafb 26% 100%);
}

:root[data-theme="light"] .page-admin .admin-governance-panel {
  background: #f8fafb;
  border-color: #aeb8c1;
  box-shadow: inset 0 4px 0 #d5dde3;
}

:root[data-theme="light"] .page-admin .admin-chart-panel:nth-child(2n) {
  box-shadow: inset 0 4px 0 #c8d6e0;
}

:root[data-theme="light"] .page-admin .admin-chart-panel:nth-child(3n) {
  box-shadow: inset 0 4px 0 #d8d2cc;
}

:root[data-theme="light"] .page-admin :is(.admin-governance-chart, .admin-distribution-list, .admin-health-list) {
  background: #eef2f5;
  border-color: #c0c8cf;
}

:root[data-theme="light"] .page-admin :is(
  .admin-governance-kpi > span,
  .admin-governance-kpi > small,
  .admin-governance-panel header span
) {
  color: #4b5965;
}

:root[data-theme="light"] .page-admin .admin-governance-kpi > strong {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

:root[data-theme="light"] .page-admin .admin-governance-panel > header {
  flex-wrap: wrap;
  row-gap: 8px;
}

:root[data-theme="light"] .page-admin .admin-chart-legend {
  max-width: 100%;
  white-space: normal;
}

@media (max-width: 760px) {
  :root[data-theme="light"] .page-admin .admin-page-title {
    background-image:
      linear-gradient(180deg, rgb(248 250 251 / 97%) 0 64%, rgb(220 227 232 / 95%) 64% 88%, rgb(198 205 210 / 93%) 88% 100%),
      url("/assets/opc/vecto-ai-cockpit.png");
  }

  :root[data-theme="light"] .page-admin .admin-governance-kpi {
    min-width: 0;
    padding: 12px;
  }

  :root[data-theme="light"] .page-admin .admin-governance-kpi.is-info {
    background: linear-gradient(90deg, #dce6ed 0 22%, #f8fafb 22% 100%);
  }

  :root[data-theme="light"] .page-admin .admin-governance-kpi:is(.is-success, .is-health) {
    background: linear-gradient(90deg, #e0e6ec 0 22%, #f8fafb 22% 100%);
  }

  :root[data-theme="light"] .page-admin .admin-governance-kpi:is(.is-warning, .is-danger) {
    background: linear-gradient(90deg, #e8e2dc 0 22%, #f8fafb 22% 100%);
  }
}

:root[data-theme="light"] .page-admin :is(
  .status-warning,
  .warning,
  [data-state="warning"],
  [data-status="pending"],
  .is-pending
) {
  color: #5f5146;
  background: var(--public-warm-soft);
  border-color: var(--public-line);
}

/* Prevent fixed-height public cards from clipping their labels. */
:root[data-theme="light"] :is(
  .home-agent-stage article,
  .about-module-grid article,
  .pricing-tier-overview article,
  .pricing-package-grid article
) :is(h2, h3, h4, p, li, strong, small) {
  min-width: 0;
  overflow-wrap: break-word;
}

:root[data-theme="light"] :is(
  .home-canvas,
  .about-canvas,
  body[data-login-redirect="/subscription.html"]
) :is(
  .home-proof,
  .home-agent-stage article,
  .home-infra-status,
  .about-module-grid article,
  .about-engine-grid article,
  .pricing-tier-overview article,
  .pricing-package-grid article
) {
  border-color: var(--public-line);
}

/* Keep desktop account information in the same edge-to-edge side drawer as mobile. */
@media (min-width: 821px) {
  :root[data-theme="light"] .site-account-popover {
    inset: 0 0 0 auto;
    align-items: center;
    width: min(520px, 42vw);
    height: 100dvh;
    max-height: none;
    padding: max(24px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));
    border: 0;
    border-radius: 0;
    box-shadow: 0 22px 56px rgb(17 24 39 / 22%);
    transform: translate3d(100%, 0, 0);
  }

  :root[data-theme="light"] .site-account-menu.is-open .site-account-popover {
    transform: translate3d(0, 0, 0);
  }

  :root[data-theme="light"] .site-account-popover > * {
    width: 100%;
  }
}

:root[data-theme="light"] .site-header .brand-name {
  line-height: 1.15;
  overflow-y: visible;
}

:root[data-theme="light"] .home-canvas .home-hero :is(h1, h2),
:root[data-theme="light"] .home-canvas .home-hero-lede {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

:root[data-theme="light"] .home-canvas .home-hero :is(h1, h2) {
  line-height: 1.2;
}

@media (max-width: 760px) {
  :root[data-theme="light"] .home-canvas .home-hero-slide {
    height: 375px;
    grid-template-rows: minmax(0, 1fr) 156px;
  }

  /* The workspace is a canvas on mobile: only functional cards get a white fill. */
  :root[data-theme="light"] .console-page .view[data-panel="workspace"] .module-panel {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
  }

  /* Keep the task and content mode switches visually anchored above the mobile canvas. */
  :root[data-theme="light"] .console-page :is(
    .module-panel.is-publishing-module,
    .persona-detail.persona-detail--content
  ) .publish-mode-tabs {
    background: var(--public-paper);
  }

  :root[data-theme="light"] .console-page .console-main {
    background-attachment: scroll;
  }

  :root[data-theme="light"] body.profile-page .profile-account-grid > div + div {
    border-top-color: var(--public-line);
    border-left-color: transparent;
  }
}

@media (max-width: 720px) {
  :root[data-theme="light"] body.profile-page .profile-account-grid strong {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 360px) {
  :root[data-theme="light"] .console-page .task-table-inner--regular .task-row {
    grid-template-columns: 22px minmax(0, 1fr) auto;
    grid-template-areas:
      "check task status"
      "empty time time"
      "empty actions actions";
  }

  :root[data-theme="light"] .console-page .task-table-inner--regular .task-row .row-actions {
    flex-wrap: wrap;
  }

  :root[data-theme="light"] .console-page .task-table-inner--regular .task-row > :nth-child(2) strong {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    text-overflow: clip;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}

/* Keep one opaque admin theme last so the operations workspace has predictable
   surfaces, table alignment, and a visible product image in the title band. */
:root[data-theme="light"] .page-admin {
  background: #ffffff;
}

:root[data-theme="light"] .page-admin .admin-page-title {
  background-color: #ffffff;
  background-image:
    linear-gradient(90deg, #ffffff 0 38%, rgb(255 255 255 / 96%) 50%, rgb(255 255 255 / 18%) 72%, transparent 100%),
    url("/assets/opc/vecto-ai-cockpit.png");
  background-position: center right;
  background-size: cover;
  background-repeat: no-repeat;
  border-color: #aeb8c1;
  box-shadow: none;
}

:root[data-theme="light"] .page-admin .admin-page-title :is(.overview-pod, .admin-top-actions .ghost) {
  background: #ffffff;
  border-color: #bcc7cf;
}

:root[data-theme="light"] .page-admin :is(.card, .admin-page-view) {
  background: #ffffff;
  border-color: #b6c0c8;
  box-shadow: none;
}

:root[data-theme="light"] .page-admin :is(
  .admin-config-card,
  .admin-runtime-block,
  .task-summary-shell,
  .admin-compose-shell,
  .admin-table-shell,
  .task-toolbar,
  .account-grid > div
) {
  background: #ffffff;
  border-color: #c4cdd4;
  box-shadow: none;
}

/* Preserve the procurement gradient after the generic opaque admin-card rules. */
:root[data-theme="light"] .page-admin .admin-runtime-provider-shell.admin-config-card {
  color: #f7fbff;
  background: linear-gradient(105deg, #237fb2 0 8%, #155f96 24%, #123f69 56%, #102c47 100%);
  border-color: transparent;
}

:root[data-theme="light"] .page-admin .admin-runtime-provider-shell .admin-model-tabs {
  background: rgba(4, 28, 52, 0.3);
  border-color: rgba(255, 255, 255, 0.22);
}

:root[data-theme="light"] .page-admin .admin-runtime-provider-shell .admin-model-tab {
  color: #dcecf6;
  background: transparent;
  border-color: transparent;
}

:root[data-theme="light"] .page-admin .admin-runtime-provider-shell .admin-model-tab:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
}

:root[data-theme="light"] .page-admin .admin-runtime-provider-shell .admin-model-tab.is-active {
  color: #123f69;
  background: #ffffff;
  border-color: rgba(255, 255, 255, 0.72);
}

:root[data-theme="light"] .page-admin .admin-runtime-provider-shell .admin-model-tab-panel.admin-runtime-block {
  color: #17202a;
  background: rgba(255, 255, 255, 0.97);
  border-color: transparent;
}

:root[data-theme="light"] .page-admin .admin-governance-kpi {
  background: #ffffff;
  box-shadow: none;
}

:root[data-theme="light"] .page-admin .admin-governance-kpi.is-info,
:root[data-theme="light"] .page-admin .admin-governance-kpi:is(.is-success, .is-health),
:root[data-theme="light"] .page-admin .admin-governance-kpi.is-warning,
:root[data-theme="light"] .page-admin .admin-governance-kpi.is-danger {
  background: #ffffff;
}

:root[data-theme="light"] .page-admin :is(.table th, .table td) {
  background-color: #ffffff;
}

:root[data-theme="light"] .page-admin .table th {
  background-color: #f5f7f8;
}