:root { --fg:#1d2327; --bg:#fff; --muted:#667; --line:#d8dde2; --accent:#1a7f4b; --danger:#b3261e; }
@media (prefers-color-scheme: dark) {
  :root { --fg:#e8ecef; --bg:#14181b; --muted:#9aa5ad; --line:#2d363c; --accent:#4cc38a; --danger:#f2766d; }
}
* { box-sizing: border-box; }
body { margin:0; font:16px/1.4 system-ui, sans-serif; color:var(--fg); background:var(--bg); }
a { color:var(--accent); }
.bar { display:flex; justify-content:space-between; align-items:center; padding:.6rem 1rem; border-bottom:1px solid var(--line); }
.bar h1 { font-size:1.1rem; margin:0; } .bar h1 span { color:var(--muted); font-weight:400; }
.bar a, .bar button.link { margin-left:1rem; }
.narrow { max-width:40rem; margin:0 auto; padding:1rem; }
label { display:block; margin:.7rem 0; font-weight:500; }
input:not([type=radio]):not([type=checkbox]), textarea, select { width:100%; font:inherit; padding:.55rem; border:1px solid var(--line); border-radius:.4rem; background:var(--bg); color:var(--fg); }
button { font:inherit; padding:.55rem 1rem; border:0; border-radius:.4rem; background:var(--accent); color:var(--bg); cursor:pointer; min-height:2.5rem; }
button.danger { background:var(--danger); }
button.link { background:none; color:var(--accent); padding:0; min-height:0; }
form.inline { display:inline; }
.row { display:flex; gap:.5rem; align-items:center; } .row input { flex:1; }
fieldset { border:1px solid var(--line); border-radius:.4rem; margin:1rem 0; }
.opt { font-weight:400; margin:.4rem 0; } .score-opt b { display:inline-block; width:1.2rem; }
.hint { color:var(--muted); font-weight:400; font-size:.9rem; margin:.2rem 0; }
.error { color:var(--danger); }
.results { list-style:none; padding:0; margin:.5rem 0; }
.results li { border-bottom:1px solid var(--line); }
.results button.pick { all:unset; display:block; width:100%; padding:.6rem .2rem; cursor:pointer; }
.results small { display:block; color:var(--muted); }
.badge { font-size:.75rem; padding:.1rem .4rem; border-radius:1rem; background:var(--line); margin-left:.4rem; }
.thumbs { display:flex; flex-wrap:wrap; gap:.6rem; }
.thumbs figure { margin:0; position:relative; } .thumbs img { width:7rem; height:9rem; object-fit:cover; border-radius:.3rem; display:block; }
.thumbs button { position:absolute; top:.2rem; right:.2rem; padding:.1rem .5rem; min-height:0; background:var(--danger); }
.upload { margin-top:1rem; }
#pick-map { height:14rem; margin:.5rem 0; border-radius:.4rem; }

/* public map page */
.map-page { display:flex; flex-direction:column; height:100dvh; }
.map-page main { position:relative; flex:1; min-height:0; }
#map { position:absolute; inset:0; }
.filters { display:flex; flex-wrap:wrap; gap:.4rem 1.2rem; align-items:center; padding:.4rem 1rem; border-bottom:1px solid var(--line); }
.filters label { display:flex; align-items:center; gap:.4rem; margin:0; font-weight:400; }
.filters select { width:auto; padding:.2rem; }
.rubric summary { cursor:pointer; color:var(--accent); } .rubric ol { margin:.4rem 0; padding-left:1.4rem; font-size:.9rem; }
.card { position:absolute; z-index:1000; left:0; right:0; bottom:0; max-height:60%; overflow:auto; background:var(--bg); border-top:1px solid var(--line); padding:1rem; box-shadow:0 -4px 16px rgba(0,0,0,.2); }
@media (min-width: 700px) { .card { left:1rem; right:auto; bottom:1rem; width:24rem; border:1px solid var(--line); border-radius:.6rem; } }
.card h2 { margin:0 2rem .2rem 0; font-size:1.15rem; }
.card .close { position:absolute; top:.5rem; right:.5rem; background:none; color:var(--fg); font-size:1.4rem; padding:0 .5rem; }
.card .imgs { display:flex; gap:.5rem; overflow-x:auto; margin-top:.6rem; }
.card .imgs img { height:11rem; border-radius:.3rem; cursor:zoom-in; }
.dot { width:18px; height:18px; border-radius:50%; border:2px solid #fff; background:rgba(0,0,0,.25); box-shadow:0 0 0 1px rgba(0,0,0,.45); }
.legend { position:absolute; z-index:900; right:.6rem; bottom:1.6rem; background:var(--bg); color:var(--fg); padding:.3rem .5rem; border-radius:.4rem; font-size:.8rem; box-shadow:0 1px 4px rgba(0,0,0,.3); }
.legend i { display:block; width:7.5rem; height:.6rem; margin:.15rem 0; border-radius:.3rem; background:linear-gradient(90deg,#d73027,#fc8d59,#fee08b,#91cf60,#1a9850); }
.legend span { display:flex; justify-content:space-between; }
@media (max-width: 699px) { .legend { bottom:auto; top:.6rem; } }

/* admin */
.wide { max-width:64rem; margin:0 auto; padding:1rem; }
.head { display:flex; justify-content:space-between; align-items:center; }
.button, a.button { display:inline-block; padding:.55rem 1rem; border-radius:.4rem; background:var(--accent); color:var(--bg); text-decoration:none; }
.scroll { overflow-x:auto; }
.table { width:100%; border-collapse:collapse; font-size:.95rem; }
.table th, .table td { text-align:left; padding:.5rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
.table th { color:var(--muted); font-weight:600; white-space:nowrap; }
.actions { display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; }
td.actions { display:table-cell; white-space:nowrap; } td.actions > * { margin-right:.7rem; }
.danger-text { color:var(--danger) !important; }
.notice { background:rgba(26,127,75,.12); border:1px solid var(--accent); border-radius:.4rem; padding:.5rem .8rem; }
.fields { display:grid; grid-template-columns:max-content 1fr; gap:.4rem 1.2rem; }
.fields dt { color:var(--muted); } .fields dd { margin:0; }
.bar h1 a { color:inherit; text-decoration:none; }
.row label { flex:1; }