:root {
  --bg: #07070b;
  --bg-soft: #0c0b12;
  --surface: #11111a;
  --surface-2: #171724;
  --panel: #11111a;
  --panel-2: #171724;
  --panel-subtle: #0f0f17;
  --panel-ghost: #0b0b11;
  --panel-solid: #171724;
  --surface-sunken: #0b0b11;
  --panel-inset: #0c0c13;
  --line-hairline: rgba(245,243,255,0.07);
  --line-card: rgba(245,243,255,0.09);
  --line-soft: rgba(245,243,255,0.08);
  --line: rgba(245,243,255,0.11);
  --line-strong: rgba(245,243,255,0.18);
  --surface-edge: #151522;
  --surface-bg: #11111a;
  --surface-bg-solid: #151522;
  --surface-overlay-bg: #0c0c13;
  --surface-bg-soft: #101018;
  --surface-control-bg: #181827;
  --surface-control-bg-hover: #232236;
  --surface-active-bg: #7c5cff;
  --surface-depth: none;
  --surface-depth-low: none;
  --surface-control-shadow: none;
  --surface-control-shadow-hover: none;
  --surface-active-shadow: none;
  --surface-divider: linear-gradient(90deg, transparent 0, rgba(139, 92, 246, 0.04) 18%, rgba(139, 92, 246, 0.2) 52%, rgba(94, 214, 155, 0.08) 82%, transparent 100%);
  --surface-divider-vertical: linear-gradient(180deg, transparent 0, rgba(139, 92, 246, 0.05) 18%, rgba(139, 92, 246, 0.2) 52%, rgba(94, 214, 155, 0.08) 82%, transparent 100%);
  --field-shadow: none;
  --field-focus-shadow: none;
  --text: #f5f3ff;
  --muted: #b6b0c8;
  --muted-2: #827993;
  --cyan: #44d3dc;
  --green: #5ed69b;
  --amber: #f3ba61;
  --violet: #8b5cf6;
  --danger: #ef6b6b;
  --on-accent: #07070b;
  --font-sans: Helvetica, Arial, sans-serif;
  --radius: 0.5rem;
  --shadow: none;
  --site-header-height: 3.625rem;
  --site-header-control-size: 2.875rem;
  --site-drawer-width: 24rem;
  --site-drawer-inset: clamp(0.875rem, 0.8rem + 0.25vi, 1.125rem);
  --site-drawer-gap: clamp(1rem, 0.9rem + 0.3vi, 1.25rem);
  --site-scrollbar-size: 0.75rem;
  --nav-height: var(--site-header-height);
  --page-gutter:
    max(
      env(safe-area-inset-left),
      env(safe-area-inset-right),
      clamp(0.875rem, 0.75rem + 0.45vi, 1.5rem)
    );
  --content-inset: var(--page-gutter);
  --content-inset-start: var(--page-gutter);
  --content-inset-end: var(--page-gutter);
  --site-brand-control-size: var(--site-header-control-size);
  --site-brand-mark-size: 1.75rem;
  --site-brand-slash-width: 0.25cap;
  --site-brand-slash-height: 1cap;
  --site-brand-slash-offset: 0.1875rem;
  --site-brand-gap: 0.625rem;
  --site-brand-font-size: 0.875rem;
  --site-brand-line-height: 1.5;
  --display-measure: min(100%, 77.5rem);
  --section-measure: min(100%, 68.75rem);
  --heading-measure: min(100%, 61.25rem);
  --wide-copy-measure: min(100%, 70rem);
  --copy-measure: min(100%, 42.5rem);
  --topbar-gap: clamp(0.75rem, 2vi, 1.75rem);
  --control-min: var(--site-header-control-size);
  --control-radius: 0.375rem;
  --control-card-radius: 0.375rem;
  --control-menu-radius: 0.5rem;
  --control-surface-bg: #181827;
  --control-surface-hover: #232236;
  --control-primary-bg: #8b5cf6;
  --control-primary-bg-hover: #9a6cff;
  --control-selected-bg: #2b2442;
  --control-group-bg: #0c0c13;
  --control-menu-bg: #09090f;
  --control-shadow: none;
  --control-shadow-hover: none;
  --control-shadow-active: none;
  --touch-target: 2.75rem;
  --panel-pad: 1.125rem;
  --panel-pad-compact: 1rem;
  --panel-pad-tight: 0.875rem;
  --panel-pad-x-tight: 0.75rem;
  --layout-gap: 0.875rem;
  --layout-gap-tight: 0.625rem;
  --layout-gap-x-tight: 0.5rem;
  --viewport-block: calc(100svh - var(--nav-height));
  --viewport-frame: clamp(0.75rem, 4vmin, 2.125rem);
  --viewport-gap: clamp(0.5rem, 2.2vmin, 1.25rem);
  --page-legal-bottom-inset: 0.625rem;
  --hero-section-feather: clamp(5.25rem, 12svh, 8.75rem);
  --hero-section-bleed: clamp(1rem, 2.4svh, 1.75rem);
  --hero-section-tail: clamp(0.5rem, 1.2svh, 0.875rem);
  --compact-panel-pad: clamp(0.75rem, 1.5vmin, 1.125rem);
  --compact-panel-gap: clamp(0.4375rem, 1.4vmin, 0.75rem);
  --compact-card-min: clamp(13.125rem, 32svh, 21.25rem);
  --compact-map-min: clamp(15rem, 42svh, 22.5rem);
  --compact-metric-min: clamp(4rem, 11svh, 5.375rem);
  --compact-console-min: clamp(8rem, 22svh, 11.875rem);
  --compact-timeline-min: clamp(6.75rem, 18svh, 9.375rem);
  --auto-card-min: clamp(21.25rem, 31vw, 26.25rem);
  --tablet-card-min: 18.75rem;
  --section-pad-y: clamp(4.5rem, 9vw, 8.25rem);
  --workspace-pad-y: clamp(2.125rem, 6vw, 4.75rem);
  --workspace-bottom-gap: clamp(1.625rem, 3svh, 2.5rem);
  --workspace-bottom-gap-short: 1.875rem;
  --workspace-bottom-gap-x-short: 1.75rem;
  --mobile-section-height: var(--viewport-block);
  --heading-display: 4.25rem;
  --hero-heading-size: clamp(3rem, 12cqi, 6.75rem);
  --section-heading-fluid: clamp(2.375rem, 8cqi, var(--section-heading-size));
  --compact-heading-fluid: clamp(1.875rem, 8cqi, 3.25rem);
  --section-heading-size: var(--heading-display);
  --heading-desktop: 3.5rem;
  --heading-short: clamp(2.375rem, 3vw, 2.625rem);
  --heading-x-short: clamp(2.125rem, 2.8vw, 2.375rem);
  --heading-mobile: 2.125rem;
  --heading-mobile-tight: 1.875rem;
  --header-control-bg: transparent;
  --header-control-bg-active: transparent;
  --header-control-bg-hover: rgba(255,255,255,0.052);
  --header-control-line: transparent;
  --header-control-line-active: transparent;
  --header-control-line-hover: rgba(255,255,255,0.095);
  --login-menu-min: 9em;
  --preference-control-block: 3.25em;
  --preference-control-pad-start: 0.75em;
  --preference-control-pad-end: 2.25em;
  --preference-control-radius: 0.45em;
  --preference-arrow-end: 0.75em;
  --preference-arrow-width: 0.7em;
  --preference-arrow-height: 0.55em;
  --preference-menu-offset: 0.7em;
  --preference-menu-padding: 0.55em;
  --preference-menu-radius: 0.6em;
  --preference-menu-gap: 0.3em;
  --preference-option-block: 3.15em;
  --preference-option-pad: 1em;
  --preference-option-radius: 0.45em;
  --preference-group-gap: 0.7em;
  --field-bg: #101018;
  --field-border: rgba(245,243,255,0.1);
  --field-border-strong: rgba(245,243,255,0.14);
  --field-focus: rgba(139, 92, 246, 0.58);
  --field-min-height: var(--control-min);
  --field-pad-x: 0.75rem;
  --map-block-size: clamp(18rem, 48svh, 32rem);
  --chart-block-size: clamp(18rem, 44svh, 30rem);
  --chart-preview-block-size: clamp(4.75rem, 10svh, 6rem);
  --chart-focus-block-size: clamp(26rem, calc(100svh - var(--nav-height) - 16rem), 50rem);
  --timeline-row-min: clamp(8rem, 18svh, 9.5rem);
  --console-card-min: clamp(9rem, 18svh, 12rem);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html {
  color-scheme: dark;
  scroll-behavior: auto;
}

html.locale-loading,
html.locale-loading body {
  background: #07070b;
}

html.locale-loading body {
  visibility: hidden;
}

html.public-page {
  scroll-padding-top: var(--nav-height);
}

body {
  min-inline-size: 0;
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
  line-height: 1.5;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { color: inherit; }

button,
select,
.nav-links,
.language-select,
.login-menu-button,
.login-menu-link {
  font-family: var(--font-sans);
  font-synthesis-weight: none;
  letter-spacing: 0;
}

:focus-visible {
  outline: 0.125rem solid rgba(139, 92, 246, 0.62);
  outline-offset: 0.1875rem;
}

.band {
  width: 100%;
  padding-inline: var(--content-inset);
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: var(--topbar-gap);
  min-height: var(--nav-height);
  padding-inline: var(--content-inset);
  padding-block: 0.75rem;
  overflow: visible;
  background-color: var(--bg);
  border-bottom: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.topbar > * {
  position: relative;
  z-index: 2;
}

.brand,
.nav-links a,
.language-select,
.login-menu-button,
.mobile-toggle {
  border: 0;
  border-radius: var(--radius);
  background: var(--header-control-bg);
  box-shadow: inset 0 0 0 0.0625rem var(--header-control-line);
  transition: background .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease;
}

.brand {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: var(--site-brand-gap);
  min-width: 0;
  min-height: var(--site-brand-control-size);
  padding: 0 0.75rem 0 0.5rem;
  font-size: var(--site-brand-font-size);
  font-weight: 760;
  letter-spacing: 0;
  line-height: var(--site-brand-line-height);
  text-transform: uppercase;
  white-space: nowrap;
}

.brand > span:not(.brand-mark):not(.portal-brand-suffix) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.brand:active {
  transform: translateY(0.0625rem);
}

.portal-brand {
  min-width: 0;
}

.portal-brand-suffix {
  padding-left: 0.125rem;
  color: var(--muted);
  font-weight: 600;
}

.brand-mark {
  width: var(--site-brand-mark-size);
  height: var(--site-brand-mark-size);
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

.brand-mark::before {
  content: "";
  display: block;
  width: var(--site-brand-slash-width);
  height: var(--site-brand-slash-height);
  border-radius: 999rem;
  background: var(--ui-primary-surface);
  box-shadow: none;
  transform: skew(-18deg);
}

.nav-links {
  display: flex;
  align-items: center;
  justify-self: center;
  gap: clamp(0.125rem, 0.55vw, 0.625rem);
  min-height: var(--control-min);
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--muted);
  font-size: 0.9375rem;
  font-weight: 600;
}

.nav-links a {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--control-min);
  padding: 0 clamp(0.625rem, 0.95vw, 0.9375rem);
  white-space: nowrap;
}

.mobile-toggle:hover,
.mobile-toggle[aria-expanded="true"] {
  background: transparent;
  box-shadow: none;
  color: #fff;
}

.nav-links a.active {
  color: #fff;
}

.nav-links a:active {
  transform: translateY(0.0625rem);
}

.topbar-actions,
.portal-top-actions {
  display: flex;
  align-items: center;
  justify-self: end;
  gap: 0.625rem;
  margin-left: auto;
  min-width: 0;
}

.language-select {
  min-height: var(--control-min);
  color: var(--text);
  padding: 0 2.25rem 0 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color-scheme: dark;
  cursor: pointer;
}

.login-menu {
  position: relative;
  display: inline-flex;
  min-width: 0;
}

.login-menu-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  min-height: var(--control-min);
  padding: 0 2.125rem 0 1rem;
  color: var(--text);
  cursor: pointer;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: left;
}

.login-menu-button { min-width: var(--login-menu-min); }

.login-menu-button::after {
  content: "";
  position: absolute;
  right: 0.875rem;
  top: 50%;
  width: 0.4375rem;
  height: 0.4375rem;
  border-right: 0.125rem solid currentColor;
  border-bottom: 0.125rem solid currentColor;
  opacity: 0.7;
  transform: translateY(-62%) rotate(45deg);
  transition: transform .2s ease, opacity .2s ease;
}

.login-menu.open .login-menu-button::after {
  transform: translateY(-32%) rotate(225deg);
}

.login-menu-button:active {
  transform: translateY(0.0625rem);
}

.login-menu-list {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 120;
  display: none;
  padding: 0.375rem;
  border-radius: var(--radius);
  border: 0;
  background: var(--surface-overlay-bg);
  box-shadow: var(--surface-depth);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.login-menu-list {
  width: 100%;
  min-width: 100%;
  max-width: min(16.25rem, calc(100vw - 1.5rem));
}

.login-menu.open .login-menu-list {
  display: grid;
  gap: 0.125rem;
}

.login-menu-link {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: var(--touch-target);
  padding: 0 0.75rem;
  border-radius: calc(var(--radius) - 0.125rem);
  color: var(--muted);
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
}

.login-menu-link:hover,
.login-menu-link:focus-visible {
  outline: none;
  background: var(--surface-control-bg-hover);
  box-shadow: var(--surface-control-shadow);
  color: #fff;
}

.brand:hover,
.nav-links a:hover,
.topbar .language-select:hover,
.topbar .login-menu-button:hover,
.topbar .login-menu.open .login-menu-button {
  background: transparent;
  box-shadow: none;
  color: #fff;
}

.topbar .language-select:active {
  background: transparent;
}

.language-select:active {
  background: var(--line-soft);
}

.contact-custom-select {
  --field-bg: #151714;
  --field-border: var(--field-border-strong);
  --field-min-height: 3.25rem;
  --field-pad-x: 0.875rem;
  width: 100%;
}

select option {
  background: var(--surface);
  color: var(--text);
}

.mobile-language-select,
.mobile-language-custom-select {
  width: 100%;
  display: none;
  margin: 0 0 0.375rem;
}

.mobile-login-menu {
  width: 100%;
  margin-top: 0.375rem;
}

.mobile-login-menu .login-menu-button {
  width: 100%;
}

.mobile-login-menu .login-menu-list {
  left: 0;
  right: auto;
  width: 100%;
}

.mobile-toggle {
  display: none;
  width: var(--control-min);
  height: var(--control-min);
  cursor: pointer;
}

.mobile-toggle:active {
  transform: translateY(0.0625rem);
}

.mobile-toggle > span {
  display: block;
  width: 1.0625rem;
  height: 0.125rem;
  margin: 0.25rem auto;
  border-radius: 62.4375rem;
  background: currentColor;
  transition: transform .2s ease, opacity .2s ease;
}

.mobile-toggle[aria-expanded="true"] > span:first-child { transform: translateY(0.375rem) rotate(45deg); }
.mobile-toggle[aria-expanded="true"] > span:nth-child(2) { opacity: 0; }
.mobile-toggle[aria-expanded="true"] > span:last-child { transform: translateY(-0.375rem) rotate(-45deg); }

.mobile-menu {
  display: none;
  position: sticky;
  top: var(--nav-height);
  z-index: 35;
  gap: 0.25rem;
  margin: 0 clamp(var(--panel-pad-x-tight), 3vw, 1.75rem);
  padding: var(--panel-pad-x-tight);
  background: var(--control-menu-bg);
  border: 0;
  border-top: 0;
  border-radius: 0 0 var(--control-menu-radius) var(--control-menu-radius);
  box-shadow: inset 0 0 0 0.0625rem rgba(247,248,242,0.1), 0 1.125rem 2.625rem rgba(0,0,0,0.34);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.mobile-menu.open { display: grid; }

.brand:focus-visible,
.nav-links a:focus-visible,
.topbar .language-select:focus-visible,
.topbar .login-menu-button:focus-visible,
.mobile-toggle:focus-visible {
  outline: 0.125rem solid rgba(139, 92, 246, 0.5);
  outline-offset: 0.25rem;
  background: transparent;
  box-shadow: none;
  color: #fff;
}

.login-menu-link:focus-visible {
  outline: none;
  background: rgba(139, 92, 246, 0.12);
  box-shadow: 0 0 0 0.125rem rgba(139, 92, 246, 0.38);
  color: #fff;
}

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: var(--viewport-block);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 20rem), 0.38fr);
  align-items: center;
  gap: clamp(1.875rem, 6vw, 6rem);
  padding-top: var(--viewport-frame);
  padding-bottom: var(--viewport-frame);
}

.hero-energy-canvas {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 82% 22%, rgba(139, 92, 246, 0.17), transparent 28%),
    radial-gradient(circle at 68% 74%, rgba(223, 71, 255, 0.13), transparent 30%),
    linear-gradient(90deg, rgba(7, 8, 6, 0.98) 0%, rgba(7, 8, 6, 0.76) 46%, rgba(7, 8, 6, 0.18) 100%),
    linear-gradient(180deg, rgba(7, 8, 6, 0.9) 0%, rgba(7, 8, 6, 0.08) 46%, rgba(7, 8, 6, 0) 100%);
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: -1;
  height: 34%;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(7, 8, 6, 0), rgba(7, 8, 6, 0.78) 58%, rgba(7, 8, 6, 0));
}

.eyebrow {
  margin-bottom: 1.125rem;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 850;
  text-transform: uppercase;
}

h1 {
  max-width: var(--display-measure);
  font-size: var(--hero-heading-size);
  line-height: 1.06;
  letter-spacing: 0;
  font-weight: 760;
  overflow-wrap: break-word;
}

.hero-copy,
.section-heading,
.workspace-bar,
.network-copy,
.plant-page,
.plant-chart-head,
.portal-home-head,
.plant-view-head,
.portal-plant-card-head {
  container-type: inline-size;
}

:where(
  h1,
  .workspace-bar h2,
  .section-heading > h2,
  .tab-panel > h3,
  .lighthouse-panel h2,
  .plant-page h1,
  .plant-chart-head > div > strong,
  .portal-plant-card-head > div > strong,
  .imprint-panel strong
) {
  text-wrap: balance;
}

:where(
  .hero-copy > p,
  .section-heading > p,
  .tab-panel > p,
  .lighthouse-panel > p,
  .portal-plant-card p,
  .plant-profile-card > div > p,
  .plant-chart-head > div > p,
  .imprint-panel p
) {
  text-wrap: pretty;
}

.hero-copy > p {
  max-width: var(--wide-copy-measure);
  margin-top: 1.5rem;
  color: var(--muted);
  font-size: 1.375rem;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

.hero-kpis {
  display: grid;
  gap: 0.75rem;
}

.hero-kpis > :is(div, a) {
  --surface-line: var(--line);
  --surface-line-inset: transparent;
  position: relative;
  container-type: inline-size;
  min-width: 0;
  min-height: 5.625rem;
  display: grid;
  align-content: center;
  gap: 0.3125rem;
  padding: 1.125rem;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
}

.hero-kpis > :is(div, a)::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0.0625rem 0 rgba(255,255,255,0.055), inset 0 -0.0625rem 0 rgba(0,0,0,0.18);
  transition: box-shadow .2s ease;
}

.hero-kpis a {
  transition: background .2s ease, box-shadow .2s ease;
}

.hero-kpis a:hover {
  --surface-line: rgba(139, 92, 246, 0.58);
  --surface-line-inset: rgba(139, 92, 246, 0.22);
  background: var(--surface-control-bg-hover);
  box-shadow: var(--surface-control-shadow-hover);
}

.hero-kpis > div > strong,
.hero-product-pills > a > strong {
  display: block;
  min-width: 0;
  font-size: 2.625rem;
  line-height: 1;
  overflow-wrap: break-word;
}

.hero-kpis > div > span,
.hero-product-pills > a > span {
  display: block;
  min-width: 0;
  color: var(--muted);
  font-size: 0.875rem;
  overflow-wrap: break-word;
}

.hero-product-pills > a > strong {
  margin-top: 0.25rem;
  font-size: 1.5rem;
  line-height: 1.05;
}

.hero-product-pills > a > em {
  display: block;
  min-width: 0;
  max-width: 17.5rem;
  color: var(--muted);
  font-size: 0.875rem;
  font-style: normal;
  overflow-wrap: break-word;
}

.workspace {
  --workspace-gap: var(--layout-gap);
  --workspace-pad-top: 2.5rem;
  --workspace-pad-bottom: var(--workspace-pad-y);
  --dashboard-gap: var(--layout-gap);
  --dashboard-panel-pad: var(--panel-pad);
  --dashboard-item-min: 3.375rem;
  --dashboard-item-pad: var(--panel-pad-x-tight);
  --dashboard-mode-min: 2.625rem;
  --dashboard-metric-min: 7.25rem;
  --dashboard-metric-pad: var(--panel-pad);
  --dashboard-metric-value: 2.625rem;
  padding-top: var(--workspace-pad-top);
  padding-bottom: var(--workspace-pad-bottom);
}

.workspace-bar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.25rem;
  margin-bottom: 1.125rem;
}

.workspace-bar > div {
  min-width: 0;
  max-width: 100%;
}

.workspace-bar h2,
.section-heading > h2 {
  max-width: var(--heading-measure);
  font-size: var(--section-heading-fluid);
  line-height: 0.98;
  letter-spacing: 0;
  font-weight: 740;
  overflow-wrap: break-word;
}

.workspace-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--muted);
  font-size: 0.8125rem;
  white-space: nowrap;
}

.workspace-grid {
  display: grid;
  grid-template-columns: minmax(min(100%, 14rem), 0.6fr) minmax(min(100%, 32.5rem), 2fr) minmax(min(100%, 18.75rem), 0.9fr);
  gap: var(--dashboard-gap);
  align-items: stretch;
}

