:root {
  --dc-navy: #002a61;
  --dc-navy-deep: #001d43;
  --dc-navy-mid: #07366d;
  --dc-navy-raised: #0d4785;
  --dc-sky: #87ceeb;
  --dc-cyan: #20b8d8;
  --dc-amber: #f3a712;
  --dc-white: #fff;
  --dc-muted: #bdd5e7;
  --dc-line: rgba(255, 255, 255, .24);
  --dc-panel: rgba(0, 42, 97, .96);
  --dc-card: rgba(255, 255, 255, .075);
  --dc-icon-bolt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M37 2 11 35h16l-5 27 31-36H37l6-24Z' fill='black'/%3E%3C/svg%3E");
  --dc-icon-datacenter: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M13 10h38a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H13a5 5 0 0 1-5-5V15a5 5 0 0 1 5-5Zm0 24h38a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H13a5 5 0 0 1-5-5V39a5 5 0 0 1 5-5Zm7-17h18v6H20Zm0 24h18v6H20Zm22-24h6v6h-6Zm0 24h6v6h-6Z' fill='black'/%3E%3C/svg%3E");
}

body.datacenter-page {
  min-height: 100vh;
  margin: 0;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  font-family: NectoMono, ui-monospace, monospace;
}

.dc-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

body.datacenter-page::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  content: "";
  background: rgba(0, 16, 38, .55);
  pointer-events: none;
}

.dc-shell {
  width: min(1580px, calc(100% - 1rem));
  margin: .6rem auto 2rem;
  padding: .75rem;
  border: 1px solid var(--dc-line);
  border-radius: 1rem;
  background: var(--dc-panel);
  box-shadow: 0 1.2rem 3.5rem rgba(0, 0, 0, .45);
}

.dc-shell strong { color: inherit; }

.dc-kicker,
.dc-eyebrow {
  margin: 0;
  color: var(--dc-sky);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.2;
  text-transform: uppercase;
}

.dc-map-intro h1,
.dc-pane-heading h3,
.dc-detail h2,
.dc-fact-group h3,
.dc-disclosure summary strong,
.dc-source-card h3 {
  font-family: Mattone, Arial, sans-serif;
}

.dc-map-intro {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.5rem;
  padding: .1rem .25rem .65rem;
  border-bottom: 1px solid var(--dc-line);
}

.dc-map-intro h1 {
  margin: .15rem 0 0;
  color: var(--dc-sky);
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  line-height: 1.05;
  letter-spacing: -.025em;
}

.dc-active-tag-filters {
  width: min(44rem, 58%);
  min-height: 3rem;
  padding: .48rem .58rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .55rem;
  background: rgba(4, 22, 41, .58);
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.dc-active-tag-filters.has-active-tags {
  border-color: var(--dc-amber);
  background: color-mix(in srgb, var(--dc-amber) 9%, var(--dc-navy-deep));
  box-shadow: inset .22rem 0 0 var(--dc-amber);
}

.dc-active-tag-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  color: var(--dc-sky);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-active-tag-heading button {
  padding: .16rem .42rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .3rem;
  background: var(--dc-navy-mid);
  color: var(--dc-white);
  font: inherit;
  cursor: pointer;
}

.dc-active-tag-heading button:hover,
.dc-active-tag-heading button:focus-visible {
  border-color: var(--dc-amber);
  color: #ffe2a8;
}

.dc-active-tag-actions,
.dc-tag-filter-mode {
  display: flex;
  align-items: center;
}

.dc-active-tag-actions {
  gap: .42rem;
}

.dc-tag-filter-mode {
  padding: .1rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .38rem;
  background: rgba(1, 12, 25, .52);
}

.dc-tag-filter-mode button {
  min-width: 2.65rem;
  border: 0;
  background: transparent;
  color: var(--dc-muted);
}

.dc-tag-filter-mode button[aria-pressed="true"] {
  background: var(--dc-amber);
  color: var(--dc-navy-deep);
}

.dc-tag-filter-mode button[aria-pressed="true"]:hover,
.dc-tag-filter-mode button[aria-pressed="true"]:focus-visible {
  color: var(--dc-navy-deep);
}

.dc-active-tag-filter-list {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .38rem;
}

.dc-active-tag-empty {
  color: var(--dc-muted);
  font-size: .62rem;
}

.dc-active-tag {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  min-height: 1.45rem;
  padding: .16rem .28rem .16rem .48rem;
  border: 1px solid var(--dc-amber);
  border-radius: 999px;
  background: rgba(243, 167, 18, .13);
  color: var(--dc-white);
  font-size: .6rem;
  font-weight: 750;
  cursor: pointer;
}

.dc-active-tag::after {
  display: grid;
  width: 1rem;
  height: 1rem;
  place-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  content: "×";
  font-size: .78rem;
}

.dc-active-tag:hover,
.dc-active-tag:focus-visible {
  background: rgba(243, 167, 18, .28);
}

.dc-downloads {
  display: grid;
  grid-template-columns: repeat(4, minmax(8rem, 1fr));
  gap: .5rem;
  width: 100%;
  margin-bottom: 1rem;
}

.dc-downloads a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.8rem;
  padding: .55rem .7rem;
  border: 1px solid var(--dc-line);
  border-radius: .7rem;
  color: var(--dc-white);
  background: var(--dc-card);
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.dc-downloads a:hover,
.dc-downloads a:focus-visible {
  border-color: var(--dc-sky);
  background: rgba(135, 206, 235, .18);
  outline: 2px solid var(--dc-sky);
  outline-offset: 2px;
}

.dc-filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(300px, 2fr) auto auto;
  gap: .5rem;
  align-items: end;
  margin: .65rem 0;
  padding: .6rem;
  border: 1px solid var(--dc-line);
  border-radius: .75rem;
  background: rgba(0, 29, 67, .72);
}

