/* anc.html only. Shared tokens come from style.css. */
.anc-controls{align-items:flex-end}
.anc-controls select{min-width:150px}
.anc-check{display:flex; align-items:center; gap:8px; font-size:15px; min-height:44px; cursor:pointer}
.anc-check input{width:20px; height:20px}
.anc-status{font-weight:600; color:var(--ink)}

.anc-layout{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:28px; margin-top:22px; align-items:start}
/* Sticky beside the list; anc.js pinMapCol() sets `top` from the measured
   control bar, and pulls it negative when the column (map + panel) is taller
   than the viewport, so the page's one scroll reaches all of it. The map
   shrinks on short screens so the common case fits whole. */
.anc-map-col{position:sticky; top:96px}
#ancMap{height:clamp(300px, calc(100vh - 480px), 560px); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); background:#eef}

.anc-board{display:flex; flex-direction:column; gap:2px; margin-top:10px}
.anc-row{display:grid; grid-template-columns:28px 64px minmax(0,1fr) auto; gap:4px 12px; align-items:center;
  width:100%; text-align:left; font:inherit; color:inherit; background:none; cursor:pointer;
  border:1px solid transparent; border-radius:9px; padding:9px 8px}
.anc-row:hover,.anc-row.active{background:var(--soft); border-color:var(--line)}
.anc-row-ballot{grid-template-columns:64px minmax(0,1fr) auto}
.anc-rank{font-size:13px; font-weight:700; color:var(--accent); text-align:center}
.anc-smd{font-weight:700; font-size:14px; font-variant-numeric:tabular-nums}
.anc-who{font-size:14px; min-width:0}
.anc-wd{color:var(--subink); font-size:12.5px; font-style:italic}
.anc-vs{color:var(--subink); font-size:13px}
.anc-margin{text-align:right; white-space:nowrap; font-weight:700; color:var(--highlight); font-size:14px;
  display:flex; align-items:center; gap:8px; justify-content:flex-end}
.anc-spark{color:var(--accent); vertical-align:middle}
.anc-flags{display:flex; flex-wrap:wrap; gap:5px; margin-top:3px}
.anc-flag{font-size:11px; font-weight:700; color:var(--deep); background:color-mix(in srgb, var(--accent) 18%, #fff);
  border-radius:99px; padding:1px 8px}
.anc-flag-warn{color:var(--warn); background:rgba(180,83,9,.12)}
.anc-en{grid-column:-2 / -1}
.anc-more{margin:10px 0; font:inherit; font-size:15px; padding:10px 14px; border-radius:9px;
  border:1px solid var(--line); background:#fff; cursor:pointer; min-height:44px}

.anc-badge{display:inline-block; font-size:11px; font-weight:700; border-radius:99px; padding:1px 8px;
  background:var(--soft); color:var(--ink); border:1px solid var(--line); white-space:nowrap}
.anc-b-won{background:#16794A; color:#fff; border-color:#16794A}
.anc-b-won-unopposed{background:#97D3BC; border-color:#97D3BC}
.anc-b-lost{background:#B45309; color:#fff; border-color:#B45309}
.anc-b-pending{background:#93C5FD; border-color:#93C5FD}
.anc-b-unmatched{background:#FCD34D; border-color:#FCD34D}
.anc-b-no-data{background:#fff; border-style:dashed}

.anc-legend{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:var(--subink); margin:10px 2px 0}
.anc-key{display:inline-flex; align-items:center; gap:6px}
.anc-sw{width:14px; height:14px; border-radius:3px; border:1px solid #6B6585}
.anc-sw-dash{border-style:dashed}

.anc-panel{margin-top:14px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--panel)}
.anc-panel h3{margin:0; font-size:18px}
.anc-panel h4{margin:14px 0 6px; font-size:14px}
.anc-panel-out{font-weight:700; margin:8px 0}
.anc-cands{margin:6px 0; padding-left:18px}
.anc-cand-table{margin:6px 0 8px}
.anc-endorse,.anc-record{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:6px; font-size:14px}
.anc-en-name{color:var(--subink)}

.anc-score-wrap{overflow-x:auto; margin:10px 0}
.anc-score th,.anc-score td{padding:7px 10px}
.anc-record{margin-top:10px}

@media (max-width:900px){
  .anc-layout{grid-template-columns:minmax(0,1fr)}
  .anc-map-col{position:static}
  #ancMap{height:420px}
}
@media (max-width:560px){
  /* Six controls stacked would fill a phone screen if they stayed sticky. */
  .controls.anc-bar{position:static}
  .anc-controls{display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; padding:12px 16px}
  .anc-controls .ctrl{width:auto}
  .anc-check{grid-column:1 / -1; min-height:36px}
  .anc-controls select{min-width:0; width:100%}
  .anc-row{grid-template-columns:22px 56px minmax(0,1fr); padding:9px 4px}
  .anc-row-ballot{grid-template-columns:56px minmax(0,1fr) auto}
  .anc-row .anc-margin{grid-column:2 / -1; justify-content:flex-start}
  .anc-row-ballot .anc-margin{grid-column:auto}
  .anc-en{grid-column:2 / -1}
  #ancMap{height:360px}
}