:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#1f2933;background:#eef2f1}
*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}
button{border:0;border-radius:10px;padding:.7rem 1rem;background:#245b45;color:#fff;cursor:pointer;font-weight:650}
button.secondary{background:#dde5e1;color:#24322c}
.topbar{display:flex;gap:1rem;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:#fff;border-bottom:1px solid #d7dfdc}
.topbar h1{margin:0;font-size:1.45rem}.topbar p{margin:.25rem 0 0;color:#60706a}
.top-actions{display:flex;gap:.75rem;align-items:end}.language-control{display:grid;gap:.3rem;min-width:170px;font-size:.82rem;color:#60706a}
.language-control select{width:100%;min-height:42px;border:1px solid #b9c7c1;border-radius:10px;padding:.6rem 2.2rem .6rem .75rem;background:#fff;color:#1f2933;font-weight:650;cursor:pointer}
.page{padding:1rem}

.tools-panel{background:#fff;border:1px solid #d7dfdc;border-radius:14px;padding:1rem;margin-bottom:1rem}.tools-head h2{margin:0}.tools-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:.85rem}.tool-card{border:1px solid #dbe4e0;border-radius:12px;padding:1rem;background:#f8faf9}.tool-card h3{margin-top:0}.tool-card label{display:grid;gap:.35rem;margin:.65rem 0;font-size:.86rem;color:#60706a}.tool-card input,.tool-card select{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.65rem;background:#fff;color:#1f2933}.tool-result{margin-top:.8rem;display:grid;gap:.55rem}.tool-result-card{border:1px solid #dde5e1;border-radius:10px;padding:.7rem;background:#fff}.tool-result-card strong{display:block}.tool-result-card .row{display:flex;justify-content:space-between;gap:.8rem;align-items:center;margin-top:.4rem}
.filter-panel{background:#fff;border:1px solid #d7dfdc;border-radius:14px;padding:1rem;margin-bottom:1rem}
.filter-head,.filter-actions{display:flex;justify-content:space-between;gap:1rem;align-items:center}
.filter-head h2{margin:0}
.filter-grid{display:grid;grid-template-columns:2fr repeat(6,minmax(120px,1fr));gap:.75rem;margin-top:.85rem}
.filter-grid label{display:grid;gap:.3rem;font-size:.8rem;color:#60706a}
.filter-grid input,.filter-grid select{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.65rem;background:#fff;color:#1f2933}
.filter-wide{min-width:220px}.checkbox-label{display:flex!important;align-items:center;gap:.5rem;padding-top:1.35rem}.checkbox-label input{width:auto}
.filter-actions{justify-content:flex-start;margin-top:.8rem}

.map-panel{background:#fff;border:1px solid #d7dfdc;border-radius:14px;overflow:hidden}
.map-head{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.85rem 1rem}.map-head h2{margin:0}
#map{height:440px;width:100%;border-top:1px solid #e0e6e3}
.map-legend{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center;padding:.7rem 1rem;border-top:1px solid #e3e8e6;font-size:.83rem}
.map-legend>span{display:flex;gap:.35rem;align-items:center}
.legend-dot{display:inline-block;width:11px;height:11px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #adb7b3}
.legend-dot.green{background:#23834a}.legend-dot.yellow{background:#d3921d}.legend-dot.grey{background:#98a39f}.legend-dot.red{background:#c43d3d}
.legend-foot{display:inline-block;width:13px;height:13px;border:2px dashed #9b2f2f;border-radius:50%}

.layout{display:grid;grid-template-columns:minmax(280px,390px) minmax(0,1fr);gap:1rem;margin-top:1rem}
.panel{background:#fff;border-radius:14px;border:1px solid #d7dfdc;min-height:60vh}.list-panel{padding:1rem}.detail-panel{padding:1.25rem}
.section-head,.detail-title-row,.dialog-head,.dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem}.section-head h2,.detail-title-row h2,.dialog-head h2{margin:0}.detail-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.shelter-list{display:grid;gap:.65rem;margin-top:1rem}.shelter-card{display:block;width:100%;text-align:left;background:#f7faf9;color:#1f2933;border:1px solid #dbe4e0;padding:.9rem}.shelter-card.active{border-color:#245b45;box-shadow:0 0 0 2px rgba(36,91,69,.12)}
.card-top{display:flex;justify-content:space-between;gap:.75rem}.card-name{font-weight:750}.card-meta,.muted,.small-note{color:#64736d}.card-meta{margin-top:.35rem;font-size:.92rem}
.card-distance{font-size:.82rem;font-weight:750;color:#245b45;margin-top:.3rem}
.status-dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;margin-top:.25rem}.status-green{background:#23834a}.status-yellow{background:#d3921d}.status-grey{background:#98a39f}.status-red{background:#c43d3d}

.badges{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.5rem}.badge{display:inline-block;border-radius:999px;padding:.3rem .55rem;background:#eef3f1;font-size:.83rem}
.photo-area{margin-top:1rem;min-height:220px;border-radius:12px;overflow:hidden;background:#eef2f1;display:grid;place-items:center}.photo-area img{display:block;width:100%;max-height:480px;object-fit:cover}
.photo-thumbs{display:flex;gap:.5rem;overflow-x:auto;margin-top:.5rem}.photo-thumb{width:88px;height:66px;object-fit:cover;border-radius:8px;cursor:pointer;border:2px solid transparent}.photo-thumb.selected{border-color:#245b45}
.photo-gps-info{margin-top:.5rem;font-size:.82rem;color:#60706a}
.photo-gps-info.warning,.photo-gps-info.mismatch{color:#973434;font-weight:650}
.photo-gps-info.match{color:#23663e}

.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin-top:1rem}.fact{background:#f6f8f7;border-radius:10px;padding:.8rem}.fact-label{font-size:.8rem;color:#697771}.fact-value{margin-top:.15rem;font-weight:700;white-space:pre-wrap}
.verification-box{margin-top:1rem;border-top:1px solid #dde4e1;padding-top:1rem}.empty-state{min-height:50vh;display:grid;place-content:center;text-align:center;color:#66756f}.hidden{display:none!important}

.shelter-marker{position:relative;width:28px;height:28px;display:grid;place-items:center}
.shelter-symbol{width:22px;height:22px;border:3px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.45)}
.shelter-symbol.green{background:#23834a}.shelter-symbol.yellow{background:#d3921d}.shelter-symbol.grey{background:#98a39f}.shelter-symbol.red{background:#c43d3d}
.shelter-symbol.laavu{clip-path:polygon(0 100%,0 45%,50% 10%,100% 45%,100% 100%,74% 100%,74% 58%,26% 58%,26% 100%)}
.shelter-symbol.kota{clip-path:polygon(50% 0,95% 35%,82% 100%,18% 100%,5% 35%)}
.shelter-symbol.tupa{clip-path:polygon(12% 38%,50% 5%,88% 38%,88% 100%,12% 100%)}
.shelter-marker.foot-only::after{content:"";position:absolute;right:-2px;bottom:-2px;width:11px;height:11px;border:2px dashed #982f2f;border-radius:50%;background:#fff}

dialog{width:min(700px,calc(100vw - 2rem));border:0;border-radius:16px;padding:0;box-shadow:0 24px 60px rgba(0,0,0,.22)}dialog::backdrop{background:rgba(23,35,30,.5)}dialog form{padding:1.2rem}dialog label{display:grid;gap:.35rem;margin-top:1rem;font-weight:650}
dialog input,dialog select,dialog textarea{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.7rem;background:#fff}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.dialog-actions{justify-content:flex-end;margin-top:1rem}.icon-button{background:transparent;color:#52615b;font-size:1.5rem;padding:.2rem .5rem}.form-message{margin-top:1rem;padding:.75rem;border-radius:9px;background:#f3e8e8;color:#8d2929}

@media(max-width:1150px){.filter-grid{grid-template-columns:repeat(3,minmax(140px,1fr))}.filter-wide{grid-column:span 2}}
@media(max-width:760px){.tools-grid{grid-template-columns:1fr}#map{height:340px}.layout{grid-template-columns:1fr}.panel{min-height:auto}.detail-title-row{align-items:flex-start;flex-direction:column}.facts,.two-col,.filter-grid{grid-template-columns:1fr}.filter-wide{grid-column:auto}.topbar{align-items:flex-start}.top-actions{flex-direction:column;align-items:stretch;width:100%;max-width:220px}.filter-head{align-items:flex-start;flex-direction:column}}


.compact-filter{padding:.85rem 1rem}
.compact-hint{margin:.2rem 0 0;font-size:.82rem}
.basic-filter-grid{display:grid;grid-template-columns:minmax(240px,2fr) minmax(130px,.7fr) auto auto;gap:.65rem;align-items:center;margin-top:.7rem}
.basic-filter-grid input,.basic-filter-grid select{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.65rem;background:#fff;color:#1f2933}
.compact-checkbox{padding-top:0!important;white-space:nowrap}
.advanced-filters{margin-top:.7rem;border-top:1px solid #e3e8e6;padding-top:.55rem}
.advanced-filters summary{cursor:pointer;font-weight:700;color:#3e5149}
.advanced-grid{grid-template-columns:repeat(5,minmax(130px,1fr));margin-top:.7rem}
.tool-dialog{padding:1.2rem}
.tool-dialog label{display:grid;gap:.35rem;margin-top:1rem;font-weight:650}
.tool-dialog input,.tool-dialog select{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.7rem;background:#fff}
.tool-actions{margin-top:1rem}
.top-actions{flex-wrap:wrap}

@media(max-width:850px){
  .basic-filter-grid{grid-template-columns:1fr 1fr}
  .advanced-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .basic-filter-grid,.advanced-grid{grid-template-columns:1fr}
}


.shelter-symbol.keittokatos{
  clip-path:polygon(
    0 48%,50% 10%,100% 48%,88% 48%,88% 92%,76% 92%,76% 55%,24% 55%,24% 92%,12% 92%,12% 48%
  )
}
.photo-candidate-form{
  margin-top:.75rem;
  padding:.85rem;
  border:1px solid #dbe4e0;
  border-radius:10px;
  background:#fff;
}
.photo-candidate-form h4{margin:0 0 .6rem}
.photo-candidate-form label{display:grid;gap:.3rem;margin-top:.55rem;font-size:.84rem;color:#60706a}
.photo-candidate-form input,.photo-candidate-form select{width:100%;border:1px solid #cbd6d1;border-radius:9px;padding:.65rem;background:#fff;color:#1f2933}
.photo-candidate-form button{margin-top:.75rem;width:100%}


.photo-meta-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:.75rem;
  margin-top:.5rem
}
.verification-photo-choices{
  display:flex;
  gap:.6rem;
  overflow-x:auto;
  padding:.35rem 0
}
.verification-photo-choice{
  position:relative;
  flex:0 0 112px;
  border:2px solid transparent;
  border-radius:10px;
  padding:.3rem;
  background:#f4f7f6;
  cursor:pointer
}
.verification-photo-choice.selected{
  border-color:#245b45
}
.verification-photo-choice input{
  position:absolute;
  top:.4rem;
  left:.4rem;
  width:auto
}
.verification-photo-choice img{
  display:block;
  width:100%;
  height:78px;
  object-fit:cover;
  border-radius:7px
}
.verification-photo-choice span{
  display:block;
  margin-top:.25rem;
  font-size:.75rem;
  color:#52615b
}


.nearby-actions{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  margin:.8rem 0
}
.tool-result-card.with-photo{
  display:grid;
  grid-template-columns:112px minmax(0,1fr);
  gap:.75rem
}
.tool-result-photo{
  width:112px;
  height:84px;
  object-fit:cover;
  border-radius:9px;
  background:#edf1ef
}
.tool-result-photo-placeholder{
  width:112px;
  height:84px;
  display:grid;
  place-items:center;
  text-align:center;
  border-radius:9px;
  background:#edf1ef;
  color:#64736d;
  font-size:.75rem;
  padding:.4rem
}
.tool-result-content{
  min-width:0
}
.tool-result-badges{
  display:flex;
  gap:.35rem;
  flex-wrap:wrap;
  margin:.35rem 0
}
.tool-result-badge{
  font-size:.72rem;
  border-radius:999px;
  padding:.2rem .4rem;
  background:#edf2f0
}
@media(max-width:520px){
  .tool-result-card.with-photo{
    grid-template-columns:88px minmax(0,1fr)
  }
  .tool-result-photo,
  .tool-result-photo-placeholder{
    width:88px;
    height:72px
  }
}


.button-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:.58rem .85rem;
  border-radius:9px;
  border:1px solid #245b45;
  background:#245b45;
  color:#fff;
  text-decoration:none;
  font:inherit;
  font-weight:600;
  box-sizing:border-box
}
.button-link.secondary{
  background:#fff;
  color:#245b45
}
.help-page{
  max-width:1050px;
  margin:0 auto;
  padding:1.25rem
}
.help-hero,
.help-beta{
  background:#fff;
  border:1px solid #dce5e1;
  border-radius:14px;
  padding:1.25rem;
  margin-bottom:1rem
}
.help-hero h2,
.help-beta h2{
  margin-top:0
}
.help-principles{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.8rem;
  margin-top:1rem
}
.help-principles>div{
  background:#f4f7f6;
  border-radius:10px;
  padding:.85rem
}
.help-principles p{
  margin:.35rem 0 0
}
.help-toc{
  display:flex;
  gap:.45rem;
  flex-wrap:wrap;
  margin:0 0 1rem
}
.help-toc a{
  text-decoration:none;
  color:#245b45;
  background:#fff;
  border:1px solid #d4dfda;
  border-radius:999px;
  padding:.42rem .65rem
}
.help-sections{
  display:grid;
  gap:.85rem
}
.help-card{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:.9rem;
  background:#fff;
  border:1px solid #dce5e1;
  border-radius:14px;
  padding:1rem;
  scroll-margin-top:1rem
}
.help-card h2{
  margin:.05rem 0 .45rem
}
.help-card h3{
  margin:1rem 0 .35rem;
  font-size:1rem
}
.help-card p{
  line-height:1.55
}
.help-card ol{
  margin:.3rem 0 .8rem;
  padding-left:1.25rem
}
.help-card li{
  margin:.35rem 0;
  line-height:1.5
}
.help-number{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#edf3f0;
  color:#245b45;
  font-weight:700
}
.help-usecase{
  margin-top:.8rem;
  padding:.7rem .8rem;
  background:#f4f7f6;
  border-radius:9px
}
.help-note{
  color:#586760;
  border-left:3px solid #cbd8d2;
  padding-left:.75rem
}
.help-status-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem;
  margin-top:.8rem
}
.help-status-grid>div{
  border:1px solid #e0e7e3;
  border-radius:9px;
  padding:.75rem
}
.help-status-grid .legend-dot{
  display:inline-block;
  margin-right:.4rem
}
.help-status-grid p{
  margin:.35rem 0 0
}
.help-beta{
  margin-top:1rem
}
@media(max-width:720px){
  .help-principles,
  .help-status-grid{
    grid-template-columns:1fr
  }
  .help-page{
    padding:.8rem
  }
  .help-card{
    grid-template-columns:34px minmax(0,1fr);
    padding:.8rem
  }
  .help-number{
    width:30px;
    height:30px
  }
}