.journey-board__steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.journey-step-card { display: flex; align-items: center; gap: 9px; padding: 12px 10px; background: white; border: 1px solid var(--color-border); border-radius: 9px; color: var(--color-primary-800); min-height: 77px; text-decoration: none; }
.journey-step-card:hover { text-decoration: none; border-color: var(--brand-teal); box-shadow: var(--shadow-xs); }
.journey-step-card.is-selected { border-color: var(--brand-teal); box-shadow: inset 4px 0 var(--brand-teal); background: var(--brand-blue-100); }
.journey-step-card__number { flex-shrink: 0; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--color-border-strong); border-radius: 50%; font-size: .75rem; }
.journey-step-card strong { display: block; font-size: .84rem; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.journey-step-card small { display: block; color: var(--color-text-muted); font-size: .68rem; margin-top: 5px; }
.journey-step-card > span:last-child { margin-left: auto; }
.journey-board__links a { display: block; font-size: .75rem; padding: 9px; background: var(--brand-yellow-100); border-radius: 6px; color: var(--color-primary-800); text-decoration: none; }
.journey-board__links a:last-child { background: var(--brand-blue-100); }
.journey-inspector h2 { font-size: 1.5rem; margin-bottom: 16px; }
.journey-inspector__content { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 20px; align-items: start; }
.journey-inspector__content:not(:has(.journey-shared)) { grid-template-columns: 1fr; }
.journey-shared { padding: 16px; border-radius: 8px; background: var(--brand-yellow-100); }
.journey-inspector h3 { font-family: var(--font-sans); font-size: .9rem; display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.journey-inspector h3 small { margin-left: auto; font-size: .7rem; }
.journey-role-tasks { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.journey-role-task { border: 1px solid var(--color-border); border-radius: 8px; padding: 14px; min-width: 0; }
.journey-role-task.is-highlighted { border-color: var(--brand-teal); background: var(--brand-blue-100); }
.journey-dashboard .is-dimmed { background: #f0f2f3; color: #4a5b60; border-color: #dde2e4; opacity: 1; }
.journey-dashboard .is-dimmed h3, .journey-dashboard .is-dimmed strong { color: #4a5b60; }
.journey-source-text { white-space: pre-line; font-size: .875rem; line-height: 1.65; overflow-wrap: anywhere; }
.journey-source-item + .journey-source-item { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--color-border); }
.journey-source-item__topic { font-weight: 600; margin-bottom: 14px; }
.journey-text-expand summary { font-size: .875rem; cursor: pointer; }
.journey-text-expand summary strong { display: block; color: var(--brand-teal); margin-top: 8px; font-size: .75rem; text-decoration: underline; }
.journey-text-expand[open] summary { margin-bottom: 12px; }
.journey-text-expand[open] summary span { display: none; }
.journey-doc small { color: var(--color-text-muted); }
/* One viewport workspace: phase sections keep their source order and their scroll containers. */
.journey-dashboard {
  width: 100%; max-width: none; margin: 0; padding: 14px 20px 12px;
  height: calc(100dvh - var(--nav-height)); min-height: 0;
  display: flex; flex-direction: column; gap: 12px;
}
.journey-dashboard__intro { flex: none; view-transition-name: journey-intro; }
.journey-dashboard__intro h1 { margin: 0; font-size: 1.35rem; line-height: 1.2; }
.journey-dashboard > .notice { flex: none; margin: 0; }
.journey-dashboard__filters {
  display: flex; align-items: center; gap: 12px; flex: none; padding: 8px 12px;
  background: white; border: 1px solid var(--color-border); border-radius: 10px;
  view-transition-name: journey-filters;
}
.journey-dashboard__filters > span { font-weight: 700; font-size: .8rem; flex-shrink: 0; }
.journey-dashboard__filters .role-selector { display: flex; flex-wrap: wrap; gap: 6px; }
.journey-dashboard__filters .role-btn { padding: 7px 11px; font-family: var(--font-sans); font-size: .8rem; min-height: 38px; }
.journey-board {
  --journey-column-width: max(220px, calc((100% - 48px) / 5));
  position: relative; display: grid; grid-template-columns: repeat(5,minmax(220px,1fr));
  flex: 1; min-height: 0; gap: 12px; align-items: stretch;
  overflow: auto; padding: 2px 2px 10px; scrollbar-width: thin; overscroll-behavior: contain;
}
.journey-board__column {
  display: flex; flex-direction: column; min-width: 0; min-height: 0;
  background: white; border: 1px solid var(--color-border); border-radius: 12px; overflow: hidden;
}
.journey-board__column.is-active { border-color: var(--brand-teal); box-shadow: 0 0 0 1px var(--brand-teal); }
.journey-column-title { margin: 0; padding: 0; flex: none; font-size: 1rem; }
.journey-phase-header { display: flex; gap: 10px; align-items: center; min-height: 66px; padding: 12px; background: var(--column-color); color: var(--column-ink); text-decoration: none; }
.journey-phase-header:hover { color: var(--column-ink); text-decoration: none; filter: brightness(.97); }
.journey-phase-header > span { flex-shrink: 0; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--brand-teal); background: white; font-size: 1.15rem; }
.journey-phase-header strong { font-family: var(--font-display); font-size: 1.05rem; line-height: 1.2; }
.journey-phase-header i { margin-left: auto; font-size: 1.5rem; font-style: normal; }
.journey-board__column[data-number="1"] { --column-color: var(--brand-yellow); --column-ink: var(--color-primary-900); }
.journey-board__column[data-number="2"] { --column-color: var(--brand-teal); --column-ink: white; }
.journey-board__column[data-number="3"] { --column-color: var(--brand-salmon); --column-ink: var(--color-primary-900); }
.journey-board__column[data-number="4"] { --column-color: var(--brand-burgundy); --column-ink: white; }
.journey-board__column[data-number="5"] { --column-color: var(--brand-blue); --column-ink: var(--color-primary-900); }
.journey-phase-body { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.journey-phase-steps { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.journey-board .journey-board__steps { padding: 12px; }
.journey-board .journey-board__links { display: grid; gap: 6px; margin-top: auto; padding: 12px; }
.journey-board--expanded { display: flex; }
.journey-board--expanded > .journey-board__column { flex: 0 0 var(--journey-column-width); }
.journey-board--expanded > .journey-board__column.is-active { flex-basis: max(620px, calc(100% - 160px)); }
.journey-board--expanded .is-active > .journey-phase-body { display: grid; grid-template-columns: 250px minmax(0,1fr); }
.journey-inspector {
  position: relative; min-width: 0; min-height: 0; padding: 24px 28px;
  border-left: 1px solid var(--color-border); background: white;
  overflow-y: auto; scrollbar-width: thin; overscroll-behavior-y: contain;
  view-transition-name: journey-detail;
}
.journey-inspector__reading { view-transition-name: journey-copy; }
.journey-inspector h2 { padding-right: 42px; }
.journey-inspector__close { position: sticky; float: right; top: 0; z-index: 3; display: grid; place-items: center; width: 36px; height: 36px; margin: -4px -12px -32px 8px; border: 1px solid var(--color-border-strong); border-radius: 50%; color: var(--brand-teal); background: white; font-size: 1.5rem; text-decoration: none; }
.journey-inspector__close:hover { background: var(--brand-blue-100); text-decoration: none; }
.journey-inspector__content { display: block; }
.journey-shared { margin-bottom: 16px; }
.journey-role-tasks { grid-template-columns: repeat(auto-fit,minmax(min(100%,280px),1fr)); }
.journey-role-task h3 { overflow-wrap: anywhere; }
.journey-role-task__label { min-width: 0; flex: 1; overflow-wrap: anywhere; }
.journey-role-task h3 small { flex-shrink: 0; }
.journey-step-card:visited { color: var(--color-primary-800); }
@media (max-width: 768px) {
  .journey-dashboard { padding: 12px 10px 8px; gap: 10px; }
  .journey-dashboard__intro h1 { font-size: 1.15rem; }
  .journey-dashboard__filters { flex-wrap: wrap; gap: 6px; padding: 8px; }
  .journey-dashboard__filters .role-selector { flex-wrap: nowrap; width: 100%; overflow-x: auto; padding-bottom: 3px; scrollbar-width: thin; }
  .journey-dashboard__filters .role-btn { flex-shrink: 0; white-space: nowrap; }
  .journey-board { display: flex; --journey-column-width: 240px; }
  .journey-board > .journey-board__column { flex: 0 0 240px; }
  .journey-board--expanded > .journey-board__column.is-active { flex-basis: calc(100% - 64px); }
  .journey-board--expanded .is-active > .journey-phase-body { display: flex; }
  .journey-board--expanded .is-active .journey-phase-steps { flex: none; overflow: visible; }
  .journey-board--expanded .is-active .journey-board__steps { display: flex; overflow-x: auto; padding: 8px; }
  .journey-board--expanded .is-active .journey-board__steps > li { flex: 0 0 220px; }
  .journey-board--expanded .is-active .journey-board__links { display: flex; gap: 6px; padding: 0 8px 8px; }
  .journey-board--expanded .is-active .journey-board__links a { flex: 1; }
  .journey-inspector { flex: 1; border-left: 0; border-top: 1px solid var(--color-border); padding: 16px; }
  .journey-inspector__close { margin-right: 0; }
}

.project-context { display: grid; gap: 12px; padding: 0 0 18px; border-bottom: 1px solid var(--color-border); }
.project-context__summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.project-context__summary > span { padding: 5px 9px; border-radius: 5px; background: var(--color-primary-50); font-size: .75rem; overflow-wrap: anywhere; }
.project-context__summary button { margin-left: auto; }
.project-explorer__sidebar [hidden] { display: none !important; }
.project-panel-header { grid-template-columns: minmax(0,1fr) auto; }
.project-panel-header__title { overflow-wrap: anywhere; }
.project-panel-header__location { margin-top: 6px; color: var(--color-text-muted); font-size: .875rem; }
.project-explorer__sidebar { height: calc(100dvh - var(--nav-height)); overflow-y: auto; }
.map-dot .map-dot__point { fill: var(--brand-teal); stroke: white; stroke-width: 2; }
.map-dot .map-dot__hit { fill: transparent; stroke: none; }
.map-dot .map-dot__ring { fill: none; stroke: var(--brand-teal); stroke-width: 2.5; }
.map-marker.is-selected .map-dot__point { fill: var(--brand-burgundy); stroke: white; stroke-width: 2; }
.map-dot:hover .map-dot__point, .map-dot:focus .map-dot__point { fill: var(--brand-burgundy); stroke: white; }

.map-dot circle, .map-dot:hover circle, .map-dot:focus circle, .map-dot.is-selected circle { transform: none; }
.map-marker.map-dot circle.map-dot__hit { fill: transparent; stroke: none; }
.map-marker.map-dot circle.map-dot__ring { fill: none; stroke: var(--brand-teal); stroke-width: 2.5; }
@media (min-width: 769px) and (max-width: 1024px) {
  .layout-split--explorer { grid-template-columns: 44% 56%; }
  .layout-split--explorer .layout-split__map { position: sticky; top: var(--nav-height); height: calc(100dvh - var(--nav-height)); }
}
@media (max-width: 768px) {
  .project-explorer__sidebar { height: auto; overflow: visible; }
  .layout-split--explorer .layout-split__map { position: sticky; z-index: 20; top: var(--nav-height); height: 34dvh; min-height: 220px; }
  .layout-split--explorer .map-container { height: 100%; min-height: 0; }
  .layout-split--explorer .project-map-note { font-size: .65rem; padding: 4px 12px; }
}

/* Interruptible shared-element transitions. */
html[data-journey-motion] { --journey-copy-offset: 12px; }
html[data-journey-direction="back"] { --journey-copy-offset: -12px; }
html[data-journey-motion]::view-transition { pointer-events: none; }
html[data-journey-motion]::view-transition-group(*) {
  animation-duration: 520ms;
  animation-timing-function: cubic-bezier(.22,1,.36,1);
}
html[data-journey-motion]::view-transition-old(*),
html[data-journey-motion]::view-transition-new(*) {
  mix-blend-mode: normal;
  object-fit: none;
  object-position: left top;
}
html[data-journey-motion]::view-transition-group(root),
html[data-journey-motion]::view-transition-new(root) { animation: none; }
html[data-journey-motion]::view-transition-old(root) { display: none; }
html[data-journey-motion="step"]::view-transition-group(*),
html[data-journey-motion="role"]::view-transition-group(*) { animation-duration: 340ms; }
html[data-journey-motion]::view-transition-old(journey-copy) {
  animation: journey-copy-out 150ms cubic-bezier(.4,0,1,1) both;
}
html[data-journey-motion]::view-transition-new(journey-copy) {
  animation: journey-copy-in 360ms 70ms cubic-bezier(.16,1,.3,1) both;
}
html[data-journey-motion="expand"]::view-transition-new(journey-detail),
html[data-journey-motion="phase"]::view-transition-new(journey-detail) {
  animation: journey-panel-in 360ms 90ms cubic-bezier(.16,1,.3,1) both;
}
html[data-journey-motion="collapse"]::view-transition-old(journey-detail) {
  animation: journey-panel-out 180ms cubic-bezier(.4,0,1,1) both;
}
@keyframes journey-copy-in {
  from { opacity: 0; transform: translateY(var(--journey-copy-offset)); filter: blur(1.5px); }
  to { opacity: 1; transform: translateY(0); filter: blur(0); }
}
@keyframes journey-copy-out {
  to { opacity: 0; transform: translateY(calc(0px - var(--journey-copy-offset))); filter: blur(1px); }
}
@keyframes journey-panel-in {
  from { opacity: 0; transform: translateX(14px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes journey-panel-out { to { opacity: 0; transform: translateX(8px); } }
.journey-step-card { transition: border-color 200ms, background-color 200ms, box-shadow 240ms; }
.journey-inspector__close { transition: background-color 180ms, transform 240ms cubic-bezier(.22,1,.36,1); }
@media (hover: hover) {
  .journey-inspector__close:hover { transform: scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-journey-motion]::view-transition-group(*),
  html[data-journey-motion]::view-transition-old(*),
  html[data-journey-motion]::view-transition-new(*) { animation: none !important; }
  .journey-step-card, .journey-inspector__close { transition: none; }
  .journey-inspector__close:hover { transform: none; }
}