/* Server-only UI section styles. Generated from config/ui_sections.json. Do not expose controls in website UI. */
:root {
  --ui-spec-green: #9bff00;
  --ui-spec-green-dim: rgba(155,255,0,.18);
  --ui-spec-bg: #020504;
  --ui-spec-panel: #060a08;
  --ui-spec-text: #edf3e8;
  --ui-spec-muted: #a8b4a1;
}

/* PAGE BACKGROUNDS */
.ui-page-bg-deep-black-reactor {
  background:
    radial-gradient(circle at 46% 10%, rgba(155,255,0,.12), transparent 22%),
    radial-gradient(circle at 83% 66%, rgba(155,255,0,.06), transparent 24%),
    linear-gradient(180deg, #050806, #020504 72%);
}
.ui-page-bg-plain-dark { background: #020504; }

/* PANE BACKGROUNDS */
.ui-pane-bg-armored-specops {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 24% 10%, rgba(155,255,0,.16), transparent 16%),
    linear-gradient(180deg, rgba(6,10,8,.96), rgba(2,5,4,.985)),
    linear-gradient(135deg, rgba(255,255,255,.025) 0 1px, transparent 1px 54px);
  box-shadow: inset 0 0 0 1px rgba(155,255,0,.10), inset 0 0 110px rgba(0,0,0,.70);
}
.ui-pane-bg-armored-specops::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .95;
  background:
    linear-gradient(145deg, transparent 0 10%, rgba(155,255,0,.06) 10% 10.25%, transparent 10.25% 27%, rgba(255,255,255,.035) 27% 27.25%, transparent 27.25% 62%, rgba(155,255,0,.05) 62% 62.25%, transparent 62.25%),
    linear-gradient(35deg, rgba(255,255,255,.022) 0 1px, transparent 1px 64px);
  background-size: 286px 286px, 72px 72px;
}
.ui-pane-bg-armored-specops::after {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;
  z-index: 1;
  border: 1px solid rgba(155,255,0,.18);
  clip-path: polygon(0 22px,22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), inset 0 0 70px rgba(0,0,0,.62);
}
.ui-pane-bg-armored-specops > * { position: relative; z-index: 2; }

.ui-pane-bg-dark-carbon {
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(0,0,0,.16)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.026) 0 1px, transparent 1px 14px),
    linear-gradient(180deg, #07100c, #030504);
}
.ui-pane-bg-reactor-grid {
  background:
    radial-gradient(circle at 50% 56%, rgba(155,255,0,.18), transparent 18%),
    linear-gradient(rgba(155,255,0,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(155,255,0,.035) 1px, transparent 1px),
    linear-gradient(180deg, #020604, #040806);
  background-size: auto, 30px 30px, 30px 30px, auto;
}

.ui-pane-bg-blue-reactor-test {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 26% 12%, rgba(0,190,255,.24), transparent 18%),
    radial-gradient(circle at 80% 74%, rgba(0,110,255,.18), transparent 24%),
    linear-gradient(rgba(0,180,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,180,255,.040) 1px, transparent 1px),
    linear-gradient(180deg, #03111d, #020711 72%);
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
  box-shadow: inset 0 0 0 1px rgba(0,190,255,.18), inset 0 0 110px rgba(0,20,45,.76);
}
.ui-pane-bg-blue-reactor-test::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .88;
  background:
    linear-gradient(145deg, transparent 0 10%, rgba(0,190,255,.09) 10% 10.25%, transparent 10.25% 27%, rgba(255,255,255,.035) 27% 27.25%, transparent 27.25% 62%, rgba(0,120,255,.075) 62% 62.25%, transparent 62.25%),
    linear-gradient(35deg, rgba(255,255,255,.022) 0 1px, transparent 1px 64px);
  background-size: 286px 286px, 72px 72px;
}
.ui-pane-bg-blue-reactor-test::after {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;
  z-index: 1;
  border: 1px solid rgba(0,190,255,.28);
  clip-path: polygon(0 22px,22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 70px rgba(0,20,55,.62), 0 0 24px rgba(0,190,255,.10);
}
.ui-pane-bg-blue-reactor-test > * { position: relative; z-index: 2; }


.ui-pane-bg-specops-armor-wall {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(3,6,5,.34), rgba(2,4,3,.56)),
    url('/static/generated/spec_ops_armor_wall.svg') center center / cover no-repeat !important;
  box-shadow:
    inset 0 0 0 1px rgba(155,255,0,.10),
    inset 0 0 80px rgba(0,0,0,.45) !important;
}
.ui-pane-bg-specops-armor-wall::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.32), transparent 18%, transparent 82%, rgba(0,0,0,.32)),
    radial-gradient(circle at 50% 18%, rgba(155,255,0,.06), transparent 22%);
}
.ui-pane-bg-specops-armor-wall::after {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;
  z-index: 1;
  border: 1px solid rgba(155,255,0,.20);
  clip-path: polygon(0 22px,22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), inset 0 0 52px rgba(0,0,0,.55);
}
.ui-pane-bg-specops-armor-wall > * { position: relative; z-index: 2; }

/* BORDERS */
.ui-border-neon-beveled {
  border: 1px solid rgba(155,255,0,.22);
  clip-path: polygon(0 16px,16px 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 0 20px rgba(155,255,0,.08);
}
.ui-border-thin-terminal { border: 1px solid rgba(155,255,0,.16); }

/* BUTTONS - intentionally does not override current sandbox nav buttons */
.ui-buttons-locked-current { --ui-buttons-locked: 1; }

/* NAVIGATION PANE */
.ui-nav-pane-sandbox-current { --ui-nav-pane-profile: sandbox-current; }

/* CARDS */
.ui-card-dark-carbon {
  background: linear-gradient(180deg, rgba(12,18,14,.90), rgba(3,6,5,.94));
  border: 1px solid rgba(155,255,0,.13);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 12px 24px rgba(0,0,0,.26);
}

/* HERO */
.ui-hero-reactor-hud {
  background:
    radial-gradient(circle at 55% 34%, rgba(155,255,0,.20), transparent 14%),
    linear-gradient(90deg, rgba(2,5,4,.88), rgba(2,5,4,.34) 46%, rgba(2,5,4,.64)),
    linear-gradient(135deg, rgba(24,35,29,.9), rgba(3,5,4,.98));
}

/* TYPOGRAPHY */
.ui-type-military-terminal { letter-spacing: .06em; text-transform: uppercase; }

/* EFFECTS */
.ui-effect-subtle-scan-glow { position: relative; }
.ui-effect-subtle-scan-glow::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(180deg, rgba(155,255,0,.025) 0 1px, transparent 1px 5px);
  opacity: .28;
}