/* LW Rail Miles - Front-end design system (clean / light / rail-blue) */

:root {
  --lw-ink:      #14263c;
  --lw-muted:    #5d7089;
  --lw-faint:    #8da2bb;
  --lw-line:     #e3ecf6;
  --lw-blue:     #1e88e5;
  --lw-blue-deep:#0d47a1;
  --lw-blue-soft:#e8f1fd;
  --lw-amber:    #f59e0b;
  --lw-green:    #16a34a;
  --lw-red:      #dc2626;
  --lw-surface:  #ffffff;
  --lw-bg:       #f2f6fb;
  --lw-radius:   16px;
  --lw-shadow:   0 10px 30px rgba(19, 62, 118, .10);
  --lw-shadow-sm:0 4px 14px rgba(19, 62, 118, .08);
}

body .entry-content .lwrail-module { box-sizing: border-box; }

.lwrail-module {
  background: var(--lw-surface);
  border: 1px solid var(--lw-line);
  border-radius: var(--lw-radius);
  box-shadow: var(--lw-shadow);
  padding: 22px 24px;
  margin: 26px 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--lw-ink);
}

.lwrail-module *, .lwrail-module *::before, .lwrail-module *::after { box-sizing: border-box; }

.lwrail-module-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--lw-line);
}

.lwrail-module-kicker {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lw-blue);
  margin-bottom: 3px;
}

.lwrail-module-title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--lw-ink);
}

.lwrail-module-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: 999px;
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* ---------- Honesty pill (live / stale) ---------- */
.lwrail-honesty {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .01em;
  white-space: nowrap;
  border: 1px solid transparent;
}
.lwrail-honesty .lwrail-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex: 0 0 auto;
}
.lwrail-honesty-live {
  background: #e9f9ef;
  border-color: #b8e6cc;
  color: #147a3b;
}
.lwrail-honesty-live .lwrail-dot {
  background: var(--lw-green);
  box-shadow: 0 0 0 3px rgba(22, 163, 74, .16);
}
.lwrail-honesty-stale {
  background: #fdf3e3;
  border-color: #f2d9a8;
  color: #9a5b00;
}
.lwrail-honesty-stale .lwrail-dot {
  background: var(--lw-amber);
  box-shadow: 0 0 0 3px rgba(245, 158, 11, .18);
}

.lwrail-module-body { }
.lwrail-module-empty {
  text-align: center;
  color: var(--lw-muted);
  background: var(--lw-bg);
  border: 1px dashed var(--lw-line);
  border-radius: 12px;
  padding: 34px 18px;
}
.lwrail-module-empty strong { display: block; font-size: 16px; color: var(--lw-ink); margin-bottom: 4px; }

/* ---------- Profile ---------- */
.lwrail-profile-card { overflow: hidden; padding: 0; }

