:root {
  --paper: #f3efe5;
  --paper-deep: #e8e0d0;
  --ink: #17211d;
  --muted: #667069;
  --rule: rgba(23,33,29,.17);
  --red: #a23b2a;
  --red-dark: #76291e;
  --blue: #244d62;
  --gold: #b88324;
  --white: #fffdf8;
  --shadow: 0 18px 50px rgba(31,38,33,.12);
  --radius: 22px;
  --measure: 72rem;
  font-synthesis: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 10% 0%, rgba(184,131,36,.10), transparent 32rem),
    linear-gradient(180deg, #f7f3ea 0, var(--paper) 38rem, #eee8dc 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .17em; }
a:hover { color: var(--red-dark); }
button, input, select { font: inherit; }
button { cursor: pointer; }
img, svg { display: block; max-width: 100%; }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; left: 1rem; top: 1rem; z-index: 99; transform: translateY(-200%);
  background: var(--ink); color: white; padding: .7rem 1rem; border-radius: .5rem;
}
.skip-link:focus { transform: none; }
.site-header {
  position: relative; z-index: 5; display: flex; justify-content: space-between; align-items: center;
  width: min(calc(100% - 2rem), var(--measure)); margin: 0 auto; padding: 1.1rem 0;
  border-bottom: 1px solid var(--rule);
}
.brand { display: flex; align-items: center; gap: .8rem; text-decoration: none; font-weight: 750; letter-spacing: -.02em; }
.brand-mark { width: 2rem; height: 2rem; border: 1.5px solid var(--ink); border-radius: 50%; display:grid; place-items:center; font-family: Georgia, serif; }
.header-tools { display: flex; align-items: center; gap: .7rem; }
.lang-link, .quiet-button {
  display: inline-flex; align-items: center; gap: .35rem; min-height: 2.35rem; padding: .42rem .72rem;
  border: 1px solid var(--rule); border-radius: 999px; background: rgba(255,253,248,.55); text-decoration: none;
  color: var(--ink);
}
.quiet-button:hover, .lang-link:hover { background: var(--white); border-color: rgba(23,33,29,.35); }
.hero {
  width: min(calc(100% - 2rem), var(--measure)); margin: 0 auto; padding: clamp(3rem, 7vw, 7.5rem) 0 3rem;
  display: grid; grid-template-columns: minmax(0,1.2fr) minmax(18rem,.8fr); gap: clamp(2rem, 6vw, 6rem); align-items: center;
}
.eyebrow { margin: 0 0 1rem; color: var(--red); font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
h1, h2, h3, .serif { font-family: Georgia, "Times New Roman", serif; font-weight: 500; letter-spacing: -.035em; }
h1 { margin: 0; max-width: 13ch; font-size: clamp(3.2rem, 8vw, 7.3rem); line-height: .91; }
.deck { max-width: 39rem; margin: 1.6rem 0 0; font-family: Georgia, serif; font-size: clamp(1.22rem, 2.3vw, 1.72rem); line-height: 1.33; color: #37413c; }
.hero-map-wrap { position: relative; min-height: 25rem; display:grid; place-items:center; }
.hero-map-wrap::before { content:""; position:absolute; width: 80%; aspect-ratio:1; border-radius:50%; background:rgba(162,59,42,.07); filter:blur(2px); }
.hero-map { position:relative; width:100%; overflow:visible; }
.hero-map path { fill: rgba(255,253,248,.68); stroke: var(--ink); stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.map-word { position:absolute; font-family: Georgia, serif; color: var(--red); opacity:.86; }
.map-word.one { top:17%; left:10%; font-size:clamp(1.1rem,2.5vw,2rem); }
.map-word.two { right:4%; top:42%; font-size:clamp(.9rem,2vw,1.45rem); }
.map-word.three { left:28%; bottom:13%; font-size:clamp(.8rem,1.5vw,1.1rem); }
.search-stage {
  width: min(calc(100% - 2rem), 62rem); margin: 0 auto clamp(4rem, 8vw, 8rem); position: relative;
}
.search-card { background: var(--white); border: 1px solid var(--rule); border-radius: var(--radius); padding: clamp(1.2rem, 4vw, 2.3rem); box-shadow: var(--shadow); }
.search-label { display:block; margin-bottom:.55rem; font-size:.9rem; font-weight:750; }
.search-row { display:flex; gap:.6rem; }
.search-shell { position:relative; flex:1; }
#street-search {
  width:100%; height:4rem; border:1.5px solid rgba(23,33,29,.35); border-radius:14px; background:white;
  padding:0 3.1rem 0 1.1rem; color:var(--ink); font-size:1.12rem; outline:none;
}
#street-search:focus { border-color:var(--red); box-shadow:0 0 0 4px rgba(162,59,42,.12); }
.search-icon { position:absolute; right:1.05rem; top:50%; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.primary-button {
  min-width:9rem; border:0; border-radius:14px; background:var(--red); color:white; padding:0 1.25rem; font-weight:780;
}
.primary-button:hover { background:var(--red-dark); }
.primary-button:focus-visible, button:focus-visible, a:focus-visible { outline:3px solid rgba(36,77,98,.42); outline-offset:3px; }
.suggestions {
  position:absolute; top:calc(100% + .45rem); left:0; right:0; z-index:20; margin:0; padding:.35rem;
  list-style:none; background:white; border:1px solid var(--rule); border-radius:14px; box-shadow:var(--shadow); max-height:20rem; overflow:auto;
}
.suggestions[hidden] { display:none; }
.suggestions button { display:flex; justify-content:space-between; gap:1rem; width:100%; border:0; background:transparent; padding:.72rem .8rem; border-radius:10px; text-align:left; color:var(--ink); }
.suggestions button:hover, .suggestions button[aria-selected="true"] { background:#f2ece1; }
.suggestions .count { color:var(--muted); white-space:nowrap; }
.example-row { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; margin-top:.85rem; color:var(--muted); font-size:.86rem; }
.example-chip { border:1px solid var(--rule); border-radius:999px; background:transparent; padding:.35rem .68rem; color:var(--ink); }
.example-chip:hover { background:#f5efe4; }
.data-state { margin-top:1rem; padding:.9rem 1rem; border-left:4px solid var(--gold); background:#fbf4df; border-radius:0 10px 10px 0; font-size:.92rem; }
.data-state strong { display:block; margin-bottom:.15rem; }
.stats-strip { width:min(calc(100% - 2rem), var(--measure)); margin:0 auto 5rem; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.stat { padding:1.45rem clamp(.5rem,3vw,2rem); text-align:center; border-right:1px solid var(--rule); }
.stat:last-child { border-right:0; }
.stat-value { display:block; font-family:Georgia,serif; font-size:clamp(2rem,5vw,4.3rem); line-height:1; letter-spacing:-.04em; }
.stat-label { display:block; margin-top:.55rem; color:var(--muted); font-size:.83rem; }
.section { width:min(calc(100% - 2rem), var(--measure)); margin:0 auto; padding:clamp(3.5rem,8vw,7rem) 0; border-top:1px solid var(--rule); }
.section-heading { display:grid; grid-template-columns:minmax(0,.55fr) minmax(0,1fr); gap:2rem; align-items:end; margin-bottom:2.3rem; }
.section-number { color:var(--red); font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; font-weight:800; }
h2 { margin:.35rem 0 0; font-size:clamp(2.4rem,5.6vw,5.4rem); line-height:.98; }
.section-intro { margin:0; max-width:42rem; font-family:Georgia,serif; font-size:clamp(1.15rem,2.1vw,1.55rem); color:#48514d; }
.measure-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.measure-card { min-height:17rem; padding:1.4rem; border:1px solid var(--rule); border-radius:18px; background:rgba(255,253,248,.55); display:flex; flex-direction:column; }
.measure-no { font-family:Georgia,serif; font-size:2.6rem; color:var(--red); }
.measure-card h3 { margin:auto 0 .6rem; font-size:1.65rem; }
.measure-card p { margin:0; color:var(--muted); }
.ranking-shell { overflow:hidden; border:1px solid var(--rule); border-radius:18px; background:rgba(255,253,248,.75); }
.ranking-tools { display:flex; justify-content:space-between; gap:1rem; padding:1rem; border-bottom:1px solid var(--rule); }
.ranking-tools input, .ranking-tools select { min-height:2.7rem; border:1px solid var(--rule); border-radius:9px; padding:.5rem .75rem; background:white; color:var(--ink); }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:48rem; }
th, td { padding:.85rem 1rem; border-bottom:1px solid var(--rule); text-align:left; vertical-align:middle; }
th { font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); background:rgba(232,224,208,.4); }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#f7f1e7; }
.rank-cell { width:5rem; font-family:Georgia,serif; font-size:1.35rem; color:var(--red); }
.name-button { border:0; padding:0; background:none; text-align:left; color:var(--ink); font-weight:750; }
.metric-bar { display:flex; align-items:center; gap:.65rem; }
.metric-bar i { display:block; height:.42rem; min-width:.2rem; max-width:9rem; background:var(--blue); border-radius:999px; }
.empty-table { padding:3rem 1rem; text-align:center; color:var(--muted); }
.result-panel { margin-top:1.2rem; border:1px solid var(--rule); border-radius:18px; background:var(--ink); color:#f9f5eb; overflow:hidden; }
.result-panel[hidden] { display:none; }
.result-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(22rem,1.1fr); }
.result-copy { padding:clamp(1.4rem,4vw,3rem); }
.result-kicker { color:#e9b85e; font-size:.76rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.result-name { margin:.3rem 0 1.3rem; font-family:Georgia,serif; font-size:clamp(2.5rem,5vw,4.7rem); line-height:.95; letter-spacing:-.04em; }
.result-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin:1.4rem 0; }
.result-metric { border-top:1px solid rgba(255,255,255,.25); padding-top:.7rem; }
.result-metric strong { display:block; font-family:Georgia,serif; font-size:1.8rem; }
.result-metric span { color:#b9c2bd; font-size:.75rem; }
.result-note { color:#d5dbd7; }
.result-map { position:relative; min-height:28rem; background:#d9d1c3; padding:1.2rem; display:grid; place-items:center; }
.result-map svg { width:100%; height:100%; }
.result-map path { fill:#efe8da; stroke:#69716c; stroke-width:1.1; vector-effect:non-scaling-stroke; }
.result-map circle { fill:var(--red); stroke:white; stroke-width:1.2; vector-effect:non-scaling-stroke; opacity:.82; }
.map-legend { position:absolute; right:1rem; bottom:1rem; background:rgba(255,253,248,.92); color:var(--ink); padding:.55rem .7rem; border-radius:9px; font-size:.74rem; }
.bio-card { margin-top:1rem; padding:1rem; border:1px solid rgba(255,255,255,.2); border-radius:12px; background:rgba(255,255,255,.05); }
.bio-card h3 { margin:0 0 .3rem; font-family:inherit; font-size:1rem; letter-spacing:0; font-weight:800; }
.bio-card p { margin:.3rem 0 0; color:#d5dbd7; }
.variants { margin-top:1rem; color:#b9c2bd; font-size:.84rem; }
.method-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.method-card { padding:1.4rem; border:1px solid var(--rule); border-radius:18px; background:rgba(255,253,248,.55); }
.method-card h3 { margin:0 0 .65rem; font-family:inherit; font-size:1rem; letter-spacing:0; font-weight:800; }
.method-card p { margin:.4rem 0; color:var(--muted); }
.warning-card { border-left:5px solid var(--red); }
.download-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; }
.download-card { display:flex; flex-direction:column; min-height:15rem; padding:1.3rem; border:1px solid var(--rule); border-radius:18px; background:var(--white); text-decoration:none; }
.download-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); color:var(--ink); }
.download-card .filetype { color:var(--red); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; font-weight:800; }
.download-card h3 { margin:auto 0 .35rem; font-size:1.55rem; }
.download-card p { margin:0; color:var(--muted); font-size:.9rem; }
.site-footer { margin-top:4rem; background:var(--ink); color:#f6f1e7; }
.footer-inner { width:min(calc(100% - 2rem), var(--measure)); margin:0 auto; padding:3rem 0; display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.footer-title { font-family:Georgia,serif; font-size:2rem; line-height:1.05; }
.footer-small { color:#bdc5c0; font-size:.82rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:.9rem 1.2rem; align-content:start; justify-content:flex-end; }
.footer-links a { color:#f6f1e7; }
.dialog-backdrop { position:fixed; inset:0; z-index:50; background:rgba(10,15,13,.72); display:grid; place-items:center; padding:1rem; }
.dialog-backdrop[hidden] { display:none; }
.dialog { width:min(100%,42rem); max-height:90vh; overflow:auto; background:var(--white); color:var(--ink); border-radius:18px; box-shadow:0 25px 80px rgba(0,0,0,.35); padding:1.4rem; }
.dialog-head { display:flex; justify-content:space-between; gap:1rem; align-items:start; }
.dialog h2 { margin:0; font-size:2.2rem; }
.close-button { border:1px solid var(--rule); background:transparent; border-radius:999px; width:2.3rem; height:2.3rem; }
code { font-family:"SFMono-Regular",Consolas,monospace; font-size:.88em; background:rgba(23,33,29,.08); padding:.1em .3em; border-radius:.3em; }
@media (max-width: 850px) {
  .hero { grid-template-columns:1fr; padding-top:3.5rem; }
  .hero-map-wrap { min-height:19rem; }
  .section-heading { grid-template-columns:1fr; }
  .measure-grid, .download-grid { grid-template-columns:1fr; }
  .result-grid { grid-template-columns:1fr; }
  .method-grid { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
  .brand span:last-child { display:none; }
  .hero { width:min(calc(100% - 1.35rem), var(--measure)); }
  h1 { font-size:clamp(3rem,17vw,5rem); }
  .search-stage, .section, .stats-strip, .site-header { width:calc(100% - 1.35rem); }
  .search-row { flex-direction:column; }
  .primary-button { height:3.4rem; }
  .stats-strip { grid-template-columns:1fr; }
  .stat { border-right:0; border-bottom:1px solid var(--rule); }
  .stat:last-child { border-bottom:0; }
  .result-metrics { grid-template-columns:1fr; }
  .ranking-tools { flex-direction:column; }
  .footer-inner { grid-template-columns:1fr; }
  .footer-links { justify-content:flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}
@media print {
  .site-header, .search-stage, .ranking-tools, .footer-links, .primary-button { display:none !important; }
  body { background:white; }
  .section { break-inside:avoid; }
}