.wn-section {
  scroll-margin-top:90px;
  background:radial-gradient(ellipse closest-side at 50% 52%, #13392ff0 10%, #112f27bd 60%, #102b2245 86%, transparent 100%);
}
.wn-heading { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:18px 32px; margin-bottom:clamp(18px,3vw,36px); }
.wn-heading h2 { margin:0; color:var(--wood-type); font:600 clamp(2rem,4.1vw,4rem)/1.12 var(--serif); }
.wn-stat { display:flex; align-items:center; gap:12px; margin:0; color:#e8efd9; }
.wn-stat b { font:600 clamp(2.5rem,4.1vw,4rem)/1 var(--serif); color:#f8d997; }
.wn-stat b span { font-size:.63em; vertical-align:top; }
.wn-stat>span { font-size:.9rem; }
.wn-toolbar,.wn-figure figcaption,.wn-region-bar,.wn-countries { text-shadow:0 1px 5px #071c15; }
.wn-toolbar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; padding-block:14px; }
.wn-coordinate { display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; color:#f7f4df; font-size:.9rem; }
.wn-coordinate i { display:block; width:9px; height:9px; background:#c84937; border:1.5px solid #ffebbe; border-radius:50%; }
.wn-coordinate span { color:#c1d4c6; font-size:.74rem; letter-spacing:.045em; font-variant-numeric:tabular-nums; }
.wn-motion { border:1px solid #718a7a; border-radius:99px; padding:6px 14px; background:#233f33; color:#eef5df; font:inherit; font-size:.82rem; cursor:pointer; }
.wn-figure { margin:0; }
.wn-figure svg {
  background:radial-gradient(ellipse closest-side at 50% 50%, #244c43f5 5%, #1b413dd6 53%, #16393678 76%, transparent 100%);
}
.wn-figure svg { display:block; width:100%; height:auto; max-height:min(65vw,630px); }
.wn-figure figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px 18px; align-items:center; padding-block:10px; font-size:.82rem; color:#dae7d8; }
.wn-figure figcaption [data-wn-status] { color:#f6e1b6; font-weight:650; }
.wn-route { color:var(--line); transition:opacity .22s; }
.wn-route.wn-dim { opacity:.19; }
.wn-route.wn-hidden { display:none; }
.wn-base { stroke:currentColor; stroke-width:1.35; fill:none; opacity:.74; }
.wn-signal { fill:none; stroke:currentColor; stroke-width:3.1; stroke-linecap:round; stroke-dasharray:3 97; opacity:.9; animation:wn-travel 4.8s linear infinite; animation-delay:var(--delay); animation-play-state:paused; }
.wn-chart[data-running="true"] .wn-route:not(.wn-dim) .wn-signal,.wn-chart[data-running="true"] .wn-beacon { animation-play-state:running; }
.wn-route.wn-dim .wn-signal { visibility:hidden; }
@keyframes wn-travel { from {stroke-dashoffset:100} to {stroke-dashoffset:0} }
.wn-terminal { fill:#102c25; stroke:currentColor; stroke-width:1.1; }
.wn-pin { fill:currentColor; }
.wn-route.wn-active .wn-base { opacity:1; stroke-width:2.5; }
.wn-route.wn-active .wn-terminal { stroke-width:2; }
.wn-map-label,.wn-origin text { font:650 12px/1 system-ui,sans-serif; fill:#fff9df; stroke:#152f27; stroke-width:4; paint-order:stroke; stroke-linejoin:round; }
.wn-origin text { font-size:14px; }
.wn-map-label { visibility:hidden; }
.wn-route.wn-active .wn-map-label,.wn-route.wn-spotlight .wn-map-label { visibility:visible; }
.wn-route.wn-spotlight .wn-base { stroke-width:2; opacity:1; }
.wn-beacon { stroke:#ffde9c; fill:none; stroke-width:1.2; transform-box:fill-box; transform-origin:center; animation:wn-origin 3s ease-out infinite; animation-play-state:paused; }
@keyframes wn-origin { from {transform:scale(.7);opacity:.9} to {transform:scale(1.7); opacity:.08} }
.wn-region-bar { display:flex; flex-wrap:wrap; gap:6px; align-items:center; padding-block:13px; }
.wn-chart [hidden] { display:none!important; }
.wn-region-bar button { min-height:38px; border-radius:6px; border:1px solid transparent; padding:6px 12px; font:600 .88rem/1.3 var(--body); color:#e4eadd; background:transparent; cursor:pointer; }
.wn-region-bar button:hover,.wn-region-bar button[aria-pressed="true"] { background:#344f3f; border-color:#7d9680; color:#fff7df; }
.wn-key { margin-right:3px; color:var(--line); font:italic .84rem var(--serif); }
.wn-countries { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; padding-block:clamp(15px,2.3vw,28px); }
.wn-group h3 { margin:0 0 8px; color:#eff3e7; font-size:.97rem; display:flex; align-items:center; gap:6px; }
.wn-group h3 i { width:18px; height:2px; background:var(--line); }
.wn-group h3 small { color:var(--line); font-weight:500; }
.wn-group>div { display:flex; flex-wrap:wrap; gap:4px 8px; }
.wn-etc { align-self:center; color:#b7cbbb; font-size:.875rem; }
.wn-group button { border:0; border-bottom:1px solid transparent; color:#d8e4d8; background:transparent; font:inherit; font-size:.875rem; padding:3px 1px; cursor:pointer; }
.wn-group button:disabled { cursor:default; }
.wn-group button:hover,.wn-group button[aria-pressed="true"] { color:var(--line); border-color:var(--line); }
.wn-chart button:focus-visible { outline:2px solid #ffe7ac; outline-offset:3px; }
@media (max-width:850px) { .wn-countries { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) {
  .wn-toolbar { padding-block:9px; }
  .wn-coordinate { flex:1; gap:4px 7px; }
  .wn-coordinate span { flex-basis:100%; padding-left:17px; }
  .wn-region-bar { gap:4px; }
  .wn-motion,.wn-region-bar button,.wn-group button { min-height:42px; }
  .wn-region-bar button { padding:5px 8px; }
  .wn-countries { gap:12px; }
  .wn-group>div { gap:0 6px; }
  .wn-figure figcaption { flex-direction:column; align-items:start; gap:2px; }
  .wn-figure svg { min-height:160px; }
  .wn-origin text { font-size:20px; }
  .wn-map-label { font-size:19px; }
  .wn-stat { gap:8px; }
}
@media (prefers-reduced-motion:reduce) {
  .wn-route { transition:none; }
  .wn-beacon,.wn-signal { animation:none; }
  .wn-beacon { opacity:.45; }
  .wn-signal { opacity:0; }
}