.lwrail-profile-hero {
  display: flex;
  gap: 18px;
  align-items: center;
  padding: 26px 28px 20px;
  background:
    radial-gradient(1200px 300px at 120% -60%, rgba(30,136,229,.16), transparent 60%),
    linear-gradient(180deg, #f6faff, #ffffff);
  border-bottom: 1px solid var(--lw-line);
}

.lwrail-profile-avatar { flex: 0 0 auto; }
.lwrail-profile-avatar img {
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px rgba(19,62,118,.18);
  width: 90px; height: 90px; object-fit: cover;
}

.lwrail-profile-info { min-width: 0; }
.lwrail-profile-name {
  margin: 0 0 4px;
  font-size: 23px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.lwrail-profile-bio { margin: 0 0 8px; color: var(--lw-muted); font-size: 14px; }

.lwrail-tier-badge {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lwrail-tier-free    { background: #eef2f7; color: var(--lw-muted); }
.lwrail-tier-premium { background: linear-gradient(135deg, #f59e0b, #f97316); color: #fff; }

.lwrail-profile-stats {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: #fff;
}

.lwrail-stat {
  padding: 18px 8px 20px;
  text-align: center;
  border-right: 1px solid var(--lw-line);
}
.lwrail-stat:last-child { border-right: none; }
.lwrail-stat strong { display: block; font-size: 24px; font-weight: 800; color: var(--lw-blue-deep); font-variant-numeric: tabular-nums; }
.lwrail-stat span { font-size: 12px; color: var(--lw-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.lwrail-stat-link { display: block; text-decoration: none; cursor: pointer; transition: background .15s, box-shadow .15s; border-radius: 8px; }
.lwrail-stat-link:hover { background: var(--lw-blue-soft); }
.lwrail-stat-link:hover strong { color: var(--lw-blue); }
.lwrail-stat-link .lwrail-drill-hint { display: block; font-size: 10px; font-style: normal; font-weight: 600; color: var(--lw-blue); text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; opacity: 0; transition: opacity .15s; }
.lwrail-stat-link:hover .lwrail-drill-hint { opacity: 1; }

.lwrail-drill { margin-top: 16px; background: var(--lw-surface); border: 1px solid var(--lw-line); border-radius: 12px; box-shadow: var(--lw-shadow-sm); scroll-margin-top: 90px; }
.lwrail-drill summary { list-style: none; cursor: pointer; padding: 14px 16px; font-size: 15px; font-weight: 800; color: var(--lw-ink); display: flex; align-items: center; justify-content: space-between; }
.lwrail-drill summary::-webkit-details-marker { display: none; }
.lwrail-drill summary .lwrail-drill-count { font-size: 12px; font-weight: 600; color: var(--lw-muted); }
.lwrail-drill-body { padding: 0 16px 14px; }
.lwrail-drill-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.lwrail-drill-table th { text-align: left; padding: 6px 8px; color: var(--lw-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--lw-line); }
.lwrail-drill-table td { padding: 6px 8px; color: var(--lw-ink); border-bottom: 1px solid var(--lw-line); }
.lwrail-drill-table tr:last-child td { border-bottom: none; }
.lwrail-drill-table .lwrail-right { text-align: right; font-variant-numeric: tabular-nums; }
.lwrail-drill-table .muted { color: var(--lw-muted); }
.lwrail-drill-table .lwrail-crs { color: var(--lw-faint); font-size: 11px; }

/* ---------- Countries visited (W5) ---------- */
.lwrail-country-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 18px 14px;
}
.lwrail-country-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--lw-line);
  background: linear-gradient(135deg, rgba(30, 136, 229, .08), rgba(13, 71, 161, .05));
  font-size: 12px;
  font-weight: 700;
  color: var(--lw-blue-deep, #0d47a1);
  white-space: nowrap;
}
.lwrail-country-badge .ico { font-size: 14px; line-height: 1; }

.lwrail-country-cell { display: inline-flex; align-items: center; gap: 8px; }
.lwrail-country-flag { font-size: 17px; line-height: 1; }

.lwrail-share {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 72px;
  height: 6px;
  border-radius: 4px;
  background: var(--lw-line);
  overflow: hidden;
  margin-right: 6px;
}
.lwrail-share-bar {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: 4px;
  background: linear-gradient(90deg, #1e88e5, #0d47a1);
}
.lwrail-share-pct { font-size: 11px; color: var(--lw-muted); font-variant-numeric: tabular-nums; }

/* ---------- Train class search + multi-loco unit rows ---------- */
.lwrail-service-results,
.lwrail-train-results {
  position: relative;
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.lwrail-service-results li,
.lwrail-train-results li { padding: 7px 12px; font-size: 13px; cursor: pointer; }
.lwrail-service-results li:hover,
.lwrail-train-results li:hover { background: var(--lw-blue-soft); }

.lwrail-unit-rows { display: flex; flex-direction: column; gap: 8px; }
.lwrail-unit-row { display: flex; align-items: center; gap: 8px; }
.lwrail-unit-row input { flex: 1 1 auto; }
.lwrail-remove-unit {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-muted);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.lwrail-remove-unit:hover { color: var(--lw-red, #c62828); border-color: var(--lw-red, #c62828); }
.lwrail-add-unit {
  margin-top: 8px;
  padding: 6px 12px;
  border: 1.5px dashed var(--lw-faint);
  border-radius: 8px;
  background: transparent;
  color: var(--lw-muted);
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
}
.lwrail-add-unit:hover { border-color: var(--lw-blue); color: var(--lw-blue-deep); }

/* ---------- Stats widget ---------- */
.lwrail-stat-tiles {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}

.lwrail-stat-tile {
  background: var(--lw-bg);
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  padding: 14px 14px 12px;
  position: relative;
  overflow: hidden;
}
.lwrail-stat-tile::before {
  content: "";
  position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--lw-blue);
  border-radius: 0 4px 4px 0;
}
.lwrail-stat-tile strong { display: block; font-size: 24px; font-weight: 800; color: var(--lw-ink); font-variant-numeric: tabular-nums; }
.lwrail-stat-tile span { font-size: 12px; color: var(--lw-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }

a.lwrail-stat-tile,
a.lwrail-stat-tile:hover,
a.lwrail-stat-tile:active,
a.lwrail-stat-tile:focus {
  text-decoration: none;
  color: inherit;
}
a.lwrail-stat-tile:hover {
  border-color: rgba(30, 136, 229, .55);
  box-shadow: var(--lw-shadow-sm);
  transform: translateY(-2px);
}
a.lwrail-stat-tile-link { cursor: pointer; }
.lwrail-drill-hint {
  display: block;
  margin-top: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: .02em;
  color: var(--lw-blue);
}

/* ---------- Monthly heatstrip (compact) ---------- */
.lwrail-heat-card {
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  padding: 12px 16px 10px;
  background: #fff;
}
.lwrail-heat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--lw-ink);
}
.lwrail-heat-total { color: var(--lw-muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.lwrail-heatstrip {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 6px;
  align-items: end;
}
.lwrail-heat-month {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.lwrail-heat-track {
  display: flex;
  align-items: flex-end;
  height: 42px;
  width: 100%;
  max-width: 22px;
  background: #f2f6fb;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}
.lwrail-heat-bar {
  display: block;
  width: 100%;
  background: linear-gradient(180deg, #42a5f5, #1e88e5);
  border-radius: 5px 5px 2px 2px;
  transition: height .25s ease;
}
.lwrail-heat-month.is-on .lwrail-heat-track { background: #eaf3fd; }
.lwrail-heat-month.is-on .lwrail-heat-bar { background: linear-gradient(180deg, #3aa3f0, #0d47a1); }
.lwrail-heat-k {
  font-size: 10px;
  font-weight: 700;
  color: var(--lw-faint);
  font-variant-numeric: tabular-nums;
}
.lwrail-heat-month.is-on .lwrail-heat-k { color: var(--lw-blue-deep); }

.lwrail-stats-drill {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.lwrail-stats-drill a {
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.lwrail-stats-drill a:hover { background: #d6e8fb; }

.lwrail-chart-box {
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  padding: 14px 16px 8px;
  background: #fff;
}

/* ---------- Leaderboard ---------- */
.lwrail-lb-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  transition: background .15s ease;
}
.lwrail-lb-row + .lwrail-lb-row { border-top: 1px solid var(--lw-line); }
.lwrail-lb-row:hover { background: var(--lw-blue-soft); }
.lwrail-lb-row.lwrail-lb-me {
  background: var(--lw-blue-soft);
  box-shadow: inset 0 0 0 1px rgba(30,136,229,.35);
}

.lwrail-lb-rank {
  flex: 0 0 38px;
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-weight: 800;
  font-size: 15px;
  background: #eef2f7; color: var(--lw-muted);
  font-variant-numeric: tabular-nums;
}
.lwrail-lb-rank.gold   { background: linear-gradient(135deg,#fde68a,#f59e0b); color: #7c4a00; }
.lwrail-lb-rank.silver { background: linear-gradient(135deg,#e2e8f0,#94a3b8);  color: #334155; }
.lwrail-lb-rank.bronze { background: linear-gradient(135deg,#fed7aa,#d97706);  color: #7c2d12; }

.lwrail-lb-avatar img { width: 36px; height: 36px; border-radius: 50%; display: block; }

.lwrail-lb-user {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  font-size: 15px;
  color: var(--lw-ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.lwrail-lb-user small { display: block; font-weight: 500; font-size: 12px; color: var(--lw-muted); }

.lwrail-lb-value {
  flex: 0 0 auto;
  font-weight: 800;
  font-size: 17px;
  color: var(--lw-blue-deep);
  font-variant-numeric: tabular-nums;
}
.lwrail-lb-value small { font-size: 12px; font-weight: 600; color: var(--lw-muted); margin-left: 2px; }

/* ---------- Tables ---------- */
.lwrail-table { width: 100%; border-collapse: collapse; }
.lwrail-table th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--lw-faint);
  padding: 10px 14px;
  border-bottom: 1px solid var(--lw-line);
}
.lwrail-table td { padding: 13px 14px; border-bottom: 1px solid var(--lw-line); font-size: 14px; }
.lwrail-table tr:last-child td { border-bottom: none; }
.lwrail-table .num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; }
.lwrail-table .muted { color: var(--lw-muted); }

/* ---------- Source chips ---------- */
.lwrail-source-chip {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.lwrail-source-chip.nre       { background: #e7f6ec; color: #15803d; }
.lwrail-source-chip.haversine { background: #fef3c7; color: #b45309; }
.lwrail-source-chip.imported  { background: var(--lw-blue-soft); color: var(--lw-blue-deep); }
.lwrail-source-chip.manual    { background: #eef2f7; color: var(--lw-muted); }

/* ---------- Trip detail ---------- */
.lwrail-trip-meta { color: var(--lw-muted); font-size: 14px; margin: 0 0 4px; }

/* ---------- Recent trips list ---------- */
.lwrail-trips-list { display: flex; flex-direction: column; gap: 10px; }

.lwrail-trips-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.lwrail-trips-row:hover { border-color: rgba(30,136,229,.5); box-shadow: var(--lw-shadow-sm); transform: translateY(-1px); }

.lwrail-trips-badge {
  flex: 0 0 auto;
  width: 44px; height: 44px;
  border-radius: 12px;
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px;
}

.lwrail-trips-main { flex: 1 1 auto; min-width: 0; }
.lwrail-trips-main strong { display: block; font-size: 15px; color: var(--lw-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lwrail-trips-main small { font-size: 12.5px; color: var(--lw-muted); }
.lwrail-trips-main small .lwrail-trip-name { font-style: normal; font-weight: 600; color: var(--lw-blue-deep); }

.lwrail-trips-metric { flex: 0 0 auto; text-align: right; }
.lwrail-trips-metric strong { font-size: 19px; font-weight: 800; color: var(--lw-blue-deep); font-variant-numeric: tabular-nums; }
.lwrail-trips-metric span { display: block; font-size: 11px; color: var(--lw-faint); text-transform: uppercase; letter-spacing: .05em; }

.lwrail-trips-actions { flex: 0 0 auto; display: inline-flex; gap: 2px; }
.lwrail-trip-del {
  width: 30px; height: 30px;
  border: 1px solid transparent; border-radius: 8px;
  background: #fff; color: var(--lw-faint);
  font-size: 17px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.lwrail-trip-del:hover { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
.lwrail-trip-del:active { transform: scale(.94); }
.lwrail-trip-del:focus-visible { outline: 2px solid var(--lw-blue); outline-offset: 2px; }

/* ---------- Log form ---------- */
.lwrail-log-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.lwrail-log-form .lwrail-field { display: flex; flex-direction: column; gap: 6px; position: relative; }
.lwrail-log-form .lwrail-field-wide { grid-column: 1 / -1; }
.lwrail-log-form label { font-size: 12px; font-weight: 700; color: var(--lw-muted); text-transform: uppercase; letter-spacing: .06em; }
.lwrail-log-form label em { font-style: normal; font-weight: 500; color: var(--lw-faint); text-transform: none; letter-spacing: 0; }

.lwrail-log-form input[type="text"],
.lwrail-log-form input[type="date"],
.lwrail-log-form select {
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border: 1.5px solid var(--lw-line);
  border-radius: 10px;
  font-size: 15px;
  color: var(--lw-ink);
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.lwrail-log-form input:focus,
.lwrail-log-form select:focus {
  outline: none;
  border-color: var(--lw-blue);
  box-shadow: 0 0 0 4px rgba(30,136,229,.14);
}

.lwrail-station-list {
  position: absolute;
  z-index: 50;
  top: calc(100% + 4px);
  left: 0; right: 0;
  margin: 0; padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(19,62,118,.16);
  max-height: 240px;
  overflow-y: auto;
}
.lwrail-station-list li {
  padding: 9px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  color: var(--lw-ink);
}
.lwrail-station-list li.active, .lwrail-station-list li:hover { background: var(--lw-blue-soft); }

/* ---------- Train lookup dropdown (desktop + mobile) ---------- */
.lwrail-trainlookup { position: relative; }
.lwrail-train-results {
  position: absolute;
  z-index: 60;
  top: calc(100% + 4px);
  left: 0; right: 0;
  margin: 0; padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(19,62,118,.16);
  max-height: 240px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.lwrail-train-results li {
  padding: 11px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  color: var(--lw-ink);
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.lwrail-train-results li:hover,
.lwrail-train-results li:active,
.lwrail-train-results li.active { background: var(--lw-blue-soft); }

.lwrail-form-actions { grid-column: 1 / -1; margin-top: 4px; }

/* ---------- Multi-leg log form ---------- */
.lwrail-log-legs {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lwrail-log-leg {
  border: 1.5px solid var(--lw-line);
  border-radius: 12px;
  padding: 14px 16px;
  background: #f8fafc;
  transition: border-color .15s ease;
}
.lwrail-log-leg:focus-within { border-color: var(--lw-blue); }
.lwrail-log-leg-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.lwrail-log-leg-label {
  font-size: 11px;
  font-weight: 800;
  color: var(--lw-blue-deep);
  text-transform: uppercase;
  letter-spacing: .06em;
  background: var(--lw-blue-soft);
  padding: 3px 10px;
  border-radius: 6px;
}
.lwrail-remove-leg {
  width: 26px;
  height: 26px;
  border: 1.5px solid #fecaca;
  border-radius: 8px;
  background: #fff;
  color: #dc2626;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, border-color .15s ease;
}
.lwrail-remove-leg:hover { background: #fef2f2; border-color: #dc2626; }
.lwrail-log-leg-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.lwrail-add-stop {
  grid-column: 1 / -1;
  width: 100%;
  height: 42px;
  border: 2px dashed var(--lw-line);
  border-radius: 10px;
  background: transparent;
  color: var(--lw-blue-deep);
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.lwrail-add-stop:hover { border-color: var(--lw-blue); background: var(--lw-blue-soft); }

/* Sidebar multi-leg overrides */
.lwrail-log-form-side .lwrail-log-leg-fields {
  grid-template-columns: 1fr;
}
.lwrail-log-form-side .lwrail-add-stop {
  height: 36px;
  font-size: 13px;
}

.lwrail-log-submit {
  width: 100%;
  height: 50px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(135deg, #1e88e5, #0d47a1);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .01em;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(30,136,229,.32);
  transition: transform .1s ease, box-shadow .15s ease, opacity .15s ease;
}
.lwrail-log-submit:hover  { box-shadow: 0 10px 24px rgba(30,136,229,.4); transform: translateY(-1px); }
.lwrail-log-submit:active { transform: translateY(0); }
.lwrail-log-submit:disabled { opacity: .6; cursor: wait; transform: none; }

.lwrail-logged-notice {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #e7f6ec;
  border: 1px solid #bbdcC6;
  color: #15803d;
  padding: 12px 16px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 14px;
}

.lwrail-form-hint { font-size: 12.5px; color: var(--lw-faint); margin-top: 2px; }

/* ---------- Maps ---------- */
.lwrail-map {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--lw-line);
  box-shadow: var(--lw-shadow-sm);
}
.lwrail-journey-map, .lwrail-stations-map {
  width: 100%;
  border: none;
}
.lwrail-map-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid var(--lw-line);
  background: var(--lw-bg);
}
.lwrail-map-legend button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--lw-line);
  background: #fff;
  color: var(--lw-muted);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.lwrail-map-legend button span {
  color: var(--lw-muted);
  font-weight: 700;
}
.lwrail-map-legend button i.dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  display: inline-block;
}
.lwrail-map-legend button:hover {
  border-color: var(--lw-accent, #1e88e5);
  color: var(--lw-accent, #1e88e5);
}
.lwrail-map-legend button.is-active {
  border-color: var(--lw-accent, #1e88e5);
  color: var(--lw-accent, #1e88e5);
  box-shadow: 0 0 0 2px rgba(30, 136, 229, .15);
}
.lwrail-map-credit {
  padding: 8px 14px;
  margin: 0;
  border-top: 1px solid var(--lw-line);
  font-size: 11px;
  color: var(--lw-muted);
  background: var(--lw-bg);
}
.lwrail-fallback {
  height: 100%;
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--lw-muted);
  text-align: center;
  background: var(--lw-bg);
}

/* ---------- Export ---------- */
.lwrail-export-buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.lwrail-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 10px;
  border: 1.5px solid var(--lw-line);
  background: #fff;
  color: var(--lw-blue-deep);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: border-color .15s ease, background .15s ease;
}
.lwrail-btn:hover { border-color: var(--lw-blue); color: var(--lw-blue-deep); background: var(--lw-blue-soft); }

/* ---------- Premium gate / errors ---------- */
.lwrail-premium-gate {
  background: linear-gradient(135deg, #fff7ed, #ffedd5);
  border: 1px solid #fed7aa;
  border-radius: 14px;
  padding: 22px 26px;
  text-align: center;
  color: #b45309;
  margin: 22px 0;
}
.lwrail-premium-gate a { color: #ea580c; font-weight: 700; }

.lwrail-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  padding: 16px 20px;
  border-radius: 12px;
  margin: 22px 0;
  font-size: 14px;
}
.lwrail-error a { color: var(--lw-blue-deep); font-weight: 700; }

/* ---------- Nav tiles ---------- */
.lwrail-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 14px;
  margin: 26px 0;
}

.lwrail-nav-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 18px 12px 14px;
  background: var(--lw-surface);
  border: 1px solid var(--lw-line);
  border-radius: var(--lw-radius);
  box-shadow: var(--lw-shadow-sm);
  text-decoration: none !important;
  color: var(--lw-ink);
  text-align: center;
  position: relative;
  transition: transform .12s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
a.lwrail-nav-tile,
a.lwrail-nav-tile:visited { color: var(--lw-ink); }
.lwrail-nav-tile:hover {
  transform: translateY(-2px);
  border-color: rgba(30, 136, 229, .55);
  box-shadow: var(--lw-shadow);
  background: #fbfdff;
}
a.lwrail-nav-tile:hover,
a.lwrail-nav-tile:active,
a.lwrail-nav-tile:focus,
a.lwrail-nav-tile:hover .lwrail-nav-label,
a.lwrail-nav-tile:active .lwrail-nav-label,
a.lwrail-nav-tile:focus .lwrail-nav-label {
  color: var(--lw-blue-deep);
  text-decoration: none !important;
}

.lwrail-nav-icon {
  width: 40px; height: 40px;
  border-radius: 12px;
  background: linear-gradient(135deg, #e8f1fd, #cfe5fb);
  position: relative;
}
.lwrail-nav-tile:hover .lwrail-nav-icon { background: linear-gradient(135deg, #1e88e5, #0d47a1); }
.lwrail-nav-icon::before, .lwrail-nav-icon::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%);
}
.lwrail-nav-icon::before {
  width: 14px; height: 14px;
  border: 2.5px solid var(--lw-blue-deep);
  border-radius: 50%;
  border-top-color: transparent;
}
.lwrail-nav-icon::after {
  width: 18px; height: 2px;
  background: var(--lw-blue-deep);
  border-radius: 2px;
}
.lwrail-nav-tile:hover .lwrail-nav-icon::before { border-color: #fff; border-top-color: transparent; }
.lwrail-nav-tile:hover .lwrail-nav-icon::after { background: #fff; }

/* Per-section accent chips */
.lwrail-nav-tile[data-tile="profile"]     .lwrail-nav-icon { background: linear-gradient(135deg, #e8f1fd, #bfdbff); }
.lwrail-nav-tile[data-tile="stats"]       .lwrail-nav-icon { background: linear-gradient(135deg, #e9fbee, #bfeccb); }
.lwrail-nav-tile[data-tile="map"]         .lwrail-nav-icon { background: linear-gradient(135deg, #fdf0f4, #f8c6d6); }
.lwrail-nav-tile[data-tile="trips"]       .lwrail-nav-icon { background: linear-gradient(135deg, #f5f3ff, #d9d2ff); }
.lwrail-nav-tile[data-tile="collections"] .lwrail-nav-icon { background: linear-gradient(135deg, #eefbfb, #bfe9e8); }
.lwrail-nav-tile[data-tile="leaderboard"] .lwrail-nav-icon { background: linear-gradient(135deg, #fdf6e8, #f6dcae); }
.lwrail-nav-tile[data-tile="log"]         .lwrail-nav-icon { background: linear-gradient(135deg, #eef2f7, #d3dde9); }
.lwrail-nav-tile[data-tile="report"]      .lwrail-nav-icon { background: linear-gradient(135deg, #fdeeec, #f6c9c4); }

.lwrail-nav-tile[data-tile="profile"]:hover     .lwrail-nav-icon { background: linear-gradient(135deg, #42a5f5, #0d47a1); }
.lwrail-nav-tile[data-tile="stats"]:hover       .lwrail-nav-icon { background: linear-gradient(135deg, #34c767, #15803d); }
.lwrail-nav-tile[data-tile="map"]:hover         .lwrail-nav-icon { background: linear-gradient(135deg, #f06f9a, #be185d); }
.lwrail-nav-tile[data-tile="trips"]:hover       .lwrail-nav-icon { background: linear-gradient(135deg, #8b7cf6, #5b21b6); }
.lwrail-nav-tile[data-tile="collections"]:hover .lwrail-nav-icon { background: linear-gradient(135deg, #38bdb5, #0f766e); }
.lwrail-nav-tile[data-tile="leaderboard"]:hover .lwrail-nav-icon { background: linear-gradient(135deg, #f5b83d, #b45309); }
.lwrail-nav-tile[data-tile="log"]:hover         .lwrail-nav-icon { background: linear-gradient(135deg, #5c748f, #334155); }
.lwrail-nav-tile[data-tile="report"]:hover      .lwrail-nav-icon { background: linear-gradient(135deg, #ee6b60, #b91c1c); }

.lwrail-nav-label {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -.01em;
}

.lwrail-nav-go {
  position: absolute;
  top: 10px; right: 12px;
  font-size: 13px;
  line-height: 1;
  color: var(--lw-faint);
  opacity: 0;
  transform: translateX(-3px);
  transition: opacity .15s ease, transform .15s ease, color .15s ease;
}
.lwrail-nav-tile:hover .lwrail-nav-go { opacity: 1; transform: translateX(0); color: var(--lw-blue); }

/* ---------- Export (compact) ---------- */
.lwrail-export-compact {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 26px 0 4px;
  padding: 12px 16px;
  background: var(--lw-bg);
  border: 1px solid var(--lw-line);
  border-radius: 12px;
}
.lwrail-export-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--lw-muted);
}
.lwrail-export-compact .lwrail-btn { padding: 8px 16px; font-size: 13px; }

/* ---------- Data hub ---------- */
.lwrail-import-sections {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 18px;
}

.lwrail-import-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  padding: 14px 16px;
  background: #fff;
}

.lwrail-import-info { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lwrail-import-info strong { font-size: 14.5px; color: var(--lw-ink); }
.lwrail-import-info span { font-size: 12.5px; color: var(--lw-muted); }

.lwrail-import-controls { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }

.lwrail-file-btn {
  display: inline-flex;
  align-items: center;
  padding: 9px 14px;
  border-radius: 10px;
  border: 1.5px dashed var(--lw-faint);
  background: var(--lw-bg);
  color: var(--lw-muted);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s ease, color .15s ease;
}
.lwrail-file-btn:hover { border-color: var(--lw-blue); color: var(--lw-blue-deep); }

.lwrail-import-submit {
  padding: 9px 14px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #1e88e5, #0d47a1);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: opacity .15s ease, transform .1s ease;
}
.lwrail-import-submit:hover:not(:disabled) { transform: translateY(-1px); }
.lwrail-import-submit:disabled { opacity: .5; cursor: not-allowed; }

.lwrail-import-status { flex: 1 1 100%; font-size: 13px; font-weight: 600; padding-top: 2px; }
.lwrail-import-status.lwrail-import-pending { color: var(--lw-muted); }
.lwrail-import-status.lwrail-import-ok      { color: var(--lw-green); }
.lwrail-import-status.lwrail-import-err     { color: var(--lw-red); }

.lwrail-export-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 13px 16px;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  background: var(--lw-bg);
}
.lwrail-export-strip .lwrail-btn { padding: 8px 16px; font-size: 13px; }

/* ---------- Sidebar widget ---------- */
.lwrail-sidebar { display: flex; flex-direction: column; gap: 16px; }

.lwrail-ad-square {
  position: relative;
  aspect-ratio: 1 / 1;
  width: 100%;
  border-radius: 14px;
  border: 1.5px dashed var(--lw-line);
  background: linear-gradient(160deg, #f4f8fd, #eaf2fb);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--lw-muted);
  text-align: center;
}
.lwrail-ad-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--lw-faint);
  border: 1px solid var(--lw-line);
  border-radius: 6px;
  padding: 2px 6px;
}
.lwrail-ad-text { font-size: 13px; font-weight: 600; }

.lwrail-quicklog-side .lwrail-log-form-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lwrail-quicklog-side .lwrail-field { display: flex; flex-direction: column; gap: 6px; }

/* ---------- Data compact (one-button) ---------- */
.lwrail-data-compact .lwrail-data-compact-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.lwrail-data-compact .lwrail-data-compact-body p { margin: 0; }

/* ---------- All trips ---------- */
.lwrail-pagination {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.lwrail-page {
  min-width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9px;
  border: 1px solid var(--lw-line);
  background: #fff;
  color: var(--lw-ink);
  font-size: 13px;
  font-weight: 600;
}
.lwrail-page-current {
  background: linear-gradient(135deg, #1e88e5, #0d47a1);
  color: #fff;
  border-color: transparent;
}
.lwrail-page:hover:not(.lwrail-page-current) { border-color: var(--lw-blue); color: var(--lw-blue-deep); }

/* ---------- Trip legs (expandable journey) ---------- */
.lwrail-trips-row { cursor: pointer; position: relative; flex-wrap: wrap; }
.lwrail-trip-chevron {
  flex: 0 0 auto;
  width: 26px; height: 26px;
  margin-right: -4px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-blue-deep);
  font-size: 18px; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease;
}
.lwrail-trip-toggle.is-open .lwrail-trip-chevron { transform: rotate(90deg); border-color: var(--lw-blue); }
.lwrail-trip-legs { flex: 1 0 100%; margin-top: 4px; padding-top: 12px; border-top: 1px dashed var(--lw-line); }
.lwrail-trip-legs-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.lwrail-leg-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  background: var(--lw-blue-soft);
  border-radius: 10px;
  font-size: 13px;
}
.lwrail-leg-n { flex: 0 0 auto; font-weight: 700; color: var(--lw-blue-deep); text-transform: uppercase; font-size: 11px; letter-spacing: .04em; }
.lwrail-leg-route { flex: 1 1 auto; color: var(--lw-ink); }
.lwrail-leg-train { font-style: normal; font-weight: 600; color: var(--lw-muted); }
.lwrail-leg-miles { flex: 0 0 auto; font-weight: 800; color: var(--lw-blue-deep); font-variant-numeric: tabular-nums; }
.lwrail-leg-notes { flex: 1 1 100%; font-size: 12.5px; color: var(--lw-muted); background: rgba(26,86,151,.05); border-left: 3px solid var(--lw-blue-deep); border-radius: 6px; padding: 6px 10px; margin-top: 2px; }
.lwrail-leg-del {
  flex: 0 0 auto;
  width: 26px; height: 26px;
  border: 1px solid transparent; border-radius: 7px;
  background: transparent; color: var(--lw-faint);
  font-size: 15px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.lwrail-leg-del:hover { color: #dc2626; border-color: #fecaca; background: #fef2f2; }
.lwrail-leg-del:focus-visible { outline: 2px solid var(--lw-blue); outline-offset: 1px; }
.lwrail-leg-empty { color: var(--lw-muted); font-size: 13px; }
.lwrail-trip-legs-loading { list-style: none; margin: 0; padding: 0; color: var(--lw-muted); font-size: 13px; }

/* ---------- Filter bar ---------- */
.lwrail-filterbar {
  display: flex; flex-wrap: wrap; align-items: end; gap: 14px;
  padding: 14px 16px; margin-bottom: 16px;
  border: 1px solid var(--lw-line); border-radius: 12px;
  background: #fff;
}
.lwrail-filter-field { display: flex; flex-direction: column; gap: 6px; }
.lwrail-filter-field label { font-size: 11px; font-weight: 700; color: var(--lw-muted); text-transform: uppercase; letter-spacing: .05em; }
.lwrail-filter-typeahead { position: relative; }
.lwrail-tfilter-wrap { position: relative; }
.lwrail-filter-field select,
.lwrail-tfilter-input {
  height: 40px; padding: 0 12px;
  border: 1.5px solid var(--lw-line); border-radius: 10px;
  font-size: 14px; color: var(--lw-ink); background: #fff;
  min-width: 220px;
}
.lwrail-tfilter-input::placeholder { color: var(--lw-faint); }
.lwrail-tfilter-results {
  position: absolute;
  z-index: 60;
  top: calc(100% + 4px);
  left: 0; right: 0;
  margin: 0; padding: 6px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--lw-line);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(19,62,118,.16);
  max-height: 240px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.lwrail-tfilter-results li {
  padding: 11px 12px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  color: var(--lw-ink);
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.lwrail-tfilter-results li:hover,
.lwrail-tfilter-results li:active,
.lwrail-tfilter-results li.active { background: var(--lw-blue-soft); }
.lwrail-tfilter-results .lwrail-tfilter-empty { color: var(--lw-muted); cursor: default; }
.lwrail-filter-field select:focus,
.lwrail-tfilter-input:focus { outline: none; border-color: var(--lw-blue); box-shadow: 0 0 0 4px rgba(30,136,229,.14); }
.lwrail-filter-actions { display: inline-flex; gap: 10px; align-items: center; }

/* ---------- Report Issue ---------- */
.lwrail-report-form { display: flex; flex-direction: column; gap: 20px; }
.lwrail-report-field { display: flex; flex-direction: column; gap: 6px; }
.lwrail-report-field label { font-size: 12px; font-weight: 700; color: var(--lw-muted); text-transform: uppercase; letter-spacing: .05em; }
.lwrail-report-field label .required { color: #dc2626; }
.lwrail-report-field input[type="text"],
.lwrail-report-field input[type="email"],
.lwrail-report-field select,
.lwrail-report-field textarea {
  height: 46px;
  padding: 0 14px;
  border: 1.5px solid var(--lw-line);
  border-radius: 10px;
  font-size: 15px;
  color: var(--lw-ink);
  background: #fff;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.lwrail-report-field textarea { height: auto; min-height: 120px; padding: 12px 14px; resize: vertical; }
.lwrail-report-field input:focus,
.lwrail-report-field select:focus,
.lwrail-report-field textarea:focus {
  outline: none;
  border-color: var(--lw-blue);
  box-shadow: 0 0 0 4px rgba(30,136,229,.14);
}
.lwrail-hint { font-size: 12px; color: var(--lw-faint); }
.lwrail-report-actions { display: flex; gap: 12px; margin-top: 4px; }
.lwrail-report-submit {
  height: 46px; padding: 0 24px;
  border: none; border-radius: 10px;
  background: linear-gradient(135deg, #1e88e5, #0d47a1); color: #fff;
  font-size: 15px; font-weight: 700; cursor: pointer;
  transition: transform .1s ease, box-shadow .15s ease;
}
.lwrail-report-submit:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(30,136,229,.3); }
.lwrail-report-submit:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.lwrail-report-cancel {
  height: 46px; padding: 0 24px;
  border: 1.5px solid var(--lw-line); border-radius: 10px;
  background: #fff; color: var(--lw-muted);
  font-size: 15px; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; justify-content: center;
  transition: border-color .15s ease, color .15s ease;
}
.lwrail-report-cancel:hover { border-color: var(--lw-blue); color: var(--lw-blue); }
.lwrail-report-message { padding: 12px 16px; border-radius: 8px; font-size: 14px; font-weight: 500; }
.lwrail-report-message.success { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.lwrail-report-message.error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.lwrail-filter-apply {
  height: 40px; padding: 0 18px;
  border: none; border-radius: 10px;
  background: linear-gradient(135deg, #1e88e5, #0d47a1); color: #fff;
  font-size: 14px; font-weight: 700; cursor: pointer;
}
.lwrail-filter-clear { height: 40px; padding: 0 14px; border-radius: 10px; border: 1.5px solid var(--lw-line); color: var(--lw-muted); font-size: 13px; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; }

/* ---------- Collections ---------- */
.lwrail-col-new-btn {
  height: 40px; padding: 0 16px; border: none; border-radius: 10px; cursor: pointer;
  background: linear-gradient(135deg, #1e88e5, #0d47a1); color: #fff; font-size: 14px; font-weight: 700;
}
.lwrail-col-create {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 14px 16px; margin-bottom: 16px; border: 1px solid var(--lw-line); border-radius: 12px; background: #fff;
}
.lwrail-col-create input[type="text"] {
  height: 40px; padding: 0 12px; border: 1.5px solid var(--lw-line); border-radius: 10px; font-size: 14px; color: var(--lw-ink);
}
.lwrail-col-create input#lwrail-col-name { flex: 1 1 220px; }
.lwrail-col-create input#lwrail-col-desc { flex: 2 1 280px; }
.lwrail-col-create-submit {
  height: 40px; padding: 0 16px; border: none; border-radius: 10px; cursor: pointer;
  background: linear-gradient(135deg, #1e88e5, #0d47a1); color: #fff; font-weight: 700;
}
.lwrail-col-create-cancel {
  height: 40px; padding: 0 14px; border: 1.5px solid var(--lw-line); border-radius: 10px; cursor: pointer;
  background: #fff; color: var(--lw-muted); font-weight: 600;
}
.lwrail-col-list { display: flex; flex-direction: column; gap: 14px; }
.lwrail-col-loading, .lwrail-col-empty { color: var(--lw-muted); font-size: 14px; padding: 8px 0; }
.lwrail-col-card { border: 1px solid var(--lw-line); border-radius: 12px; background: #fff; overflow: hidden; }
.lwrail-col-card-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 14px 16px; border-bottom: 1px solid var(--lw-line);
}
.lwrail-col-card-head strong { font-size: 16px; color: var(--lw-ink); }
.lwrail-col-card-head small { font-size: 12.5px; color: var(--lw-muted); display: block; }
.lwrail-col-card-actions { display: inline-flex; gap: 8px; }
.lwrail-col-add-btn {
  height: 34px; padding: 0 14px; border: none; border-radius: 8px; cursor: pointer;
  background: var(--lw-blue-soft); color: var(--lw-blue-deep); font-weight: 700; font-size: 13px;
}
.lwrail-col-del-btn {
  height: 34px; padding: 0 12px; border: 1.5px solid #fecaca; border-radius: 8px; cursor: pointer;
  background: #fff; color: #dc2626; font-weight: 600; font-size: 13px;
}
.lwrail-col-items { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; }
.lwrail-col-item {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 12px; background: var(--lw-blue-soft); border-radius: 10px;
}
.lwrail-col-item-main { flex: 1 1 auto; min-width: 0; }
.lwrail-col-item-main strong { display: block; font-size: 14px; color: var(--lw-ink); }
.lwrail-col-item-link { color: var(--lw-blue-deep); text-decoration: none; border-bottom: 1px dotted currentColor; }
.lwrail-col-item-link:hover { text-decoration: underline; }
.lwrail-col-item-main small { font-size: 12px; color: var(--lw-muted); }
.lwrail-col-item-remove {
  height: 30px; padding: 0 10px; border: 1.5px solid #fecaca; border-radius: 8px; cursor: pointer;
  background: #fff; color: #dc2626; font-size: 12px; font-weight: 600;
}
.lwrail-col-addpanel {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
  padding: 14px 16px; border-top: 1px dashed var(--lw-line);
}
.lwrail-col-search { grid-column: 1 / -1; }
.lwrail-col-search-input {
  width: 100%; box-sizing: border-box;
  padding: 10px 12px; border: 1.5px solid var(--lw-line); border-radius: 8px;
  font-size: 13px; color: var(--lw-ink); background: #fff;
}
.lwrail-col-search-input:focus { outline: none; border-color: var(--lw-blue); }
.lwrail-col-search-results { margin-top: 8px; }
.lwrail-col-search-hint { color: var(--lw-muted); font-size: 12px; padding: 6px 2px; }
.lwrail-col-addsrc h4 { margin: 0 0 8px; font-size: 12px; font-weight: 800; color: var(--lw-muted); text-transform: uppercase; letter-spacing: .05em; }
.lwrail-col-src-loading { color: var(--lw-muted); font-size: 13px; }
.lwrail-col-src-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 10px; border: 1px solid var(--lw-line); border-radius: 8px; margin-bottom: 6px;
}
.lwrail-col-src-main { font-size: 13px; color: var(--lw-ink); font-weight: 600; }
.lwrail-col-src-main small { display: block; font-weight: 500; color: var(--lw-muted); }
.lwrail-col-src-add {
  height: 28px; padding: 0 10px; border: none; border-radius: 8px; cursor: pointer;
  background: var(--lw-blue-soft); color: var(--lw-blue-deep); font-weight: 700; font-size: 12px;
}
@media (max-width: 640px) {
  .lwrail-col-addpanel { grid-template-columns: 1fr; }
}

/* ---------- Responsive ---------- */
@media (max-width: 640px) {
  .lwrail-profile-stats { grid-template-columns: repeat(2, 1fr); }
  .lwrail-stat:nth-child(2) { border-right: none; }
  .lwrail-stat:nth-child(-n+2) { border-bottom: 1px solid var(--lw-line); }
  .lwrail-stat-tiles { grid-template-columns: repeat(2, 1fr); }
  .lwrail-log-form { grid-template-columns: 1fr; }
  .lwrail-log-leg-fields { grid-template-columns: 1fr; }
  .lwrail-profile-hero { flex-direction: column; text-align: center; }
  .lwrail-module { padding: 18px 16px; }
}

/* ---------- Membership / plans ---------- */
.lwrail-plan-card.is-current {
  border-color: #16a34a;
  box-shadow: 0 0 0 2px rgba(22, 163, 74, .18);
}
.lwrail-plan-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 4px;
  width: 100%;
}
.lwrail-plan-options .btn {
  width: 100%;
  justify-content: center;
  text-align: center;
}
.lwrail-plan-per {
  opacity: .75;
  font-size: .85em;
}

/* Season network routes (progress page) */
.lwrail-season-routes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.lwrail-season-routes li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border, #e3ecf6);
  font-size: 14px;
}
.lwrail-season-routes li:last-child { border-bottom: 0; }
.lwrail-season-route { font-weight: 600; }
.lwrail-season-meta { color: #6b7280; font-size: 12px; white-space: nowrap; }

/* Season network: the design's schematic map view. */
.lwrail-season-routes + .tm-map,
.tm-map svg { display: block; }
.tm-map svg .tm-arc,
.tm-map svg .tm-route,
.tm-map svg .tm-node,
.tm-map svg .tm-node-label { vector-effect: non-scaling-stroke; }

/* The .tm-day tiles are a live read-out of logged trips, not a tap target.
   Neutralise the prototype tap-to-toggle so nobody can fake travel on live
   data (redundant with the non-interactive markup; belt and braces). */
.tm-streak[data-live] .tm-day { pointer-events: none; cursor: default; user-select: none; }

/* ============================================================================
   Design-system integration (dark oklch theme).
   Re-skins the legacy lwrail-module components with the loporail theme's
   design tokens so every plugin page inherits the new colour/style. Each
   token falls back to the plugin's own light palette when the theme isn't
   present, so the plugin stays usable anywhere.
   ========================================================================== */
#lwrail-nav,
.lwrail-module,
.lwrail-sidebar .lwrail-ad-square,
.lwrail-nav,
.lwrail-service-results,
.lwrail-train-results {
  --lw-surface:  var(--surface, #ffffff);
  --lw-ink:      var(--fg, #14263c);
  --lw-muted:    var(--muted, #5d7089);
  --lw-faint:    var(--muted, #8da2bb);
  --lw-line:     var(--border, #e3ecf6);
  --lw-blue:     var(--accent, #1e88e5);
  --lw-blue-deep: var(--accent-2, #0d47a1);
  --lw-blue-soft: var(--accent-soft, #e8f1fd);
  --lw-surface-2: var(--surface-2, #f2f6fb);
  --lw-bg:       var(--bg, #f2f6fb);
  --lw-amber:    var(--warn, #f59e0b);
  --lw-green:    var(--ok, #16a34a);
  --lw-red:      var(--danger, #dc2626);
}

#lwrail-nav .lwrail-nav-tile,
.lwrail-module,
.lwrail-sidebar .lwrail-ad-square {
  background: var(--lw-surface);
  border: 1px solid var(--lw-line);
  border-radius: var(--radius-lg, 16px);
  box-shadow: none;
}

/* ---- Module headers: kicker -> design "bento-kicker", tag -> "el-chip" ---- */
.lwrail-module-head {
  padding-bottom: 6px;
  margin-bottom: 18px;
}
.lwrail-module-kicker,
.lwrail-quicklog-side .lwrail-module-kicker {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent, var(--lw-blue));
}
.lwrail-module-title {
  font-family: var(--font-display, inherit);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--lw-ink);
}
.lwrail-module-tag {
  border: 1px solid var(--border-strong, var(--lw-line));
  background: transparent;
  color: var(--lw-muted);
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 999px;
}

/* ---- Nav tiles: design's dashboard tiles ---- */
#lwrail-nav { display: grid; gap: 10px; margin: 20px 0 4px; }
#lwrail-nav .lwrail-nav-tile {
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 13px;
  align-items: center;
  padding: 13px 16px;
  color: var(--lw-ink);
  text-decoration: none;
}
#lwrail-nav .lwrail-nav-tile:hover {
  transform: translateY(-1px);
  border-color: var(--border-strong, var(--lw-line));
  background: var(--surface-soft, #fff);
}
#lwrail-nav .lwrail-nav-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background: var(--fg-soft, linear-gradient(135deg, #e8f1fd, #bfdbff));
}
#lwrail-nav .lwrail-nav-tile[data-tile] .lwrail-nav-icon { background: var(--fg-soft, #eef2f7); }
#lwrail-nav .lwrail-nav-label {
  font-family: var(--font-display, inherit);
  font-size: 14.5px;
  font-weight: 600;
  color: var(--lw-ink);
}
#lwrail-nav .lwrail-nav-go {
  opacity: 0.55;
  transform: translateX(-4px);
  color: var(--lw-muted);
}
#lwrail-nav .lwrail-nav-tile:hover .lwrail-nav-go {
  opacity: 1;
  transform: translateX(0);
  color: var(--accent, var(--lw-blue));
}

/* ---- Quick-log form: design panel + controls ---- */
.lwrail-log-form,
.lwrail-log-form-side {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.lwrail-log-form label,
.lwrail-quicklog-side .lwrail-log-form label {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lw-muted);
}
.lwrail-log-form label em,
.lwrail-quicklog-side .lwrail-log-form label em {
  font-family: inherit;
  color: var(--lw-faint);
}
.lwrail-log-form input[type="text"],
.lwrail-log-form input[type="date"],
.lwrail-log-form select,
.lwrail-quicklog-side select,
.lwrail-report-field input[type="text"],
.lwrail-report-field input[type="email"],
.lwrail-report-field select,
.lwrail-report-field textarea,
.lwrail-station-input,
.lwrail-train-input {
  background: var(--surface-2, #fff);
  border: 1px solid var(--border, #dbe6f4);
  border-radius: var(--radius-sm, 10px);
  color: var(--lw-fg, var(--lw-ink, #14263c));
  padding: 11px 13px;
  min-height: 44px;
}
.lwrail-log-form input::placeholder,
.lwrail-report-field input::placeholder,
.lwrail-report-field textarea::placeholder {
  color: var(--border-strong, #8da2bb);
}
.lwrail-log-form input:focus,
.lwrail-log-form select:focus,
.lwrail-report-field input:focus,
.lwrail-report-field select:focus,
.lwrail-report-field textarea:focus,
.lwrail-station-input:focus,
.lwrail-train-input:focus {
  border-color: var(--accent, var(--lw-blue));
  outline: 2px solid var(--accent-soft, #e8f1fd);
  outline-offset: 0;
}
.lwrail-log-leg {
  background: var(--surface-soft, #ffffff);
  border-color: var(--lw-line);
}
.lwrail-log-leg:focus-within { border-color: var(--accent, var(--lw-blue)); }
.lwrail-log-leg-label {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lw-muted);
}
.lwrail-add-stop,
.lwrail-remove-unit {
  color: var(--accent, var(--lw-blue));
  border-color: var(--border-strong, var(--lw-line));
}
.lwrail-add-stop:hover,
.lwrail-remove-unit:hover {
  border-color: var(--accent, var(--lw-blue));
}
.lwrail-logged-notice {
  background: var(--ok-soft, #ecfdf5);
  color: var(--ok, #065f46);
  border-color: color-mix(in oklch, var(--ok, #16a34a) 34%, transparent);
}
.lwrail-log-submit,
.lwrail-report-submit {
  background: var(--grad, linear-gradient(96deg, #42a5f5, #1e88e5, #66bb6a));
  color: var(--on-accent, #ffffff);
  border: 0;
  border-radius: var(--radius-sm, 10px);
  font-weight: 700;
  min-height: 44px;
}
.lwrail-log-submit:hover,
.lwrail-report-submit:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 8px 20px color-mix(in oklch, var(--accent, #1e88e5) 30%, transparent); }
.lwrail-report-cancel {
  border-color: var(--lw-line);
  color: var(--lw-muted);
}
.lwrail-report-cancel:hover { border-color: var(--accent, var(--lw-blue)); color: var(--accent, var(--lw-blue)); }

/* ---- Autocomplete dropdowns ---- */
.lwrail-service-results,
.lwrail-train-results {
  background: var(--surface-2, #ffffff);
  border: 1px solid var(--lw-line);
  border-radius: var(--radius-sm, 10px);
  box-shadow: 0 10px 30px color-mix(in oklch, var(--bg, #0d1b2a) 25%, transparent);
}
.lwrail-service-results li:hover,
.lwrail-train-results li:hover,
.lwrail-station-suggestion.active,
.lwrail-service-result.active,
.lwrail-train-suggestion.active {
  background: var(--accent-soft, #e8f1fd);
}

/* ---- Maps: design framed panels ---- */
.lwrail-map,
.lwrail-stations-map,
.lwrail-journey-map {
  border: 1px solid var(--lw-line);
  border-radius: var(--radius-lg, 16px);
  overflow: hidden;
}
.lwrail-stations-map,
.lwrail-journey-map { background: var(--surface-2, #eef2f7); }
.lwrail-map-credit {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--lw-faint);
}

/* ---- Leaderboard rows: design tm-rank treatment ---- */
.lwrail-lb-row {
  display: grid;
  grid-template-columns: 38px 40px 1fr auto;
  gap: 14px;
  padding: 12px 16px;
  color: var(--lw-ink);
}
.lwrail-lb-row + .lwrail-lb-row { border-top: 1px solid var(--lw-line); }
.lwrail-lb-row:hover { background: var(--fg-soft, #eef2f7); }
.lwrail-lb-row.lwrail-lb-me { background: var(--accent-soft, #e8f1fd); }
.lwrail-lb-row.lwrail-lb-me:hover { background: var(--accent-soft, #e8f1fd); }
.lwrail-lb-rank {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
  font-size: 12px;
  color: var(--lw-muted);
}
.lwrail-lb-rank.gold { background: linear-gradient(135deg,#fde68a,#f59e0b); color: #7c4a00; }
.lwrail-lb-rank.silver { background: linear-gradient(135deg,#e2e8f0,#94a3b8); color: #334155; }
.lwrail-lb-rank.bronze { background: linear-gradient(135deg,#fed7aa,#d97706); color: #7c2d12; }
.lwrail-lb-avatar img { border-radius: 12px; }
.lwrail-lb-user,
.lwrail-lb-user strong { color: var(--lw-ink); }
.lwrail-lb-user small { color: var(--lw-muted); }
.lwrail-lb-value { font-family: var(--font-display, inherit); font-weight: 700; color: var(--lw-ink); }

/* ---- Recent trips rows ---- */
.lwrail-trips-row { color: var(--lw-ink); }
.lwrail-trips-row:hover { background: var(--fg-soft, #f2f6fb); }
.lwrail-trips-main strong { color: var(--lw-ink); }
.lwrail-trips-main small { color: var(--lw-muted); }
.lwrail-trips-metric, .lwrail-trips-metric span { color: var(--lw-ink); }
.lwrail-trips-badge {
  background: var(--fg-soft, #eef2f7);
  border-color: var(--lw-line);
  color: var(--lw-muted);
}
.lwrail-profile-name { color: var(--lw-ink); }
.lwrail-profile-bio { color: var(--lw-muted); }
.lwrail-stat, .lwrail-stat a { background: var(--surface-soft, #ffffff); border-color: var(--lw-line); }
.lwrail-stat strong, .lwrail-stat a strong { color: var(--lw-ink); }
.lwrail-stat span, .lwrail-stat a span { color: var(--lw-muted); }
.lwrail-stat a:hover { border-color: var(--accent, var(--lw-blue)); }
.lwrail-drill-hint { color: var(--lw-faint); }

/* =========================================================
   Design-feedback harden (v1.16.1)
   =========================================================

   These rules make the plugin's own mapped tokens win over
   theme rail.css component styles, so the muted legacy blues
   are replaced by theme oklch tokens. All values fall back to
   the plugin's own (--lw-*) paint when the theme is absent.
   ========================================================= */

/* ---- Forms: bump out of the page ========================= */
.lwrail-module .lwrail-log-form input[type="text"],
.lwrail-module .lwrail-log-form input[type="date"],
.lwrail-module .lwrail-log-form input[type="time"],
.lwrail-module .lwrail-log-form select,
.lwrail-quicklog-side select,
.lwrail-module .lwrail-station-input,
.lwrail-module .lwrail-train-input,
.lwrail-report-card .input,
.lwrail-report-card .select,
.lwrail-report-card .textarea {
  background: var(--surface, var(--lw-surface));
  border: 1px solid var(--border-strong, var(--lw-line));
  border-radius: var(--radius, 12px);
  color: var(--fg, var(--lw-ink));
  font-size: 15px;
  transition: border-color .14s ease, background-color .14s ease, box-shadow .14s ease;
}
.lwrail-module .lwrail-log-form input:hover,
.lwrail-module .lwrail-log-form select:hover,
.lwrail-module .lwrail-station-input:hover,
.lwrail-report-card .input:hover,
.lwrail-report-card .select:hover,
.lwrail-report-card .textarea:hover {
  border-color: var(--fg, var(--lw-ink));
}
.lwrail-module .lwrail-log-form input:focus,
.lwrail-module .lwrail-log-form select:focus,
.lwrail-module .lwrail-station-input:focus,
.lwrail-report-card .input:focus,
.lwrail-report-card .select:focus,
.lwrail-report-card .textarea:focus {
  outline: none;
  border-color: var(--accent, var(--lw-blue));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-soft, var(--lw-blue-soft)) 70%, transparent);
}
.lwrail-module .lwrail-log-form select,
.lwrail-quicklog-side select,
.lwrail-report-card .select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted, var(--lw-muted)) 50%), linear-gradient(135deg, var(--muted, var(--lw-muted)) 50%, transparent 50%);
  background-position: calc(100% - 17px) 50%, calc(100% - 12px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 38px;
}

/* ---- Buttons: pill, min-height, sticky against bg --------- */
.lwrail-module .lwrail-log-submit,
.lwrail-report-card .lwrail-report-submit,
.lwrail-module .lwrail-btn,
.lwrail-report-card .btn {
  border-radius: var(--radius-pill, 999px);
  min-height: 46px;
  padding: 0 22px;
  font-weight: 700;
}
.lwrail-report-card .btn-ghost {
  background: transparent;
  border: 1px solid var(--border-strong, var(--lw-line));
  color: var(--muted, var(--lw-muted));
  border-radius: var(--radius-pill, 999px);
  min-height: 46px;
  padding: 0 22px;
  font-weight: 700;
}

/* ---- Report card: compact card, not a full-width tile ------ */
.lwrail-report-card {
  background: var(--surface, var(--lw-surface));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 20px);
  padding: clamp(18px, 2.2vw, 26px);
}
.lwrail-report-card .lwrail-report-form { display: block; }
.lwrail-report-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 16px;
}
.lwrail-report-wide { grid-column: 1 / -1; }
@media (max-width: 640px) {
  .lwrail-report-grid { grid-template-columns: 1fr; }
}
.lwrail-report-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  flex-wrap: wrap;
  margin-top: 18px;
}
.lwrail-hint { font-size: 12px; color: var(--muted, var(--lw-muted)); }

/* ---- Unit filterbar (mi / km / mi + ch) -------------------- */
.el-filterbar[data-units] { margin: 14px 0 2px; }
.el-filterbar[data-units] .el-filter { cursor: pointer; }
.el-filterbar[data-units] .el-filter.is-active {
  background: var(--accent-soft, var(--lw-blue-soft));
  color: var(--accent, var(--lw-blue-deep));
  border-color: color-mix(in srgb, var(--accent, var(--lw-blue)) 40%, transparent);
}

/* ---- Stat tiles are links now ------------------------------ */
.tm-stat__value[data-unit-root] { position: relative; }
.tm-stat__value[data-unit-root] [data-mi],
.tm-stat__value [data-mi] {
  font-size: 1em;
  line-height: 1;
  color: inherit;
  letter-spacing: inherit;
  margin: 0;
}
a.tm-stat {
  color: inherit;
  text-decoration: none;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
a.tm-stat::after {
  content: '↗';
  position: absolute;
  top: 14px; right: 16px;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  color: var(--muted, var(--lw-muted));
  opacity: 0;
  transition: opacity .16s ease, color .16s ease;
}
a.tm-stat:hover {
  transform: translateY(-3px);
  border-color: color-mix(in oklch, var(--accent, var(--lw-blue)) 45%, var(--border, var(--lw-line)));
  box-shadow: var(--shadow-2, 0 12px 28px rgba(13, 27, 42, .16));
}
a.tm-stat:hover::after { opacity: 1; color: var(--accent, var(--lw-blue)); }
a.tm-stat:focus-visible { outline: 2px solid var(--accent, var(--lw-blue)); outline-offset: 2px; }

/* ---- Drills: dark accordion (details/summary) --------------- */
.lwrail-drills {
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 20px);
  overflow: hidden;
  background: var(--surface, var(--lw-surface));
  margin-top: 18px;
}
.lwrail-drill { border-top: 1px solid var(--border, var(--lw-line)); }
.lwrail-drill:first-child { border-top: 0; }
.lwrail-drill summary::-webkit-details-marker { display: none; }
.lwrail-drill-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  width: 100%;
  padding: 16px 18px;
  list-style: none;
  cursor: pointer;
  color: var(--fg, var(--lw-ink));
  background: transparent;
  border: 0;
  text-align: left;
  font: inherit;
  user-select: none;
}
.lwrail-drill-head:hover { background: var(--fg-soft, var(--lw-surface-2)); }
.lwrail-drill-key {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10.5px;
  letter-spacing: .1em;
  color: var(--muted, var(--lw-muted));
}
.lwrail-drill-q {
  font-family: var(--font-display, inherit);
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: -0.015em;
}
.lwrail-drill-count {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10.5px;
  letter-spacing: .04em;
  color: var(--muted, var(--lw-muted));
  white-space: nowrap;
}
.lwrail-drill-chev {
  color: var(--muted, var(--lw-muted));
  font-size: 16px;
  line-height: 1;
  transition: transform .22s ease, color .22s ease;
}
.lwrail-drill[open] .lwrail-drill-chev { transform: rotate(90deg); color: var(--accent, var(--lw-blue)); }
.lwrail-drill-body {
  padding: 2px 18px 18px 44px;
  color: var(--muted, var(--lw-muted));
  font-size: 14px;
  line-height: 1.62;
}

/* ---- Year-in-numbers cards --------------------------------- */
.lwrail-year-nums {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
  margin-bottom: 4px;
}
.lwrail-year-num {
  background: var(--surface-2, var(--lw-surface-2));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 20px);
  padding: 18px 18px 16px;
  display: grid;
  gap: 10px;
}
.lwrail-year-num .bento-num { font-size: clamp(28px, 3vw, 38px); }
.lwrail-year-num .bento-num [data-mi],
.lwrail-year-num .bento-num__u { font-size: .4em; color: var(--muted, var(--lw-muted)); letter-spacing: 0; margin-left: 4px; }
.lwrail-year-num .bento-num [data-mi] { font-size: 1em; color: var(--fg, var(--lw-ink)); margin-left: 0; }
.lwrail-year-num-month {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-style: normal;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--accent, var(--lw-blue));
  display: block;
  margin-top: 4px;
}

/* ---- Heatstrip re-skin to tokens ---------------------------- */
.lwrail-heat-total { font-size: 12px; color: var(--muted, var(--lw-muted)); }
.lwrail-heat-track { background: var(--fg-soft, var(--lw-line)); }
.lwrail-heat-bar {
  background: var(--grad, linear-gradient(180deg, #f03d8b, #b93bd4));
}
.lwrail-heat-month.is-on .lwrail-heat-k { color: var(--accent, var(--lw-blue)); }

/* ---- Recent trips: el-trow overrides ------------------------ */
.el-trow .lwrail-trips-badge,
.lwrail-trips-badge {
  width: 34px;
  height: 26px;
  padding: 0;
  border-radius: 999px;
  background: var(--accent-soft, var(--lw-blue-soft));
  color: var(--accent, var(--lw-blue-deep));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .02em;
}
.el-trow__metric [data-mi] {
  font-size: 1em;
  font-weight: 700;
  font-family: var(--font-display, inherit);
  color: var(--fg, var(--lw-ink));
  margin: 0;
  letter-spacing: -0.03em;
}
.el-trow__metric [data-unit-suffix] { letter-spacing: .04em; }
.el-trow .lwrail-source-chip { justify-self: end; }
.el-trow .lwrail-trip-legs {
  grid-column: 1 / -1;
  margin: 0;
  padding: 4px 0 8px 44px;
  border: 0;
  color: var(--muted, var(--lw-muted));
  font-size: 13px;
}

/* ---- Legacy all-trips rows: token re-skin -------------------- */
.lwrail-trips-row {
  background: var(--surface, var(--lw-surface));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 20px);
  box-shadow: none;
}
.lwrail-trips-row:hover {
  border-color: var(--border-strong, var(--lw-line));
  background: var(--fg-soft, var(--lw-surface-2));
  box-shadow: none;
  transform: none;
}
.lwrail-trips-metric strong { color: var(--fg, var(--lw-ink)); font-family: var(--font-display, inherit); font-size: 19px; letter-spacing: -0.03em; }
.lwrail-trips-metric span { color: var(--muted, var(--lw-muted)); font-family: var(--font-mono, ui-monospace, Menlo, monospace); }
.lwrail-trips-main strong { color: var(--fg, var(--lw-ink)); }
.lwrail-trips-main small .lwrail-trip-name { color: var(--accent, var(--lw-blue-deep)); }

/* ---- Chevron circle (both theme el-trow + legacy) ------------ */
.lwrail-trip-chevron {
  width: 26px;
  height: 26px;
  margin-right: 0;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 99px;
  background: var(--surface, var(--lw-surface));
  color: var(--muted, var(--lw-muted));
  font-size: 13px;
  line-height: 1;
  display: grid;
  place-content: center;
  padding: 0;
}
.lwrail-trip-chevron:hover { color: var(--fg, var(--lw-ink)); border-color: var(--border-strong, var(--lw-line)); }
.lwrail-trip-toggle.is-open .lwrail-trip-chevron,
.lwrail-trip-toggle[open] .lwrail-trip-chevron {
  transform: rotate(90deg);
  color: var(--accent, var(--lw-blue));
  border-color: color-mix(in srgb, var(--accent, var(--lw-blue)) 40%, transparent);
}

/* ---- Source chips: dark pills -------------------------------- */
.lwrail-source-chip,
.lwrail-source-chip.nre,
.lwrail-source-chip.haversine,
.lwrail-source-chip.imported,
.lwrail-source-chip.manual {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--border, var(--lw-line));
  color: var(--muted, var(--lw-muted));
  background: var(--fg-soft, var(--lw-surface-2));
}
.lwrail-source-chip.nre { color: var(--ok, #1a9e5b); border-color: color-mix(in srgb, var(--ok, #1a9e5b) 35%, transparent); background: color-mix(in srgb, var(--ok, #1a9e5b) 10%, transparent); }
.lwrail-source-chip.haversine { color: var(--warn, #b45309); border-color: color-mix(in srgb, var(--warn, #b45309) 35%, transparent); background: color-mix(in srgb, var(--warn, #b45309) 10%, transparent); }
.lwrail-source-chip.imported { color: var(--info, #2563eb); border-color: color-mix(in srgb, var(--info, #2563eb) 35%, transparent); background: color-mix(in srgb, var(--info, #2563eb) 10%, transparent); }
.lwrail-source-chip.manual { color: var(--muted, var(--lw-muted)); }

/* ---- Drill tables / badges: token look ------------------------ */
.lwrail-drill-table .lwrail-crs {
  background: var(--fg-soft, var(--lw-surface-2));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 999px;
  padding: 1px 8px;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  color: var(--muted, var(--lw-muted));
}
.lwrail-country-badge {
  background: var(--surface-2, var(--lw-surface-2));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 999px;
  color: var(--muted, var(--lw-muted));
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
}

/* ---- Stats "visit journal" chips ------------------------------ */
.lwrail-stats-drill {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.lwrail-stats-drill a {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--muted, var(--lw-muted));
  border: 1px solid var(--border, var(--lw-line));
  padding: 8px 14px;
  border-radius: 999px;
  text-decoration: none;
  transition: color .14s ease, border-color .14s ease;
}
.lwrail-stats-drill a:hover { color: var(--accent, var(--lw-blue)); border-color: var(--accent, var(--lw-blue)); }

/* ---- Season routes recap: token list -------------------------- */
.lwrail-season-meta { font-family: var(--font-mono, ui-monospace, Menlo, monospace); font-size: 11px; color: var(--muted, var(--lw-muted)); letter-spacing: .04em; }
.lwrail-season-route { color: var(--fg, var(--lw-ink)); font-weight: 600; }

/* ---- Leaderboard mile amounts: keep them on-token ------------- */
.tm-rank .tm-rank__miles [data-mi],
.tm-rank__miles[data-unit-root] [data-mi] {
  font-size: 1em;
  font-weight: inherit;
  color: inherit;
  margin: 0;
}

/* ---- Buttons / data hub / empty + error states ---- */
.lwrail-btn {
  background: var(--grad, linear-gradient(96deg, #42a5f5, #1e88e5, #66bb6a));
  color: var(--on-accent, #ffffff);
  border: 0;
  border-radius: var(--radius-sm, 10px);
  font-weight: 700;
}
.lwrail-btn:hover {
  filter: brightness(1.07);
  color: var(--on-accent, #ffffff);
  background: var(--grad, linear-gradient(96deg, #42a5f5, #1e88e5, #66bb6a));
  transform: translateY(-1px);
}
.lwrail-import-row {
  background: var(--surface-soft, #ffffff);
  border-color: var(--lw-line);
}
.lwrail-import-info strong { color: var(--lw-ink); }
.lwrail-import-info span { color: var(--lw-muted); }
.lwrail-import-file { color: var(--lw-muted); }
.lwrail-export-strip { border-top-color: var(--lw-line); }
.lwrail-export-label { color: var(--lw-muted); }
.lwrail-module-empty {
  background: var(--surface-soft, var(--lw-surface-2));
  border: 1px dashed var(--border-strong, var(--lw-line));
  border-radius: var(--radius-lg, 16px);
  color: var(--lw-muted);
}
.lwrail-module-empty strong { color: var(--lw-ink); }
.lwrail-error {
  background: var(--danger-soft, #fef2f2);
  border: 1px solid var(--danger, #fecaca);
  border-radius: var(--radius-lg, 16px);
  color: var(--danger, #b91c1c);
}
.lwrail-error a { color: var(--accent, var(--lw-blue)); }
.lwrail-data-compact .lwrail-btn { color: var(--on-accent, #fff); }

/* =========================================================
   Dark theme fallbacks (when theme oklch vars unavailable)
   ========================================================= */
:root {
  /* Dark oklch fallbacks matching theme rail.css */
  --bg: #0d1b2a;
  --surface: #14263c;
  --surface-2: #1b3a5c;
  --fg: #e8edf5;
  --fg-soft: #8da2bb;
  --muted: #5d7089;
  --border: #1e3a5f;
  --border-strong: #2a4a6f;
  --accent: #42a5f5;
  --accent-soft: #1e3a5f;
  --accent-2: #f03d8b;
  --accent-3: #b93bd4;
  --grad: linear-gradient(180deg, #f03d8b, #b93bd4);
  --on-accent: #0d1b2a;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-display: "Space Grotesk", ui-sans-serif, system-ui;
  --gap-md: 16px;
  --gap-lg: 24px;
  --shadow-1: 0 4px 14px rgba(13,27,42,0.4);
  --shadow-2: 0 12px 28px rgba(13,27,42,0.5);
  --ok: #1a9e5b;
  --warn: #b45309;
  --danger: #dc2626;
  --info: #2563eb;
  --danger-soft: #fef2f2;
}

/* =========================================================
   v1.16.2 Layout condensation & gamification
   ========================================================= */

/* Tighter module spacing */
.lwrail-module {
  margin-bottom: 20px;
}
.lwrail-module-head {
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.lwrail-module-title { font-size: 1.25rem; margin: 4px 0 0; }
.lwrail-module-kicker { font-size: 0.7rem; text-transform: uppercase; letter-spacing: .12em; }

/* Condense lwrail-module card padding */
.lwrail-module > .lwrail-module-head + *,
.lwrail-module > .lwrail-module-head ~ * {
  padding: 14px 16px;
}

/* Badges: earned vs locked (gamification) */
.tm-badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; }
.tm-badge {
  position: relative;
  padding: 12px 10px;
  border-radius: var(--radius-lg, 16px);
  background: var(--surface, var(--lw-surface));
  border: 1px solid var(--border, var(--lw-line));
  text-align: center;
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.tm-badge:hover { transform: translateY(-2px); box-shadow: var(--shadow-1, 0 4px 14px rgba(13,27,42,.1)); }
.tm-badge.is-earned {
  border-color: color-mix(in srgb, var(--ok, #1a9e5b) 40%, var(--border, var(--lw-line)));
  background: color-mix(in srgb, var(--ok, #1a9e5b) 8%, var(--surface, var(--lw-surface)));
}
.tm-badge.is-locked {
  opacity: 0.6;
  filter: grayscale(0.8);
  border-style: dashed;
}
.tm-badge__icon { font-size: 28px; line-height: 1; display: block; margin-bottom: 6px; }
.tm-badge__name { font-size: 12px; font-weight: 600; color: var(--fg, var(--lw-ink)); line-height: 1.3; }
.tm-badge__desc { font-size: 10px; color: var(--muted, var(--lw-muted)); margin-top: 4px; line-height: 1.3; }
.tm-badge__earned-tag {
  position: absolute; top: 6px; right: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  background: var(--ok, #1a9e5b); color: #fff; padding: 2px 6px; border-radius: 99px;
}
.tm-badge__locked-tag {
  position: absolute; top: 6px; right: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  background: var(--muted, var(--lw-muted)); color: var(--surface, #fff); padding: 2px 6px; border-radius: 99px;
}

/* Log form CTA */
.lwrail-log-cta {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--accent, var(--lw-blue));
  font-weight: 600;
}

/* Condense progress stat tiles */
.tm-stat-row { gap: 10px; }
.tm-stat { padding: 12px 14px; border-radius: var(--radius-lg, 16px); }
.tm-stat__value { font-size: 1.5rem; }
.tm-stat__label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: .08em; }

/* Condense stats heatstrip */
.lwrail-heat-card { padding: 12px 14px; margin-top: 10px; }
.lwrail-heat-track { height: 28px; }
.lwrail-heat-month { padding: 0 6px; }
.lwrail-heat-k { font-size: 10px; }
.lwrail-heat-v { font-size: 11px; font-weight: 600; }

/* Condense year-in-numbers */
.lwrail-year-nums { gap: 10px; margin-bottom: 8px; }
.lwrail-year-num { padding: 14px 14px 12px; }
.lwrail-year-num .bento-num { font-size: clamp(22px, 2.5vw, 30px); }

/* Condense drills */
.lwrail-drills { margin-top: 14px; }
.lwrail-drill-head { padding: 12px 14px; gap: 10px; }
.lwrail-drill-body { padding: 2px 14px 14px 38px; }

/* Condense report card */
.lwrail-report-card { padding: clamp(14px, 1.8vw, 20px); }
.lwrail-report-grid { gap: 10px 12px; }
.lwrail-report-actions { margin-top: 12px; gap: 8px; }

/* Condense recent trips rows */
.el-trow { padding: 10px 12px; }
.lwrail-trip-legs { padding: 8px 0 8px 40px; }

/* Condense nav tiles */
.lwrail-nav-tile { padding: 10px 12px; }
.lwrail-nav-label { font-size: 13px; }

/* Condense leaderboard */
.lwrail-lb-row { padding: 10px 12px; }
.lwrail-lb-value { font-size: 15px; }
.lwrail-lb-value small { font-size: 10px; }

/* Badge filterbar compact */
.el-filterbar[data-miles-filter] { margin: 8px 0 10px; }
.el-filterbar[data-miles-filter] .el-filter { padding: 6px 10px; font-size: 12px; }

.lwrail-nav-go { font-size: 1.2em; line-height: 1; }
.lwrail-map-frame { width: 100%; height: 420px; background: var(--surface, var(--lw-surface)); border-radius: var(--radius-lg, 16px); }
.lwrail-map-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.lwrail-map-legend button { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border, var(--lw-line)); background: var(--surface, var(--lw-surface)); color: var(--fg, var(--lw-ink)); font-size: 12px; cursor: pointer; }
.lwrail-map-legend button.is-active { background: var(--accent, var(--lw-blue)); color: var(--on-accent, #fff); border-color: var(--accent, var(--lw-blue)); }
.lwrail-map-legend .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; }

/* Condense login prompts (logged-out cards) */
.lwrail-error {
  padding: 12px 16px;
  border-radius: var(--radius, 12px);
  margin: 12px 0;
  font-size: 13px;
  background: var(--danger-soft, #fef2f2);
  border: 1px solid var(--danger, #fecaca);
  color: var(--danger, #b91c1c);
}
.lwrail-error a { color: var(--accent, var(--lw-blue)); font-weight: 600; }

/* Condense log form fields */
.lwrail-log-form .lwrail-field { margin-bottom: 10px; }
.lwrail-log-form label { font-size: 12px; margin-bottom: 4px; }
.lwrail-log-form input,
.lwrail-log-form select {
  padding: 8px 12px;
  font-size: 14px;
  border-radius: var(--radius, 12px);
}
.lwrail-log-submit { padding: 10px 18px; font-size: 14px; min-height: 42px; }
.lwrail-add-stop { font-size: 13px; padding: 6px 12px; }

/* =========================================================
   v1.16.5 Dark overrides for hardcoded-light legacy bits
   ========================================================= */

/* Profile hero had a hardcoded light gradient */
.lwrail-profile-hero {
  background:
    radial-gradient(900px 260px at 120% -60%, color-mix(in oklch, var(--accent, #f03d8b) 18%, transparent), transparent 60%),
    linear-gradient(180deg, var(--surface-2, #1b3a5c), var(--surface, #14263c));
  border-bottom: 1px solid var(--border, var(--lw-line));
}
.lwrail-profile-avatar img {
  border: 3px solid var(--border, var(--lw-line));
  box-shadow: 0 4px 14px rgba(0, 0, 0, .4);
}
.lwrail-profile-name { color: var(--fg, var(--lw-ink)); }
.lwrail-profile-bio { color: var(--muted, var(--lw-muted)); }
.lwrail-tier-free { background: var(--fg-soft, #eef2f7); color: var(--muted, var(--lw-muted)); }
.lwrail-country-badge {
  background: var(--surface-2, var(--lw-surface-2));
  border-color: var(--border, var(--lw-line));
  color: var(--accent, var(--lw-blue-deep));
}

/* Monthly heatstrip card had background:#fff */
.lwrail-heat-card {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border, var(--lw-line));
}
.lwrail-heat-head { color: var(--fg, var(--lw-ink)); }
.lwrail-heat-total { color: var(--muted, var(--lw-muted)); }
.lwrail-heat-track { background: var(--fg-soft, var(--lw-line)); }
.lwrail-heat-k { color: var(--muted, var(--lw-muted)); }
.lwrail-heat-month.is-on .lwrail-heat-k { color: var(--accent, var(--lw-blue)); }

/* Drill tables + misc legacy text on dark */
.lwrail-drill-table th { color: var(--muted, var(--lw-muted)); border-bottom-color: var(--border, var(--lw-line)); }
.lwrail-drill-table td { color: var(--fg, var(--lw-ink)); border-bottom-color: var(--border, var(--lw-line)); }
.lwrail-drill-table .muted { color: var(--muted, var(--lw-muted)); }
.lwrail-crs { color: var(--muted, var(--lw-muted)); }
.lwrail-form-hint { color: var(--muted, var(--lw-muted)); }
.lwrail-country-cell { color: var(--fg, var(--lw-ink)); }
.lwrail-share { background: var(--fg-soft, var(--lw-line)); }
.lwrail-share-bar { background: var(--accent, var(--lw-blue)); }
.lwrail-share-pct { color: var(--muted, var(--lw-muted)); }

/* Stat tiles / year numbers on dark */
.lwrail-stat-tiles { background: transparent; }
.lwrail-stat { background: var(--surface, var(--lw-surface)); border-color: var(--border, var(--lw-line)); }
.lwrail-stat strong { color: var(--fg, var(--lw-ink)); }
.lwrail-stat span { color: var(--muted, var(--lw-muted)); }

/* =========================================================
   v1.16.7 Connecting-page skin + form polish
   ========================================================= */

/* --- Quick log form: give it a distinct raised surface --- */
#lwrail-log.lwrail-module {
  background:
    linear-gradient(180deg,
      color-mix(in oklch, var(--accent, #f03d8b) 8%, var(--surface, #14263c)),
      var(--surface, #14263c) 220px);
  border-color: color-mix(in oklch, var(--accent, #f03d8b) 30%, var(--border, #1e3a5f));
}
.lwrail-log-form {
  background: var(--surface-2, var(--lw-surface-2, #1b3a5c));
  border: 1px solid var(--border-strong, var(--lw-line));
  border-radius: var(--radius-lg, 16px);
  padding: 18px 18px 20px;
  margin-top: 12px;
  box-shadow: var(--shadow-1, 0 4px 14px rgba(0, 0, 0, .3));
}
.lwrail-log-leg {
  background: color-mix(in oklch, var(--surface, #14263c) 55%, var(--bg, #0d1b2a));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius, 12px);
  padding: 14px;
}
.lwrail-log-leg-head { border-bottom: 1px solid var(--border, var(--lw-line)); }
.lwrail-log-leg-label { color: var(--accent, var(--lw-blue)); }
.lwrail-log-form label { color: var(--muted, var(--lw-muted)); }
.lwrail-log-form label em { color: var(--muted, var(--lw-muted)); }
.lwrail-add-stop {
  background: transparent;
  border: 1px dashed var(--border-strong, var(--lw-line));
  color: var(--accent, var(--lw-blue));
  border-radius: var(--radius, 12px);
  font-weight: 600;
}
.lwrail-add-stop:hover { border-color: var(--accent, var(--lw-blue)); }

/* --- Report form: narrower card --- */
.lwrail-report-card {
  max-width: 620px;
  margin-inline: auto;
}

/* --- Legacy light surfaces across connecting pages -> dark --- */
.lwrail-station-list,
.lwrail-train-results,
.lwrail-chart-box,
.lwrail-filterbar,
.lwrail-tfilter-results,
.lwrail-import-row,
.lwrail-col-create,
.lwrail-col-card,
.lwrail-page,
.lwrail-service-results {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border, var(--lw-line));
}
/* Astra ships global input[type=text] styles that beat a single class, so
   these form controls need !important to stay on the dark surface. */
.lwrail-filterbar input.lwrail-tfilter-input,
.lwrail-filterbar .lwrail-filter-field select,
.lwrail-col-create input[type="text"],
.lwrail-col-search-input,
.lwrail-report-field textarea,
.lwrail-report-card .input,
.lwrail-report-card .select,
.lwrail-report-card .textarea,
.lwrail-log-form input[type="text"],
.lwrail-log-form input[type="date"],
.lwrail-log-form input[type="email"],
.lwrail-log-form select {
  background: var(--bg, var(--lw-surface)) !important;
  border-color: var(--border-strong, var(--lw-line)) !important;
  color: var(--fg, var(--lw-ink)) !important;
}
.lwrail-report-cancel,
.lwrail-col-create-cancel,
.lwrail-btn {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border-strong, var(--lw-line));
  color: var(--muted, var(--lw-muted));
}
.lwrail-btn:hover { background: var(--fg-soft, var(--lw-surface-2)); border-color: var(--accent, var(--lw-blue)); color: var(--fg, var(--lw-ink)); }
.lwrail-col-del-btn,
.lwrail-col-item-remove,
.lwrail-trip-del,
.lwrail-leg-del,
.lwrail-remove-leg,
.lwrail-remove-unit {
  background: var(--surface, var(--lw-surface));
  border-color: color-mix(in srgb, var(--danger, #dc2626) 40%, transparent);
  color: var(--danger, #dc2626);
}
.lwrail-col-del-btn:hover,
.lwrail-col-item-remove:hover,
.lwrail-trip-del:hover,
.lwrail-leg-del:hover,
.lwrail-remove-leg:hover {
  background: color-mix(in srgb, var(--danger, #dc2626) 15%, var(--surface, #14263c));
}
.lwrail-col-new-btn,
.lwrail-col-create-submit,
.lwrail-col-add-btn,
.lwrail-col-src-add {
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  border-radius: var(--radius-pill, 999px);
}
.lwrail-col-item { background: var(--fg-soft, var(--lw-surface-2)); }
.lwrail-col-item-main strong,
.lwrail-col-card-head strong,
.lwrail-col-src-main { color: var(--fg, var(--lw-ink)); }
.lwrail-col-item-main small,
.lwrail-col-card-head small,
.lwrail-col-loading,
.lwrail-col-empty { color: var(--muted, var(--lw-muted)); }
.lwrail-col-item-link { color: var(--accent, var(--lw-blue-deep)); }
.lwrail-col-src-item { border-color: var(--border, var(--lw-line)); }
.lwrail-col-addpanel { border-top-color: var(--border, var(--lw-line)); }
.lwrail-col-addsrc h4 { color: var(--muted, var(--lw-muted)); }
.lwrail-nav-tile:hover { background: var(--fg-soft, var(--lw-surface-2)); }
.lwrail-report-message.error {
  background: color-mix(in srgb, var(--danger, #dc2626) 15%, var(--surface, #14263c));
  color: var(--danger, #dc2626);
  border-color: color-mix(in srgb, var(--danger, #dc2626) 40%, transparent);
}
.lwrail-report-message.success {
  background: color-mix(in srgb, var(--ok, #1a9e5b) 15%, var(--surface, #14263c));
  color: var(--ok, #1a9e5b);
}
.lwrail-honesty-stale { background: color-mix(in srgb, var(--warn, #b45309) 15%, var(--surface, #14263c)); color: var(--warn, #b45309); }
.lwrail-premium-gate {
  background: linear-gradient(135deg,
    color-mix(in oklch, var(--accent, #f03d8b) 14%, var(--surface, #14263c)),
    color-mix(in oklch, var(--accent-2, #b93bd4) 12%, var(--surface, #14263c)));
  border-color: color-mix(in oklch, var(--accent, #f03d8b) 35%, var(--border, #1e3a5f));
  color: var(--fg, var(--lw-ink));
}
.lwrail-premium-gate a { color: var(--accent, var(--lw-blue)); }

/* --- Trips filter bar controls --- */
.lwrail-filter-field select {
  background: var(--bg, var(--lw-surface));
  border-color: var(--border-strong, var(--lw-line));
  color: var(--fg, var(--lw-ink));
}
.lwrail-filter-field label { color: var(--muted, var(--lw-muted)); }
.lwrail-filter-apply {
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  border-radius: var(--radius-pill, 999px);
}
.lwrail-filter-clear {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border-strong, var(--lw-line));
  color: var(--muted, var(--lw-muted));
  border-radius: var(--radius-pill, 999px);
}
.lwrail-tfilter-results {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border, var(--lw-line));
  box-shadow: var(--shadow-2, 0 12px 28px rgba(0, 0, 0, .45));
}
.lwrail-tfilter-results li { color: var(--fg, var(--lw-ink)); }
.lwrail-tfilter-results li:hover,
.lwrail-tfilter-results li.active { background: var(--fg-soft, var(--lw-surface-2)); }

/* --- Rail-data import/export controls --- */
.lwrail-file-btn {
  background: var(--surface, var(--lw-surface));
  border-color: var(--border-strong, var(--lw-line));
  color: var(--muted, var(--lw-muted));
  border-radius: var(--radius-pill, 999px);
}
.lwrail-file-btn:hover { border-color: var(--accent, var(--lw-blue)); color: var(--fg, var(--lw-ink)); }
.lwrail-import-submit {
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  border-radius: var(--radius-pill, 999px);
}
.lwrail-export-strip { background: var(--surface, var(--lw-surface)); border-color: var(--border, var(--lw-line)); }
.lwrail-export-strip .lwrail-btn { background: transparent; border-color: var(--border-strong, var(--lw-line)); color: var(--fg, var(--lw-ink)); }
.lwrail-import-info strong { color: var(--fg, var(--lw-ink)); }
.lwrail-import-info span { color: var(--muted, var(--lw-muted)); }

/* =========================================================
   v1.16.9 Astra content-area darkening + report/advert layout
   ========================================================= */

/* Plugin pages: force the Astra page containers dark so no white band shows. */
body.lwrail-plugin-page,
body.lwrail-plugin-page #page,
body.lwrail-plugin-page #content,
body.lwrail-plugin-page #primary,
body.lwrail-plugin-page #main,
body.lwrail-plugin-page .site-main,
body.lwrail-plugin-page .ast-article-single,
body.lwrail-plugin-page article,
body.lwrail-plugin-page .entry-content,
body.lwrail-plugin-page .entry-header,
body.lwrail-plugin-page .ast-separate-container .ast-article-single,
body.ast-separate-container.lwrail-plugin-page .ast-article-single {
  background-color: var(--bg, #0d1b2a) !important;
}
body.lwrail-plugin-page .entry-header .entry-title,
body.lwrail-plugin-page .entry-title { color: var(--fg, #e8edf5); }
body.lwrail-plugin-page .entry-meta,
body.lwrail-plugin-page .entry-meta * { color: var(--muted, var(--lw-muted)); }

/* Report form (left) + advert card (right) */
.lwrail-report-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
}
.lwrail-report-layout .lwrail-report-card { max-width: none; margin: 0; }
@media (max-width: 900px) {
  .lwrail-report-layout { grid-template-columns: 1fr; }
}

.lwrail-advert-card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px 20px;
  border: 1px dashed var(--border-strong, var(--lw-line));
  border-radius: var(--radius-lg, 20px);
  background: var(--surface, var(--lw-surface));
  min-height: 220px;
}
.lwrail-advert-card::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(420px 220px at 50% -20%,
    color-mix(in oklch, var(--accent, #f03d8b) 14%, transparent), transparent 70%);
}
.lwrail-ad-badge {
  position: absolute;
  top: 10px;
  right: 12px;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--muted, var(--lw-muted));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 999px;
  padding: 2px 8px;
}
.lwrail-advert-body {
  position: relative;
  display: grid;
  gap: 10px;
  justify-items: center;
}
.lwrail-advert-title {
  font-family: var(--font-display, inherit);
  font-size: 20px;
  font-weight: 700;
  color: var(--fg, var(--lw-ink));
}
.lwrail-advert-text {
  margin: 0;
  font-size: 13px;
  color: var(--muted, var(--lw-muted));
  max-width: 28ch;
}
.lwrail-advert-cta { margin-top: 4px; }

/* =========================================================
   v1.16.12 Two-column section pairs (shorter page)
   ========================================================= */
.lwrail-cols-2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
  margin-bottom: 20px;
}
.lwrail-cols-2 > .lwrail-module { margin-bottom: 0; }
.lwrail-cols-2 > .lwrail-module + .lwrail-module { margin-top: 0; }
@media (max-width: 960px) {
  .lwrail-cols-2 { grid-template-columns: 1fr; }
}

/* "At a glance" stat tiles: denser grid */
.tm-stat-row { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

/* Compact the badges grid a touch so it takes less vertical space */
.tm-badges { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }

/* =========================================================
   v1.16.13 XP economy + unlock celebration
   ========================================================= */

/* XP readout next to the profile in the hero */
.tm-xp {
  margin-left: auto;
  text-align: right;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.tm-xp__n {
  font-family: var(--font-display, inherit);
  font-weight: 700;
  font-size: clamp(22px, 2.6vw, 30px);
  letter-spacing: -0.04em;
  color: var(--fg, var(--lw-ink));
  line-height: 1;
}
.tm-xp__u {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent, var(--lw-blue));
}
.tm-xp__week {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  color: var(--ok, #1a9e5b);
}
@media (max-width: 640px) {
  .tm-xp { margin-left: 0; align-items: flex-start; }
}

/* Celebration modal */
body.lwrail-celebrating { overflow: hidden; }
.lwrail-celebrate {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(5, 10, 18, .72);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.lwrail-celebrate[hidden] { display: none; }
.lwrail-celebrate__inner {
  position: relative;
  overflow: hidden;
  width: min(440px, 92vw);
  text-align: center;
  padding: 32px 26px 26px;
  border-radius: var(--radius-lg, 22px);
  border: 1px solid color-mix(in oklch, var(--accent, #f03d8b) 42%, var(--border, #1e3a5f));
  background: linear-gradient(180deg,
    color-mix(in oklch, var(--accent, #f03d8b) 16%, var(--surface, #14263c)),
    var(--surface, #14263c));
  box-shadow: var(--shadow-2, 0 20px 60px rgba(0, 0, 0, .55));
  animation: lwrail-pop .42s cubic-bezier(.2, .9, .3, 1.35) both;
}
@keyframes lwrail-pop {
  from { transform: scale(.9) translateY(12px); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
.lwrail-celebrate__kicker {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent, #f03d8b);
}
.lwrail-celebrate__title {
  font-family: var(--font-display, inherit);
  font-size: clamp(24px, 3vw, 30px);
  margin: 10px 0 6px;
  color: var(--fg, #e8edf5);
}
.lwrail-celebrate__badges {
  color: var(--muted, var(--lw-muted));
  font-size: 14px;
  margin: 6px 0 20px;
}
.lwrail-celebrate__close { margin-top: 4px; }
.lwrail-confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.lwrail-confetti i {
  position: absolute;
  top: -14px;
  width: 8px;
  height: 12px;
  border-radius: 2px;
  animation-name: lwrail-fall;
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}
@keyframes lwrail-fall {
  to { transform: translate(var(--x, 0), 560px) rotate(560deg); opacity: 0; }
}

/* =========================================================
   v1.16.15 Weekly missions + network coverage ring
   ========================================================= */

.tm-missions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
}
.tm-mission {
  position: relative;
  padding: 14px 16px 12px;
  border-radius: var(--radius-lg, 18px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.tm-mission:hover { transform: translateY(-2px); box-shadow: var(--shadow-1, 0 6px 18px rgba(0, 0, 0, .28)); }
.tm-mission.is-done {
  border-color: color-mix(in srgb, var(--ok, #1a9e5b) 45%, var(--border, var(--lw-line)));
  background: color-mix(in srgb, var(--ok, #1a9e5b) 8%, var(--surface, var(--lw-surface)));
}
.tm-mission__top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.tm-mission__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--fg, var(--lw-ink));
  line-height: 1.3;
}
.tm-mission__xp {
  flex: 0 0 auto;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--accent, var(--lw-blue));
  white-space: nowrap;
}
.tm-mission.is-done .tm-mission__xp { color: var(--ok, #1a9e5b); }
.tm-mission__bar {
  height: 8px;
  border-radius: 999px;
  background: var(--fg-soft, var(--lw-line));
  overflow: hidden;
}
.tm-mission__bar i {
  display: block;
  height: 100%;
  width: var(--v, 0%);
  border-radius: 999px;
  background: var(--grad, linear-gradient(90deg, #f03d8b, #b93bd4));
  transition: width .5s ease;
}
.tm-mission.is-done .tm-mission__bar i { background: var(--ok, #1a9e5b); }
.tm-mission__meta {
  display: block;
  margin-top: 7px;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10.5px;
  color: var(--muted, var(--lw-muted));
}

/* Network coverage ring */
.lwrail-year-num--ring { justify-items: start; }
.tm-ring {
  position: relative;
  width: 128px;
  height: 128px;
  margin-top: 4px;
}
.tm-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.tm-ring__track {
  fill: none;
  stroke: var(--fg-soft, var(--lw-line));
  stroke-width: 10;
}
.tm-ring__fill {
  fill: none;
  stroke: var(--accent, #f03d8b);
  stroke-width: 10;
  stroke-linecap: round;
  stroke-dasharray: 326.7;
  stroke-dashoffset: calc(326.7 - (326.7 * var(--pct, 0) / 100));
  transition: stroke-dashoffset .8s ease;
}
.tm-ring__label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 2px;
}
.tm-ring__label strong {
  font-family: var(--font-display, inherit);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.04em;
  color: var(--fg, var(--lw-ink));
  line-height: 1;
}
.tm-ring__label small {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 9.5px;
  color: var(--muted, var(--lw-muted));
  max-width: 90px;
  line-height: 1.3;
}

/* =========================================================
   v1.16.16 Leaderboard rivalry (rank movement, gap, weekly league)
   ========================================================= */
.tm-move {
  font-style: normal;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  font-weight: 700;
  margin-left: 4px;
}
.tm-move.is-up { color: var(--ok, #1a9e5b); }
.tm-move.is-down { color: var(--danger, #dc2626); }

.tm-rival-meta {
  margin: 12px 0 0;
  font-size: 13px;
  color: var(--muted, var(--lw-muted));
}
.tm-rival-meta strong {
  color: var(--fg, var(--lw-ink));
  font-family: var(--font-display, inherit);
}

.tm-weekly {
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px dashed var(--border, var(--lw-line));
}
.tm-week-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  border-radius: 8px;
  font-size: 13px;
}
.tm-week-row.is-you {
  background: var(--fg-soft, var(--lw-surface-2));
  font-weight: 600;
}
.tm-week-pos {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  color: var(--muted, var(--lw-muted));
}
.tm-week-name { color: var(--fg, var(--lw-ink)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tm-week-val {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 12px;
  color: var(--muted, var(--lw-muted));
}

/* Streak freeze */
.tm-freeze {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.tm-freeze__count {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  color: var(--muted, var(--lw-muted));
}
.tm-freeze__repair {
  border: 1px solid var(--accent, var(--lw-blue));
  background: transparent;
  color: var(--accent, var(--lw-blue));
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background .14s ease;
}
.tm-freeze__repair:hover { background: var(--accent-soft, var(--lw-surface-2)); }
.tm-freeze__repair:disabled { opacity: .6; cursor: default; }
/* =========================================================
   v1.16.19 Isolated map iframes (theme-proof Leaflet)
   ========================================================= */
.lwrail-map-iframe {
  display: block;
  width: 100%;
  height: 420px;
  border: 0;
  border-radius: var(--radius-lg, 16px);
  background: var(--bg, #0d1b2a);
  overflow: hidden;
}
@media (max-width: 960px) {
  .lwrail-map-iframe { height: 340px; }
}

/* =========================================================
   v1.16.20 My Sightings page
   ========================================================= */
.lwrail-sight-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.lwrail-sight-stat {
  padding: 12px 14px;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
  display: grid;
  gap: 3px;
}
.lwrail-sight-stat strong {
  font-family: var(--font-display, inherit);
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--fg, var(--lw-ink));
  line-height: 1;
}
.lwrail-sight-stat span {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted, var(--lw-muted));
}
.lwrail-sight-tablewrap {
  overflow-x: auto;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 16px);
}
.lwrail-sight-tablewrap .lwrail-drill-table { min-width: 640px; }

/* =========================================================
   v1.16.22 Accessibility: visible keyboard focus
   ========================================================= */
.lwrail-module a:focus-visible,
.lwrail-module button:focus-visible,
.lwrail-module input:focus-visible,
.lwrail-module select:focus-visible,
.lwrail-module textarea:focus-visible,
.lwrail-nav-tile:focus-visible,
.el-filter:focus-visible,
.tm-stat:focus-visible,
.tm-freeze__repair:focus-visible,
.lwrail-map-iframe:focus-visible,
.lwrail-advert-cta:focus-visible {
  outline: 2px solid var(--accent, #42a5f5);
  outline-offset: 2px;
  border-radius: 6px;
}
.lwrail-celebrate__close:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .lwrail-confetti i { animation: none !important; display: none; }
  .lwrail-celebrate__inner { animation: none !important; }
}

/* Export strip: multiple actions */
.lwrail-export-actions { display: inline-flex; gap: 8px; flex-wrap: wrap; }

/* =========================================================
   v1.16.29 Community: compare with friends
   ========================================================= */
.lwrail-compare-picker {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.lwrail-compare-picker label {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted, var(--lw-muted));
}
.lwrail-compare-picker select {
  min-width: 200px;
  height: 40px;
  padding: 0 12px;
  border-radius: var(--radius, 12px);
  border: 1px solid var(--border-strong, var(--lw-line));
  background: var(--bg, var(--lw-surface));
  color: var(--fg, var(--lw-ink));
  font-size: 14px;
}
.lwrail-compare-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 16px;
}
.lwrail-compare-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 12px;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
}
.lwrail-compare-col.is-you {
  border-color: color-mix(in oklch, var(--accent, #f03d8b) 42%, var(--border, #1e3a5f));
}
.lwrail-compare-col strong { color: var(--fg, var(--lw-ink)); font-size: 15px; }
.lwrail-compare-col small {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  color: var(--muted, var(--lw-muted));
}
.lwrail-compare-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-content: center;
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  font-family: var(--font-display, inherit);
  font-weight: 700; font-size: 14px;
}
.lwrail-compare-row {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  padding: 9px 4px;
  border-top: 1px solid var(--border, var(--lw-line));
}
.lwrail-compare-val {
  font-family: var(--font-display, inherit);
  font-size: 18px;
  font-weight: 700;
  color: var(--muted, var(--lw-muted));
  text-align: center;
  letter-spacing: -0.02em;
}
.lwrail-compare-val.is-win { color: var(--ok, #1a9e5b); }
.lwrail-compare-label {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted, var(--lw-muted));
  text-align: center;
  white-space: nowrap;
}
.lwrail-compare-actions { margin-top: 16px; }
.lwrail-follow-btn {
  border: 1px solid var(--accent, var(--lw-blue));
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  border-radius: var(--radius-pill, 999px);
  padding: 9px 20px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.lwrail-follow-btn.is-following {
  background: transparent;
  color: var(--accent, var(--lw-blue));
}
.lwrail-follow-btn:disabled { opacity: .6; cursor: default; }

/* Journey share button in recent-trip rows */
.lwrail-trip-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  justify-self: end;
}
.lwrail-trip-share {
  width: 28px;
  height: 28px;
  display: grid;
  place-content: center;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 50%;
  background: transparent;
  color: var(--muted, var(--lw-muted));
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  transition: color .14s ease, border-color .14s ease, background .14s ease;
}
.lwrail-trip-share:hover { color: var(--accent, var(--lw-blue)); border-color: var(--accent, var(--lw-blue)); }
.lwrail-trip-share.is-copied { color: var(--ok, #1a9e5b); border-color: var(--ok, #1a9e5b); background: color-mix(in srgb, var(--ok, #1a9e5b) 15%, transparent); }

/* =========================================================
   v1.16.31 Explore: unvisited stations
   ========================================================= */
.lwrail-explore-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.lwrail-explore-search {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0;
}
.lwrail-explore-search label {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted, var(--lw-muted));
}
.lwrail-explore-search input[type="text"] {
  flex: 1 1 240px;
  height: 40px;
  padding: 0 12px;
  border-radius: var(--radius, 12px);
  border: 1px solid var(--border-strong, var(--lw-line));
  background: var(--bg, var(--lw-surface));
  color: var(--fg, var(--lw-ink));
  font-size: 14px;
}
.lwrail-explore-clear {
  font-size: 13px;
  color: var(--accent, var(--lw-blue));
  text-decoration: none;
  padding-bottom: 10px;
}
.lwrail-explore-pager {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 14px;
}

/* =========================================================
   v1.16.35 Public landing (SEO) for logged-out visitors
   ========================================================= */
.lwrail-landing-features {
  list-style: none;
  margin: 22px 0 26px;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px 22px;
  max-width: 900px;
}
.lwrail-landing-features li {
  position: relative;
  padding-left: 26px;
  color: var(--fg, #e8edf5);
  font-size: 15px;
  line-height: 1.5;
}
.lwrail-landing-features li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 7px;
  width: 12px;
  height: 7px;
  border-left: 2px solid var(--accent, #f03d8b);
  border-bottom: 2px solid var(--accent, #f03d8b);
  transform: rotate(-45deg);
}
.lwrail-landing-cta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

/* =========================================================
   v1.16.38 Fleet watch (withdrawal alerts)
   ========================================================= */
.lwrail-fleet-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.lwrail-fleet-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
}
.lwrail-fleet-item strong { color: var(--fg, var(--lw-ink)); font-size: 14px; }
.lwrail-fleet-item.is-withdrawn {
  border-color: color-mix(in srgb, var(--danger, #dc2626) 45%, var(--border, #1e3a5f));
  background: color-mix(in srgb, var(--danger, #dc2626) 8%, var(--surface, #14263c));
}
.lwrail-fleet-item.is-preserved {
  border-color: color-mix(in srgb, var(--info, #2563eb) 40%, var(--border, #1e3a5f));
}

/* =========================================================
   v1.16.40 Community monthly challenge
   ========================================================= */
.lwrail-challenge-bar {
  height: 14px;
  border-radius: 999px;
  background: var(--fg-soft, var(--lw-line));
  overflow: hidden;
  margin: 6px 0 18px;
}
.lwrail-challenge-bar i {
  display: block;
  height: 100%;
  width: var(--v, 0%);
  border-radius: 999px;
  background: var(--grad, linear-gradient(90deg, #f03d8b, #b93bd4));
  transition: width .6s ease;
}
.lwrail-challenge-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

/* =========================================================
   v1.16.41 All-time records
   ========================================================= */
.lwrail-records {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border, var(--lw-line));
}
.lwrail-records__title { grid-column: 1 / -1; }
.lwrail-record {
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface-2, var(--lw-surface-2));
}
.lwrail-record__label {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted, var(--lw-muted));
}
.lwrail-record__value {
  font-family: var(--font-display, inherit);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--fg, var(--lw-ink));
  line-height: 1.1;
}
.lwrail-record__value small { font-size: .5em; color: var(--muted, var(--lw-muted)); font-weight: 500; }
.lwrail-record__sub {
  font-size: 11px;
  color: var(--muted, var(--lw-muted));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Data-quality flag button (alongside share) */
.lwrail-trip-flag {
  width: 28px;
  height: 28px;
  display: grid;
  place-content: center;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 50%;
  background: transparent;
  color: var(--muted, var(--lw-muted));
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  transition: color .14s ease, border-color .14s ease, background .14s ease;
}
.lwrail-trip-flag:hover { color: var(--warn, #b45309); border-color: var(--warn, #b45309); }

/* =========================================================
   v1.16.47 Group challenges
   ========================================================= */
.lwrail-challenge-h { font-size: 15px; margin: 22px 0 10px; color: var(--fg, var(--lw-ink)); }
.lwrail-challenge-create {
  border: 1px dashed var(--border-strong, var(--lw-line));
  border-radius: var(--radius-lg, 16px);
  padding: 12px 16px;
  margin-bottom: 6px;
}
.lwrail-challenge-create summary { cursor: pointer; font-weight: 600; color: var(--accent, var(--lw-blue)); }
.lwrail-challenge-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 14px; }
.lwrail-challenge-form .lwrail-field-wide { grid-column: 1 / -1; }
.lwrail-challenge-form .lwrail-form-actions { grid-column: 1 / -1; }
.lwrail-challenge-goal { display: flex; gap: 8px; }
.lwrail-challenge-goal input { flex: 1 1 auto; }
.lwrail-challenge-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
.lwrail-challenge-card {
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius-lg, 18px);
  background: var(--surface, var(--lw-surface));
  padding: 16px;
}
.lwrail-challenge-card.is-complete { border-color: color-mix(in srgb, var(--ok, #1a9e5b) 45%, var(--border, #1e3a5f)); }
.lwrail-challenge-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.lwrail-challenge-card__top strong { display: block; color: var(--fg, var(--lw-ink)); font-size: 15px; }
.lwrail-challenge-card__top small { font-size: 11px; color: var(--muted, var(--lw-muted)); }
.lwrail-challenge-members { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.lwrail-challenge-member {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 9px; border-radius: 999px;
  border: 1px solid var(--border, var(--lw-line));
  font-size: 11px; color: var(--muted, var(--lw-muted));
}
.lwrail-challenge-member.is-you { border-color: color-mix(in oklch, var(--accent, #f03d8b) 45%, transparent); color: var(--fg, var(--lw-ink)); }
.lwrail-challenge-member b { color: var(--fg, var(--lw-ink)); }
.lwrail-challenge-card__actions { display: flex; justify-content: flex-end; }
.lwrail-challenge-join {
  border: 1px solid var(--accent, var(--lw-blue));
  background: var(--grad, linear-gradient(135deg, #f03d8b, #b93bd4));
  color: var(--on-accent, #fff);
  border-radius: 999px; padding: 7px 18px; font-size: 13px; font-weight: 700; cursor: pointer;
}
.lwrail-challenge-join.is-joined { background: transparent; color: var(--muted, var(--lw-muted)); border-color: var(--border-strong, var(--lw-line)); }
.lwrail-challenge-join:disabled { opacity: .6; cursor: default; }

/* =========================================================
   v1.16.52 Route planner
   ========================================================= */
.lwrail-route-form {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.lwrail-route-form .lwrail-field { flex: 1 1 200px; }
.lwrail-route-list {
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
  counter-reset: stop;
  display: grid;
  gap: 6px;
}
.lwrail-route-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 14px 9px 40px;
  position: relative;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius, 12px);
  background: var(--surface, var(--lw-surface));
}
.lwrail-route-list li::before {
  counter-increment: stop;
  content: counter(stop);
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px; height: 20px;
  display: grid; place-content: center;
  border-radius: 50%;
  background: var(--fg-soft, var(--lw-surface-2));
  color: var(--muted, var(--lw-muted));
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 10px;
}
.lwrail-route-list li:first-child { border-color: color-mix(in srgb, var(--ok, #1a9e5b) 45%, var(--border, #1e3a5f)); }
.lwrail-route-list li:first-child::before { background: var(--ok, #1a9e5b); color: #fff; }
.lwrail-route-name { color: var(--fg, var(--lw-ink)); font-size: 14px; font-weight: 600; }
.lwrail-route-leg { font-family: var(--font-mono, ui-monospace, Menlo, monospace); font-size: 12px; color: var(--muted, var(--lw-muted)); }

/* Report-an-error links (from anywhere) */
.lwrail-report-link {
  color: var(--muted, var(--lw-muted));
  text-decoration: none;
  font-size: 12px;
  margin-left: 4px;
  opacity: .7;
  transition: color .14s ease, opacity .14s ease;
}
.lwrail-report-link:hover { color: var(--warn, #b45309); opacity: 1; }
.lwrail-fleet-actions { display: inline-flex; align-items: center; gap: 6px; }

/* Report form: bug-focused intro */
.lwrail-report-intro {
  margin: 0 0 16px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--muted, var(--lw-muted));
  max-width: 60ch;
}
.lwrail-report-intro a { color: var(--accent, var(--lw-blue)); }

/* =========================================================
   v1.16.56 Embeddable profile badge
   ========================================================= */
.lwrail-badge-embed {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border, var(--lw-line));
}
.lwrail-badge-preview {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin-bottom: 10px;
}
.lwrail-badge-code {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.lwrail-badge-code textarea {
  flex: 1 1 auto;
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 11px;
  color: var(--muted, var(--lw-muted));
  background: var(--bg, var(--lw-surface));
  border: 1px solid var(--border-strong, var(--lw-line));
  border-radius: var(--radius, 12px);
  padding: 8px 10px;
  resize: vertical;
}
.lwrail-copy-badge {
  flex: 0 0 auto;
  border: 1px solid var(--accent, var(--lw-blue));
  background: transparent;
  color: var(--accent, var(--lw-blue));
  border-radius: var(--radius-pill, 999px);
  padding: 0 16px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.lwrail-copy-badge:hover { background: var(--accent-soft, var(--lw-surface-2)); }

/* Year-over-year strip */
.lwrail-yoy {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 4px 0 14px;
  padding: 10px 14px;
  border: 1px solid var(--border, var(--lw-line));
  border-radius: var(--radius, 12px);
  background: var(--surface-2, var(--lw-surface-2));
}
.lwrail-yoy__pct {
  font-family: var(--font-display, inherit);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.03em;
}
.lwrail-yoy__pct.is-up { color: var(--ok, #1a9e5b); }
.lwrail-yoy__pct.is-down { color: var(--danger, #dc2626); }
.lwrail-station-link { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }
.lwrail-station-link:hover { color: var(--accent, var(--lw-blue)); }

/* Daily riding calendar */
.lwrail-cal { margin-top: 16px; }
.lwrail-cal__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.lwrail-cal__legend { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; color: var(--muted, var(--lw-muted)); }
.lwrail-cal__legend i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.lwrail-cal__grid { display: flex; gap: 3px; overflow-x: auto; padding-bottom: 4px; }
.lwrail-cal__week { display: grid; grid-template-rows: repeat(7, 1fr); gap: 3px; }
.lwrail-cal__day { width: 11px; height: 11px; border-radius: 2px; background: var(--fg-soft, var(--lw-line)); display: block; }
.lwrail-cal__day.lw-1 { background: color-mix(in oklch, var(--accent, #f03d8b) 32%, var(--fg-soft, #1e3a5f)); }
.lwrail-cal__day.lw-2 { background: color-mix(in oklch, var(--accent, #f03d8b) 56%, var(--fg-soft, #1e3a5f)); }
.lwrail-cal__day.lw-3 { background: color-mix(in oklch, var(--accent, #f03d8b) 80%, var(--fg-soft, #1e3a5f)); }
.lwrail-cal__day.lw-4 { background: var(--accent, #f03d8b); }

/* Watchlist (pulled from the spotting plugin) */
.lwrail-watch-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.lwrail-watch-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px 10px;
  padding: 12px 14px;
  border-radius: var(--radius-lg, 16px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
}
.lwrail-watch-item.is-caught { border-color: color-mix(in srgb, var(--ok, #1a9e5b) 45%, var(--border, #1e3a5f)); }
.lwrail-watch-kind {
  font-family: var(--font-mono, ui-monospace, Menlo, monospace);
  font-size: 9.5px; text-transform: uppercase; letter-spacing: .08em;
  color: var(--muted, var(--lw-muted));
  border: 1px solid var(--border, var(--lw-line));
  border-radius: 999px; padding: 2px 7px;
}
.lwrail-watch-item strong { color: var(--fg, var(--lw-ink)); font-size: 14px; }
.lwrail-watch-notes { grid-column: 2 / -1; font-size: 12px; color: var(--muted, var(--lw-muted)); }
.lwrail-watch-meta { grid-column: 2 / -1; font-size: 11px; color: var(--ok, #1a9e5b); }
.lwrail-watch-link { color: var(--accent, var(--lw-blue)); font-size: 12px; text-decoration: none; }

/* Invite / referrals */
.lwrail-invite { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border, var(--lw-line)); }

/* Public profile visibility toggle */
.lwrail-profile-visibility {
  display: grid;
  gap: 6px;
  padding: 12px 18px 14px;
}
.lwrail-public-toggle-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: var(--fg, var(--lw-ink));
  cursor: pointer;
}
.lwrail-profile-visibility__url { font-size: 12px; color: var(--muted, var(--lw-muted)); word-break: break-all; }
.lwrail-profile-visibility__url a { color: var(--accent, var(--lw-blue)); }

/* Distance accuracy note */
.lwrail-distance-note {
  margin: 0 0 14px;
  font-size: 12.5px;
  color: var(--muted, var(--lw-muted));
}
.lwrail-distance-note strong { color: var(--fg, var(--lw-ink)); }

/* Structures cross-link (bridges/viaducts/tunnels/level crossings) */
.lwrail-structures-link { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border, var(--lw-line)); }
.lwrail-structures-link a { color: var(--accent, var(--lw-blue)); }

/* Homepage tile / teaser */
.lwrail-tile {
  display: grid;
  gap: 10px;
  padding: 20px;
  border-radius: var(--radius-lg, 20px);
  border: 1px solid var(--border, var(--lw-line));
  background: var(--surface, var(--lw-surface));
  max-width: 420px;
}
.lwrail-tile__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.lwrail-tile__big { font-family: var(--font-display, inherit); font-weight: 800; font-size: 34px; letter-spacing: -0.04em; color: var(--fg, var(--lw-ink)); }
.lwrail-tile__big small { font-size: .4em; color: var(--muted, var(--lw-muted)); margin-left: 3px; }
.lwrail-tile__meta { font-family: var(--font-mono, ui-monospace, Menlo, monospace); font-size: 11px; color: var(--muted, var(--lw-muted)); }
.lwrail-tile__stats { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--muted, var(--lw-muted)); }
.lwrail-tile__stats b { color: var(--fg, var(--lw-ink)); font-family: var(--font-display, inherit); }
.lwrail-tile__cta { align-self: start; }

/* Magic Upload */
.lwrail-magic-form { display: grid; gap: 10px; margin-top: 4px; }
.lwrail-magic-form textarea {
  width: 100%; box-sizing: border-box; min-height: 90px; padding: 10px 12px;
  border-radius: var(--radius, 12px); border: 1px solid var(--border-strong, var(--lw-line));
  background: var(--bg, var(--lw-surface)); color: var(--fg, var(--lw-ink)); font-size: 14px;
}
.lwrail-magic-message { font-size: 13px; color: var(--danger, #dc2626); }
.lwrail-magic-result { margin-top: 14px; }
.lwrail-magic-fields {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px;
  padding: 14px; border: 1px solid var(--border, var(--lw-line)); border-radius: var(--radius-lg, 16px);
  background: var(--surface-2, var(--lw-surface-2));
}
.lwrail-magic-fields label { display: grid; gap: 4px; font-size: 12px; color: var(--muted, var(--lw-muted)); }
.lwrail-magic-fields input {
  padding: 8px 10px; border-radius: var(--radius, 12px);
  border: 1px solid var(--border-strong, var(--lw-line)); background: var(--bg, var(--lw-surface)); color: var(--fg, var(--lw-ink));
}
.lwrail-magic-fields #lwrail-magic-save { grid-column: 1 / -1; justify-self: start; }

/* Structures directory chips */
.lwrail-struct-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.lwrail-struct-chips .el-chip { text-decoration: none; }
.lwrail-struct-chips .el-chip b { color: var(--fg, var(--lw-ink)); font-weight: 700; }

/* New haulage — first-time traction unit photo prompt. */
.lwrail-new-haulage{border:1px solid var(--line,#d7dbe0);border-left:4px solid #b20000;border-radius:10px;padding:14px 16px;margin:14px 0;background:var(--surface-soft,#f7f8fa)}
.lwrail-new-haulage__kicker{margin:0 0 4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#b20000;font-weight:700}
.lwrail-new-haulage__text{margin:0 0 10px;font-size:15px;line-height:1.5}
.lwrail-new-haulage__actions{display:flex;gap:10px;flex-wrap:wrap;margin:0}

/* Haulage hall — loco/steam classes behind logged journeys (moved from enthusiast). */
.lwrail-haulage-card .lwrail-module-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.lwrail-haulage-total{font-family:var(--font-mono,monospace);color:var(--fg-muted,#9aa4b2);font-size:13px}
.lwrail-haulage-items{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.lwrail-haulage-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 12px;background:var(--surface-2,rgba(255,255,255,.04));border:1px solid var(--border,rgba(255,255,255,.08));border-radius:var(--radius,10px)}
.lwrail-haulage-class{font-weight:600}
.lwrail-haulage-count{font-family:var(--font-mono,monospace);color:var(--fg-muted,#9aa4b2)}

/* First-run get-started card (v1.22.6) */
.lwrail-getstarted__card{background:var(--surface,#0d1b2a);border:1px solid var(--border,#1e2c44);border-radius:var(--radius-lg,18px);padding:clamp(20px,3vw,36px);box-shadow:0 10px 40px rgba(0,0,0,.25)}
.lwrail-getstarted__card .lwrail-module-title{margin:10px 0 12px}
.lwrail-getstarted__card .lead{max-width:62ch}
.lwrail-getstarted__cta{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 6px}
.lwrail-getstarted__points{margin:14px 0 0;padding-left:18px;line-height:1.7;color:var(--fg-soft,#c9d5e5)}

/* Auto-log "Find this train" (#1541, v1.23.0) */
.lwrail-suggest{display:flex;flex-direction:column;gap:8px}
.lwrail-find-train{align-self:flex-start;cursor:pointer}
.lwrail-suggest-results{margin-top:6px}
.lwrail-suggest-list{display:grid;gap:6px;margin-top:4px}
.lwrail-suggest-item{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;width:100%;padding:10px 12px;border:1px solid var(--border,#1e2c44);border-radius:10px;background:var(--surface-2,#0f2036);color:inherit;cursor:pointer}
.lwrail-suggest-item:hover{border-color:var(--accent,#4fd1c5)}
.lwrail-suggest-item__main{font-weight:600}
.lwrail-suggest-item__sub{font-size:.85em;opacity:.8}

/* Social: activity feed + kudos (#1540, v1.23.1) */
.lwrail-feed-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.lwrail-feed-item{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--border,#1e2c44);border-radius:10px;background:var(--surface-2,#0f2036)}
.lwrail-feed-item__who{font-weight:600}
.lwrail-feed-item__trip{opacity:.9}
.lwrail-feed-item__meta{opacity:.7;font-size:.85em;margin-left:auto}
.lwrail-kudos{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--border,#1e2c44);border-radius:999px;background:transparent;color:inherit;cursor:pointer}
.lwrail-kudos.is-on{border-color:var(--accent,#f06292);color:var(--accent,#f06292)}
.lwrail-kudos:disabled{opacity:.6;cursor:default}

/* Delight pass (#1539, v1.23.3): reveal + micro-interactions (reduced-motion aware) */
.lwrail-anim .lwrail-reveal{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.lwrail-anim .lwrail-reveal.is-in{opacity:1;transform:none}
@keyframes lwrail-pop{0%{transform:scale(1)}40%{transform:scale(1.35)}70%{transform:scale(.9)}100%{transform:scale(1)}}
.lwrail-kudos.is-on .lwrail-kudos__icon{animation:lwrail-pop .4s ease}
.lwrail-kudos:hover .lwrail-kudos__icon{transform:scale(1.15)}
.lwrail-kudos__icon{transition:transform .15s ease}
.lwrail-feed-item{transition:border-color .2s ease,transform .2s ease}
.lwrail-feed-item:hover{border-color:var(--accent,#4fd1c5);transform:translateY(-1px)}
.lwrail-nav-tile{transition:transform .18s ease,border-color .18s ease}
.lwrail-nav-tile:hover{transform:translateY(-2px)}
@media (prefers-reduced-motion: reduce){
  .lwrail-anim .lwrail-reveal{opacity:1;transform:none;transition:none}
  .lwrail-kudos.is-on .lwrail-kudos__icon{animation:none}
}