.region-panel,
.network-panel,
.decision-panel,
.portal-auth,
.portal-home-head,
.plant-view-head,
.portal-empty-state,
.portal-plant-card,
.plant-create-form,
.plant-status-panel,
.plant-ftp-panel,
.plant-events-panel,
.plant-status-hero,
.plant-chart-panel,
.plant-data-panel,
.plant-overview,
.plant-devices,
.plant-days,
.plant-import {
  min-width: 0;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-solid);
  box-shadow: var(--surface-depth);
}

.region-panel,
.decision-panel {
  padding: var(--dashboard-panel-pad);
}

.panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.875rem;
  margin-bottom: 1rem;
}

.panel-head > span,
.mode-panel > span,
.decision-card > span,
.network-copy > span,
.lighthouse-lockup > div > span,
.lighthouse-console > div > span,
.portal-auth > div > span,
.portal-login label > span,
.portal-home-head > div > span,
.plant-view-head > div > span,
.portal-plant-card-head > div > span,
.portal-status-badge,
.portal-plant-metrics > div > span,
.portal-plant-edit label > span,
.plant-create-form > div > span,
.plant-create-form label > span,
.plant-status-panel > div > span,
.plant-ftp-head > div > span,
.plant-ftp-grid > div > span,
.plant-status-main > div > span,
.plant-status-metrics > div > span,
.plant-chart-head > div > span,
.plant-kpis > div > span,
.plant-period-kpis > div > span,
.plant-import > div > span,
.plant-profile-card > div > span,
.plant-capability-groups > div > span,
.plant-balance-head > div > span,
.plant-balance-totals > div > span,
.plant-account-title > span,
.plant-account-row > div > span,
.event-head > span,
.plant-day-header > span {
  display: block;
  color: var(--muted-2);
  font-size: 0.6875rem;
  font-weight: 850;
  text-transform: uppercase;
}

.panel-head > strong { font-size: 1.25rem; }

.region-list {
  display: grid;
  gap: 0.5rem;
}

.region-item,
.mode-button,
.metric,
.tabs,
.timeline,
.lighthouse-panel,
.lighthouse-console {
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
}

.region-item,
.mode-button,
.metric,
.tab-button {
  cursor: pointer;
}

.region-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem;
  align-items: center;
  min-height: var(--dashboard-item-min);
  padding: var(--dashboard-item-pad);
  text-align: left;
  color: var(--muted);
}

.region-item > strong { color: var(--text); }
.region-item.active {
  background: var(--surface-active-bg);
  box-shadow: var(--surface-active-shadow);
  color: #fff;
}

.mode-panel {
  margin-top: 1.125rem;
  padding-top: 1.125rem;
  border-top: 0;
  box-shadow: inset 0 0.0625rem 0 rgba(255,255,255,0.055);
}

.mode-buttons {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.625rem;
}

.mode-button {
  min-height: var(--dashboard-mode-min);
  color: var(--muted);
  font-weight: 600;
}

.mode-button.active {
  background: var(--surface-active-bg);
  color: #fff;
  box-shadow: var(--surface-active-shadow);
}

.network-panel {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto minmax(var(--map-block-size), 1fr) auto;
}

.network-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(var(--panel-ghost) 0.0625rem, transparent 0.0625rem),
    linear-gradient(90deg, var(--panel-ghost) 0.0625rem, transparent 0.0625rem);
  background-size: 3.375rem 3.375rem;
}

.network-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 0.3125rem;
  padding: 1.125rem 1.25rem 0;
}

.network-copy > strong {
  font-size: 2.25rem;
  line-height: 1;
}

.network-copy > p {
  max-width: var(--copy-measure);
  color: var(--muted);
}

.network-map {
  position: relative;
  z-index: 1;
  min-height: var(--map-block-size);
}

.network-map svg {
  width: 100%;
  height: 100%;
  display: block;
}

.grid-line {
  fill: none;
  stroke-linecap: round;
}

.grid-line.dim {
  stroke: rgba(255,255,255,0.38);
  stroke-width: 4;
}

.grid-line.main {
  stroke: url(#flow);
  stroke-width: 8;
  filter: url(#lineGlow);
}

.grid-line.branch {
  stroke: rgba(53, 212, 232, 0.46);
  stroke-width: 4;
}

.node.cyan { fill: var(--cyan); }
.node.green { fill: var(--green); }
.node.amber { fill: var(--amber); }
.node.white { fill: var(--text); opacity: 0.88; }
.node.grey { fill: var(--text); opacity: 0.48; }

svg text {
  fill: rgba(255,255,255,0.48);
  font-size: 0.875rem;
  font-weight: 760;
}

svg text.svg-strong {
  fill: var(--text);
  font-size: 2.125rem;
  font-weight: 780;
}

.map-legend {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.625rem;
  padding: 0 1.25rem 1.25rem;
}

.map-legend > span {
  min-width: 0;
  padding: 0.6875rem 0.75rem;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
  color: var(--muted);
  font-size: 0.8125rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.decision-panel {
  display: grid;
  gap: 0.875rem;
  align-content: start;
}

.decision-card {
  position: relative;
  display: grid;
  gap: 0.5625rem;
  padding-bottom: 0.875rem;
}

.decision-card::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 0.0625rem;
  background: var(--surface-divider);
  opacity: 0.82;
  pointer-events: none;
}

.decision-card > strong {
  font-size: 1.875rem;
  line-height: 1.04;
}

.decision-card > p,
.event-list,
.tab-panel > p,
.timeline > div > p,
.contact-copy > p,
.section-heading > p {
  color: var(--muted);
}

.meter-list {
  display: grid;
  gap: 0.625rem;
}

.meter-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.625rem;
  color: var(--muted);
  font-size: 0.8125rem;
}

.meter-row > strong { color: var(--text); }

.meter {
  height: 0.5rem;
  border-radius: 62.4375rem;
  overflow: hidden;
  background: rgba(255,255,255,0.09);
}

.meter > span {
  display: block;
  height: 100%;
  width: 62%;
  border-radius: inherit;
  background: var(--green);
  transition: width .25s ease, background .25s ease;
}

.event-stream {
  display: grid;
  gap: 0.75rem;
}

.event-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  font-size: 0.8125rem;
}

.event-list {
  display: grid;
  gap: 0.625rem;
  list-style: none;
  font-size: 0.8125rem;
}

.event-list > li {
  display: grid;
  grid-template-columns: 4.625rem 1fr auto;
  gap: 0.625rem;
  align-items: center;
}

.event-list time { color: var(--muted-2); }
.event-list strong { color: var(--text); font-size: 0.8125rem; }

.severity {
  --severity-bg: var(--green);
  --severity-text: #061008;
  min-width: 3.875rem;
  padding: 0.25rem 0.5rem;
  border-radius: var(--radius);
  background: var(--severity-bg);
  color: var(--severity-text);
  text-align: center;
  font-size: 0.6875rem;
  font-weight: 850;
}

.severity.clear { --severity-bg: var(--green); }
.severity.info { --severity-bg: var(--cyan); }
.severity.watch { --severity-bg: var(--amber); }

.metric-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--dashboard-gap);
  margin-top: 0.875rem;
}

.metric {
  display: grid;
  gap: 0.4375rem;
  min-height: var(--dashboard-metric-min);
  padding: var(--dashboard-metric-pad);
  text-align: left;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.metric:hover {
  transform: translateY(-0.125rem);
  background: var(--surface-control-bg-hover);
  box-shadow: var(--surface-control-shadow-hover);
}
.metric.active {
  background: var(--surface-active-bg);
  box-shadow: var(--surface-active-shadow);
}
.metric > span { color: var(--muted-2); font-size: 0.75rem; font-weight: 850; text-transform: uppercase; }
.metric > strong { font-size: var(--dashboard-metric-value); line-height: 1; }

@media (min-width: 76.3125rem) {
  .workspace {
    --workspace-pad-top: var(--viewport-frame);
    --workspace-pad-bottom: var(--viewport-frame);
    --dashboard-panel-pad: var(--panel-pad-compact);
    --dashboard-item-min: 3rem;
    --dashboard-item-pad: 0.625rem 0.75rem;
    --dashboard-mode-min: 2.375rem;
    --dashboard-metric-min: 5.375rem;
    --dashboard-metric-pad: 0.875rem 1rem;
    --dashboard-metric-value: 2.125rem;
    height: 100svh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
    gap: var(--workspace-gap);
    padding-top: var(--workspace-pad-top);
    padding-bottom: var(--workspace-pad-bottom);
  }

  .workspace-bar {
    margin-bottom: 0;
  }

  .workspace-bar .eyebrow {
    margin-bottom: 0.625rem;
  }

  .workspace-bar h2 {
    font-size: 3.5rem;
  }

  .workspace-grid {
    min-height: 0;
  }

  .region-panel,
  .decision-panel {
    min-height: 0;
    padding: var(--dashboard-panel-pad);
    overflow: hidden;
  }

  .panel-head {
    margin-bottom: 0.75rem;
  }

  .region-list {
    gap: 0.5rem;
  }

  .region-item {
    min-height: var(--dashboard-item-min);
    padding: var(--dashboard-item-pad);
  }

  .mode-panel {
    margin-top: 0.875rem;
    padding-top: 0.875rem;
  }

  .mode-button {
    min-height: var(--dashboard-mode-min);
  }

  .network-panel {
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr) auto;
  }

  .network-copy {
    padding: 0.875rem 1.125rem 0;
  }

  .network-copy > strong {
    font-size: 1.875rem;
  }

  .network-copy > p,
  .decision-card > p {
    font-size: 0.9375rem;
  }

  .network-map {
    min-height: 0;
  }

  .map-legend {
    padding: 0 1.125rem 0.875rem;
  }

  .decision-card {
    gap: 0.4375rem;
    padding-bottom: 0.75rem;
  }

  .decision-card > strong {
    font-size: 1.6875rem;
  }

  .meter-list {
    gap: 0.5rem;
  }

  .event-stream {
    gap: 0.5625rem;
  }

  .event-list {
    gap: 0.5rem;
  }

  .event-list > li {
    grid-template-columns: 5.375rem 1fr auto;
  }

  .metric-strip {
    min-height: 0;
    margin-top: 0;
  }

  .metric {
    min-height: var(--dashboard-metric-min);
    padding: var(--dashboard-metric-pad);
  }

  .metric > strong {
    font-size: var(--dashboard-metric-value);
  }

  .operations {
    --operations-gap: 1.25rem;
    --operations-tab-min: 3.125rem;
    --operations-panel-pad: 2.375rem;
    --operations-heading-size: 2.625rem;
    --operations-list-top: 1.25rem;
    --operations-timeline-pad: 1.375rem;
    min-height: calc(100svh - var(--nav-height));
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: var(--operations-gap);
    padding-top: 1.75rem;
    padding-bottom: 0.625rem;
  }

  .operations .section-heading {
    margin-bottom: 0;
  }

  .operations .section-heading > .eyebrow {
    margin-bottom: 0.625rem;
  }

  .operations .section-heading > h2 {
    max-width: var(--heading-measure);
    font-size: clamp(3rem, 8cqi, 3.5rem);
  }

  .operations-layout {
    min-height: 0;
  }

  .tabs,
  .timeline {
    min-height: 0;
  }

  .tabs {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .tab-button {
    min-height: var(--operations-tab-min);
  }

  .tab-panel {
    min-height: 0;
    padding: var(--operations-panel-pad);
    overflow: hidden;
  }

  .tab-panel > h3 {
    font-size: var(--operations-heading-size);
  }

  .tab-panel > p {
    font-size: 1.0625rem;
  }

  .tab-panel > ul {
    margin-top: var(--operations-list-top);
  }

  .timeline {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }

  .timeline > div {
    min-height: 0;
    padding: var(--operations-timeline-pad);
    align-content: center;
  }

  .timeline > div > strong {
    font-size: 1.625rem;
  }
}

@media (min-width: 76.3125rem) and (max-height: 55rem) {
  .workspace {
    --workspace-gap: var(--layout-gap-x-tight);
    --workspace-pad-top: var(--panel-pad-x-tight);
    --workspace-pad-bottom: var(--workspace-bottom-gap-short);
    --dashboard-gap: var(--layout-gap-x-tight);
    --dashboard-panel-pad: var(--panel-pad-tight);
    --dashboard-item-min: 2.625rem;
    --dashboard-mode-min: 2.125rem;
    --dashboard-metric-min: 4.125rem;
    --dashboard-metric-pad: 0.6875rem 0.875rem;
    --dashboard-metric-value: 1.625rem;
    gap: var(--workspace-gap);
    padding-top: var(--workspace-pad-top);
    padding-bottom: var(--workspace-pad-bottom);
  }

  .workspace-bar .eyebrow {
    margin-bottom: 0.375rem;
  }

  .workspace-bar h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.375rem, 8cqi, 2.625rem);
  }

  .workspace-grid {
    gap: var(--dashboard-gap);
  }

  .region-panel,
  .decision-panel {
    padding: var(--dashboard-panel-pad);
  }

  .panel-head {
    margin-bottom: 0.625rem;
  }

  .panel-head > strong {
    font-size: 1.125rem;
  }

  .region-item {
    min-height: var(--dashboard-item-min);
  }

  .region-item > span,
  .region-item > strong,
  .mode-button {
    font-size: 0.875rem;
  }

  .mode-panel {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
  }

  .mode-buttons {
    gap: 0.4375rem;
  }

  .mode-button {
    min-height: var(--dashboard-mode-min);
  }

  .network-copy {
    padding: 0.75rem 1rem 0;
  }

  .network-copy > strong {
    font-size: 1.625rem;
  }

  .network-copy > p,
  .decision-card > p {
    font-size: 0.875rem;
  }

  .map-legend {
    gap: 0.5rem;
    padding: 0 1rem 0.75rem;
  }

  .map-legend > span {
    padding: 0.5rem 0.625rem;
    font-size: 0.75rem;
  }

  .decision-card > strong {
    font-size: 1.5rem;
  }

  .event-list,
  .event-list strong,
  .meter-row {
    font-size: 0.75rem;
  }

  .severity {
    min-width: 3.375rem;
    padding: 0.1875rem 0.4375rem;
  }

  .metric-strip {
    gap: var(--layout-gap-tight);
  }

  .metric {
    min-height: var(--dashboard-metric-min);
    padding: var(--dashboard-metric-pad);
  }

  .metric > strong {
    font-size: var(--dashboard-metric-value);
  }

  .operations {
    --operations-gap: 0.875rem;
    --operations-tab-min: 2.625rem;
    --operations-panel-pad: 1.75rem 2.125rem;
    --operations-heading-size: 2rem;
    --operations-list-gap: 0.5625rem;
    --operations-list-top: 1rem;
    --operations-timeline-gap: 0.4375rem;
    --operations-timeline-pad: 1.125rem 1.375rem;
    gap: var(--operations-gap);
    padding-top: 1.375rem;
    padding-bottom: 1.375rem;
  }

  .operations .section-heading > .eyebrow {
    margin-bottom: 0.375rem;
  }

  .operations .section-heading > h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.375rem, 8cqi, 2.625rem);
  }

  .tab-button {
    min-height: var(--operations-tab-min);
  }

  .tab-panel {
    padding: var(--operations-panel-pad);
  }

  .tab-panel > h3 {
    max-width: var(--heading-measure);
    font-size: var(--operations-heading-size);
  }

  .tab-panel > p {
    font-size: 0.9375rem;
  }

  .tab-panel > ul {
    gap: var(--operations-list-gap);
    margin-top: var(--operations-list-top);
    font-size: 0.875rem;
  }

  .timeline > div {
    gap: var(--operations-timeline-gap);
    padding: var(--operations-timeline-pad);
  }

  .timeline > div > strong {
    font-size: 1.4375rem;
  }

  .timeline > div > p {
    font-size: 0.875rem;
  }
}

@media (min-width: 76.3125rem) and (max-height: 48.75rem) {
  .workspace {
    --workspace-gap: 0.4375rem;
    --workspace-pad-top: var(--layout-gap-tight);
    --workspace-pad-bottom: var(--workspace-bottom-gap-x-short);
    --dashboard-panel-pad: var(--panel-pad-x-tight);
    --dashboard-item-min: 2.125rem;
    --dashboard-mode-min: 1.75rem;
    --dashboard-metric-min: 3.75rem;
    --dashboard-metric-pad: 0.625rem 0.75rem;
    --dashboard-metric-value: 1.5rem;
    gap: var(--workspace-gap);
    padding-top: var(--workspace-pad-top);
    padding-bottom: var(--workspace-pad-bottom);
  }

  .workspace-bar .eyebrow {
    margin-bottom: 0.25rem;
  }

  .workspace-bar h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.125rem, 8cqi, 2.375rem);
  }

  .region-panel,
  .decision-panel {
    padding: var(--dashboard-panel-pad);
  }

  .panel-head {
    margin-bottom: 0.5rem;
  }

  .region-list,
  .meter-list,
  .event-list {
    gap: 0.3125rem;
  }

  .region-item {
    min-height: var(--dashboard-item-min);
    padding: 0.375rem 0.5625rem;
  }

  .mode-panel {
    margin-top: 0.375rem;
    padding-top: 0.375rem;
  }

  .mode-buttons {
    gap: 0.3125rem;
    margin-top: 0.375rem;
  }

  .mode-button {
    min-height: var(--dashboard-mode-min);
  }

  .network-copy {
    padding: 0.625rem 0.875rem 0;
  }

  .network-copy > p {
    display: none;
  }

  .map-legend {
    padding: 0 0.875rem 0.625rem;
  }

  .decision-card {
    padding-bottom: 0.625rem;
  }

  .metric {
    min-height: var(--dashboard-metric-min);
    padding: var(--dashboard-metric-pad);
  }

  .metric > strong {
    font-size: var(--dashboard-metric-value);
  }
}

@media (min-width: 76.3125rem) and (max-height: 43.75rem) {
  .public-page .mode-panel {
    display: none;
  }
}

.plant,
.operations,
.use-cases,
.contact {
  padding-top: var(--section-pad-y);
  padding-bottom: var(--section-pad-y);
}

.section-heading {
  display: grid;
  gap: 1.125rem;
  max-width: var(--section-measure);
  margin-bottom: 2.125rem;
}

.section-heading > p {
  max-width: var(--copy-measure);
  font-size: 1.25rem;
}

.plant {
  background: linear-gradient(180deg, rgba(101,210,131,0.048), rgba(255,255,255,0.012));
  border-top: 0.0625rem solid rgba(101,210,131,0.14);
  border-bottom: 0.0625rem solid rgba(255,255,255,0.08);
}

.lighthouse-section {
  background: transparent;
}

.plant-page {
  min-height: calc(100svh - var(--nav-height));
  padding-top: clamp(2.125rem, 5vw, 4.5rem);
}

.plant-page .section-heading {
  margin-bottom: 1.375rem;
}

.plant-page h1 {
  max-width: var(--display-measure);
  font-size: clamp(2.625rem, 10cqi, 5.375rem);
}

.portal-auth {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(min(100%, 20rem), 0.5fr);
  gap: 0.875rem;
  align-items: stretch;
  margin-bottom: 0.875rem;
  padding: 1.125rem;
}

.portal-auth[hidden],
.portal-controls[hidden],
.plant-detail-controls[hidden],
.portal-view[hidden],
.plant-analysis-controls[hidden] {
  display: none;
}

.portal-auth > div {
  min-width: 0;
}

.portal-login {
  display: grid;
  grid-template-columns: auto;
  gap: 0.625rem;
  align-items: start;
  justify-items: start;
}

.portal-login label,
.portal-plant-edit label,
.plant-create-form label {
  display: grid;
  gap: 0.375rem;
  min-width: 0;
}

.portal-login input,
.portal-plant-edit input,
.plant-create-form input,
.contact-form input,
.contact-form select {
  width: 100%;
  min-width: 0;
  min-height: var(--field-min-height);
  padding: 0 var(--field-pad-x);
  border: 0;
  border-radius: var(--radius);
  background: var(--field-bg);
  box-shadow: var(--field-shadow);
  color: var(--text);
  outline: none;
}

.portal-login input:focus,
.portal-plant-edit input:focus,
.plant-create-form input:focus,
.plant-import textarea:focus,
.contact-form input:focus,
.contact-form select:focus {
  border-color: transparent;
  box-shadow: var(--field-focus-shadow);
}

.portal-login .form-message {
  grid-column: 1 / -1;
  min-height: 1.125rem;
}

.portal-controls,
.portal-card-actions,
.plant-detail-controls,
.plant-analysis-controls,
.plant-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.portal-shell .topbar {
  grid-template-columns: minmax(0, 1fr) auto;
}

.portal-shell .portal-top-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.portal-shell .portal-controls {
  justify-content: flex-end;
}

.portal-shell .portal-controls span {
  max-width: 34vw;
  min-height: 2.375rem;
  display: inline-flex;
  align-items: center;
  padding: 0 0.75rem;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-tabs,
.plant-segment,
.plant-chart-controls,
.plant-section-tabs {
  --segment-bg: var(--surface-sunken);
  --segment-button-flex: initial;
  --segment-button-min: 2.125rem;
  --segment-button-pad-x: 0.75rem;
  --segment-button-weight: 600;
  --segment-gap: 0.25rem;
  --segment-shadow: none;
  --segment-wrap: nowrap;
  display: flex;
  align-items: center;
  gap: var(--segment-gap);
  flex-wrap: var(--segment-wrap);
  padding: 0.25rem;
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-control-bg);
  box-shadow: var(--surface-depth-low), var(--segment-shadow);
}

