.crsm-v11[data-crsm-app] .crsm-v11__campus-svg {
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--crsm-v11-color-accent) 5%, transparent), transparent 62%),
    var(--crsm-v11-color-surface);
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-ground {
  fill: color-mix(in srgb, var(--crsm-v11-color-soft) 84%, var(--crsm-v11-color-surface));
  stroke: var(--crsm-v11-color-line);
  stroke-width: 2;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-lot {
  fill: color-mix(in srgb, var(--crsm-v11-color-surface) 72%, transparent);
  stroke: color-mix(in srgb, var(--crsm-v11-color-line) 76%, transparent);
  stroke-width: 1.25;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-node,
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge {
  cursor: pointer;
  transition: opacity 160ms ease;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-face {
  stroke: color-mix(in srgb, var(--crsm-v11-color-accent) 68%, var(--crsm-v11-color-line));
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-face--top {
  fill: color-mix(in srgb, var(--crsm-v11-color-accent) 24%, var(--crsm-v11-color-surface));
  fill-opacity: 0.78;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-face--front {
  fill: color-mix(in srgb, var(--crsm-v11-color-accent) 16%, var(--crsm-v11-color-surface));
  fill-opacity: 0.82;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-face--side {
  fill: color-mix(in srgb, var(--crsm-v11-color-accent) 12%, var(--crsm-v11-color-soft));
  fill-opacity: 0.84;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-building-faces {
  transform-box: fill-box;
  transform-origin: center;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-building-faces.is-rotating {
  animation: crsm-v11-campus-turn 1200ms cubic-bezier(0.35, 0.08, 0.2, 1) both;
}

@keyframes crsm-v11-campus-turn {
  from { transform: perspective(720px) rotateY(0deg); }
  to { transform: perspective(720px) rotateY(360deg); }
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-label {
  fill: var(--crsm-v11-color-ink);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 750;
  paint-order: stroke fill;
  pointer-events: none;
  stroke: color-mix(in srgb, var(--crsm-v11-color-surface) 90%, transparent);
  stroke-linejoin: round;
  stroke-width: 4;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-line,
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-halo,
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-hit {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-line {
  stroke: var(--crsm-v11-color-accent);
  stroke-linecap: round;
  stroke-width: 2.4;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-halo {
  stroke: color-mix(in srgb, var(--crsm-v11-color-surface) 90%, transparent);
  stroke-linecap: round;
  stroke-width: 10;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge-hit {
  pointer-events: stroke;
  stroke: transparent;
  stroke-width: 44;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--critical .crsm-v11__campus-edge-line { stroke-width: 4; }
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--high .crsm-v11__campus-edge-line { stroke-width: 3.2; }
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--low .crsm-v11__campus-edge-line { stroke-width: 1.8; }

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--planned .crsm-v11__campus-edge-line {
  stroke: var(--crsm-v11-color-muted);
  stroke-dasharray: 8 6;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--atRisk .crsm-v11__campus-edge-line {
  stroke: var(--crsm-v11-color-danger);
  stroke-dasharray: 12 4 3 4;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge--retired .crsm-v11__campus-edge-line {
  stroke: var(--crsm-v11-color-muted);
  stroke-dasharray: 2 7;
  opacity: 0.76;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-node.is-selected .crsm-v11__campus-face {
  stroke: var(--crsm-v11-focus);
  stroke-width: 4;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-node.is-related .crsm-v11__campus-face {
  stroke-width: 3;
  stroke-dasharray: 7 3;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge.is-selected .crsm-v11__campus-edge-line {
  stroke: var(--crsm-v11-color-ink);
  stroke-width: 5;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-edge.is-related .crsm-v11__campus-edge-line {
  filter: drop-shadow(0 0 1px var(--crsm-v11-color-ink));
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-svg.has-selection :is(.crsm-v11__campus-node, .crsm-v11__campus-edge) {
  opacity: 0.24;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-svg.has-selection :is(.is-selected, .is-related) {
  opacity: 1;
}

.crsm-v11[data-crsm-app] .crsm-v11__campus-node:focus-visible .crsm-v11__campus-face,
.crsm-v11[data-crsm-app] .crsm-v11__campus-edge:focus-visible .crsm-v11__campus-edge-hit {
  stroke: var(--crsm-v11-focus);
  stroke-width: 5;
}

@media (prefers-reduced-motion: reduce) {
  .crsm-v11[data-crsm-app] .crsm-v11__campus-node,
  .crsm-v11[data-crsm-app] .crsm-v11__campus-edge {
    transition: none;
  }

  .crsm-v11[data-crsm-app] .crsm-v11__campus-building-faces.is-rotating {
    animation: none;
  }
}