/* One decision screen per scenario step and the execution path 1 → 10 → all (dashboard/views-decide-all.mjs).
   Tokens from app.css. The execution path is the one saturated place (DESIGN.md): 46 px markers, solid green line
   after a checked stage, dashed line before the stages still waiting. */

.decide.decide-solo { grid-template-columns: minmax(0, 1fr); }
.decide-solo .decide-main { max-width: 1400px; }
.da-h1 { max-width: 36em; }
.da-line { display: flex; gap: 8px; align-items: flex-start; max-width: 90ch; margin-top: 10px; color: var(--ink-2); font-size: 14.5px; }
.da-line svg.lucide { margin-top: 3px; color: var(--muted); }
.da-rows { margin-top: 28px; }
.da-rows .sec-head-row { align-items: center; }
.da-tabs { max-width: 100%; }
.da-bulk { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 10px; padding: 10px 12px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); }
.da-bulk p { display: flex; gap: 8px; align-items: center; color: var(--ink-2); font-size: 14px; }
.da-bulk p svg.lucide { color: var(--muted); }
.da-bulk-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.da-tbl tr.is-open > th { box-shadow: inset 3px 0 var(--amber); }
.da-tbl .t-open { color: var(--amber); font-weight: 600; }
.choice-btn.is-preset[aria-checked="true"] { box-shadow: inset 0 0 0 1px var(--green-line); background: #f1f8f4; }
.da-pager { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; }
.da-range { color: var(--ink-2); font-size: 13.5px; font-variant-numeric: tabular-nums; }
.check-line { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; background: var(--amber-soft); border: 1px solid var(--amber-line); border-radius: var(--radius); font-size: 14px; font-weight: 600; cursor: pointer; }
.check-line input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--green-btn); }

/* ---- execution path ------------------------------------------------------------------------------------ */
.ex { margin-top: 22px; padding: 20px 22px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; }
.ex .sec-head p { max-width: 90ch; }
.ex-path { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-top: 18px; }
.ex-step { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 12px; padding-right: 16px; }
.ex-step:not(:last-child)::after { content: ""; position: absolute; top: 22px; left: 58px; right: 8px; border-top: 2px dashed #c9d4cf; }
.ex-step.is-done:not(:last-child)::after { border-top-style: solid; border-color: var(--green-btn); }
.ex-dot { position: relative; z-index: 1; width: 46px; height: 46px; display: grid; place-items: center; color: var(--ink-2); background: var(--paper); border: 2px solid #c9d4cf; border-radius: 50%; font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ex-step.is-done .ex-dot { color: #fff; background: var(--green-btn); border-color: var(--green-btn); }
.ex-step.is-now .ex-dot { color: var(--ink); border-color: var(--ink); box-shadow: 0 0 0 4px #e7ece9; }
.ex-dot svg.lucide { width: 20px; height: 20px; }
.ex-text { min-width: 0; }
.ex-title { font-size: 15px; font-weight: 650; line-height: 1.35; }
.ex-state { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; color: var(--ink-2); font-size: 13px; }
.ex-step .ex-text { grid-column: 1 / -1; grid-row: 1; padding-top: 56px; }
.ex-step .ex-dot { grid-column: 1; grid-row: 1; align-self: start; }
.ex-now { display: grid; gap: 12px; margin-top: 18px; padding: 14px 16px; background: var(--tint); border: 1px solid var(--line-2); border-radius: var(--radius); }
.ex-now-lead { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; }
.ex-now-lead svg.lucide { margin-top: 3px; color: var(--blue); }
.ex-done { background: var(--green-soft); border-color: var(--green-line); }
.ex-done .ex-now-lead svg.lucide { color: var(--green); }
.ex-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.ex-verify { max-width: 640px; }

@media (max-width: 767px) {
  .ex { padding: 16px; }
  .ex-path { grid-auto-flow: row; gap: 14px; }
  .ex-step { grid-template-columns: 46px minmax(0, 1fr); padding-right: 0; }
  .ex-step .ex-text { grid-column: 2; padding-top: 4px; }
  .ex-step:not(:last-child)::after { top: 50px; bottom: -14px; left: 22px; right: auto; border-top: 0; border-left: 2px dashed #c9d4cf; }
  .ex-step.is-done:not(:last-child)::after { border-left-style: solid; border-color: var(--green-btn); }
  .da-bulk-acts .btn, .ex-acts .btn { flex: 1 1 auto; }
  .da-pager .btn { flex: 1 1 0; }
}
.choice-btn[data-pick="deferred"][aria-checked="true"] { color: var(--amber); background: var(--amber-soft); box-shadow: inset 0 0 0 2px var(--amber); }