#journeyScreen[hidden], #travelScreens[hidden], #jmMaster [hidden] { display: none !important }
#jmMaster { grid-column:1/-1; width:min(100%, 42rem); box-sizing:border-box; margin:0 auto 2rem; padding:clamp(16px,4vw,28px); background:#fff; border:1px solid #c8d4cf; border-radius:18px; color:#173a2b; }
#jmMaster h2 {margin:0 0 1rem}
#jmMaster fieldset {margin:0; padding:0; border:0; min-width:0}
#jmMaster legend, #jmMaster label {font-weight:650; margin:.75rem 0 .3rem; display:block}
#jmMaster input, #jmMaster select {width:100%; min-height:44px; box-sizing:border-box; font:inherit; padding:.5rem; background:white; color:#173a2b; border:1px solid #82988c; border-radius:8px}
#jmMaster .jm-clock {display:flex; align-items:center; gap:.5rem}
#jmMaster .jm-clock select {width:5rem; font-size:1.25rem}
#jmDetails button {margin:1rem 0;min-height:44px}
#jmResults p {line-height:1.5;margin:.8rem 0}

body[data-journey-screen="journey"] > #journeyRecoveryPanel {display:none!important}
#jmResults .jm-road {--road-colour:#392783; border:1px solid #cdd8d2; border-left:5px solid var(--road-colour); border-radius:10px; margin:.25rem 0 1rem; background:#fff}
#jmResults .jm-ferry {--road-colour:#176556}
#jmResults .jm-train {--road-colour:#004c6d}
#jmResults .jm-road summary {padding:.6rem; min-height:44px; box-sizing:border-box; cursor:pointer;font-weight:700}
#jmResults .jm-road summary img {width:36px;height:25px;object-fit:contain;vertical-align:middle;margin-right:.55rem}
#jmResults .jm-road ol {padding:0 1rem;list-style:none}
#jmResults .jm-road li {border-left:4px solid var(--road-colour);padding:.5rem .8rem}
#jmResults .jm-road li[aria-current] {background:#eef5f1}
#jmResults .jm-road .passed {opacity:.52}
#jmResults .jm-road li span,#jmResults .jm-road li b {display:block}
#jmResults .jm-road p,#jmResults .jm-road button {margin:.65rem}
#jmResults button {min-height:44px}
#jmResults .jm-road a {display:inline-block;padding:.6rem;min-height:44px}
#jmResults .jm-bus [data-stop-index] {font-size:1rem}
#jmResults .jm-bus [data-stop-index] > div {font-size:15px!important}

#jmResults .jm-london-bus {--road-colour:#cc3333}

#jmResults .jm-road:not(.jm-ferry) li[aria-current]::before {content:'Next stop';display:block;font-size:.85rem;color:#345744}

/* Journey 68: selected train handoff and backwards calculated leave time. */
#jmResults .jm-picked-train {
  border:1px solid #a8c2da;
  border-left:6px solid #0753a7;
  border-radius:12px;
  background:#fff;
  padding:14px 15px;
  color:#183e69;
  font-size:16px;
  font-weight:750;
  line-height:1.4;
}
#jmResults .jm-leave-target {
  border:1px solid #c6d8cd;
  border-left:6px solid #006b43;
  border-radius:12px;
  background:#fff;
  padding:14px 15px;
  color:#124d35;
  font-size:18px;
  font-weight:800;
  line-height:1.4;
}
.future-rail-results .future-rail-handoff {
  display:block;
  width:100%;
  min-height:50px;
  margin:14px 0 8px;
  padding:12px 14px;
  border-radius:12px;
  font-size:16px;
  font-weight:800;
}

/* Sooty: clear, accessible indication when future Tube services are not confirmed. */
#jmResults .jm-tube-fallback {
  background:#f6f8fd;
  border-left:6px solid #B36305;
  border-radius:12px;
  padding:13px 14px;
  font-size:16px;
  line-height:1.45;
  font-weight:700;
  color:#20344c;
}
#jmResults .jm-tube-guide {
  border:1px solid #c8d3e2;
  border-radius:10px;
  padding:13px 14px;
  background:#fff;
  line-height:1.4;
  font-size:16px;
}
#jmResults .jm-tube-open {
  display:block;
  width:100%;
  min-height:48px;
  margin:12px 0 16px;
  padding:12px;
  border-radius:11px;
  border:2px solid #004d74;
  background:#fff;
  color:#004d74;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}