.portal-tabs button,
.plant-segment button,
.plant-chart-controls button,
.plant-section-tabs button {
  flex: var(--segment-button-flex);
  min-height: var(--segment-button-min);
  padding: 0 var(--segment-button-pad-x);
  border: 0;
  border-radius: calc(var(--radius) - 0.125rem);
  background: transparent;
  color: var(--muted);
  font-size: 0.8125rem;
  font-weight: var(--segment-button-weight);
  cursor: pointer;
}

.portal-tabs button.active,
.plant-segment button.active,
.plant-chart-controls button.active,
.plant-section-tabs button.active {
  background: var(--surface-active-bg);
  color: #fff;
  box-shadow: var(--surface-active-shadow);
}

.portal-tabs button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.portal-controls span,
.plant-detail-title {
  color: var(--muted);
  font-size: 0.8125rem;
}

.portal-controls .portal-action-message {
  min-width: min(13.125rem, 100%);
  color: var(--muted-2);
}

.portal-locked .plant-layout,
.portal-locked .plant-toolbar-actions,
.portal-locked .portal-view {
  display: none;
}

.portal-home-view,
.portal-create-view,
.plant-ftp-view {
  display: grid;
  gap: 0.875rem;
  margin-bottom: 0.875rem;
}

.portal-home-head,
.plant-view-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.875rem;
  padding: 1rem;
}

.portal-home-head > div,
.plant-view-head > div {
  min-width: 0;
}

.portal-home-head > div:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
}

.portal-home-head > div > span,
.plant-view-head > div > span,
.portal-plant-card-head > div > span,
.portal-status-badge,
.portal-plant-metrics > div > span,
.portal-plant-edit label > span {
  overflow-wrap: anywhere;
}

.portal-auth > div > strong,
.portal-home-head > div > strong,
.plant-view-head > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.75rem;
  line-height: 1.08;
}

.portal-auth > div > p,
.portal-home-head > div > p,
.plant-view-head > div > p,
.portal-plant-card p {
  margin-top: 0.5rem;
  color: var(--muted);
  line-height: 1.42;
}

.portal-home-head .portal-action-message {
  text-align: right;
  text-transform: none;
}

.portal-create-layout {
  display: grid;
  grid-template-columns: minmax(min(100%, 17.5rem), 32.5rem);
  gap: 0.875rem;
  align-items: start;
}

.portal-plant-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.875rem;
  min-width: 0;
}

.portal-empty-state,
.portal-plant-card {
  padding: 1rem;
}

.portal-empty-state {
  grid-column: 1 / -1;
}

.portal-empty-state strong {
  display: block;
  font-size: 1.375rem;
}

.portal-empty-state p {
  margin-top: 0.5rem;
  color: var(--muted);
}

.portal-plant-card {
  display: grid;
  gap: 0.75rem;
}

.portal-plant-card.active {
  border-color: rgba(139, 92, 246, 0.44);
}

.portal-plant-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
}

.portal-plant-card-head > div {
  min-width: 0;
}

.portal-plant-card-head > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.5rem;
  line-height: 1.12;
  overflow-wrap: break-word;
}

.portal-status-badge {
  --status-line: rgba(255,255,255,0.12);
  --status-bg: rgba(255,255,255,0.04);
  --status-text: var(--muted);
  flex: 0 0 auto;
  padding: 0.375rem 0.5rem;
  border: 0;
  border-radius: 62.4375rem;
  background: var(--status-bg);
  box-shadow: inset 0 0.0625rem 0 rgba(255,255,255,0.055), inset 0 0 0 0.0625rem var(--status-line);
  color: var(--status-text);
  font-size: 0.6875rem;
}

.portal-status-badge.ready {
  --status-line: rgba(101,210,131,0.42);
  --status-bg: rgba(101,210,131,0.12);
  --status-text: #c9ffd5;
}

.portal-status-badge.watch {
  --status-line: rgba(243,182,75,0.44);
  --status-bg: rgba(243,182,75,0.12);
  --status-text: #ffe4a8;
}

.portal-status-badge.error {
  --status-line: rgba(239,107,107,0.5);
  --status-bg: rgba(239,107,107,0.12);
  --status-text: #ffc8c8;
}

.portal-plant-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.portal-plant-metrics div {
  min-width: 0;
  padding: 0.625rem;
  border: 0.0625rem solid var(--line-card);
  border-radius: var(--radius);
  background: var(--panel-inset);
}

.portal-plant-metrics > div > strong {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.875rem;
  line-height: 1.2;
  overflow-wrap: break-word;
}

.portal-plant-activity {
  min-height: 1.25rem;
  font-size: 0.8125rem;
}

.plant-detail-title {
  min-width: 0;
  max-width: min(21.25rem, 42vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-plant-edit {
  --field-min-height: 2.75rem;
  --field-pad-x: 0.625rem;
  min-width: 0;
  border-top: 0.0625rem solid var(--line-soft);
  padding-top: 0.625rem;
}

.portal-plant-edit summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 0.8125rem;
  font-weight: 850;
}

.portal-plant-edit form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 0.5rem;
  align-items: end;
  margin-top: 0.625rem;
}

.plant-ftp-layout {
  display: grid;
  gap: 0.875rem;
}

.plant-ftp-layout .plant-status-panel,
.plant-ftp-layout .plant-ftp-panel,
.plant-ftp-layout .plant-events-panel,
.portal-create-layout .plant-create-form {
  grid-area: auto;
}

.plant-create-form,
.plant-ftp-panel,
.plant-events-panel {
  padding: 1rem;
}

.plant-create-form {
  display: grid;
  grid-area: create;
  gap: 0.625rem;
  align-content: start;
}

.plant-create-form > div {
  min-width: 0;
}

.plant-create-form > div > strong,
.plant-ftp-head > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.3125rem;
  line-height: 1.12;
}

.plant-status-panel {
  display: grid;
  grid-area: status;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-content: stretch;
}

.plant-status-panel div {
  min-width: 0;
  padding: 1rem;
  border-right: 0.0625rem solid var(--line-soft);
}

.plant-status-panel div:last-child {
  border-right: 0;
}

.plant-status-panel > div > strong {
  display: block;
  margin-top: 0.4375rem;
  font-size: 1.0625rem;
  line-height: 1.18;
  overflow-wrap: break-word;
}

.plant-ftp-panel,
.plant-events-panel {
  grid-column: auto;
}

.plant-ftp-panel { grid-area: ftp; }
.plant-events-panel {
  display: grid;
  grid-column: 1 / -1;
  align-content: start;
  gap: 0.75rem;
}

.plant-ftp-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.plant-ftp-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}

.plant-ftp-grid div {
  min-width: 0;
  padding: 0.75rem;
  border: 0.0625rem solid var(--line-card);
  border-radius: var(--radius);
  background: var(--panel-inset);
}

.plant-ftp-grid > div > strong {
  display: block;
  margin-top: 0.375rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.plant-import-events li {
  grid-template-columns: minmax(min(100%, 7.5rem), 0.55fr) 1fr minmax(min(100%, 7.5rem), 0.45fr);
}

.plant-import-events {
  max-height: min(26.25rem, 48vh);
  overflow-y: auto;
  padding-right: 0.25rem;
  scrollbar-color: rgba(247,248,242,0.32) rgba(255,255,255,0.06);
}

.plant-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.875rem;
  margin-bottom: 0.875rem;
}

.plant-segment,
.plant-chart-controls {
  --segment-gap: 0.5rem;
  --segment-wrap: wrap;
}

.plant-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.875rem;
  align-items: start;
}

.plant-status-hero,
.plant-chart-panel,
.plant-data-panel,
.plant-overview,
.plant-devices,
.plant-days,
.plant-import {
  padding: 1.125rem;
}

.plant-data-panel[hidden] {
  display: none;
}

.plant-data-panel {
  display: grid;
  gap: 0.875rem;
}

.plant-balance-panel,
.plant-history-panel {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.plant-history-panel {
  display: grid;
  gap: 0.875rem;
}

.plant-import > div {
  min-width: 0;
}

.plant-status-hero {
  display: grid;
  gap: 0.875rem;
}

.plant-status-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 13.125rem), 0.28fr);
  gap: 1.125rem;
  align-items: start;
}

.plant-status-main > div,
.plant-status-metrics div,
.plant-chart-head > div,
.plant-section-tabs {
  min-width: 0;
}

.plant-status-main > div > strong {
  display: block;
  font-size: 2.125rem;
  line-height: 1.02;
  overflow-wrap: break-word;
}

.plant-status-main > div > p {
  max-width: var(--copy-measure);
  margin-top: 0.625rem;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.42;
}

.plant-status-state {
  text-align: right;
}

.plant-status-state > strong {
  font-size: 1.75rem;
}

.plant-status-state time {
  display: block;
  margin-top: 0.5rem;
  color: var(--muted);
  font-size: 0.8125rem;
}

.plant-profile-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(min(100%, 16.25rem), 0.85fr);
  gap: 0.875rem;
  margin-bottom: 1rem;
  padding: 0.875rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: var(--surface-sunken);
}

.plant-profile-card > div {
  min-width: 0;
}

.plant-profile-card > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.375rem;
  line-height: 1.14;
}

.plant-profile-card > div > p {
  margin-top: 0.5rem;
  color: var(--muted);
  font-size: 0.875rem;
  line-height: 1.42;
}

.plant-capability-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.625rem;
}

.plant-capability-groups ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-top: 0.5rem;
  padding: 0;
  list-style: none;
}

.plant-capability-groups li {
  padding: 0.375rem 0.5rem;
  border: 0.0625rem solid rgba(255,255,255,0.12);
  border-radius: 62.4375rem;
  background: rgba(255,255,255,0.04);
  color: var(--muted);
  font-size: 0.75rem;
  line-height: 1.2;
}

.plant-kpis,
.plant-status-metrics,
.plant-period-kpis {
  display: grid;
  gap: 0.625rem;
}

.plant-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 1rem;
}

.plant-kpis div,
.plant-status-metrics div,
.plant-period-kpis div {
  min-width: 0;
  padding: 0.875rem;
  border: 0.0625rem solid var(--line-card);
  border-radius: var(--radius);
  background: rgba(0,0,0,0.24);
}

.plant-status-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.plant-status-metrics > div > strong,
.plant-kpis > div > strong {
  display: block;
  margin-top: 0.5rem;
  font-size: 2.125rem;
  line-height: 1.22;
  overflow-wrap: break-word;
}

.plant-section-tabs {
  --segment-bg: var(--panel-solid);
  --segment-button-flex: 0 0 auto;
  --segment-button-min: 2.375rem;
  --segment-button-pad-x: 0.875rem;
  --segment-button-weight: 700;
  --segment-shadow: var(--shadow);
  overflow-x: auto;
  scrollbar-width: none;
}

.plant-section-tabs::-webkit-scrollbar {
  display: none;
}

.plant-balance-board {
  display: grid;
  gap: 0.75rem;
  padding: 1rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background:
    linear-gradient(rgba(255,255,255,0.032) 0.0625rem, transparent 0.0625rem),
    linear-gradient(90deg, rgba(255,255,255,0.032) 0.0625rem, transparent 0.0625rem),
    rgba(0,0,0,0.2);
  background-size: 2.75rem 2.75rem;
}

.plant-balance-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.875rem;
}

.plant-balance-head div {
  min-width: 0;
}

.plant-balance-head > div > strong {
  display: block;
  margin-top: 0.1875rem;
  font-size: 1.125rem;
  line-height: 1.18;
}

.plant-balance-head time {
  color: var(--muted);
  font-size: 0.8125rem;
  white-space: nowrap;
}

.plant-balance-board > p {
  max-width: var(--wide-copy-measure);
  color: var(--muted);
  font-size: 0.875rem;
  line-height: 1.38;
}

.plant-balance-totals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
}

.plant-balance-totals div {
  min-width: 0;
  padding: 0.75rem;
  border: 0.0625rem solid var(--line-card);
  border-radius: var(--radius);
  background: rgba(7, 8, 6, 0.58);
}

.plant-balance-totals > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.375rem;
  line-height: 1.12;
  overflow-wrap: break-word;
}

.plant-balance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.625rem;
}

.plant-account-column {
  display: grid;
  align-content: start;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.625rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: rgba(7, 8, 6, 0.44);
}

.plant-account-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.25rem 0.125rem 0.5rem;
  border-bottom: 0.0625rem solid var(--line-hairline);
}

.plant-account-title > strong {
  font-size: 1rem;
  white-space: nowrap;
}

.plant-account-row {
  --level: 0%;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  min-height: 4.5rem;
  padding: 0.75rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: var(--panel-ghost);
  overflow: hidden;
}

.plant-account-row > i {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--level);
  opacity: 0.18;
  transition: width 420ms ease;
}

.plant-account-row.source > i { background: var(--green); }
.plant-account-row.grid > i { background: var(--cyan); }
.plant-account-row.curtailment > i { background: var(--amber); }
.plant-account-row.storage > i { background: var(--violet); }
.plant-account-row.residual > i { background: var(--text); }

.plant-account-row > div,
.plant-account-row > strong {
  position: relative;
  z-index: 1;
}

.plant-account-row em {
  display: block;
  margin-top: 0.1875rem;
  color: var(--muted);
  font-size: 0.75rem;
  font-style: normal;
}

.plant-account-row > strong {
  font-size: 1.25rem;
  line-height: 1.12;
  text-align: right;
  white-space: nowrap;
}

.plant-account-row.muted {
  color: var(--muted);
}

.plant-balance-equation {
  padding: 0.625rem 0.75rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: rgba(7, 8, 6, 0.58);
  color: var(--muted);
  font-size: 0.8125rem;
  line-height: 1.35;
}

.plant-period-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 0.75rem;
}

.plant-period-kpis > div > strong {
  display: block;
  margin-top: 0.375rem;
  font-size: 1.5rem;
  line-height: 1.12;
}

.plant-chart-controls {
  margin-top: 0;
}

.plant-chart-panel {
  display: grid;
  gap: 0.875rem;
}

.plant-chart-head,
.plant-chart-footer {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.875rem;
  min-width: 0;
}

.plant-chart-head > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.625rem;
  line-height: 1.1;
}

.plant-chart-wrap {
  position: relative;
  min-height: var(--chart-block-size);
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background:
    linear-gradient(var(--panel-ghost) 0.0625rem, transparent 0.0625rem),
    linear-gradient(90deg, var(--panel-ghost) 0.0625rem, transparent 0.0625rem),
    rgba(0,0,0,0.2);
  background-size: 3.25rem 3.25rem;
  overflow: hidden;
}

.plant-chart-wrap canvas {
  width: 100%;
  height: var(--chart-block-size);
  display: block;
}

.plant-chart-tooltip {
  position: absolute;
  z-index: 2;
  display: none;
  min-width: 10.625rem;
  padding: 0.625rem 0.75rem;
  border: 0.0625rem solid rgba(139, 92, 246, 0.3);
  border-radius: var(--radius);
  background: rgba(7, 8, 6, 0.94);
  box-shadow: 0 0.875rem 2.5rem rgba(0, 0, 0, 0.34);
  color: var(--muted);
  font-size: 0.75rem;
  pointer-events: none;
}

.plant-chart-tooltip.active {
  display: grid;
  gap: 0.25rem;
}

.plant-chart-tooltip strong {
  color: var(--text);
  font-size: 0.8125rem;
}

.plant-chart-tooltip span {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.plant-chart-tooltip em {
  font-style: normal;
}

.plant-chart-tooltip b {
  color: var(--text);
}

.plant-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.125rem;
  align-items: center;
  min-height: 1.75rem;
  margin-top: 0;
  color: var(--muted);
  font-size: 0.75rem;
}

.plant-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  white-space: nowrap;
}

.plant-chart-legend i {
  width: 1.125rem;
  height: 0.1875rem;
  border-radius: 62.4375rem;
  flex: 0 0 auto;
  background: rgba(247,248,242,0.62);
}

.plant-chart-line-active-power,
.plant-chart-line-meter-power {
  background: rgba(53, 212, 232, 0.95);
}

.plant-chart-line-available-power {
  background: rgba(101, 210, 131, 0.72);
}

.plant-chart-line-irradiance {
  background: rgba(243, 182, 75, 0.92);
}

.plant-chart-line-module-temp {
  background: rgba(239, 107, 107, 0.8);
}

.plant-chart-line-curtailment {
  background: rgba(243, 182, 75, 0.95);
}

.plant-chart-line-setpoint {
  background: rgba(53, 212, 232, 0.82);
}

.plant-chart-line-battery-soc {
  background: rgba(101, 210, 131, 0.9);
}

.plant-chart-line-battery-stored {
  background: rgba(139, 92, 246, 0.78);
}

.plant-chart-line-frequency {
  background: rgba(53, 212, 232, 0.92);
}

.plant-chart-line-grid-limit {
  background: rgba(101, 210, 131, 0.78);
}

.plant-recommendations li {
  grid-template-columns: minmax(min(100%, 4.625rem), 0.5fr) 1fr auto;
}

.plant-recommendations p {
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.75rem;
  line-height: 1.35;
}

.plant-devices,
.plant-days {
  display: grid;
  grid-column: 1 / -1;
  gap: 0.75rem;
}

.plant-device-table,
.plant-day-table {
  display: grid;
  gap: 0.5rem;
}

.plant-device-row,
.plant-day-row {
  display: grid;
  gap: 0.75rem;
  align-items: center;
  min-height: 3.625rem;
  padding: 0.75rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: var(--panel-ghost);
}

.plant-device-row {
  grid-template-columns: minmax(min(100%, 13.75rem), 0.9fr) minmax(min(100%, 8.125rem), 0.45fr) minmax(min(100%, 20rem), 1.35fr);
  align-items: start;
}

.plant-day-row {
  grid-template-columns: minmax(min(100%, 7.5rem), 0.8fr) repeat(5, minmax(min(100%, 6.25rem), 1fr));
}

.plant-day-header {
  min-height: auto;
  padding-block: 0.25rem;
  border-color: transparent;
  background: transparent;
}

.plant-empty-row {
  padding: 0.75rem;
  border: 0.0625rem solid var(--line-soft);
  border-radius: var(--radius);
  background: var(--panel-ghost);
  color: var(--muted);
  font-size: 0.8125rem;
}

.plant-device-meta,
.plant-device-detail,
.plant-day-row span,
.plant-day-row strong {
  min-width: 0;
}

.plant-day-row span,
.plant-day-row strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.plant-device-meta span,
.plant-device-detail,
.plant-day-row span {
  color: var(--muted);
  font-size: 0.8125rem;
}

.plant-device-meta strong,
.plant-device-primary,
.plant-day-row strong {
  display: block;
  font-size: 0.875rem;
}

.plant-device-primary {
  font-size: 1.125rem;
  line-height: 1.14;
}

.plant-device-detail {
  line-height: 1.35;
  white-space: normal;
}

.plant-day-row:not(.plant-day-header) span::before,
.plant-day-row:not(.plant-day-header) strong::before {
  display: none;
}

.plant-import {
  --field-bg: var(--surface-sunken);
  --field-border: var(--field-border-strong);
  grid-column: 1 / -1;
  display: grid;
  align-content: start;
  gap: 0.75rem;
}

.plant-import > div > strong {
  display: block;
  margin-top: 0.3125rem;
  font-size: 1.75rem;
  line-height: 1.06;
}

.plant-import > div > p {
  margin-top: 0.5rem;
  color: var(--muted);
  font-size: 0.875rem;
}

.plant-import textarea {
  width: 100%;
  min-height: 11.25rem;
  min-width: 0;
  padding: 0.875rem;
  border: 0.0625rem solid var(--field-border);
  border-radius: var(--radius);
  background: var(--field-bg);
  color: var(--text);
  font: inherit;
  resize: vertical;
  outline: none;
}

.plant-import-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.625rem;
  align-items: center;
}

.plant-import input[type="file"] {
  min-width: 0;
  color: var(--muted);
  font-size: 0.8125rem;
}

.operations-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(min(100%, 18.75rem), 0.8fr);
  gap: var(--operations-gap, var(--layout-gap));
}

.operations-layout > * {
  min-width: 0;
  max-width: 100%;
}

.site-page .site-main > .hero + .operations:has(> .page-legal-link) > .operations-layout {
  grid-template-columns: minmax(0, 1fr);
}

.tabs,
.timeline {
  min-width: 0;
  max-width: 100%;
}

.tab-buttons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 0.0625rem solid var(--line-hairline);
}

.tab-button {
  min-height: var(--operations-tab-min, 3.625rem);
  border: 0;
  border-right: 0.0625rem solid var(--line-hairline);
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  font-weight: 600;
}

.tab-button:last-child { border-right: 0; }
.tab-button.active {
  background: linear-gradient(135deg, rgba(247,248,242,0.16), rgba(139, 92, 246, 0.2));
  color: #fff;
  box-shadow: inset 0 0.0625rem 0 rgba(255,255,255,0.07);
}

.tab-panel {
  display: none;
  padding: var(--operations-panel-pad, clamp(1.5rem, 4vw, 3rem));
}

.tab-panel.active {
  display: block;
  animation: fadeUp .22s ease both;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(0.5rem); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeOnly {
  from { opacity: 0; }
  to { opacity: 1; }
}

.tab-panel > h3 {
  max-width: var(--heading-measure);
  margin-bottom: 0.75rem;
  font-size: var(--operations-heading-size, var(--compact-heading-fluid));
  line-height: 1.02;
}

.tab-panel > p {
  max-width: var(--copy-measure);
  font-size: 1.125rem;
}

.tab-panel > ul {
  display: grid;
  gap: var(--operations-list-gap, 0.75rem);
  margin-top: var(--operations-list-top, 1.5rem);
  list-style: none;
  color: var(--muted);
}

.tab-panel > ul > li {
  display: flex;
  gap: 0.625rem;
}

.tab-panel > ul > li::before {
  content: "";
  width: 0.4375rem;
  height: 0.4375rem;
  margin-top: 0.5625rem;
  border-radius: 50%;
  background: var(--violet);
  flex: 0 0 auto;
}

.timeline {
  position: relative;
  display: grid;
  gap: 0;
  border: 0;
  background:
    linear-gradient(145deg, rgba(247,248,242,0.058), rgba(247,248,242,0.026) 42%, rgba(139, 92, 246, 0.052)),
    rgba(7, 8, 6, 0.38);
  box-shadow: var(--surface-depth);
  isolation: isolate;
  overflow: hidden;
}

.timeline::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background: var(--surface-edge);
  pointer-events: none;
}

