:root {
  --av-bg: #07111f;
  --av-surface: #0d1b2d;
  --av-surface-2: #10243a;
  --av-border: rgba(148, 180, 211, .18);
  --av-text: #edf6ff;
  --av-muted: #9db0c6;
  --av-cyan: #22d3ee;
  --av-blue: #3b82f6;
  --av-green: #22c55e;
  --av-yellow: #facc15;
  --av-orange: #fb923c;
  --av-red: #ef4444;
}
* { box-sizing: border-box; }
.av-body { min-height: 100vh; margin: 0; color: var(--av-text); background: var(--av-bg); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; }
.av-body a { color: inherit; }
.av-site-header { position: relative; z-index: 1000; border-bottom: 1px solid var(--av-border); background: rgba(7, 17, 31, .96); }
.av-site-header__inner { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: 20px; }
.av-brand { display: inline-flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.av-brand__mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 12px; background: linear-gradient(135deg, #0ea5e9, #2563eb); box-shadow: 0 12px 26px -15px #38bdf8; }
.av-brand > span:last-child { display: flex; align-items: baseline; gap: 4px; font-size: .92rem; }
.av-brand strong { color: var(--av-cyan); }
.av-brand small { display: block; margin-left: 7px; color: var(--av-muted); font-size: .58rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.av-site-header nav { display: flex; gap: 8px; }
.av-site-header nav a { padding: 8px 11px; border-radius: 9px; color: #c8d6e5; font-size: .82rem; font-weight: 750; text-decoration: none; }
.av-site-header nav a:hover { color: #fff; background: rgba(34, 211, 238, .1); }

.av-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--av-border); background: radial-gradient(circle at 82% 5%, rgba(37, 99, 235, .28), transparent 35%), linear-gradient(140deg, #07111f, #0b1f37 58%, #08243a); }
.av-hero__mesh { position: absolute; inset: 0; opacity: .2; background-image: linear-gradient(rgba(125, 211, 252, .15) 1px, transparent 1px), linear-gradient(90deg, rgba(125, 211, 252, .15) 1px, transparent 1px); background-size: 40px 40px; mask-image: linear-gradient(90deg, #000, transparent); }
.av-hero__content { position: relative; display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: clamp(30px, 7vw, 90px); padding-top: clamp(48px, 7vw, 88px); padding-bottom: clamp(48px, 7vw, 88px); }
.av-eyebrow, .av-section-kicker { color: var(--av-cyan); font-size: .68rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.av-eyebrow { display: inline-flex; align-items: center; gap: 8px; }
.av-eyebrow .bi-circle-fill { font-size: .45rem; color: var(--av-green); filter: drop-shadow(0 0 7px var(--av-green)); }
.av-hero h1 { max-width: 680px; margin: 14px 0 16px; font-size: clamp(2.25rem, 5vw, 4.35rem); font-weight: 900; line-height: .98; letter-spacing: -.055em; }
.av-hero__copy > p { max-width: 650px; margin: 0; color: #bed0e1; font-size: clamp(1rem, 1.5vw, 1.14rem); line-height: 1.7; }
.av-privacy { display: flex; max-width: 650px; gap: 11px; margin-top: 24px; padding: 13px 15px; border: 1px solid rgba(34, 197, 94, .3); border-radius: 14px; color: #c8f5d7; background: rgba(34, 197, 94, .08); font-size: .78rem; line-height: 1.45; }
.av-privacy i { margin-top: 1px; color: #4ade80; font-size: 1rem; }
.av-search-panel { padding: clamp(20px, 3vw, 32px); border: 1px solid rgba(125, 211, 252, .23); border-radius: 24px; background: rgba(8, 22, 39, .8); box-shadow: 0 30px 70px -40px #000; backdrop-filter: blur(16px); }
.av-search-panel label { display: block; margin-bottom: 9px; color: #dbeafe; font-size: .8rem; font-weight: 800; }
.av-search-row { display: flex; gap: 8px; }
.av-search-input { display: flex; flex: 1; min-width: 0; align-items: center; gap: 9px; padding: 0 13px; border: 1px solid var(--av-border); border-radius: 13px; background: #071421; }
.av-search-input:focus-within { border-color: var(--av-cyan); box-shadow: 0 0 0 3px rgba(34, 211, 238, .1); }
.av-search-input i { color: var(--av-cyan); }
.av-search-input input { width: 100%; min-width: 0; padding: 14px 0; border: 0; outline: 0; color: #fff; background: transparent; }
.av-search-input input::placeholder { color: #7389a0; }
.av-search-row > button, .av-dashboard__actions button { border: 0; border-radius: 12px; color: #04111e; background: linear-gradient(135deg, var(--av-cyan), #60a5fa); font-weight: 900; }
.av-search-row > button { display: inline-flex; align-items: center; gap: 7px; padding: 0 18px; }
.av-location-button { margin-top: 11px; padding: 7px 0; border: 0; color: #9bd8f4; background: transparent; font-size: .78rem; font-weight: 750; }
.av-location-button:hover { color: #fff; }
.av-search-status { min-height: 18px; margin-top: 7px; color: var(--av-muted); font-size: .72rem; }
.av-search-results { display: grid; gap: 6px; max-height: 245px; margin-top: 10px; overflow: auto; }
.av-search-result { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; width: 100%; padding: 10px 12px; border: 1px solid var(--av-border); border-radius: 10px; color: #e8f3ff; text-align: left; background: #0c1b2b; }
.av-search-result:hover { border-color: #38bdf8; background: #10263d; }
.av-search-result i:first-child { color: var(--av-cyan); }
.av-search-result strong, .av-search-result small { display: block; }
.av-search-result small { color: var(--av-muted); font-size: .68rem; }

.av-workspace { padding-top: 38px; padding-bottom: 25px; }
.av-producer-notice { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 20px; padding: 16px 18px; border: 1px solid rgba(34, 211, 238, .32); border-radius: 16px; color: #d9f8ff; background: linear-gradient(135deg, rgba(34, 211, 238, .1), rgba(59, 130, 246, .07)); }
.av-producer-notice__icon { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 11px; color: #061321; background: var(--av-cyan); }
.av-producer-notice strong { display: block; color: #fff; font-size: .84rem; }
.av-producer-notice p { margin: 4px 0 0; color: #b9d8e8; font-size: .72rem; line-height: 1.55; }
.av-map-card, .av-panel, .av-dashboard, .av-loading, .av-error { border: 1px solid var(--av-border); border-radius: 20px; background: var(--av-surface); box-shadow: 0 24px 55px -45px #000; }
.av-map-card { overflow: hidden; }
.av-map-card__head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px; }
.av-map-card h2, .av-section-heading h2 { margin: 3px 0 0; font-size: 1.24rem; font-weight: 900; letter-spacing: -.025em; }
.av-legend { display: flex; flex-wrap: wrap; gap: 13px; color: var(--av-muted); font-size: .68rem; }
.av-legend span { display: inline-flex; align-items: center; gap: 6px; }
.av-dot { width: 8px; height: 8px; border-radius: 50%; }
.av-dot--quake { background: #a78bfa; }
.av-dot--alert { background: var(--av-orange); }
.av-dot--fire { background: var(--av-red); }
#av-map { z-index: 1; width: 100%; height: clamp(350px, 48vw, 560px); background: #0b1a2b; }
.av-map-status { padding: 9px 16px; color: var(--av-muted); background: #091624; font-size: .7rem; }
.leaflet-container { font-family: inherit; }
.leaflet-popup-content-wrapper, .leaflet-popup-tip { color: #eaf5ff; background: #0c1b2c; }
.av-popup { min-width: 180px; font-size: .75rem; line-height: 1.45; }
.av-popup strong { display: block; margin-bottom: 3px; color: #fff; }
.av-popup a { color: #67e8f9; }

.av-dashboard { margin-top: 24px; padding: clamp(18px, 3vw, 28px); }
.av-dashboard__head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.av-dashboard__head h2 { margin: 3px 0; font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 900; letter-spacing: -.04em; }
.av-dashboard__head p { margin: 0; color: var(--av-muted); font-size: .72rem; }
.av-dashboard__actions { display: flex; align-items: center; gap: 8px; }
.av-dashboard__actions label { color: var(--av-muted); font-size: .7rem; }
.av-dashboard__actions select { padding: 9px 26px 9px 10px; border: 1px solid var(--av-border); border-radius: 9px; color: #fff; background: #081522; }
.av-dashboard__actions button { min-height: 38px; padding: 0 12px; }
#av-refresh { width: 38px; padding: 0; }
.av-overall { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 13px 16px; border-radius: 14px; background: rgba(148, 163, 184, .09); }
.av-overall__signal { width: 12px; height: 12px; border-radius: 50%; box-shadow: 0 0 0 5px rgba(255,255,255,.05); }
.av-overall strong { display: block; font-size: .9rem; }
.av-overall small { color: var(--av-muted); }
.av-overall--green .av-overall__signal { background: var(--av-green); }
.av-overall--yellow .av-overall__signal { background: var(--av-yellow); }
.av-overall--orange .av-overall__signal { background: var(--av-orange); }
.av-overall--red .av-overall__signal { background: var(--av-red); }
.av-overall--unknown .av-overall__signal { background: #94a3b8; }
.av-risk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.av-risk-card { position: relative; min-height: 154px; overflow: hidden; padding: 15px; border: 1px solid var(--av-border); border-radius: 16px; background: var(--av-surface-2); }
.av-risk-card::after { position: absolute; right: -24px; bottom: -35px; width: 95px; height: 95px; border-radius: 50%; background: currentColor; opacity: .05; content: ""; }
.av-risk-card__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.av-risk-card__icon { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 10px; background: currentColor; }
.av-risk-card__icon i { color: #07111f; }
.av-risk-card__level { padding: 4px 7px; border-radius: 99px; color: currentColor; background: rgba(255,255,255,.06); font-size: .57rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.av-risk-card h3 { margin: 12px 0 2px; color: #fff; font-size: .78rem; }
.av-risk-card__value { margin: 0; color: #fff; font-size: 1.35rem; font-weight: 900; }
.av-risk-card__detail { margin: 4px 0 0; color: var(--av-muted); font-size: .64rem; line-height: 1.4; }
.av-risk-card--green { color: var(--av-green); }
.av-risk-card--yellow { color: var(--av-yellow); }
.av-risk-card--orange { color: var(--av-orange); }
.av-risk-card--red { color: var(--av-red); }
.av-risk-card--unknown { color: #94a3b8; }

.av-reading-guide { margin-top: 14px; padding: 15px; border: 1px solid rgba(125, 211, 252, .2); border-radius: 16px; background: rgba(14, 165, 233, .055); }
.av-reading-guide__head { display: flex; align-items: flex-start; gap: 9px; }
.av-reading-guide__head > i { margin-top: 1px; color: var(--av-cyan); }
.av-reading-guide h3 { margin: 0; color: #e8f6ff; font-size: .82rem; font-weight: 900; }
.av-reading-guide__head p { margin: 3px 0 0; color: var(--av-muted); font-size: .66rem; }
.av-reading-guide__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }
.av-reading-guide__grid p { margin: 0; padding: 10px 11px; border: 1px solid rgba(148, 180, 211, .12); border-radius: 11px; background: rgba(7, 17, 31, .42); }
.av-reading-guide__grid strong, .av-reading-guide__grid span { display: block; }
.av-reading-guide__grid strong { color: #eaf6ff; font-size: .68rem; }
.av-reading-guide__grid span { margin-top: 3px; color: var(--av-muted); font-size: .61rem; line-height: 1.45; }

.av-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.av-panel { min-width: 0; padding: 15px; }
.av-panel--wide { grid-column: 1 / -1; }
.av-panel h3 { margin: 0 0 10px; color: #dcecff; font-size: .78rem; font-weight: 800; }
.av-panel h3 i { margin-right: 5px; color: var(--av-cyan); }
.av-chart { position: relative; height: 235px; }
.av-chart--small { height: 180px; }
.av-panel__note { margin: 9px 0 0; color: var(--av-muted); font-size: .62rem; }
.av-nearby-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
.av-nearby { padding: 15px; border: 1px solid var(--av-border); border-radius: 15px; background: #0a1929; }
.av-nearby h3 { margin: 0 0 9px; font-size: .8rem; }
.av-nearby ul { margin: 0; padding: 0; list-style: none; }
.av-nearby li { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-top: 1px solid rgba(148,163,184,.1); color: #d7e5f3; font-size: .68rem; }
.av-nearby li span:last-child { color: var(--av-muted); white-space: nowrap; }
.av-warnings { margin-top: 13px; padding: 11px 13px; border: 1px solid rgba(250,204,21,.25); border-radius: 11px; color: #fde68a; background: rgba(250,204,21,.06); font-size: .69rem; }
.av-sources { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 14px; color: var(--av-muted); font-size: .65rem; }
.av-sources a { padding: 4px 8px; border: 1px solid var(--av-border); border-radius: 99px; color: #bfe8f9; text-decoration: none; }
.av-ephemeral { margin: 14px 0 0; color: #8fa4ba; font-size: .63rem; }
.av-ephemeral i { margin-right: 5px; color: #4ade80; }
.av-loading { display: flex; align-items: center; gap: 14px; margin-top: 20px; padding: 18px; }
.av-loading strong, .av-loading small { display: block; }
.av-loading small { margin-top: 3px; color: var(--av-muted); }
.av-spinner { width: 28px; height: 28px; border: 3px solid rgba(125,211,252,.2); border-top-color: var(--av-cyan); border-radius: 50%; animation: av-spin .8s linear infinite; }
@keyframes av-spin { to { transform: rotate(360deg); } }
.av-error { margin-top: 20px; padding: 14px 16px; border-color: rgba(239,68,68,.3); color: #fecaca; background: rgba(239,68,68,.08); }

.av-cities, .av-explainer { padding-top: 50px; padding-bottom: 50px; }
.av-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 25px; margin-bottom: 18px; }
.av-section-heading p { max-width: 420px; margin: 0; color: var(--av-muted); font-size: .75rem; text-align: right; }
.av-city-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.av-city-grid a { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 9px; padding: 13px; border: 1px solid var(--av-border); border-radius: 14px; color: #eaf4ff; background: var(--av-surface); text-decoration: none; transition: transform .2s, border-color .2s; }
.av-city-grid a:hover { transform: translateY(-2px); border-color: rgba(34,211,238,.6); }
.av-city-grid a > span { display: grid; grid-row: 1 / 3; width: 34px; height: 34px; place-items: center; border-radius: 10px; color: var(--av-cyan); background: rgba(34,211,238,.08); }
.av-city-grid strong { font-size: .76rem; }
.av-city-grid small { grid-column: 2; color: var(--av-muted); font-size: .6rem; }
.av-capital-tag { display: inline-block; margin-left: 6px; padding: 2px 5px; border-radius: 99px; color: #7dd3fc; background: rgba(34, 211, 238, .09); font-size: .5rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.av-city-grid a > i { grid-column: 3; grid-row: 1 / 3; color: #668098; font-size: .7rem; }
.av-all-cities { display: inline-flex; align-items: center; gap: 7px; margin-top: 16px; color: var(--av-cyan); font-size: .75rem; font-weight: 800; text-decoration: none; }
.av-location-seo { margin-top: 15px; margin-bottom: 40px; padding-top: 30px; padding-bottom: 30px; border-top: 1px solid var(--av-border); border-bottom: 1px solid var(--av-border); }
.av-location-seo h2 { margin: 6px 0 12px; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 900; letter-spacing: -.035em; }
.av-location-seo p { max-width: 900px; color: var(--av-muted); font-size: .8rem; line-height: 1.75; }
.av-city-directory { padding-top: 55px; padding-bottom: 70px; }
.av-city-directory header { max-width: 760px; margin-bottom: 28px; }
.av-city-directory h1 { margin: 11px 0; font-size: clamp(2rem, 5vw, 3.6rem); font-weight: 900; letter-spacing: -.05em; }
.av-city-directory header p, .av-directory-note { color: var(--av-muted); line-height: 1.7; }
.av-city-directory .av-directory-stats { margin-top: 12px; color: #bfe9f7; font-size: .76rem; }
.av-directory-stats strong { color: #fff; }
.av-city-grid--directory { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.av-directory-note { margin-top: 22px; font-size: .76rem; }
.av-directory-note a { color: var(--av-cyan); }
.av-explainer { display: grid; grid-template-columns: 1fr .9fr; gap: 70px; align-items: center; border-top: 1px solid var(--av-border); }
.av-explainer h2 { margin: 6px 0 12px; font-size: clamp(1.5rem, 3vw, 2.35rem); font-weight: 900; letter-spacing: -.045em; }
.av-explainer p { color: var(--av-muted); line-height: 1.7; }
.av-explainer a { color: var(--av-cyan); font-size: .78rem; font-weight: 800; text-decoration: none; }
.av-explainer ol { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.av-explainer li { display: flex; align-items: center; gap: 13px; padding: 13px; border: 1px solid var(--av-border); border-radius: 14px; background: var(--av-surface); }
.av-explainer li > span { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: 10px; color: #05101c; background: var(--av-cyan); font-weight: 900; }
.av-explainer strong, .av-explainer small { display: block; }
.av-explainer strong { font-size: .75rem; }
.av-explainer small { color: var(--av-muted); font-size: .64rem; }

.av-footer { margin-top: 25px; padding: 35px 0 24px; border-top: 1px solid var(--av-border); color: var(--av-muted); background: #06101d; font-size: .7rem; }
.av-footer__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.av-footer strong { color: #e4f1ff; }
.av-footer p { margin: 6px 0 0; }
.av-footer a { color: #9ee7f7; }
.av-footer__warning { margin-top: 22px !important; padding-top: 15px; border-top: 1px solid var(--av-border); }

.av-methodology { max-width: 960px; padding-top: 55px; padding-bottom: 65px; }
.av-methodology > header { margin-bottom: 30px; }
.av-methodology h1 { margin: 12px 0; font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 900; letter-spacing: -.05em; }
.av-methodology > header p { max-width: 760px; color: var(--av-muted); line-height: 1.7; }
.av-methodology > .av-producer-notice { margin-bottom: 18px; }
.av-method-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 14px 0; }
.av-method-card { margin-bottom: 14px; padding: clamp(18px, 3vw, 28px); border: 1px solid var(--av-border); border-radius: 18px; background: var(--av-surface); }
.av-method-card h2 { margin: 0 0 14px; font-size: 1.1rem; font-weight: 900; }
.av-method-card p, .av-method-card li, .av-method-card dd { color: #b3c4d5; font-size: .78rem; line-height: 1.65; }
.av-method-card code { color: #67e8f9; }
.av-method-card dt { margin-top: 8px; color: #eaf4ff; font-size: .78rem; }
.av-level-list { display: grid; gap: 10px; padding: 0; list-style: none; }
.av-level-list li { display: flex; align-items: center; gap: 9px; }
.av-level { width: 10px; height: 10px; flex: 0 0 auto; border-radius: 50%; }
.av-level--green { background: var(--av-green); }.av-level--yellow { background: var(--av-yellow); }.av-level--orange { background: var(--av-orange); }.av-level--red { background: var(--av-red); }.av-level--unknown { background: #94a3b8; }
.av-back { display: inline-flex; gap: 8px; margin-top: 8px; color: var(--av-cyan); font-size: .8rem; font-weight: 800; text-decoration: none; }

@media (max-width: 992px) {
  .av-hero__content { grid-template-columns: 1fr; }
  .av-risk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .av-city-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .av-city-grid--directory { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .av-explainer { gap: 35px; }
  .av-reading-guide__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .av-site-header__inner { min-height: 56px; }
  .av-brand small { display: none; }
  .av-site-header nav a:first-child { display: none; }
  .av-hero__content { padding-top: 42px; padding-bottom: 42px; }
  .av-hero h1 { font-size: 2.45rem; }
  .av-search-row { display: grid; }
  .av-search-row > button { justify-content: center; min-height: 45px; }
  .av-map-card__head, .av-dashboard__head, .av-section-heading { align-items: start; flex-direction: column; }
  .av-legend { gap: 8px; }
  #av-map { height: 390px; }
  .av-dashboard__actions { width: 100%; flex-wrap: wrap; }
  .av-dashboard__actions #av-share { flex: 1; }
  .av-risk-grid, .av-chart-grid, .av-nearby-grid, .av-method-grid, .av-footer__grid, .av-explainer, .av-reading-guide__grid { grid-template-columns: 1fr; }
  .av-panel--wide { grid-column: auto; }
  .av-city-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .av-city-grid--directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .av-section-heading p { text-align: left; }
  .av-explainer { gap: 25px; }
}
@media (max-width: 460px) {
  .av-brand > span:last-child { font-size: .78rem; }
  .av-site-header nav a { font-size: .7rem; }
  .av-risk-grid, .av-city-grid { grid-template-columns: 1fr; }
  .av-city-grid--directory { grid-template-columns: 1fr; }
  .av-producer-notice { padding: 14px; }
}
