/* Guided pages: one current task, a quiet progress rail, useful nearby help. */
.journey-shell {
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  align-items:start;
  gap:2rem;
}
.journey-rail {
  position:sticky;
  top:1.25rem;
  min-width:0;
}
.journey-content {
  min-width:0;
}
.journey-content > :first-child {
  margin-top:0;
}
.journey-menu {
  margin:0;
  padding:1rem .65rem .65rem;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}
.journey-current {
  padding:.35rem .35rem .8rem;
  font-size:.92rem;
  color:var(--ink);
}
.journey-steps {
  list-style:none;
  padding:0;
  margin:0;
}
.journey-step {
  margin:0;
  border-radius:7px;
}
.journey-step + .journey-step {
  margin-top:.3rem;
}
.journey-step > a {
  display:grid;
  grid-template-columns:1.7rem minmax(0,1fr);
  align-items:start;
  column-gap:.7rem;
  padding:.8rem .6rem;
  min-height:60px;
  border:1px solid transparent;
  border-radius:7px;
  color:var(--ink);
  font-size:.88rem;
  line-height:1.35;
  text-decoration:none;
}
.journey-step > a:hover {
  background:#f6f8fb;
  color:var(--accent);
}
.journey-step-number {
  display:inline-grid;
  place-items:center;
  width:1.7rem;
  height:1.7rem;
  border:1px solid #cbd4df;
  border-radius:50%;
  background:#fff;
  color:var(--muted);
  font-size:.82rem;
  font-weight:650;
  grid-column:1;
  grid-row:1 / span 2;
}
.journey-step-title {
  display:block;
  min-width:0;
  font-weight:600;
  grid-column:2;
}
.journey-step-state {
  display:block;
  margin-top:.25rem;
  color:var(--muted);
  font-size:.76rem;
  font-weight:400;
  grid-column:2;
}
.journey-step.current > a {
  border-color:#d0def2;
  background:var(--accent-soft);
  color:var(--accent);
}
.journey-step.current .journey-step-number {
  border-color:var(--accent);
  color:#fff;
  background:var(--accent);
}
.journey-step.current .journey-step-state {
  color:#345c94;
}
.journey-step.done .journey-step-number {
  border-color:#b5d3c1;
  color:var(--ok);
  background:#f4faf6;
}
.journey-step.done .journey-step-state {
  color:var(--ok);
}
.journey-step.upcoming .journey-step-title {
  color:var(--muted);
  font-weight:500;
}
.journey-progress {
  margin:.9rem .6rem .5rem;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.5;
}
.journey-progress p {
  margin:.35rem 0;
}
.journey-progress progress {
  display:block;
  width:100%;
  height:5px;
  margin:.6rem 0;
  border:0;
  border-radius:4px;
  overflow:hidden;
  accent-color:var(--accent);
}
.journey-progress progress::-webkit-progress-bar {
  background:#e7ecf2;
}
.journey-progress progress::-webkit-progress-value {
  background:var(--accent);
}
.journey-progress progress::-moz-progress-bar {
  background:var(--accent);
}
.journey-help {
  margin:1rem .65rem 0;
  color:var(--muted);
  font-size:.85rem;
}
.journey-help a {
  display:flex;
  align-items:center;
  min-height:44px;
  padding:.2rem 0;
}
.journey-help p {
  margin:.4rem 0;
}
.task-focus {
  display:block;
  padding:1.7rem;
  margin:0 0 1.6rem;
  border:1px solid var(--line);
  border-left:3px solid var(--accent);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:var(--shadow);
}
.task-focus h2 {
  font-size:1.45rem;
  margin:0 0 .7rem;
  letter-spacing:-.015em;
}
.task-focus p {
  max-width:75ch;
}
.task-focus .eyebrow {
  color:var(--muted);
  font-size:.76rem;
  letter-spacing:.07em;
}
.task-instructions {
  max-width:75ch;
  margin:1rem 0 1.25rem;
  padding-left:1.35rem;
}
.task-instructions li {
  padding-left:.2rem;
}
.task-instructions li + li {
  margin-top:.65rem;
}
.task-checkpoint {
  padding:.85rem 1rem;
  margin:1.1rem 0;
  border-radius:6px;
  background:#f5f7fa;
  color:var(--muted);
  font-size:.93rem;
  line-height:1.55;
}
.task-checkpoint strong {
  color:var(--ink);
}
.task-focus .actions {
  margin-top:1.25rem;
}
.task-meta {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.45rem 1.25rem;
  margin:.8rem 0 1.2rem;
  font-size:.87rem;
  color:var(--muted);
}
.task-meta p {
  margin:0;
}
.task-meta strong {
  color:var(--ink);
}
.scene-list {
  padding:0;
  margin:1rem 0 1.6rem;
  list-style:none;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
}
.scene-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:1rem;
  align-items:center;
  min-height:76px;
  padding:1rem 1.2rem;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  text-decoration:none;
  background:#fff;
}
.scene-row:last-child {
  border-bottom:0;
}
.scene-row:hover {
  color:var(--ink);
  background:#f8faff;
}
.scene-row:focus-visible {
  outline-offset:-3px;
}
.scene-row-main {
  min-width:0;
}
.scene-row-main strong {
  font-size:.97rem;
  font-weight:600;
}
.scene-row-main p,
.scene-row-main small {
  display:block;
  margin:.2rem 0 0;
  color:var(--muted);
  font-size:.84rem;
}
.scene-row-action {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  color:var(--accent);
  font-size:.86rem;
  font-weight:600;
  white-space:nowrap;
}
.supporting-details {
  margin:1rem 0;
  padding:.2rem 1.1rem;
  border:1px solid var(--line);
  background:#fff;
}
.supporting-details > summary {
  padding:.9rem 0;
  color:var(--ink);
  font-size:.95rem;
}
.supporting-details[open] {
  padding-bottom:1rem;
}
.supporting-details[open] > summary {
  margin-bottom:.75rem;
  border-bottom:1px solid var(--line);
}
.guide-steps {
  display:grid;
  gap:1.5rem;
  padding:0;
  margin:1.5rem 0;
  list-style:none;
}
.guide-step {
  min-width:0;
  padding:1.5rem;
  margin:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  scroll-margin-top:1.5rem;
}
.guide-step h2,
.guide-step h3:first-child {
  margin-top:0;
}
.guide-step > p,
.guide-step > ul,
.guide-step > ol {
  max-width:78ch;
}
.guide-action {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  align-items:center;
  margin:1.15rem 0 0;
}
.guide-example {
  padding:1rem 1.15rem;
  margin:1rem 0;
  border:1px solid var(--line);
  border-radius:7px;
  background:#f8f9fb;
  line-height:1.65;
}
.guide-example p:last-child,
.guide-checkpoint p:last-child {
  margin-bottom:0;
}
.guide-checkpoint {
  margin:1rem 0 0;
  padding:.8rem 0 0;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:.93rem;
}
.guide-checkpoint strong {
  color:var(--ink);
}
.journey-content .help-layout {
  grid-template-columns:minmax(0,1fr);
  gap:1rem;
}
.journey-content .help-index {
  position:static;
  flex-direction:row;
  flex-wrap:wrap;
  gap:.35rem;
}
.journey-content .help-index a {
  min-height:44px;
  padding:.6rem .8rem;
  border:1px solid var(--line);
  font-size:.9rem;
}
@media (min-width:901px) {
  .journey-menu > .journey-current {
    display:none;
  }
}
@media (max-width:1100px) {
  .journey-shell {
    grid-template-columns:200px minmax(0,1fr);
    gap:1.4rem;
  }
  .journey-step > a {
    column-gap:.5rem;
    padding:.75rem .45rem;
  }
  .scene-row {
    gap:.75rem;
    padding:1rem;
  }
}
@media (max-width:900px) {
  .journey-shell {
    grid-template-columns:minmax(0,1fr);
    gap:1.2rem;
  }
  .journey-rail {
    position:static;
  }
  .journey-menu {
    padding:.2rem .8rem;
  }
  .journey-menu > .journey-current {
    min-height:48px;
    margin:0;
    padding:.75rem .15rem;
    color:var(--accent);
  }
  .journey-menu[open] > .journey-current {
    border-bottom:1px solid var(--line);
    margin-bottom:.6rem;
  }
  .journey-menu[open] {
    padding-bottom:.7rem;
  }
  .journey-progress {
    margin:.7rem .3rem .3rem;
  }
  .journey-help {
    display:flex;
    flex-wrap:wrap;
    gap:.3rem 1.3rem;
    margin:.35rem .3rem 0;
  }
  .journey-help p {
    display:none;
  }
}
@media (max-width:600px) {
  .task-focus {
    padding:1.15rem;
    margin-bottom:1.25rem;
  }
  .task-focus h2 {
    font-size:1.28rem;
  }
  .task-focus .actions > .button,
  .task-focus .actions > button {
    width:100%;
  }
  .scene-row {
    grid-template-columns:minmax(0,1fr) auto;
    gap:.35rem .7rem;
    padding:.85rem 1rem;
  }
  .scene-row-main {
    grid-column:1 / -1;
  }
  .scene-row-action {
    justify-self:end;
  }
  .scene-row > .badge {
    justify-self:start;
    max-width:100%;
  }
  .guide-step {
    padding:1.1rem;
  }
  .guide-action .button {
    width:100%;
  }
  .supporting-details {
    padding:.2rem .9rem;
  }
}
@media print {
  .journey-shell {
    display:block;
  }
  .journey-rail {
    display:none;
  }
  .task-focus,
  .guide-step {
    border-color:#aaa;
    box-shadow:none;
  }
}

/* Personal encouragement stays secondary to the next concrete task. */
.personal-progress { margin-block: 1rem; }
.milestone-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; list-style: none; padding: 0; }
.milestone { display: flex; gap: .6rem; padding: .75rem; border: 1px solid var(--line, #d8e2ee); border-radius: .6rem; background: #f8fafc; }
.milestone-earned { background: #edf4ff; border-color: #bed3f5; }
.milestone-mark { color: #2859b5; font-weight: 700; }
.milestone span:not(.milestone-mark) { display: block; margin-top: .2rem; font-size: .85rem; color: #526780; }
@media (max-width: 700px) { .milestone-list { grid-template-columns: 1fr; } }
