/* V5: a situated concern, a system map and an optional change trajectory. */
.journey { --journey-ink:#263440; --journey-muted:#596777; --journey-line:#dce1e7; color:var(--journey-ink); }
.journey *, .journey *::before, .journey *::after { box-sizing:border-box; }
.journey h3 { font-size:calc(1.25rem * var(--content-scale)); line-height:1.4; margin:6px 0 14px; }
.journey h4 { font-size:calc(1rem * var(--content-scale)); line-height:1.4; margin:0; }
.journey-kicker { display:block; color:#8a1538; font-size:calc(.75rem * var(--content-scale)); font-weight:750; letter-spacing:.07em; margin-bottom:12px; }
.journey-context { display:grid; grid-template-columns:1fr 1.25fr; gap:32px; padding:28px; background:#faf6f7; border:1px solid #e8dce0; border-radius:18px; }
.journey label:not(.journey-switch):not(.journey-kicker):not(.journey-check) { display:block; font-size:calc(.82rem * var(--content-scale)); font-weight:650; margin-bottom:8px; }
.journey input[type=text], .journey input:not([type]), .journey textarea, .journey select { width:100%; min-width:0; border:1px solid #cbd2da; background:white; border-radius:8px; color:var(--journey-ink); padding:11px 12px; font-size:max(16px, calc(.9rem * var(--content-scale))); line-height:1.55; font-family:inherit; }
.journey textarea { resize:vertical; }
#journeyConcern { font-weight:600; min-height:115px; }
.journey-hint { font-size:calc(.79rem * var(--content-scale)); line-height:1.6; color:var(--journey-muted); margin:10px 0; }
.journey-pills { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.journey button:not(.btn-primary):not(.btn-outline), .journey-model-editor summary { font-size:calc(.8rem * var(--content-scale)); font-weight:600; color:#6e1734; cursor:pointer; border:1px solid #ded0d5; background:#fff; border-radius:8px; padding:10px 13px; min-height:44px; line-height:1.4; }
.journey button:hover:not(:disabled) { background:#f7e9ee; color:#72112f; }
.journey button:disabled { opacity:.45; cursor:default; }
.journey button[aria-pressed=true] { background:#8a1538!important; color:white!important; border-color:#8a1538!important; }
.journey-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:34px 0 18px; }
.journey-toolbar .journey-kicker { margin-bottom:4px; }
.journey-toolbar h3 { margin:0; }
.journey-switch { display:flex; align-items:center; gap:12px; background:#faf0f3; border:1px solid #ddc3cc; border-radius:30px; padding:12px 18px; font-size:calc(.88rem * var(--content-scale)); font-weight:700; cursor:pointer; flex-shrink:0; }
.journey input[type=checkbox] { width:20px; height:20px; accent-color:#8a1538; flex-shrink:0; }
.journey-board { display:grid; grid-template-columns:1fr; border:1px solid var(--journey-line); border-radius:16px; overflow:hidden; background:#fff; }
.journey-board.has-time { grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr); }
.journey-model, .journey-time { min-width:0; padding:24px; }
.journey-model { max-width:840px; width:100%; margin:0 auto; }
.journey-board.has-time .journey-model { align-self:start; }
.journey-time { border-left:1px solid var(--journey-line); background:#fcfcfd; }
.journey-panel-title { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.journey-panel-title > span { color:var(--journey-muted); font-size:calc(.72rem * var(--content-scale)); }
.journey-level-nav { display:flex; gap:6px; flex-wrap:wrap; margin-top:14px; }
.journey-level-nav button { flex:1; padding:8px!important; }
.journey-level-detail { margin:12px 0; padding:14px; border-radius:10px; background:#faf6f7; font-size:calc(.85rem * var(--content-scale)); line-height:1.65; }
.journey-level-detail p { margin:4px 0; }
.journey-model-editor { margin-top:14px; }
.journey-model-editor summary { background:#f7f8fa; color:var(--journey-muted); }
.journey-check { display:flex; align-items:center; gap:10px; font-size:calc(.84rem * var(--content-scale)); margin:16px 0 8px; cursor:pointer; min-height:44px; }
.journey-model-editor .journey-pills button { text-align:left; }
.journey-input-row { display:flex; gap:8px; align-items:stretch; }
.journey-input-row input { flex:1; }
.journey-input-row button { flex-shrink:0; }
.journey-model-item { display:flex; align-items:center; gap:10px; border-bottom:1px solid var(--journey-line); padding:8px 0; font-size:calc(.85rem * var(--content-scale)); overflow-wrap:anywhere; }
.journey-model-item span { flex:1; min-width:0; }
.journey-model-item button { padding:6px 12px!important; font-size:20px!important; }
.journey-timeline-scroll { overflow-x:auto; overscroll-behavior-x:contain; border:1px solid #e4e7ec; border-radius:12px; background:#fff; scrollbar-color:#b89aa5 #f3f1f2; }
#journeyTimeline { display:block; height:auto; width:100%; max-width:none; }
.journey-legend { display:flex; flex-wrap:wrap; gap:8px 18px; font-size:calc(.75rem * var(--content-scale)); color:#6e1734; margin-top:12px; }
.journey-event-detail { border:1px solid #e4d7dc; border-radius:12px; padding:18px; margin-top:18px; background:#fff; }
.journey-event-detail .journey-panel-title { margin-bottom:12px; }
.journey-event-detail .event-fields { display:grid; grid-template-columns:1fr 1.4fr; gap:12px; }
.journey-event-detail .event-fields > div { min-width:0; }
.journey-event-detail fieldset { border:0; padding:0; margin:14px 0; }
.journey-event-detail legend { font-size:calc(.82rem * var(--content-scale)); font-weight:650; margin-bottom:8px; }
.journey-event-levels { display:flex; flex-wrap:wrap; gap:6px; }
.journey-event-levels .journey-check { margin:0; background:#f7f5f6; padding:8px 10px; border-radius:8px; }
.journey-event-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.journey-events { border:1px solid var(--journey-line); border-radius:14px; padding:22px 24px; margin-top:20px; }
.journey-discussion { padding:22px 24px; border-left:3px solid #8a1538; background:#faf6f7; margin-top:26px; }
.journey-discussion .journey-kicker { margin-bottom:6px; }
.journey-discussion p { font-size:calc(1.05rem * var(--content-scale)); line-height:1.6; margin:0; }
.journey-bottom { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-top:28px; }
.journey-bottom > p { color:var(--journey-muted); font-size:calc(.8rem * var(--content-scale)); line-height:1.7; max-width:650px; }
.journey-export { display:flex; gap:10px; flex-shrink:0; flex-wrap:wrap; }
.journey-export button { font-size:calc(.85rem * var(--content-scale)); }
#journeyExportResult img { max-width:100%; height:auto; display:block; border:1px solid #ddd; margin:12px 0; }
#journeyExportResult summary { cursor:pointer; padding:12px 0; }
#journeyExportResult textarea { min-height:250px; }
html[data-content-scale="1.5"] .journey-board.has-time { grid-template-columns:1fr; }
html[data-content-scale="1.5"] .journey-time { border-left:0; border-top:1px solid var(--journey-line); }
@media(max-width:1050px) { .journey-board.has-time { grid-template-columns:1fr; } .journey-time { border-left:0; border-top:1px solid var(--journey-line); } .journey-model { max-width:720px; } .journey-bottom { align-items:flex-start; flex-direction:column; gap:16px; } }
@media(max-width:680px) {
 .journey-context { grid-template-columns:1fr; gap:24px; padding:18px; }
 .journey-toolbar { align-items:flex-start; flex-direction:column; gap:16px; }
 .journey-model, .journey-time { padding:14px; }
 .journey-events { padding:18px; }
 .journey-event-detail { padding:14px; }
 .journey-event-detail .event-fields { grid-template-columns:1fr; }
 .journey-input-row { flex-wrap:wrap; }
 .journey-input-row input { flex-basis:100%; }
 .journey-switch { max-width:100%; border-radius:12px; }
 .journey-export { width:100%; } .journey-export button { width:100%; justify-content:center; }
 .journey-discussion { padding:18px; }
}

/* The level names remain visible while events move horizontally. */
.journey-time-scene { display:grid; grid-template-columns:1fr; position:relative; }
#journeyTimeline, #journeyLaneLabels { grid-area:1 / 1; }
#journeyLaneLabels { display:block; position:sticky; left:0; align-self:start; justify-self:start; pointer-events:none; z-index:1; max-width:none; }

/* V6: common chart baseline and a compact edit flow. */
.journey-toggles{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.journey-toolbar{flex-wrap:wrap}.journey-switch{font-size:calc(.78rem * var(--content-scale));padding:10px 12px}
.journey-model>.journey-panel-title,.journey-time>.journey-panel-title{min-height:44px;margin-bottom:14px}
.journey-timeline-scroll{display:flex;align-items:flex-start;justify-content:flex-start}
.journey-time .journey-events{margin:18px 0;padding:16px}
.journey-bottom{justify-content:flex-end}
@media(max-width:680px){.journey-toggles{justify-content:flex-start}.journey-context{gap:18px}}

/* Equal desktop columns keep the two charts comparable in size. */
@media(min-width:1051px){.journey-board.has-time{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
html[data-content-scale="1.5"] .journey-board.has-time{grid-template-columns:1fr}
.journey-time-scene{flex-shrink:0}

.journey-timeline-scroll{overflow-y:hidden}