:root { color-scheme: light; }
* { box-sizing: border-box; }
body {
    margin: 0; font-family: system-ui, sans-serif; color: #1c2421; background: #eef2f0;
}
header {
    padding: 16px 16px 8px;
    display: flex; justify-content: space-between; align-items: center;
}
header p { margin: 0; font-size: 1.25rem; font-weight: 700; }
header a, .voltar { color: #52615c; font-size: .85rem; }
main {
    padding: 0 16px 88px;
}
a.linha, article, form.caixa {
    display: block; background: #fff; color: inherit; text-decoration: none;
    border-radius: 14px; padding: 14px; margin-top: 12px;
    box-shadow: 0 8px 24px rgba(20, 40, 30, .05);
}
a.linha strong, article h1 { display: block; margin: 0; font-size: 1rem; }
a.linha span, .mudo { color: #52615c; font-size: .9rem; }
.ligado { color: #0f3d32; font-weight: 700; }
.desligado, .cortada { color: #8a2a1d; font-weight: 700; }
#mapa {
    height: calc(100vh - 150px); min-height: 320px; border-radius: 14px;
    overflow: hidden; background: #d5ddd8; margin-top: 12px;
}
button, .acao {
    border: 0; border-radius: 10px; padding: 12px 14px; font: inherit; font-weight: 700;
    background: #8a2a1d; color: #fff; width: 100%; margin-top: 12px;
}
button.religar { background: #0f3d32; }
label { display: block; margin-top: 12px; color: #52615c; font-size: .85rem; }
input {
    display: block; width: 100%; margin-top: 4px; padding: 10px 12px;
    border: 1px solid #cfd8d4; border-radius: 10px; font: inherit;
}
nav {
    position: fixed; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr 1fr;
    background: #fff; border-top: 1px solid #d5ddd8;
}
nav a {
    text-align: center; text-decoration: none; color: #52615c;
    padding: 14px 8px 18px; font-weight: 650; font-size: .9rem;
}
nav a.ativa { color: #0f3d32; }
.cadastro { display: inline-block; margin-top: 16px; color: #0f3d32; font-weight: 650; }