:root { font-family: Segoe UI, sans-serif; color: #1b1b1b; }
body { margin: 0; background: #f4f1ea; }
header { padding: 12px 20px; background: #2c4a3a; color: #fff; }
header h1 { margin: 0; font-size: 20px; }
.panel, aside { background: #fff; padding: 16px; margin: 16px; border: 1px solid #d9d3c7; }
.hidden { display: none !important; }
label { display: block; margin: 8px 0; }
input, textarea { width: 100%; box-sizing: border-box; padding: 6px; }
textarea { font-family: Consolas, monospace; font-size: 12px; }
button { margin: 4px 4px 4px 0; padding: 8px 12px; }
#app { display: grid; grid-template-columns: 320px 1fr; min-height: calc(100vh - 70px); }
#map { height: calc(100vh - 90px); }
.map-wrap { position: relative; }
#alerts { position: absolute; top: 12px; left: 12px; z-index: 500; background: #fff8d5; padding: 8px 12px; max-width: 360px; }
.device { padding: 8px 0; border-bottom: 1px solid #eee; }
.device.active { background: #eef6ef; }
.muted { color: #666; font-size: 12px; }
.check { display: flex; gap: 8px; align-items: center; }
.check input { width: auto; }