.timeline > div {
  position: relative;
  z-index: 1;
  display: grid;
  gap: var(--operations-timeline-gap, 0.5625rem);
  min-height: var(--timeline-row-min);
  padding: var(--operations-timeline-pad, 1.5rem);
}

.timeline > div:not(:last-child)::after {
  content: "";
  position: absolute;
  right: clamp(1.125rem, 5%, 2.375rem);
  bottom: 0;
  left: clamp(1.125rem, 5%, 2.375rem);
  height: 0.0625rem;
  background: var(--surface-divider);
  opacity: 0.82;
  pointer-events: none;
}

.timeline > div > span { color: #c9bbff; font-size: 0.75rem; font-weight: 850; }
.timeline > div > strong { font-size: 1.75rem; line-height: 1; }

.lighthouse-panel {
  display: grid;
  align-content: start;
  gap: 1.375rem;
  padding: clamp(1.5rem, 4vw, 2.625rem);
}

.lighthouse-lockup {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.lighthouse-lockup > div > strong {
  display: block;
  margin-top: 0.25rem;
  font-size: 2.625rem;
  line-height: 1;
}

.lighthouse-panel > p {
  max-width: var(--copy-measure);
  color: var(--muted);
  font-size: 1.125rem;
}

.lighthouse-console {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
}

.lighthouse-console > div {
  display: grid;
  align-content: start;
  gap: 0.625rem;
  min-height: var(--console-card-min);
  padding: 1.5rem;
  border-right: 0.0625rem solid var(--line-hairline);
  border-bottom: 0.0625rem solid var(--line-hairline);
}

.lighthouse-console > div:nth-child(2n) { border-right: 0; }
.lighthouse-console > div:nth-last-child(-n + 2) { border-bottom: 0; }

.lighthouse-console > div > strong {
  font-size: 1.875rem;
  line-height: 1.05;
}

.lighthouse-console > div > p {
  color: var(--muted);
  font-size: 0.9375rem;
}

.contact {
  min-height: calc(100svh - var(--nav-height) + 5rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 22.5rem), 0.62fr);
  gap: clamp(1.5rem, 6vw, 5.5rem);
  align-items: center;
}

.contact-copy > p {
  max-width: var(--copy-measure);
  margin-top: 1.375rem;
  font-size: 1.375rem;
}

.contact-form {
  --field-bg: var(--surface-sunken);
  --field-border: var(--field-border-strong);
  --field-min-height: 3.25rem;
  --field-pad-x: 0.875rem;
  display: grid;
  gap: 0.75rem;
  padding: 1.375rem;
  border: 0.0625rem solid rgba(247,248,242,0.13);
  border-radius: var(--radius);
  background: var(--panel-subtle);
  box-shadow: inset 0 0.0625rem 0 rgba(255,255,255,0.045), 0 0 2.625rem rgba(139, 92, 246, 0.07);
}

.contact-form select { color-scheme: dark; }

.form-message {
  min-height: 1.375rem;
  color: var(--muted);
  font-size: 0.875rem;
}

@media (min-width: 76.3125rem) {
  .workspace {
    --workspace-pad-top: var(--viewport-frame);
    --workspace-pad-bottom: var(--viewport-frame);
  }

  .operations,
  .use-cases,
  .contact {
    min-height: var(--viewport-block);
    padding-top: var(--viewport-frame);
    padding-bottom: var(--viewport-frame);
  }

  .operations,
  .use-cases {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: var(--operations-gap, 1.25rem);
  }

  .operations .section-heading,
  .use-cases .section-heading {
    margin-bottom: 0;
  }

  .operations .section-heading > .eyebrow,
  .use-cases .section-heading > .eyebrow {
    margin-bottom: 0.625rem;
  }

  .operations .section-heading > h2,
  .use-cases .section-heading > h2 {
    max-width: var(--heading-measure);
    font-size: clamp(3rem, 8cqi, 3.5rem);
  }

  .operations-layout {
    min-height: 0;
  }

  .tabs,
  .timeline {
    min-height: 0;
  }

  .tabs {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .tab-button {
    min-height: var(--operations-tab-min, 3.125rem);
  }

  .tab-panel {
    min-height: 0;
    padding: var(--operations-panel-pad, 2.375rem);
    overflow: hidden;
  }

  .tab-panel > h3 {
    font-size: var(--operations-heading-size, 2.625rem);
  }

  .tab-panel > p {
    font-size: 1.0625rem;
  }

  .tab-panel > ul {
    margin-top: var(--operations-list-top, 1.25rem);
  }

  .timeline {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }

  .timeline > div {
    min-height: 0;
    padding: var(--operations-timeline-pad, 1.375rem);
    align-content: center;
  }

  .timeline > div > strong {
    font-size: 1.625rem;
  }

  .lighthouse-console {
    min-height: 0;
    height: 100%;
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }

  .lighthouse-console > div {
    min-height: 0;
  }

  .contact {
    grid-template-columns: minmax(0, 1fr) minmax(min(100%, 20rem), 0.55fr);
  }

  .contact-copy > p {
    max-width: var(--copy-measure);
    margin-top: 1.125rem;
    font-size: 1.25rem;
  }

  .contact-form {
    padding: 1.25rem;
  }
}

@media (min-width: 76.3125rem) and (max-height: 55rem) {
  .operations,
  .use-cases,
  .contact {
    padding-top: var(--viewport-frame);
    padding-bottom: var(--viewport-frame);
  }

  .operations,
  .use-cases {
    gap: var(--operations-gap, 0.875rem);
  }

  .operations .section-heading > .eyebrow,
  .use-cases .section-heading > .eyebrow {
    margin-bottom: 0.375rem;
  }

  .operations .section-heading > h2,
  .use-cases .section-heading > h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.375rem, 8cqi, 2.625rem);
  }

  .tab-button {
    min-height: var(--operations-tab-min, 2.625rem);
  }

  .tab-panel {
    padding: var(--operations-panel-pad, 1.75rem 2.125rem);
  }

  .tab-panel > h3 {
    max-width: var(--heading-measure);
    font-size: var(--operations-heading-size, 2rem);
  }

  .tab-panel > p {
    font-size: 0.9375rem;
  }

  .tab-panel > ul {
    gap: var(--operations-list-gap, 0.5625rem);
    margin-top: var(--operations-list-top, 1rem);
    font-size: 0.875rem;
  }

  .timeline > div {
    gap: var(--operations-timeline-gap, 0.4375rem);
    padding: var(--operations-timeline-pad, 1.125rem 1.375rem);
  }

  .timeline > div > strong {
    font-size: 1.4375rem;
  }

  .timeline > div > p {
    font-size: 0.875rem;
  }

  .lighthouse-console > div {
    gap: 0.5rem;
    padding: 1.125rem 1.25rem;
  }

  .lighthouse-console > div > strong {
    font-size: clamp(1.5rem, 3.4svh, 1.875rem);
  }

  .lighthouse-console > div > p {
    font-size: 0.875rem;
    line-height: 1.3;
  }

  .contact-copy > p {
    font-size: 0.9375rem;
  }

  .contact-form {
    padding: 1.125rem;
  }

  .contact-form input,
  .contact-form select {
    min-height: var(--control-min);
  }
}

@media (min-width: 105rem) and (min-height: 61.25rem) {
  :root {
    --section-heading-size: 4.75rem;
  }

  .hero {
    min-height: var(--viewport-block);
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
  }

  h1 { font-size: clamp(5.5rem, 12cqi, 7.75rem); }
  .hero-copy > p { font-size: 1.5rem; }
  .hero-kpis > div > strong,
  .hero-product-pills > a > strong { font-size: 2.875rem; }
}

@media (min-width: 105rem) and (max-height: 56.25rem) {
  .hero {
    min-height: var(--viewport-block);
    padding-top: 3.375rem;
    padding-bottom: 3.375rem;
  }

  h1 {
    max-width: var(--display-measure);
    font-size: clamp(4.5rem, 12cqi, 6rem);
    line-height: 1.05;
  }

  .hero-copy > p {
    margin-top: 1.125rem;
    font-size: 1.25rem;
  }

  .hero-actions { margin-top: 1.375rem; }
  .hero-kpis > div { min-height: 5.125rem; }
  .hero-kpis > div > strong,
  .hero-product-pills > a > strong { font-size: 2.25rem; }
}

@media (min-width: 76.3125rem) and (max-width: 93.75rem) {
  :root {
    --section-heading-size: 3.625rem;
  }

  .hero {
    gap: 2.5rem;
    padding-top: 3.375rem;
    padding-bottom: 3.375rem;
  }

  h1 {
    max-width: var(--display-measure);
    font-size: clamp(4rem, 12cqi, 5.5rem);
    line-height: 1.05;
  }

  .hero-copy > p { font-size: 1.25rem; }
  .workspace-grid {
    grid-template-columns: minmax(min(100%, 13.125rem), 0.55fr) minmax(min(100%, 30rem), 1.85fr) minmax(min(100%, 17.5rem), 0.85fr);
  }
}

@media (min-width: 76.3125rem) and (max-width: 93.75rem) and (max-height: 55rem) {
  .workspace-bar h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.375rem, 8cqi, 2.625rem);
  }
}

@media (min-width: 76.3125rem) and (max-width: 93.75rem) and (max-height: 48.75rem) {
  .workspace-bar h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.125rem, 8cqi, 2.375rem);
  }
}

@media (max-width: 76.25rem) {
  :root {
    --section-heading-size: 3.25rem;
  }

  .hero,
  .workspace-grid,
  .portal-create-layout,
  .plant-layout,
  .operations-layout,
  .contact {
    grid-template-columns: 1fr;
  }

  .region-panel {
    display: grid;
    grid-template-columns: minmax(min(100%, 13.125rem), 0.35fr) 1fr;
    gap: 1.125rem;
  }

  .mode-panel {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  .mode-buttons { grid-template-columns: repeat(3, 1fr); }
  .portal-auth { grid-template-columns: 1fr; }
  .plant-profile-card { grid-template-columns: 1fr; }
  .plant-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plant-period-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  h1 { font-size: 4.875rem; }
  .hero {
    min-height: auto;
    padding-top: 3.875rem;
    padding-bottom: 3.875rem;
  }
  .hero-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 68.75rem) {
  :root { --nav-height: 4.25rem; }
  html.public-page {
    scroll-padding-top: var(--nav-height);
  }

  .topbar,
  .portal-shell .topbar {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .nav-links { display: none; }
  .mobile-toggle { display: block; }
}

@media (min-width: 53.8125rem) and (max-width: 68.75rem) {
  :root { --nav-height: 4.375rem; }
}

@media (max-width: 76.25rem) {
  .workspace-bar {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .workspace-actions {
    flex-wrap: wrap;
    white-space: normal;
  }

  .public-page .tabs {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }
}

@media (min-width: 53.8125rem) and (max-width: 76.25rem) {
  .public-page .page-section {
    min-height: var(--viewport-block);
    display: grid;
    align-content: center;
    gap: var(--viewport-gap);
    padding-top: var(--viewport-frame);
    padding-bottom: var(--viewport-frame);
  }

  .public-page .section-heading {
    margin-bottom: 0;
  }

  .public-page .operations-layout {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--auto-card-min)), 1fr));
    gap: var(--compact-panel-gap);
  }

  .public-page .lighthouse-panel,
  .public-page .contact-form {
    padding: var(--compact-panel-pad);
  }

  .public-page .lighthouse-panel > p,
  .public-page .tab-panel > p,
  .public-page .tab-panel > ul,
  .public-page .timeline > div > p {
    font-size: clamp(0.875rem, 4cqi, 1rem);
    line-height: 1.34;
  }

  .public-page .workspace {
    --dashboard-panel-pad: var(--compact-panel-pad);
    --dashboard-gap: var(--compact-panel-gap);
    --dashboard-item-min: clamp(2.5rem, 6svh, 3rem);
    --dashboard-item-pad: 0.5625rem 0.6875rem;
    --dashboard-mode-min: clamp(2.125rem, 5.2svh, 2.5rem);
    --dashboard-metric-min: var(--compact-metric-min);
    --dashboard-metric-pad: clamp(0.625rem, 1.6vmin, 0.875rem);
    --dashboard-metric-value: clamp(1.5rem, 3vw, 2rem);
  }

  .public-page .workspace-bar h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.25rem, 8cqi, 3.125rem);
  }

  .public-page .workspace-grid {
    display: grid;
    grid-template-columns: minmax(min(100%, 11.25rem), 0.62fr) minmax(min(100%, 20rem), 1.36fr) minmax(min(100%, 13.75rem), 0.82fr);
    grid-template-areas: "region network decision";
    align-items: start;
    gap: var(--compact-panel-gap);
  }

  .public-page .region-panel {
    grid-area: region;
    grid-template-columns: 1fr;
    gap: var(--compact-panel-gap);
  }

  .public-page .panel-head {
    margin-bottom: 0.625rem;
  }

  .public-page .region-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.375rem;
  }

  .public-page .region-item {
    gap: 0.375rem;
    min-height: clamp(2.375rem, 5.4svh, 2.875rem);
    padding: 0.5rem;
  }

  .public-page .mode-panel {
    margin-top: 0;
    padding-top: 0;
  }

  .public-page .mode-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.375rem;
  }

  .public-page .mode-button {
    min-height: clamp(2.125rem, 4.8svh, 2.5rem);
    padding-inline: 0.3125rem;
    font-size: 0.75rem;
    line-height: 1.12;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .public-page .network-panel {
    grid-area: network;
    grid-template-rows: auto var(--compact-map-min) auto;
  }

  .public-page .decision-panel {
    grid-area: decision;
    grid-template-columns: minmax(0, 1fr);
  }

  .public-page .region-panel,
  .public-page .network-panel,
  .public-page .decision-panel {
    align-self: start;
  }

  .public-page .network-map {
    height: var(--compact-map-min);
    min-height: 0;
  }

  .public-page .network-copy > strong {
    font-size: clamp(1.75rem, 8cqi, 2rem);
  }

  .public-page .network-copy > p,
  .public-page .decision-card > p {
    font-size: 0.875rem;
    line-height: 1.34;
  }

  .public-page .decision-card {
    gap: 0.4375rem;
    min-width: 0;
    padding-bottom: 0.6875rem;
  }

  .public-page .decision-card > strong {
    font-size: clamp(1.5rem, 8cqi, 1.75rem);
  }

  .public-page .event-stream {
    gap: 0.5rem;
    grid-template-columns: minmax(0, 1fr);
  }

  .public-page .meter-list,
  .public-page .meter-row,
  .public-page .meter,
  .public-page .event-head,
  .public-page .event-list,
  .public-page .event-list > li {
    min-width: 0;
  }

  .public-page .event-list > li {
    grid-template-columns: 3.5rem minmax(0, 1fr) auto;
    gap: 0.375rem;
  }

  .public-page .event-list strong {
    overflow-wrap: anywhere;
  }

  .public-page .severity {
    min-width: 2.625rem;
    padding-inline: 0.375rem;
  }

  .public-page .meter-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.4375rem;
  }

  .public-page .meter-row > span {
    overflow-wrap: anywhere;
  }

  .public-page .metric-strip {
    gap: var(--compact-panel-gap);
    margin-top: var(--compact-panel-gap);
  }

  .public-page .lighthouse-panel {
    gap: var(--compact-panel-gap);
  }

  .public-page .lighthouse-lockup > div > strong {
    font-size: clamp(1.875rem, 8cqi, 2.375rem);
  }

  .public-page .lighthouse-console > div {
    min-height: var(--compact-console-min);
    padding: var(--compact-panel-pad);
  }

  .public-page .operations .operations-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .public-page .tab-panel {
    padding: var(--compact-panel-pad);
    overflow: hidden;
  }

  .public-page .tab-panel > h3 {
    font-size: clamp(1.875rem, 8cqi, 2.5rem);
  }

  .public-page .operations .tab-panel > p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .public-page .timeline > div {
    min-height: var(--compact-timeline-min);
    padding: var(--compact-panel-pad);
  }

  .public-page .timeline > div > strong {
    font-size: clamp(1.375rem, 8cqi, 1.625rem);
  }

}

@media (min-width: 53.8125rem) and (max-width: 76.25rem),
       (max-width: 43.75rem) {
  .public-page .operations .tab-panel > ul {
    display: none;
  }
}

@supports (container-type: inline-size) {
  .public-page .page-section {
    container-type: inline-size;
  }

  @container (max-width: 80rem) {
    .public-page .workspace-grid {
      grid-template-columns: minmax(min(100%, 13.75rem), 0.48fr) minmax(0, 1fr);
      grid-template-areas:
        "region network"
        "decision network";
    }

    .public-page .region-panel {
      grid-area: region;
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      align-content: start;
      gap: var(--compact-panel-gap);
    }

    .public-page .region-list {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.375rem;
    }

    .public-page .region-item {
      gap: 0.375rem;
      min-height: clamp(2.375rem, 5.4svh, 2.875rem);
      padding: 0.5rem;
    }

    .public-page .mode-panel {
      margin-top: 0;
      padding-top: 0;
    }

    .public-page .mode-buttons {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 0.375rem;
    }

    .public-page .mode-button {
      min-height: clamp(2.125rem, 4.8svh, 2.5rem);
      padding-inline: 0.3125rem;
      font-size: 0.75rem;
      line-height: 1.12;
      overflow-wrap: anywhere;
      white-space: normal;
    }

    .public-page .network-panel {
      grid-area: network;
      align-self: stretch;
      grid-template-rows: auto minmax(0, 1fr) auto;
    }

    .public-page .network-map {
      height: auto;
      min-height: 0;
    }

    .public-page .decision-panel .event-stream {
      display: none;
    }

    .public-page .decision-panel .meter-list {
      display: none;
    }
  }

}

@media (min-width: 76.3125rem) and (max-width: 90rem), (min-width: 76.3125rem) and (max-height: 58.75rem) {
  .public-page .operations {
    min-height: var(--viewport-block);
    display: grid;
    align-content: center;
    gap: var(--viewport-gap);
    padding-top: var(--viewport-frame);
    padding-bottom: var(--viewport-frame);
  }

  .public-page .operations .section-heading {
    gap: clamp(0.5rem, 1.2vmin, 0.875rem);
    margin-bottom: 0;
  }

  .public-page .operations .section-heading > .eyebrow {
    margin-bottom: 0;
  }

  .public-page .operations .section-heading > h2 {
    max-width: var(--heading-measure);
    font-size: clamp(2.5rem, 8cqi, 3.5rem);
    line-height: 1.02;
  }

  .public-page .operations .section-heading > p {
    max-width: var(--copy-measure);
    font-size: clamp(0.9375rem, 4cqi, 1.0625rem);
    line-height: 1.34;
  }

  .public-page .operations-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--compact-panel-gap);
  }

  .public-page .operations .tab-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .public-page .operations .tab-button {
    min-height: clamp(2.625rem, 5.2svh, 3.125rem);
    padding-inline: 0.625rem;
    text-align: center;
  }

  .public-page .operations .tab-panel {
    padding: var(--compact-panel-pad);
  }

  .public-page .operations .tab-panel.active {
    display: grid;
    align-content: center;
  }

  .public-page .operations .tab-panel > h3 {
    max-width: var(--heading-measure);
    margin-bottom: clamp(0.5rem, 1.2vmin, 0.875rem);
    font-size: clamp(1.875rem, 8cqi, 2.5rem);
    line-height: 1.04;
  }

  .public-page .operations .tab-panel > p,
  .public-page .operations .tab-panel > ul {
    font-size: clamp(0.875rem, 4cqi, 1rem);
    line-height: 1.34;
  }

  .public-page .operations .tab-panel > ul {
    gap: 0.5rem;
    margin-top: clamp(0.625rem, 1.4vmin, 1rem);
  }
}

