:root {
  color-scheme: dark;
  --bg:#0b1220;
  --bg-2:#111827;
  --panel:#1c2636;
  --panel-2:#222d3e;
  --ink:#f8fafc;
  --muted:#9ca3af;
  --line:#334155;
  --blue:#5973ff;
  --blue-2:#244a91;
  --orange:#ff5a14;
  --cyan:#32d3ff;
  --glow:0 24px 80px rgb(36 74 145 / .34);
}
* { box-sizing: border-box; }
html { min-height:100%; background:var(--bg); }
body {
  margin:0;
  min-height:100%;
  font:15px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 18% 18%, rgb(89 115 255 / .18), transparent 34rem),
    radial-gradient(circle at 85% 82%, rgb(50 211 255 / .10), transparent 30rem),
    linear-gradient(180deg, #0d1524 0%, #0b1220 62%, #080d17 100%);
}
body::before {
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.32;
  background-image:
    radial-gradient(circle, rgb(255 255 255 / .56) 1px, transparent 1.5px),
    linear-gradient(62deg, transparent 0 44%, rgb(148 163 184 / .18) 44.4% 44.7%, transparent 45% 100%);
  background-size:88px 88px, 260px 210px;
  mask-image:linear-gradient(180deg, #000 0%, transparent 80%);
}
a { color:#dbeafe; }
.layout { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 460px; min-height:calc(100vh - 78px); overflow:hidden; padding-top:78px; }
.site-header {
  position:fixed;
  z-index:900;
  inset:0 0 auto 0;
  min-height:78px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:28px;
  padding:16px clamp(18px, 4vw, 52px);
  border-bottom:1px solid rgb(148 163 184 / .16);
  background:rgb(11 18 32 / .94);
  backdrop-filter:blur(18px);
  box-shadow:0 18px 52px rgb(0 0 0 / .22);
}
.site-logo {
  display:inline-flex;
  align-items:center;
  gap:12px;
  color:#fff;
  text-decoration:none;
  font-size:28px;
  font-style:italic;
  font-weight:950;
  letter-spacing:.04em;
  white-space:nowrap;
}
.au-flag {
  flex:0 0 auto;
  width:46px;
  height:auto;
  padding:2px;
  border:1px solid rgb(255 255 255 / .46);
  border-radius:7px;
  background:linear-gradient(135deg, rgb(255 255 255 / .18), rgb(89 115 255 / .10) 48%, rgb(8 43 122 / .34));
  box-shadow:0 0 0 1px rgb(50 211 255 / .16), 0 8px 24px rgb(36 74 145 / .46);
}
.top-nav {
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:clamp(10px, 2vw, 28px);
}
.top-nav-link {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:#cbd5e1;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:12px;
  font-weight:800;
}
.top-nav-link:hover { color:#fff; }
.top-nav-link.primary {
  color:#0b1220;
  background:#fff;
  border-radius:999px;
  padding:11px 15px;
  letter-spacing:.04em;
}
.map-shell { position:relative; min-height:calc(100vh - 78px); padding:22px; }
.brand-bar {
  position:absolute;
  z-index:500;
  top:22px;
  left:22px;
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid rgb(148 163 184 / .24);
  border-radius:999px;
  padding:10px 14px;
  background:rgb(11 18 32 / .76);
  backdrop-filter:blur(14px);
  color:var(--muted);
  box-shadow:var(--glow);
}
.wordmark { color:#fff; font-style:italic; font-weight:950; letter-spacing:.08em; }
#map {
  min-height:calc(100vh - 122px);
  height:calc(100vh - 122px);
  border:1px solid rgb(148 163 184 / .20);
  border-radius:28px;
  background:#0a1020;
  overflow:hidden;
  box-shadow:var(--glow), inset 0 0 80px rgb(36 74 145 / .12);
}
.leaflet-container { background:#0a1020; font:inherit; }
.leaflet-tile { filter:saturate(.72) contrast(1.04) brightness(.76) hue-rotate(180deg); }
.leaflet-control-zoom a { background:#111827; color:#fff; border-color:#334155; }
.leaflet-control-attribution { background:rgb(11 18 32 / .72); color:#94a3b8; }
.leaflet-tooltip {
  background:#111827;
  color:#fff;
  border:1px solid #475569;
  border-radius:999px;
  box-shadow:0 12px 32px rgb(0 0 0 / .34);
}
aside {
  position:relative;
  z-index:2;
  background:linear-gradient(180deg, rgb(17 24 39 / .96), rgb(11 18 32 / .98));
  border-left:1px solid rgb(148 163 184 / .18);
  padding:28px;
  overflow:auto;
  max-height:calc(100vh - 78px);
  box-shadow:-18px 0 58px rgb(0 0 0 / .28);
}
aside::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:16px 0 auto auto;
  width:min(78%, 360px);
  height:210px;
  pointer-events:none;
  opacity:.28;
  background:url('./au-flag.png') right 18px top 14px / contain no-repeat;
  filter:saturate(1.12) brightness(1.08);
  mask-image:linear-gradient(90deg, transparent 0 46%, rgb(0 0 0 / .26) 58%, #000 100%);
}
aside > * { position:relative; z-index:1; }
h1 { margin:0 0 12px; font-size:42px; line-height:1.02; letter-spacing:-.045em; }
h1 span { display:inline-block; padding:0 .18em .04em; font-style:italic; background:linear-gradient(90deg, var(--blue-2), var(--blue)); border-radius:8px; }
h2 { margin:4px 0 12px; font-size:24px; }
p { margin:0 0 14px; }
.muted, .note { color:var(--muted); }
.note { font-size:13px; }
.source { color:#7f8da3; font-size:12px; border-top:1px solid rgb(148 163 184 / .16); padding-top:16px; margin-top:20px; }
.contact-note { color:#c7d2fe; font-size:13px; font-weight:700; margin-top:-4px; }
.state-list {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:6px;
  max-height:calc((48px * 6.5) + (6px * 5.5));
  overflow:auto;
  padding-right:5px;
  scrollbar-color:#334155 transparent;
}
.state-item {
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid rgb(148 163 184 / .18);
  border-radius:16px;
  min-height:48px;
  padding:8px;
  background:linear-gradient(180deg, rgb(34 45 62 / .92), rgb(28 38 54 / .92));
  color:inherit;
  text-align:left;
  cursor:pointer;
  text-decoration:none;
  transition:transform .16s ease, border-color .16s ease, background .16s ease;
}
.state-item:hover, .state-item.active { transform:translateY(-1px); border-color:rgb(89 115 255 / .82); background:linear-gradient(180deg, rgb(42 57 82 / .98), rgb(30 42 64 / .98)); }
.state-item.unconfigured { opacity:.70; }
.number { flex:0 0 26px; display:grid; place-items:center; width:26px; height:26px; border-radius:999px; background:#fff; color:#0b1220; font-weight:900; font-size:12px; }
small { display:block; color:var(--muted); margin-top:1px; }
.state-item strong { display:block; font-size:13px; line-height:1.08; }
.state-item small { font-size:10px; line-height:1.18; }
.card { border:1px solid rgb(148 163 184 / .18); border-radius:22px; padding:18px; margin-top:14px; background:linear-gradient(180deg, rgb(34 45 62 / .95), rgb(25 35 50 / .95)); box-shadow:0 18px 44px rgb(0 0 0 / .22); }
.eyebrow { text-transform:uppercase; color:#c7d2fe; font-weight:900; letter-spacing:.14em; font-size:11px; margin-bottom:7px; }
.badge-row { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.badge { border:1px solid rgb(148 163 184 / .20); border-radius:999px; padding:5px 10px; font-size:12px; color:#dbeafe; background:rgb(11 18 32 / .48); }
.link-grid { display:grid; gap:9px; margin-top:14px; }
.primary-link {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid rgb(255 255 255 / .12);
  background:#fff;
  color:#0b1220;
  border-radius:13px;
  padding:12px 14px;
  font-weight:900;
  text-decoration:none;
}
.primary-link.secondary { background:#5973ff; color:#fff; }
.status { display:inline-block; margin-top:10px; font-size:12px; color:var(--muted); }
.error { color:#fecaca; }
code { color:#e0e7ff; }
@media (max-width: 980px) {
  .site-header { grid-template-columns:1fr; gap:12px; align-items:start; min-height:116px; }
  .top-nav { justify-content:flex-start; overflow-x:auto; padding-bottom:3px; }
  .top-nav-link { white-space:nowrap; }
  .layout { grid-template-columns:1fr; padding-top:116px; }
  .map-shell { min-height:58vh; padding:12px; }
  #map { min-height:58vh; height:58vh; border-radius:22px; }
  aside { max-height:none; border-left:0; border-top:1px solid rgb(148 163 184 / .18); }
  aside::before { width:min(82%, 320px); height:180px; opacity:.20; }
  h1 { font-size:34px; }
}
@media (max-width: 620px) {
  .site-logo { font-size:23px; }
  .au-flag { width:38px; border-radius:6px; }
  .top-nav-link { font-size:11px; letter-spacing:.11em; }
  .top-nav-link.primary { padding:9px 12px; }
}
