/* SVG railway-map styling. */

.map-svg {
  width: 100%;
  height: 100%;
  display: block;
  touch-action: manipulation;
}
.map-svg--active { cursor: crosshair; }

.map-sea { fill: var(--c-sea); }
.map-land {
  fill: var(--c-land);
  stroke: #cdbf93;
  stroke-width: 1;
  stroke-linejoin: round;
}
.map-lake {
  fill: var(--c-lake);
  stroke: #8fb6b1;
  stroke-width: 0.8;
}

/* coordinate grid */
.map-grid line { stroke: rgba(29, 39, 66, 0.10); stroke-width: 0.8; }
.map-grid-label text {
  fill: rgba(29, 39, 66, 0.45);
  font-size: 11px;
  font-weight: 700;
  font-family: var(--font);
}

/* rail network */
.map-rail {
  fill: none;
  stroke: var(--c-rail);
  stroke-width: 2.4;
  stroke-linejoin: round;
  stroke-linecap: round;
  opacity: 0.85;
}
.map-node {
  fill: var(--c-panel);
  stroke: var(--c-rail);
  stroke-width: 1.3;
}

/* title block */
.map-title text {
  font-family: var(--font);
  font-weight: 800;
  font-size: 16px;
  fill: var(--c-rail);
}

/* NS-style logo */
.map-logo-bg {
  fill: var(--c-panel);
  stroke: var(--c-rail);
  stroke-width: 1;
  opacity: 0.92;
}
.map-logo-mark { fill: var(--c-rail); }

/* reveal layer */
.reveal-link {
  stroke: var(--c-rail);
  stroke-width: 1.6;
  stroke-dasharray: 4 3;
  opacity: 0.7;
}
.reveal-guess line {
  stroke: var(--c-ink);
  stroke-width: 3;
  stroke-linecap: round;
}
.reveal-actual circle {
  fill: none;
  stroke: var(--c-accent-red);
  stroke-width: 2.6;
}
.reveal-actual-dot { fill: var(--c-accent-red); stroke: none; }
.reveal-label {
  font-family: var(--font);
  font-weight: 800;
  font-size: 13px;
  fill: var(--c-rail);
  paint-order: stroke;
  stroke: var(--c-panel);
  stroke-width: 3.5;
  stroke-linejoin: round;
}