@media (max-width: 53.75rem) {
  html.public-page {
    scroll-padding-top: var(--nav-height);
  }

  .public-page .workspace-grid,
  .public-page .operations-layout {
    gap: 0;
  }

  .public-page .workspace {
    padding-top: 1.375rem;
    padding-bottom: 1.375rem;
  }

  .public-page .workspace-bar {
    margin-bottom: 0;
    padding-block: 1.125rem;
  }

  .public-page .workspace-bar h2 {
    font-size: 2.75rem;
  }

  .public-page .workspace-actions {
    flex-direction: row;
    gap: 0.625rem;
  }

  .public-page .region-panel,
  .public-page .network-panel,
  .public-page .decision-panel,
  .public-page .lighthouse-panel,
  .public-page .tabs,
  .public-page .timeline,
  .public-page .contact-form {
    box-shadow: none;
  }

  .public-page .region-panel {
    gap: 0.75rem;
    padding: 1rem;
  }

  .public-page .region-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
  }

  .public-page .region-item {
    min-height: 3.125rem;
    padding: 0.625rem;
  }

  .public-page .mode-panel {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
  }

  .public-page .mode-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .public-page .mode-button {
    min-width: 0;
    min-height: var(--touch-target);
    padding-inline: 0.3125rem;
    font-size: 0.75rem;
    line-height: 1.12;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .public-page .network-panel {
    grid-template-rows: auto minmax(14.375rem, 1fr) auto;
  }

  .public-page .network-copy {
    padding: 1rem 1rem 0;
  }

  .public-page .network-copy > p {
    font-size: 0.9375rem;
  }

  .public-page .network-map {
    min-height: 14.375rem;
  }

  .public-page .map-legend {
    gap: 0.375rem;
    padding: 0 1rem 1rem;
  }

  .public-page .map-legend > span {
    padding: 0.5rem 0.625rem;
    font-size: 0.75rem;
  }

  .public-page .decision-panel {
    gap: 0.75rem;
    padding: 1.125rem;
  }

  .public-page .decision-card {
    padding-bottom: 0.75rem;
  }

  .public-page .decision-card > p {
    font-size: 0.9375rem;
  }

  .public-page .decision-panel .event-stream {
    display: none;
  }

  .public-page .metric-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.625rem;
    margin-top: 0;
  }

  .public-page .metric {
    min-height: 7rem;
    padding: 0.875rem;
  }

  .public-page .metric > strong {
    font-size: 2rem;
  }

  .public-page .lighthouse-panel {
    gap: 0.875rem;
    padding: 1.125rem;
  }

  .public-page .lighthouse-lockup {
    gap: 0.625rem;
  }

  .public-page .lighthouse-panel > p,
  .public-page .lighthouse-console > div > p {
    font-size: 0.9375rem;
    line-height: 1.36;
  }

  .public-page .lighthouse-console > div {
    gap: 0.5rem;
    padding: 1.125rem;
  }

  .public-page .tab-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .public-page .timeline {
    display: none;
  }

  .public-page .tab-button {
    min-height: var(--control-min);
    padding-inline: 0.5rem;
    font-size: 0.8125rem;
  }

  .public-page .tab-panel {
    padding: 1.125rem;
  }

  .public-page .tab-panel > h3 {
    max-width: var(--heading-measure);
    font-size: clamp(2rem, 8cqi, 2.125rem);
  }

  .public-page .tab-panel > p,
  .public-page .tab-panel > ul {
    font-size: 0.9375rem;
    line-height: 1.36;
  }

  .public-page .tab-panel > ul {
    gap: 0.5rem;
    margin-top: 0.875rem;
  }

  .public-page .timeline > div {
    gap: 0.5rem;
    padding: 1.125rem;
  }

  .public-page .timeline > div > strong {
    font-size: 1.5rem;
  }

  .public-page .timeline > div > p {
    font-size: 0.875rem;
    line-height: 1.36;
  }

  .public-page .contact {
    gap: 1.125rem;
  }

  .public-page .contact-form {
    padding: 1.125rem;
  }

  .hero { min-height: auto; padding-top: 3.625rem; }
  h1 { font-size: clamp(3.25rem, 12cqi, 3.5rem); }
  .hero-copy > p { font-size: 1.25rem; }
  .hero-kpis {
    grid-template-columns: 1fr;
    gap: 0.625rem;
  }
  .hero-product-pills a {
    grid-template-columns: minmax(min(100%, 7rem), 0.72fr) minmax(0, 1.28fr);
    align-items: center;
    min-height: 0;
    padding: 0.875rem;
    gap: 0.25rem 0.875rem;
  }
  .hero-product-pills > a > span {
    font-size: 0.625rem;
  }
  .hero-product-pills > a > strong {
    margin-top: 0;
    font-size: 1.3125rem;
  }
  .hero-product-pills > a > em {
    grid-column: 2;
    grid-row: 1 / span 2;
    max-width: none;
    font-size: 0.8125rem;
    line-height: 1.25;
  }
  .hero-kpis > div > strong,
  .hero-product-pills > a > strong,
  .metric > strong { font-size: 2.375rem; }
  .hero-product-pills > a > strong { font-size: 1.3125rem; }
  .network-copy > strong,
  .decision-card > strong,
  .lighthouse-lockup > div > strong,
  .lighthouse-console > div > strong { font-size: 1.75rem; }
  .tab-panel > h3 { font-size: 2.625rem; }
  .workspace-bar,
  .workspace-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .workspace-bar > div,
  .workspace-actions {
    width: 100%;
  }

  .region-panel {
    grid-template-columns: 1fr;
  }

  .region-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .network-panel {
    grid-template-rows: auto minmax(20rem, 1fr) auto;
  }

  .network-map { min-height: 20rem; }
  .map-legend,
  .metric-strip,
  .portal-plant-list,
  .portal-plant-metrics,
  .portal-plant-edit form,
  .plant-status-main,
  .plant-status-metrics,
  .plant-kpis,
  .plant-capability-groups,
  .plant-balance-grid,
  .plant-period-kpis {
    grid-template-columns: 1fr;
  }

  .event-list > li {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }

  .plant-import-events {
    max-height: 26.25rem;
  }

  .plant-toolbar,
  .plant-balance-head,
  .plant-chart-head,
  .plant-chart-footer,
  .plant-ftp-head,
  .portal-home-head,
  .plant-view-head,
  .portal-plant-card-head,
  .portal-card-actions,
  .portal-controls,
  .plant-detail-controls,
  .plant-analysis-controls,
  .plant-import-actions {
    align-items: flex-start;
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .portal-home-head > div:last-child {
    align-items: flex-start;
  }

  .plant-detail-title {
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .portal-login {
    grid-template-columns: 1fr;
  }

  .lighthouse-console {
    grid-template-columns: 1fr;
  }

  .lighthouse-console > div,
  .lighthouse-console > div:nth-child(2n),
  .lighthouse-console > div:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 0.0625rem solid var(--line-hairline);
  }

  .lighthouse-console > div:last-child {
    border-bottom: 0;
  }

  .topbar-actions {
    gap: 0.5rem;
  }

  .portal-shell .portal-controls {
    align-items: center;
    flex-direction: row;
    justify-content: flex-end;
  }

  .plant-status-panel,
  .plant-ftp-grid {
    grid-template-columns: 1fr;
  }

  .plant-status-panel div {
    border-right: 0;
    border-bottom: 0.0625rem solid var(--line-soft);
  }

  .plant-status-panel div:last-child {
    border-bottom: 0;
  }

  .plant-section-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    overflow: visible;
  }

  .plant-section-tabs button {
    min-width: 0;
    min-height: 2.75rem;
    width: 100%;
    padding-inline: 0.625rem;
    white-space: normal;
  }

  .portal-tabs button {
    min-height: 2.75rem;
  }

  .plant-status-state {
    text-align: left;
  }

  .plant-device-row {
    grid-template-columns: 1fr;
    gap: 0.3125rem;
  }

  .plant-day-row {
    grid-template-columns: 1fr 1fr;
    gap: 0.3125rem 0.75rem;
  }

  .plant-day-header {
    display: none;
  }

  .plant-day-row:not(.plant-day-header) span::before,
  .plant-day-row:not(.plant-day-header) strong::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 0.1875rem;
    color: var(--muted-2);
    font-size: 0.625rem;
    font-weight: 850;
    text-transform: uppercase;
  }

  .plant-device-row span,
  .plant-device-row strong,
  .plant-day-row span,
  .plant-day-row strong,
  .plant-chart-legend span {
    white-space: normal;
  }

  .severity { width: fit-content; }
  .tab-buttons { grid-template-columns: 1fr; }
  .tab-button { border-right: 0; border-bottom: 0.0625rem solid var(--line-hairline); text-align: left; padding-left: 1.125rem; }
  .tab-button:last-child { border-bottom: 0; }
}

@media (min-width: 43.8125rem) and (max-width: 53.75rem) {
  .public-page .hero,
  .public-page .page-section {
    min-height: var(--viewport-block);
    gap: var(--viewport-gap);
    padding: var(--viewport-frame);
  }

  .public-page .operations-layout {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--tablet-card-min)), 1fr));
    gap: var(--compact-panel-gap);
  }

  .public-page .workspace {
    --dashboard-panel-pad: var(--compact-panel-pad);
    --dashboard-gap: var(--compact-panel-gap);
    --dashboard-item-min: clamp(2.5rem, 6svh, 3rem);
    --dashboard-metric-min: var(--compact-metric-min);
    grid-template-rows: auto auto auto;
  }

}

@media (min-width: 43.8125rem) and (max-width: 76.25rem) {
  .public-page .metric {
    min-height: var(--compact-metric-min);
    padding: clamp(0.625rem, 1.5vmin, 0.875rem);
  }
}

@media (max-width: 53.75rem) {
  .public-page .lighthouse-console {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 43.75rem) {
  h1 { font-size: clamp(2.875rem, 12cqi, 3rem); }
}

@media (max-width: 43.75rem) {
  .site-page .hero:not(.landing-hero) {
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
  }

  .site-page .hero:not(.landing-hero):not(.site-contact-page) > :not(.hero-copy):not(.hero-energy-canvas) {
    display: none;
  }

  .landing-page .landing-hero {
    min-height: var(--mobile-section-height);
    display: grid;
    align-content: center;
  }

  .landing-page .landing-hero,
  .public-page .page-section {
    gap: var(--viewport-gap);
    padding: var(--viewport-frame);
  }

  .public-page .section-heading > h2 {
    font-size: var(--heading-mobile);
    line-height: 1.02;
  }

  .public-page .section-heading > p {
    font-size: 0.9375rem;
    line-height: 1.3;
  }

  .public-page .workspace {
    grid-template-rows: auto auto auto;
  }

  .public-page .workspace-bar {
    padding-block: 0;
  }

  .public-page .workspace-bar h2 {
    font-size: 2rem;
  }

  .public-page .decision-card {
    gap: 0.3125rem;
    padding-bottom: 0.625rem;
  }

  .public-page .decision-card > strong {
    font-size: 1.5rem;
  }

  .public-page .decision-card > p {
    display: none;
  }

  .public-page .metric {
    min-height: 4.625rem;
    padding: 0.75rem;
  }

  .public-page .metric > span {
    font-size: 0.625rem;
  }

  .public-page .metric > strong {
    font-size: 1.5rem;
  }

  .public-page .lighthouse-panel > p {
    display: none;
  }

  .public-page .lighthouse-console > div > strong {
    font-size: 1.1875rem;
  }

  .public-page .lighthouse-console > div > p {
    display: none;
  }

  .public-page .operations-layout {
    gap: 0;
  }

  .public-page .tab-button {
    min-height: 2.75rem;
    padding-inline: 0.4375rem;
    font-size: 0.75rem;
  }

  .public-page .tab-panel {
    padding: 0.875rem;
  }

  .public-page .tab-panel > h3 {
    margin-bottom: 0.5rem;
    font-size: 1.6875rem;
  }

  .public-page .tab-panel > p {
    font-size: 0.875rem;
    line-height: 1.3;
  }

}

@media (max-width: 32.5rem) {
  :root {
    --control-min: var(--touch-target);
    --section-heading-size: 2.125rem;
    --site-brand-control-size: 2.75rem;
    --site-brand-mark-size: 1.625rem;
    --site-brand-font-size: 0.75rem;
  }

  .band,
  .topbar {
    padding-inline: var(--page-gutter);
  }

  .brand {
    padding-inline: 0.375rem 0.5rem;
  }

  .topbar-actions > .language-select,
  .topbar-actions > .language-custom-select,
  .topbar-actions > .login-menu {
    display: none;
  }

  .mobile-language-custom-select {
    display: inline-flex;
  }

  .portal-shell .topbar {
    grid-template-columns: minmax(0, 1fr);
    align-items: flex-start;
    gap: 0.625rem;
    padding-block: 0.625rem;
  }

  .portal-shell .portal-brand {
    grid-column: 1;
  }

  .portal-brand-suffix {
    display: none;
  }

  .portal-shell .portal-controls {
    width: 100%;
    justify-content: space-between;
  }

  .portal-top-actions {
    grid-column: 1;
    width: 100%;
    justify-content: space-between;
  }

  .portal-shell .portal-controls span {
    max-width: none;
    flex: 1 1 auto;
  }

  .portal-shell .portal-controls .button {
    flex: 0 0 auto;
  }

  .portal-shell .plant-page {
    padding-top: 1.125rem;
    padding-bottom: 1.125rem;
  }

  .portal-shell .plant-page .section-heading {
    gap: 0.625rem;
    margin-bottom: 0.875rem;
  }

  .portal-shell .plant-page h1 {
    font-size: 2.625rem;
  }

  .hero-actions .button { width: 100%; }
  .hero {
    gap: 1.125rem;
    padding-top: 1.625rem;
    padding-bottom: 1.625rem;
  }
  .hero .eyebrow {
    margin-bottom: 0.625rem;
  }
  .hero-copy > p {
    margin-top: 0.875rem;
  }
  .hero-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 1rem;
  }
  .hero-actions .button {
    width: auto;
    min-width: 0;
  }
  .hero-kpis {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }
  .hero-product-pills a {
    grid-template-columns: minmax(min(100%, 5.5rem), 0.7fr) minmax(0, 1.3fr);
    align-items: center;
    min-height: 0;
    padding: 0.75rem;
    gap: 0.1875rem 0.75rem;
  }
  .hero-product-pills > a > span {
    font-size: 0.625rem;
  }
  .hero-product-pills > a > strong {
    margin-top: 0;
    font-size: 1.1875rem;
  }
  .hero-product-pills > a > em {
    grid-column: 2;
    grid-row: 1 / span 2;
    max-width: none;
    font-size: 0.8125rem;
    line-height: 1.25;
  }
  .hero-kpis > div { min-height: 4.75rem; }
  .plant-balance-board { padding: 0.75rem; }
  .plant-balance-head time { white-space: normal; }
  .plant-balance-totals {
    gap: 0.375rem;
  }
  .plant-balance-totals div {
    padding: 0.625rem 0.5rem;
  }
  .plant-balance-totals > div > strong { font-size: 1.125rem; }
  .portal-auth,
  .portal-home-head,
  .plant-view-head,
  .portal-plant-card,
  .plant-create-form,
  .plant-ftp-panel,
  .plant-events-panel,
  .plant-status-hero,
  .plant-chart-panel,
  .plant-data-panel,
  .plant-overview,
  .plant-devices,
  .plant-days,
  .plant-import {
    padding: 0.875rem;
    box-shadow: none;
  }
  .portal-login {
    gap: 0.5rem;
  }
  .portal-login label {
    gap: 0.3125rem;
  }
  .portal-login input,
  .plant-create-form input,
  .contact-form input,
  .contact-form select {
    min-height: var(--control-min);
  }
  .plant-chart-wrap {
    min-height: clamp(16rem, 42svh, 22rem);
  }
  .plant-chart-wrap canvas {
    height: clamp(16rem, 42svh, 22rem);
  }
  .plant-account-row {
    grid-template-columns: 1fr;
    gap: 0.375rem;
  }
  .plant-account-row > strong {
    text-align: left;
    white-space: normal;
  }
  .plant-status-main > div > strong {
    font-size: 1.75rem;
  }
  .plant-status-state > strong,
  .plant-status-metrics > div > strong,
  .plant-kpis > div > strong,
  .plant-period-kpis > div > strong {
    font-size: 1.375rem;
  }
  .plant-status-metrics,
  .plant-kpis,
  .plant-period-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .plant-status-metrics > div > span,
  .plant-kpis > div > span,
  .plant-period-kpis > div > span {
    min-width: 0;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }
  .plant-profile-card {
    gap: 0.625rem;
    margin-bottom: 0.75rem;
    padding: 0.75rem;
  }
  .plant-capability-groups li {
    padding: 0.3125rem 0.4375rem;
    font-size: 0.6875rem;
  }
  .plant-section-tabs button,
  .plant-segment button,
  .plant-chart-controls button,
  .portal-tabs button {
    min-height: 2.75rem;
    padding-inline: 0.5rem;
    font-size: 0.75rem;
  }
  .plant-segment,
  .plant-chart-controls {
    width: 100%;
  }
  .plant-segment {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .plant-chart-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .plant-account-row {
    min-height: 3.625rem;
    padding: 0.625rem;
  }
  h1 {
    max-width: 12ch;
    font-size: 2.25rem;
    line-height: 1.05;
  }
  .hero-copy > p,
  .section-heading > p,
  .contact-copy > p { font-size: 1.0625rem; }
  .tab-panel > h3 { font-size: 2rem; }

  .region-list,
  .mode-buttons {
    grid-template-columns: 1fr;
  }

  .public-page .workspace-bar {
    padding-block: 0.75rem;
  }

  .public-page .workspace-bar h2 {
    font-size: 2rem;
  }

  .public-page .workspace-actions {
    gap: 0.5rem;
  }

  .public-page .workspace-actions time {
    font-size: 0.75rem;
  }

  .public-page .region-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .public-page .mode-button {
    font-size: 0.6875rem;
  }

  .public-page .network-panel {
    grid-template-rows: auto minmax(12.5rem, 1fr);
  }

  .public-page .network-map {
    min-height: 12.5rem;
  }

  .public-page .map-legend {
    display: none;
  }

  .public-page .metric {
    min-height: 6rem;
  }

  .public-page .metric > strong {
    font-size: 1.75rem;
  }

  .public-page .lighthouse-panel,
  .public-page .lighthouse-console > div,
  .public-page .tab-panel,
  .public-page .timeline > div,
  .public-page .contact-form {
    padding: 1rem;
  }

  .public-page .tab-panel > h3 {
    font-size: 1.875rem;
  }

  .public-page .tab-panel > ul {
    display: none;
  }

  .network-copy,
  .map-legend {
    padding-inline: 0.875rem;
  }

  .region-panel,
  .decision-panel,
  .lighthouse-panel,
  .contact-form {
    padding: 1rem;
  }

}

@media (max-width: 43.75rem) {
  .landing-page .landing-hero > * {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .public-page .section-heading > h2,
  .public-page .workspace-bar h2 {
    font-size: var(--heading-mobile-tight);
    line-height: 1.03;
  }

  .public-page .section-heading > p {
    display: none;
  }

  .public-page .workspace {
    grid-template-rows: auto auto auto;
  }

  .public-page .workspace-actions {
    display: none;
  }

  .public-page .decision-card {
    gap: 0.25rem;
    padding-bottom: 0.5rem;
  }

  .public-page .decision-card > strong {
    font-size: 1.375rem;
  }

  .public-page .meter-list {
    gap: 0.4375rem;
  }

  .public-page .meter-row {
    font-size: 0.75rem;
  }

  .public-page .meter {
    height: 0.375rem;
  }

  .public-page .metric {
    min-height: 4rem;
    gap: 0.25rem;
    padding: 0.625rem;
  }

  .public-page .metric > strong {
    font-size: 1.375rem;
  }

  .public-page .lighthouse-lockup,
  .public-page .lighthouse-lockup > div {
    min-width: 0;
  }

  .public-page .lighthouse-lockup > div > strong {
    font-size: 1.5rem;
  }

  .public-page .lighthouse-panel .button {
    display: none;
  }

  .public-page .lighthouse-console > div > strong {
    font-size: 1.0625rem;
  }

  .public-page .tab-button {
    min-height: 2.75rem;
    padding-inline: 0.375rem;
    font-size: 0.6875rem;
  }

  .public-page .tab-panel {
    padding: 0.75rem;
  }

  .public-page .tab-panel > h3 {
    margin-bottom: 0.375rem;
    font-size: 1.4375rem;
    line-height: 1.04;
  }

  .public-page .tab-panel > p {
    display: -webkit-box;
    font-size: 0.8125rem;
    line-height: 1.26;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}

@media (max-width: 56.25rem) and (max-height: 26.25rem) and (orientation: landscape) {
  .site-page .hero:not(.landing-hero):not(.site-contact-page) {
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
  }

  .site-page .hero :is(.hero-kpis, .timeline, .lighthouse-panel) {
    display: none;
  }

  .site-page .site-main > .imprint-hero {
    align-content: center;
    padding-bottom: calc(2.875rem + env(safe-area-inset-bottom));
  }

  .imprint-hero .hero-copy > p {
    display: none;
  }

  .imprint-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.75rem;
  }

  .imprint-panel strong {
    font-size: clamp(1.1875rem, 8cqi, 1.5rem);
  }

  .imprint-panel p {
    font-size: 0.8125rem;
    line-height: 1.24;
  }
}

@media (max-width: 32.5rem) and (max-height: 43.75rem) {
  .landing-page .landing-hero {
    min-height: var(--mobile-section-height);
  }

  .hero {
    gap: 0.625rem;
    align-content: center;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .hero .eyebrow {
    margin-bottom: 0.375rem;
  }

  h1 {
    max-width: 13ch;
    font-size: 2rem;
    line-height: 1.03;
  }

  .hero-copy > p {
    margin-top: 0.625rem;
    font-size: 0.9375rem;
    line-height: 1.28;
  }

  .hero-actions {
    gap: 0.375rem;
    margin-top: 0.75rem;
  }

  .hero-kpis {
    gap: 0.375rem;
  }

  .hero-product-pills a {
    min-height: 4.125rem;
    grid-template-columns: minmax(min(100%, 5.375rem), 0.72fr) minmax(0, 1.28fr);
    gap: 0.125rem 0.625rem;
    padding: 0.625rem;
  }

  .hero-product-pills > a > span {
    font-size: 0.5625rem;
  }

  .hero-product-pills > a > strong {
    font-size: 1.0625rem;
  }

  .hero-product-pills > a > em {
    display: -webkit-box;
    grid-column: 2;
    grid-row: 1 / span 2;
    max-width: none;
    font-size: 0.75rem;
    line-height: 1.18;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .public-page .contact {
    gap: 0.625rem;
    align-content: center;
  }

  .public-page .contact-copy > p {
    display: none;
  }

  .public-page .contact-form {
    gap: 0.5rem;
    padding: 0.875rem;
  }

  .public-page .contact-form input,
  .public-page .contact-form select {
    min-height: 2.75rem;
  }

  .public-page .contact-form .form-message {
    min-height: 1.125rem;
    font-size: 0.75rem;
  }
}

@media (max-width: 43.75rem) {
  .public-page .operations {
    align-content: center;
    grid-template-rows: auto auto;
  }

  .public-page .operations-layout {
    display: grid;
    min-height: clamp(16.25rem, 42svh, 23.75rem);
    max-height: calc(var(--mobile-section-height) - 8.75rem);
    align-items: stretch;
    overflow: hidden;
  }

  .public-page .operations .tab-button {
    min-height: 2.75rem;
    padding-inline: 0.375rem;
    text-align: center;
    overflow-wrap: anywhere;
  }

  .public-page .operations .tab-panel {
    min-height: 0;
    padding: clamp(0.875rem, 4vw, 1.125rem);
    overflow: hidden;
  }

  .public-page .operations .tab-panel.active {
    display: grid;
    align-content: center;
    gap: 0.5rem;
  }

  .public-page .operations .tab-panel > h3 {
    margin-bottom: 0;
    font-size: clamp(1.4375rem, 8cqi, 1.875rem);
    line-height: 1.03;
  }

  .public-page .operations .tab-panel > p {
    display: -webkit-box;
    max-width: none;
    overflow: hidden;
    font-size: 0.875rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .portal-shell:not(.portal-locked) .plant-page {
    padding-top: 0.75rem;
  }

  .portal-shell:not(.portal-locked) .plant-page > .section-heading {
    display: none;
  }

  .portal-shell:not(.portal-locked) .portal-home-head,
  .portal-shell:not(.portal-locked) .plant-view-head {
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .portal-shell:not(.portal-locked) .portal-home-view,
  .portal-shell:not(.portal-locked) .portal-create-view,
  .portal-shell:not(.portal-locked) .plant-ftp-view {
    gap: 0.75rem;
  }

  .portal-shell:not(.portal-locked) .plant-toolbar {
    align-items: stretch;
    margin-bottom: 0.75rem;
  }

  .portal-shell:not(.portal-locked) .plant-detail-controls,
  .portal-shell:not(.portal-locked) .portal-tabs {
    width: 100%;
  }

  .portal-shell:not(.portal-locked) .portal-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-shell:not(.portal-locked) .portal-tabs button {
    width: 100%;
  }
}

@media (max-width: 68.75rem) and (max-height: 40rem), (max-width: 56.25rem) and (orientation: landscape) {
  .landing-page .landing-hero {
    min-height: var(--viewport-block);
  }

  .public-page .page-section {
    min-height: var(--viewport-block);
    gap: var(--compact-panel-gap);
    padding: clamp(0.625rem, 2vmin, 1.125rem);
  }

  .public-page .hero {
    grid-template-columns: minmax(0, 1fr) minmax(min(100%, 13.125rem), 0.86fr);
    align-items: center;
  }

  .public-page .hero .eyebrow {
    margin-bottom: 0.375rem;
  }

  .public-page .hero h1 {
    max-width: 16ch;
    font-size: clamp(1.875rem, 12cqi, 2.75rem);
    line-height: 1.03;
  }

  .public-page .hero-copy > p {
    display: none;
  }

  .public-page .hero-actions {
    gap: 0.375rem;
    margin-top: 0.625rem;
  }

  .public-page .hero-kpis {
    gap: 0.375rem;
  }

  .public-page .hero-product-pills a {
    min-height: 3.25rem;
    grid-template-columns: minmax(min(100%, 7.25rem), 0.62fr) minmax(0, 1.38fr);
    gap: 0.125rem 0.5rem;
    padding: 0.5rem;
  }

  .public-page .hero-product-pills > a > span {
    font-size: 0.5625rem;
  }

  .public-page .hero-product-pills > a > strong {
    margin-top: 0;
    font-size: clamp(1rem, 8cqi, 1.125rem);
    overflow-wrap: normal;
    white-space: nowrap;
  }

  .public-page .hero-product-pills > a > em {
    display: -webkit-box;
    grid-column: 2;
    grid-row: 1 / span 2;
    max-width: none;
    font-size: 0.6875rem;
    line-height: 1.15;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .public-page .section-heading {
    gap: 0.5rem;
    margin-bottom: 0;
  }

  .public-page .section-heading > p,
  .public-page .contact-copy > p,
  .public-page .decision-card > p,
  .public-page .timeline {
    display: none;
  }

  .public-page .operations-layout {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11.25rem), 1fr));
    gap: 0.5rem;
  }

  .public-page .workspace {
    --dashboard-panel-pad: 0.75rem;
    --dashboard-gap: 0.5rem;
    grid-template-rows: auto auto auto;
  }

  .public-page .workspace-bar {
    padding-block: 0;
  }

  .public-page .workspace-bar h2 {
    font-size: clamp(1.5rem, 8cqi, 2.125rem);
  }

  .public-page .workspace-actions {
    display: none;
  }

  .public-page .decision-card {
    gap: 0.25rem;
    padding-bottom: 0.5rem;
  }

  .public-page .decision-card > strong {
    font-size: clamp(1.3125rem, 8cqi, 1.625rem);
  }

  .public-page .meter-list {
    gap: 0.375rem;
  }

  .public-page .meter-row {
    font-size: 0.75rem;
  }

  .public-page .meter {
    height: 0.375rem;
  }

  .public-page .metric {
    min-height: clamp(3.25rem, 14svh, 4.375rem);
    gap: 0.25rem;
    padding: 0.5rem;
  }

  .public-page .metric > span {
    font-size: 0.625rem;
  }

  .public-page .metric > strong {
    font-size: clamp(1.25rem, 8cqi, 1.625rem);
  }

  .public-page .lighthouse-panel,
  .public-page .lighthouse-console > div,
  .public-page .tab-panel,
  .public-page .contact-form {
    padding: 0.75rem;
  }

  .public-page .lighthouse-panel {
    min-height: auto;
    align-content: center;
  }

  .public-page .lighthouse-panel > p,
  .public-page .lighthouse-panel .button,
  .public-page .lighthouse-console > div > p {
    display: none;
  }

  .public-page .lighthouse-console {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .public-page .lighthouse-console > div {
    min-height: clamp(3.625rem, 17svh, 4.75rem);
    gap: 0.25rem;
  }

  .public-page .lighthouse-lockup > div > strong,
  .public-page .lighthouse-console > div > strong {
    font-size: clamp(1.0625rem, 8cqi, 1.375rem);
  }

  .public-page .operations-layout {
    grid-template-columns: minmax(0, 1fr);
    min-height: auto;
  }

  .public-page .operations .tab-panel {
    padding: 0.75rem;
  }

  .public-page .operations .tab-panel > h3,
  .public-page .tab-panel > h3 {
    margin-bottom: 0;
    font-size: clamp(1.375rem, 8cqi, 1.875rem);
  }

  .public-page .operations .tab-panel > p,
  .public-page .operations .tab-panel > ul,
  .public-page .tab-panel > p,
  .public-page .tab-panel > ul {
    display: none;
  }

  .public-page .contact {
    grid-template-columns: minmax(0, 0.9fr) minmax(min(100%, 15rem), 1.1fr);
    align-items: center;
  }

  .public-page .contact-form {
    gap: 0.375rem;
  }

  .public-page .contact-form input,
  .public-page .contact-form select {
    min-height: 2.375rem;
  }

  .public-page .contact-form .form-message {
    min-height: 0.875rem;
    font-size: 0.6875rem;
  }
}

@media (max-height: 23.75rem) and (orientation: landscape) {
  .public-page .page-section {
    gap: 0.375rem;
    padding: 0.375rem 0.625rem;
  }

  .public-page .section-heading {
    gap: 0.3125rem;
  }

  .public-page .section-heading > h2,
  .public-page .workspace-bar h2 {
    font-size: clamp(1.5rem, 8cqi, 1.875rem);
  }

  .public-page .lighthouse-console > div {
    min-height: 3.125rem;
    padding: 0.5rem;
  }

  .public-page .operations .tab-button {
    min-height: 2.375rem;
  }

  .public-page .operations .tab-panel {
    padding: 0.625rem;
  }

  .public-page .operations .tab-panel > h3 {
    font-size: clamp(1.3125rem, 8cqi, 1.6875rem);
  }
}

@media (max-width: 26.25rem) and (max-height: 47.5rem) {
  .landing-page .landing-hero {
    min-height: var(--viewport-block);
  }

  .public-page .hero {
    grid-template-columns: minmax(0, 1fr);
  }

  .public-page .hero-product-pills {
    display: none;
  }

  .public-page .hero h1 {
    max-width: min(100%, 13ch);
    font-size: clamp(2rem, 12cqi, 2.5rem);
  }

}

@media (max-width: 26.25rem) {
  .public-page .hero-product-pills a {
    min-height: 3.625rem;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.125rem;
  }

  .public-page .hero-product-pills > a > strong {
    overflow-wrap: normal;
    white-space: nowrap;
  }

  .public-page .hero-product-pills > a > em {
    display: none;
  }
}

@media (min-width: 43.8125rem) and (max-width: 76.25rem) {
  .public-page .workspace-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "region decision";
    gap: var(--compact-panel-gap);
    align-items: start;
  }

  .public-page .region-panel {
    grid-area: region;
    grid-template-columns: 1fr;
    align-self: start;
  }

  .public-page .decision-panel {
    grid-area: decision;
    grid-template-columns: minmax(0, 1fr);
    align-self: start;
  }

  .public-page .network-panel {
    display: none;
  }
}

@media (max-width: 43.75rem),
       (max-width: 68.75rem) and (max-height: 40rem),
       (max-width: 56.25rem) and (orientation: landscape) {
  .public-page .workspace-grid {
    display: block;
  }

  .public-page .region-panel,
  .public-page .network-panel {
    display: none;
  }
}

@media (max-width: 56.25rem) and (max-height: 26.25rem) {
  .public-page .metric-strip {
    display: none;
  }

  .public-page .workspace {
    grid-template-rows: auto auto;
  }
}

@media (max-width: 22.5rem) {
  .topbar {
    gap: 0.375rem;
  }

  .topbar-actions {
    gap: 0.375rem;
  }
}

.public-page .hero,
.public-page .page-section {
  height: auto;
  min-height: var(--viewport-block);
}

.public-page .page-section {
  background: transparent;
  border-top: 0;
  border-bottom: 0;
}

.public-page .workspace {
  height: auto;
}

.public-page .operations-layout,
.public-page .operations .tab-panel,
.public-page .tabs,
.public-page .timeline {
  max-height: none;
  overflow: visible;
}

.public-page .tab-panel:not(.active) {
  display: none;
}

.site-page .site-main > .hero + .operations:has(> .page-legal-link) .tab-panel.active {
  animation: fadeOnly .18s ease both;
}

.public-page .region-panel,
.public-page .decision-panel,
.public-page .tab-panel {
  overflow: visible;
}

.public-page .operations .tab-panel > p {
  overflow: visible;
  -webkit-line-clamp: unset;
}

.site-main > .hero:first-child {
  border-bottom: 0;
}

.site-page .site-main > :last-child {
  position: relative;
}

.site-page .site-main > .band:first-child:not(.hero):not(.landing-hero) {
  --first-section-pad-top: var(--section-pad-y);
  min-height: 100svh;
  margin-top: calc(var(--nav-height) * -1);
  padding-top: calc(var(--first-section-pad-top) + var(--nav-height));
  border-top: 0;
}

.site-page .site-main > .band:first-child:last-child:not(.hero):not(.landing-hero) {
  min-height: var(--viewport-block);
  height: auto;
  max-height: none;
  overflow: visible;
}

.site-page .site-main > .hero:first-child:not(.landing-hero) {
  --first-section-pad-top: var(--viewport-frame);
}

.landing-page .landing-hero {
  min-height: var(--viewport-block);
  height: auto;
}

.site-page .site-main > .hero:first-child {
  overflow: visible;
}

.site-page .site-main > .hero:first-child .hero-energy-canvas,
.site-page .site-main > .hero:first-child::before {
  top: calc(var(--nav-height) * -1);
  bottom: auto;
  height: calc(100% + var(--nav-height));
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - var(--hero-section-feather)), transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - var(--hero-section-feather)), transparent 100%);
}

.site-page .site-main > .hero:first-child:not(.landing-hero) .hero-energy-canvas,
.site-page .site-main > .hero:first-child:not(.landing-hero)::before {
  height: calc(100% + var(--nav-height) + var(--hero-section-bleed));
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0,
    #000 calc(100% - var(--hero-section-feather) - var(--nav-height) - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.16) calc(100% - var(--nav-height) - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.04) calc(100% - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.015) calc(100% - var(--hero-section-tail)),
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    #000 0,
    #000 calc(100% - var(--hero-section-feather) - var(--nav-height) - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.16) calc(100% - var(--nav-height) - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.04) calc(100% - var(--hero-section-bleed)),
    rgba(0, 0, 0, 0.015) calc(100% - var(--hero-section-tail)),
    transparent 100%
  );
}

