:root {
  color-scheme: dark;
  --bg: #18110e;
  --paper: #18110e;
  --paper-soft: rgba(24, 17, 14, 0.78);
  --ink: #fff3dc;
  --muted: #cfe4d8;
  --faint: rgba(207, 228, 216, 0.72);
  --line: rgba(255, 243, 220, 0.14);
  --line-strong: rgba(255, 243, 220, 0.3);
  --blue: #ff2e84;
  --blue-soft: rgba(255, 46, 132, 0.15);
  --blue-faint: rgba(255, 46, 132, 0.065);
}

body {
  background:
    linear-gradient(rgba(255, 243, 220, 0.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 243, 220, 0.032) 1px, transparent 1px),
    var(--bg);
}

.interface-bar {
  background: rgba(24, 17, 14, 0.9);
}

.identity i,
.origin-meta::before,
.origin-mark::after,
.coordinate-readout::before {
  background: #0b5b45;
}

.status-dot {
  background: #ffd62e;
  box-shadow: 0 0 0 0 rgba(255, 214, 46, 0.34);
}

@keyframes status-pulse {
  70%,
  100% {
    box-shadow: 0 0 0 9px rgba(255, 214, 46, 0);
  }
}

.origin-mark::after {
  box-shadow: 0 0 22px rgba(11, 91, 69, 0.38);
}

.coordinate-cell {
  background: rgba(11, 91, 69, 0.16);
}

.coordinate-cell.is-active {
  background: rgba(255, 214, 46, 0.76);
  box-shadow: 0 0 26px rgba(255, 214, 46, 0.36);
}

.coordinate-cell.is-active::after {
  background: #ff2e84;
  border-color: #18110e;
}

.formula,
.destination-meta span:first-child,
.coordinate-readout {
  color: #ffd62e;
}

.prelude {
  background: var(--bg);
}
