/* ParzellenScout — Design-System "Schweizer Katasterauszug" (CLAUDE.md §5).
   Papierweiss, Haarlinien, Mono-Werte, Schweizer Rot nur als Akzent. */
:root{
  --paper:#FAFAF7;
  --panel:#FFFFFF;
  --ink:#1A1C1E;
  --muted:#6E6E66;
  --line:#DCDAD1;
  --swiss:#DA291C;
  --topo:#005EA8;
  --ok:#2F6B4F;
  --radius:2px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--paper);
  color:var(--ink);
  display:flex;
  overflow:hidden;
}
/* ---------- Panel ---------- */
#panel{
  width:400px;
  min-width:400px;
  height:100vh;
  background:var(--panel);
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  z-index:1000;
}
header{
  padding:20px 22px 16px;
  border-bottom:1px solid var(--line);
}
.brand{
  display:flex;
  align-items:baseline;
  gap:8px;
}
.brand h1{
  font-family:'Archivo',sans-serif;
  font-variation-settings:"wdth" 115;
  font-weight:750;
  font-size:20px;
  letter-spacing:-0.01em;
  text-transform:uppercase;
}
.brand .cross{
  color:var(--swiss);
  font-weight:800;
}
.brand small{
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  color:var(--muted);
  letter-spacing:0.08em;
  text-transform:uppercase;
}
.searchwrap{position:relative;margin-top:14px}
#search{
  width:100%;
  padding:10px 12px;
  font-family:'IBM Plex Mono',monospace;
  font-size:13px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--paper);
  outline:none;
}
#search:focus{border-color:var(--swiss);box-shadow:0 0 0 2px rgba(218,41,28,.12)}
#suggest{
  position:absolute;top:100%;left:0;right:0;
  background:var(--panel);
  border:1px solid var(--ink);
  border-top:none;
  max-height:240px;overflow-y:auto;
  display:none;
  z-index:1200;
}
#suggest div{
  padding:9px 12px;font-size:13px;cursor:pointer;
  border-bottom:1px solid var(--line);
}
#suggest div:last-child{border-bottom:none}
#suggest div:hover,#suggest div.active{background:var(--paper)}
#suggest b{color:var(--swiss);font-weight:600}
.hint{
  margin-top:10px;
  font-size:12px;
  color:var(--muted);
  line-height:1.5;
}
.visually-hidden{
  position:absolute;
  width:1px;height:1px;
  margin:-1px;padding:0;border:0;
  clip:rect(0 0 0 0);
  overflow:hidden;
  white-space:nowrap;
}
/* Abdeckungs-Übersicht (erfasste Baureglemente) */
.coverage-btn{
  display:block;
  margin-top:10px;
  padding:0;
  border:none;
  background:none;
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--topo);
  cursor:pointer;
}
.coverage-btn .caret{display:inline-block;transition:transform .15s}
.coverage-btn[aria-expanded="true"] .caret{transform:rotate(180deg)}
#coveragePanel{
  margin-top:8px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--paper);
}
#coveragePanel .cov-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:10px;
  width:100%;
  padding:8px 10px;
  border:none;
  border-bottom:1px solid var(--line);
  background:none;
  font-size:12px;
  text-align:left;
  cursor:pointer;
}
#coveragePanel .cov-row:last-child{border-bottom:none}
#coveragePanel .cov-row:hover{background:var(--panel)}
#coveragePanel .cov-row .stand{
  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;
  color:var(--muted);
  flex-shrink:0;
}
#coveragePanel .cov-offen{
  padding:8px 10px;
  font-size:10.5px;
  color:var(--muted);
  line-height:1.6;
  border-top:1px solid var(--line);
}
/* ---------- Results ---------- */
#results{
  flex:1;
  overflow-y:auto;
  padding:0 22px 24px;
}
.empty{
  padding:48px 0;
  text-align:center;
  color:var(--muted);
  font-size:13px;
  line-height:1.7;
}
.empty .crosshair{
  font-family:'IBM Plex Mono',monospace;
  font-size:28px;
  color:var(--swiss);
  display:block;
  margin-bottom:12px;
}
section.card{
  margin-top:20px;
}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted);
  padding-bottom:6px;
  border-bottom:2px solid var(--ink);
  display:flex;
  justify-content:space-between;
  align-items:baseline;
}
.eyebrow .src{color:var(--topo);letter-spacing:0.04em}
.row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding:8px 0;
  border-bottom:1px solid var(--line);
  font-size:13px;
}
.row .k{color:var(--muted);flex-shrink:0}
.row .v{
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;
  font-weight:500;
  text-align:right;
  word-break:break-word;
}
.row .v.big{font-size:15px;font-weight:600}
.stamp{
  margin-top:20px;
  padding:12px 14px;
  border:1px solid var(--ink);
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  line-height:1.8;
  color:var(--ink);
  background:var(--paper);
  position:relative;
}
.stamp::after{
  content:"LV95";
  position:absolute;
  top:-8px;right:10px;
  background:var(--panel);
  padding:0 6px;
  font-size:9px;
  letter-spacing:0.15em;
  color:var(--swiss);
  font-weight:600;
}
.badge{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  font-weight:600;
  padding:3px 8px;
  border-radius:var(--radius);
  background:var(--ink);
  color:#fff;
}
.badge.zone{background:var(--ok)}
.badge.warn{background:var(--swiss)}
.gap{
  margin-top:20px;
  border:1px dashed var(--swiss);
  padding:14px;
  font-size:12.5px;
  line-height:1.6;
}
.gap h3{
  font-family:'Archivo',sans-serif;
  font-variation-settings:"wdth" 110;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:0.03em;
  color:var(--swiss);
  margin-bottom:6px;
}
.gap label,.regl label{
  display:block;
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--muted);
  margin:12px 0 4px;
}
.gap input,.regl input{
  width:100%;
  padding:8px 10px;
  font-family:'IBM Plex Mono',monospace;
  font-size:13px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--panel);
}
.gap .calcout,.regl .calcout{
  margin-top:10px;
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  line-height:1.9;
  display:none;
}
.gap .calcout b,.regl .calcout b{font-size:14px}
.zsel{
  max-width:200px;
  padding:6px 8px;
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--panel);
}
/* Ausschöpfungs-Balken (Restpotenzial) */
.meter{
  height:10px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--paper);
  margin-top:4px;
}
.meter-fill{height:100%;background:var(--ink)}
.meter-fill.over{background:var(--swiss)}
.links{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.links a{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  text-decoration:none;
  color:var(--ink);
  font-size:12.5px;
  font-weight:500;
  transition:background .12s;
}
.links a:hover{background:var(--paper)}
.links a span.arrow{font-family:'IBM Plex Mono',monospace;color:var(--swiss)}
.printbtn{
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:100%;
  margin-top:20px;
  padding:10px 12px;
  border:1px solid var(--ink);
  border-radius:var(--radius);
  background:var(--panel);
  font-family:'Inter',sans-serif;
  font-size:12.5px;
  font-weight:500;
  color:var(--ink);
  cursor:pointer;
  transition:background .12s;
}
.printbtn:hover{background:var(--paper)}
.printbtn .arrow{font-family:'IBM Plex Mono',monospace;color:var(--swiss)}
.printbtn + .printbtn{margin-top:8px}
.loading{
  padding:32px 0;
  text-align:center;
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  color:var(--muted);
}
.loading .dot{animation:blink 1s infinite}
@keyframes blink{0%,100%{opacity:.2}50%{opacity:1}}
footer{
  padding:12px 22px;
  border-top:1px solid var(--line);
  font-size:10.5px;
  color:var(--muted);
  line-height:1.5;
}
/* ---------- Map ---------- */
#map{flex:1;height:100vh;cursor:crosshair;background:#E8E8E2}
.maptools{
  position:absolute;
  top:14px;right:14px;
  z-index:900;
  display:flex;
  gap:6px;
}
.chip{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  font-weight:500;
  padding:8px 12px;
  background:var(--panel);
  border:1px solid var(--ink);
  border-radius:var(--radius);
  color:var(--ink);
  cursor:pointer;
  user-select:none;
}
.chip.on{background:var(--ink);color:#fff}
.leaflet-container{font-family:'Inter',sans-serif}
/* Sichtbare Fokuszustände (Tastatur) — Kritisch für a11y */
:focus-visible{
  outline:2px solid var(--swiss);
  outline-offset:1px;
}
#search:focus-visible{outline:none} /* hat eigenen Fokus-Stil */
@media (prefers-reduced-motion: reduce){
  .loading .dot{animation:none}
  .coverage-btn .caret{transition:none}
  *{transition-duration:0.01ms !important}
}
/* Fussnote: auf Mobile einklappbar (spart Platz für die Analyse) */
footer .foot-toggle{
  display:none;
  width:100%;
  padding:0;
  border:none;
  background:none;
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--muted);
  text-align:left;
  cursor:pointer;
}
/* ---------- Mobile ---------- */
@media (max-width:760px){
  body{flex-direction:column-reverse}
  /* dvh = stabile Höhe trotz ein-/ausblendender Browser-Leiste */
  #panel{width:100%;min-width:0;height:62vh;height:62dvh;border-right:none;border-top:1px solid var(--line)}
  #map{height:38vh;height:38dvh}
  header{padding:10px 16px 8px}
  .brand h1{font-size:17px}
  .searchwrap{margin-top:10px}
  .hint{margin-top:8px}
  body.has-results .hint{display:none} /* nach der ersten Analyse: Platz für Resultate */
  #results{padding:0 16px 16px}
  section.card{margin-top:14px}
  footer{padding:8px 16px}
  footer .foot-full{display:none}
  footer .foot-toggle{display:block}
  footer.open .foot-full{display:block;margin-top:6px}
}
/* ---------- Print / PDF-Report ---------- */
@media print{
  @page{size:A4;margin:12mm}
  body{display:block;overflow:visible;background:#fff}
  #map,.maptools,.searchwrap,.hint,#suggest,.links,.printbtn,.no-print{display:none !important}
  footer .foot-full{display:block !important} /* Disclaimer gehört in den Report */
  footer .foot-toggle{display:none !important}
  #panel{width:100%;min-width:0;height:auto;border:none}
  #results{overflow:visible;padding:0}
  section.card,.gap,.regl,.stamp{break-inside:avoid}
  header{border-bottom:2px solid var(--ink)}
  footer{margin-top:8mm}
}