.site-page .site-main > .hero:first-child:last-child:not(.landing-hero) .hero-energy-canvas,
.site-page .site-main > .hero:first-child:last-child:not(.landing-hero)::before {
  height: calc(100% + var(--nav-height));
}

.site-contact-page {
  min-height: var(--viewport-block);
  height: auto;
  max-height: none;
  overflow: visible;
}

.site-contact-page .contact-copy > h1 {
  max-width: var(--heading-measure);
  font-size: var(--section-heading-fluid);
  line-height: 0.98;
  font-weight: 740;
}

.page-legal-link {
  position: absolute;
  right: var(--content-inset);
  bottom: calc(var(--page-legal-bottom-inset) + env(safe-area-inset-bottom));
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  color: var(--muted-2);
  font-size: 0.75rem;
  font-weight: 760;
  transition: color .16s ease;
}

.page-legal-link:hover,
.page-legal-link:focus-visible {
  color: var(--text);
}

.site-page .site-main > .hero + .page-section > .page-legal-link {
  position: static;
  justify-self: end;
  align-self: end;
  transform: none;
}

.workspace > .page-legal-link {
  grid-column: 1 / -1;
  grid-row: -2 / -1;
}

@media (min-width: 76.3125rem) {
  .site-page .site-main > .hero + .workspace:has(> .page-legal-link) {
    grid-template-rows: auto minmax(0, 1fr) auto auto;
  }

  .site-page .site-main > .hero + :is(.operations, .use-cases):has(> .page-legal-link) {
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
}

.imprint-hero {
  grid-template-columns: minmax(0, 1fr) minmax(min(100%, 20rem), 26.25rem);
}

.imprint-panel {
  display: grid;
  gap: 1.375rem;
  min-width: 0;
  padding: clamp(1.375rem, 3.2vw, 2.375rem);
  border: 0;
  border-radius: var(--radius);
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
}

.imprint-panel > div {
  display: grid;
  gap: 0.5rem;
}

.imprint-panel span {
  color: var(--muted-2);
  font-size: 0.6875rem;
  font-weight: 850;
  text-transform: uppercase;
}

.imprint-panel strong {
  font-size: clamp(1.5625rem, 8cqi, 2.25rem);
  line-height: 1.02;
}

.imprint-panel p {
  color: var(--muted);
  font-size: 1.0625rem;
  line-height: 1.45;
}

.site-page .hero .lighthouse-panel,
.site-page .hero .timeline {
  align-self: center;
}

.site-page .hero .lighthouse-panel {
  background: var(--panel);
}

.site-page .hero .timeline {
  max-width: min(100%, 32.5rem);
}

@media (max-width: 53.75rem) {
  .public-page .page-section {
    min-height: var(--viewport-block);
  }
}

@media (max-width: 43.75rem) {
  .public-page .operations-layout {
    min-height: auto;
  }

  .site-page .site-main > .band:first-child:last-child:not(.hero):not(.landing-hero) {
    padding: calc(var(--nav-height) + var(--viewport-frame)) var(--viewport-frame) var(--viewport-frame);
  }

  .public-page .site-contact-page {
    align-content: center;
    gap: clamp(0.5rem, 1.7svh, 0.875rem);
  }

  .public-page .site-contact-page .contact-copy {
    display: grid;
    gap: 0.5rem;
  }

  .public-page .site-contact-page .contact-copy > .eyebrow {
    margin-bottom: 0;
  }

  .public-page .site-contact-page .contact-copy > h1 {
    max-width: min(100%, 15ch);
    font-size: clamp(1.9375rem, 12cqi, 2.625rem);
    line-height: 1.02;
  }

  .public-page .site-contact-page .contact-copy > p {
    display: none;
  }

  .page-legal-link {
    right: auto;
    left: 50%;
    width: auto;
    max-width: calc(100% - (2 * var(--page-gutter)));
    transform: translateX(-50%);
  }

  .landing-page .landing-hero > .page-legal-link {
    width: auto;
    max-width: calc(100% - (2 * var(--page-gutter)));
  }

  .site-page .site-main > .hero + .page-section > .page-legal-link {
    justify-self: center;
    transform: none;
  }

  .site-page .hero:not(.landing-hero):not(.site-contact-page) > .page-legal-link:not(.hero-copy):not(.hero-energy-canvas) {
    display: inline-flex;
  }

  .site-page .site-main > .imprint-hero {
    display: block;
    min-height: var(--viewport-block);
    height: auto;
    padding-top: calc(var(--nav-height) + clamp(1.25rem, 5svh, 2.125rem));
    padding-bottom: calc(clamp(1.125rem, 4svh, 1.75rem) + 2.875rem + env(safe-area-inset-bottom));
  }

  .imprint-hero .hero-copy {
    gap: 0.625rem;
    margin-bottom: clamp(1rem, 3svh, 1.75rem);
  }

  .imprint-hero .hero-copy > h1 {
    font-size: clamp(2.625rem, 12cqi, 3.5rem);
    line-height: 0.96;
  }

  .imprint-hero .hero-copy > p {
    font-size: 1.0625rem;
    line-height: 1.36;
  }

  .imprint-panel {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 4vw, 1.375rem);
  }

  .site-page .hero.imprint-hero:not(.landing-hero):not(.site-contact-page) > .imprint-panel {
    display: grid;
  }

  .imprint-panel strong {
    font-size: clamp(1.375rem, 8cqi, 1.875rem);
  }

  .imprint-panel p {
    font-size: 0.9375rem;
  }

  .public-page .site-contact-page .contact-form {
    gap: clamp(0.375rem, 1.2svh, 0.5625rem);
    padding: clamp(0.625rem, 3vw, 0.875rem);
  }

  .public-page .site-contact-page .contact-form input,
  .public-page .site-contact-page .contact-form select {
    min-height: clamp(2.375rem, 7svh, 2.75rem);
  }

  .public-page .site-contact-page .form-message {
    min-height: 0;
    font-size: 0.6875rem;
  }
}

@media (max-width: 56.25rem) and (max-height: 26.25rem) and (orientation: landscape) {
  .public-page .site-contact-page {
    gap: 0.75rem;
    padding-block: 0.625rem;
  }

  .public-page .site-contact-page .contact-channel {
    gap: 0.75rem;
    padding: 0.875rem;
  }

  .public-page .site-contact-page .contact-channel > div {
    gap: 0.375rem;
  }

  .public-page .site-contact-page .contact-channel > div > strong {
    font-size: clamp(1.125rem, 4cqi, 1.5rem);
  }

  .public-page .site-contact-page .contact-channel > div > p {
    font-size: 0.8125rem;
    line-height: 1.35;
  }

}

@media (max-width: 43.75rem) and (orientation: portrait) {
  .public-page .contact {
    grid-template-columns: 1fr;
  }

  .public-page .contact {
    align-items: stretch;
  }

  .public-page .contact-copy {
    min-width: 0;
    max-width: 100%;
  }
}

@media (max-width: 22.5rem), (max-height: 40rem) {
  .public-page .site-contact-page .contact-copy > .eyebrow {
    display: none;
  }

  .public-page .site-contact-page .contact-copy > h1 {
    max-width: 14ch;
    font-size: clamp(1.75rem, 12cqi, 2.125rem);
  }
}

@media (max-width: 22.5rem) {
  .public-page .lighthouse-console {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 53.75rem), (max-height: 40rem) {
  .landing-page .landing-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(0.75rem, 3vmin, 1.625rem);
    align-content: center;
  }

  .landing-page .landing-hero .hero-copy {
    max-width: var(--wide-copy-measure);
  }

  .landing-page .landing-hero .hero-product-pills {
    display: none;
  }
}

@media (max-height: 32.5rem) {
  .landing-page .landing-hero h1 {
    max-width: 16ch;
    font-size: clamp(2.125rem, 12cqi, 4.125rem);
    line-height: 1.03;
  }

  .landing-page .landing-hero .hero-copy > p {
    display: none;
  }
}

@media (max-height: 22.5rem) {
  .landing-page .landing-hero .eyebrow,
  .landing-page .landing-hero .hero-actions .button:nth-child(n+3) {
    display: none;
  }
}

