/* The board SVG */
.board { display: block; width: 100%; height: 100%; font-family: var(--font-cond); user-select: none; }
.board .grat path { stroke: var(--grat); stroke-width: 1; fill: none; }
.board .grat .equator { stroke-dasharray: 2 6; stroke-width: 1.5; }
.board .plate { fill-opacity: var(--plate-a); stroke: var(--c); stroke-opacity: 0.45; stroke-width: 1.5; stroke-linejoin: round; }
.board .region-label text { fill: var(--muted); font-size: 17px; font-weight: 600; letter-spacing: 0.01em; }
.board .link { fill: none; stroke: var(--line-strong); stroke-width: 2; stroke-linecap: round; }
.board .link.cross { stroke-dasharray: 1 7; stroke-width: 2.6; }
.board .link.inter { stroke-width: 2; stroke-dasharray: 9 6; }
.board .wrap-label { fill: var(--muted); font-size: 13px; font-weight: 600; }
.board .node { fill: var(--surface); stroke: var(--c); stroke-width: 3; }
.board .node-glyph { stroke: none; }
.board .site.is-home .node { fill: var(--c); stroke: var(--ink); stroke-width: 2; }
.board .site.is-home .node-glyph { fill: var(--surface); }
.board .site.is-quiet .node { stroke: var(--c-grey); }
.board .site.is-quiet .node-glyph { fill: var(--c-grey); }
.board .hub-ring { fill: none; stroke: none; }
.board .site.is-hub .hub-ring { stroke: var(--ink); stroke-width: 3; fill: var(--bg); }
.board .city { fill: var(--ink); font-size: 18px; font-weight: 600; paint-order: stroke; stroke: var(--bg); stroke-width: 5px; stroke-linejoin: round; }
.board .site.is-hub .city { font-weight: 700; }
.board .city-sub { fill: var(--muted); font-size: 13.5px; font-weight: 600; paint-order: stroke; stroke: var(--bg); stroke-width: 4px; stroke-linejoin: round; }
.board .site.has-3 .node { stroke: var(--coral); }
.board .site.is-target .hub-ring { stroke: var(--focus); stroke-width: 3; stroke-dasharray: 4 3; fill: none; }
.board .cube { stroke-width: 1.6; }
.board .cube.land { animation: land 520ms cubic-bezier(.2,.9,.3,1.3) both; transform-box: fill-box; transform-origin: 50% 100%; }
@keyframes land { from { opacity: 0; transform: translateY(-14px) scale(1.3); } to { opacity: 1; transform: none; } }
.board .pawn rect { fill: var(--ink); stroke: var(--bg); stroke-width: 2.5; }
.board .pawn text { fill: var(--bg); font-size: 15px; font-weight: 700; font-family: var(--font); }
.board .pawn.is-active rect { fill: var(--brass); stroke: var(--ink); }
.board .pawn.is-active text { fill: var(--bg-deep); }
.board .ripple { fill: none; stroke: var(--coral); stroke-width: 5; stroke-linecap: round; stroke-dasharray: 18 100; stroke-dashoffset: 18; animation: ripple 1.4s ease-out forwards; }
@keyframes ripple { to { stroke-dashoffset: -100; opacity: 0.2; } }
.board.is-compact .city { font-size: 25px; stroke-width: 6px; }
.board.is-compact .city-sub { font-size: 18px; }
.board.is-compact .region-label text { font-size: 22px; }
.board.is-compact .pawn rect { width: 30px; height: 30px; }
.board .badge rect { fill: var(--surface); stroke: var(--brass); stroke-width: 2; }
.board .badge text { fill: var(--ink); font-size: 12.5px; font-weight: 700; font-family: var(--font-cond); }
.board .badge.is-pending rect { stroke-dasharray: 3 2.5; }
.board .badge.is-block rect { fill: var(--brass); stroke: var(--ink); }
.board .badge.is-block text { fill: var(--bg-deep); }