:root{--ink:#16231c;--pine:#214d39;--paper:#fffdf7;--muted:#69736b;--amber:#de8b3d}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font:15px Arial;color:var(--ink);background:var(--paper)}
body{display:grid;grid-template-rows:58px 1fr 58px;overflow:hidden}
header,footer{display:flex;align-items:center;justify-content:space-between;padding:0 22px;background:var(--paper)}
header{border-bottom:1px solid #d9ddd5}header a{color:var(--pine);font-weight:bold;text-decoration:none}header b{font-size:17px}
header span,footer span{color:var(--muted);font-size:12px}
main{display:grid;grid-template-columns:380px 1fr;min-height:0}
.review{padding:32px;overflow:auto;border-right:1px solid #d9ddd5}.review small{letter-spacing:.14em;color:var(--pine);font-weight:bold}.review h1{font-size:31px;line-height:1.08;margin:10px 0}.review p{color:var(--muted);line-height:1.5}
.choicebar{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:24px 0}.choicebar button:last-child{grid-column:1/-1}
button,select,textarea{border:1px solid #cfd5cc;border-radius:8px;background:white;padding:11px;font:inherit}.choicebar button{font-weight:bold}.choicebar button.on,#save{background:var(--pine);color:white;border-color:var(--pine)}
h2{font-size:15px;margin-top:20px}label{display:block;margin:14px 0;color:var(--muted);font-size:12px;font-weight:bold}select,textarea{display:block;width:100%;margin-top:5px}
#reasons{display:flex;flex-wrap:wrap;gap:7px}#reasons button{padding:7px 9px;font-size:12px}#reasons button.on{background:#e5eee8;border-color:var(--pine);color:var(--pine)}#save{width:100%}
.mapwrap,#map{position:relative;height:100%}.legend{position:absolute;z-index:500;left:16px;top:16px;background:#fffffff0;padding:10px;border-radius:8px;box-shadow:0 3px 16px #0002}.legend span{margin-right:12px}.legend i{display:inline-block;width:20px;border-top:5px solid;margin-right:5px}.legend .a{border-color:var(--pine)}.legend .b{border-color:var(--amber)}
.mapactions{position:absolute;z-index:500;right:16px;top:16px;display:flex;gap:7px}.mapactions button b{display:inline-grid;place-items:center;min-width:20px;padding:2px 5px;border-radius:10px;background:var(--pine);color:white;font-size:10px}.map-panel{position:absolute;z-index:510;right:16px;top:62px;width:380px;max-height:calc(100% - 78px);overflow:auto;background:#fffffff4;padding:15px;border-radius:9px;box-shadow:0 5px 24px #0003}.panel-head{display:flex;align-items:center;justify-content:space-between}.panel-head h2{margin:0}.panel-head button{border:0;padding:4px 8px;font-size:20px}.layer-master,.presets,.draw-tools,.edit-tools,.annotation-io{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}.layer-master button,.presets button,.draw-tools button,.edit-tools button,.annotation-io button{padding:7px 9px;font-size:12px}.presets button.on,.draw-tools button.on,.edit-tools button.on{background:var(--pine);color:white}.layer-control{padding:10px 0;border-top:1px solid #ddd}.layer-control>label{display:flex;align-items:center;gap:7px;margin:0;color:var(--ink);font-size:13px}.layer-control input[type=checkbox]{width:18px;height:18px;accent-color:var(--pine)}.layer-control input[type=range]{width:100%;margin-top:8px;accent-color:var(--pine)}.layer-meta{font-size:11px;color:var(--muted);line-height:1.35;margin-top:5px}.layer-meta em{display:block;color:#8d552e}.map-panel ul{padding-left:20px;color:var(--muted);font-size:12px}.annotation-item{display:grid;grid-template-columns:14px 1fr auto;gap:8px;align-items:center;padding:8px 0;border-top:1px solid #ddd;font-size:12px}.annotation-item i{width:11px;height:11px;border-radius:50%;background:var(--annotation-color)}.annotation-item small{display:block;color:var(--muted)}.annotation-item button{border:0;padding:3px 6px}#clear-annotations{color:#9a442f}#inspect{position:absolute;z-index:505;left:16px;bottom:16px;max-width:340px;background:#fffffff2;padding:10px 12px;border-radius:8px;box-shadow:0 3px 16px #0003;font-size:12px;line-height:1.45}#inspect b{display:block;color:var(--pine)}
.metric{display:grid;grid-template-columns:1fr auto auto;gap:8px;padding:8px 0;border-top:1px solid #ddd;font-size:12px}.metric b{font-size:13px}.metric .better{color:var(--pine)}.metric .worse{color:#9a442f}.hidden{display:none!important}
.review-mobile-head,#review-toggle{display:none}
footer{border-top:1px solid #d9ddd5}footer div{display:flex;flex-direction:column;gap:3px}footer button:disabled{opacity:.4}#notice{font-size:12px}
@media(max-width:760px){
  html,body{width:100%;max-width:100%;overflow:hidden}body{grid-template-rows:48px minmax(0,1fr) 52px}
  header{width:100vw;padding:0 max(13px,env(safe-area-inset-right)) 0 max(13px,env(safe-area-inset-left))}header b{display:none}
  main{display:block;position:relative;width:100vw;min-width:0;min-height:0;overflow:hidden}
  .mapwrap{height:100%;min-height:0;width:100vw;max-width:100vw;overflow:hidden}
  .review{display:none;position:absolute;z-index:530;left:8px;right:8px;bottom:72px;width:auto;max-height:calc(100% - 84px);border:0;border-radius:18px;padding:18px 18px max(18px,env(safe-area-inset-bottom));overflow:auto;background:#fffdf7f7;box-shadow:0 8px 30px #0005}.review.mobile-open{display:block}.review h1{font-size:25px}.review-mobile-head{display:flex;align-items:center;justify-content:space-between;position:sticky;top:-18px;margin:-18px -18px 15px;padding:10px 12px 8px 18px;background:var(--paper);border-bottom:1px solid #d9ddd5;z-index:2}.review-mobile-head button{border:0;padding:5px 10px;font-size:23px}
  .choicebar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.choicebar button{min-width:0;min-height:48px}
  footer{z-index:900;padding:6px max(10px,env(safe-area-inset-right)) 6px max(10px,env(safe-area-inset-left));gap:8px}footer div{min-width:0}footer b{overflow:hidden;text-overflow:ellipsis}footer span{display:none}footer button{flex:0 0 auto;padding:8px;font-size:12px}
  button{touch-action:manipulation}select,textarea{font-size:16px}#map .leaflet-bottom{bottom:68px}
  #review-toggle{display:block}.mapactions{left:8px;right:8px;top:auto;bottom:max(10px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:5px;background:#fffdf7ed;border:1px solid #cfd5cc;border-radius:14px;box-shadow:0 4px 20px #0004}.mapactions button{min-width:0;min-height:46px;padding:6px 3px;font-size:11px;font-weight:bold;line-height:1.1}.mapactions button.on{background:var(--pine);color:white;border-color:var(--pine)}.mapactions button.on b{background:white;color:var(--pine)}.mapactions button span{display:block}.map-panel{left:8px;right:8px;top:auto;bottom:72px;width:auto;max-height:calc(100% - 84px);border-radius:18px;padding:18px 16px max(18px,env(safe-area-inset-bottom));overscroll-behavior:contain}.panel-head{position:sticky;top:-18px;margin:-18px -16px 10px;padding:10px 10px 8px 16px;background:var(--paper);border-bottom:1px solid #d9ddd5;z-index:2}.panel-head button{min-width:44px;min-height:44px}.layer-master button,.presets button,.draw-tools button,.edit-tools button,.annotation-io button{min-height:44px;padding:9px 11px}.layer-control input[type=checkbox]{width:24px;height:24px}.layer-control input[type=range]{height:32px}.legend{left:auto;right:8px;top:8px;padding:8px;font-size:11px}.legend span{margin-right:6px}.legend span:last-child{margin-right:0}#inspect{left:8px;right:8px;bottom:74px;max-width:none}
}
