#parcours .seg { grid-template-columns:1.2fr .85fr 1fr; }
#parcours [hidden] { display:none !important; }
#parcours.card { display:flex; flex-direction:column; height:780px; box-sizing:border-box; }
#parcours > .sector-total, #parcours > .seg, #parcours > .mp-src, #parcours > .empty { flex-shrink:0; }
#parcours #routeList, #parcours #journeyPanel { flex:1 1 0; min-height:0; overflow-y:auto; }
#parcours #routeList > li { flex-shrink:0; }
#parcours #journeyPanel { margin-top:14px; }
.journey-fields { display:grid; grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr); gap:10px; align-items:end; }
.journey-swap { width:44px; height:44px; border:1px solid var(--border); border-radius:50%; background:var(--primary-soft); color:var(--primary); font-size:24px; cursor:pointer; }
.journey-swap:disabled { opacity:.4; cursor:default; }
.journey-welcome { line-height:1.5; }
.journey-fields > div { min-width:0; }
.journey-fields label { display:block; font-weight:600; margin-bottom:6px; }
.journey-fields select { width:100%; min-height:44px; border:1px solid var(--border); border-radius:9px; background:var(--surface); color:var(--text); padding:8px; font:inherit; }
#journeyStatus { font-size:.8125rem; color:var(--muted); margin:10px 0; }
#journeySummary { border-radius:12px; padding:14px; margin:12px 0; background:var(--primary-soft); font-size:.875rem; }
#journeySummary small { display:block; color:var(--muted); margin-top:6px; }
.journey-normal { display:flex; align-items:center; gap:12px; margin-top:10px; padding:10px 12px; border-radius:9px; background:var(--surface); border:1px solid var(--border); }
.journey-normal > b { color:#b91c1c; font-size:1.65rem; line-height:1; white-space:nowrap; }
.journey-normal > span { font-weight:600; line-height:1.25; }
.journey-normal span small { font-weight:400; margin-top:3px !important; }
.journey-normal.unavailable > b { color:var(--muted); }
.journey-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:12px; }
.journey-metrics span { display:block; padding:10px 8px; border-radius:8px; color:#111827; text-align:center; border:2px solid currentColor; }
.journey-metrics b,.journey-metrics small { display:block; color:inherit !important; margin:0 !important; }
.metric-jam { background:#fecaca; color:#b91c1c !important; }.metric-dense { background:#fed7aa; color:#c2410c !important; }.metric-fluid { background:#bbf7d0; color:#15803d !important; }
.journey-map { border:1px solid var(--border); border-radius:12px; background:var(--surface-2); overflow:hidden; }
.journey-map svg { display:block; width:100%; height:auto; }
.journey-map text { font:600 14px system-ui; fill:var(--text); paint-order:stroke; stroke:var(--surface-2); stroke-width:4px; }
.journey-map .network { stroke:var(--unknown); opacity:.35; stroke-width:4; }
.journey-map .selected { stroke:var(--primary); stroke-width:7; }
.journey-map .morning-fluid { stroke:#16a34a; stroke-width:10; }
.journey-map .morning-dense { stroke:#ea580c; stroke-width:10; }
.journey-map .morning-jam { stroke:#dc2626; stroke-width:10; }
.journey-simulation-notice { padding:12px; margin-bottom:12px; border:1px solid var(--warn); border-radius:10px; background:var(--warn-soft); color:var(--text); font-size:.875rem; }
.journey-simulation-notice a { display:inline-block; margin-top:6px; }
.journey-simulation-legend { font-size:.8125rem; }
.journey-map path { fill:none; stroke-linecap:round; stroke-linejoin:round; }
.journey-map circle { fill:var(--surface); stroke:var(--primary); stroke-width:3; }
.journey-actions { display:flex; gap:8px; margin-top:10px; }
.journey-clear { margin-left:auto; background:none; border:0; color:var(--muted); font:inherit; font-size:.8125rem; text-decoration:underline; min-height:44px; cursor:pointer; }
#journeyPanel details { border-top:1px solid var(--border); padding:10px 0; font-size:.8125rem; }
#journeyPanel summary { cursor:pointer; }
#journeyPanel p { overflow-wrap:anywhere; }
#journeyPanel :focus-visible, #parcours .seg :focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
#journeyDeleteDialog { width:min(400px,calc(100% - 32px)); padding:24px; border:1px solid var(--border); border-radius:16px; background:var(--surface); color:var(--text); }
#journeyDeleteDialog::backdrop { background:rgba(0,0,0,.55); }
@media(max-width:420px) { #parcours .seg button { font-size:.75rem; gap:4px; padding:4px; height:44px; } #parcours .seg svg { width:14px; } .journey-fields { grid-template-columns:minmax(0,1fr) 44px; } .journey-fields > div:last-child { grid-column:1; } .journey-swap { grid-column:2; grid-row:1 / 3; align-self:center; } .journey-metrics { gap:4px; }.journey-metrics span {padding:8px 3px;font-size:.8rem;} }