.controller-setup[hidden] { display: none; }
.controller-setup { position: fixed; bottom: 12px; left: 12px; z-index: 60; padding: 9px 13px; border: 1px solid #407589; border-radius: 6px; background: #0b202dec; color: #d9faff; font: 13px monospace; cursor: pointer; }
.controller-setup:focus-visible, .controller-dialog button:focus-visible, .controller-dialog select:focus-visible { outline: 3px solid #3ddc97; outline-offset: 3px; }
.controller-dialog { box-sizing: border-box; width: min(540px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 24px; border: 1px solid #407589; border-radius: 12px; background: #0b202d; color: #d9faff; font: 15px/1.5 system-ui, sans-serif; }
.controller-dialog::backdrop { background: #020b13cc; }
.controller-dialog h2 { margin: 0 0 12px; }
.controller-dialog p { margin: 12px 0; }
.controller-dialog select { display: block; width: 100%; margin-top: 6px; padding: 10px; background: #16374a; color: white; border: 1px solid #407589; border-radius: 5px; }
.controller-step { padding: 14px; border-left: 3px solid #3ddc97; background: #15394a; font-weight: 600; }
.controller-live, .controller-device { overflow-wrap: anywhere; font: 12px/1.5 monospace; color: #9dccdf; }
.controller-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.controller-dialog button { padding: 10px 14px; border: 1px solid #407589; border-radius: 5px; background: #16374a; color: white; cursor: pointer; font: inherit; }
.controller-dialog button:disabled { opacity: .5; cursor: default; }
.controller-dialog [data-action="map"] { background: #20724f; }