/* CraftProxy network overview — monochrome mission-control visual system. */

/* Public authentication pages use the same quiet mission-control language. */
.auth-body {
  --brand: #4da3ff !important;
  min-height: 100vh;
  background:
    radial-gradient(circle at 50% 12%, rgba(77,163,255,.09), transparent 26rem),
    #050607;
}

.auth-body main { min-height: 100vh; }
.auth-body .card {
  border-color: #24282d;
  border-radius: .72rem;
  background: linear-gradient(180deg, #0d0f12, #090b0d);
  box-shadow: 0 28px 80px rgba(0,0,0,.38);
}
.auth-body .card h1 { color: #f2f3f1; font-weight: 560; letter-spacing: -.035em; }
.auth-body .card > div:first-child p { color: #71767d; }
.auth-body .input { border-color: #292e34; border-radius: .43rem; background: #080a0c; }
.auth-body .input:focus { border-color: #4b7197; box-shadow: 0 0 0 3px rgba(77,163,255,.11); }
.auth-body .btn { border-radius: .43rem; }
.auth-body .btn-primary { border: 1px solid #41698f; background: #16283a; color: #b9dcff; box-shadow: none; }
.auth-body .btn-primary:hover { background: #1b3249; }
.auth-body .accent-link { color: #75b7f8; }
.auth-logo {
  width: 9.5rem;
  height: 3.5rem;
  margin-bottom: 1.15rem;
  object-fit: contain;
}

/* Native form controls brought into the same control-plane visual language. */
.color-control {
  flex: none;
  width: 3.5rem;
  height: 2.35rem;
  padding: .2rem;
  border: 1px solid #303740;
  border-radius: .43rem;
  background: #0d1014;
  cursor: pointer;
}
.color-control::-webkit-color-swatch-wrapper { padding: 0; }
.color-control::-webkit-color-swatch,
.color-control::-moz-color-swatch { border: 0; border-radius: .25rem; }
.file-control { padding: .27rem; color: #6f7882; cursor: pointer; }
.file-control::file-selector-button {
  margin-right: .75rem;
  padding: .42rem .7rem;
  border: 1px solid #303944;
  border-radius: .34rem;
  background: #151b22;
  color: #aeb8c2;
  font-weight: 600;
  cursor: pointer;
}
.file-control:hover::file-selector-button { border-color: #455565; background: #1a222b; color: #dce4eb; }
.ui-checkbox {
  width: 1rem;
  height: 1rem;
  flex: none;
  accent-color: #4da3ff;
  cursor: pointer;
}
.ui-checkbox-danger { accent-color: #c86b6b; }
.status-beacon {
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: #4da3ff;
  box-shadow: 0 0 10px rgba(77,163,255,.55);
}
.deploy-code {
  max-height: 20rem;
  overflow: auto;
  margin: 0;
  padding: .85rem;
  border: 1px solid #222a32;
  border-radius: .45rem;
  background: #080b0e;
  color: #83b9ee;
  font: .72rem/1.65 var(--font-mono);
  white-space: pre-wrap;
}
.verification-status {
  display: flex;
  align-items: center;
  padding: .55rem .75rem;
  border: 1px solid #29313a;
  border-radius: .43rem;
  background: #0d1115;
  color: #89939d;
  font-size: .78rem;
}
.verification-status.is-verified { border-color: #315274; background: #101b26; color: #87bff4; }

.mission-body {
  --brand: #4da3ff !important;
  --mission-bg: #050607;
  --mission-panel: #0a0b0d;
  --mission-panel-raised: #0e1012;
  --mission-border: #202226;
  --mission-border-soft: #15171a;
  --mission-white: #f4f4f1;
  --mission-muted: #8a8e95;
  --mission-dim: #555a62;
  --mission-live: #4da3ff;
  background: #050607;
  background-image: radial-gradient(circle at 70% 0%, rgba(255,255,255,.025), transparent 28rem);
}

.mission-body #sidebar {
  width: 17rem;
  padding: 0;
  background: #070809;
  border-color: #202226;
  box-shadow: 20px 0 70px rgba(0,0,0,.3);
}

.mission-body #sidebar > a {
  position: relative;
  height: 3.85rem;
  gap: .75rem;
  border-color: #202226;
  padding-inline: 1.15rem;
}

.mission-body #sidebar > a img {
  display: none;
}

.mission-body #sidebar > a::before {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  border: 1px solid #34373c;
  border-radius: .35rem;
  color: #fff;
  content: "C";
  font-family: var(--font-mono);
  font-size: .68rem;
  font-weight: 700;
  box-shadow: none;
}

.mission-body #sidebar > a div div:first-child {
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .84rem;
}

.mission-body #sidebar > a div div:last-child {
  letter-spacing: .2em;
  font-size: .56rem;
  color: #62666d;
}

.mission-body #sidebar nav {
  padding: 1rem .75rem;
}

.mission-body .nav-link {
  min-height: 2.55rem;
  border: 1px solid transparent;
  border-radius: .42rem;
  padding: .65rem .75rem;
  color: #8a8e95;
  font-size: .75rem;
  letter-spacing: .035em;
}

.mission-body .nav-link svg { width: 1rem; height: 1rem; flex: none; }

.mission-body .nav-link:hover {
  background: rgba(255,255,255,.025);
  color: #eee;
}

.mission-body .nav-link-active,
.mission-body .nav-link-active:hover {
  border-color: rgba(77,163,255,.36);
  background: linear-gradient(90deg, rgba(77,163,255,.14), rgba(77,163,255,.035));
  box-shadow: none;
  color: #dcecff;
}

.nav-soon { margin-left: auto; color: #609bd8; font: .46rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.nav-external { margin-left: auto; color: #609bd8; font: .7rem var(--font-mono); }

.mission-body #sidebar nav > div {
  margin-top: .35rem;
  color: #555960;
  letter-spacing: .18em;
  font-size: .5rem;
}

.mission-body #sidebar nav > .mission-nav-divider {
  height: 1px;
  margin: 1rem .75rem .65rem;
  padding: 0;
  background: linear-gradient(90deg, transparent, #25282c 12%, #25282c 88%, transparent);
}

.mission-body main {
  background: transparent;
  padding-top: 3.85rem;
}

.mission-body main > div {
  max-width: 92rem;
  padding: 2rem 2rem 4rem;
}

.mission-topbar {
  position: fixed;
  z-index: 30;
  top: 0;
  right: 0;
  left: 17rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 3.85rem;
  padding: 0 1.75rem;
  border-bottom: 1px solid #1e2024;
  background: rgba(7,8,9,.92);
  backdrop-filter: blur(12px);
}

.mission-topbar > span {
  color: #d5d6d3;
  font-size: .76rem;
  font-weight: 520;
}

.mission-topbar > div { display: flex; align-items: center; gap: .7rem; }
.mission-topbar svg { width: .95rem; height: .95rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.topbar-search,
.topbar-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: #747880;
}

.topbar-search { gap: .45rem; padding: .4rem .15rem; font-size: .7rem; cursor: pointer; }
.topbar-search kbd { margin-left: .2rem; padding: .12rem .32rem; border: 1px solid #303339; border-radius: .25rem; background: #17191c; color: #73777d; font: .5rem var(--font-mono); }
.topbar-icon { width: 2rem; height: 2rem; cursor: pointer; }
.topbar-search:hover,.topbar-icon:hover { color: #e5e5e2; }
.topbar-avatar { display: flex; align-items: center; justify-content: center; width: 1.85rem; height: 1.85rem; border: 1px solid #f3f3f0; border-radius: 50%; background: #ededeb; color: #08090a; font-size: .65rem; font-weight: 700; text-decoration: none; transition: transform .16s ease, box-shadow .16s ease; }
.topbar-avatar:hover { box-shadow: 0 0 0 3px rgba(255,255,255,.1); transform: translateY(-1px); }

.mission-dashboard {
  width: 100%;
  color: var(--mission-white);
}

.mission-dashboard * {
  box-sizing: border-box;
}

.mission-dashboard svg,
.mission-modal svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mission-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.45rem;
}

.mission-kicker,
.eyebrow {
  display: flex;
  align-items: center;
  gap: .52rem;
  color: #676b72;
  font-family: var(--font-mono);
  font-size: .61rem;
  font-weight: 600;
  letter-spacing: .19em;
  text-transform: uppercase;
}

.mission-kicker span {
  width: 1.6rem;
  height: 1px;
  background: #aaa;
}

.mission-header h1 {
  margin: 0 0 .3rem;
  color: #f7f7f4;
  font-size: clamp(1.55rem, 2vw, 1.85rem);
  font-weight: 650;
  letter-spacing: -.035em;
  line-height: 1.05;
}

.mission-header > div:first-child > p {
  color: #747880;
  font-size: .84rem;
}

.mission-actions {
  display: flex;
  align-items: center;
  gap: .65rem;
}

.refresh-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  height: 2.45rem;
  padding: 0 .85rem;
  border: 1px solid #2b2e32;
  border-radius: .42rem;
  background: #0b0c0e;
  color: #b9bbb9;
  font-size: .68rem;
  font-weight: 550;
  cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
}

.refresh-button svg { width: .9rem; height: .9rem; }
.refresh-button:hover { border-color: #4b4f55; background: #111316; color: #fff; }

.telemetry-toolbar {
  display: flex;
  align-items: stretch;
  height: 2.65rem;
  overflow: hidden;
  border: 1px solid #2b2e32;
  border-radius: .42rem;
  background: #0b0c0e;
}

.sync-state {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 9.8rem;
  padding: 0 .8rem;
}

.sync-state > span:last-child {
  display: flex;
  flex-direction: column;
}

.sync-state b {
  color: #d9d9d6;
  font-size: .67rem;
  font-weight: 550;
  letter-spacing: .05em;
}

.sync-state small {
  color: #555960;
  font-family: var(--font-mono);
  font-size: .55rem;
  letter-spacing: .04em;
}

.sync-pulse {
  position: relative;
  width: .43rem;
  height: .43rem;
  border-radius: 50%;
  background: var(--mission-live);
  box-shadow: 0 0 10px rgba(77,163,255,.7);
}

.sync-pulse::after {
  position: absolute;
  inset: -.3rem;
  border: 1px solid rgba(77,163,255,.42);
  border-radius: 50%;
  content: "";
  animation: mission-pulse 2s ease-out infinite;
}

@keyframes mission-pulse {
  0% { opacity: 1; transform: scale(.55); }
  80%,100% { opacity: 0; transform: scale(1.45); }
}

.icon-action,
.launch-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 2.55rem;
  border: 1px solid #2b2e32;
  border-radius: .42rem;
  background: #0b0c0e;
  color: #c6c7c4;
  cursor: pointer;
  transition: .18s ease;
}

.icon-action {
  width: auto;
  gap: .4rem;
  padding: 0 .72rem;
  border-width: 0 0 0 1px;
  border-color: #2b2e32;
  border-radius: 0;
  color: #858990;
  font-family: var(--font-mono);
  font-size: .52rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.icon-action svg,
.launch-button svg {
  width: 1rem;
  height: 1rem;
}

.icon-action:hover {
  border-color: #656970;
  background: #111316;
  color: #fff;
}

.launch-button {
  gap: .55rem;
  padding: 0 1.05rem;
  border-color: #ededeb;
  background: #ededeb;
  color: #070809;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .065em;
  text-transform: uppercase;
}

.launch-button:hover {
  border-color: #fff;
  background: #fff;
  box-shadow: 0 0 25px rgba(255,255,255,.12);
}

.mission-alert {
  margin-bottom: 1rem;
  border-radius: 0;
  border-color: #5d2d2d;
  background: #170c0d;
}

.telemetry-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
  border: 0;
  background: transparent;
}

.telemetry-stat {
  position: relative;
  min-height: 7.1rem;
  padding: 1rem 1.1rem;
  border: 1px solid var(--mission-border);
  border-radius: .5rem;
  background: linear-gradient(145deg, #0e1012, #090a0c);
  overflow: hidden;
}

.telemetry-stat:last-child { border-right: 1px solid var(--mission-border); }

.telemetry-stat::after {
  display: none;
}

.stat-primary {
  border-color: #2a3932;
  background: linear-gradient(145deg, rgba(77,163,255,.08), #0a0c0d 65%);
}

.stat-label {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: #747880;
  font-family: var(--font-mono);
  font-size: .58rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.stat-icon {
  display: inline-flex;
  color: #a5a7aa;
}

.stat-icon svg { width: .92rem; height: .92rem; }

.stat-live-indicator {
  position: relative;
  width: .45rem;
  height: .45rem;
  border-radius: 50%;
  background: var(--mission-live);
  box-shadow: 0 0 9px rgba(77,163,255,.65);
}

.stat-live-indicator::after {
  position: absolute;
  inset: -.3rem;
  border: 1px solid rgba(77,163,255,.4);
  border-radius: 50%;
  content: "";
  animation: mission-pulse 1.7s ease-out infinite;
}

.telemetry-stat > strong {
  display: block;
  margin: .72rem 0 .4rem;
  color: #f4f4f0;
  font-family: var(--font-mono);
  font-size: 1.85rem;
  font-weight: 460;
  letter-spacing: -.06em;
  line-height: 1;
}

.telemetry-stat > .status-word {
  font-family: var(--font-sans);
  font-size: 1.55rem;
  letter-spacing: -.035em;
}

.stat-foot {
  display: flex;
  align-items: center;
  gap: .4rem;
  color: #5c6067;
  font-size: .64rem;
}

.trend-up {
  color: var(--mission-live);
  font-family: var(--font-mono);
  font-size: .55rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.stat-dot {
  width: .34rem;
  height: .34rem;
  border-radius: 50%;
  background: #555960;
}

.stat-dot.online { background: var(--mission-live); box-shadow: 0 0 7px rgba(77,163,255,.55); }
.stat-dot.idle { background: #555960; }

.orbital-layout,
.analytics-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, 22rem);
  gap: 1rem;
  margin-top: 1rem;
}

.mission-panel {
  border: 1px solid var(--mission-border);
  border-radius: .55rem;
  background: rgba(9,10,12,.94);
  overflow: hidden;
}

.panel-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid var(--mission-border);
}

.panel-heading h2,
.registry-header h2 {
  margin-top: .28rem;
  color: #e8e8e5;
  font-size: .93rem;
  font-weight: 520;
  letter-spacing: -.015em;
}

.panel-count,
.chart-key,
.map-legend {
  color: #686c73;
  font-family: var(--font-mono);
  font-size: .57rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.map-legend,
.chart-key {
  display: flex;
  align-items: center;
  gap: .45rem;
  padding-top: .3rem;
}

.map-legend span,
.chart-key span {
  width: .4rem;
  height: .4rem;
  border-radius: 50%;
  background: var(--mission-live);
  box-shadow: 0 0 8px rgba(77,163,255,.65);
}

.globe-stage {
  position: relative;
  height: 23rem;
  min-height: 23rem;
  overflow: hidden;
  cursor: grab;
  background:
    radial-gradient(circle at center, rgba(104,124,138,.12), transparent 48%),
    radial-gradient(circle at 24% 20%, rgba(255,255,255,.8) 0 1px, transparent 1.5px),
    radial-gradient(circle at 78% 72%, rgba(255,255,255,.55) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.4) 0 1px, transparent 1.5px),
    #050709;
  background-size: auto, 190px 190px, 240px 240px, 310px 310px, auto;
}

.globe-stage:active { cursor: grabbing; }

#network-globe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.globe-vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 70px 10px rgba(0,0,0,.4);
}

.orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(83%, 39rem);
  aspect-ratio: 1;
  border: 1px solid rgba(150,170,182,.16);
  border-radius: 50%;
  pointer-events: none;
}

.orbit-one { transform: translate(-50%,-50%) rotateX(68deg) rotateZ(-18deg); }
.orbit-two { transform: translate(-50%,-50%) rotateX(76deg) rotateZ(34deg) scale(1.06); border-style: dashed; opacity: .48; }

.globe-readout {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #494d54;
  font-family: var(--font-mono);
  font-size: .52rem;
  letter-spacing: .12em;
}

.globe-readout b { color: #8d9095; font-weight: 500; }
.readout-top { top: 1.15rem; right: 1.25rem; gap: 1rem; }
.readout-top b { color: #e7e7e4; }
.readout-bottom { right: 1.25rem; bottom: 1rem; left: 1.25rem; }

.globe-empty {
  position: absolute;
  z-index: 3;
  bottom: 2.5rem;
  left: 50%;
  width: min(80%, 25rem);
  transform: translateX(-50%);
  color: #5e6268;
  font-family: var(--font-mono);
  font-size: .6rem;
  letter-spacing: .06em;
  text-align: center;
}

.location-panel {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.location-list {
  flex: 1;
  min-height: 0;
}

.location-row {
  display: grid;
  grid-template-columns: 2rem minmax(7rem, 1fr) minmax(6rem, .82fr);
  align-items: center;
  gap: .65rem;
  min-height: 4rem;
  padding: .65rem .9rem;
  border-bottom: 1px solid var(--mission-border-soft);
  transition: background .15s ease;
}

.location-row:hover { background: rgba(255,255,255,.025); }

.location-rank {
  color: #3f4349;
  font-family: var(--font-mono);
  font-size: .57rem;
}

.location-identity {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}

.country-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid #25282c;
  background: #0d0f11;
  filter: none;
  font-size: .95rem;
}

.location-identity > span:last-child,
.location-load { min-width: 0; }

.location-identity b {
  display: block;
  overflow: hidden;
  color: #d8d8d5;
  font-size: .69rem;
  font-weight: 520;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.location-identity small {
  color: #6eafff;
  font-family: var(--font-mono);
  font-size: .52rem;
  text-transform: uppercase;
}

.location-load > span {
  display: block;
  margin-bottom: .42rem;
  color: #565a61;
  font-size: .54rem;
  text-align: right;
}

.location-load > span b {
  color: #dcddda;
  font-family: var(--font-mono);
  font-size: .72rem;
  font-weight: 500;
}

.load-track {
  height: 4px;
  border-radius: 999px;
  overflow: hidden;
  background: #202328;
}

.load-track i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #287dff, var(--mission-live));
  box-shadow: 0 0 8px rgba(77,163,255,.28);
  transition: width .6s ease;
}

.empty-rail,
.chart-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 12rem;
  padding: 2rem;
  color: #4f5359;
  text-align: center;
}

.empty-rail span { font-family: var(--font-mono); font-size: .58rem; letter-spacing: .18em; }
.empty-rail p { margin-top: .5rem; font-size: .7rem; }

.analytics-grid {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
}

.distribution-body {
  display: grid;
  grid-template-columns: 14rem 1fr;
  align-items: center;
  gap: 1.2rem;
  min-height: 18rem;
  padding: 1.2rem;
}

.distribution-ring {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11.5rem;
  height: 11.5rem;
  margin: auto;
  border-radius: 50%;
  background: conic-gradient(#e9e9e6 0 100%);
  box-shadow: 0 0 35px rgba(255,255,255,.035);
}

.distribution-ring::before {
  position: absolute;
  inset: 1.2rem;
  border: 1px solid #23262a;
  border-radius: 50%;
  background: #090a0c;
  content: "";
}

.distribution-ring > div { position: relative; z-index: 1; text-align: center; }
.distribution-ring strong { display: block; color: #f0f0ed; font-family: var(--font-mono); font-size: 1.55rem; font-weight: 450; letter-spacing: -.05em; }
.distribution-ring span { color: #565a60; font-family: var(--font-mono); font-size: .55rem; letter-spacing: .12em; text-transform: uppercase; }

.server-distribution {
  max-height: 15rem;
  overflow: auto;
}

.distribution-row {
  display: grid;
  grid-template-columns: .55rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .7rem;
  padding: .66rem .35rem;
  border-bottom: 1px solid #15171a;
  color: inherit;
}

.distribution-row:hover { background: rgba(255,255,255,.02); }
.distribution-swatch { width: .38rem; height: .38rem; border-radius: 50%; background: #e7e7e4; }
.distribution-name { min-width: 0; }
.distribution-name b { display: block; overflow: hidden; color: #c9cac7; font-size: .68rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.distribution-name small,
.distribution-value small { display: block; color: #4d5157; font-family: var(--font-mono); font-size: .49rem; }
.distribution-value { text-align: right; }
.distribution-value b { color: #e3e3e0; font-family: var(--font-mono); font-size: .72rem; font-weight: 500; }

.load-chart {
  position: relative;
  height: 18rem;
  padding: 1.3rem 1rem 1rem 3.2rem;
}

.chart-grid {
  position: absolute;
  inset: 1.3rem 1rem 2.7rem 3.2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
}

.chart-grid span {
  position: relative;
  display: block;
  color: #41454b;
  font-family: var(--font-mono);
  font-size: .48rem;
  transform: translateX(-2.5rem);
}

.chart-grid span::after {
  position: absolute;
  top: 50%;
  left: 2.5rem;
  width: calc(100% + 2.5rem);
  border-top: 1px dashed #1b1d21;
  content: "";
}

.chart-bars {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  gap: clamp(.45rem, 2vw, 1.25rem);
  height: 100%;
  padding-top: 1rem;
  overflow-x: auto;
}

.chart-bar {
  position: relative;
  display: flex;
  flex: 1 0 2.5rem;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: calc(100% - 1.2rem);
  min-width: 2.5rem;
  color: #565a61;
}

.chart-bar i {
  display: block;
  width: min(65%, 2.1rem);
  height: 4px;
  min-height: 4px;
  border: 1px solid #a9aaa7;
  border-bottom: 0;
  background: linear-gradient(180deg, rgba(239,239,235,.9), rgba(126,129,133,.16));
  box-shadow: 0 -5px 20px rgba(255,255,255,.06);
  transition: height .65s cubic-bezier(.2,.7,.2,1), background .15s;
}

.chart-bar:hover i { background: linear-gradient(180deg, #fff, rgba(170,173,176,.3)); }
.chart-bar b { display: block; overflow: hidden; width: 100%; margin-top: .6rem; font-family: var(--font-mono); font-size: .48rem; font-weight: 500; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.bar-value { position: absolute; bottom: calc(var(--bar-height, 4px) + 1.8rem); color: #777b81; font-family: var(--font-mono); font-size: .48rem; opacity: 0; transition: opacity .15s; }
.chart-bar:hover .bar-value { opacity: 1; }

.registry-section { margin-top: 2.2rem; }

.registry-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: .85rem;
}

.registry-header > span {
  color: #50545a;
  font-family: var(--font-mono);
  font-size: .53rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.server-registry {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .75rem;
}

.registry-card {
  min-width: 0;
  border: 1px solid var(--mission-border);
  background: #090a0c;
  transition: border-color .18s, transform .18s, background .18s;
}

.registry-card:hover {
  border-color: #393c41;
  background: #0c0e10;
  transform: translateY(-2px);
}

.registry-actions {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: .7rem;
}

.registry-actions button {
  padding: 0;
  border: 0;
  background: transparent;
  color: #777c82;
  font: .56rem var(--font-mono);
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .18s ease;
}

.registry-actions button:hover { color: var(--mission-live); }

.registry-top {
  display: grid;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto;
  align-items: center;
  gap: .7rem;
  padding: .9rem;
  border-bottom: 1px solid #191b1e;
}

.server-glyph {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  border: 1px solid #2a2d31;
  color: #aaa;
  background: #0d0f11;
}

.server-glyph svg { width: 1.05rem; height: 1.05rem; }
.registry-title { min-width: 0; }
.registry-title a { display: block; overflow: hidden; color: #dededb; font-size: .72rem; font-weight: 560; text-overflow: ellipsis; white-space: nowrap; }
.registry-title a:hover { color: #fff; }
.registry-title > span { display: block; overflow: hidden; color: #50545b; font-family: var(--font-mono); font-size: .48rem; text-overflow: ellipsis; white-space: nowrap; }

.registry-status {
  display: flex;
  align-items: center;
  gap: .35rem;
  color: #656970;
  font-family: var(--font-mono);
  font-size: .49rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.registry-status i { width: .32rem; height: .32rem; border-radius: 50%; background: #555960; }
.registry-status.is-online { color: #a9aaa7; }
.registry-status.is-online i { background: #eee; box-shadow: 0 0 6px rgba(255,255,255,.55); }
.registry-status.is-offline i { background: #555960; }

.registry-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: .85rem .9rem;
}

.registry-metrics div { border-right: 1px solid #1b1d20; padding-left: .7rem; }
.registry-metrics div:first-child { padding-left: 0; }
.registry-metrics div:last-child { border-right: 0; }
.registry-metrics span { display: block; color: #4e5258; font-family: var(--font-mono); font-size: .48rem; letter-spacing: .07em; text-transform: uppercase; }
.registry-metrics b { display: block; margin-top: .2rem; color: #d2d3d0; font-family: var(--font-mono); font-size: .78rem; font-weight: 500; }

.registry-locations {
  display: flex;
  gap: .4rem;
  padding: 0 .9rem .85rem;
  overflow-x: auto;
}

.registry-locations span {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  flex: none;
  padding: .3rem .42rem;
  border: 1px solid #1d2023;
  color: #656970;
  font-size: .52rem;
}

.registry-locations i { width: .25rem; height: .25rem; border-radius: 50%; background: #45494f; }
.registry-locations i.live { background: #ddd; }
.registry-locations b { color: #999c9f; font-family: var(--font-mono); font-weight: 500; }

.registry-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem .9rem;
  border-top: 1px solid #191b1e;
  color: #44484e;
  font-family: var(--font-mono);
  font-size: .48rem;
}

.registry-address { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.registry-foot a { display: flex; align-items: center; gap: .2rem; flex: none; color: #999c9f; letter-spacing: .05em; text-transform: uppercase; }
.registry-foot a:hover { color: #fff; }
.registry-foot svg { width: .72rem; height: .72rem; }

.registry-empty {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 4rem 2rem;
  border: 1px solid var(--mission-border);
  background: #08090a;
  text-align: center;
}

.registry-empty h3 { margin: 1rem 0 .35rem; color: #ddd; font-size: .9rem; font-weight: 500; }
.registry-empty p { max-width: 25rem; margin-bottom: 1.2rem; color: #5e6269; font-size: .7rem; }

.mission-modal {
  border-radius: 0;
  border-color: #303337;
  background: #090a0c;
}

.mission-modal .modal-head,
.mission-modal .modal-foot { border-color: #222529; background: #090a0c; }
.mission-modal .modal-head { align-items: flex-start; }
.mission-modal .modal-title { margin-top: .25rem; color: #ededeb; font-size: 1rem; font-weight: 500; }
.mission-modal .modal-close { border-radius: 0; }
.mission-modal .modal-close svg { width: 1rem; height: 1rem; }
.mission-modal .input { border-radius: 0; border-color: #2c2f34; background: #060708; }
.mission-modal .input:focus { border-color: #aaa; box-shadow: 0 0 0 1px #aaa; }
.mission-modal .label { color: #777b82; font-family: var(--font-mono); font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }
.modal-intro { color: #747880; font-size: .72rem; line-height: 1.6; }
.modal-intro b { color: #ddd; }

.proxy-toggle {
  display: flex;
  align-items: center;
  gap: .7rem;
  padding: .75rem;
  border: 1px solid #272a2e;
  cursor: pointer;
}

.proxy-toggle input { position: absolute; opacity: 0; }
.proxy-toggle > span { position: relative; width: 2rem; height: 1.05rem; border: 1px solid #34373c; background: #111316; transition: .2s; }
.proxy-toggle > span::after { position: absolute; top: 2px; left: 2px; width: .65rem; height: .65rem; background: #5e6268; content: ""; transition: .2s; }
.proxy-toggle input:checked + span { border-color: #ddd; background: #ddd; }
.proxy-toggle input:checked + span::after { left: 1.08rem; background: #08090a; }
.proxy-toggle b { display: block; color: #cacbc8; font-size: .7rem; font-weight: 500; }
.proxy-toggle small { display: block; color: #555960; font-size: .58rem; }

.dns-record {
  display: grid;
  grid-template-columns: .55fr 1.2fr 1.4fr;
  border: 1px solid #292c30;
}

.dns-record span { min-width: 0; padding: .75rem; border-right: 1px solid #292c30; }
.dns-record span:last-child { border-right: 0; }
.dns-record small { display: block; margin-bottom: .25rem; color: #555960; font-family: var(--font-mono); font-size: .48rem; letter-spacing: .1em; }
.dns-record b { display: block; overflow: hidden; color: #d8d8d5; font-family: var(--font-mono); font-size: .61rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.modal-note { color: #555960; font-size: .62rem; line-height: 1.6; }

/* ---- Library visualizations + offline simulation ----------------------- */
.simulation-switch {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  height: 2.45rem;
  padding: 0 .75rem;
  border: 1px solid #2b2e32;
  border-radius: .42rem;
  background: #0b0c0e;
  cursor: pointer;
  user-select: none;
}

.simulation-switch input { position: absolute; opacity: 0; pointer-events: none; }
.switch-track { position: relative; width: 1.8rem; height: 1rem; border: 1px solid #3b3e43; border-radius: 999px; background: #17191c; transition: .2s ease; }
.switch-track i { position: absolute; top: 2px; left: 2px; width: .62rem; height: .62rem; border-radius: 50%; background: #747980; transition: .2s ease; }
.simulation-switch > span:last-child { display: flex; flex-direction: column; min-width: 5.9rem; }
.simulation-switch b { color: #b9bbb9; font-size: .58rem; font-weight: 600; line-height: 1.1; }
.simulation-switch small { margin-top: .12rem; color: #555a61; font: .47rem var(--font-mono); letter-spacing: .04em; text-transform: uppercase; }
.simulation-switch input:checked + .switch-track { border-color: #377fca; background: rgba(77,163,255,.15); }
.simulation-switch input:checked + .switch-track i { left: .92rem; background: var(--mission-live); box-shadow: 0 0 8px rgba(77,163,255,.6); }
.simulation-switch input:focus-visible + .switch-track { outline: 2px solid rgba(77,163,255,.45); outline-offset: 2px; }
.simulation-active .simulation-switch { border-color: #254d78; background: rgba(77,163,255,.05); }
.simulation-active .simulation-switch b { color: #d5eee1; }

.globe-stage {
  background: radial-gradient(circle at 50% 46%, rgba(30,54,64,.28), transparent 45%), #050709;
}

.library-globe {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.library-globe canvas { display: block; outline: 0; }

.globe-library-status {
  position: absolute;
  z-index: 5;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  gap: .55rem;
  transform: translate(-50%,-50%);
  color: #696e75;
  font: .56rem var(--font-mono);
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: opacity .25s;
  pointer-events: none;
}

.globe-library-status > span:first-child { width: .4rem; height: .4rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 8px rgba(77,163,255,.6); animation: mission-pulse 1.6s infinite; }
.globe-library-status b { color: #afb3b6; font-weight: 600; }
.globe-library-status.is-hidden { opacity: 0; visibility: hidden; }

.globe-hint {
  position: absolute;
  z-index: 4;
  right: 1rem;
  bottom: .85rem;
  left: 1rem;
  display: flex;
  justify-content: space-between;
  color: #44494f;
  font: .48rem var(--font-mono);
  letter-spacing: .1em;
  text-transform: uppercase;
  pointer-events: none;
}

.globe-hint b { color: #5babff; font-weight: 600; }
.globe-empty { z-index: 5; bottom: 2.2rem; padding: .45rem .7rem; border: 1px solid #25292d; border-radius: .35rem; background: rgba(7,9,10,.88); color: #7a7f85; backdrop-filter: blur(7px); }
.globe-empty.is-hidden { display: none; }

.chart-panel { min-width: 0; }
.chart-canvas-wrap { position: relative; height: 18rem; padding: 1rem 1.15rem .9rem; }
.chart-canvas-wrap canvas { position: relative; z-index: 1; width: 100% !important; height: 100% !important; }
.server-chart-wrap { padding-inline: 1.4rem; }
.chart-empty-overlay {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  color: #555a61;
  font-size: .68rem;
  text-align: center;
}
.chart-empty-overlay.is-hidden { display: none; }

.simulation-card { border-color: #233c57; }
.simulation-badge { color: #5babff; font: .48rem var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }

/* Shared authenticated control-plane pages. */
.control-page { width: 100%; color: var(--mission-white); }
.control-page * { box-sizing: border-box; }
.control-page svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

.control-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1.6rem;
}
.control-header h1 { margin-top: .32rem; color: #f3f4f3; font-size: clamp(1.85rem, 3vw, 2.55rem); font-weight: 520; letter-spacing: -.055em; line-height: 1; }
.control-header p { max-width: 40rem; margin-top: .6rem; color: #70757d; font-size: .78rem; }

.quiet-button,
.blue-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .48rem;
  min-height: 2.35rem;
  padding: .65rem .95rem;
  border: 1px solid #30343a;
  border-radius: .4rem;
  background: #111316;
  color: #d8dade;
  font-size: .66rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.quiet-button:hover { border-color: #4b515a; background: #16191d; }
.blue-button { border-color: #5aa9ff; background: #4da3ff; color: #06111e; }
.blue-button:hover { border-color: #84c0ff; background: #6db4ff; transform: translateY(-1px); }
.mission-alert { margin-bottom: 1rem; }
.security-state { display: inline-flex; align-items: center; gap: .4rem; color: #6dafff; font: .52rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.security-state i { width: .38rem; height: .38rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 7px rgba(77,163,255,.65); }
.panel-link { color: #6aaeff; font: .52rem var(--font-mono); letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }
.panel-link:hover { color: #b5d8ff; }

/* Player sessions and attack intelligence on the dashboard. */
.operations-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(20rem, .85fr); gap: 1rem; margin-top: 1rem; }
.connected-player-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
.connected-player { display: grid; grid-template-columns: 2rem minmax(0,1fr) .45rem; align-items: center; gap: .65rem; min-height: 3.7rem; padding: .65rem .9rem; border-right: 1px solid var(--mission-border-soft); border-bottom: 1px solid var(--mission-border-soft); }
.connected-player:nth-child(even) { border-right: 0; }
.player-avatar { display: flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: 1px solid #294d73; border-radius: .35rem; background: linear-gradient(145deg,#132b44,#0c151f); color: #8bc4ff; font: 600 .68rem var(--font-mono); }
.connected-player b { display: block; color: #dcdfdf; font-size: .68rem; font-weight: 560; }
.connected-player small { display: block; margin-top: .12rem; overflow: hidden; color: #575c64; font-size: .53rem; text-overflow: ellipsis; white-space: nowrap; }
.connected-player > i { width: .38rem; height: .38rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 7px rgba(77,163,255,.6); }
.operations-empty { grid-column: 1/-1; padding: 1.5rem; text-align: center; }
.operations-empty span { display: block; color: #8c9097; font-size: .68rem; }
.operations-empty small { display: block; margin-top: .3rem; color: #4f535a; font-size: .56rem; }
.attack-list { min-height: 7.4rem; }
.attack-clear { display: flex; align-items: center; gap: .8rem; min-height: 7.4rem; padding: 1.15rem; }
.attack-clear > span { display: flex; align-items: center; justify-content: center; width: 2.45rem; height: 2.45rem; border: 1px solid #274d74; border-radius: 50%; background: rgba(77,163,255,.06); }
.attack-clear > span i { width: .6rem; height: .6rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 12px rgba(77,163,255,.65); }
.attack-clear b,.attack-event b { display: block; color: #d9dcdf; font-size: .7rem; font-weight: 560; }
.attack-clear small,.attack-event small { display: block; margin-top: .18rem; color: #555a61; font-size: .54rem; }
.attack-event { display: grid; grid-template-columns: 3.7rem minmax(0,1fr) auto; align-items: center; gap: .65rem; min-height: 3.2rem; padding: .55rem .8rem; border-bottom: 1px solid var(--mission-border-soft); }
.attack-event:last-child { border-bottom: 0; }
.attack-event strong { color: #8a929b; font: .62rem var(--font-mono); }
.attack-severity { padding: .24rem .3rem; border: 1px solid #33404e; border-radius: .25rem; color: #8ea2b8; font: .45rem var(--font-mono); letter-spacing: .04em; text-align: center; text-transform: uppercase; }
.attack-severity.high { border-color: #60333a; background: rgba(203,76,91,.08); color: #df7b87; }
.attack-severity.medium { border-color: #5d4d31; background: rgba(207,151,48,.07); color: #d5a956; }
.attack-severity.low { border-color: #294e75; background: rgba(77,163,255,.07); color: #6fb2fa; }
.registry-players { display: flex; align-items: center; gap: .35rem; overflow: hidden; padding: .55rem .7rem; border-top: 1px solid var(--mission-border-soft); }
.registry-players > span { margin-right: .2rem; color: #50555d; font: .46rem var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.registry-players b { flex: none; padding: .22rem .4rem; border: 1px solid #273747; border-radius: .25rem; background: #0c151f; color: #79b9ff; font-size: .49rem; font-weight: 500; }

/* Edge node control plane. */
.node-stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; }
.node-stat { min-height: 8.2rem; padding: 1rem 1.1rem; }
.node-stat > span { display: flex; align-items: center; gap: .42rem; color: #686d75; font: .54rem var(--font-mono); letter-spacing: .09em; text-transform: uppercase; }
.node-stat > span i { width: .4rem; height: .4rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 8px rgba(77,163,255,.65); }
.node-stat strong { display: block; margin-top: .8rem; color: #f0f1ef; font: 450 1.9rem var(--font-mono); letter-spacing: -.06em; }
.node-stat strong small { margin-left: .2rem; color: #565b63; font-size: .9rem; }
.node-stat p { margin-top: .25rem; color: #4e535a; font-size: .56rem; }
.node-stat.primary { border-color: #27486a; background: linear-gradient(145deg,rgba(77,163,255,.08),#0a0b0d 65%); }
.nodes-workspace { display: grid; grid-template-columns: minmax(0,1fr) 20rem; gap: 1rem; margin-top: 1rem; }
.node-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; padding: 1rem; }
.node-form .node-submit { align-self: end; }
.fleet-health-body { display: flex; flex-direction: column; align-items: center; padding: 1.2rem; text-align: center; }
.signal-radar { position: relative; width: 4.7rem; height: 4.7rem; margin: .15rem 0 .85rem; border: 1px solid #203a55; border-radius: 50%; background: radial-gradient(circle,rgba(77,163,255,.13),transparent 58%); }
.signal-radar::before,.signal-radar::after,.signal-radar i { position: absolute; inset: 21%; border: 1px solid rgba(77,163,255,.24); border-radius: 50%; content: ""; }
.signal-radar::after { inset: 39%; }
.signal-radar i:nth-child(1) { top: 50%; right: 10%; bottom: auto; left: 10%; border-width: 1px 0 0; border-radius: 0; }
.signal-radar i:nth-child(2) { top: 10%; right: auto; bottom: 10%; left: 50%; border-width: 0 0 0 1px; border-radius: 0; }
.signal-radar span { position: absolute; top: 45%; left: 66%; width: .45rem; height: .45rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 9px rgba(77,163,255,.8); }
.fleet-health-body h3 { color: #d9dcdf; font-size: .78rem; font-weight: 560; }
.fleet-health-body p { max-width: 14rem; margin: .35rem 0 .8rem; color: #555a62; font-size: .58rem; }
.fleet-panel { margin-top: 1rem; }
.node-card-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.node-card { border-right: 1px solid var(--mission-border-soft); border-bottom: 1px solid var(--mission-border-soft); }
.node-card:nth-child(even) { border-right: 0; }
.node-card-head { display: grid; grid-template-columns: 2rem minmax(0,1fr) auto; align-items: center; gap: .65rem; padding: .8rem; }
.node-card-head a { color: #e1e3e4; font-size: .72rem; font-weight: 560; text-decoration: none; }
.node-card-head a:hover { color: #79b9ff; }
.node-card-head small { display: block; margin-top: .12rem; overflow: hidden; color: #4e535a; font: .48rem var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
.node-card-stats { display: grid; grid-template-columns: repeat(3,1fr); border-block: 1px solid var(--mission-border-soft); }
.node-card-stats div { padding: .65rem .8rem; border-right: 1px solid var(--mission-border-soft); }
.node-card-stats div:last-child { border-right: 0; }
.node-card-stats span { display: block; color: #4d5259; font: .46rem var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.node-card-stats b { display: block; margin-top: .25rem; color: #cdd0d2; font: 500 .75rem var(--font-mono); }
.node-card-foot { display: flex; align-items: center; justify-content: space-between; padding: .6rem .8rem; }
.node-card-foot > span { display: flex; align-items: center; gap: .35rem; color: #555a62; font: .48rem var(--font-mono); text-transform: uppercase; }
.node-card-foot > span i { width: .35rem; height: .35rem; border-radius: 50%; background: var(--mission-live); }
.node-card-foot > div { display: flex; align-items: center; gap: .6rem; }
.node-card-foot a,.node-card-foot button { border: 0; background: none; color: #6dafff; font-size: .54rem; text-decoration: none; cursor: pointer; }
.node-card-foot button { color: #8a5d64; }
.fleet-empty { grid-column: 1/-1; padding: 3.2rem 1.5rem; text-align: center; }
.fleet-empty .feature-icon { margin-inline: auto; }
.fleet-empty h3 { margin-top: .75rem; color: #c8cbcd; font-size: .78rem; }
.fleet-empty p { margin-top: .35rem; color: #50555c; font-size: .6rem; }

/* Profile/account. */
.profile-header { align-items: center; }
.profile-identity { display: grid; grid-template-columns: 4.5rem minmax(0,1fr) minmax(12rem,.45fr); align-items: center; gap: 1rem; padding: 1.1rem; }
.profile-avatar { display: flex; align-items: center; justify-content: center; width: 4.5rem; height: 4.5rem; border: 1px solid #3c73a9; border-radius: 50%; background: radial-gradient(circle at 35% 28%,#234d76,#0c1824 70%); box-shadow: 0 0 30px rgba(77,163,255,.12); color: #a8d2ff; font: 500 1.35rem var(--font-mono); }
.profile-name h2 { margin-top: .25rem; color: #f0f1ef; font-size: 1.35rem; font-weight: 540; letter-spacing: -.03em; }
.profile-name p { margin-top: .2rem; color: #676c74; font-size: .67rem; }
.profile-plan { padding: .85rem 1rem; border: 1px solid #254666; border-radius: .4rem; background: rgba(77,163,255,.05); }
.profile-plan span,.profile-plan small { display: block; color: #5b6370; font: .48rem var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
.profile-plan b { display: block; margin: .32rem 0; color: #81bdff; font-size: .86rem; font-weight: 560; }
.profile-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin-top: .75rem; }
.profile-stat { min-height: 7.3rem; padding: .9rem 1rem; }
.profile-stat span { color: #60656d; font: .5rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.profile-stat strong { display: block; margin-top: .7rem; color: #e5e7e7; font: 450 1.55rem var(--font-mono); letter-spacing: -.05em; }
.profile-stat strong.date-value { font-size: .8rem; letter-spacing: -.02em; }
.profile-stat small { display: block; margin-top: .3rem; color: #4b5057; font-size: .52rem; }
.profile-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin-top: 1rem; }
.settings-form { display: grid; gap: .85rem; padding: 1rem; }
.settings-form .input,.node-form .input { border-color: #292d32; background: #0c0e11; color: #d8dadb; }
.settings-form .input:focus,.node-form .input:focus { border-color: #438bd4; box-shadow: 0 0 0 3px rgba(77,163,255,.08); }
.readonly-field { padding: .72rem .8rem; border: 1px solid #22262b; border-radius: .35rem; background: #090b0d; }
.readonly-field span,.readonly-field small { display: block; color: #4f545c; font-size: .52rem; }
.readonly-field b { display: block; margin: .22rem 0; color: #aeb2b6; font-size: .72rem; font-weight: 520; }
.field-hint { display: block; margin-top: .28rem; color: #4c5158; font-size: .52rem; }

/* Coming-soon security preview. */
.coming-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .7rem; border: 1px solid #2e547b; border-radius: 999px; background: rgba(77,163,255,.06); color: #7dbbff; font: .5rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.coming-pill i { width: .38rem; height: .38rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 8px rgba(77,163,255,.7); }
.coming-hero { position: relative; min-height: 21rem; padding: 3rem clamp(1.4rem,6vw,5rem); overflow: hidden; background: radial-gradient(circle at 76% 50%,rgba(77,163,255,.12),transparent 20rem),#090b0e; }
.coming-copy { position: relative; z-index: 2; max-width: 33rem; }
.coming-copy h2 { margin-top: .7rem; color: #f0f2f3; font-size: clamp(1.6rem,3vw,2.6rem); font-weight: 500; letter-spacing: -.05em; line-height: 1.08; }
.coming-copy p { margin: .9rem 0 1.25rem; color: #6c727b; font-size: .76rem; line-height: 1.7; }
.coming-orbit { position: absolute; top: 50%; right: 5%; width: 17rem; height: 17rem; transform: translateY(-50%); border: 1px solid rgba(77,163,255,.15); border-radius: 50%; }
.coming-orbit::before,.coming-orbit::after { position: absolute; inset: 18%; border: 1px solid rgba(77,163,255,.18); border-radius: 50%; content: ""; }
.coming-orbit::after { inset: 36%; }
.coming-orbit i { position: absolute; width: .55rem; height: .55rem; border-radius: 50%; background: var(--mission-live); box-shadow: 0 0 14px rgba(77,163,255,.8); }
.coming-orbit i:nth-child(1) { top: 5%; left: 45%; }.coming-orbit i:nth-child(2) { right: 14%; bottom: 18%; }.coming-orbit i:nth-child(3) { bottom: 32%; left: 4%; }
.coming-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin-top: .75rem; }
.coming-feature { display: flex; gap: .8rem; padding: 1rem; }
.feature-icon { display: flex; flex: none; align-items: center; justify-content: center; width: 2.35rem; height: 2.35rem; border: 1px solid #294d72; border-radius: .4rem; background: #0d1721; color: #72b4fa; }
.coming-feature b { color: #d4d7d9; font-size: .7rem; font-weight: 560; }
.coming-feature p { margin-top: .3rem; color: #555a62; font-size: .56rem; line-height: 1.55; }

@media (max-width: 1240px) {
  .server-registry { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .distribution-body { grid-template-columns: 11rem 1fr; }
  .distribution-ring { width: 9rem; height: 9rem; }
  .node-stat-grid,.profile-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 1024px) {
  .telemetry-strip { grid-template-columns: repeat(2, 1fr); }
  .telemetry-stat:nth-child(2) { border-right: 1px solid var(--mission-border); }
  .telemetry-stat:nth-child(-n+2) { border-bottom: 1px solid var(--mission-border); }
  .orbital-layout { grid-template-columns: 1fr; }
  .globe-stage { height: 30rem; min-height: 30rem; }
  .location-row { grid-template-columns: 2rem minmax(7rem, 1fr) minmax(10rem, .7fr); }
  .analytics-grid { grid-template-columns: 1fr; }
  .operations-grid,.nodes-workspace,.profile-grid { grid-template-columns: 1fr; }
  .coming-orbit { opacity: .55; }
}

@media (min-width: 768px) {
  .mission-body main {
    width: calc(100% - 17rem);
    min-width: 0;
    margin-left: 17rem;
    flex: none;
  }
}

@media (max-width: 767px) {
  .mission-topbar { display: none; }
  .mission-body main { padding-top: 3.5rem; }
  .mission-body main > div { padding: 1.2rem 1rem 3rem; }
  .mission-body > div > div:first-of-type { background: rgba(6,7,8,.96); }
  .mission-header { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .mission-actions { width: 100%; }
  .telemetry-toolbar { margin-right: auto; }
  .telemetry-strip { grid-template-columns: 1fr 1fr; }
  .telemetry-stat { min-height: 7.5rem; padding: 1rem; }
  .telemetry-stat > strong { font-size: 1.5rem; }
  .globe-stage { height: 26rem; min-height: 26rem; }
  .distribution-body { grid-template-columns: 1fr; }
  .server-registry { grid-template-columns: 1fr; }
  .registry-header > span { display: none; }
  .control-header { align-items: flex-start; flex-direction: column; }
  .profile-identity { grid-template-columns: 3.7rem minmax(0,1fr); }
  .profile-avatar { width: 3.7rem; height: 3.7rem; }
  .profile-plan { grid-column: 1/-1; }
  .node-card-grid { grid-template-columns: 1fr; }
  .node-card { border-right: 0; }
  .coming-feature-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .mission-header h1 { font-size: 1.8rem; }
  .sync-state { display: none; }
  .mission-actions { justify-content: flex-end; }
  .simulation-switch { margin-right: auto; padding-inline: .6rem; }
  .simulation-switch > span:last-child { min-width: 5rem; }
  .simulation-switch b { font-size: .54rem; }
  .telemetry-strip { grid-template-columns: 1fr; }
  .telemetry-stat { border-right: 1px solid var(--mission-border); border-bottom: 1px solid var(--mission-border); }
  .telemetry-stat:nth-child(3) { border-bottom: 1px solid var(--mission-border); }
  .telemetry-stat:last-child { border-bottom: 0; }
  .globe-stage { height: 22rem; min-height: 22rem; }
  .orbit { width: 95%; }
  .readout-bottom span { display: none; }
  .location-row { grid-template-columns: 1.5rem minmax(0, 1fr) 5.5rem; padding-inline: .75rem; }
  .country-mark { width: 1.75rem; height: 1.75rem; }
  .load-track { display: none; }
  .distribution-body { padding-inline: .75rem; }
  .dns-record { grid-template-columns: 1fr; }
  .dns-record span { border-right: 0; border-bottom: 1px solid #292c30; }
  .dns-record span:last-child { border-bottom: 0; }
  .connected-player-list,.node-form,.node-stat-grid,.profile-stats { grid-template-columns: 1fr; }
  .connected-player { border-right: 0; }
  .coming-orbit { right: -8rem; opacity: .28; }
  .coming-hero { padding-inline: 1.3rem; }
}

/* Documentation knowledge base. */
.docs-header { align-items: center; }
.docs-library { overflow: hidden; border: 1px solid #20262c; border-radius: .75rem; background: #090b0e; box-shadow: var(--ui-shadow); }
.docs-library-head { display: flex; align-items: end; justify-content: space-between; padding: 1.1rem 1.2rem; border-bottom: 1px solid #20262c; }
.docs-library-head h2 { margin-top: .28rem; color: #e5e8ea; font-size: 1rem; }
.docs-library-head > span { color: #59636d; font: .5rem var(--font-mono); text-transform: uppercase; }
.docs-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); }
.doc-card { position: relative; min-height: 14rem; padding: 1.15rem; border-right: 1px solid #1e242a; border-bottom: 1px solid #1e242a; background: #090b0e; transition: background .16s ease, transform .16s ease; }
.doc-card:nth-child(3n) { border-right: 0; }
.doc-card:hover { z-index: 1; background: #0d1115; transform: translateY(-1px); }
.doc-card > a { position: absolute; z-index: 1; inset: 0; }
.doc-card-top { display: flex; align-items: center; justify-content: space-between; }
.doc-icon { display: inline-flex; align-items: center; justify-content: center; width: 2.35rem; height: 2.35rem; border: 1px solid #25394d; border-radius: .5rem; background: #111922; color: #78aee2; }
.doc-icon svg { width: 1.05rem; height: 1.05rem; }
.doc-draft { display: inline-flex; padding: .25rem .45rem; border-radius: 999px; background: #29241a; color: #c6a66a; font: .45rem var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.doc-card h3 { margin-top: 1rem; color: #e2e6e9; font-size: .9rem; letter-spacing: -.02em; }
.doc-card p { margin-top: .45rem; color: #636d77; font-size: .62rem; line-height: 1.55; }
.doc-card footer { position: absolute; right: 1.15rem; bottom: 1rem; left: 1.15rem; display: flex; align-items: center; justify-content: space-between; padding-top: .75rem; border-top: 1px solid #1d2329; }
.doc-card footer span { color: #4f5862; font: .45rem var(--font-mono); }
.doc-card footer b { color: #78b6f2; font-size: .53rem; font-weight: 550; }
.doc-card footer i { margin-left: .2rem; font-style: normal; }
.doc-card.is-draft { background: repeating-linear-gradient(-45deg,#090b0e,#090b0e 10px,#0b0d10 10px,#0b0d10 20px); }
.docs-empty { grid-column: 1/-1; display: flex; align-items: center; flex-direction: column; justify-content: center; min-height: 25rem; padding: 3rem; text-align: center; }
.docs-empty h2 { margin-top: 1rem; color: #d8dde1; font-size: 1rem; }
.docs-empty p { max-width: 30rem; margin: .5rem 0 1rem; color: #606a74; font-size: .65rem; }

.docs-editor-modal { width: min(58rem, calc(100vw - 2rem)); max-width: 58rem; max-height: calc(100vh - 2rem); }
.docs-editor-fields { display: grid; gap: 1rem; }
.docs-editor-row { display: grid; grid-template-columns: .75fr 1.25fr; gap: .8rem; }
.docs-editor { min-height: 20rem; font-family: var(--font-mono); line-height: 1.6; }
.doc-publish-toggle { display: flex; align-items: flex-start; gap: .65rem; padding: .8rem; border: 1px solid #252d35; border-radius: .48rem; background: #0d1115; cursor: pointer; }
.doc-publish-toggle b,.doc-publish-toggle small { display: block; }
.doc-publish-toggle b { color: #cbd1d6; font-size: .62rem; }
.doc-publish-toggle small { margin-top: .2rem; color: #58626c; font-size: .52rem; }
.doc-image-tools { display: flex; align-items: center; gap: .75rem; margin-top: .6rem; }
.doc-image-tools label { min-height: 2.15rem; padding: .45rem .7rem; }
.doc-image-tools input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.doc-image-status { color: #59636d; font: .5rem var(--font-mono); }
.doc-image-status.is-loading { color: #7ba8d3; }
.doc-image-status.is-success { color: #77b8f5; }
.doc-image-status.is-error { color: #d77c88; }

.doc-breadcrumb { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.2rem; color: #56616c; font: .52rem var(--font-mono); }
.doc-breadcrumb a { color: #79b7f2; }
.doc-article-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid #20262c; }
.doc-article-header h1 { max-width: 52rem; margin-top: .5rem; color: #f0f2f3; font-size: clamp(2rem,4vw,3.5rem); font-weight: 520; letter-spacing: -.055em; line-height: 1.02; }
.doc-article-header p { max-width: 48rem; margin-top: .75rem; color: #77818b; font-size: .8rem; line-height: 1.55; }
.doc-article-header small { display: block; margin-top: .7rem; color: #515b65; font: .48rem var(--font-mono); }
.doc-reading-layout { display: grid; grid-template-columns: 13rem minmax(0, 48rem); gap: 3rem; align-items: start; padding-top: 2rem; }
.doc-reading-meta { position: sticky; top: 5.5rem; padding-left: .8rem; border-left: 1px solid #27313a; }
.doc-reading-meta span { color: #515b65; font: .46rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.doc-reading-meta p { margin-top: .5rem; color: #929ba4; font-size: .58rem; line-height: 1.45; }
.doc-reading-meta a { display: block; margin-top: 1rem; color: #72ace2; font-size: .54rem; }
.doc-prose { min-width: 0; padding-bottom: 5rem; color: #a8b0b8; font-size: .72rem; line-height: 1.8; }
.doc-prose h1 { margin: 0 0 .9rem; color: #f1f3f4; font-size: 1.8rem; letter-spacing: -.045em; line-height: 1.15; }
.doc-prose h2 { margin: 2.2rem 0 .7rem; color: #edf0f2; font-size: 1.35rem; letter-spacing: -.035em; }
.doc-prose h2:first-child { margin-top: 0; }
.doc-prose h3 { margin: 1.6rem 0 .55rem; color: #dce1e5; font-size: .95rem; }
.doc-prose h4,.doc-prose h5,.doc-prose h6 { margin: 1.25rem 0 .45rem; color: #d0d7dd; font-size: .78rem; letter-spacing: -.01em; }
.doc-prose p { margin: .75rem 0; }
.doc-prose a { color: #79b7f2; text-decoration: underline; text-decoration-color: rgba(121,183,242,.35); text-underline-offset: 2px; }
.doc-prose code { padding: .12rem .3rem; border: 1px solid #26313b; border-radius: .25rem; background: #0b1117; color: #a9d3f7; font: .62rem var(--font-mono); }
.doc-prose ul,.doc-prose ol { display: grid; gap: .4rem; margin: .8rem 0; padding-left: 1.4rem; }
.doc-prose li::marker { color: #5b9bd8; }
.doc-prose li input[type="checkbox"] { width: .72rem; height: .72rem; margin: 0 .35rem 0 0; accent-color: #4d9be6; vertical-align: -1px; }
.doc-prose blockquote { margin: 1rem 0; padding: .8rem 1rem; border-left: 2px solid #4d93d5; background: #0d1319; color: #9cb4ca; }
.doc-prose hr { margin: 1.6rem 0; border: 0; border-top: 1px solid #25303a; }
.doc-prose pre { overflow-x: auto; margin: 1rem 0; padding: 1rem; border: 1px solid #232c35; border-radius: .5rem; background: #070a0d; color: #88b9e8; font: .62rem/1.7 var(--font-mono); }
.doc-prose pre code { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; }
.doc-figure { margin: 1.6rem 0; }
.doc-figure img { display: block; width: 100%; max-height: 38rem; object-fit: contain; border: 1px solid #26303a; border-radius: .65rem; background: #07090c; box-shadow: 0 18px 50px rgba(0,0,0,.24); }
.doc-figure figcaption { margin-top: .55rem; color: #56616c; font: .5rem var(--font-mono); text-align: center; }
.docs-edit-actions { padding-left: 8.5rem; }
.doc-delete-form { position: absolute; bottom: 1rem; left: 1.4rem; }

@media (max-width: 1100px) { .docs-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }.doc-card:nth-child(3n){border-right:1px solid #1e242a}.doc-card:nth-child(2n){border-right:0}.doc-reading-layout{grid-template-columns:11rem minmax(0,1fr);gap:2rem} }
@media (max-width: 767px) { .docs-header,.doc-article-header{align-items:flex-start;flex-direction:column}.docs-header .blue-button{width:100%}.docs-grid{grid-template-columns:1fr}.doc-card,.doc-card:nth-child(2n),.doc-card:nth-child(3n){border-right:0}.docs-editor-row{grid-template-columns:1fr}.doc-reading-layout{grid-template-columns:1fr}.doc-reading-meta{position:static;display:none}.doc-article-header h1{font-size:2.2rem} }
@media (max-width: 520px) { .docs-editor-modal{width:calc(100vw - 1rem)}.docs-edit-actions{padding-left:1rem}.doc-delete-form{position:static;padding:0 1rem 1rem}.doc-delete-form .btn{width:100%}.doc-image-tools{align-items:flex-start;flex-direction:column}.doc-image-tools label{width:100%} }

@media (prefers-reduced-motion: reduce) {
  .sync-pulse::after { animation: none; }
  .registry-card:hover { transform: none; }
  .load-track i,
  .chart-bar i { transition: none; }
}

/* Live fleet status. */
.nav-live { display: inline-flex; align-items: center; gap: .28rem; margin-left: auto; color: #71b7f7; font: .45rem var(--font-mono); letter-spacing: .07em; text-transform: uppercase; }
.nav-live i { width: .3rem; height: .3rem; border-radius: 50%; background: #4da3ff; box-shadow: 0 0 7px rgba(77,163,255,.7); }
.status-header { align-items: center; }
.status-live-pill { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .75rem; border: 1px solid #29445f; border-radius: 999px; background: #0d151d; color: #83bdf1; font: .5rem var(--font-mono); letter-spacing: .08em; text-transform: uppercase; }
.status-live-pill i { width: .38rem; height: .38rem; border-radius: 50%; background: #4da3ff; box-shadow: 0 0 9px rgba(77,163,255,.75); animation: mission-pulse 2s ease-out infinite; }
.status-overview { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 1rem; min-height: 8rem; padding: 1.25rem 1.35rem; overflow: hidden; border: 1px solid #203141; border-radius: .75rem; background: linear-gradient(145deg,rgba(77,163,255,.08),transparent 58%),#0a0d10; }
.status-overview-icon { display: grid; width: 3.1rem; height: 3.1rem; place-items: center; border: 1px solid #315b83; border-radius: 50%; background: #101d29; }
.status-overview-icon i { width: .72rem; height: .72rem; border-radius: 50%; background: #4da3ff; box-shadow: 0 0 18px rgba(77,163,255,.8); }
.status-overview > div > span { color: #63707c; font: .48rem var(--font-mono); letter-spacing: .11em; text-transform: uppercase; }
.status-overview h2 { margin-top: .3rem; color: #edf1f4; font-size: 1.35rem; letter-spacing: -.035em; }
.status-overview p { margin-top: .32rem; color: #69737d; font-size: .64rem; }
.status-overview > small { color: #54616d; font: .47rem var(--font-mono); text-transform: uppercase; }
.status-overview.is-degraded { border-color: #594c2c; background: linear-gradient(145deg,rgba(224,174,74,.08),transparent 58%),#0a0d10; }
.status-overview.is-degraded .status-overview-icon { border-color: #66552e; background: #1b1710; }
.status-overview.is-degraded .status-overview-icon i { background: #d9a843; box-shadow: 0 0 18px rgba(217,168,67,.6); }
.status-overview.is-offline { border-color: #5f3038; background: linear-gradient(145deg,rgba(222,93,108,.08),transparent 58%),#0a0d10; }
.status-overview.is-offline .status-overview-icon { border-color: #703843; background: #1e1114; }
.status-overview.is-offline .status-overview-icon i { background: #df6574; box-shadow: 0 0 18px rgba(223,101,116,.58); }
.status-overview.is-empty .status-overview-icon i { background: #68737e; box-shadow: none; }
.status-counts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: .8rem; overflow: hidden; border: 1px solid #1f252b; border-radius: .68rem; background: #090b0e; }
.status-counts article { display: flex; align-items: center; gap: .7rem; padding: .8rem 1rem; border-right: 1px solid #1f252b; }
.status-counts article:last-child { border-right: 0; }
.status-counts article > span { width: .42rem; height: .42rem; border-radius: 50%; }
.status-dot-live { background: #4da3ff; box-shadow: 0 0 8px rgba(77,163,255,.6); }
.status-dot-degraded { background: #d9a843; box-shadow: 0 0 8px rgba(217,168,67,.45); }
.status-dot-offline { background: #df6574; box-shadow: 0 0 8px rgba(223,101,116,.45); }
.status-counts strong,.status-counts small { display: block; }
.status-counts strong { color: #dce1e5; font: 500 1rem var(--font-mono); }
.status-counts small { margin-top: .1rem; color: #59636d; font-size: .5rem; }
.status-components { margin-top: 1.35rem; }
.status-section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: .65rem; }
.status-section-heading h2 { margin-top: .28rem; color: #e6eaed; font-size: 1rem; }
.status-section-heading > span { color: #59636d; font: .48rem var(--font-mono); text-transform: uppercase; }
.status-node-list { display: grid; gap: .65rem; }
.status-node { display: grid; grid-template-columns: minmax(12rem,1fr) minmax(13rem,.9fr) minmax(23rem,1.25fr); align-items: center; gap: 1rem; min-width: 0; padding: .9rem 1rem; border: 1px solid #20272e; border-radius: .68rem; background: #0a0d10; }
.status-node-identity { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.status-node-identity h3 { overflow: hidden; color: #e3e7ea; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.status-node-identity p { margin-top: .18rem; overflow: hidden; color: #59636d; font: .47rem var(--font-mono); text-overflow: ellipsis; white-space: nowrap; text-transform: uppercase; }
.status-node-state { min-width: 0; }
.status-node-state > span { display: inline-flex; align-items: center; gap: .38rem; color: #86bff2; font: .5rem var(--font-mono); text-transform: uppercase; }
.status-node-state > span i { width: .36rem; height: .36rem; border-radius: 50%; background: #4da3ff; box-shadow: 0 0 7px rgba(77,163,255,.6); }
.status-node-state small { display: block; margin-top: .25rem; color: #59636d; font-size: .5rem; line-height: 1.45; }
.status-node.is-degraded .status-node-state > span { color: #d7ae59; }
.status-node.is-degraded .status-node-state > span i { background: #d9a843; box-shadow: 0 0 7px rgba(217,168,67,.45); }
.status-node.is-offline .status-node-state > span { color: #da7884; }
.status-node.is-offline .status-node-state > span i { background: #df6574; box-shadow: 0 0 7px rgba(223,101,116,.45); }
.status-node-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); overflow: hidden; border: 1px solid #1e252c; border-radius: .48rem; background: #0c1014; }
.status-node-metrics > span { min-width: 0; padding: .58rem .65rem; border-right: 1px solid #1e252c; }
.status-node-metrics > span:last-child { border-right: 0; }
.status-node-metrics small,.status-node-metrics b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.status-node-metrics small { color: #515b65; font: .42rem var(--font-mono); letter-spacing: .05em; text-transform: uppercase; }
.status-node-metrics b { margin-top: .24rem; color: #bec5cb; font: 500 .54rem var(--font-mono); }
.status-empty { display: grid; min-height: 17rem; place-items: center; align-content: center; padding: 2rem; border: 1px dashed #293038; border-radius: .7rem; background: #090b0e; text-align: center; }
.status-empty h3 { margin-top: .8rem; color: #d9dee2; font-size: .82rem; }
.status-empty p { max-width: 27rem; margin-top: .35rem; color: #5c6670; font-size: .6rem; line-height: 1.55; }

@media (max-width: 1180px) {
  .status-node { grid-template-columns: minmax(12rem,1fr) minmax(13rem,1fr); }
  .status-node-metrics { grid-column: 1/-1; }
}
@media (max-width: 700px) {
  .status-header { align-items: flex-start; }
  .status-overview { grid-template-columns: auto minmax(0,1fr); }
  .status-overview > small { display: none; }
  .status-counts { grid-template-columns: 1fr; }
  .status-counts article { border-right: 0; border-bottom: 1px solid #1f252b; }
  .status-counts article:last-child { border-bottom: 0; }
  .status-node { grid-template-columns: 1fr; }
  .status-node-metrics { grid-column: auto; grid-template-columns: 1fr 1fr; }
  .status-node-metrics > span:nth-child(2) { border-right: 0; }
  .status-node-metrics > span:nth-child(-n+2) { border-bottom: 1px solid #1e252c; }
}

/* Administration: explicit debug controls kept separate from product policy. */
.admin-debug-section { margin-top: .25rem; }
.debug-setting-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1rem 1.1rem;
}
.debug-setting-card > div { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.debug-setting-card > div > span:last-child { min-width: 0; }
.debug-icon {
  display: grid;
  flex: none;
  width: 2.4rem;
  height: 2.4rem;
  place-items: center;
  border: 1px solid #273542;
  border-radius: .55rem;
  background: #111820;
  color: #7da7cc;
}
.debug-icon svg { width: 1.05rem!important; height: 1.05rem!important; }
.debug-setting-card b { display: block; color: #dce1e5; font-size: .72rem; }
.debug-setting-card small { display: block; margin-top: .22rem; color: #5d6670; font-size: .53rem; line-height: 1.5; }
.debug-switch {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.35rem;
  padding: .45rem .7rem;
  border: 1px solid #2a333c;
  border-radius: .5rem;
  background: #0d1115;
  color: #89939d;
  font: 500 .52rem var(--font-mono);
  cursor: pointer;
}
.debug-switch i {
  position: relative;
  width: 1.8rem;
  height: 1rem;
  border: 1px solid #3a444e;
  border-radius: 999px;
  background: #171c22;
}
.debug-switch i::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: .62rem;
  height: .62rem;
  border-radius: 50%;
  background: #697480;
  content: "";
  transition: transform .16s ease, background-color .16s ease;
}
.debug-switch[aria-checked="true"] { border-color: #315275; background: #101923; color: #8fc4f5; }
.debug-switch[aria-checked="true"] i { border-color: #386893; background: rgba(77,163,255,.12); }
.debug-switch[aria-checked="true"] i::after { background: #4da3ff; transform: translateX(.78rem); }
.debug-switch:hover { border-color: #465562; color: #d8e1e9; }

@media (max-width: 520px) {
  .debug-setting-card { align-items: stretch; flex-direction: column; }
  .debug-setting-card form,
  .debug-switch { width: 100%; }
  .debug-switch { justify-content: center; }
}

.admin-default-plan { grid-column: 1 / -1; border-right: 0 !important; border-bottom: 0 !important; }
.default-plan-setting { display: grid; grid-template-columns: minmax(0,1fr) minmax(22rem,.9fr); align-items: end; gap: 2rem; }
.default-plan-setting h2 { margin-top: .35rem; }
.default-plan-setting p { max-width: 38rem; margin-top: .45rem; color: #626c76; font-size: .62rem; line-height: 1.55; }
.default-plan-setting form { min-width: 0; }
.default-plan-control { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: .6rem; }
.default-plan-setting form > small { display: block; margin-top: .4rem; color: #68727c; font-size: .52rem; }

@media (max-width: 900px) {
  .default-plan-setting { grid-template-columns: 1fr; gap: 1rem; }
}

@media (max-width: 520px) {
  .default-plan-control { grid-template-columns: 1fr; }
  .default-plan-control .btn { width: 100%; }
}

/* Xera Shield shell and control-plane refinements. */
.xera-brand { display:flex!important; align-items:center; gap:.72rem; height:4.35rem!important; padding:0 1.15rem!important; border-bottom:1px solid #20242a!important; text-decoration:none; }
.mission-body #sidebar > .xera-brand::before { display:none; }
.xera-mark { display:flex; align-items:center; justify-content:center; width:2rem; height:2rem; border:1px solid #335d89; border-radius:.48rem; background:linear-gradient(145deg,#10253a,#0a1017); color:#80bcff; font:700 .72rem var(--font-mono); box-shadow:0 0 20px rgba(77,163,255,.08); }
.xera-lockup > div { display:flex; gap:.28rem; font-size:.84rem!important; letter-spacing:.08em!important; text-transform:uppercase; }
.xera-lockup > div span:first-child { color:#f2f4f6; }
.xera-lockup > div span:last-child { color:#58a9ff; }
.xera-lockup small { display:block; margin-top:.15rem; color:#555d67; font:.48rem var(--font-mono); letter-spacing:.19em; text-transform:uppercase; }
.profile-menu { position:relative; }
.profile-menu summary { display:flex; align-items:center; gap:.3rem; list-style:none; color:#68717b; cursor:pointer; }
.profile-menu summary::-webkit-details-marker { display:none; }
.profile-menu summary > svg { width:.7rem; height:.7rem; transition:transform .15s; }
.profile-menu[open] summary > svg { transform:rotate(180deg); }
.profile-popover { position:absolute; top:calc(100% + .8rem); right:0; width:16rem; padding:.6rem; border:1px solid #2b3138; border-radius:.65rem; background:#0d1014; box-shadow:0 20px 50px rgba(0,0,0,.48); }
.profile-popover-user { display:flex; align-items:center; gap:.65rem; padding:.55rem; }
.profile-popover-user > span { display:flex; align-items:center; justify-content:center; width:2rem; height:2rem; border-radius:50%; background:#132a42; color:#7dbaff; font-size:.65rem; }
.profile-popover-user b,.profile-popover-user small { display:block; max-width:11rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-popover-user b { color:#e5e8ea; font-size:.66rem; font-weight:600; }.profile-popover-user small { margin-top:.14rem; color:#626a74; font-size:.52rem; }
.profile-popover-plan { display:flex; align-items:center; justify-content:space-between; margin:.35rem 0; padding:.55rem .65rem; border:1px solid #263b52; border-radius:.4rem; background:rgba(77,163,255,.055); }
.profile-popover-plan span { color:#69727c; font:.47rem var(--font-mono); text-transform:uppercase; }.profile-popover-plan b { color:#7dbaff; font-size:.6rem; }
.profile-popover > a,.profile-popover form button { display:flex; align-items:center; justify-content:space-between; width:100%; padding:.58rem .65rem; border:0; border-radius:.35rem; background:transparent; color:#a5abb1; font-size:.6rem; text-decoration:none; cursor:pointer; }
.profile-popover > a:hover,.profile-popover form button:hover { background:#15191e; color:#fff; }

.telemetry-stat { overflow:hidden; }
.telemetry-sparkline { position:absolute; right:.75rem; bottom:.55rem; width:6rem!important; height:2.15rem!important; opacity:.75; }
.telemetry-sparkline path { fill:none; stroke:#4da3ff; stroke-width:1.5; vector-effect:non-scaling-stroke; }
.telemetry-sparkline .spark-fill { fill:rgba(77,163,255,.08); stroke:none; }
.player-session-tools { display:flex; align-items:center; justify-content:space-between; gap:.8rem; padding:.65rem .8rem; border-bottom:1px solid var(--mission-border-soft); background:#090b0e; }
.player-session-tools label { display:flex; align-items:center; gap:.45rem; width:min(20rem,65%); height:2rem; padding:0 .6rem; border:1px solid #272d34; border-radius:.35rem; background:#0d1014; color:#59636e; }
.player-session-tools svg { width:.75rem; height:.75rem; }.player-session-tools input { width:100%; border:0; outline:0; background:transparent; color:#d7dadd; font-size:.57rem; }
.player-session-tools > span { color:#525a64; font:.48rem var(--font-mono); }
.connected-player-list { max-height:22rem; overflow:auto; scrollbar-color:#2d5279 #0a0c0f; scrollbar-width:thin; }
.connected-player[hidden] { display:none; }

.network-state { display:inline-flex; align-items:center; gap:.42rem; padding:.55rem .75rem; border:1px solid #284764; border-radius:999px; color:#7b8793; font:.5rem var(--font-mono); text-transform:uppercase; }.network-state i { width:.42rem; height:.42rem; border-radius:50%; background:#4da3ff; box-shadow:0 0 9px rgba(77,163,255,.75); }
.node-stat > div { position:relative; z-index:2; }.node-stat > div > span { display:flex; align-items:center; gap:.4rem; color:#69717b; font:.51rem var(--font-mono); letter-spacing:.1em; text-transform:uppercase; }.node-stat > div > span i { width:.37rem;height:.37rem;border-radius:50%;background:#4da3ff;box-shadow:0 0 8px rgba(77,163,255,.7); }
.node-stat strong { display:block; margin-top:.75rem; color:#edf0f2; font:500 1.72rem var(--font-mono); letter-spacing:-.05em; }.node-stat strong small { margin-left:.15rem;color:#5a6470;font-size:.76rem; }.node-stat p { margin-top:.2rem;color:#525a63;font-size:.52rem; }
.metric-sparkline { position:absolute; right:.65rem; bottom:.7rem; width:6.3rem!important; height:2.5rem!important; opacity:.72; }.metric-sparkline path { fill:none;stroke:#4da3ff;stroke-width:1.3;vector-effect:non-scaling-stroke;}.metric-sparkline .spark-area{fill:rgba(77,163,255,.08);stroke:none;}
.fleet-sync-body { padding:1.1rem;text-align:center; }.fleet-sync-route { display:flex;align-items:center;justify-content:center;gap:.65rem;margin:.25rem 0 .8rem; }.sync-endpoint { display:flex;align-items:center;justify-content:center;width:2.15rem;height:2.15rem;border:1px solid #376895;border-radius:.45rem;background:#102033;color:#80bcff;font:600 .65rem var(--font-mono);}.sync-endpoint.edge{border-radius:50%;}.fleet-sync-route>div{display:flex;align-items:center;gap:.22rem;width:5.2rem}.fleet-sync-route>div::before,.fleet-sync-route>div::after{height:1px;flex:1;background:#345d84;content:""}.fleet-sync-route>div i{width:.26rem;height:.26rem;border-radius:50%;background:#4da3ff;box-shadow:0 0 6px rgba(77,163,255,.8)}
.fleet-sync-body h3{color:#d9dde1;font-size:.72rem}.fleet-sync-body>p{max-width:16rem;margin:.35rem auto .8rem;color:#59616b;font-size:.55rem;line-height:1.55}.sync-summary{display:grid;grid-template-columns:1fr 1fr;margin-bottom:.85rem;border-block:1px solid #20262c}.sync-summary span{padding:.55rem;border-right:1px solid #20262c}.sync-summary span:last-child{border-right:0}.sync-summary small,.sync-summary b{display:block}.sync-summary small{color:#505862;font:.43rem var(--font-mono);text-transform:uppercase}.sync-summary b{margin-top:.18rem;color:#9ba3ab;font-size:.52rem}

.admin-metric-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;margin-bottom:.85rem;border:1px solid #22272d;border-radius:.65rem;background:#090b0e; }
.admin-metric { position:relative;min-height:9.4rem;overflow:hidden;padding:1rem;border-right:1px solid #20252b; }.admin-metric:last-child{border-right:0}.admin-metric.primary{background:linear-gradient(145deg,rgba(77,163,255,.09),transparent 66%)}
.admin-metric>span{display:flex;align-items:center;gap:.4rem;color:#69717a;font:.5rem var(--font-mono);letter-spacing:.1em;text-transform:uppercase}.admin-metric>span i{width:.38rem;height:.38rem;border-radius:50%;background:#4da3ff;box-shadow:0 0 8px rgba(77,163,255,.75)}.admin-metric strong{display:block;margin-top:.7rem;color:#eef0f2;font:500 1.65rem var(--font-mono);letter-spacing:-.06em}.admin-metric strong em{margin-left:.15rem;color:#58616c;font-size:.75rem;font-style:normal}.admin-metric small{display:block;margin-top:.18rem;color:#4f5760;font-size:.5rem}.admin-metric svg{position:absolute;right:.6rem;bottom:.5rem;width:6rem!important;height:2.4rem!important}.admin-metric svg path{fill:none;stroke:#4da3ff;stroke-width:1.25;vector-effect:non-scaling-stroke}.admin-metric svg .area{fill:rgba(77,163,255,.08);stroke:none}
.admin-insight-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(17rem,.65fr);gap:.85rem;margin-bottom:.85rem}.admin-chart{height:14rem;padding:1rem 1rem .6rem}.admin-chart>svg{width:100%!important;height:11.5rem!important}.admin-chart .grid{stroke:rgba(255,255,255,.055);stroke-width:1}.admin-chart .area{fill:url(#adminArea);stroke:none}.admin-chart .line{fill:none;stroke:#4da3ff;stroke-width:2;vector-effect:non-scaling-stroke}.admin-chart>div{display:flex;justify-content:space-between;color:#48515b;font:.44rem var(--font-mono)}.admin-health-list{padding:.7rem 1rem 1rem}.admin-health-list>div{display:grid;grid-template-columns:1fr auto;gap:.35rem;padding:.68rem 0}.admin-health-list span{color:#7b838c;font-size:.55rem}.admin-health-list b{color:#c8ccd0;font:500 .54rem var(--font-mono)}.admin-health-list i{position:relative;grid-column:1/-1;height:2px;background:#1b232c}.admin-health-list i::after{position:absolute;inset:0 auto 0 0;width:var(--health);background:#4da3ff;box-shadow:0 0 7px rgba(77,163,255,.4);content:""}
.admin-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.admin-setting-card{padding:1rem}.admin-setting-card .input{border-color:#292f36;background:#0c0f13}.admin-users-heading{display:flex;align-items:end;justify-content:space-between;margin:1.25rem 0 .6rem}.admin-users-heading h2{margin-top:.25rem;color:#e5e8ea;font-size:.9rem}.admin-users-heading>span{color:#59616b;font:.48rem var(--font-mono);text-transform:uppercase}.admin-users-panel{overflow-x:auto;overflow-y:hidden}.admin-users-panel .table-shell{min-width:62rem;border:0;border-radius:0;background:transparent}.admin-users-panel th:last-child,.admin-users-panel td:last-child{white-space:nowrap}.admin-users-panel td:nth-child(6){white-space:nowrap}

.coming-signal { position:absolute;top:50%;right:6%;width:17rem;height:17rem;transform:translateY(-50%);border:1px solid rgba(77,163,255,.16);border-radius:50%;background:radial-gradient(circle,rgba(77,163,255,.11),transparent 60%); }
.coming-signal::before,.coming-signal::after { position:absolute;inset:19%;border:1px solid rgba(77,163,255,.2);border-radius:50%;content:""}.coming-signal::after{inset:39%}.coming-signal span{position:absolute;top:50%;left:50%;width:.75rem;height:.75rem;transform:translate(-50%,-50%);border:2px solid #9bcaff;border-radius:50%;background:#4da3ff;box-shadow:0 0 22px rgba(77,163,255,.9)}.coming-signal span::before,.coming-signal span::after{position:absolute;top:50%;left:50%;background:rgba(77,163,255,.13);content:""}.coming-signal span::before{width:13rem;height:1px;transform:translate(-50%,-50%)}.coming-signal span::after{width:1px;height:13rem;transform:translate(-50%,-50%)}

@media(max-width:1100px){.admin-metric-grid{grid-template-columns:repeat(2,1fr)}.admin-metric:nth-child(2){border-right:0}.admin-metric:nth-child(-n+2){border-bottom:1px solid #20252b}.admin-insight-grid{grid-template-columns:1fr}}
@media(max-width:767px){.profile-menu{display:none}.admin-settings-grid,.admin-metric-grid{grid-template-columns:1fr}.admin-metric{border-right:0!important;border-bottom:1px solid #20252b}.admin-metric:last-child{border-bottom:0}.player-session-tools{align-items:flex-start;flex-direction:column}.player-session-tools label{width:100%}.coming-signal{right:-9rem;opacity:.35}}

/* Visual refinement: quiet surfaces, continuous data, and less card chrome. */
.mission-panel { border-color:#1d2228; border-radius:.72rem; box-shadow:none; background:#0a0c0f; }
.mission-panel:hover { box-shadow:none; }
.xera-brand { gap:.6rem; height:4.8rem!important; padding:0 .95rem!important; }
.mission-body #sidebar > .xera-brand > .xera-logo { display:block!important; width:3.25rem!important; height:2.25rem!important; object-fit:contain; flex:none; }
.xera-lockup > div { gap:.34rem; font-size:1rem!important; letter-spacing:.07em!important; font-weight:750; }
.xera-lockup small { margin-top:.18rem; font-size:.49rem; color:#59616b; }

.topbar-avatar { border-color:#333a42; background:#e9ecef; }
.profile-popover { width:19rem; padding:.7rem; border-color:#252b32; border-radius:.8rem; background:#0c0f13; box-shadow:0 24px 70px rgba(0,0,0,.62); }
.profile-popover-user { display:grid; grid-template-columns:2.45rem minmax(0,1fr) auto; gap:.72rem; padding:.7rem .65rem .85rem; }
.profile-popover-user > span { width:2.45rem; height:2.45rem; background:#151b22; color:#dce2e8; font-size:.72rem; }
.profile-popover-user b { font-size:.72rem; }.profile-popover-user small { font-size:.54rem; }
.profile-popover-user em { color:#72808d; font:.45rem var(--font-mono); font-style:normal; text-transform:uppercase; }
.profile-popover-plan { margin:0 0 .5rem; padding:.7rem .75rem; border:0; border-radius:.55rem; background:#13171c; }
.profile-popover-plan div span,.profile-popover-plan div small { display:block; }.profile-popover-plan div span { color:#d9dde1; font-size:.64rem; font-weight:600; text-transform:none; }.profile-popover-plan div small { margin-top:.14rem; color:#616a74; font-size:.49rem; }.profile-popover-plan>b { padding:.25rem .42rem; border-radius:999px; background:rgba(77,163,255,.1); color:#76b8ff; font:.44rem var(--font-mono); text-transform:uppercase; }
.profile-popover-links { padding:.2rem 0 .45rem; border-bottom:1px solid #20252b; }
.profile-popover-links a { display:grid; grid-template-columns:1.8rem 1fr auto; align-items:center; gap:.6rem; padding:.6rem .55rem; border-radius:.48rem; color:#8e969f; text-decoration:none; }
.profile-popover-links a:hover { background:#14181d; color:#fff; }.profile-popover-links a>svg { width:.9rem;height:.9rem;margin:auto; }.profile-popover-links a span b,.profile-popover-links a span small { display:block; }.profile-popover-links a span b { color:#cdd2d6;font-size:.59rem; }.profile-popover-links a span small { margin-top:.1rem;color:#59616b;font-size:.48rem; }.profile-popover-links a i { font-style:normal;color:#59616b; }
.profile-popover form button { margin-top:.35rem; padding:.62rem .55rem; color:#767f89; }.profile-popover form button svg { width:.8rem;height:.8rem; }

.simulation-switch { height:2.3rem; padding:.38rem .65rem; border-color:#252b31; border-radius:.55rem; background:#0c0f12; box-shadow:none; }
.simulation-switch:hover { border-color:#333b44; box-shadow:none; }.simulation-switch .switch-track { transform:scale(.84); }.simulation-switch b { font-size:.56rem; }.simulation-switch small { font-size:.43rem; color:#535b64; }
.simulation-active .simulation-switch { border-color:#33404c; background:#11161b; box-shadow:none; }
.stat-live-indicator,.stat-dot.online,.map-legend span,.network-state i,.security-state i,.connected-player>i,.coming-pill i { box-shadow:none!important; }
.telemetry-stat { min-height:9.2rem; }.telemetry-sparkline { right:.5rem; bottom:.3rem; width:7.2rem!important; height:2.5rem!important; opacity:.48; }

.registry-header { align-items:end; }.registry-header h2 { margin-top:.25rem; }.registry-header p { margin-top:.25rem;color:#555d66;font-size:.58rem; }.server-registry { gap:.8rem; }.registry-card { overflow:hidden; border:1px solid #1f252b; border-radius:.72rem; background:#0a0c0f; box-shadow:none; transition:background .15s,border-color .15s; }.registry-card:hover { border-color:#2c333b; background:#0c0f13; transform:none; box-shadow:none; }
.registry-top { padding:.9rem 1rem .55rem; }.server-glyph { border:0; background:#141a20; color:#8796a5; }.registry-status { border:0; background:transparent; }
.registry-summary { position:relative; display:grid; grid-template-columns:repeat(3,1fr); min-height:6.1rem; padding:.75rem 1rem 2.55rem; overflow:hidden; }
.registry-summary>div { position:relative;z-index:2; }.registry-summary strong,.registry-summary span { display:block; }.registry-summary strong { color:#e6e9ec;font:500 .88rem var(--font-mono); }.registry-summary span { margin-top:.18rem;color:#565e67;font:.45rem var(--font-mono);letter-spacing:.07em;text-transform:uppercase; }
.registry-summary svg { position:absolute;right:0;bottom:0;left:0;width:100%!important;height:3.25rem!important; }.registry-summary svg path { fill:none;stroke:#4d8ed2;stroke-width:1.35;vector-effect:non-scaling-stroke; }.registry-summary svg .server-area { fill:rgba(77,163,255,.07);stroke:none; }
.registry-locations { min-height:2.4rem;padding:.55rem 1rem;border-top:1px solid #1c2126;gap:.6rem; }.registry-locations span { border:0;background:transparent;padding:0;color:#69727b; }.registry-locations span i { box-shadow:none; }.registry-foot { padding:.65rem 1rem;border-top:1px solid #1c2126;background:#090b0e; }.simulation-card { border-color:#242c34; }.simulation-badge { color:#687784; }.clean-empty { border:1px dashed #282e35;border-radius:.72rem;background:#090b0d; }

.network-state { border:0;background:#11151a;color:#707983;box-shadow:none; }
.node-stat strong { font-size:1.85rem; }.node-stat p { color:#59616b; }.metric-sparkline { right:0; bottom:.7rem; width:52%!important;height:3rem!important;opacity:.5; }.metric-sparkline .spark-area { fill:rgba(77,163,255,.045); }
.nodes-workspace { grid-template-columns:minmax(0,1.25fr) minmax(21rem,.75fr); gap:.8rem; }.node-form { padding:1.1rem; }.fleet-sync-body { padding:1.2rem; }.fleet-sync-asset { display:grid;grid-template-columns:1fr 4.7rem 1fr;align-items:center;gap:.5rem;margin:.25rem 0 1.1rem; }.sync-source,.sync-destination { display:flex;align-items:center;gap:.5rem;color:#8a939d;font-size:.53rem; }.sync-source img { width:2.5rem;height:1.5rem;object-fit:contain; }.sync-destination svg { width:1.45rem!important;height:1.45rem!important;color:#7e8c99; }.sync-stream { display:flex;align-items:center;gap:.25rem; }.sync-stream::before,.sync-stream::after { height:1px;flex:1;background:#303944;content:""; }.sync-stream i { width:.2rem;height:.2rem;border-radius:50%;background:#66788a; }.fleet-sync-body h3 { color:#d4d8dc;font-size:.75rem; }.fleet-sync-body>p { color:#626a73; }.sync-summary { border-color:#20262c; }.fleet-panel { margin-top:.8rem; }.node-card { border-color:#1e242a; }.node-card-stats { border-color:#1e242a; }.node-card-stats div { border-color:#1e242a; }

.admin-overview { display:grid;grid-template-columns:minmax(0,1.45fr) minmax(18rem,.55fr);min-height:15rem;margin-bottom:.8rem;border:1px solid #1e242a;border-radius:.75rem;background:#090b0e;overflow:hidden; }
.admin-live-overview { position:relative;min-height:15rem;overflow:hidden;padding:1.25rem 1.4rem;border-right:1px solid #1e242a; }.live-caption { display:flex;align-items:center;gap:.45rem;color:#707983;font:.52rem var(--font-mono);letter-spacing:.11em;text-transform:uppercase; }.live-caption i { width:.4rem;height:.4rem;border-radius:50%;background:#4da3ff; }.admin-live-overview strong { display:block;margin-top:.55rem;color:#f0f2f4;font:500 2.7rem var(--font-mono);letter-spacing:-.08em; }.admin-live-overview p { margin-top:.1rem;color:#5c646d;font-size:.56rem; }.admin-live-overview>svg { position:absolute;right:0;bottom:0;left:0;width:100%!important;height:9rem!important; }.admin-live-overview .area { fill:url(#livePlayersArea);stroke:none; }.admin-live-overview .line { fill:none;stroke:#4d9bea;stroke-width:1.7;vector-effect:non-scaling-stroke; }.admin-live-range { position:absolute;right:1rem;bottom:.65rem;color:#53606c;font:.43rem var(--font-mono);text-transform:uppercase; }
.admin-overview-stats { display:grid;grid-template-rows:repeat(3,1fr); }.admin-overview-stats article { display:grid;grid-template-columns:1fr auto;align-items:center;padding:.75rem 1rem;border-bottom:1px solid #1e242a; }.admin-overview-stats article:last-child { border-bottom:0; }.admin-overview-stats span { color:#68717b;font:.49rem var(--font-mono);letter-spacing:.07em;text-transform:uppercase; }.admin-overview-stats strong { grid-row:1/3;grid-column:2;color:#e4e7e9;font:500 1.05rem var(--font-mono); }.admin-overview-stats strong em { margin-left:.12rem;color:#59616b;font-size:.58rem;font-style:normal; }.admin-overview-stats small { color:#505862;font-size:.48rem; }
.admin-insight-grid { gap:.8rem; }.admin-chart .line { stroke-width:1.6; }.admin-chart .area { opacity:.75; }.admin-settings-grid { gap:0;overflow:hidden;border:1px solid #1e242a;border-radius:.75rem;background:#0a0c0f; }.admin-setting-card { border:0;border-right:1px solid #1e242a;border-bottom:1px solid #1e242a;border-radius:0;background:transparent; }.admin-setting-card:nth-child(even){border-right:0}.admin-setting-card:nth-last-child(-n+2){border-bottom:0}.admin-setting-card h2 { font-size:.84rem!important;font-weight:580!important; }.admin-setting-card .input { border-color:#262c32;background:#0d1014; }.admin-setting-card .btn-primary { border-color:#344554;background:#182330;color:#9fc6ee;box-shadow:none; }.admin-setting-card .badge-online{border-color:#284b6e;background:rgba(77,163,255,.1);color:#79b8fa}.admin-users-panel { border-color:#1e242a; }.admin-brand-preview{display:flex;align-items:center;gap:.85rem;margin-bottom:1rem;padding:.9rem;border-radius:.55rem;background:#11151a}.admin-brand-preview img{display:block!important;width:4rem!important;height:2.1rem!important;object-fit:contain}.admin-brand-preview b,.admin-brand-preview span{display:block}.admin-brand-preview b{color:#d8dce0;font-size:.65rem}.admin-brand-preview span{margin-top:.18rem;color:#5d6670;font-size:.52rem}

.account-layout { display:grid;grid-template-columns:19rem minmax(0,1fr);gap:.85rem;align-items:start; }.account-summary,.account-section { border:1px solid #1e242a;border-radius:.75rem;background:#0a0c0f; }.account-summary { position:sticky;top:5rem;overflow:hidden; }.account-person { display:flex;align-items:center;gap:.85rem;padding:1.25rem; }.account-avatar { display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:50%;background:#171d24;color:#dce2e8;font:600 1rem var(--font-mono); }.account-person>div:last-child>span { color:#6c7580;font:.46rem var(--font-mono);letter-spacing:.1em;text-transform:uppercase; }.account-person h2 { margin-top:.22rem;color:#eef0f2;font-size:1.1rem; }.account-person p { margin-top:.16rem;color:#626a73;font-size:.56rem; }.account-plan { display:flex;align-items:center;justify-content:space-between;margin:0 .9rem;padding:.85rem;border-radius:.55rem;background:#12171d; }.account-plan span,.account-plan small,.account-plan strong { display:block; }.account-plan span { color:#5f6872;font:.45rem var(--font-mono);text-transform:uppercase; }.account-plan strong { margin-top:.22rem;color:#d9dde1;font-size:.72rem; }.account-plan small { margin-top:.12rem;color:#505862;font-size:.47rem; }.account-plan>b { padding:.25rem .4rem;border-radius:999px;background:#17293a;color:#79b7f8;font:.43rem var(--font-mono);text-transform:uppercase; }.account-usage { display:grid;grid-template-columns:repeat(3,1fr);margin-top:1rem;border-block:1px solid #1e242a; }.account-usage div { padding:.8rem .65rem;border-right:1px solid #1e242a; }.account-usage div:last-child { border-right:0; }.account-usage span,.account-usage strong { display:block; }.account-usage span { min-height:1.5rem;color:#565e68;font:.43rem var(--font-mono);text-transform:uppercase; }.account-usage strong { margin-top:.25rem;color:#dce0e3;font:500 .9rem var(--font-mono); }.account-member { display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;color:#5d6670;font-size:.5rem; }.account-member b { color:#858e98;font:500 .5rem var(--font-mono); }.account-signout { display:flex;align-items:center;justify-content:space-between;width:100%;padding:.75rem 1rem;border:0;border-top:1px solid #1e242a;background:transparent;color:#6f7882;font-size:.55rem;cursor:pointer; }.account-signout:hover { background:#0d1115;color:#d8dce0; }.account-settings { display:grid;gap:.85rem; }.account-section { overflow:hidden; }.account-section-heading { display:flex;align-items:flex-start;justify-content:space-between;padding:1.05rem 1.15rem;border-bottom:1px solid #1e242a; }.account-section-heading h2 { margin-top:.25rem;color:#e4e7e9;font-size:.88rem; }.account-section-heading p { margin-top:.25rem;color:#5d656e;font-size:.55rem; }.account-verified,.account-protected { color:#78a9d7;font:.46rem var(--font-mono);text-transform:uppercase; }.account-protected { display:flex;align-items:center;gap:.35rem; }.account-protected i { width:.35rem;height:.35rem;border-radius:50%;background:#4da3ff; }.account-form { display:grid;gap:.9rem;padding:1.1rem; }.account-form.two-column { grid-template-columns:1fr 1fr; }.account-field label,.account-field small { display:block; }.account-field label { margin-bottom:.35rem;color:#8a929b;font-size:.56rem;font-weight:600; }.account-field input,.account-field>div { width:100%;padding:.72rem .78rem;border:1px solid #262c33;border-radius:.45rem;outline:0;background:#0d1014;color:#d7dbe0;font-size:.62rem; }.account-field input:focus { border-color:#42586c; }.account-field small { margin-top:.28rem;color:#505862;font-size:.48rem; }.account-field.readonly>div { color:#7f8993; }.account-form-action { display:flex;justify-content:flex-end;grid-column:1/-1;padding-top:.25rem; }

.coming-page .control-header { margin-bottom:1rem; }.coming-pill { border:0;background:#11171d;box-shadow:none; }.coming-hero { display:grid;grid-template-columns:minmax(0,1fr) minmax(19rem,.8fr);gap:2rem;min-height:0;padding:2.1rem 2.3rem;background:#0a0c0f; }.coming-copy { align-self:center;max-width:35rem; }.coming-copy h2 { font-size:clamp(1.45rem,2.5vw,2.2rem); }.coming-signal { right:28%;width:12rem;height:12rem;opacity:.08;pointer-events:none; }.coming-feature-stack { position:relative;z-index:2;display:grid;gap:.45rem;align-self:center; }.coming-feature-stack .coming-feature { align-items:center;padding:.8rem;border-radius:.55rem;background:#11151a; }.coming-feature-stack .feature-icon { width:2rem;height:2rem;border:0;background:#171e26;color:#7f9dbb; }.coming-feature-stack .coming-feature p { margin-top:.18rem; }.coming-feature-grid { display:none; }

@media(max-width:1050px){.admin-overview{grid-template-columns:1fr}.admin-live-overview{border-right:0;border-bottom:1px solid #1e242a}.account-layout{grid-template-columns:1fr}.account-summary{position:static}.coming-hero{grid-template-columns:1fr}.nodes-workspace{grid-template-columns:1fr}}
@media(max-width:700px){.node-stat-grid{grid-template-columns:1fr 1fr;gap:1rem}.admin-overview-stats{grid-template-columns:1fr;grid-template-rows:none}.account-form.two-column{grid-template-columns:1fr}.coming-hero{padding:1.4rem}.xera-lockup>div{font-size:.9rem!important}}
@media(max-width:700px){.admin-settings-grid{grid-template-columns:1fr}.admin-setting-card{border-right:0!important;border-bottom:1px solid #1e242a!important}.admin-setting-card:last-child{border-bottom:0!important}}

/* Targeted layout corrections. */
.xera-brand { height:4.35rem!important;gap:.48rem;padding-inline:.8rem!important; }
.mission-body #sidebar > .xera-brand > .xera-logo { width:2.55rem!important;height:1.75rem!important; }
.xera-lockup > div { font-size:.91rem!important; }

.sync-stream { display:grid;grid-template-columns:1fr auto;align-items:center;gap:.15rem; }.sync-stream::before,.sync-stream::after { display:none; }.sync-stream span { height:1px;background:linear-gradient(90deg,#303842,#5d7185); }.sync-stream svg { width:.75rem!important;height:.75rem!important;color:#6f8397; }.sync-stream i { display:none; }

.admin-overview { display:block;min-height:20rem; }.admin-live-overview { min-height:20rem;border-right:0;padding:1.2rem 1.3rem; }.admin-live-overview>div:first-child { position:relative;z-index:2; }.admin-live-chart-wrap { position:absolute!important;inset:5rem .8rem .55rem!important;width:auto!important;height:auto!important; }.admin-live-chart-wrap canvas { width:100%!important;height:100%!important; }
.admin-insight-grid { grid-template-columns:minmax(0,1.5fr) minmax(21rem,.72fr); }.admin-chart { height:18rem;padding:1rem 1rem .65rem; }.admin-chart canvas { width:100%!important;height:100%!important; }
.admin-health-panel { display:flex;flex-direction:column; }.admin-command-metrics { display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #1e242a; }.admin-command-metrics div { padding:.85rem .75rem;border-right:1px solid #1e242a; }.admin-command-metrics div:last-child{border-right:0}.admin-command-metrics span,.admin-command-metrics b,.admin-command-metrics small{display:block}.admin-command-metrics span{color:#59626c;font:.44rem var(--font-mono);letter-spacing:.06em;text-transform:uppercase}.admin-command-metrics b{margin-top:.35rem;color:#dce0e4;font:500 .88rem var(--font-mono)}.admin-command-metrics small{margin-top:.14rem;color:#4d555e;font-size:.45rem}.admin-health-list{display:flex;flex:1;flex-direction:column;justify-content:center;padding:1rem}.admin-health-list>div{padding:.85rem 0}.admin-health-list i::after{box-shadow:none}

.account-layout { grid-template-columns:17.5rem minmax(0,1fr);gap:1.35rem; }.account-summary { overflow:visible;border:0;border-radius:0;background:transparent; }.account-person { padding:.2rem 0 1.35rem; }.account-avatar { width:3.1rem;height:3.1rem;background:#141a20; }.account-plan { margin:0;padding:.9rem 1rem;border:1px solid #1e242a;background:#0c0f13; }.account-usage { display:grid;grid-template-columns:1fr;margin:1rem 0 0;border:0;gap:.35rem; }.account-usage div { display:flex;align-items:center;justify-content:space-between;padding:.62rem .1rem;border:0; }.account-usage span { min-height:0;color:#626b75;font-size:.48rem; }.account-usage strong { margin:0;color:#dce0e4;font-size:.72rem; }.account-member { padding:.75rem .1rem;border-top:1px solid #1e242a; }.account-signout { margin-top:.2rem;padding:.7rem .1rem;border-top:0;color:#747e88; }.account-section { border-color:#1f252b; }

@media(max-width:1050px){.admin-insight-grid{grid-template-columns:1fr}.admin-live-chart-wrap{inset:5rem .5rem .5rem!important}}

/* Correct chart flow and compact operational panels. */
.admin-overview { min-height:0; }
.admin-live-overview { position:relative;display:grid;grid-template-rows:auto 16rem;min-height:0;padding:1.2rem 1.3rem .85rem; }
.admin-live-chart-wrap { position:relative!important;inset:auto!important;width:100%!important;height:16rem!important;margin-top:.65rem; }
.admin-live-chart-wrap canvas { display:block; }
.admin-insight-grid { align-items:start; }
.admin-chart { height:16.2rem; }
.admin-health-panel { min-height:0; }
.admin-health-list { display:grid;flex:none;grid-template-rows:repeat(4,auto);padding:.45rem 1rem .7rem; }
.admin-health-list>div { display:grid;grid-template-columns:1fr auto .5rem;align-items:center;gap:.6rem;padding:.72rem 0;border-bottom:1px solid #1d2329; }
.admin-health-list>div:last-child { border-bottom:0; }
.admin-health-list span { color:#707983;font-size:.53rem; }
.admin-health-list b { color:#c8cdd2;font:500 .52rem var(--font-mono); }
.admin-health-list i { position:static;grid-column:auto;width:.42rem;height:.42rem;border-radius:50%;background:#46515c; }
.admin-health-list i::after { display:none; }
.admin-health-list i.healthy { background:#4da3ff; }.admin-health-list i.limited { background:#8b7758; }.admin-health-list i.waiting { background:#505965; }

.nodes-workspace { align-items:start; }
.fleet-health { align-self:start; }
.fleet-sync-body { padding:1rem 1.1rem 1.05rem; }
.fleet-sync-asset { grid-template-columns:minmax(0,1fr) 3rem minmax(0,1fr);gap:.45rem;margin:.1rem 0 .85rem;padding:.7rem;border-radius:.55rem;background:#0d1115; }
.sync-source,.sync-destination { min-width:0;gap:.45rem; }
.sync-source>span,.sync-destination>span { min-width:0; }.sync-source b,.sync-source small,.sync-destination b,.sync-destination small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.sync-source b,.sync-destination b { color:#b8c0c8;font-size:.54rem;font-weight:600; }.sync-source small,.sync-destination small { margin-top:.12rem;color:#505a64;font-size:.43rem; }
.sync-source img { width:2.1rem;height:1.2rem; }.sync-destination svg { width:1.25rem!important;height:1.25rem!important; }
.sync-stream { grid-template-columns:1fr auto; }.sync-stream span { background:#41505f; }.sync-stream svg { color:#75899d; }
.fleet-sync-body h3 { font-size:.68rem; }.fleet-sync-body>p { margin-bottom:.65rem; }.sync-summary { margin-bottom:.7rem; }

@media(max-width:1050px){.admin-live-overview{grid-template-rows:auto 14rem}.admin-live-chart-wrap{height:14rem!important}.admin-chart{height:14.5rem}}

/* Centered relay route and useful command readiness summary. */
.fleet-sync-asset { grid-template-columns:minmax(0,1fr) 3.5rem minmax(0,1fr); }
.sync-stream { position:relative;display:block;height:2rem; }
.sync-stream span { position:absolute;top:50%;right:.35rem;left:.35rem;height:1px;transform:translateY(-50%);background:#536272; }
.sync-stream span::after { position:absolute;top:50%;right:-.05rem;width:.42rem;height:.42rem;transform:translateY(-50%) rotate(45deg);border-top:1px solid #7e91a3;border-right:1px solid #7e91a3;content:""; }
.sync-source { justify-content:flex-start; }.sync-destination { justify-content:flex-end; }

.admin-insight-grid { align-items:stretch; }
.admin-health-panel { height:100%; }
.command-mode { padding:.3rem .5rem;border-radius:999px;background:#141a20;color:#8794a0;font:.44rem var(--font-mono);letter-spacing:.08em;text-transform:uppercase; }
.command-health-body { display:grid;grid-template-rows:auto auto 1fr;flex:1; }
.command-health-lead { display:flex;align-items:center;gap:.75rem;padding:1rem;border-bottom:1px solid #1e242a; }
.command-health-lead>span { display:flex;flex:none;align-items:center;justify-content:center;width:2.35rem;height:2.35rem;border-radius:.55rem;background:#141a20;color:#7690a9; }
.command-health-lead>span svg { width:1.1rem!important;height:1.1rem!important; }
.command-health-lead h3 { color:#dce0e3;font-size:.68rem;font-weight:600; }.command-health-lead p { margin-top:.22rem;color:#5c6570;font-size:.49rem;line-height:1.45; }
.command-health-facts { display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #1e242a; }
.command-health-facts div { padding:.75rem;border-right:1px solid #1e242a; }.command-health-facts div:last-child{border-right:0}.command-health-facts span,.command-health-facts b{display:block}.command-health-facts span{color:#58616b;font:.43rem var(--font-mono);letter-spacing:.06em;text-transform:uppercase}.command-health-facts b{margin-top:.3rem;color:#d7dce0;font:500 .82rem var(--font-mono)}
.command-health-policy { display:grid;align-content:center;padding:.45rem 1rem; }
.command-health-policy div { display:flex;align-items:center;justify-content:space-between;padding:.55rem 0;border-bottom:1px solid #1d2329; }.command-health-policy div:last-child{border-bottom:0}.command-health-policy span{color:#69727b;font-size:.51rem}.command-health-policy b{color:#bfc5ca;font:500 .5rem var(--font-mono)}

/* Larger dashboard typography. */
.mission-dashboard .eyebrow { font-size:.72rem; }
.mission-header > div:first-child > p { font-size:.95rem; }
.stat-label { font-size:.7rem; }
.stat-foot { font-size:.78rem; }
.trend-up { font-size:.66rem; }
.panel-heading h2,
.registry-header h2 { font-size:1.08rem; }
.panel-count { font-size:.68rem; }
.location-rank { font-size:.68rem; }
.location-identity b { font-size:.84rem; }
.location-identity small { font-size:.62rem; }
.location-load > span { font-size:.64rem; }
.location-load > span b { font-size:.86rem; }
.country-mark { font-size:1.05rem; }
.connected-player b { font-size:.82rem; }
.connected-player small { font-size:.62rem; }
.attack-clear b,.attack-event b { font-size:.84rem; }
.attack-clear small,.attack-event small { font-size:.64rem; }
.registry-title a { font-size:.9rem; }
.registry-title > span { font-size:.62rem; }
.registry-status { font-size:.6rem; }
.registry-summary strong { font-size:1.05rem; }
.registry-summary span { font-size:.58rem; }
.registry-locations span { font-size:.68rem; }
.registry-foot { font-size:.6rem; }
.registry-actions button { font-size:.68rem; }
.registry-foot a { font-size:.62rem; }
.registry-empty p { font-size:.84rem; }
.player-session-tools input { font-size:.68rem; }
.globe-hint { font-size:.56rem; }

/* Scale up the whole mission-control interface (all rem sizes inherit this). */
html:has(.mission-body) { font-size: 18px; }

/* Production polish: shared interaction, depth, and responsive behavior. */
.mission-body {
  --ui-ring: rgba(107, 178, 255, .42);
  --ui-shadow: 0 18px 55px rgba(0, 0, 0, .22);
  overflow-x: hidden;
}

.mission-body main,
.mission-body main > div,
.mission-dashboard,
.control-page { min-width: 0; }

.mission-body :where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid var(--ui-ring);
  outline-offset: 3px;
}

.mission-panel {
  border-color: #20262c;
  background:
    linear-gradient(145deg, rgba(255,255,255,.012), transparent 34%),
    #090b0e;
  box-shadow: 0 1px 0 rgba(255,255,255,.018) inset, var(--ui-shadow);
}

.panel-heading {
  min-height: 4.15rem;
  background: linear-gradient(180deg, rgba(255,255,255,.014), transparent);
}

.input {
  min-height: 2.55rem;
  border-color: #29313a;
  background-color: #0b0e12;
  box-shadow: 0 1px 0 rgba(255,255,255,.015) inset;
}

.input:hover { border-color: #3b4652; }
.input:focus { border-color: #5684af; box-shadow: 0 0 0 3px rgba(77,163,255,.1); }
.input:invalid:not(:placeholder-shown) { border-color: #76505a; }

.blue-button,
.quiet-button,
.btn {
  min-height: 2.45rem;
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease;
}

.blue-button { box-shadow: 0 7px 22px rgba(77,163,255,.14), 0 1px 0 rgba(255,255,255,.3) inset; }
.blue-button:active,
.quiet-button:active,
.btn:active { transform: translateY(1px); }
.blue-button:disabled,
.btn:disabled {
  border-color: #27303a;
  background: #151a20;
  box-shadow: none;
  color: #56616d;
  cursor: not-allowed;
  transform: none;
}

.network-state {
  border: 1px solid #29323b;
  border-radius: 999px;
  background: #0c1014;
  color: #7f8994;
}
.network-state.is-live { border-color: #294d73; background: rgba(77,163,255,.065); color: #90c5fa; }
.network-state.is-live i { background: #4da3ff; box-shadow: 0 0 10px rgba(77,163,255,.7); }
.network-state.is-standby i { background: #68727d; box-shadow: none; }

.node-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
  overflow: visible;
  margin-bottom: .85rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.node-stat,
.node-stat.primary {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 9rem;
  overflow: hidden;
  padding: 1rem 1.05rem;
  border: 1px solid #20272e;
  border-radius: .68rem;
  background: linear-gradient(145deg, rgba(255,255,255,.015), transparent 56%), #0a0d10;
  box-shadow: 0 12px 38px rgba(0,0,0,.12);
}
.node-stat.primary { border-color: #294d72; background: linear-gradient(145deg, rgba(77,163,255,.09), transparent 62%), #0a0d10; }
.node-stat > div { position: relative; z-index: 1; }
.node-stat .metric-sparkline { right: .75rem; bottom: .75rem; width: 48%!important; }

.nodes-workspace { gap: .85rem; margin-top: 0; }
.node-form { gap: 1rem; padding: 1.2rem; }
.node-field { min-width: 0; }
.node-field small {
  display: block;
  min-height: 1.05rem;
  margin-top: .36rem;
  color: #4f5964;
  font-size: .5rem;
  line-height: 1.45;
}
.node-form .node-submit { min-width: 10.5rem; justify-self: start; }

.fleet-sync-body { min-height: calc(100% - 4.15rem); }
.sync-summary { border-radius: .42rem; background: #0c1014; }
.fleet-panel { margin-top: .85rem; }
.node-card {
  position: relative;
  background: rgba(9,11,14,.72);
  transition: background-color .16s ease, box-shadow .16s ease;
}
.node-card:hover { z-index: 1; background: #0d1115; box-shadow: 0 15px 42px rgba(0,0,0,.2); }
.node-card-head { min-height: 4.6rem; padding: .9rem 1rem; }
.node-card-head a { font-size: .78rem; }
.node-card-head a::after { position: absolute; inset: 0; content: ""; }
.node-card-head .registry-status,
.node-card-foot { position: relative; z-index: 1; }
.node-card-foot { padding: .72rem 1rem; }
.node-card-foot a,
.node-card-foot button { padding: .25rem 0; }
.node-card-foot a:hover { color: #b7dbff; }
.node-card-foot button:hover { color: #d48691; }

.fleet-empty { min-height: 16rem; display: grid; place-content: center; }
.fleet-empty .feature-icon { box-shadow: 0 0 35px rgba(77,163,255,.08); }

.htmx-request { cursor: progress; }
.htmx-request button { pointer-events: none; opacity: .65; }
#nodes-live.htmx-request { opacity: .72; transition: opacity .16s ease; }

@media (max-width: 1100px) {
  .node-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nodes-workspace { grid-template-columns: 1fr; }
  .fleet-sync-body { min-height: 0; }
}

@media (max-width: 1200px) {
  .mission-header { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .mission-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    gap: .55rem;
  }
  .mission-actions .simulation-switch { grid-column: 1 / -1; width: 100%; margin-right: 0; }
  .mission-actions .refresh-button,
  .mission-actions .launch-button { width: 100%; }
}

@media (max-width: 1050px) {
  .account-layout { grid-template-columns: minmax(0, 1fr); }
  .account-summary { position: static; top: auto; }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .mission-body #sidebar { width: 14rem; }
  .mission-topbar { left: 14rem; }
  .mission-body main {
    width: calc(100% - 14rem);
    margin-left: 14rem;
  }
}

@media (max-width: 900px) {
  .control-header { align-items: flex-start; flex-direction: column; gap: .9rem; }
}

@media (max-width: 767px) {
  html:has(.mission-body) { font-size: 16px; }
  .mission-body main { width: 100%; min-width: 0; }
  .control-header { align-items: flex-start; flex-direction: column; gap: .9rem; }
  .control-header .network-state { align-self: flex-start; }
  .node-stat-grid { grid-template-columns: 1fr 1fr; gap: .65rem; }
  .node-stat,
  .node-stat.primary { min-height: 7.8rem; padding: .85rem; }
  .node-form { grid-template-columns: 1fr; }
  .node-form .node-submit { width: 100%; }
  .node-card-grid { grid-template-columns: 1fr; }
  .node-card { border-right: 0; }
}

@media (max-width: 520px) {
  .mission-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    gap: .55rem;
  }
  .mission-actions .simulation-switch {
    grid-column: 1 / -1;
    width: 100%;
    margin-right: 0;
  }
  .mission-actions .refresh-button,
  .mission-actions .launch-button { width: 100%; padding-inline: .65rem; }
}

@media (max-width: 480px) {
  .node-stat-grid { grid-template-columns: 1fr; }
  .node-stat,
  .node-stat.primary { min-height: 7rem; }
  .node-card-head { grid-template-columns: 2rem minmax(0,1fr); }
  .node-card-head .registry-status { grid-column: 2; justify-self: start; }
}

@media (prefers-reduced-motion: reduce) {
  .node-card,
  .blue-button,
  .quiet-button,
  .btn { transition: none; }
}

/* Server detail — purpose-built components replace the retired utility UI. */
.server-detail-page {
  display: grid;
  width: 100%;
  max-width: 78rem;
  margin: 0 auto;
  gap: .9rem;
}

.server-detail-back { margin-bottom: -.15rem; }
.server-detail-back a {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  color: #78838f;
  font-size: .68rem;
  transition: color .16s ease;
}
.server-detail-back a:hover { color: #c9d9e8; }

.server-hero,
.server-chart-panel,
.server-team-panel,
.server-location-card {
  overflow: hidden;
  border: 1px solid #202832;
  border-radius: .78rem;
  background: linear-gradient(145deg, rgba(255,255,255,.018), transparent 40%), #0a0e12;
  box-shadow: 0 18px 50px rgba(0,0,0,.16), inset 0 1px rgba(255,255,255,.018);
}

.server-hero-head {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: .85rem;
  min-height: 5rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid #202832;
  background: linear-gradient(110deg, rgba(77,163,255,.07), transparent 38%), #0c1116;
}
.server-hero-icon {
  display: grid;
  width: 2.8rem;
  height: 2.8rem;
  place-items: center;
  border: 1px solid #2d5d87;
  border-radius: .62rem;
  background: #102235;
  color: #62adf8;
  box-shadow: inset 0 0 18px rgba(77,163,255,.08);
}
.server-hero-icon svg { width: 1.35rem; height: 1.35rem; }
.server-hero-identity { min-width: 0; }
.server-hero-identity > div { display: flex; align-items: center; gap: .55rem; }
.server-hero-identity h1 {
  overflow: hidden;
  color: #edf1f4;
  font-size: 1.25rem;
  font-weight: 620;
  letter-spacing: -.035em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.server-hero-identity p { margin-top: .16rem; color: #626d78; font-size: .62rem; }
.server-actions { display: flex; align-items: center; gap: .45rem; }
.server-actions .btn { min-height: 2.25rem; padding: .4rem .75rem; font-size: .66rem; }

.server-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  background: #202832;
  gap: 1px;
}
.server-meta-item { min-width: 0; min-height: 5rem; padding: .9rem 1rem; background: #0a0e12; }
.server-meta-label,
.server-kpi-label {
  display: flex;
  align-items: center;
  gap: .38rem;
  color: #596675;
  font: 600 .48rem var(--font-mono);
  letter-spacing: .1em;
  text-transform: uppercase;
}
.server-meta-label svg,
.server-kpi-label svg { width: .76rem; height: .76rem; flex: none; }
.server-meta-value {
  margin-top: .48rem;
  overflow: hidden;
  color: #cbd2d8;
  font-size: .68rem;
  line-height: 1.45;
  text-overflow: ellipsis;
}
.server-meta-value.mono { color: #abb7c2; font-family: var(--font-mono); font-size: .63rem; }

.server-kpi-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .7rem; }
.server-kpi {
  position: relative;
  min-width: 0;
  min-height: 6.15rem;
  padding: 1rem 1.05rem;
  overflow: hidden;
  border: 1px solid #202832;
  border-radius: .7rem;
  background: linear-gradient(145deg, rgba(255,255,255,.016), transparent 55%), #0a0e12;
}
.server-kpi::after {
  position: absolute;
  right: -1.4rem;
  bottom: -2.8rem;
  width: 7rem;
  height: 7rem;
  border: 1px solid rgba(255,255,255,.025);
  border-radius: 50%;
  content: "";
}
.server-kpi-primary { border-color: #294766; background: linear-gradient(145deg, rgba(77,163,255,.075), transparent 62%), #0a0e12; }
.server-kpi-value { position: relative; z-index: 1; display: flex; align-items: baseline; gap: .55rem; margin-top: .65rem; }
.server-kpi-value strong { color: #edf1f4; font: 560 1.7rem var(--font-mono); letter-spacing: -.05em; }
.server-kpi-value > span:not(.badge) { color: #58636f; font-size: .57rem; }

.server-chart-panel { min-height: 20rem; }
.server-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4rem;
  padding: .75rem 1rem;
  border-bottom: 1px solid #202832;
  background: #0c1015;
}
.server-section-head > div > span { color: #4d6d8c; font: .45rem var(--font-mono); letter-spacing: .12em; text-transform: uppercase; }
.server-section-head h2 { margin-top: .18rem; color: #dce2e7; font-size: .82rem; font-weight: 580; letter-spacing: -.015em; }
.server-section-head h2 b {
  display: inline-flex;
  margin-left: .35rem;
  padding: .08rem .34rem;
  border: 1px solid #29323b;
  border-radius: 999px;
  color: #77838e;
  font: 500 .48rem var(--font-mono);
  vertical-align: .1rem;
}
.server-section-head small { color: #505b66; font: .46rem var(--font-mono); text-transform: uppercase; }
.server-section-head-static { padding-inline: .15rem; border: 0; background: transparent; }
.server-range-select { width: auto; min-width: 10.5rem; max-width: 13rem; min-height: 2.2rem; font-size: .62rem; }
.server-chart-body { min-height: 15rem; padding: .85rem 1rem 1rem; }
.server-chart-body canvas { display: block; width: 100%; height: 220px; }
.server-chart-empty {
  display: flex;
  min-height: 13.5rem;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.server-chart-empty.hidden { display: none; }
.server-chart-empty > span {
  display: grid;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: .65rem;
  place-items: center;
  border: 1px solid #28333e;
  border-radius: .65rem;
  background: #0d1319;
  color: #55718c;
}
.server-chart-empty svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.5; }
.server-chart-empty strong { color: #aeb7bf; font-size: .68rem; font-weight: 560; }
.server-chart-empty p { max-width: 22rem; margin-top: .25rem; color: #505a64; font-size: .56rem; line-height: 1.55; }

.server-team-section,
.server-location-section { display: grid; gap: .35rem; margin-top: .25rem; }
.server-team-panel { padding: 1rem; }
.server-team-panel > p { color: #69737d; font-size: .62rem; line-height: 1.55; }

.server-location-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem,1fr)); gap: .7rem; }
.server-location-card { min-height: 10rem; transition: border-color .16s ease, background-color .16s ease; }
.server-location-card.is-online { border-color: #234139; }
.server-location-card:hover { border-color: #31506d; }
.server-location-head {
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .7rem .9rem;
  border-bottom: 1px solid #202832;
  background: #0c1116;
}
.server-location-head h3 { display: flex; min-width: 0; align-items: center; gap: .5rem; color: #dce2e7; font-size: .72rem; font-weight: 580; }
.server-location-head h3 > span { font-size: 1rem; }
.server-location-body { display: grid; grid-template-columns: 8.5rem minmax(0,1fr); min-height: 6.6rem; }
.server-location-count { display: flex; align-items: center; justify-content: center; flex-direction: column; border-right: 1px solid #202832; background: rgba(255,255,255,.008); }
.server-location-count strong { color: #edf1f4; font: 560 1.6rem var(--font-mono); }
.server-location-count span { margin-top: .15rem; color: #56616c; font-size: .53rem; }
.server-location-players { min-width: 0; padding: .85rem .95rem; }
.server-location-players > div:first-child {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin-bottom: .6rem;
  color: #596675;
  font: 600 .46rem var(--font-mono);
  letter-spacing: .09em;
  text-transform: uppercase;
}
.server-location-players svg { width: .7rem; height: .7rem; flex: none; }
.server-location-players > span { color: #56616c; font-size: .56rem; }

@media (max-width: 1050px) {
  .server-meta-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 767px) {
  .server-detail-page { gap: .7rem; }
  .server-hero-head { grid-template-columns: auto minmax(0,1fr); }
  .server-actions { grid-column: 1 / -1; width: 100%; }
  .server-actions .btn,
  .server-actions form { flex: 1; }
  .server-actions form .btn { width: 100%; }
  .server-meta-grid,
  .server-kpi-grid { grid-template-columns: 1fr; }
  .server-meta-item { min-height: 4.4rem; }
  .server-kpi { min-height: 5.5rem; }
  .server-section-head { align-items: flex-start; flex-direction: column; }
  .server-section-head-static { flex-direction: row; align-items: center; }
  .server-range-select { width: 100%; max-width: none; }
  .server-location-grid { grid-template-columns: 1fr; }
  .server-location-body { grid-template-columns: 6.5rem minmax(0,1fr); }
}

@media (max-width: 470px) {
  .server-meta-grid { grid-template-columns: 1fr; }
  .server-location-body { grid-template-columns: 1fr; }
  .server-location-count { min-height: 5rem; border-right: 0; border-bottom: 1px solid #202832; }
}

/* Status — restrained service-health layout inspired by established status pages. */
.nav-live { color: #78838e; letter-spacing: 0; text-transform: none; }
.nav-live i { width: .28rem; height: .28rem; background: #4ea77b; box-shadow: none; }

.status-basic-page { width: 100%; max-width: 76rem; margin: 0 auto; }
.status-basic-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.4rem;
}
.status-basic-header h1 { color: #eef1f3; font-size: 1.65rem; font-weight: 610; letter-spacing: -.04em; }
.status-basic-header p { margin-top: .35rem; color: #6f7882; font-size: .67rem; }
.status-basic-header > span { color: #58616b; font: .5rem var(--font-mono); }

.status-basic-summary {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: .85rem;
  min-height: 5.4rem;
  padding: 1rem 1.1rem 1rem 1.3rem;
  overflow: hidden;
  border: 1px solid #273139;
  border-radius: .42rem;
  background: #0b0f13;
}
.status-basic-summary::before { position: absolute; inset: 0 auto 0 0; width: 3px; background: #4ea77b; content: ""; }
.status-basic-summary.is-degraded::before { background: #c89a43; }
.status-basic-summary.is-offline::before { background: #cf6370; }
.status-basic-summary.is-empty::before { background: #69737d; }
.status-basic-indicator { width: .62rem; height: .62rem; border-radius: 50%; background: #4ea77b; }
.status-basic-summary.is-degraded .status-basic-indicator { background: #c89a43; }
.status-basic-summary.is-offline .status-basic-indicator { background: #cf6370; }
.status-basic-summary.is-empty .status-basic-indicator { background: #69737d; }
.status-basic-summary h2 { color: #e1e5e8; font-size: .86rem; font-weight: 590; }
.status-basic-summary p { margin-top: .2rem; color: #69727c; font-size: .58rem; }
.status-basic-totals { display: flex; align-items: center; gap: .85rem; }
.status-basic-totals span { color: #606a74; font-size: .52rem; white-space: nowrap; }
.status-basic-totals b { color: #aeb6bd; font: 500 .6rem var(--font-mono); }

.status-basic-components {
  margin-top: 1rem;
  overflow: hidden;
  border: 1px solid #242c33;
  border-radius: .42rem;
  background: #090c0f;
}
.status-basic-section-head {
  display: flex;
  min-height: 4.6rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid #242c33;
}
.status-basic-section-head h2 { color: #dce1e4; font-size: .78rem; font-weight: 580; }
.status-basic-section-head p { margin-top: .22rem; color: #606a73; font-size: .55rem; }
.status-basic-section-head > span { color: #626b74; font: .5rem var(--font-mono); }
.status-basic-table-head,
.status-basic-row {
  display: grid;
  grid-template-columns: minmax(11rem,1.5fr) 7.5rem 7.25rem 6rem 5rem 6.25rem;
  align-items: center;
  column-gap: .6rem;
}
.status-basic-table-head {
  min-height: 2.35rem;
  padding: 0 1rem;
  border-bottom: 1px solid #20272d;
  background: #0c1013;
  color: #505a63;
  font: .44rem var(--font-mono);
  letter-spacing: .055em;
  text-transform: uppercase;
}
.status-basic-row { min-height: 4.7rem; padding: .7rem 1rem; border-bottom: 1px solid #20272d; }
.status-basic-row:last-child { border-bottom: 0; }
.status-basic-row:hover { background: #0c1013; }
.status-basic-identity { display: flex; min-width: 0; align-items: center; gap: .65rem; }
.status-basic-identity > span { flex: none; font-size: 1rem; }
.status-basic-identity h3 { overflow: hidden; color: #d7dce0; font-size: .67rem; font-weight: 570; text-overflow: ellipsis; white-space: nowrap; }
.status-basic-identity p { margin-top: .13rem; color: #5f6871; font-size: .52rem; }
.status-basic-state { display: inline-flex; align-items: center; gap: .4rem; color: #65ae87; font-size: .55rem; font-weight: 550; }
.status-basic-state i { width: .38rem; height: .38rem; border-radius: 50%; background: currentColor; }
.status-basic-row.is-degraded .status-basic-state { color: #caa251; }
.status-basic-row.is-offline .status-basic-state { color: #d3717d; }
.status-basic-value { min-width: 0; }
.status-basic-value small { display: none; color: #515a63; font: .42rem var(--font-mono); text-transform: uppercase; }
.status-basic-value b { display: block; overflow: hidden; color: #a7afb6; font: 500 .55rem var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
.status-basic-empty { display: grid; min-height: 12rem; place-content: center; padding: 2rem; text-align: center; }
.status-basic-empty h3 { color: #b9c0c5; font-size: .72rem; font-weight: 560; }
.status-basic-empty p { margin-top: .3rem; color: #59626b; font-size: .55rem; }

@media (max-width: 1200px) {
  .status-basic-table-head { display: none; }
  .status-basic-row { grid-template-columns: repeat(4,minmax(0,1fr)); row-gap: .8rem; padding-block: .9rem; }
  .status-basic-identity { grid-column: 1 / 4; }
  .status-basic-state { grid-column: 4; justify-self: end; }
  .status-basic-value { padding-top: .65rem; border-top: 1px solid #20272d; }
  .status-basic-value small { display: block; margin-bottom: .25rem; }
}

@media (max-width: 700px) {
  .status-basic-header { align-items: flex-start; flex-direction: column; margin-bottom: 1rem; }
  .status-basic-summary { grid-template-columns: auto minmax(0,1fr); }
  .status-basic-totals { grid-column: 1 / -1; padding-top: .7rem; border-top: 1px solid #242c33; }
  .status-basic-row { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .status-basic-identity { grid-column: 1; }
  .status-basic-state { grid-column: 2; }
  .status-basic-section-head { align-items: flex-start; }
}

@media (max-width: 440px) {
  .status-basic-totals { align-items: flex-start; flex-direction: column; gap: .3rem; }
  .status-basic-row { grid-template-columns: 1fr; }
  .status-basic-identity,
  .status-basic-state { grid-column: 1; justify-self: start; }
}

/* Admin-managed fallback appearance distributed to network nodes. */
.node-appearance-preview {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-bottom: 1rem;
  padding: .75rem;
  border: 1px solid #252d35;
  border-radius: .5rem;
  background: #0c1014;
}
.node-appearance-preview img {
  display: block;
  width: 3rem;
  height: 3rem;
  flex: none;
  border-radius: .35rem;
  background: #07090b;
  image-rendering: pixelated;
  object-fit: contain;
}
.node-appearance-preview b,
.node-appearance-preview span { display: block; }
.node-appearance-preview b { color: #d5dadd; font-size: .66rem; font-weight: 570; }
.node-appearance-preview span { margin-top: .18rem; color: #5e6872; font-size: .52rem; line-height: 1.4; }
.node-motd-input { min-height: 4.8rem; resize: vertical; line-height: 1.55; }
.node-icon-reset { display: flex; align-items: center; gap: .5rem; color: #78828c; font-size: .58rem; }

/* Edition selector (Add Server modal). Segmented control in the modal's own
   language: square corners, .btn typography, solid-brand active tab like
   .btn-primary, ghost-like inactive tabs. Driven purely by aria-selected so
   the template script only flips state, never classes. */
.edition-tabs { display: flex; gap: 0; padding: .25rem; border: 1px solid #2c2f34; border-radius: 0; background: #060708; }
.edition-tab { flex: 1; display: flex; align-items: center; justify-content: center; padding: .55rem .5rem; border: 1px solid transparent; border-radius: 0; background: transparent; color: var(--text-2); font-size: .85rem; font-weight: 600; line-height: 1.25rem; white-space: nowrap; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease; }
.edition-tab:hover { background: var(--surface-2); color: var(--text); }
.edition-tab:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.edition-tab[aria-selected="true"] { background: var(--brand); color: #04100b; box-shadow: 0 1px 0 color-mix(in oklab, #fff 22%, transparent) inset, 0 3px 10px -4px color-mix(in oklab, var(--brand) 55%, transparent); }
.edition-tab[aria-selected="true"]:hover { background: color-mix(in oklab, var(--brand) 88%, #fff 12%); color: #04100b; }
.server-type-options { display: grid; gap: .75rem; }
.server-type-option { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 1rem 1.1rem; border: 1px solid var(--border); background: var(--surface-1); color: var(--text); text-align: left; font-size: .9rem; cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.server-type-option span { color: var(--text-3); font-size: .75rem; }
.server-type-option:hover, .server-type-option:focus-visible { border-color: var(--brand); background: var(--surface-2); outline: none; }
.server-type-option.is-disabled { color: var(--text-3); cursor: not-allowed; opacity: .65; }
.server-type-option.is-disabled:hover { border-color: var(--border); background: var(--surface-1); }

/* Server detail refinement — quieter hierarchy, denser data, and a proper
   settings dialog. Keep this deliberately restrained: no decorative glow,
   oversized icon tiles, or nested-card treatment for ordinary form fields. */
.server-detail-page {
  max-width: 76rem;
  gap: 1rem;
}

.server-detail-toolbar {
  display: flex;
  min-height: 2rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: #56616c;
}
.server-detail-toolbar > span {
  font: .46rem var(--font-mono);
  letter-spacing: .03em;
}
.server-detail-back {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: 2rem;
  margin: 0;
  color: #78838e;
  font-size: .62rem;
  text-decoration: none;
  transition: color .15s ease;
}
.server-detail-back:hover { color: #d8dde1; }
.server-detail-back svg {
  width: .78rem;
  height: .78rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.server-detail-page .server-hero,
.server-detail-page .server-chart-panel,
.server-detail-page .server-team-panel,
.server-detail-page .server-location-card {
  border-color: #20272e;
  border-radius: .58rem;
  background: #090c0f;
  box-shadow: none;
}

.server-detail-page .server-hero-head {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 0;
  gap: 1.25rem;
  padding: 1.15rem 1.2rem;
  border-bottom-color: #20272e;
  background: #0b0f13;
}
.server-hero-title-row {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
  gap: .48rem;
}
.server-detail-page .server-hero-identity > div { gap: .48rem; }
.server-detail-page .server-hero-identity h1 {
  margin-right: .15rem;
  color: #eef1f3;
  font-size: 1.38rem;
  font-weight: 610;
  letter-spacing: -.04em;
}
.server-detail-page .server-hero-identity p {
  margin-top: .28rem;
  overflow: hidden;
  color: #68727c;
  font-size: .58rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.server-edition-pill,
.server-state {
  display: inline-flex;
  align-items: center;
  gap: .34rem;
  min-height: 1.4rem;
  padding: .2rem .48rem;
  border: 1px solid #29313a;
  border-radius: 999px;
  background: #101419;
  color: #89939d;
  font: 550 .47rem var(--font-mono);
  letter-spacing: .03em;
}
.server-state { border-color: transparent; background: transparent; padding-inline: .25rem; color: #69737d; }
.server-state i { width: .34rem; height: .34rem; border-radius: 50%; background: #65707a; }
.server-state-live { color: #75ad91; }
.server-state-live i { background: #5da27d; }

.server-detail-page .server-actions { gap: .5rem; }
.server-detail-page .server-actions .btn {
  min-height: 2.25rem;
  gap: .4rem;
  padding: .42rem .72rem;
  border-radius: .42rem;
  font-size: .6rem;
}
.server-detail-page .server-actions .btn svg {
  width: .78rem;
  height: .78rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.server-detail-page .server-meta-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  background: transparent;
}
.server-detail-page .server-meta-item {
  min-height: 4.55rem;
  padding: .82rem 1rem;
  border-right: 1px solid #20272e;
  background: transparent;
}
.server-detail-page .server-meta-item:last-child { border-right: 0; }
.server-detail-page .server-meta-label,
.server-detail-page .server-kpi-label {
  color: #5d6873;
  font-size: .45rem;
  letter-spacing: .075em;
}
.server-detail-page .server-meta-value {
  margin-top: .4rem;
  color: #bcc4cb;
  font-size: .62rem;
}
.server-detail-page .server-meta-value.mono { color: #9ca8b3; font-size: .58rem; }

.server-detail-page .server-kpi-grid {
  gap: 0;
  overflow: hidden;
  border: 1px solid #20272e;
  border-radius: .58rem;
  background: #090c0f;
}
.server-detail-page .server-kpi,
.server-detail-page .server-kpi-primary {
  min-height: 5.5rem;
  padding: .9rem 1rem;
  border: 0;
  border-right: 1px solid #20272e;
  border-radius: 0;
  background: transparent;
}
.server-detail-page .server-kpi:last-child { border-right: 0; }
.server-detail-page .server-kpi-primary { background: rgba(77, 163, 255, .025); }
.server-detail-page .server-kpi::after { display: none; }
.server-detail-page .server-kpi-value { margin-top: .48rem; gap: .48rem; }
.server-detail-page .server-kpi-value strong { font-size: 1.45rem; font-weight: 530; }
.server-detail-page .server-kpi-value > span:not(.badge) { font-size: .53rem; }
.server-detail-page .server-kpi-value .badge { padding: .14rem .45rem; font-size: .5rem; }

.server-detail-page .server-chart-panel { min-height: 19rem; }
.server-detail-page .server-section-head {
  min-height: 3.75rem;
  padding: .72rem 1rem;
  border-bottom-color: #20272e;
  background: #0b0f13;
}
.server-detail-page .server-section-head > div > span { color: #637080; font-size: .43rem; letter-spacing: .1em; }
.server-detail-page .server-section-head h2 { margin-top: .16rem; color: #d9dee2; font-size: .78rem; font-weight: 590; }
.server-detail-page .server-section-head-static {
  min-height: 2.8rem;
  padding: .4rem .05rem;
  border: 0;
  background: transparent;
}
.server-detail-page .server-range-select {
  min-height: 2.15rem;
  border-radius: .38rem;
  background-color: #0a0d11;
  font-size: .57rem;
}
.server-detail-page .server-chart-body { padding: .8rem 1rem .95rem; }

.server-detail-page .server-team-panel { padding: 1rem 1.05rem; }
.server-detail-page .server-team-panel > p { color: #646f79; font-size: .58rem; }
.server-detail-page .server-location-grid { gap: .65rem; }
.server-detail-page .server-location-card {
  position: relative;
  min-height: 9.5rem;
  transition: border-color .15s ease, background-color .15s ease;
}
.server-detail-page .server-location-card.is-online { border-color: #26342f; }
.server-detail-page .server-location-card.is-online::before {
  position: absolute;
  top: .85rem;
  bottom: .85rem;
  left: 0;
  width: 2px;
  border-radius: 0 2px 2px 0;
  background: #4b8d6b;
  content: "";
}
.server-detail-page .server-location-card:hover { border-color: #303a44; background: #0b0f13; }
.server-detail-page .server-location-head {
  min-height: 3.3rem;
  padding: .68rem .9rem;
  border-bottom-color: #20272e;
  background: transparent;
}
.server-detail-page .server-location-head h3 { font-size: .68rem; }
.server-detail-page .server-location-body { min-height: 6rem; }
.server-detail-page .server-location-count { border-right-color: #20272e; background: #0a0d10; }
.server-detail-page .server-location-count strong { font-size: 1.42rem; font-weight: 530; }

/* Edit-server dialog: wide enough for a two-column form, but with a fixed
   header/footer so actions never disappear below the viewport. */
.server-edit-modal {
  width: min(42rem, calc(100vw - 2rem));
  max-width: 42rem;
  max-height: calc(100vh - 2.5rem);
  overflow: hidden;
  border: 1px solid #29313a;
  border-radius: .68rem;
  background: #0a0d11;
  box-shadow: 0 28px 80px rgba(0,0,0,.58);
}
.server-edit-modal::backdrop { background: rgba(2, 5, 8, .78); backdrop-filter: blur(5px); }
.server-edit-head {
  align-items: flex-start;
  padding: 1rem 1.15rem;
  border-bottom-color: #232a31;
  background: #0c1014;
}
.server-edit-head > div { min-width: 0; }
.server-edit-kicker {
  display: block;
  color: #65717d;
  font: 600 .43rem var(--font-mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}
.server-edit-head .modal-title {
  display: block;
  margin-top: .22rem;
  color: #edf0f2;
  font-size: 1rem;
  font-weight: 610;
  letter-spacing: -.025em;
}
.server-edit-head p {
  margin-top: .22rem;
  color: #616b75;
  font-size: .53rem;
}
.server-edit-head .modal-close {
  width: 2rem;
  height: 2rem;
  border: 1px solid #283039;
  border-radius: .4rem;
  background: #101419;
  color: #737e89;
}
.server-edit-head .modal-close:hover { border-color: #3a4651; background: #151a20; color: #dce1e5; }
.server-edit-head .modal-close svg { width: .85rem; height: .85rem; }

.server-edit-form {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  max-height: calc(100vh - 8rem);
}
.server-edit-body {
  overflow-y: auto;
  padding: 0;
  scrollbar-color: #303944 #0a0d11;
  scrollbar-width: thin;
}
.server-edit-section {
  padding: 1rem 1.15rem 1.1rem;
  border-bottom: 1px solid #20272e;
}
.server-edit-section:last-child { border-bottom: 0; }
.server-edit-section-head {
  display: grid;
  grid-template-columns: minmax(9rem, .38fr) minmax(0, 1fr);
  align-items: baseline;
  gap: 1rem;
  margin-bottom: .85rem;
}
.server-edit-section-head h3 { color: #d7dce0; font-size: .67rem; font-weight: 600; }
.server-edit-section-head p { color: #59636d; font-size: .5rem; line-height: 1.45; }
.server-edit-grid {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: .8rem;
}
.server-edit-full { grid-column: 1 / -1; }
.server-edit-modal .label {
  margin-bottom: .32rem;
  color: #838d97;
  font-size: .54rem;
  font-weight: 600;
  letter-spacing: .015em;
}
.server-edit-modal .input {
  min-height: 2.45rem;
  border-color: #29313a;
  border-radius: .42rem;
  background: #080b0e;
  color: #dce1e5;
  font-size: .62rem;
}
.server-edit-modal .input:hover { border-color: #3a4651; }
.server-edit-modal .input:focus { border-color: #4e759b; box-shadow: 0 0 0 3px rgba(77,163,255,.08); }
.server-field-note {
  display: block;
  margin-top: .28rem;
  color: #4f5963;
  font-size: .46rem;
  line-height: 1.4;
}
.server-edit-readonly {
  min-height: 4.45rem;
  padding: .7rem .78rem;
  border: 1px solid #242c34;
  border-radius: .42rem;
  background: #0d1115;
}
.server-edit-readonly span,
.server-edit-readonly strong,
.server-edit-readonly small { display: block; }
.server-edit-readonly span { color: #5d6771; font: .45rem var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
.server-edit-readonly strong { margin-top: .28rem; color: #c8ced3; font-size: .62rem; font-weight: 580; }
.server-edit-readonly small { margin-top: .12rem; color: #56606a; font-size: .47rem; }
.server-edit-textarea { min-height: 5.25rem; resize: vertical; line-height: 1.5; }
.server-edit-notice {
  padding: .68rem .75rem;
  border: 1px solid #28313a;
  border-radius: .42rem;
  background: #0d1115;
  color: #6a747e;
  font-size: .52rem;
  line-height: 1.5;
}
.server-edit-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin-top: .8rem;
}
.server-edit-toggle,
.server-edit-file {
  min-width: 0;
  min-height: 6.35rem;
  padding: .78rem;
  border: 1px solid #242c34;
  border-radius: .45rem;
  background: #0d1115;
}
.server-edit-toggle {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  cursor: pointer;
}
.server-edit-toggle strong,
.server-edit-toggle small,
.server-edit-file strong,
.server-edit-file small { display: block; }
.server-edit-toggle strong,
.server-edit-file strong { color: #cbd1d6; font-size: .6rem; font-weight: 590; }
.server-edit-toggle small,
.server-edit-file small { margin-top: .2rem; color: #56606a; font-size: .47rem; line-height: 1.45; }
.server-edit-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.server-edit-toggle > i {
  position: relative;
  width: 2rem;
  height: 1.08rem;
  border: 1px solid #39434d;
  border-radius: 999px;
  background: #151a20;
  transition: border-color .15s ease, background-color .15s ease;
}
.server-edit-toggle > i::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: .67rem;
  height: .67rem;
  border-radius: 50%;
  background: #727d87;
  content: "";
  transition: transform .15s ease, background-color .15s ease;
}
.server-edit-toggle input:checked + i { border-color: #426b91; background: rgba(77,163,255,.11); }
.server-edit-toggle input:checked + i::after { background: #5da8f3; transform: translateX(.87rem); }
.server-edit-toggle input:focus-visible + i { outline: 2px solid rgba(77,163,255,.35); outline-offset: 2px; }
.server-edit-file { display: flex; flex-direction: column; }
.server-edit-file .file-control {
  min-height: 2.25rem;
  margin-top: .58rem;
  padding: .2rem;
  font-size: .5rem;
}
.server-edit-file .file-control::file-selector-button {
  margin-right: .55rem;
  padding: .36rem .55rem;
  border-color: #323b45;
  border-radius: .3rem;
  background: #151a20;
  color: #adb6bf;
  font-size: .5rem;
}
.server-edit-remove-icon {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin-top: .5rem;
  color: #7b6b70;
  font-size: .48rem;
}
.server-edit-foot {
  padding: .78rem 1.15rem;
  border-top-color: #232a31;
  border-radius: 0;
  background: #0c1014;
}
.server-edit-foot .btn { min-height: 2.25rem; border-radius: .4rem; font-size: .59rem; }

@media (max-width: 900px) {
  .server-detail-page .server-meta-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .server-detail-page .server-meta-item:nth-child(2) { border-right: 0; }
  .server-detail-page .server-meta-item:nth-child(-n+2) { border-bottom: 1px solid #20272e; }
}

@media (max-width: 700px) {
  .server-detail-toolbar > span { display: none; }
  .server-detail-page .server-hero-head { grid-template-columns: 1fr; gap: .85rem; }
  .server-detail-page .server-actions { grid-column: auto; }
  .server-detail-page .server-kpi-grid { grid-template-columns: 1fr; }
  .server-detail-page .server-kpi { border-right: 0; border-bottom: 1px solid #20272e; }
  .server-detail-page .server-kpi:last-child { border-bottom: 0; }
  .server-edit-section-head { grid-template-columns: 1fr; gap: .18rem; }
  .server-edit-grid,
  .server-edit-options { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .server-detail-page .server-meta-grid { grid-template-columns: 1fr; }
  .server-detail-page .server-meta-item,
  .server-detail-page .server-meta-item:nth-child(2) { border-right: 0; border-bottom: 1px solid #20272e; }
  .server-detail-page .server-meta-item:last-child { border-bottom: 0; }
  .server-detail-page .server-actions { align-items: stretch; flex-direction: column; }
  .server-detail-page .server-actions .btn,
  .server-detail-page .server-actions form { width: 100%; }
  .server-edit-modal { width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); }
  .server-edit-form { max-height: calc(100vh - 6.5rem); }
  .server-edit-head,
  .server-edit-section,
  .server-edit-foot { padding-inline: .9rem; }
  .server-edit-foot .btn { flex: 1; }
}