@media (min-width: 53.8125rem) {
  .site-page .site-main > .hero,
  .site-page .site-main > .hero + .band {
    min-height: var(--viewport-block);
    height: auto;
    overflow: visible;
  }

  .site-page .hero:not(.landing-hero) {
    gap: clamp(1.5rem, 4vw, 4rem);
    grid-template-columns: minmax(0, 1fr) minmax(min(100%, 22.5rem), clamp(22.5rem, 28vi, 35rem));
    padding-top: clamp(1.125rem, 3svh, 2.875rem);
    padding-bottom: clamp(1.125rem, 3svh, 2.875rem);
  }

  .site-page .hero:not(.landing-hero) h1 {
    font-size: clamp(3.25rem, 12cqi, 5.75rem);
    line-height: 1.03;
  }

  .site-page .hero:not(.landing-hero) .hero-copy > p {
    margin-top: clamp(0.875rem, 2svh, 1.375rem);
    font-size: clamp(1rem, 4cqi, 1.25rem);
    line-height: 1.32;
  }

  .site-page .hero:not(.landing-hero) .hero-actions {
    margin-top: clamp(1rem, 2.4svh, 1.5rem);
  }

  .site-page .hero :is(.hero-kpis, .timeline, .lighthouse-panel) {
    align-self: center;
    justify-self: end;
    width: 100%;
    min-width: 0;
    max-height: 100%;
    max-width: none;
    overflow: hidden;
  }

  .site-page .hero .lighthouse-panel {
    min-height: clamp(13.75rem, 32svh, 22.5rem);
    align-content: center;
    padding: clamp(1.375rem, 3.2svh, 2.625rem);
  }

  .site-page .hero-kpis {
    gap: clamp(0.375rem, 1.5svh, 0.75rem);
  }

  .site-page .hero-kpis > div {
    min-height: clamp(3.875rem, 11svh, 5.625rem);
    padding: clamp(0.75rem, 2svh, 1.125rem);
  }

  .site-page .hero-kpis > div > strong,
  .site-page .hero-product-pills > a > strong {
    font-size: clamp(1.75rem, 5.2svh, 2.625rem);
  }

  .site-page .timeline {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }

  .site-page .timeline > div {
    min-height: 0;
    align-content: center;
    padding: clamp(0.875rem, 2.4svh, 1.5rem);
  }

  .site-page .timeline > div > strong {
    font-size: clamp(1.375rem, 3.6svh, 1.75rem);
  }

  .site-page .timeline > div > p {
    display: -webkit-box;
    overflow: hidden;
    font-size: clamp(0.8125rem, 2svh, 1rem);
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}

@media (min-width: 53.8125rem) and (max-height: 40rem) {
  .site-page .hero:not(.landing-hero) .hero-copy > p,
  .site-page .timeline > div > p {
    display: none;
  }
}

.region-panel,
.network-panel,
.decision-panel,
.portal-auth,
.portal-home-head,
.plant-view-head,
.portal-empty-state,
.portal-plant-card,
.plant-create-form,
.plant-status-panel,
.plant-ftp-panel,
.plant-events-panel,
.plant-status-hero,
.plant-chart-panel,
.plant-data-panel,
.plant-overview,
.plant-devices,
.plant-days,
.plant-import,
.lighthouse-console,
.contact-form {
  border: 0;
  background: var(--surface-bg-solid);
  box-shadow: var(--surface-depth);
}

.region-item,
.mode-button,
.metric,
.hero-kpis > :is(div, a),
.tabs,
.timeline,
.lighthouse-panel,
.portal-plant-metrics div,
.plant-ftp-grid div,
.plant-profile-card,
.plant-capability-groups li,
.plant-kpis div,
.plant-status-metrics div,
.plant-period-kpis div,
.plant-balance-board,
.plant-balance-totals div,
.plant-account-column,
.plant-account-row,
.plant-balance-equation,
.plant-chart-wrap,
.plant-device-row,
.plant-day-row,
.plant-empty-row,
.portal-tabs,
.plant-segment,
.plant-chart-controls,
.plant-section-tabs {
  border: 0;
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
}

.plant-day-header {
  background: transparent;
  box-shadow: none;
}

.site-page .hero .timeline,
.site-page .hero .lighthouse-panel,
.site-page .hero .hero-kpis > :is(div, a) {
  border: 0;
  background: var(--surface-bg-soft);
  box-shadow: var(--surface-depth-low);
}

.login-menu-button,
.language-select,
.mode-button,
.tab-button,
.portal-tabs button,
.plant-segment button,
.plant-chart-controls button,
.plant-section-tabs button {
  min-height: var(--control-min);
  border: 0;
  border-radius: var(--control-radius);
  background: var(--control-surface-bg);
  box-shadow: var(--control-shadow);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  transition: background-color .14s ease, background .14s ease, box-shadow .14s ease, color .14s ease;
}

.login-menu-button {
  padding-inline: 1.25rem 2.625rem;
}

.login-menu-button:hover,
.language-select:hover,
.mode-button:hover,
.tab-button:hover,
.portal-tabs button:hover,
.plant-segment button:hover,
.plant-chart-controls button:hover,
.plant-section-tabs button:hover {
  transform: none;
  background: var(--control-surface-hover);
  box-shadow: var(--control-shadow-hover);
  color: #fff;
}

.login-menu-button:active,
.language-select:active,
.mode-button:active,
.tab-button:active,
.portal-tabs button:active,
.plant-segment button:active,
.plant-chart-controls button:active,
.plant-section-tabs button:active {
  transform: none;
  background: #252b22;
}

.region-item,
.metric {
  border-radius: var(--control-card-radius);
  background: var(--control-surface-bg);
  box-shadow: var(--control-shadow);
}

.region-item:hover,
.metric:hover {
  transform: none;
  background: var(--control-surface-hover);
  box-shadow: var(--control-shadow-hover);
}

.region-item.active,
.mode-button.active,
.metric.active,
.tab-button.active,
.portal-tabs button.active,
.plant-segment button.active,
.plant-chart-controls button.active,
.plant-section-tabs button.active {
  background: var(--control-selected-bg);
  box-shadow: var(--control-shadow-active);
  color: #fff;
}

.topbar-actions .language-select,
.topbar-actions .login-menu-button,
.portal-top-actions .language-select {
  background: transparent;
  box-shadow: none;
  transform: none;
}

.topbar-actions .language-select:hover,
.topbar-actions .login-menu-button:hover,
.topbar-actions .login-menu.open .login-menu-button,
.portal-top-actions .language-select:hover {
  background: transparent;
  box-shadow: none;
  transform: none;
  color: #fff;
}

.login-menu-button::after {
  right: 1.125rem;
  width: 0.625rem;
  height: 0.5rem;
  border: 0;
  background: currentColor;
  clip-path: polygon(50% 78%, 10% 28%, 90% 28%);
  opacity: 0.68;
  transform: translateY(-50%);
  transform-origin: 50% 50%;
}

.login-menu.open .login-menu-button::after {
  opacity: 0.95;
  transform: translateY(-50%) rotate(180deg);
}

.login-menu-list {
  top: calc(100% + 0.625rem);
  padding: 0.5rem;
  border: 0;
  border-radius: var(--control-menu-radius);
  background: var(--control-menu-bg);
  box-shadow: inset 0 0 0 0.0625rem rgba(247,248,242,0.12), 0 1.125rem 2.625rem rgba(0,0,0,0.34);
}

.login-menu.open .login-menu-list {
  gap: 0.25rem;
}

.login-menu-link {
  min-height: var(--touch-target);
  padding-inline: 0.875rem;
  border-radius: calc(var(--control-menu-radius) - 0.375rem);
}

.login-menu-link:hover,
.login-menu-link:focus-visible {
  background: var(--control-surface-hover);
  box-shadow: var(--control-shadow);
}

.contact-form input,
.contact-form select,
.portal-login input,
.portal-plant-edit input,
.plant-create-form input {
  border-radius: var(--control-radius);
  background: var(--field-bg);
  box-shadow: var(--field-shadow);
}

.portal-tabs,
.plant-segment,
.plant-chart-controls,
.plant-section-tabs,
.tab-buttons {
  gap: 0.3125rem;
  padding: 0.3125rem;
  border: 0;
  border-radius: var(--control-radius);
  background: var(--control-group-bg);
  box-shadow: inset 0 0 0 0.0625rem rgba(247,248,242,0.08);
}

.tab-button {
  border: 0;
  border-radius: var(--control-radius);
}

.tab-buttons::after,
.tab-button:not(:last-child)::after {
  display: none;
}

.tab-button.active {
  color: #fff;
}

.region-item:hover,
.mode-button:hover,
.plant-account-row:hover,
.plant-device-row:hover,
.plant-day-row:not(.plant-day-header):hover {
  transform: none;
  background: var(--control-surface-hover);
  box-shadow: var(--control-shadow-hover);
}

.region-item.active,
.mode-button.active,
.metric.active,
.portal-plant-card.active,
.tab-button.active,
.portal-tabs button.active,
.plant-segment button.active,
.plant-chart-controls button.active,
.plant-section-tabs button.active {
  background: var(--control-selected-bg);
  box-shadow: var(--control-shadow-active);
}

.portal-login input,
.portal-plant-edit input,
.plant-create-form input,
.plant-import textarea,
.contact-form input,
.contact-form select {
  border: 0;
  box-shadow: var(--field-shadow);
}

.portal-login input:focus,
.portal-plant-edit input:focus,
.plant-create-form input:focus,
.plant-import textarea:focus,
.contact-form input:focus,
.contact-form select:focus {
  box-shadow: var(--field-focus-shadow);
}

.mode-panel,
.decision-card,
.tab-buttons,
.plant-status-panel div,
.plant-account-title,
.lighthouse-console > div {
  position: relative;
  border: 0;
}

.mode-panel {
  box-shadow: inset 0 0.0625rem 0 rgba(247,248,242,0.08);
}

.decision-card::after,
.tab-buttons::after,
.plant-account-title::after,
.plant-status-panel div:not(:last-child)::after,
.lighthouse-console > div:nth-child(-n + 2)::before {
  content: "";
  position: absolute;
  right: clamp(0.75rem, 5%, 1.75rem);
  bottom: 0;
  left: clamp(0.75rem, 5%, 1.75rem);
  height: 0.0625rem;
  background: var(--surface-divider);
  opacity: 0.82;
  pointer-events: none;
}

.tab-button {
  position: relative;
  border: 0;
}

.tab-button:not(:last-child)::after {
  display: none;
}

.plant-status-panel div:not(:last-child)::after {
  top: 0.875rem;
  right: 0;
  bottom: 0.875rem;
  left: auto;
  width: 0.0625rem;
  height: auto;
  background: var(--surface-divider-vertical);
}

.lighthouse-console > div,
.lighthouse-console > div:nth-child(2n),
.lighthouse-console > div:nth-last-child(-n + 2),
.lighthouse-console > div:last-child {
  border: 0;
}

.contact-form {
  background: var(--surface-bg);
}

.public-page {
  --surface: #11111a;
  --surface-2: #171724;
  --panel: #11111a;
  --panel-2: #171724;
  --panel-subtle: #0f0f17;
  --panel-ghost: #0b0b11;
  --panel-solid: #171724;
  --panel-inset: #0c0c13;
  --surface-sunken: #0b0b11;
  --surface-bg: #11111a;
  --surface-bg-solid: #151522;
  --surface-overlay-bg: #0c0c13;
  --surface-bg-soft: #101018;
  --surface-control-bg: #181827;
  --surface-control-bg-hover: #232236;
  --surface-active-bg: #8b5cf6;
  --control-surface-bg: #181827;
  --control-surface-hover: #232236;
  --control-selected-bg: #2b2142;
  --control-group-bg: #0c0c13;
  --control-menu-bg: #09090f;
  --field-bg: #101018;
  --status-live-border: rgba(101, 210, 131, 0.28);
  --status-live-bg: rgba(101, 210, 131, 0.13);
  --status-live-text: #e4fff1;
  --surface-depth: none;
  --surface-depth-low: none;
  --surface-control-shadow: none;
  --surface-control-shadow-hover: none;
  --surface-active-shadow: none;
}

.public-page .topbar {
  background-color: var(--bg);
}

.public-page .region-panel,
.public-page .network-panel,
.public-page .decision-panel,
.public-page .mode-panel,
.public-page .decision-card,
.public-page .lighthouse-panel,
.public-page .tab-panel,
.public-page .tabs,
.public-page .timeline,
.public-page .contact-form,
.public-page .imprint-panel,
.public-page .metric,
.public-page .hero-kpis > :is(div, a) {
  background: var(--surface-bg-solid);
  box-shadow: var(--surface-depth);
}

.public-page .metric {
  border: 0;
  transition: background-color .12s ease, color .12s ease, transform .12s ease;
}

.public-page .metric.active {
  background: #6d4de5;
  color: #fff;
  box-shadow: none;
}

.public-page .metric.active > span {
  color: #c9bbff;
}

.public-page .metric.active > strong {
  color: #fff;
}

.public-page .hero-product-pills > a {
  gap: 0.4375rem;
  background: var(--surface-bg-solid);
  box-shadow: none;
}

.public-page .hero-product-pills > a:hover,
.public-page .hero-product-pills > a:focus-visible {
  background: var(--control-surface-hover);
  box-shadow: none;
}

.public-page .hero-product-pills > a > span,
.public-page .hero-product-pills > a > em {
  color: rgba(247,248,242,0.72);
}

.public-page .contact-form,
.public-page .contact-custom-select {
  --field-bg: #09070f;
}

.public-page .contact-form input,
.public-page .contact-form select {
  background: var(--field-bg);
}

.public-page .severity,
.public-page .severity.clear,
.public-page .severity.info,
.public-page .severity.watch {
  --severity-bg: var(--control-primary-bg);
  --severity-text: #fff;
  box-shadow: none;
}

.public-page .timeline,
.site-page.public-page .hero .timeline {
  background: var(--surface-bg-solid);
  box-shadow: var(--surface-depth);
}

.public-page .timeline::before {
  content: none;
}

.public-page .timeline > div:not(:last-child)::after {
  background: rgba(139, 92, 246, 0.18);
  opacity: 1;
}

/* Keep the first Hero's visual layer inside one box spanning the header and Hero. */
.site-page .site-main > .hero:first-child {
  isolation: auto;
  min-height: calc(var(--viewport-block) + var(--nav-height));
  margin-top: 0;
  padding-top: calc(var(--first-section-pad-top, var(--viewport-frame)) + var(--nav-height));
  pointer-events: none;
}

.site-page .site-main > .hero:first-child > :not(.hero-energy-canvas) {
  pointer-events: auto;
}

.site-page .site-main > .hero:first-child .hero-energy-canvas,
.site-page .site-main > .hero:first-child::before {
  top: 0;
  height: 100%;
}

.site-page .site-main > .hero:first-child:not(.landing-hero) .hero-energy-canvas,
.site-page .site-main > .hero:first-child:not(.landing-hero)::before {
  height: calc(100% + var(--hero-section-bleed));
}

.site-page .site-main > .hero:first-child:last-child:not(.landing-hero) .hero-energy-canvas,
.site-page .site-main > .hero:first-child:last-child:not(.landing-hero)::before {
  height: 100%;
}

.public-page .login-menu-list,
.public-page .mobile-menu {
  background: var(--control-surface-bg);
  box-shadow: none;
}

@media (max-width: 53.75rem) {
  .public-page .region-panel,
  .public-page .network-panel,
  .public-page .decision-panel,
  .public-page .lighthouse-panel,
  .public-page .tabs,
  .public-page .timeline,
  .public-page .contact-form {
    box-shadow: var(--surface-depth-low);
  }

  .tab-button:not(:last-child)::after {
    top: auto;
    right: 1.125rem;
    bottom: 0;
    left: 1.125rem;
    width: auto;
    height: 0.0625rem;
    background: var(--surface-divider);
  }

  .plant-status-panel div:not(:last-child)::after,
  .lighthouse-console > div:not(:last-child)::before {
    top: auto;
    right: 1.125rem;
    bottom: 0;
    left: 1.125rem;
    width: auto;
    height: 0.0625rem;
    background: var(--surface-divider);
  }
}

@media (max-width: 26.25rem) and (max-height: 40rem) {
  .site-page .hero:not(.landing-hero) {
    grid-template-columns: minmax(0, 1fr);
  }

  .site-page .hero :is(.hero-kpis, .timeline, .lighthouse-panel) {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

@media (min-width: 76.3125rem) {
  .site-page .site-main > .hero + :is(.workspace, .operations, .use-cases):has(> .page-legal-link) {
    min-height: 100svh;
    height: 100svh;
  }
}

@media (min-width: 76.3125rem) and (max-height: 55rem) {
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) {
    --operations-gap: 0.625rem;
    --operations-panel-pad: 1.375rem 1.875rem;
    --operations-list-top: 0.75rem;
  }
}

@media (min-width: 76.3125rem) and (max-height: 48.75rem) {
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) {
    --operations-panel-pad: 1.125rem 1.625rem;
    --operations-list-top: 0.625rem;
  }
}

.site-page .site-main > .hero + .page-section:has(> .page-legal-link) {
  display: grid;
  align-content: stretch;
  min-height: 100svh;
  height: auto;
  padding-bottom: calc(var(--page-legal-bottom-inset) + env(safe-area-inset-bottom));
}

@media (min-width: 76.3125rem) {
  .site-page .site-main > .hero + :is(.workspace, .operations, .use-cases):has(> .page-legal-link) {
    height: 100svh;
  }
}

.site-page .site-main > .hero + :is(.operations, .use-cases):has(> .page-legal-link) {
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.site-page .site-main > .hero + .workspace:has(> .page-legal-link) {
  grid-template-rows: auto auto auto minmax(0, 1fr);
}

@media (min-width: 76.3125rem) {
  .site-page .site-main > .hero + .workspace:has(> .page-legal-link) {
    grid-template-rows: auto minmax(0, 1fr) auto auto;
  }
}

.site-page .site-main > .hero + .workspace:has(> .page-legal-link) > .workspace-grid,
.site-page .site-main > .hero + .operations:has(> .page-legal-link) > .operations-layout,
.site-page .site-main > .hero + .use-cases:has(> .page-legal-link) > .lighthouse-console {
  min-height: 0;
  align-self: stretch;
}

@media (min-width: 76.3125rem) and (max-height: 55rem) {
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) {
    --operations-gap: 0.5rem;
    --operations-tab-min: 2.5rem;
    --operations-panel-pad: 1.125rem 1.625rem;
    --operations-heading-size: 1.875rem;
    --operations-list-gap: 0.4375rem;
    --operations-list-top: 0.5rem;
    --operations-timeline-gap: 0.375rem;
    --operations-timeline-pad: 0.875rem 1.125rem;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .section-heading {
    gap: 0.4375rem;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .section-heading > .eyebrow {
    margin-bottom: 0;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .section-heading > h2 {
    font-size: clamp(2.25rem, 8cqi, 2.875rem);
    line-height: 1.01;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .section-heading > p {
    font-size: 0.875rem;
    line-height: 1.26;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .tab-panel > h3 {
    margin-bottom: 0.4375rem;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .tab-panel > p,
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .tab-panel > ul,
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .timeline > div > p {
    font-size: 0.8125rem;
    line-height: 1.24;
  }

  .site-page .site-main > .hero + .operations:has(> .page-legal-link) .timeline > div > strong {
    font-size: 1.375rem;
  }
}

@media (min-width: 76.3125rem) and (max-height: 42.5rem) {
  .site-page .site-main > .hero + .operations:has(> .page-legal-link) {
    --operations-panel-pad: 0.875rem 1.375rem;
    --operations-heading-size: 1.75rem;
    --operations-list-gap: 0.375rem;
    --operations-list-top: 0.375rem;
    --operations-timeline-pad: 0.75rem 1rem;
  }
}

.public-page {
  --public-bg: #07070b;
  --public-surface: #11111a;
  --public-surface-strong: #171724;
  --public-surface-hover: #232236;
  --public-surface-quiet: #0c0c13;
  --public-accent: #8b5cf6;
  --public-accent-strong: #6d4de5;
  --public-accent-hover: #9b7aff;
  --public-success: #5ed69b;
  --public-muted: #b6b0c8;
  --bg: var(--public-bg);
  --bg-soft: var(--public-surface-quiet);
  --surface-bg: var(--public-surface);
  --surface-bg-solid: var(--public-surface-strong);
  --surface-bg-soft: var(--public-surface);
  --surface-overlay-bg: var(--public-surface-quiet);
  --surface-control-bg: #181827;
  --surface-control-bg-hover: var(--public-surface-hover);
  --control-surface-bg: #181827;
  --control-surface-hover: var(--public-surface-hover);
  --control-primary-bg: var(--public-accent);
  --control-primary-bg-hover: var(--public-accent-hover);
  --control-selected-bg: var(--public-accent-strong);
  --control-group-bg: var(--public-surface-quiet);
  --control-menu-bg: #09090f;
  --surface-depth: none;
  --surface-depth-low: none;
  --surface-control-shadow: none;
  --surface-control-shadow-hover: none;
  --surface-active-shadow: none;
  --control-shadow: none;
  --control-shadow-hover: none;
  --control-shadow-active: none;
}

.public-page .region-panel,
.public-page .network-panel,
.public-page .decision-panel,
.public-page .mode-panel,
.public-page .decision-card,
.public-page .lighthouse-panel,
.public-page .tab-panel,
.public-page .tabs,
.public-page .timeline,
.public-page .contact-form,
.public-page .imprint-panel,
.public-page .metric,
.public-page .hero-kpis > :is(div, a),
.public-page .hero-product-pills > a {
  border: 0;
  background: var(--public-surface-strong);
  box-shadow: none;
}

.public-page .login-menu-button,
.public-page .language-select,
.public-page .mode-button,
.public-page .tab-button,
.public-page .metric {
  border: 0;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.public-page .metric.active,
.public-page .region-item.active,
.public-page .mode-button.active,
.public-page .tab-button.active {
  background: var(--public-accent-strong);
  color: #fff;
  box-shadow: none;
}

.public-page .login-menu-list,
.public-page .mobile-menu,
.public-page .tab-buttons,
.public-page .portal-tabs,
.public-page .plant-section-tabs {
  border: 0;
  background: var(--public-surface-quiet);
  box-shadow: none;
}

.public-page .login-menu-link:hover,
.public-page .login-menu-link:focus-visible,
.public-page .hero-product-pills > a:hover,
.public-page .hero-product-pills > a:focus-visible {
  background: var(--public-surface-hover);
  box-shadow: none;
}

.public-page .hero-kpis > :is(div, a)::after,
.public-page .mode-panel,
.public-page .tab-buttons,
.public-page .plant-status-panel div {
  box-shadow: none;
}

.theme-custom-select {
  flex: 0 0 auto;
  width: max-content;
}

.mobile-theme-custom-select {
  display: none;
  width: 100%;
  margin: 0 0 0.375rem;
}

html.public-page .topbar-actions {
  gap: var(--preference-group-gap);
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu-button {
  min-width: 0;
  min-height: var(--preference-control-block);
  padding-inline: var(--preference-control-pad-start) var(--preference-control-pad-end);
  border-radius: var(--preference-control-radius);
  background: transparent;
  box-shadow: none;
  color: var(--muted);
  font-size: 0.875rem;
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu-button:hover,
html.public-page :where(.topbar-actions, .mobile-menu) .login-menu.open .login-menu-button {
  background: transparent;
  box-shadow: none;
  color: var(--text);
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu-button::after {
  right: var(--preference-arrow-end);
  width: var(--preference-arrow-width);
  height: var(--preference-arrow-height);
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu-list {
  top: calc(100% + var(--preference-menu-offset));
  width: max-content;
  min-width: 100%;
  max-width: min(20rem, calc(100vw - 1.5rem));
  max-height: min(17.5rem, calc(100vh - 8rem));
  padding: var(--preference-menu-padding);
  border-radius: var(--preference-menu-radius);
  font-size: 0.875rem;
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu.open .login-menu-list {
  gap: var(--preference-menu-gap);
}

html.public-page :where(.topbar-actions, .mobile-menu) .login-menu-link {
  min-height: var(--preference-option-block);
  padding-inline: var(--preference-option-pad);
  border-radius: var(--preference-option-radius);
  font-size: 0.875rem;
}

@media (max-width: 53.75rem) {
  .topbar-actions > .theme-custom-select:not(.mobile-theme-custom-select) {
    display: none;
  }

  .mobile-theme-custom-select {
    display: inline-flex;
  }
}

html[data-theme="light"].public-page {
  color-scheme: light;
  --public-bg: #f7f6fb;
  --public-surface: #ffffff;
  --public-surface-strong: #f0edf5;
  --public-surface-hover: #e8e3f0;
  --public-surface-quiet: #eeebf4;
  --public-accent: #7c5cff;
  --public-accent-strong: #6d4de5;
  --public-accent-hover: #5e40cf;
  --public-success: #24855a;
  --public-muted: #5f566e;
  --bg: var(--public-bg);
  --bg-soft: var(--public-surface-quiet);
  --surface: #ffffff;
  --surface-2: #f1eff8;
  --panel: #ffffff;
  --panel-2: #f1eff8;
  --panel-subtle: #f8f7fb;
  --panel-ghost: #eeebf4;
  --panel-solid: #ffffff;
  --surface-sunken: #eeebf4;
  --panel-inset: #f3f1f7;
  --surface-bg: var(--public-surface);
  --surface-bg-solid: var(--public-surface-strong);
  --surface-bg-soft: var(--public-surface);
  --surface-overlay-bg: var(--public-surface-quiet);
  --surface-control-bg: #ebe8f1;
  --surface-control-bg-hover: var(--public-surface-hover);
  --surface-active-bg: var(--public-accent-strong);
  --line-hairline: rgba(43, 34, 57, 0.08);
  --line-card: rgba(43, 34, 57, 0.1);
  --line-soft: rgba(43, 34, 57, 0.1);
  --line: rgba(43, 34, 57, 0.14);
  --line-strong: rgba(43, 34, 57, 0.22);
  --text: #1c1727;
  --muted: #5f566e;
  --muted-2: #746a82;
  --cyan: #087f8c;
  --green: #24784d;
  --amber: #9a5b00;
  --violet: #6d4de5;
  --danger: #b83b48;
  --on-accent: #ffffff;
  --control-surface-bg: #ebe8f1;
  --control-surface-hover: var(--public-surface-hover);
  --control-primary-bg: var(--public-accent);
  --control-primary-bg-hover: var(--public-accent-hover);
  --control-selected-bg: var(--public-accent-strong);
  --control-group-bg: var(--public-surface-quiet);
  --control-menu-bg: #ffffff;
  --field-bg: #f3f1f7;
  --field-border: rgba(43, 34, 57, 0.14);
  --field-border-strong: rgba(43, 34, 57, 0.22);
  --status-live-border: transparent;
  --status-live-bg: var(--public-surface-quiet);
  --status-live-text: var(--text);
}

html[data-theme="light"].public-page .mobile-menu {
  background: var(--public-bg);
}

html[data-theme="light"].public-page .hero::before {
  background-image:
    radial-gradient(circle at 82% 22%, rgba(124, 92, 255, 0.13), transparent 30%),
    radial-gradient(circle at 68% 74%, rgba(223, 71, 255, 0.09), transparent 32%),
    linear-gradient(90deg, rgba(247, 246, 251, 0.98) 0%, rgba(247, 246, 251, 0.78) 46%, rgba(247, 246, 251, 0.18) 100%),
    linear-gradient(180deg, rgba(247, 246, 251, 0.92) 0%, rgba(247, 246, 251, 0.08) 46%, rgba(247, 246, 251, 0) 100%);
}

html[data-theme="light"].public-page .hero::after {
  background-image: linear-gradient(180deg, rgba(247, 246, 251, 0), rgba(247, 246, 251, 0.82) 58%, rgba(247, 246, 251, 0));
}

html[data-theme="light"].public-page .brand:hover,
html[data-theme="light"].public-page .nav-links a:hover,
html[data-theme="light"].public-page .topbar-actions .login-menu-button:hover,
html[data-theme="light"].public-page .topbar-actions .login-menu.open .login-menu-button,
html[data-theme="light"].public-page .login-menu-link,
html[data-theme="light"].public-page .hero-product-pills > a > span,
html[data-theme="light"].public-page .hero-product-pills > a > em {
  color: var(--text);
}

html[data-theme="light"].public-page .nav-links a.active {
  color: var(--public-accent-strong);
}

html[data-theme="light"].public-page .contact-form,
html[data-theme="light"].public-page .contact-custom-select {
  --field-bg: #f3f1f7;
}

html[data-theme="light"].public-page.locale-loading,
html[data-theme="light"].public-page.locale-loading body {
  background: var(--public-bg);
}

@media (prefers-color-scheme: light) {
  html.public-page:not([data-theme]) {
    color-scheme: light;
  --public-bg: #f7f6fb;
  --public-surface: #ffffff;
  --public-surface-strong: #f0edf5;
  --public-surface-hover: #e8e3f0;
  --public-surface-quiet: #eeebf4;
  --public-accent: #7c5cff;
  --public-accent-strong: #6d4de5;
  --public-accent-hover: #5e40cf;
  --public-success: #24855a;
  --public-muted: #5f566e;
  --bg: var(--public-bg);
  --bg-soft: var(--public-surface-quiet);
  --surface: #ffffff;
  --surface-2: #f1eff8;
  --panel: #ffffff;
  --panel-2: #f1eff8;
  --panel-subtle: #f8f7fb;
  --panel-ghost: #eeebf4;
  --panel-solid: #ffffff;
  --surface-sunken: #eeebf4;
  --panel-inset: #f3f1f7;
  --surface-bg: var(--public-surface);
  --surface-bg-solid: var(--public-surface-strong);
  --surface-bg-soft: var(--public-surface);
  --surface-overlay-bg: var(--public-surface-quiet);
  --surface-control-bg: #ebe8f1;
  --surface-control-bg-hover: var(--public-surface-hover);
  --surface-active-bg: var(--public-accent-strong);
  --line-hairline: rgba(43, 34, 57, 0.08);
  --line-card: rgba(43, 34, 57, 0.1);
  --line-soft: rgba(43, 34, 57, 0.1);
  --line: rgba(43, 34, 57, 0.14);
  --line-strong: rgba(43, 34, 57, 0.22);
  --text: #1c1727;
  --muted: #5f566e;
  --muted-2: #746a82;
  --cyan: #087f8c;
  --green: #24784d;
  --amber: #9a5b00;
  --violet: #6d4de5;
  --danger: #b83b48;
  --on-accent: #ffffff;
  --control-surface-bg: #ebe8f1;
  --control-surface-hover: var(--public-surface-hover);
  --control-primary-bg: var(--public-accent);
  --control-primary-bg-hover: var(--public-accent-hover);
  --control-selected-bg: var(--public-accent-strong);
  --control-group-bg: var(--public-surface-quiet);
  --control-menu-bg: #ffffff;
  --field-bg: #f3f1f7;
  --field-border: rgba(43, 34, 57, 0.14);
  --field-border-strong: rgba(43, 34, 57, 0.22);
  --status-live-border: transparent;
  --status-live-bg: var(--public-surface-quiet);
  --status-live-text: var(--text);
  }

  html.public-page:not([data-theme]) .mobile-menu {
    background: var(--public-bg);
  }

  html.public-page:not([data-theme]) .hero::before {
    background-image:
      radial-gradient(circle at 82% 22%, rgba(124, 92, 255, 0.13), transparent 30%),
      radial-gradient(circle at 68% 74%, rgba(223, 71, 255, 0.09), transparent 32%),
      linear-gradient(90deg, rgba(247, 246, 251, 0.98) 0%, rgba(247, 246, 251, 0.78) 46%, rgba(247, 246, 251, 0.18) 100%),
      linear-gradient(180deg, rgba(247, 246, 251, 0.92) 0%, rgba(247, 246, 251, 0.08) 46%, rgba(247, 246, 251, 0) 100%);
  }

  html.public-page:not([data-theme]) .hero::after {
    background-image: linear-gradient(180deg, rgba(247, 246, 251, 0), rgba(247, 246, 251, 0.82) 58%, rgba(247, 246, 251, 0));
  }

  html.public-page:not([data-theme]) .brand:hover,
  html.public-page:not([data-theme]) .nav-links a:hover,
  html.public-page:not([data-theme]) .topbar-actions .login-menu-button:hover,
  html.public-page:not([data-theme]) .topbar-actions .login-menu.open .login-menu-button,
  html.public-page:not([data-theme]) .login-menu-link,
  html.public-page:not([data-theme]) .hero-product-pills > a > span,
  html.public-page:not([data-theme]) .hero-product-pills > a > em {
    color: var(--text);
  }

  html.public-page:not([data-theme]) .nav-links a.active {
    color: var(--public-accent-strong);
  }

  html.public-page:not([data-theme]) .contact-form,
  html.public-page:not([data-theme]) .contact-custom-select {
    --field-bg: #f3f1f7;
  }

  html.public-page:not([data-theme]).locale-loading,
  html.public-page:not([data-theme]).locale-loading body {
    background: var(--public-bg);
  }
}

html.public-page .topbar {
  position: relative;
  inset: auto;
  z-index: 40;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--topbar-gap);
  width: 100vw;
  min-height: var(--nav-height);
  height: auto;
  padding-inline-start: var(--content-inset-start);
  padding-inline-end: var(--content-inset-end);
  padding-block: 0.375rem;
  overflow: visible;
  background: transparent;
}

html.site-page.public-page .site-main > .hero:first-child {
  min-height: var(--viewport-block);
  padding-top: var(--first-section-pad-top, var(--viewport-frame));
}

html.site-page.public-page .site-main > .hero:first-child .hero-energy-canvas,
html.site-page.public-page .site-main > .hero:first-child::before {
  top: calc(var(--nav-height) * -1);
  height: calc(100% + var(--nav-height));
}

html.site-page.public-page .site-main > .hero:first-child:not(.landing-hero) .hero-energy-canvas,
html.site-page.public-page .site-main > .hero:first-child:not(.landing-hero)::before {
  height: calc(100% + var(--nav-height) + var(--hero-section-bleed));
}

html.site-page.public-page .site-main > .hero:first-child:last-child:not(.landing-hero) .hero-energy-canvas,
html.site-page.public-page .site-main > .hero:first-child:last-child:not(.landing-hero)::before {
  height: calc(100% + var(--nav-height));
}

html.public-page {
  --ui-control-min: var(--control-min);
  --ui-control-radius: var(--control-radius);
  --ui-control-surface: var(--public-surface-quiet);
  --ui-control-surface-hover: var(--public-surface-hover);
  --ui-field-surface: var(--field-bg);
  --ui-menu-surface: var(--control-menu-bg);
  --ui-muted: var(--muted);
  --ui-primary: var(--public-accent);
  --ui-primary-hover: var(--public-accent-hover);
  --ui-primary-surface: color-mix(in srgb, var(--ui-primary) 82%, #160b33);
  --ui-primary-surface-hover: color-mix(in srgb, var(--ui-primary-hover) 82%, #160b33);
  --ui-selected: var(--public-accent-strong);
  --ui-text: var(--text);
  --ui-danger: var(--danger);
  --ui-focus: var(--public-accent);
  --ui-status-surface: var(--public-surface-strong);
  inline-size: 100vw;
  max-inline-size: 100vw;
  overflow-x: clip;
  scrollbar-gutter: auto;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--muted) 58%, transparent) transparent;
}

html.site-page.public-page .topbar .nav-links a {
  background: transparent;
  box-shadow: none;
}

html.site-page.public-page .site-main > .hero .lighthouse-panel,
html.site-page.public-page .site-main > .hero .timeline,
html.site-page.public-page .site-main > .hero .hero-kpis > :is(div, a) {
  background: var(--public-surface-strong);
  box-shadow: none;
}

/* Grid Pilot describes a deployable control workflow without implying a live connection. */
.grid-pilot-hero .hero-kpis > div > strong {
  max-width: 100%;
  font-size: clamp(1rem, 2.4cqi, 1.5rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.public-page .workspace .region-item,
.public-page .workspace .metric {
  cursor: default;
  transition: none;
}

.public-page .workspace .region-item:hover,
.public-page .workspace .metric:hover {
  transform: none;
  background: var(--surface-bg-solid);
  box-shadow: none;
}

.public-page .workspace .region-item {
  grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
}

.public-page .workspace .region-item > strong {
  text-align: right;
  overflow-wrap: anywhere;
}

.public-page .workspace .mode-panel > p {
  margin: 0.5625rem 0 0;
  color: var(--muted);
  font-size: 0.8125rem;
  line-height: 1.4;
}

.public-page .workspace .event-list > li {
  grid-template-columns: minmax(0, 1fr) auto;
}

.public-page .workspace .metric > strong {
  font-size: clamp(1rem, 2.5cqi, 1.5rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.grid-pilot-workspace .network-map text {
  fill: var(--muted);
  opacity: 1;
}

.grid-pilot-workspace .network-map text.svg-strong {
  fill: var(--text);
}

/* The Public contact surface is enabled only when public-web has a verified target. */
.contact-channel {
  display: grid;
  gap: 1.125rem;
  padding: clamp(1.125rem, 3vw, 1.75rem);
  border-radius: var(--radius);
  background: var(--surface-bg-solid);
}

.contact-channel > div {
  display: grid;
  gap: 0.5625rem;
}

.contact-channel > div > span {
  color: var(--muted-2);
  font-size: 0.6875rem;
  font-weight: 850;
  text-transform: uppercase;
}

.contact-channel > div > strong {
  font-size: clamp(1.35rem, 4cqi, 2rem);
  line-height: 1.12;
}

.contact-channel > div > p {
  margin: 0;
  color: var(--muted);
  line-height: 1.5;
}

.contact-channel > .button {
  width: fit-content;
}

.contact-form textarea {
  width: 100%;
  min-width: 0;
  min-height: clamp(7rem, 18svh, 11rem);
  padding: 0.875rem var(--field-pad-x);
  resize: vertical;
  border: 0;
  border-radius: var(--control-radius);
  background: var(--field-bg);
  box-shadow: var(--field-shadow);
  color: var(--text);
  font: inherit;
  line-height: 1.45;
  outline: none;
}

.contact-form textarea:focus {
  box-shadow: var(--field-focus-shadow);
}

.contact-direct-link {
  width: fit-content;
  color: var(--muted);
  font-size: 0.8125rem;
  text-decoration: underline;
  text-underline-offset: 0.1875rem;
}

@media (max-width: 43.75rem) {
  .public-page .grid-pilot-workspace .workspace-actions {
    display: flex;
  }

  .contact-channel {
    gap: 0.875rem;
    padding: 1rem;
  }

  .contact-channel > .button {
    width: 100%;
  }

  .contact-form textarea {
    min-height: 5rem;
  }

  .public-page .site-contact-page .contact-form input,
  .public-page .site-contact-page .contact-direct-link {
    min-height: 2.75rem;
  }

  .public-page .site-contact-page .contact-direct-link {
    display: inline-flex;
    align-items: center;
  }
}

html.public-page::-webkit-scrollbar,
html.public-page .public-menu-content::-webkit-scrollbar {
  width: var(--site-scrollbar-size);
}

html.public-page::-webkit-scrollbar-track,
html.public-page .public-menu-content::-webkit-scrollbar-track {
  background: transparent;
}

html.public-page::-webkit-scrollbar-thumb,
html.public-page .public-menu-content::-webkit-scrollbar-thumb {
  border: 0.1875rem solid transparent;
  border-radius: 999rem;
  background: color-mix(in srgb, var(--muted) 58%, transparent);
  background-clip: content-box;
}

.site-page .site-main > .hero:first-child::before {
  right: auto;
}

.site-page .site-main > .hero:first-child::after {
  right: 0;
  bottom: calc(var(--hero-section-bleed) * -1);
  left: 0;
  height: calc(var(--hero-section-feather) + var(--hero-section-bleed));
  background: linear-gradient(to bottom, transparent, var(--bg));
}

.site-page .site-main > .hero:first-child:last-child::after {
  bottom: 0;
  height: var(--hero-section-feather);
}

/* Public uses the same one-row Header and Drawer model at every viewport. */
html.public-page {
  --nav-height: var(--site-header-height);
}

html.public-page.public-menu-open,
html.public-page.public-menu-open body {
  overscroll-behavior: none;
}

html.public-page.public-menu-open {
  scrollbar-width: none;
}

html.public-page.public-menu-open::-webkit-scrollbar {
  width: 0;
  height: 0;
}

html.public-page .brand {
  padding-inline: 0;
  background: transparent;
  box-shadow: none;
}

html.public-page .brand-mark {
  justify-items: start;
}

html.public-page .brand-mark::before {
  transform: translateX(var(--site-brand-slash-offset)) skew(-18deg);
}

html.public-page .mobile-toggle {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 0.25rem;
  width: var(--site-header-control-size);
  height: var(--site-header-control-size);
  padding: 0;
  background: transparent;
  box-shadow: none;
  -webkit-tap-highlight-color: transparent;
}

html.public-page .mobile-toggle > span {
  width: 1.125rem;
  height: 0.125rem;
  margin: 0;
}

html.public-page .mobile-toggle[aria-expanded="true"] > span {
  opacity: 1;
  transform: none;
}

html.public-page .mobile-toggle:hover,
html.public-page .mobile-toggle:focus-visible {
  background: transparent;
  box-shadow: none;
  color: var(--text);
}

html.public-page.public-menu-open .topbar {
  z-index: 47;
  pointer-events: none;
}

html.public-page.public-menu-open .brand {
  z-index: 48;
}

html.public-page.public-menu-open .mobile-toggle {
  visibility: hidden;
}

.public-menu-backdrop,
html.public-page .mobile-menu {
  display: none;
}

html.public-page.public-menu-open .public-menu-backdrop {
  position: fixed;
  inset-block: 0;
  inset-inline-start: 0;
  z-index: 44;
  display: block;
  width: 100vw;
  background: transparent;
  touch-action: none;
}

html.public-page .mobile-menu.open {
  --ui-control-surface: var(--public-surface-strong);
  --ui-drawer-control-size: var(--site-header-control-size);
  position: fixed;
  inset-block: 0;
  inset-inline-end: 0;
  inset-inline-start: auto;
  z-index: 45;
  display: block;
  width: min(var(--site-drawer-width), 100vw);
  height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: var(--public-surface);
  box-shadow: -1.125rem 0 3.75rem color-mix(in srgb, #000 34%, transparent);
}

html.public-page .public-menu-close {
  position: fixed;
  inset-block-start: 0.375rem;
  inset-inline-end: var(--content-inset-end);
  z-index: 2;
}

html.public-page .band {
  width: 100vw;
  padding-inline-start: var(--content-inset-start);
  padding-inline-end: var(--content-inset-end);
}

html.public-page .public-menu-content {
  position: absolute;
  inset-block-start:
    calc(0.375rem + var(--site-header-control-size) + var(--site-drawer-gap));
  inset-block-end: 0;
  inset-inline: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: var(--site-drawer-gap);
  padding:
    0
    var(--site-drawer-inset)
    calc(var(--site-drawer-gap) + env(safe-area-inset-bottom));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

html.public-page .public-menu-navigation,
html.public-page .public-menu-settings {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.625rem;
  width: 100%;
  min-width: 0;
}

html.public-page .public-menu-settings {
  gap: 0.75rem;
}

html.public-page .mobile-menu :is(
  .custom-select,
  .custom-select-button,
  .theme-custom-select,
  .language-custom-select,
  .public-login-link
) {
  width: 100%;
  min-width: 0;
}

@media (max-width: 68.75rem) {
  html.public-page .mobile-menu.open {
    inset-inline-end: auto;
    inset-inline-start: 0;
    width: 100vw;
    box-shadow: none;
  }

  html.public-page .public-menu-navigation,
  html.public-page .public-menu-settings {
    justify-self: center;
    width: min(100%, 48rem);
  }
}

@media (max-width: 32.5rem) {
  .landing-page .landing-hero .hero-actions {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 9.25rem), 1fr));
    gap: clamp(0.5rem, 0.35rem + 0.7vw, 0.75rem);
  }

  .landing-page .landing-hero .hero-actions .button {
    width: 100%;
    min-width: 0;
  }

  .landing-page .landing-hero .hero-actions .button.primary:first-child {
    grid-column: 1 / -1;
  }

  .site-page .hero:not(.landing-hero) .hero-actions {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
    gap: clamp(0.5rem, 0.35rem + 0.7vi, 0.75rem);
  }

  .site-page .hero:not(.landing-hero) .hero-actions .button {
    width: 100%;
    min-width: 0;
  }
}