.dc-filter-field {
  display: grid;
  gap: .28rem;
  min-width: 0;
  color: var(--dc-muted);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dc-filter-field input,
.dc-filter-field select {
  width: 100%;
  min-height: 2.35rem;
  padding: .5rem 1.8rem .5rem .6rem;
  border: 1px solid rgba(135, 206, 235, .45);
  border-radius: .45rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  color-scheme: dark;
  font: 700 .7rem NectoMono, ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: none;
}

.dc-filter-field input::placeholder { color: #94b5cd; opacity: 1; }

.dc-filter-field input:focus,
.dc-filter-field select:focus {
  border-color: var(--dc-sky);
  outline: 3px solid rgba(32, 184, 216, .28);
}

.dc-layer-search { margin: .65rem .7rem .25rem; }

.dc-layer-search-empty {
  margin: .65rem .7rem;
  color: var(--dc-muted);
  font-size: .68rem;
}

.dc-filter-summary {
  display: grid;
  gap: .3rem;
  min-width: 0;
}

.dc-filter-summary-label {
  color: var(--dc-muted);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dc-filter-chip-list {
  display: flex;
  gap: .3rem;
  min-height: 2.35rem;
  align-items: center;
  overflow-x: auto;
}

.dc-filter-chip {
  flex: 0 0 auto;
  padding: .32rem .48rem;
  border: 1px solid rgba(135, 206, 235, .38);
  border-radius: 999px;
  color: var(--dc-white);
  background: rgba(32, 184, 216, .13);
  font-size: .58rem;
}

.dc-filter-chip--empty { color: var(--dc-muted); background: transparent; }

.dc-filter-reset,
.dc-layer-locate,
.dc-layer-gear,
.dc-modal button {
  border: 1px solid rgba(135, 206, 235, .45);
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  font: 700 .65rem NectoMono, ui-monospace, monospace;
  cursor: pointer;
}

.dc-filter-reset {
  min-height: 2.35rem;
  padding: .5rem .65rem;
  border-radius: .45rem;
}

.dc-filter-reset:hover,
.dc-layer-locate:hover,
.dc-layer-gear:hover,
.dc-modal button:hover { border-color: var(--dc-sky); background: var(--dc-navy-raised); }

.dc-filter-menu {
  position: relative;
  margin: 0;
}

.dc-filter-menu > summary {
  display: flex;
  align-items: center;
  min-height: 2.35rem;
  padding: .5rem .7rem;
  border: 1px solid rgba(135, 206, 235, .45);
  border-radius: .45rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  cursor: pointer;
  font-size: .68rem;
  font-weight: 700;
  list-style-position: inside;
  white-space: nowrap;
}

.dc-filter-menu[open] > summary {
  border-color: var(--dc-sky);
  background: var(--dc-navy-raised);
}

.dc-filter-menu > fieldset,
.dc-filter-menu > div,
.dc-filter-menu > p {
  position: absolute;
  right: 0;
  z-index: 20;
  width: 19rem;
  border-color: var(--dc-line);
  background: var(--dc-navy-deep);
  box-shadow: 0 .7rem 1.6rem rgba(0, 0, 0, .5);
}

.dc-filter-menu > fieldset,
.dc-filter-menu > div { top: calc(100% + .35rem); }

.dc-filter-menu > p {
  top: calc(100% + 8.25rem);
  margin: 0;
  padding: .55rem;
  border: 1px solid var(--dc-line);
  border-radius: .45rem;
}

.dc-workspace {
  display: grid;
  grid-template-columns: minmax(245px, .76fr) minmax(430px, 2fr) minmax(300px, .94fr);
  height: clamp(580px, calc(100vh - 13rem), 820px);
  overflow: hidden;
  border: 1px solid var(--dc-line);
  border-radius: .85rem;
  background: var(--dc-navy-deep);
  box-shadow: 0 .8rem 2rem rgba(0, 0, 0, .24);
}

.dc-controls,
.dc-detail,
.dc-map-panel {
  min-width: 0;
  color: var(--dc-white);
  background: var(--dc-navy-mid);
}

.dc-controls,
.dc-detail {
  height: 100%;
  overflow: auto;
  padding: 1rem;
  scrollbar-color: var(--dc-sky) var(--dc-navy-deep);
  scrollbar-width: thin;
}

.dc-controls { border-right: 1px solid var(--dc-line); }
.dc-detail {
  position: relative;
  border-left: 1px solid var(--dc-line);
}

.dc-inspector-close {
  position: sticky;
  z-index: 8;
  top: 0;
  float: right;
  display: grid;
  width: 2rem;
  height: 2rem;
  margin: 0 0 .4rem .65rem;
  place-items: center;
  border: 1px solid var(--dc-sky);
  border-radius: 50%;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  box-shadow: 0 .25rem .8rem rgba(0, 0, 0, .35);
  cursor: pointer;
  font: 700 1.25rem/1 Mattone, Arial, sans-serif;
}

.dc-inspector-close:hover,
.dc-inspector-close:focus-visible {
  color: var(--dc-navy-deep);
  background: var(--dc-sky);
  outline: 2px solid var(--dc-white);
  outline-offset: 2px;
}

.dc-inspector-close[hidden] { display: none; }

.dc-pane-heading {
  min-height: 3.6rem;
  margin: -1rem -1rem 1rem;
  padding: .85rem 1rem .75rem;
  border-bottom: 1px solid var(--dc-line);
  background: rgba(0, 29, 67, .42);
}

.dc-map-panel > .dc-pane-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 0;
}

.dc-pane-heading h3 {
  margin: .18rem 0 0;
  color: var(--dc-white);
  font-size: 1rem;
  line-height: 1.2;
}

.dc-map-title-editor {
  display: grid;
  flex: 1 1 16rem;
  min-width: min(17rem, 42vw);
  gap: .2rem;
}

.dc-map-title-editor .dc-eyebrow { margin-bottom: 0; }

#map-title-input {
  width: 100%;
  padding: .18rem .28rem;
  border: 1px solid transparent;
  border-radius: .3rem;
  color: var(--dc-white);
  background: transparent;
  font: 700 1rem/1.2 Mattone, Arial, sans-serif;
}

#map-title-input:hover,
#map-title-input:focus {
  border-color: var(--dc-line-strong);
  background: rgba(0, 17, 43, .46);
  outline: none;
}

.dc-map-title-toggle {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  width: max-content;
  color: var(--dc-muted);
  font: 700 .56rem/1.25 NectoMono, monospace;
  letter-spacing: .03em;
}

.dc-map-title-toggle input { margin: 0; accent-color: var(--dc-amber); }

.dc-rendered-map-title {
  position: absolute;
  z-index: 12;
  top: 1rem;
  left: 50%;
  max-width: calc(100% - 9rem);
  padding: .48rem .8rem;
  border: 1px solid rgba(143, 210, 237, .7);
  border-radius: .4rem;
  color: #f8fbff;
  background: rgba(0, 29, 67, .88);
  box-shadow: 0 .25rem 1rem rgba(0, 0, 0, .42);
  transform: translateX(-50%);
  font: 700 clamp(.75rem, 1.5vw, 1.05rem)/1.25 Mattone, Arial, sans-serif;
  text-align: center;
  pointer-events: none;
}

.dc-rendered-map-title[hidden] { display: none; }

.dc-map-heading-tools {
  display: flex;
  flex: 1 1 24rem;
  flex-wrap: wrap;
  align-items: end;
  justify-content: flex-end;
  gap: .8rem;
  min-width: 0;
}

.dc-map-share {
  position: relative;
}

.dc-map-share-trigger {
  min-height: 2rem;
  padding: .35rem .7rem;
  border: 1px solid rgba(143, 210, 237, .58);
  border-radius: .4rem;
  color: var(--dc-white);
  background: linear-gradient(145deg, #0d5a8f, #062f53);
  font: 700 .64rem NectoMono, monospace;
  cursor: pointer;
}

.dc-map-share-trigger:hover,
.dc-map-share-trigger:focus-visible {
  color: var(--dc-navy-deep);
  background: var(--dc-sky);
}

.dc-map-share-sheet {
  position: absolute;
  top: calc(100% + .45rem);
  right: 0;
  z-index: 30;
  display: grid;
  gap: .7rem;
  width: min(20rem, calc(100vw - 2rem));
  padding: .8rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .8rem;
  background:
    linear-gradient(180deg, rgba(143, 210, 237, .08), rgba(143, 210, 237, 0) 35%),
    rgba(0, 19, 44, .96);
  box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .45);
}

.dc-map-share-sheet[hidden] {
  display: none;
}

.dc-map-share-actions,
.dc-map-share-links {
  display: grid;
  gap: .45rem;
}

.dc-map-share-action,
.dc-map-share-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  padding: .48rem .65rem;
  border: 1px solid var(--dc-line);
  border-radius: .5rem;
  color: var(--dc-white);
  background: rgba(255, 255, 255, .05);
  font: 700 .64rem/1.2 NectoMono, ui-monospace, monospace;
  letter-spacing: .03em;
  text-decoration: none;
  cursor: pointer;
}

.dc-map-share-action:hover,
.dc-map-share-action:focus-visible,
.dc-map-share-link:hover,
.dc-map-share-link:focus-visible {
  border-color: var(--dc-sky);
  color: var(--dc-sky);
  background: rgba(18, 127, 193, .16);
}

