:root { color-scheme:light; font:16px/1.55 system-ui,sans-serif; color:#1b2520; background:#f8f5ee; }
* { box-sizing:border-box; }
main { max-width:62rem; margin:auto; padding:1.25rem; }
h1 { font:700 clamp(2rem,6vw,3.4rem)/1.05 Georgia,serif; margin:.8rem 0; }
a { color:#284938; }
.legend { display:flex; flex-wrap:wrap; gap:1rem; padding:0; list-style:none; }
.legend li::before { content:''; display:inline-block; width:.8rem; height:.8rem; margin-right:.4rem; border-radius:50%; background:var(--marker); }
.pending { --marker:#b82434; }
.resolved { --marker:#167448; }
#mapa-reportes { height:clamp(18rem,53vh,32rem); border:1px solid #c9ccc1; border-radius:12px; background:#e6e9df; }
#mapa-reportes.selecting { cursor:crosshair; outline:3px solid #284938; }
section { border-top:1px solid #c9ccc1; margin-top:1.5rem; }
form { display:grid; gap:.85rem; max-width:36rem; }
label { display:grid; gap:.25rem; font-weight:650; }
input:not([hidden]),textarea,select,button { padding:.6rem; border:1px solid #737b70; border-radius:.4rem; font:inherit; }
textarea { resize:vertical; }
button { color:white; background:#284938; cursor:pointer; }
button:disabled { opacity:.6; }
output { font-size:.9rem; }