/* Keep the current screen and the return to planning visible beside the results. */
.route-composition{--mix-main:#24774f;--mix-additional:#97ba78;--mix-other:#8b9daf;margin:20px 0 16px}
[data-theme=dark] .route-composition{--mix-main:#a4ddbc;--mix-additional:#819f49;--mix-other:#718fa9}
.route-composition figcaption{margin:0 0 8px;font-size:.875rem;font-weight:650;line-height:1.4;color:var(--ink)}
.route-composition .route-bar{display:flex;height:10px;margin:0;border-radius:5px;overflow:hidden}
.route-composition .route-bar>span{flex:none;height:100%;border-radius:0}
.route-composition .route-mix-main{background:var(--mix-main)}
.route-composition .route-mix-additional{background:var(--mix-additional)}
.route-composition .route-mix-other{background:var(--mix-other)}
.route-mix-legend{display:grid;gap:6px;list-style:none;margin:10px 0 0;padding:0;font-size:.875rem;line-height:1.4;color:var(--muted)}
.route-mix-legend li{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:baseline;gap:8px}
.route-mix-swatch{width:10px;height:10px;border-radius:2px;align-self:center}
.route-mix-distance{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ink)}
.step-info .section-feature{display:flex;align-items:flex-start;gap:5px}
.section-feature .walk-tool-icon{width:18px;height:18px;flex:none;margin-top:1px;color:currentColor}
.large-text .route-composition figcaption,.large-text .route-mix-legend{font-size:1.125rem}
.edit-walk{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;max-width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--green);font:650 .875rem/1.35 'DM Sans',system-ui,sans-serif;cursor:pointer}
.edit-walk svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.edit-walk:hover{border-color:var(--green)}
.circular-choice-route{display:grid;grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:10px;margin:4px 0}
.circular-choice-description{display:grid;gap:4px;min-width:0;overflow-wrap:anywhere}
.circular-choice-direction{font-size:.9375rem;font-weight:650;line-height:1.4;color:var(--ink)}
.circular-choice-via,.circular-choice-departure{font-size:.875rem;line-height:1.4;color:var(--muted)}
.circular-route-preview{display:block;width:100%;height:auto;color:var(--green);background:color-mix(in srgb,var(--green) 5%,var(--paper));border:1px solid var(--line);border-radius:8px}
.circular-route-preview .preview-path{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.circular-route-preview .preview-arrow{fill:currentColor;stroke:var(--paper);stroke-width:.8;stroke-linejoin:round}
.circular-route-preview .preview-start{fill:var(--paper);stroke:currentColor;stroke-width:2.2}
.circular-route-preview .preview-north{fill:var(--muted);font:600 10px system-ui,sans-serif}
.large-text .edit-walk,.large-text .circular-choice-direction,.large-text .circular-choice-via,.large-text .circular-choice-departure{font-size:1.125rem}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
  .phone-nav button[aria-current=page],[data-theme=dark] .phone-nav button[aria-current=page]{background:var(--forest);color:var(--paper);font-weight:750;box-shadow:inset 0 0 0 2px var(--forest)}
  [data-theme=dark] .phone-nav button[aria-current=page]{background:var(--green);color:var(--accent-ink);box-shadow:inset 0 0 0 2px var(--green)}
  .phone-nav button[aria-current=page] svg{stroke-width:2.4}
}
@media(max-width:380px){.circular-choice-route{grid-template-columns:minmax(0,1fr) 80px;gap:7px}.large-text .circular-choice-route{grid-template-columns:1fr}.large-text .circular-route-preview{max-width:120px}}