.development-preview[data-service-demo] {
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#080b14;
  box-shadow:inset 0 0 0 1px rgb(255 255 255 / 7%);
}

.service-demo-art {
  display:block;
  width:100%;
  height:100%;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  user-select:none;
}

.service-demo-art text {
  dominant-baseline:middle;
}

.service-demo-art .sd-muted { fill:#8590a8; }
.service-demo-art .sd-white { fill:#f3f5fc; }
.service-demo-art .sd-dark { fill:#252840; }
.service-demo-art .sd-label { font-size:11px; letter-spacing:1.6px; font-weight:600; }
.service-demo-art .sd-small { font-size:12px; }
.service-demo-art .sd-body { font-size:15px; }
.service-demo-art .sd-title { font-size:23px; font-weight:600; letter-spacing:-.8px; }
.service-demo-art .sd-cursor { filter:drop-shadow(0 3px 4px rgb(0 0 0 / 35%)); }
.service-demo-art .sd-line { fill:none; stroke:#343c51; stroke-width:1; }

.service-demo-toggle {
  position:absolute;
  z-index:2;
  right:10px;
  bottom:9px;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  padding:6px;
  border:1px solid rgb(255 255 255 / 16%);
  border-radius:50%;
  color:#e5e9f7;
  background:rgb(12 17 31 / 85%);
  backdrop-filter:blur(8px);
}

.service-demo-toggle:hover { background:#303d61; }
.service-demo-toggle svg { width:12px; height:12px; fill:currentColor; }
.service-demo-toggle [hidden] { display:none; }