@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@300;400;500;600&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=IBM+Plex+Mono:wght@300;400;500&display=swap');

:root{
  --bg:#f2f0e9;
  --panel:#faf9f3;
  --ink:#1a1c18;
  --muted:#6a6c62;
  --faint:#8f9186;
  --line:rgba(26,28,24,.14);
  --accent:#3f5a44;
  --accent-deep:#0d4d3c;
  --onAccent:#f2f0e9;

  --glass:rgba(250,249,243,.55);
  --glass-line:rgba(255,255,255,.55);
  --glass-blur:blur(16px) saturate(1.3);
  --glass-shadow:0 8px 30px rgba(26,28,24,.08),inset 0 1px 0 var(--glass-line);

  --hi:#b0432e; --mod:#b07a1e; --low:#3f6f4a; --unk:#8f9186;
  --hi-tint:#f6e7e2; --mod-tint:#f7efdd; --low-tint:#e7f0e8; --unk-tint:#eeefe9;
  --hi-line:#e3b9ad; --mod-line:#e3cfa0; --low-line:#b8d0bd; --unk-line:#d6d8cf;
}

body{
  margin:0;
  font-family:'Archivo',system-ui,sans-serif;
  color:var(--ink);
  background:var(--bg);
  background-image:
    radial-gradient(60% 50% at 18% 8%,rgba(63,90,68,.16),transparent 70%),
    radial-gradient(55% 45% at 92% 22%,rgba(13,77,60,.14),transparent 72%),
    radial-gradient(70% 60% at 80% 98%,rgba(122,168,140,.16),transparent 70%);
  background-attachment:fixed;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent);color:var(--onAccent)}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}

.container{max-width:820px;margin:0 auto;padding:2rem 1.5rem 3rem}

.site-header{
  display:flex;justify-content:space-between;align-items:center;
  margin-top: calc(-1 * env(safe-area-inset-top));
  padding:calc(1.1rem + env(safe-area-inset-top)) clamp(1.5rem,5vw,2.5rem) 1.1rem;
  border-bottom:1px solid var(--glass-line);
  background:rgba(250,249,243,.6);
  backdrop-filter:var(--glass-blur);
  -webkit-backdrop-filter:var(--glass-blur);
  position:sticky;top:0;z-index:20;
}
.brand{
  font-family:'Cormorant Garamond',serif;
  font-weight:500;font-size:1.6rem;letter-spacing:.02em;
  color:var(--accent-deep);
}
.site-nav a{
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);
}
.site-nav a:hover{color:var(--ink)}

.hero{padding:2.5rem 0 1.5rem;border-bottom:1px solid var(--line);margin-bottom:1.75rem}
.hero h1{
  font-family:'Cormorant Garamond',serif;
  font-weight:500;
  font-size:clamp(2.4rem,6vw,3.6rem);
  line-height:1.04;
  letter-spacing:.005em;
  margin:.1em 0 .35em;
  color:var(--accent-deep);
  text-wrap:balance;
}
.lede{color:var(--muted);font-size:1.08rem;max-width:52ch;margin:0}
.search{
  width:100%;padding:.85rem 1.1rem;font:inherit;font-size:1rem;
  color:var(--ink);background:var(--glass);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-line);border-radius:11px;
  box-shadow:var(--glass-shadow);
  margin:1.4rem 0 .5rem;
}
.search::placeholder{color:var(--faint)}
.search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(63,90,68,.14)}
.updated{
  font-family:'IBM Plex Mono',monospace;
  color:#3f5a44;font-size:.8rem;letter-spacing:.08em;margin:0;text-decoration: underline;
}

.legend{
  display:flex;flex-wrap:wrap;align-items:center;gap:.55rem 1.1rem;
  font-size:.85rem;color:var(--muted);
  margin:1.25rem 0 .5rem;padding:1rem 1.1rem;
  background:var(--glass);border:1px solid var(--glass-line);border-radius:12px;
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  box-shadow:var(--glass-shadow);
}

[class^=badge-],[class*=" badge-"]{
  display:inline-flex;align-items:center;gap:.4em;
  padding:.22em .7em;border-radius:999px;
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;font-weight:500;letter-spacing:.06em;
  color:#fff;white-space:nowrap;vertical-align:middle;
}
[class^=badge-]::before,[class*=" badge-"]::before{
  content:"";width:.5em;height:.5em;border-radius:50%;
  background:currentColor;opacity:.9;
}
.badge-high{background:var(--hi)}
.badge-moderate{background:var(--mod)}
.badge-low{background:var(--low)}
.badge-unknown{background:var(--unk)}

.lake-list{list-style:none;padding:0;margin:1.5rem 0}
.lake-card{margin-bottom:.6rem}
.lake-card a{
  display:flex;gap:.75rem;align-items:center;
  padding:.95rem 1.1rem;
  color:var(--ink);
  background:var(--glass);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-line);
  border-left:4px solid var(--unk);
  border-radius:12px;
  box-shadow:var(--glass-shadow);
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;
}
.lake-card a:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 34px rgba(26,28,24,.12),inset 0 1px 0 var(--glass-line);
  color:var(--ink);
}
.lake-card.level-high a{border-left-color:var(--hi)}
.lake-card.level-moderate a{border-left-color:var(--mod)}
.lake-card.level-low a{border-left-color:var(--low)}
.lake-card.level-unknown a{border-left-color:var(--unk)}
.lake-name{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.35rem;line-height:1.1}
.lake-state{
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;letter-spacing:.12em;color:var(--faint);
}
.lake-level{margin-left:auto}

