.routemap { min-width: 640px; }
.rm-water { fill: var(--river); }
.rm-land { fill: var(--surface-2); stroke: var(--line-strong); stroke-width: 1.2; }
.rm-grid line { stroke: var(--grid); stroke-width: 1; }
.rm-bridge { stroke: var(--ink-2); stroke-width: 5; stroke-linecap: round; }
.rm-ferry { fill: none; stroke: var(--ink-2); stroke-width: 2; stroke-dasharray: 6 6; }
.rm-tunnel { fill: none; stroke: var(--accent); stroke-width: 7; stroke-linecap: round; }
.rm-rail { fill: none; stroke: var(--ink); stroke-width: 2; stroke-dasharray: 10 3 2 3; }
.rm-metro { fill: none; stroke: var(--ink); stroke-width: 3; }
.rm-tram { fill: none; stroke: var(--ink-2); stroke-width: 2; }
.rm-stn { fill: var(--surface); stroke: var(--ink); stroke-width: 3.5; }
.rm-pt { fill: var(--ink-2); }
.rm-label { font: 600 17px var(--font-sans); fill: var(--ink); paint-order: stroke; stroke: var(--surface-2); stroke-width: 4px; }
.rm-small { font: 12px var(--font-mono); fill: var(--ink-2); paint-order: stroke; stroke: var(--surface-2); stroke-width: 3px; }
.rm-place { font: 500 13px var(--font-mono); letter-spacing: .2em; fill: var(--ink-2); }
.rm-river { font: italic 500 20px var(--font-sans); fill: var(--ink-2); }
.rm-scale { stroke: var(--ink); stroke-width: 2; }
.rm-north { fill: var(--ink); }
.key { display: inline-block; width: 22px; height: 0; vertical-align: middle; margin-right: 6px; }
.key-tunnel { border-top: 5px solid var(--accent); }
.key-ferry { border-top: 2px dashed var(--ink-2); }
@media print { .routemap { min-width: 0; } }