.chead{ padding:clamp(112px,15vh,158px) 0 clamp(28px,3.4vw,46px); }
  .chead__back{
    font-family:var(--mono); font-size:11px; letter-spacing:.18em;
    text-transform:uppercase; text-decoration:none;
    border-bottom:1px solid var(--rule); padding-bottom:3px;
  }
  .chead__back:hover{ border-bottom-color:var(--ink); }
  .chead__name{
    font-family:var(--display); font-weight:800; text-transform:uppercase;
    font-size:clamp(2.6rem,8.6vw,7rem); line-height:.84; letter-spacing:-.015em;
    margin:22px 0 0; max-width:15ch;
  }
  .chead__name span{
    display:inline-block; background:var(--ink); color:var(--paper-hi);
    padding:.07em .18em .15em;
  }

  .cbody{
    display:grid; grid-template-columns:minmax(0,1.3fr) minmax(270px,.9fr);
    gap:clamp(20px,3vw,46px); align-items:start;
  }
  @media (max-width:900px){ .cbody{ grid-template-columns:1fr; } }

  .cmap{ border:1px solid var(--rule); background:var(--paper-hi); padding:clamp(10px,1.6vw,20px); }
  .cmap svg{ display:block; width:100%; height:auto; }
  /* Flat opaque tones. Translucent fills stack wherever shapes overlap along a
     shared border, which flattens a continent into one mass and hides every
     frontier in it. */
  .rgn{
    fill:#8e8a86; stroke:var(--paper-hi); stroke-width:.5;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke; cursor:pointer; transition:fill .15s ease;
  }
  .rgn:hover, .rgn:focus{ fill:#4a4744; outline:none; }
  .rgn.is-sel{ fill:#0d0c0c; }
  .ctx{
    fill:#c4c1bd; stroke:rgba(13,12,12,.38); stroke-width:.5;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke; pointer-events:none;
  }
  .river{
    fill:none; stroke:#7d97a8; stroke-width:.55;
    stroke-linecap:round; stroke-linejoin:round;
    vector-effect:non-scaling-stroke; pointer-events:none; opacity:.75;
  }
  .lake{
    fill:#aebfca; stroke:#7d97a8; stroke-width:.3;
    vector-effect:non-scaling-stroke; pointer-events:none;
  }
  /* The national border, drawn as a stroke beneath the regions. Whatever the
     regions cover is hidden again by their own fills, so only their outer edge
     survives — the border and the states agree exactly. */
  .cast{
    fill:rgba(13,12,12,.82);
    stroke:rgba(13,12,12,.82); stroke-width:2.1;
    stroke-linejoin:round; stroke-linecap:round;
    vector-effect:non-scaling-stroke;
    pointer-events:none;
  }

  /* A compass. North is up everywhere on this projection, so this states the
     orientation rather than pretending to be a navigation instrument. */
  .compass circle{
    /* an opaque plate: on a landlocked country every corner of the frame is
       land, so the compass has to read over it */
    fill:#e7e5e2;
    stroke:rgba(13,12,12,.34); stroke-width:.8;
    vector-effect:non-scaling-stroke;
  }
  .compass__needle{ fill:rgba(13,12,12,.62); }
  .compass__n, .compass__t{
    font-family:var(--mono); font-weight:500;
    letter-spacing:.06em;
    text-anchor:middle; dominant-baseline:middle;
    fill:rgba(13,12,12,.62);
  }
  .compass__t{ fill:rgba(13,12,12,.38); }
  .compass{ pointer-events:none; user-select:none; }

  .border{
    fill:none; stroke:rgba(13,12,12,.82); stroke-width:1.05;
    stroke-linejoin:miter; stroke-miterlimit:2; stroke-linecap:butt;
    vector-effect:non-scaling-stroke; pointer-events:none;
  }
  .lbl{
    font-family:var(--mono); font-weight:500; fill:var(--ink);
    paint-order:stroke fill; stroke:var(--paper-hi); stroke-linejoin:round; text-anchor:middle; dominant-baseline:middle;
    pointer-events:none; letter-spacing:.06em; text-transform:uppercase;
  }
  .lbl{ opacity:0; transition:opacity .12s ease; }
  .lbl.is-on{ opacity:1; }

  .cmapkey{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; }
  .cmapkey span{
    display:flex; align-items:center; gap:8px;
    font-family:var(--mono); font-size:10.5px; letter-spacing:.14em;
    text-transform:uppercase; color:var(--ink-faint);
  }
  .cmapkey i{ display:block; width:18px; border-top:1px solid rgba(13,12,12,.35); }
  .cmapkey i.k-sel{ width:13px; height:13px; border:0; background:var(--ink); }

  .status{ border:1px solid var(--ink); background:var(--paper-hi); padding:clamp(20px,2.6vw,30px); }
  .status__badge{
    display:inline-block; background:var(--ink); color:var(--paper-hi);
    font-family:var(--mono); font-size:10.5px; letter-spacing:.18em;
    text-transform:uppercase; padding:7px 11px;
  }
  .status h2{
    font-family:var(--display); font-weight:800; text-transform:uppercase;
    font-size:1.6rem; line-height:1; margin:16px 0 0;
  }
  .status__row{
    display:flex; justify-content:space-between; gap:14px;
    padding:12px 0; border-top:1px solid var(--rule); font-size:.93em;
  }
  .status__row:last-of-type{ border-bottom:1px solid var(--rule); }
  .status p{ margin:16px 0 0; font-size:.92em; color:var(--ink-soft); }

  .profile__bg{
    font-size:1.04em; line-height:1.7; color:var(--ink-soft);
    max-width:74ch; margin:0 0 clamp(20px,2.6vw,30px);
  }
  .profile__bg::first-letter{
    font-family:var(--display); font-weight:900; font-size:3.1em;
    line-height:.78; float:left; margin:.06em .12em 0 0; color:var(--ink);
  }
  .facts{
    display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
    gap:1px; background:var(--rule); border:1px solid var(--rule);
  }
  .facts div{ background:var(--paper-lo); padding:16px 18px; }
  .facts dt{
    font-family:var(--mono); font-size:10px; font-weight:500; letter-spacing:.2em;
    text-transform:uppercase; color:var(--ink-faint); margin:0 0 7px;
  }
  .facts dd{ margin:0; font-size:.94em; }
  .source{ margin-top:16px; }

  .rledger{ width:100%; border-collapse:collapse; }
  .rledger th{
    font-family:var(--mono); font-size:10.5px; font-weight:500; letter-spacing:.2em;
    text-transform:uppercase; color:var(--ink-faint); text-align:left;
    padding:0 14px 10px 0; border-bottom:1px solid var(--rule);
  }
  .rledger td{ padding:12px 14px 12px 0; border-bottom:1px solid rgba(13,12,12,.12); }
  .rledger tbody tr{ cursor:pointer; transition:background .18s ease; }
  .rledger tbody tr:hover, .rledger tbody tr.is-sel{ background:rgba(13,12,12,.07); }
  .rledger .c-name{ font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:1.15rem; }
  .rledger .c-code{ font-family:var(--mono); font-size:12px; color:var(--ink-faint); white-space:nowrap; }

  .near{ display:flex; flex-wrap:wrap; gap:8px; }
  .near a{
    font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
    text-decoration:none; border:1px solid var(--rule); padding:10px 14px;
  }
  .near a:hover{ border-color:var(--ink); }

  .azbar{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:clamp(18px,2.4vw,26px); }
  .azbar a{
    font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-decoration:none;
    border:1px solid var(--rule); padding:7px 10px; min-width:32px; text-align:center;
  }
  .azbar a:hover{ border-color:var(--ink); }
  .azlist{ columns:4; column-gap:clamp(18px,2.4vw,34px); }
  .azlist a{
    display:flex; align-items:center; gap:9px; text-decoration:none;
    border-bottom:1px solid rgba(13,12,12,.10); padding:7px 4px;
    break-inside:avoid; font-size:.93em;
  }
  .azlist a:hover{ background:rgba(13,12,12,.07); }
  .azlist h3{
    font-family:var(--display); font-weight:800; font-size:1.5rem;
    margin:18px 0 6px; break-after:avoid;
  }
  @media (max-width:900px){ .azlist{ columns:2; } }
  @media (max-width:520px){ .azlist{ columns:1; } }