/* RR CyberLab launch visual system: restrained atmosphere behind working controls. */
body[data-lab] {
  color-scheme: dark;
  background-color: #040a14 !important;
  background-attachment: fixed;
  background-size: auto, auto, 44px 44px, 44px 44px;
  background-repeat: no-repeat, no-repeat, repeat, repeat;
}
body[data-lab="builder"] {
  background-image: radial-gradient(ellipse at 12% 4%, rgba(20, 171, 208, .16), transparent 36%), radial-gradient(ellipse at 92% 24%, rgba(26, 99, 159, .12), transparent 34%), linear-gradient(rgba(67, 201, 228, .025) 1px, transparent 1px), linear-gradient(90deg, rgba(67, 201, 228, .025) 1px, transparent 1px) !important;
}
body[data-lab="endpoint"] {
  --purple: #53dff5;
  background-image: radial-gradient(ellipse at 8% 8%, rgba(66, 169, 221, .15), transparent 35%), radial-gradient(ellipse at 94% 30%, rgba(104, 104, 230, .12), transparent 36%), linear-gradient(rgba(89, 197, 226, .023) 1px, transparent 1px), linear-gradient(90deg, rgba(89, 197, 226, .023) 1px, transparent 1px) !important;
}
body[data-lab="attackmap"] {
  background-image: radial-gradient(ellipse at 52% 0%, rgba(31, 134, 191, .16), transparent 38%), radial-gradient(ellipse at 96% 42%, rgba(194, 50, 78, .09), transparent 32%), linear-gradient(rgba(64, 180, 220, .025) 1px, transparent 1px), linear-gradient(90deg, rgba(64, 180, 220, .025) 1px, transparent 1px) !important;
}
body[data-lab="range"] {
  background-image: radial-gradient(ellipse at 10% 0%, rgba(26, 118, 179, .18), transparent 38%), radial-gradient(ellipse at 94% 32%, rgba(28, 177, 192, .11), transparent 34%), linear-gradient(rgba(65, 188, 220, .024) 1px, transparent 1px), linear-gradient(90deg, rgba(65, 188, 220, .024) 1px, transparent 1px) !important;
}
body[data-lab] .top,
body[data-lab] > header {
  background: rgba(3, 9, 18, .91) !important;
  border-bottom-color: rgba(59, 177, 214, .24) !important;
  backdrop-filter: blur(14px);
}
body[data-lab] .panel {
  background: linear-gradient(145deg, rgba(7, 18, 31, .93), rgba(3, 9, 16, .93));
  border-color: rgba(52, 133, 172, .38);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .25), inset 0 1px rgba(154, 228, 255, .025);
  backdrop-filter: blur(9px);
}
body[data-lab] .e-card,
body[data-lab] .triage-card,
body[data-lab] .range-card,
body[data-lab] .start-card {
  box-shadow: 0 16px 42px rgba(0, 0, 0, .22), inset 0 1px rgba(154, 228, 255, .025);
  backdrop-filter: blur(8px);
}
body[data-lab] .lab-switcher a {
  border-color: rgba(57, 143, 180, .36);
  background: rgba(6, 19, 32, .82);
}
body[data-lab] .lab-switcher a:hover,
body[data-lab] .lab-switcher a.current {
  border-color: #37d8ef;
  box-shadow: 0 0 22px rgba(55, 216, 239, .12);
}
body[data-lab] :focus-visible {
  outline-color: #5de7ff;
}
@media (prefers-reduced-motion: reduce) {
  body[data-lab] *, body[data-lab] *::before, body[data-lab] *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
.range-hint,
.range-mitre {
  display: grid;
  gap: 3px;
  margin: 12px 0;
  padding: 11px 13px;
  border: 1px solid rgba(63, 163, 195, .24);
  border-left: 3px solid #45d9ef;
  border-radius: 0 10px 10px 0;
  background: rgba(7, 27, 41, .72);
  color: #c7dce8;
  font-size: .88rem;
  line-height: 1.55;
}
.range-hint strong,
.range-mitre strong {
  color: #64e4f7;
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body[data-lab="endpoint"] .eyebrow,
body[data-lab="endpoint"] .hero h1 span {
  color: #55e7ff !important;
}
body[data-lab="endpoint"] .start-card,
body[data-lab="endpoint"] .detail-card,
body[data-lab="endpoint"] .stage {
  border-color: rgba(55, 151, 189, .36);
  background: linear-gradient(145deg, rgba(7, 19, 32, .94), rgba(4, 10, 18, .94));
}
body[data-lab="endpoint"] .stage {
  background: radial-gradient(circle at 50% 45%, #0b2940, #081523 56%, #040a12) !important;
  box-shadow: 0 0 50px rgba(41, 176, 213, .1);
}
body[data-lab="endpoint"] .stage::before {
  background-image: linear-gradient(rgba(68, 204, 232, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(68, 204, 232, .05) 1px, transparent 1px) !important;
}
body[data-lab="endpoint"] .os.active,
body[data-lab="endpoint"] .mode.active,
body[data-lab="endpoint"] .etab.active {
  border-color: #55e7ff !important;
  background: rgba(9, 53, 72, .85) !important;
  box-shadow: 0 0 22px rgba(55, 216, 239, .12) !important;
}
body[data-lab] .lab-switcher {
  position: relative;
  z-index: 19;
  display: flex;
  align-items: center;
  gap: 8px;
  width: min(1120px, 96%);
  margin: 8px auto 12px;
  padding: 9px 12px;
  overflow-x: auto;
  border: 1px solid rgba(48, 112, 145, .38);
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(4, 11, 20, .98), rgba(7, 21, 34, .98), rgba(4, 11, 20, .98)) !important;
  scrollbar-width: thin;
  scrollbar-color: #24546b #07111d;
}
body[data-lab] .lab-switch-label {
  flex: 0 0 auto;
  color: #63def4;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: 1.4px;
}
body[data-lab] .lab-switcher a {
  flex: 0 0 auto;
  min-width: 195px;
  padding: 8px 11px;
  border-radius: 9px;
  color: #d7e9f5;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.35;
  text-decoration: none;
}
body[data-lab] .lab-switcher small {
  display: block;
  margin-top: 3px;
  color: #80a1b6;
  font-size: 9px;
  font-weight: 600;
}
body[data-lab] header .nav { gap: 14px; }
body[data-lab] header .nav nav { gap: 10px; flex-wrap: nowrap; }
body[data-lab] header .nav nav a { font-size: 12px; white-space: nowrap; }
@media (max-width: 950px) {
  body[data-lab] .lab-switcher { width: 96%; }
  body[data-lab] header .nav nav { gap: 7px; }
}
@media (max-width: 650px) {
  body[data-lab] header .nav { align-items: center; flex-wrap: wrap; gap: 6px; padding: 9px 0 4px; }
  body[data-lab] header .nav .brand { flex: 0 0 100%; }
  body[data-lab] header .nav nav { width: 100%; max-width: 100%; overflow-x: auto; justify-content: flex-start; gap: 13px; padding: 4px 0 8px; scrollbar-width: thin; }
  body[data-lab] header .nav nav a { flex: 0 0 auto; padding: 4px 0; }
  body[data-lab] .lab-switcher { width: 100%; margin: 6px 0 10px; padding: 9px 4%; border-radius: 0; }
  body[data-lab] .lab-switcher a { min-width: 175px; }
}


/* Use the supplied SOC reference visibly across the home and lab opening panels. */
body[data-lab] .hero,
body[data-lab] .range-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #04101c !important;
  background-image:
    linear-gradient(90deg, rgba(2, 8, 17, .91) 0%, rgba(3, 10, 20, .80) 48%, rgba(3, 9, 18, .60) 100%),
    linear-gradient(0deg, rgba(2, 7, 15, .58), transparent 70%),
    url("assets/rr-cyberlab-soc.jpg") !important;
  background-size: cover !important;
  background-position: center 43% !important;
  background-repeat: no-repeat !important;
  border: 1px solid rgba(76, 181, 221, .24);
  box-shadow: 0 22px 55px rgba(0, 0, 0, .3);
}
body[data-lab] .hero > *,
body[data-lab] .range-hero > * {
  position: relative;
  z-index: 1;
}
@media (max-width: 650px) {
  body[data-lab] .hero,
  body[data-lab] .range-hero { background-position: 62% 42% !important; }
}
