/* Only the separate native preview opts into editing. The driving display
   gains no handles, grid, or input behavior from simply loading these assets. */
#overlay.overlay-layout-editing {
  background-image:
    linear-gradient(#aac7dd0d 1px, transparent 1px),
    linear-gradient(90deg, #aac7dd0d 1px, transparent 1px);
  background-size: 10px 10px;
}
.overlay-layout-editing [data-widget="coach"][data-layout-preview] {
  display: block !important;
}
.overlay-layout-editing [data-layout-preview] #coach-text:empty::before {
  content: "Sample radio: Keep the brake release smooth. Let the car settle before picking up the throttle.";
}
.overlay-layout-editing [data-widget] a {
  pointer-events: none;
}
.overlay-layout-frame {
  position: absolute;
  z-index: 10;
  border: 2px dashed #ffad55;
  border-radius: 5px;
  pointer-events: none;
}
.overlay-layout-frame:focus-within {
  z-index: 11;
  border-style: solid;
  border-color: #fff;
}
.overlay-layout-handle {
  position: absolute;
  margin: 0;
  border: 1px solid #ffbb74;
  border-radius: 4px;
  background: #2a1b0f;
  color: #fff1df;
  font: 600 16px/1.25 Barlow, "Segoe UI", sans-serif;
  padding: 6px 10px;
  pointer-events: auto;
  touch-action: none;
  user-select: none;
}
.overlay-layout-handle:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}
.overlay-layout-move {
  top: 2px;
  left: 2px;
  cursor: grab;
}
.overlay-layout-move:active {
  cursor: grabbing;
}
.overlay-layout-resize {
  bottom: 2px;
  right: 2px;
  cursor: nwse-resize;
}
.overlay-layout-help {
  position: absolute;
  left: 54px;
  bottom: 15px;
  color: #d4dfe7;
  font-size: 15px;
  pointer-events: none;
}