/* Route 13 — the polar vortex */
.plume svg{width:100%;height:auto;display:block}
.plume figcaption{margin-top:8px}
.vxmonths{width:100%;border-collapse:collapse;margin:8px 0 18px}
.vxmonths th{text-align:left;font-weight:600;padding:6px 10px 6px 0;white-space:nowrap}
.vxmonths thead th{font-size:.82rem;color:var(--muted);border-bottom:1px solid var(--line)}
.vxmonths td{padding:5px 0}
.vxmonths td.bar{width:100%;padding-right:12px}
.vxmonths td.bar span{display:block;height:13px;border-radius:2px;background:#5b3a8f}
.vxmonths td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.vxskill{width:100%;border-collapse:collapse;font-size:.9rem;margin:8px 0}
.vxskill th,.vxskill td{padding:6px 9px;border-bottom:1px solid var(--line);text-align:left}
.vxskill thead th{font-size:.78rem;color:var(--muted);font-weight:600}
.vxskill .num{text-align:right;font-variant-numeric:tabular-nums}
.vxskill td.dim{opacity:.45}
.vxskill thead th.grp{text-align:center;border-left:1px solid var(--line);border-bottom:0;padding-bottom:2px}
.vxskill thead tr:last-child th{font-weight:600}
.vxsfc{width:100%;border-collapse:collapse;font-size:.88rem;margin:8px 0}
.vxsfc th,.vxsfc td{padding:5px 9px;border-bottom:1px solid var(--line);text-align:left}
.vxsfc thead th{font-size:.76rem;color:var(--muted);font-weight:600}
.vxsfc td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.vxsfc td.lbl{color:var(--muted);white-space:nowrap}
.vxsfc .sm{font-size:.82em;opacity:.6}
.vxsfc td.warnc{color:#b0242e;font-weight:600}
.scrollx{overflow-x:auto}
p.warn{border-left:3px solid #b0242e;padding:8px 0 8px 12px;margin:12px 0}
.vxskill .none{opacity:.5}
.vxmonths td.num,.vxskill .sm{font-size:.85em;opacity:.75}

/* the sortable winter table */
.vxfilt{display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;margin:14px 0 8px}
.vxfl{font-size:.72rem;color:var(--mut,#88837c);text-transform:uppercase;letter-spacing:.07em;
  font-weight:700;margin:0 2px 0 8px}
.vxfl:first-child{margin-left:0}
.vxchip{font:inherit;font-size:.8rem;border:1px solid var(--line,#d2cdc1);background:var(--card,#fff);
  color:var(--ink,#17161a);border-radius:999px;padding:3px 11px;cursor:pointer;line-height:1.4}
.vxchip:hover{border-color:var(--ink2,#4a4653)}
.vxchip.on{background:var(--ink,#17161a);color:#fff;border-color:var(--ink,#17161a)}
.vxchip:focus-visible,.vxsort:focus-visible{outline:2px solid #0f8f7e;outline-offset:2px}
.vxcount{margin-left:auto;font-size:.78rem;color:var(--mut,#88837c);font-variant-numeric:tabular-nums}
.vxkeys{display:flex;flex-wrap:wrap;gap:6px 22px;margin:4px 0 10px}
.vxkey{display:flex;flex-wrap:wrap;align-items:center;gap:3px 8px;font-size:.72rem;color:var(--ink2,#4a4653)}
.vxkt{font-weight:700;color:var(--ink,#17161a);margin-right:2px}
.vxks{display:inline-flex;align-items:center;gap:4px}
.vxks i{display:inline-block;width:16px;height:11px;border-radius:2px;border:1px solid var(--line,#d2cdc1)}
table.vxwin{border-collapse:separate;border-spacing:0 2px;width:100%;min-width:980px;font-size:.86rem}
table.vxwin thead th{position:sticky;top:0;background:var(--card,#fff);z-index:1;text-align:center;
  padding:6px 6px;border-bottom:1px solid var(--line,#d2cdc1);white-space:nowrap}
table.vxwin thead th:first-child{text-align:left}
.vxsort{all:unset;cursor:pointer;font-size:.76rem;font-weight:700;color:var(--ink2,#4a4653);
  display:inline-flex;align-items:center;gap:4px}
.vxsort::after{content:"↕";font-size:.8em;opacity:.35}
th[aria-sort="ascending"] .vxsort,th[aria-sort="descending"] .vxsort{color:var(--ink,#17161a)}
th[aria-sort="ascending"] .vxsort::after{content:"▲";opacity:.9}
th[aria-sort="descending"] .vxsort::after{content:"▼";opacity:.9}
table.vxwin tbody th{text-align:left;font-weight:700;padding:6px 10px;white-space:nowrap;
  font-variant-numeric:tabular-nums}
table.vxwin td{padding:6px 8px;text-align:center;white-space:nowrap;font-variant-numeric:tabular-nums}
table.vxwin td.src{color:var(--mut,#88837c);font-size:.8rem}
table.vxwin td.vc{font-weight:700;border-left:2px solid var(--card,#fff)}
table.vxwin tbody tr:hover th,table.vxwin tbody tr:hover td.src{background:var(--paper2,#f4f1e9)}
.vxb{display:inline-block;font-weight:700;font-size:.82rem;padding:1px 8px;border-radius:999px;
  border:1px solid var(--line,#d2cdc1)}
.vxb.yes{color:var(--ink,#17161a);border-color:var(--ink2,#4a4653)}
.vxb.prov{color:var(--ink2,#4a4653);border-style:dashed}
.vxb.no{color:var(--mut,#88837c)}
.vxcall{font-size:.8rem;font-weight:600}
.vxcall.hit{color:#04663d}
.vxcall.miss{color:#b0242e;font-weight:700}
/* The month table's header "Share of members whose warming falls here" inherited
   white-space:nowrap from .vxmonths th and forced the page to 455 px on a 400 px
   phone — the whole /vortex/ page scrolled sideways. Headers wrap; row labels do not. */
.vxmonths thead th{white-space:normal}
/* season.css styles .note as a flex row for its icon-and-text boxes. This page uses
   <p class="note"> for plain paragraphs, where flex made every <b> its own unwrappable
   item on one line and ran the skill note off a phone's edge. */
p.note{display:block}