.dc-map-share-links {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dc-map-share-note {
  margin: 0;
  color: var(--dc-muted);
  font: .63rem/1.4 Georgia, serif;
}

.dc-map-share {
  position: relative;
}

.dc-map-share-trigger {
  min-height: 2rem;
  padding: .35rem .7rem;
  border: 1px solid rgba(143, 210, 237, .58);
  border-radius: .4rem;
  color: var(--dc-white);
  background: linear-gradient(145deg, #0d5a8f, #062f53);
  font: 700 .64rem NectoMono, monospace;
  cursor: pointer;
}

.dc-map-share-trigger:hover,
.dc-map-share-trigger:focus-visible {
  color: var(--dc-navy-deep);
  background: var(--dc-sky);
}

.dc-map-share-sheet {
  position: absolute;
  top: calc(100% + .45rem);
  right: 0;
  z-index: 30;
  display: grid;
  gap: .7rem;
  width: min(20rem, calc(100vw - 2rem));
  padding: .8rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .8rem;
  background:
    linear-gradient(180deg, rgba(143, 210, 237, .08), rgba(143, 210, 237, 0) 35%),
    rgba(0, 19, 44, .96);
  box-shadow: 0 .75rem 2rem rgba(0, 0, 0, .45);
}

.dc-map-share-sheet[hidden] {
  display: none;
}

.dc-map-share-actions,
.dc-map-share-links {
  display: grid;
  gap: .45rem;
}

.dc-map-share-action,
.dc-map-share-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  padding: .48rem .65rem;
  border: 1px solid var(--dc-line);
  border-radius: .5rem;
  color: var(--dc-white);
  background: rgba(255, 255, 255, .05);
  font: 700 .64rem/1.2 NectoMono, ui-monospace, monospace;
  letter-spacing: .03em;
  text-decoration: none;
  cursor: pointer;
}

.dc-map-share-action:hover,
.dc-map-share-action:focus-visible,
.dc-map-share-link:hover,
.dc-map-share-link:focus-visible {
  border-color: var(--dc-sky);
  color: var(--dc-sky);
  background: rgba(18, 127, 193, .16);
}

.dc-map-share-links {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dc-map-share-note {
  margin: 0;
  color: var(--dc-muted);
  font: .63rem/1.4 Georgia, serif;
}

.dc-map-download {
  min-height: 2rem;
  padding: .35rem .65rem;
  border: 1px solid var(--dc-sky);
  border-radius: .4rem;
  color: var(--dc-white);
  background: linear-gradient(145deg, #167fc1, #064a7d);
  font: 700 .64rem NectoMono, monospace;
  cursor: pointer;
}

.dc-map-download:hover,
.dc-map-download:focus-visible {
  color: var(--dc-navy-deep);
  background: var(--dc-sky);
}

.dc-map-download:disabled { cursor: wait; opacity: .65; }

.dc-map-reset {
  min-height: 2rem;
  padding: .35rem .65rem;
  border: 1px solid rgba(255, 213, 130, .7);
  border-radius: .4rem;
  color: #fff3cc;
  background: linear-gradient(145deg, #7d4e0c, #4a281b);
  font: 700 .64rem NectoMono, monospace;
  cursor: pointer;
}

.dc-map-reset:hover,
.dc-map-reset:focus-visible {
  color: var(--dc-navy-deep);
  background: #ffd582;
}

.dc-page-state-indicator {
  margin: 0;
  padding: .3rem .55rem;
  border: 1px solid rgba(135, 206, 235, .35);
  border-radius: 999px;
  color: var(--dc-muted);
  background: rgba(0, 17, 43, .46);
  font: 700 .58rem/1.2 NectoMono, monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

.dc-page-state-indicator.is-customized {
  border-color: rgba(255, 213, 130, .75);
  color: #fff3cc;
  background: rgba(125, 78, 12, .28);
}

.dc-map-heading-tools > p {
  max-width: 36ch;
  margin: 0;
  color: var(--dc-muted);
  font-size: .68rem;
  line-height: 1.35;
  text-align: right;
}

.dc-map-heading-tools label {
  display: grid;
  flex: 0 1 9.5rem;
  gap: .25rem;
  color: var(--dc-muted);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-map-query-toggle {
  justify-items: center;
  align-content: center;
  min-height: 2rem;
  padding: .35rem .6rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .4rem;
  color: var(--dc-muted);
  background: rgba(0, 13, 30, .42);
  font: 700 .62rem/1 NectoMono, ui-monospace, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-map-query-toggle input {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--dc-amber);
}

.dc-map-query-toggle:has(input:checked) {
  border-color: rgba(255, 186, 43, .55);
  color: var(--dc-white);
  background: rgba(255, 186, 43, .12);
}

.dc-map-query-toggle:has(input:disabled) {
  opacity: .45;
  cursor: not-allowed;
}

.dc-map-heading-tools select {
  width: 100%;
  padding: .38rem 1.7rem .38rem .5rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .4rem;
  color: var(--dc-white);
  background-color: var(--dc-navy-deep);
  font: 700 .68rem NectoMono, ui-monospace, monospace;
  letter-spacing: 0;
  text-transform: none;
}

@media (max-width: 1500px) {
  .dc-map-panel > .dc-pane-heading {
    align-items: start;
  }
  .dc-map-title-editor,
  .dc-map-heading-tools {
    flex-basis: 100%;
  }
  .dc-map-heading-tools {
    justify-content: flex-start;
  }
}

.dc-layer-control legend {
  color: var(--dc-muted);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .02em;
}

.dc-layer-control {
  margin: 0;
  padding: 0;
  border: 0;
}

.dc-layer-control legend {
  width: 100%;
  margin-bottom: .32rem;
}

.dc-layer-option {
  margin-bottom: .2rem;
  border: 1px solid var(--dc-line);
  border-radius: .4rem;
  color: var(--dc-white);
  background: rgba(255, 255, 255, .045);
  transition: border-color 120ms ease, background 120ms ease;
}

.dc-layer-option[draggable="true"] { cursor: grab; }

.dc-layer-option[draggable="true"]:active { cursor: grabbing; }

.dc-layer-option.is-layer-dragging {
  opacity: .46;
  border-style: dashed;
}

.dc-layer-option.is-layer-drop-target {
  border-color: var(--dc-yellow);
  box-shadow: inset 0 0 0 1px var(--dc-yellow), 0 0 16px rgba(243, 201, 105, .22);
}

.dc-layer-option.is-layer-selected-order {
  background:
    linear-gradient(90deg, rgba(243, 201, 105, .13), rgba(135, 206, 235, .06)),
    rgba(255, 255, 255, .055);
}

.dc-layer-option.is-layer-selected-order .dc-layer-name strong::before {
  content: "↕ ";
  color: var(--dc-yellow);
}

.dc-layer-selected-section {
  margin: .45rem 0 .65rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid rgba(135, 206, 235, .2);
}

.dc-layer-selected-list {
  min-height: .35rem;
}

.dc-layer-option:hover,
.dc-layer-option:focus-within {
  border-color: var(--dc-sky);
  background: rgba(135, 206, 235, .11);
}

.dc-layer-option.is-source-hovered,
.dc-layer-option.is-source-pinned {
  position: relative;
  border-color: color-mix(in srgb, var(--dc-sky) 84%, white);
  background:
    linear-gradient(90deg, rgba(135, 206, 235, .2), rgba(135, 206, 235, .06)),
    rgba(255, 255, 255, .065);
  box-shadow: inset 3px 0 0 var(--dc-sky), 0 0 0 1px rgba(135, 206, 235, .18);
}

.dc-layer-option.is-source-pinned {
  border-color: var(--dc-white);
  background:
    linear-gradient(90deg, rgba(255, 255, 255, .2), rgba(135, 206, 235, .08)),
    rgba(255, 255, 255, .08);
  box-shadow: inset 3px 0 0 var(--dc-white), 0 0 0 1px rgba(255, 255, 255, .28), 0 0 18px rgba(135, 206, 235, .14);
}

.dc-layer-option.is-source-hovered .dc-layer-name strong::after,
.dc-layer-option.is-source-pinned .dc-layer-name strong::after {
  margin-left: .35rem;
  color: var(--dc-sky);
  font-size: .5rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dc-layer-option.is-source-hovered .dc-layer-name strong::after { content: "hovered"; }
.dc-layer-option.is-source-pinned .dc-layer-name strong::after { content: "pinned"; color: var(--dc-white); }

.dc-layer-toprow {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .22rem;
  align-items: center;
  min-height: 3.35rem;
  padding: .3rem .38rem;
}

.dc-layer-actions,
.dc-layer-controls-row,
.dc-modal-footer-actions {
  display: flex;
  gap: .25rem;
  align-items: center;
}

.dc-layer-controls-row { justify-content: flex-start; }

.dc-layer-scope {
  align-items: center;
  display: inline-flex;
  font-size: .7rem;
  gap: .3rem;
}

.dc-layer-scope select {
  background: var(--dc-navy-deep);
  border: 1px solid var(--dc-line);
  border-radius: .35rem;
  color: var(--dc-white);
  font: inherit;
  max-width: 9rem;
  padding: .25rem .35rem;
}

.dc-layer-name {
  min-width: 0;
}

.dc-layer-name strong,
.dc-layer-name small {
  display: block;
}

.dc-layer-name strong {
  overflow: hidden;
  font-size: .66rem;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dc-layer-name small {
  overflow: hidden;
  margin-top: .05rem;
  color: var(--dc-muted);
  font-size: .49rem;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dc-layer-locate,
.dc-layer-gear {
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  border-radius: .3rem;
  font-size: .7rem;
}

.dc-layer-locate { font-size: .8rem; }

.dc-layer-zoom {
  display: inline-flex;
  align-items: center;
  min-height: 1.45rem;
  padding: 0 .38rem;
  border: 1px solid rgba(135, 206, 235, .28);
  border-radius: .3rem;
  color: var(--dc-sky);
  background: color-mix(in srgb, var(--dc-navy-deep) 76%, transparent);
  font: 700 .55rem NectoMono, ui-monospace, monospace;
  white-space: nowrap;
}

.dc-layer-visibility {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: .5rem;
  align-items: center;
  padding: .38rem .42rem;
  cursor: pointer;
}

.dc-layer-visibility strong,
.dc-layer-visibility small {
  display: block;
}

.dc-layer-visibility strong {
  font-size: .65rem;
  line-height: 1.2;
}

.dc-layer-visibility small {
  margin-top: .05rem;
  color: var(--dc-muted);
  font-size: .49rem;
  line-height: 1.25;
}

.dc-layer-toggle {
  display: flex;
  align-items: center;
  gap: .18rem;
  min-height: 1.45rem;
  padding: .2rem .28rem;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .3rem;
  color: var(--dc-muted);
  background: rgba(0, 18, 43, .34);
  font-size: .48rem;
  line-height: 1;
  cursor: pointer;
}

.dc-layer-toggle:hover,
.dc-layer-toggle:focus-within {
  border-color: var(--dc-sky);
  color: var(--dc-white);
}

.dc-layer-toggle input[type="checkbox"] {
  width: .72rem;
  height: .72rem;
}

.dc-layer-control input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--dc-cyan);
}

.dc-layer-symbol {
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  width: .82rem;
  height: .82rem;
  border: 1px solid rgba(255, 255, 255, .75);
  background:
    radial-gradient(circle at 28% 24%, rgba(255,255,255,.34), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0) 45%),
    linear-gradient(155deg, #28486d, #0d233f 62%, #061221);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, .14), inset 0 -2px 4px rgba(0, 0, 0, .4);
}

.dc-layer-color {
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: .3rem;
  background: rgba(0, 18, 43, .5);
  cursor: pointer;
}

.dc-layer-color:hover,
.dc-layer-color:focus-visible {
  border-color: var(--dc-white);
  box-shadow: 0 0 0 2px rgba(114, 183, 210, .32);
}

.dc-layer-color .dc-layer-symbol {
  width: .78rem;
  height: .78rem;
  pointer-events: none;
}

.dc-layer-color.has-custom-color .dc-layer-symbol,
.dc-layer-color.has-custom-color .dc-layer-symbol::before {
  border-color: color-mix(in srgb, var(--layer-custom-color), white 55%);
  background: var(--layer-custom-color);
}

.dc-layer-symbol--center {
  border-radius: 2px;
  --dc-layer-icon-fill: linear-gradient(145deg, #ffdb97 0%, #ffb454 28%, #c76522 68%, #743010 100%);
}

.dc-layer-symbol--plant {
  border-radius: 50%;
  --dc-layer-icon-fill: linear-gradient(150deg, #9cf8ff 0%, #70ebef 20%, #167fc1 58%, #064a7d 100%);
}

.dc-layer-symbol--environment {
  border-radius: 2px;
  background: linear-gradient(135deg, #01856f 0 25%, #81ccbf 25% 50%, #dec17e 50% 75%, #a6601b 75%);
}

.dc-layer-symbol--parcel {
  border-color: #79cff1;
  background: transparent;
}

.dc-layer-symbol--street {
  border-color: #a8d7ef;
  background:
    linear-gradient(28deg, transparent 42%, #f2c14e 43% 51%, transparent 52%),
    linear-gradient(145deg, #2e6680 0 44%, #87b18a 45% 100%);
}

.dc-layer-symbol--md-imagery {
  border-color: #b9efb0;
  background:
    linear-gradient(35deg, rgba(43, 72, 34, .7), transparent 52%),
    radial-gradient(circle at 65% 32%, #b8c58a 0 18%, #547b4a 19% 48%, #274f44 49% 100%);
}

.dc-layer-symbol--satellite {
  border-color: #d2d7ff;
  background: radial-gradient(circle at 30% 28%, #84a679, #3e6248 35%, #152a3c 68%, #07111f);
}

.dc-layer-symbol--usgs {
  border-color: #8ce6e0;
  background:
    linear-gradient(155deg, transparent 0 48%, rgba(119, 196, 205, .75) 49% 58%, transparent 59%),
    linear-gradient(35deg, #345f42, #7c895a 48%, #264f5e 49%);
}

.dc-layer-option--remote .dc-layer-symbol {
  border-radius: 3px;
  background: var(--layer-color);
}

.dc-layer-symbol--center::before,
.dc-layer-symbol--plant::before {
  content: "";
  position: absolute;
  inset: .12rem;
  background: var(--dc-layer-icon-fill);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .26), 0 1px 1px rgba(0, 0, 0, .28);
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.dc-layer-symbol--center::before {
  -webkit-mask-image: var(--dc-icon-datacenter);
  mask-image: var(--dc-icon-datacenter);
}

.dc-layer-symbol--plant::before {
  inset: .08rem;
  -webkit-mask-image: var(--dc-icon-bolt);
  mask-image: var(--dc-icon-bolt);
}

.dc-layer-section-title {
  margin: 1rem 0 .25rem;
  padding-top: .8rem;
  border-top: 1px solid var(--dc-line);
  color: var(--dc-white);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-layer-section-title--first {
  margin-top: .25rem;
  padding-top: 0;
  border-top: 0;
}

.dc-layer-service-note {
  margin: 0 0 .65rem;
  color: var(--dc-muted);
  font: .6rem/1.4 Georgia, serif;
}

.dc-layer-status {
  overflow: hidden;
  margin: -.18rem .42rem 0;
  padding: 0 0 .26rem;
  color: var(--dc-sky);
  font-size: .47rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dc-layer-count {
  min-width: 1.55rem;
  padding: .14rem .28rem;
  border-radius: 999px;
  color: var(--dc-sky);
  background: rgba(135, 206, 235, .12);
  font-size: .53rem;
  font-weight: 700;
  text-align: center;
}

.dc-energy-key {
  color: var(--dc-muted);
  font-size: .62rem;
}

.dc-energy-key > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .35rem .5rem;
  padding: .65rem;
  border: 1px solid var(--dc-line);
  border-radius: .45rem;
}

.dc-energy-key span {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.dc-energy-key p {
  margin: .65rem 0 .1rem;
  font-family: Georgia, serif;
  line-height: 1.35;
}

.dc-energy-swatch {
  flex: 0 0 auto;
  width: .78rem;
  height: .78rem;
  border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 50%;
  box-shadow: inset 0 0 3px rgba(0, 0, 0, .45);
}

.dc-energy-swatch--solar { background: linear-gradient(145deg, #69c7ff, #167fc1 52%, #064a7d); }
.dc-energy-swatch--coal { background: linear-gradient(145deg, #59616a, #20262c 52%, #050708); }
.dc-energy-swatch--gas { background: linear-gradient(145deg, #c58a62, #865033 52%, #4a281b); }
.dc-energy-swatch--oil { background: linear-gradient(145deg, #ffb454, #c76522 52%, #743010); }
.dc-energy-swatch--wind { background: linear-gradient(145deg, #ffffff 0%, #7f8b94 28%, #eef5f8 50%, #53606a 72%, #dce6ec 100%); }
.dc-energy-swatch--hydro { background: linear-gradient(145deg, #70ebef, #16a5b5 52%, #075f74); }
.dc-energy-swatch--nuclear { background: linear-gradient(145deg, #9affbd, #25c965 52%, #08732e); }
.dc-energy-swatch--storage { background: linear-gradient(145deg, #d7b4ff, #8d65ca 52%, #4c317e); }
.dc-energy-swatch--waste { background: linear-gradient(145deg, #d0c779, #8b8436 52%, #514c1e); }
.dc-energy-swatch--unknown { background: linear-gradient(145deg, #aab9c5, #657887 52%, #344550); }

.dc-enviroscreen-legend,
.dc-parcel-legend {
  margin: -.35rem 0 1rem;
  padding: .65rem;
  border: 1px solid var(--dc-line);
  border-radius: .55rem;
  color: var(--dc-muted);
  background: rgba(0, 29, 67, .6);
  font-size: .62rem;
  line-height: 1.35;
}

.dc-enviroscreen-legend[hidden],
.dc-parcel-legend[hidden] { display: none; }

.dc-enviroscreen-legend > strong,
.dc-parcel-legend > strong {
  display: block;
  margin-bottom: .45rem;
  color: var(--dc-white);
  font-size: .68rem;
}

.dc-enviroscreen-legend > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .3rem .5rem;
}

.dc-enviroscreen-legend span {
  display: flex;
  align-items: center;
  gap: .35rem;
}

.dc-ej-swatch {
  display: inline-block;
  width: .85rem;
  height: .65rem;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: .15rem;
}

.dc-ej-swatch--1 { background: #01856f; }
.dc-ej-swatch--2 { background: #81ccbf; }
.dc-ej-swatch--3 { background: #dec17e; }
.dc-ej-swatch--4 { background: #a6601b; }

.dc-enviroscreen-legend p { margin: .5rem 0 .25rem; }
.dc-parcel-legend p { margin: .4rem 0; }
.dc-enviroscreen-legend a,
.dc-parcel-legend a { color: var(--dc-sky); }
.dc-enviroscreen-legend.is-error { border-color: var(--dc-amber); }
.dc-parcel-legend.is-error { border-color: var(--dc-amber); }

.dc-map-panel {
  display: grid;
  grid-template-rows: auto 1fr;
}

#datacenter-map {
  min-height: 0;
  background: var(--dc-navy-deep);
}

#datacenter-map.dc-map--no-base {
  background:
    radial-gradient(circle at 72% 18%, rgba(114, 207, 241, .18), transparent 34%),
    linear-gradient(145deg, #003a78 0%, #002a61 52%, #001d43 100%);
}

#datacenter-map.dc-map--no-base .maplibregl-canvas { background: transparent; }

.datacenter-page .maplibregl-ctrl-group {
  overflow: hidden;
  border: 1px solid var(--dc-line);
  border-radius: .55rem;
  background: var(--dc-navy-deep);
  box-shadow: 0 .25rem .8rem rgba(0, 0, 0, .32);
}

.datacenter-page .maplibregl-ctrl-group button {
  border-color: var(--dc-line);
  background: var(--dc-navy-deep);
}

.datacenter-page .maplibregl-ctrl-group button:hover,
.datacenter-page .maplibregl-ctrl-group button:focus {
  background: var(--dc-sky);
}

.datacenter-page .maplibregl-ctrl-icon {
  filter: invert(1) brightness(1.8);
}

.datacenter-page .maplibregl-ctrl-group button:hover .maplibregl-ctrl-icon,
.datacenter-page .maplibregl-ctrl-group button:focus .maplibregl-ctrl-icon {
  filter: none;
}

.datacenter-page .maplibregl-ctrl-attrib {
  color: var(--dc-muted);
  background: rgba(0, 29, 67, .88);
}

.datacenter-page .maplibregl-ctrl-attrib a { color: var(--dc-sky); }

.datacenter-page .maplibregl-popup-content {
  padding: .55rem .7rem;
  border: 1px solid var(--dc-sky);
  border-radius: .35rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  box-shadow: 0 .3rem 1rem rgba(0, 0, 0, .35);
  font-family: NectoMono, monospace;
  font-size: .75rem;
}

.datacenter-page .maplibregl-popup-tip { border-top-color: var(--dc-navy-deep); }

.dc-detail h2 {
  margin: 0;
  color: var(--dc-sky);
  font-size: 1.25rem;
  line-height: 1.15;
}

.dc-hovered-icon-heading {
  display: grid;
  grid-template-columns: 3.15rem minmax(0, 1fr);
  gap: .72rem;
  align-items: start;
}

.dc-hovered-icon {
  display: block;
  width: 3rem;
  height: 3.35rem;
  background: var(--dc-hovered-fill);
  filter: drop-shadow(1px 0 0 var(--dc-hovered-outline)) drop-shadow(-1px 0 0 var(--dc-hovered-outline)) drop-shadow(0 1px 0 var(--dc-hovered-outline)) drop-shadow(0 -1px 0 var(--dc-hovered-outline));
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.dc-hovered-icon--power {
  -webkit-mask-image: var(--dc-icon-bolt);
  mask-image: var(--dc-icon-bolt);
}

.dc-hovered-icon--datacenter {
  -webkit-mask-image: var(--dc-icon-datacenter);
  mask-image: var(--dc-icon-datacenter);
}

.dc-hover-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .28rem;
  margin-top: .45rem;
}

.dc-hover-tag {
  display: inline-flex;
  align-items: center;
  min-height: 1.35rem;
  padding: .16rem .46rem;
  border: 1px solid var(--dc-tag-color);
  border-radius: 999px;
  background: color-mix(in srgb, var(--dc-tag-color) 24%, var(--dc-navy-deep));
  color: var(--dc-white);
  font-size: .58rem;
  font-weight: 750;
  line-height: 1.1;
  cursor: pointer;
}

.dc-hover-tag:hover,
.dc-hover-tag:focus-visible,
.dc-hover-tag[aria-pressed="true"] {
  outline: 2px solid var(--dc-white);
  outline-offset: 1px;
  filter: brightness(1.22);
}

.dc-feature-color-key {
  display: flex;
  gap: .55rem;
  align-items: center;
  margin: 0 0 1rem;
  padding: .55rem .65rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .55rem;
  background: color-mix(in srgb, var(--dc-navy-deep) 82%, transparent);
}

.dc-feature-color-key strong,
.dc-feature-color-key small {
  display: block;
}

.dc-feature-color-key strong {
  color: var(--dc-white);
  font: 700 .68rem/1.2 NectoMono, monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dc-feature-color-key small {
  margin-top: .18rem;
  color: var(--dc-muted);
  font: .62rem/1.3 NectoMono, monospace;
}

.dc-color-key-swatch {
  flex: 0 0 auto;
  width: 1.8rem;
  height: .35rem;
  border-radius: 999px;
  background: var(--dc-key-color);
  box-shadow: 0 0 .35rem color-mix(in srgb, var(--dc-key-color) 72%, transparent);
}

.dc-detail .dc-type {
  margin: .35rem 0 1rem;
  color: var(--dc-muted);
  font-size: .72rem;
  font-weight: 700;
}

.dc-energy-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
  margin: 0 0 .8rem;
}

.dc-energy-summary > div {
  min-width: 0;
  padding: .6rem .65rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .55rem;
  background: color-mix(in srgb, var(--dc-panel) 82%, var(--dc-sky) 18%);
}

.dc-energy-summary span,
.dc-energy-summary small {
  display: block;
  color: var(--dc-muted);
  font: .58rem/1.3 NectoMono, monospace;
}

.dc-energy-summary span {
  letter-spacing: .045em;
  text-transform: uppercase;
}

.dc-energy-summary strong {
  display: block;
  margin: .22rem 0;
  color: var(--dc-white);
  font-size: .82rem;
  line-height: 1.2;
}

.dc-energy-summary .dc-unknown { color: #ffd582; }

.dc-contestation {
  --dc-contestation-accent: #19c37d;
  margin: 0 0 .8rem;
  padding: .65rem;
  border: 1px solid color-mix(in srgb, var(--dc-contestation-accent) 70%, var(--dc-line));
  border-left: .28rem solid var(--dc-contestation-accent);
  border-radius: .55rem;
  background: color-mix(in srgb, var(--dc-panel) 88%, var(--dc-contestation-accent) 12%);
}

.dc-contestation--1 { --dc-contestation-accent: #89a9bc; }
.dc-contestation--2 { --dc-contestation-accent: #e0b052; }
.dc-contestation--3 { --dc-contestation-accent: #e77b45; }
.dc-contestation--4 { --dc-contestation-accent: #d94b50; }

.dc-contestation-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .6rem;
  color: var(--dc-white);
}

.dc-contestation-heading span,
.dc-salient-news > span {
  color: var(--dc-muted);
  font: 700 .58rem/1.3 NectoMono, monospace;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.dc-contestation-heading strong {
  color: color-mix(in srgb, var(--dc-contestation-accent) 82%, white);
  font-size: .75rem;
  text-transform: uppercase;
}

.dc-contestation p {
  margin: .42rem 0 0;
  color: var(--dc-white);
  font-size: .72rem;
  line-height: 1.4;
}

.dc-contestation > small {
  display: block;
  margin-top: .42rem;
  color: var(--dc-muted);
  font-size: .62rem;
}

.dc-salient-news {
  display: grid;
  gap: .32rem;
  margin-top: .55rem;
}

.dc-salient-news-link {
  display: block;
  padding: .48rem .55rem;
  border: 1px solid color-mix(in srgb, var(--dc-contestation-accent) 58%, var(--dc-line));
  border-radius: .42rem;
  color: var(--dc-white);
  background: rgba(0, 0, 0, .16);
  text-decoration: none;
}

.dc-salient-news-link:hover,
.dc-salient-news-link:focus-visible {
  border-color: var(--dc-contestation-accent);
  background: color-mix(in srgb, var(--dc-panel) 70%, var(--dc-contestation-accent) 30%);
}

.dc-salient-news-link strong,
.dc-salient-news-link span {
  display: block;
}

.dc-salient-news-link strong {
  font-size: .72rem;
  line-height: 1.28;
}

.dc-salient-news-link span {
  margin-top: .18rem;
  color: var(--dc-muted);
  font: .57rem/1.3 NectoMono, monospace;
}

.dc-funding {
  margin: .85rem 0;
  padding: .85rem;
  border: 1px solid color-mix(in srgb, var(--dc-sky) 38%, var(--dc-line));
  border-radius: .72rem;
  background:
    radial-gradient(circle at 18% 12%, rgba(139, 215, 255, .16), transparent 38%),
    rgba(3, 23, 48, .72);
}

.dc-funding-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .65rem;
}

.dc-funding h3 {
  margin: 0;
  color: var(--dc-white);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-funding-head strong {
  color: var(--dc-sky);
  font-size: .82rem;
  text-align: right;
}

.dc-funding p {
  margin: .55rem 0 .7rem;
  color: var(--dc-muted);
  font: .66rem/1.45 Georgia, serif;
}

.dc-funding-body {
  display: grid;
  grid-template-columns: minmax(5.4rem, .58fr) 1fr;
  gap: .8rem;
  align-items: center;
}

.dc-funding-pie {
  width: 100%;
  max-width: 8rem;
  filter: drop-shadow(0 .35rem .8rem rgba(0, 0, 0, .35));
}

.dc-funding ul {
  display: grid;
  gap: .48rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.dc-funding li {
  display: grid;
  grid-template-columns: .72rem 1fr;
  gap: .46rem;
  align-items: start;
}

.dc-funding-swatch {
  width: .72rem;
  height: .72rem;
  margin-top: .08rem;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: var(--dc-funding-color, var(--dc-sky));
}

.dc-funding li strong {
  display: block;
  color: var(--dc-white);
  font-size: .67rem;
}

.dc-funding li small,
.dc-funding li em {
  display: block;
  color: var(--dc-muted);
  font-size: .58rem;
  line-height: 1.35;
}

.dc-funding li em {
  margin-top: .18rem;
  font-style: normal;
}

.dc-funding .dc-record-sources {
  margin-top: .7rem;
}

.dc-operational-finance {
  margin: .85rem 0;
  padding: .85rem;
  border: 1px solid color-mix(in srgb, #f6c85f 36%, var(--dc-line));
  border-radius: .72rem;
  background:
    radial-gradient(circle at 82% 12%, rgba(246, 200, 95, .15), transparent 38%),
    rgba(3, 23, 48, .72);
}

.dc-operational-finance h3 {
  margin: 0 0 .5rem;
  color: var(--dc-white);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.dc-operational-finance > p {
  margin: 0 0 .7rem;
  color: var(--dc-muted);
  font: .66rem/1.45 Georgia, serif;
}

.dc-operational-finance-list {
  display: grid;
  gap: .45rem;
  margin: .75rem 0 0;
  padding: 0;
  list-style: none;
}

.dc-operational-finance-list li {
  padding: .5rem .55rem;
  border: 1px solid var(--dc-line);
  border-radius: .5rem;
  background: rgba(0, 0, 0, .16);
}

.dc-operational-finance-list strong,
.dc-operational-finance-list span,
.dc-operational-finance-list em {
  display: block;
}

.dc-operational-finance-list strong {
  color: var(--dc-white);
  font-size: .66rem;
}

.dc-operational-finance-list span {
  margin-top: .16rem;
  color: #f6c85f;
  font-size: .62rem;
}

.dc-operational-finance-list em {
  margin-top: .22rem;
  color: var(--dc-muted);
  font-size: .58rem;
  font-style: normal;
  line-height: 1.35;
}

.dc-operational-finance .dc-record-sources {
  margin-top: .7rem;
}

.dc-plant-image {
  overflow: hidden;
  margin: 0 0 1rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .65rem;
  background: var(--dc-navy-deep);
}

.dc-entity-image {
  overflow: hidden;
  margin: 0 0 1rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .65rem;
  background: var(--dc-navy-deep);
}

.dc-entity-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--dc-navy-deep);
}

.dc-entity-image figcaption {
  display: grid;
  gap: .2rem;
  padding: .55rem .65rem;
  color: var(--dc-muted);
  font: .62rem/1.35 NectoMono, monospace;
}

.dc-entity-image figcaption strong { color: var(--dc-white); }
.dc-entity-image figcaption a { color: var(--dc-sky); }

.dc-plant-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--dc-navy-deep);
}

.dc-aerial-viewport {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: var(--dc-navy-deep);
}

.dc-aerial-motion {
  position: absolute;
  inset: 0;
  transform: scale(1);
  transform-origin: 42% 48%;
  will-change: transform;
}

.dc-aerial-viewport img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

.dc-site-animation .dc-aerial-motion.is-aerial-ready {
  animation: dc-aerial-push-in var(--dc-aerial-duration, 18s) ease-in-out infinite alternate;
}

@keyframes dc-aerial-push-in {
  from { transform: scale(1) translate3d(0, 0, 0); }
  to { transform: scale(var(--dc-aerial-zoom, 2)) translate3d(var(--dc-aerial-pan-x, -16%), var(--dc-aerial-pan-y, 10%), 0); }
}

.dc-aerial-settings {
  position: absolute;
  z-index: 4;
  top: .42rem;
  right: .42rem;
}

.dc-parcel-outline {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.dc-parcel-outline path {
  fill: rgba(255, 213, 130, .08);
  stroke: #ffd582;
  stroke-width: 4;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 3px rgba(4, 22, 41, .95));
}

.dc-parcel-outline-status {
  position: absolute;
  z-index: 3;
  right: .45rem;
  bottom: .45rem;
  left: .45rem;
  overflow: hidden;
  padding: .3rem .42rem;
  border: 1px solid rgba(255, 213, 130, .62);
  border-radius: .35rem;
  background: rgba(4, 22, 41, .84);
  color: #ffe2a8;
  font-size: .56rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
  pointer-events: none;
}

.dc-aerial-settings summary {
  display: grid;
  width: 1.85rem;
  height: 1.85rem;
  place-items: center;
  border: 1px solid rgba(143, 210, 237, .75);
  border-radius: .42rem;
  background: rgba(4, 22, 41, .9);
  color: var(--dc-white);
  cursor: pointer;
  list-style: none;
  box-shadow: 0 .2rem .6rem rgba(0, 0, 0, .38);
}

.dc-aerial-settings summary::-webkit-details-marker { display: none; }
.dc-aerial-settings[open] summary { border-color: var(--dc-sky); }

.dc-aerial-settings-menu {
  position: absolute;
  top: calc(100% + .3rem);
  right: 0;
  width: 11.5rem;
  padding: .62rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .5rem;
  background: rgba(4, 22, 41, .97);
  box-shadow: 0 .5rem 1.2rem rgba(0, 0, 0, .5);
}

.dc-aerial-settings-menu label {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .3rem;
  color: var(--dc-white);
  font-size: .62rem;
  font-weight: 700;
}

.dc-aerial-settings-menu label + label { margin-top: .55rem; }
.dc-aerial-settings-menu output { color: var(--dc-sky); }
.dc-aerial-settings-menu input { grid-column: 1 / -1; width: 100%; accent-color: var(--dc-sky); }

.dc-plant-image figcaption {
  display: grid;
  gap: .18rem;
  padding: .55rem .65rem .62rem;
  border-top: 1px solid var(--dc-line);
  color: var(--dc-muted);
  font-size: .62rem;
  line-height: 1.35;
}

.dc-plant-image figcaption strong {
  color: var(--dc-white);
  font-size: .66rem;
}

.dc-plant-image figcaption a { color: var(--dc-sky); }
.dc-plant-image--verified { border-color: var(--dc-sky); }
.dc-plant-image--aerial { border-color: #2387b8; }
.dc-plant-image--illustration { border-color: var(--dc-amber); }

.dc-site-gallery { margin: 0 0 1rem; }

.dc-detail > #record-detail > p:not(.dc-type) {
  margin: .75rem 0;
  color: var(--dc-muted);
  font-family: Georgia, serif;
  line-height: 1.45;
}

.dc-fact-group {
  margin-top: 1rem;
  padding-top: .85rem;
  border-top: 1px solid var(--dc-line);
}

.dc-fact-group h3 {
  margin: 0 0 .65rem;
  color: var(--dc-white);
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.dc-facts {
  display: grid;
  grid-template-columns: minmax(6.5rem, .7fr) minmax(0, 1.3fr);
  gap: .5rem .7rem;
  margin: 0;
  font-size: .72rem;
  line-height: 1.35;
}

.dc-facts dt {
  color: var(--dc-muted);
  font-weight: 700;
}

.dc-facts dd {
  margin: 0;
  color: var(--dc-white);
  overflow-wrap: anywhere;
}

.dc-unknown {
  color: #ffd582;
  font-style: italic;
}

.dc-sentiment {
  display: inline-block;
  padding: .18rem .42rem;
  border-radius: 999px;
  font-weight: 800;
}

.dc-sentiment--negative { color: #ffe7e7; background: #8c3038; }
.dc-sentiment--mixed { color: #fff4cf; background: #725a10; }
.dc-sentiment--positive { color: #e1ffec; background: #176344; }
.dc-sentiment--unknown { color: #e8f1f7; background: #4c6175; }

.dc-record-note {
  margin: 1rem 0 0;
  padding: .7rem;
  border-left: .25rem solid var(--dc-sky);
  color: var(--dc-muted);
  background: rgba(255, 255, 255, .045);
  font-family: Georgia, serif;
  font-size: .8rem;
  line-height: 1.45;
}

.dc-record-sources {
  margin-top: 1rem;
  padding-top: .8rem;
  border-top: 1px solid var(--dc-line);
  font-size: .72rem;
}

.dc-record-sources strong { color: var(--dc-white); }

.dc-record-sources ul {
  margin: .45rem 0 0 1.1rem;
  padding: 0;
}

.dc-record-sources li { margin-bottom: .35rem; }
.dc-record-sources a { color: var(--dc-sky); }

.dc-news-list {
  display: grid;
  gap: .7rem;
}

.dc-news-card {
  padding: .78rem;
  border: 1px solid var(--dc-line);
  border-radius: .85rem;
  background: color-mix(in srgb, var(--dc-panel) 88%, var(--dc-sky) 12%);
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.dc-news-card:hover,
.dc-news-card:focus-within {
  border-color: color-mix(in srgb, var(--dc-sky) 70%, white);
  background: color-mix(in srgb, var(--dc-panel) 76%, var(--dc-sky) 24%);
  transform: translateY(-1px);
}

.dc-news-card a {
  display: grid;
  gap: .26rem;
  color: var(--dc-white);
  text-decoration: none;
}

.dc-news-card a:hover strong,
.dc-news-card a:focus-visible strong {
  color: var(--dc-sky);
}

.dc-news-card span {
  color: var(--dc-muted);
  font: .62rem/1.35 NectoMono, monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dc-news-card strong {
  line-height: 1.22;
}

.dc-news-card p {
  margin: .5rem 0 0;
  color: var(--dc-muted);
  font: .78rem/1.42 Georgia, serif;
}

.dc-news-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .28rem;
  margin-top: .58rem;
}

.dc-news-tags span {
  padding: .18rem .42rem;
  border: 1px solid color-mix(in srgb, var(--dc-sky) 45%, var(--dc-line));
  border-radius: 999px;
  color: var(--dc-sky);
  background: rgba(255, 255, 255, .04);
}

.dc-reference {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin-top: .75rem;
}

.dc-disclosure {
  align-self: start;
  border: 1px solid var(--dc-line);
  border-radius: .9rem;
  background: var(--dc-card);
}

.dc-disclosure summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  cursor: pointer;
  list-style: none;
}

.dc-disclosure summary::-webkit-details-marker { display: none; }

.dc-disclosure summary:focus-visible {
  border-radius: .9rem;
  outline: 2px solid var(--dc-sky);
  outline-offset: 2px;
}

.dc-disclosure summary strong {
  display: block;
  margin-top: .25rem;
  color: var(--dc-white);
  font-size: 1rem;
}

.dc-disclosure-action {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  flex: 0 0 auto;
  border: 1px solid var(--dc-line);
  border-radius: 50%;
  color: var(--dc-sky);
  font-size: 1.35rem;
  transition: transform .18s ease;
}

.dc-disclosure[open] .dc-disclosure-action { transform: rotate(45deg); }

.dc-disclosure-body {
  padding: 0 1rem 1rem;
  border-top: 1px solid var(--dc-line);
}

.dc-disclosure-body > p {
  max-width: 100ch;
  margin: .75rem 0;
  color: var(--dc-muted);
  font-family: Georgia, serif;
  line-height: 1.55;
}

.dc-warning {
  padding: .85rem 1rem;
  border-left: .4rem solid var(--dc-amber);
  border-radius: .25rem .7rem .7rem .25rem;
  color: #fff4cf !important;
  background: rgba(243, 167, 18, .14);
  font-family: NectoMono, ui-monospace, monospace !important;
  font-size: .82rem;
  font-weight: 700;
}

.dc-source-intro { margin-bottom: 1rem !important; }

#source-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}

.dc-source-card {
  min-width: 0;
  padding: .8rem;
  border: 1px solid var(--dc-line);
  border-radius: .7rem;
  background: rgba(255, 255, 255, .04);
}

.dc-source-card h3 {
  margin: 0 0 .35rem;
  color: var(--dc-sky);
  font-size: .76rem;
  line-height: 1.25;
}

.dc-source-card p {
  margin: .25rem 0;
  color: var(--dc-muted);
  font-family: Georgia, serif;
  font-size: .76rem;
  line-height: 1.4;
}

.dc-source-card a {
  color: var(--dc-white);
  font-size: .7rem;
  font-weight: 700;
}

.dc-map-marker {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--marker-size, 22px);
  height: var(--marker-size, 22px);
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: none;
}

.maplibregl-marker.dc-map-marker--center {
  z-index: 2;
  isolation: isolate;
  overflow: visible;
}

.dc-map-marker--center::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  width: calc(var(--marker-size, 22px) * var(--marker-glow-scale, 1));
  height: calc(var(--marker-size, 22px) * var(--marker-glow-scale, 1));
  border-radius: 50%;
  background: radial-gradient(circle,
    var(--marker-glow-color, transparent) 0 16%,
    color-mix(in srgb, var(--marker-glow-color, transparent) 82%, transparent) 32%,
    color-mix(in srgb, var(--marker-glow-edge-color, var(--marker-glow-color, transparent)) 52%, transparent) 52%,
    color-mix(in srgb, var(--marker-glow-edge-color, var(--marker-glow-color, transparent)) 18%, transparent) 70%,
    transparent 82%);
  opacity: var(--marker-glow-opacity, 0);
  filter: blur(calc(var(--marker-size, 22px) * .025 * var(--marker-glow-blur, 1)));
  box-shadow:
    0 0 0 calc(var(--marker-size, 22px) * var(--marker-glow-ring-width, .045)) color-mix(in srgb, var(--marker-glow-edge-color, var(--marker-glow-color, transparent)) var(--marker-glow-edge-opacity, 0%), transparent),
    0 0 calc(var(--marker-size, 22px) * var(--marker-glow-edge-spread, .24)) color-mix(in srgb, var(--marker-glow-edge-color, var(--marker-glow-color, transparent)) var(--marker-glow-edge-soft-opacity, 0%), transparent);
  transform: translate3d(-50%, -50%, 0);
  pointer-events: none;
}

.maplibregl-marker.dc-map-marker--plant {
  z-index: 40;
  width: 44px;
  height: 44px;
  overflow: visible;
}

.dc-map-marker[hidden] { display: none; }

.dc-map-marker:focus-visible {
  border-radius: 50%;
  outline: 3px solid var(--dc-white);
  outline-offset: 3px;
}

.dc-map-marker.is-map-hovered .dc-map-icon,
.dc-map-marker:focus-visible .dc-map-icon {
  box-shadow: 0 0 0 3px var(--dc-white), 0 2px 10px rgba(0, 0, 0, .75);
  transform: scale(1.18);
}

.dc-map-icon {
  display: grid;
  place-items: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: var(--marker-size, 22px);
  height: var(--marker-size, 22px);
  border: 2px solid var(--marker-outline-color, var(--dc-white));
  border-radius: 50%;
  background:
    radial-gradient(circle at 28% 24%, rgba(255,255,255,.32), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 44%),
    linear-gradient(160deg, #294c75, #0f2848 58%, #061423 100%);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .7), inset 0 1px 2px rgba(255, 255, 255, .16), inset 0 -3px 5px rgba(0, 0, 0, .35);
  filter: brightness(var(--marker-brightness, 1));
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease, filter 120ms ease;
}

.dc-map-icon--center {
  border-radius: 4px;
}

.dc-map-icon::before {
  content: "";
  position: absolute;
  inset: 3px;
  background: var(--marker-icon-fill, var(--marker-source-gradient, linear-gradient(145deg, #aab9c5, #657887 52%, #344550)));
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .24), 0 1px 2px rgba(0, 0, 0, .3);
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.dc-map-icon--center::before {
  -webkit-mask-image: var(--dc-icon-datacenter);
  mask-image: var(--dc-icon-datacenter);
}

.dc-map-icon--plant::before {
  inset: 2px;
  -webkit-mask-image: var(--dc-icon-bolt);
  mask-image: var(--dc-icon-bolt);
}

.dc-map-icon--mesh::before,
.dc-map-icon--mesh::after {
  content: none;
  display: none !important;
  background: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.dc-map-icon--plant.dc-map-icon--mesh {
  width: 44px;
  height: 44px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: radial-gradient(circle at 50% 50%, rgba(255, 221, 105, .16), rgba(255, 221, 105, .06) 30%, rgba(255, 221, 105, 0) 62%);
  box-shadow: none;
  pointer-events: none;
}

.dc-map-model {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  filter:
    drop-shadow(0 0 8px rgba(255, 214, 72, .55))
    drop-shadow(0 0 16px rgba(255, 214, 72, .2))
    drop-shadow(0 2px 6px rgba(0, 0, 0, .4));
}

.dc-map-icon::after {
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 48%);
  pointer-events: none;
}

.dc-map-icon--mesh::after {
  content: none;
}

.dc-map-marker:hover .dc-map-icon--mesh,
.dc-map-marker:focus-visible .dc-map-icon--mesh {
  box-shadow: none;
  transform: scale(1.08);
}

.dc-modal {
  width: min(31rem, calc(100vw - 2rem));
  padding: 0;
  border: 1px solid rgba(135, 206, 235, .55);
  border-radius: .85rem;
  color: var(--dc-white);
  background: var(--dc-navy-mid);
  box-shadow: 0 1.5rem 5rem rgba(0, 0, 0, .7);
}

.dc-modal::backdrop { background: rgba(0, 12, 29, .78); backdrop-filter: blur(3px); }
.dc-modal-card { margin: 0; }

.dc-modal-header,
.dc-modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
}

.dc-modal-header { border-bottom: 1px solid var(--dc-line); }
.dc-modal-header h3 { margin: .15rem 0 0; font: 700 1rem Mattone, Arial, sans-serif; }
.dc-modal-close { width: 2rem; height: 2rem; border-radius: 50%; font-size: 1.15rem !important; }
.dc-modal-body { display: grid; gap: .75rem; padding: 1rem; }

.dc-modal-fieldset {
  display: grid;
  gap: .6rem;
  margin: 0;
  padding: .75rem;
  border: 1px solid var(--dc-line);
  border-radius: .65rem;
  background: color-mix(in srgb, var(--dc-navy-raised) 45%, transparent);
}

.dc-modal-fieldset legend {
  padding: 0 .35rem;
  color: var(--dc-white);
  font: 700 .72rem Mattone, Arial, sans-serif;
}

.dc-modal-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}

.dc-modal-field {
  display: grid;
  gap: .3rem;
  color: var(--dc-muted);
  font-size: .65rem;
  font-weight: 700;
}

.dc-modal-field input,
.dc-modal-field select {
  width: 100%;
  min-height: 2.45rem;
  padding: .55rem .65rem;
  border: 1px solid rgba(135, 206, 235, .45);
  border-radius: .45rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  color-scheme: dark;
  font: 700 .7rem NectoMono, ui-monospace, monospace;
}

.dc-modal-scale > span { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.dc-modal-scale output { color: var(--dc-sky); font: 700 .72rem NectoMono, ui-monospace, monospace; }
.dc-modal-scale input[type="range"] {
  min-height: 1.75rem;
  padding: 0;
  border: 0;
  background: transparent;
  accent-color: var(--dc-sky);
  cursor: ew-resize;
}

.dc-modal-help,
.dc-modal-note { margin: -.45rem 0 0; color: var(--dc-muted); font: .68rem/1.4 Georgia, serif; }
.dc-modal-footer { border-top: 1px solid var(--dc-line); }
.dc-modal-footer button { min-height: 2.2rem; padding: .5rem .7rem; border-radius: .45rem; }
.dc-modal-primary { border-color: var(--dc-sky) !important; background: var(--dc-navy-raised) !important; }

.dc-color-modal-card { width: min(25rem, calc(100vw - 2rem)); }

.dc-color-modal-body {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.dc-color-picker-field {
  display: grid;
  gap: .4rem;
  color: var(--dc-muted);
  font: 700 .68rem NectoMono, ui-monospace, monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.dc-color-picker-field input[type="color"] {
  width: 100%;
  min-height: 4.25rem;
  padding: .25rem;
  border: 1px solid var(--dc-line-strong);
  border-radius: .55rem;
  background: var(--dc-navy-deep);
  cursor: pointer;
}

#layer-color-value {
  min-width: 6.2rem;
  padding: .62rem;
  border: 1px solid var(--dc-line);
  border-radius: .45rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  font: 700 .74rem NectoMono, ui-monospace, monospace;
  text-align: center;
}

.dc-color-alpha-field {
  display: grid;
  gap: .45rem;
  align-content: start;
}

.dc-color-alpha-field input[type="range"] {
  width: 100%;
}

#layer-alpha-value {
  display: inline-flex;
  justify-content: center;
  min-width: 4.2rem;
  padding: .45rem .62rem;
  border: 1px solid var(--dc-line);
  border-radius: .45rem;
  color: var(--dc-white);
  background: var(--dc-navy-deep);
  font: 700 .68rem NectoMono, ui-monospace, monospace;
  text-align: center;
}

.dc-color-modal-body .dc-modal-note { grid-column: 1 / -1; margin: 0; }

@media (max-width: 430px) {
  .dc-color-modal-body { grid-template-columns: 1fr; }
  #layer-color-value { justify-self: stretch; }
}

.dc-map-marker--center:hover .dc-map-icon,
.dc-map-marker--center:focus-visible .dc-map-icon { transform: scale(1.18); }

@media (max-width: 1100px) {
  .dc-filter-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dc-filter-field--search { grid-column: span 2; }
  .dc-workspace {
    grid-template-columns: minmax(220px, .72fr) minmax(420px, 1.28fr);
    height: auto;
  }
  .dc-controls,
  .dc-map-panel { height: 620px; }
  .dc-detail {
    grid-column: 1 / -1;
    height: auto;
    border-top: 1px solid var(--dc-line);
    border-left: 0;
  }
}

@media (max-width: 760px) {
  .datacenter-page { overflow-x: hidden; }

  .dc-shell {
    width: calc(100% - .5rem);
    margin: .35rem auto 1.5rem;
    padding: .4rem;
    border-radius: .8rem;
  }
  .dc-map-intro { display: block; }
  .dc-active-tag-filters { width: 100%; margin-top: .45rem; }
  .dc-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-downloads { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dc-workspace { display: flex; flex-direction: column; }
  .dc-controls,
  .dc-detail { height: auto; }
  .dc-controls { border-right: 0; }
  .dc-map-panel { order: 1; height: auto; border-top: 1px solid var(--dc-line); }
  .dc-controls { order: 2; }
  .dc-detail { order: 3; }
  .dc-map-panel > .dc-pane-heading {
    display: grid;
    gap: .65rem;
    align-items: start;
    padding: .7rem;
  }
  .dc-map-title-editor {
    width: 100%;
    min-width: 0;
  }
  #map-title-input {
    min-height: 2.25rem;
    padding-inline: .4rem;
  }
  .dc-map-heading-tools {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    width: 100%;
    gap: .55rem;
    align-items: end;
  }
  .dc-map-download,
  .dc-map-heading-tools select,
  .dc-map-query-toggle,
  .dc-map-share-trigger {
    min-height: 2.75rem;
  }
  .dc-map-share-sheet {
    right: auto;
    left: 0;
  }
  .dc-map-heading-tools label { min-width: 0; }
  .dc-map-heading-tools > p { display: none; }
  #datacenter-map { min-height: clamp(27rem, 62svh, 38rem); }
  .datacenter-page .maplibregl-ctrl-group button {
    width: 2.75rem;
    height: 2.75rem;
  }
  .dc-controls,
  .dc-detail { padding: .75rem; }
  .dc-controls .dc-pane-heading {
    margin: -.75rem -.75rem .75rem;
    padding-inline: .75rem;
  }
  .dc-layer-search { margin-inline: 0; }
  .dc-layer-visibility { min-height: 3rem; }
  .dc-detail.is-pinned {
    position: fixed;
    z-index: 80;
    right: .25rem;
    bottom: max(.25rem, env(safe-area-inset-bottom));
    left: .25rem;
    width: auto;
    max-height: min(72dvh, 42rem);
    overflow: auto;
    border: 1px solid var(--dc-sky);
    border-radius: .85rem;
    background: color-mix(in srgb, var(--dc-navy-mid) 96%, black);
    box-shadow: 0 -1rem 3rem rgba(0, 0, 0, .65);
    overscroll-behavior: contain;
  }
  .dc-detail.is-pinned .dc-inspector-close {
    top: .1rem;
    width: 2.75rem;
    height: 2.75rem;
  }
  .dc-reference { grid-template-columns: 1fr; }
  #source-list { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .dc-map-intro { padding: .35rem .2rem .55rem; }
  .dc-map-intro h1 { font-size: clamp(1.28rem, 7vw, 1.65rem); }
  .dc-active-tag-heading {
    align-items: start;
    flex-direction: column;
  }
  .dc-active-tag-actions {
    width: 100%;
    justify-content: space-between;
  }
  .dc-filter-menu > fieldset,
  .dc-filter-menu > div,
  .dc-filter-menu > p { right: auto; left: 0; width: min(19rem, calc(100vw - 3rem)); }
  .dc-energy-summary { grid-template-columns: 1fr; }
  .dc-facts { grid-template-columns: 1fr; gap: .18rem; }
  .dc-facts dd { margin-bottom: .55rem; }
  .dc-modal {
    width: calc(100vw - .5rem);
    max-height: calc(100dvh - .5rem);
    border-radius: .7rem;
  }
  .dc-modal-card {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    max-height: calc(100dvh - .5rem);
  }
  .dc-modal-body { overflow: auto; }
  .dc-modal-header,
  .dc-modal-footer,
  .dc-modal-body { padding: .75rem; }
  .dc-modal-footer {
    flex-wrap: wrap;
    background: var(--dc-navy-mid);
  }
  .dc-modal-footer button { min-height: 2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
  .datacenter-page #bg-video { display: none; }
  .dc-disclosure-action { transition: none; }
  .dc-site-animation .dc-aerial-motion.is-aerial-ready { animation: none; }
}