.crumbs{
  font-family:'IBM Plex Mono',monospace;
  color:var(--muted);font-size:.72rem;letter-spacing:.06em;margin-bottom:1.5rem;
}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--accent)}
.lake-page h1{
  font-family:'Cormorant Garamond',serif;
  font-weight:500;font-size:clamp(2rem,5vw,3rem);line-height:1.06;
  color:var(--accent-deep);margin:.1em 0 .8em;text-wrap:balance;
}

.status-block{
  display:flex;flex-direction:column;gap:.35rem;
  padding:1.4rem 1.5rem;border-radius:14px;
  border:1px solid var(--line);border-left:6px solid var(--unk);
  background:var(--unk-tint);color:var(--ink);
  backdrop-filter:blur(8px) saturate(1.2);-webkit-backdrop-filter:blur(8px) saturate(1.2);
  box-shadow:0 8px 30px rgba(26,28,24,.08),inset 0 1px 0 rgba(255,255,255,.4);
  margin:1rem 0 1.5rem;
}
.status-block.badge-high,.status-block.badge-moderate,
.status-block.badge-low,.status-block.badge-unknown{color:var(--ink)}
.status-block.badge-high{background:var(--hi-tint);border-left-color:var(--hi);border-color:var(--hi-line)}
.status-block.badge-moderate{background:var(--mod-tint);border-left-color:var(--mod);border-color:var(--mod-line)}
.status-block.badge-low{background:var(--low-tint);border-left-color:var(--low);border-color:var(--low-line)}
.status-block.badge-unknown{background:var(--unk-tint);border-left-color:var(--unk);border-color:var(--unk-line)}
.status-block::before{content:none}
.status-label{
  display:inline-block;align-self:flex-start;
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;text-transform:uppercase;letter-spacing:.2em;font-weight:500;
  padding:.22em .7em;border-radius:999px;color:#fff;
}
.status-block.badge-high .status-label{background:var(--hi);color:#fff}
.status-block.badge-moderate .status-label{background:var(--mod);color:#fff}
.status-block.badge-low .status-label{background:var(--low);color:#fff}
.status-block.badge-unknown .status-label{background:var(--unk);color:#fff}
.status-headline{
  overflow-wrap: break-word;
  word-break: break-word;
  max-width: 100%;
  white-space: normal;
  font-family:'Cormorant Garamond',serif;
  font-size:clamp(1.5rem,3.5vw,2rem);font-weight:500;line-height:1.12;margin:.15em 0 0;
  color:var(--ink);
}

.dog-guidance{font-size:1.12rem;line-height:1.7;color:var(--ink);max-width:60ch}

.cta-slot{
  border:1px solid var(--glass-line);border-radius:14px;
  padding:1.5rem;margin:1.75rem 0;text-align:center;
  background:var(--glass);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  box-shadow:var(--glass-shadow);
  display: none;
}
.cta{
  display:inline-block;
  background:var(--accent);color:var(--onAccent);
  padding:.8rem 1.5rem;border-radius:11px;
  font-family:'IBM Plex Mono',monospace;
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;
  transition:background .15s ease;
}
.cta:hover{background:var(--accent-deep);color:var(--onAccent)}
.cta-why{color:var(--muted);font-size:.92rem;line-height:1.6;margin:.9rem auto 0;max-width:46ch}

.verify-note{
  border:1px solid var(--glass-line);border-radius:14px;
  padding:1.25rem 1.4rem;margin:1.75rem 0;
  background:var(--glass);
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  box-shadow:var(--glass-shadow);
}
.verify-note p{color:var(--muted);font-size:.95rem;line-height:1.65;margin:0;max-width:60ch}

.lake-facts{
  display:grid;grid-template-columns:auto 1fr;gap:.55rem 1.4rem;
  margin:1.75rem 0;padding:1.25rem 1.4rem;
  background:var(--glass);border:1px solid var(--glass-line);border-radius:12px;
  backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);
  box-shadow:var(--glass-shadow);
  font-size:.95rem;
}
.lake-facts dt{
  font-family:'IBM Plex Mono',monospace;
  font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);
  align-self:baseline;
}
.lake-facts dd{margin:0;color:var(--ink)}

.context{margin-top:2rem}
.context h2{
  font-family:'Cormorant Garamond',serif;
  font-weight:500;font-size:1.7rem;line-height:1.15;color:var(--accent-deep);margin:0 0 .5em;
}
.context p{color:var(--muted);max-width:64ch}

.site-footer{max-width:820px;margin:2rem auto 0;padding:1.5rem;border-top:1px solid var(--line)}
.disclaimer{
  position:relative;
  background:var(--mod-tint);
  border:1px solid var(--mod-line);
  border-left:5px solid var(--mod);
  border-radius:12px;
  padding:1.1rem 1.25rem 1.1rem 1.25rem;
  color:#5a4415;
  font-size:.92rem;line-height:1.65;
}
.disclaimer::before{
  content:"Screening aid — not a guarantee";
  display:block;
  font-family:'IBM Plex Mono',monospace;
  font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  color:var(--mod);margin-bottom:.45rem;
}
.fineprint{color:var(--faint);font-size:.78rem;line-height:1.6;margin:1rem 0 0}

.home-link{
  background:var(--accent);
  color:#faf9f3;
  font-size:inherit;
  padding:.05em .35em;
  border-radius:3px;
  text-decoration:none;
  white-space:nowrap;
}
.home-link:hover{opacity:.85;color:#faf9f3}

@media (max-width:560px){
  .lake-card a{flex-wrap:wrap}
  .lake-level{margin-left:0}
  .lake-facts{grid-template-columns:1fr}
  .lake-facts dt{margin-top:.5rem}
}