/* Sooty TfL-style stage rolling roads. Scoped to Journey/Sooty results only.
   Bus keeps its existing separate purple/pink First Bus horizontal road. */
#jmResults .jm-tfl-road {
  min-width:0;
  overflow:hidden;
  background:#fff;
  border-radius:15px;
  box-shadow:0 2px 10px #263b4c0c;
}
#jmResults .jm-tfl-road summary {
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  color:#233e50;
  font-size:17px;
}
#jmResults .jm-tfl-road summary img {
  margin-right:4px;
  width:35px;
  height:28px;
  flex-shrink:0;
}
#jmResults .jm-tfl-road .jm-route-progress {
  margin:10px 13px 4px;
  padding:10px 12px;
  border-radius:9px;
  background:#f3f7fa;
  color:#233e50;
  font-size:15px;
  line-height:1.4;
  font-weight:800;
}
#jmResults .jm-tfl-road .jm-route-guidance {
  margin:7px 14px 5px;
  font-size:13px;
  color:#546574;
  line-height:1.35;
}
#jmResults .jm-tfl-road .jm-route-viewport {
  width:calc(100% - 24px);
  max-height:none;
  margin:10px 12px;
  padding:14px 0 16px;
  box-sizing:border-box;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;
  border:1px solid #e0e7eb;
  border-radius:12px;
  background:#f8fafc;
}
#jmResults .jm-tfl-road .jm-route-list {
  display:flex;
  flex-flow:row nowrap;
  align-items:stretch;
  gap:0;
  width:max-content;
  min-width:max-content;
  margin:0;
  padding:0 9px!important;
  list-style:none;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  position:relative;
  box-sizing:border-box;
  flex:0 0 224px;
  width:224px;
  min-width:224px;
  max-width:224px;
  margin:0;
  padding:0 8px 8px;
  border-left:0!important;
  scroll-snap-align:center;
  background:transparent;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop::before,
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop[aria-current]::before {
  content:''!important;
  position:absolute;
  z-index:0;
  display:block;
  left:0;
  right:0;
  top:20px;
  bottom:auto;
  width:100%;
  height:6px;
  background:var(--line-colour)!important;
  border:0;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop .station-dot {
  position:relative;
  z-index:2;
  display:block;
  flex:none;
  width:25px;
  height:25px;
  margin:10px auto 18px;
  box-sizing:border-box;
  border:4px solid var(--line-colour);
  border-radius:50%;
  background:#fff;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop.is-start .station-dot {
  background:#a5ebba;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop.is-end .station-dot {
  background:#ffc77e;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop.is-current .station-dot {
  background:#fff1be;
  outline:3px solid #fff;
  outline-offset:0;
}
#jmResults .jm-tfl-road .jm-route-list > .jm-route-stop .station-body {
  width:100%;
  flex:1 1 auto;
  min-width:0;
  min-height:122px;
  box-sizing:border-box;
  padding:11px 12px;
  text-align:left;
  background:#fff;
  border:1px solid #d6e0e5;
  border-radius:12px;
  box-shadow:0 2px 6px #15283c0c;
}
#jmResults .jm-tfl-road .jm-route-stop.is-current .station-body {
  background:#fff5e6;
  border-color:#d7a778;
  box-shadow:0 0 0 2px #f4debf;
}
#jmResults .jm-tfl-road .jm-route-stop.is-end .station-body {
  border-left:4px solid #22774f;
}
#jmResults .jm-tfl-road .jm-route-stop.is-change .station-body {
  border-left:4px solid #a96b26;
}
#jmResults .jm-tfl-road .jm-route-stop.is-complete {
  opacity:.48;
}
#jmResults .jm-tfl-road .jm-route-stop .route-station-name {
  display:block;
  margin-top:5px;
  font-size:17px;
  font-weight:800;
  line-height:1.3;
  color:#233847;
  overflow-wrap:anywhere;
}
#jmResults .jm-tfl-road .jm-route-stop .route-badge {
  display:inline-block;
  font-size:10px;
  line-height:1.3;
  letter-spacing:.06em;
  font-weight:900;
  padding:3px 6px;
  border-radius:5px;
}
#jmResults .jm-tfl-road .jm-route-stop .jm-stop-time,
#jmResults .jm-tfl-road .jm-route-stop .jm-stop-platform {
  display:block;
  margin-top:7px;
  font-size:14px;
  line-height:1.35;
  color:#394f5e;
}
#jmResults .jm-tfl-road .jm-route-stop .jm-stop-platform {
  font-weight:800;
  color:#16466c;
}
#jmResults .jm-tfl-road .jm-route-controls {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  padding:0 12px;
}
#jmResults .jm-tfl-road .jm-route-controls button {
  box-sizing:border-box;
  min-width:0;
  width:100%;
  min-height:48px;
  margin:0;
  padding:11px 7px;
  border-radius:10px;
  font-size:14px;
  font-weight:800;
  line-height:1.2;
}
#jmResults .jm-tfl-road .jm-route-previous {
  background:#fff;
  border:1px solid #a5b6c4;
  color:#244357;
}
#jmResults .jm-tfl-road .jm-route-next {
  background:var(--road-action,var(--road-colour));
  border:1px solid var(--road-action,var(--road-colour));
  color:#fff;
}
#jmResults .jm-tfl-road .jm-route-controls button:disabled {
  opacity:.48;
  cursor:default;
}
#jmResults .jm-tfl-road .jm-route-hint {
  margin:12px 14px;
  padding:0;
  font-size:13px;
  color:#546574;
}
#jmResults .jm-tfl-road > a {
  display:inline-block;
  margin:0 14px 12px;
}
#jmResults .jm-tfl-road :focus-visible {
  outline:3px solid #2066aa;
  outline-offset:2px;
}
@media(max-width:430px) {
  #jmResults .jm-tfl-road .jm-route-list > .jm-route-stop {
    flex-basis:205px;
    width:205px;
    min-width:205px;
    max-width:205px;
  }
  #jmResults .jm-tfl-road .jm-route-progress {font-size:14px;}
  #jmResults .jm-tfl-road .jm-route-controls button {font-size:13px;}
}


/* Sooty's preferred field-by-field look: white cards, one coloured edge per
   transport, big readable labels. NOT the oversized teal three-section UI.
   Scoped strictly to Sooty's form, not the Transport apps or rolling roads. */
#jmMaster.jm-coloured-fields {
  width:min(100%,42rem);
  padding:clamp(13px,3vw,22px);
  background:#fff;
  border:1px solid #d2dce3;
  border-radius:18px;
  box-shadow:none;
  color:#182d43;
}
#jmMaster.jm-coloured-fields h2 {
  color:#183d33;
  font-size:clamp(24px,4.5vw,30px);
  font-weight:850;
  line-height:1.2;
  margin:0 0 12px;
}
#jmMaster.jm-coloured-fields > fieldset {
  margin:0 0 12px;
  padding:12px 14px;
  border:1px solid #cbd7e0;
  border-left:6px solid #0754ae;
  border-radius:14px;
  background:#fff;
}
#jmMaster.jm-coloured-fields > fieldset legend {
  font-size:17px;
  font-weight:850;
  line-height:1.35;
  color:#0c4594;
}
#jmMaster.jm-coloured-fields .jm-clock select {
  width:5.6rem;
  min-height:47px;
  margin:4px 0 0;
  font-size:18px;
  font-weight:850;
}
#jmMaster.jm-coloured-fields .jm-clock > span {
  font-size:22px;
  font-weight:850;
}
#jmMaster.jm-coloured-fields #jmDetails > label,
#jmMaster.jm-coloured-fields #jmOnward > label {
  --jm-field-accent:#0a54a5;
  display:block;
  box-sizing:border-box;
  min-width:0;
  margin:11px 0;
  padding:14px 15px 15px;
  background:#fff;
  border:1px solid #c8d1dd;
  border-left:7px solid var(--jm-field-accent);
  border-radius:16px;
  box-shadow:0 1px 4px rgba(19,40,70,.035);
  color:var(--jm-field-accent);
  font-size:clamp(17px,3.65vw,20px);
  font-weight:850;
  line-height:1.35;
  overflow-wrap:anywhere;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="date"]) {
  --jm-field-accent:#234ba7;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="station"]),
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="railTo"]),
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="buffer"]),
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="manualArrival"]) {
  --jm-field-accent:#0754ae;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="ferry"]) {
  --jm-field-accent:#006a3b;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="bus"]),
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="stop"]) {
  --jm-field-accent:#6b008d;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="walk"]),
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="transfer"]),
#jmMaster.jm-coloured-fields #jmOnward > label:has([name="waterlooWalk"]) {
  --jm-field-accent:#b12b00;
}
#jmMaster.jm-coloured-fields #jmDetails > label:has([name="onward"]),
#jmMaster.jm-coloured-fields #jmOnward > label:has([name="end"]),
#jmMaster.jm-coloured-fields #jmOnward > label:has([name="ready"]),
#jmMaster.jm-coloured-fields #jmOnward > label:has([name="preference"]) {
  --jm-field-accent:#c52638;
}
#jmMaster.jm-coloured-fields #jmDetails > label[hidden],
#jmMaster.jm-coloured-fields #jmOnward[hidden],
#jmMaster.jm-coloured-fields #jmOnward > label[hidden] {
  display:none!important;
}
#jmMaster.jm-coloured-fields #jmDetails > label :is(input,select),
#jmMaster.jm-coloured-fields #jmOnward > label :is(input,select) {
  box-sizing:border-box;
  display:block;
  width:100%;
  min-width:0;
  min-height:48px;
  margin:10px 0 0;
  padding:10px 12px;
  background:#fff;
  color:#19283b;
  border:1.5px solid #9aaaba;
  border-radius:10px;
  font-size:17px;
  font-weight:650;
  line-height:1.25;
}
#jmMaster.jm-coloured-fields #jmDetails input::placeholder {
  color:#667889;
  opacity:1;
  font-weight:500;
}
#jmMaster.jm-coloured-fields #jmDetails :is(input,select):focus-visible,
#jmMaster.jm-coloured-fields .jm-clock select:focus-visible {
  outline:3px solid rgba(11,89,173,.23);
  outline-offset:1px;
  border-color:#0754ae;
}
#jmMaster.jm-coloured-fields #jmDetails > button[type="submit"] {
  display:block;
  box-sizing:border-box;
  width:100%;
  min-height:52px;
  margin:15px 0 18px;
  padding:12px 18px;
  border:0;
  border-radius:11px;
  background:#07547d;
  color:#fff;
  font-size:18px;
  font-weight:850;
  line-height:1.3;
  cursor:pointer;
}
#jmMaster.jm-coloured-fields #jmResults {
  min-width:0;
  color:#273e51;
}
@media(max-width:440px) {
  #jmMaster.jm-coloured-fields {
    padding:11px 12px;
    margin:0 auto 16px;
    border-radius:14px;
  }
  #jmMaster.jm-coloured-fields #jmDetails > label,
  #jmMaster.jm-coloured-fields #jmOnward > label {
    margin:10px 0;
    padding:12px 12px 13px;
    border-left-width:6px;
    font-size:18px;
  }
  #jmMaster.jm-coloured-fields #jmDetails > label :is(input,select),
  #jmMaster.jm-coloured-fields #jmOnward > label :is(input,select) {
    min-height:47px;
    padding:10px;
    font-size:17px;
  }
}


/* Preferred compact Sooty layout: action controls only. Do not restore
   oversized section cards or affect Train, Ferry, Bus and Tube modules. */
#jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions {
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(93px,1fr);
  align-items:stretch;
  gap:10px;
  margin:14px 0 18px;
  min-width:0;
}
#jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions > button {
  box-sizing:border-box;
  min-width:0;
  width:100%;
  min-height:52px;
  margin:0;
  padding:11px 8px;
  border-radius:11px;
  font-size:16px;
  line-height:1.3;
  font-weight:850;
  cursor:pointer;
}
#jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions > button[type="submit"] {
  background:#07547d;
  border:2px solid #07547d;
  color:#fff;
}
#jmMaster.jm-coloured-fields #jmReset {
  color:#173e57;
  background:#fff;
  border:2px solid #879dae;
}
#jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions > button:focus-visible {
  outline:3px solid #2a71b1;
  outline-offset:3px;
}
@media(max-width:360px) {
  #jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions {
    grid-template-columns:minmax(0,1fr) 93px;
    gap:8px;
  }
  #jmMaster.jm-coloured-fields #jmDetails > .jm-form-actions > button {
    font-size:15px;
  }
}