/* Product walkthrough: one visible route, compact evidence and nearby controls. */
.walkthrough .scenario-tabs{display:inline-flex;gap:4px;padding:4px;background:#f1f3ef;border:1px solid #e0e4dc;border-radius:10px;margin-bottom:24px}
.walkthrough .scenario-tabs button{justify-content:center;min-height:44px;padding:10px 23px;border:0;border-radius:7px;color:#53615a;font-size:13px;font-weight:550}
.walkthrough .scenario-tabs button[aria-selected=true]{background:var(--ink);color:#fff}
.walkthrough .walkthrough-grid{gap:36px;grid-template-columns:.8fr 1.2fr;align-items:start}
.walkthrough .step{gap:16px;min-height:90px;padding:18px 14px;border-radius:8px;border:1px solid transparent;margin-bottom:5px}
.walkthrough .step.selected{padding-left:14px;border-color:#cbdaf8;background:#edf3ff;color:#194fcb}
.walkthrough .step-num{align-self:center;display:grid;place-items:center;padding:0;margin:0;min-width:32px;height:32px;background:#f1f3ef;border-radius:50%;font-size:13px;color:#617068}
.walkthrough .step.selected .step-num{background:var(--blue);color:white}
.walkthrough .step small{color:#67766d;font-size:12px}
.walkthrough .step.selected small{color:#526d9c}
.step-short{display:none}
.walkthrough .step-panel{min-height:0;border-radius:12px;background:#f7f9fe;border-color:#dce3ef}
.walkthrough .panel-chrome{padding:13px 24px;font-size:10px;color:#61728d;background:#fff;letter-spacing:.7px}
.panel-demo{font-size:9px;letter-spacing:1px;color:#68766e}
.step-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px 0}
.step-current{min-width:0}
.step-current>span{display:block;font-size:11px;color:#526783;margin-bottom:3px}
.step-current strong{display:block;font-size:16px;font-weight:600;line-height:1.35;letter-spacing:-.25px}
.step-controls{display:flex;align-items:center;gap:6px;flex:none}
.step-control{display:flex;justify-content:center;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:10px;background:#fff;border:1px solid #cbd6e7;border-radius:8px;color:var(--blue);font-size:12px;font-weight:600}
.step-control-next{min-width:94px;background:var(--blue);border-color:var(--blue);color:#fff}
.step-control:hover:not(:disabled){background:#e6edfb}
.step-control-next:hover{background:#174ed0!important}
.step-control:disabled{color:#acb6c5;background:transparent;border-color:#e0e5ee;cursor:default}
#previous-step .icon{transform:rotate(180deg)}
.step-control .icon{width:18px;height:18px}
.walkthrough .panel-body{padding:24px}
.walkthrough .panel-body h3{font-size:26px;line-height:1.2;margin-bottom:12px}
.walkthrough .panel-body .status{margin-bottom:12px;font-size:11px}
.walkthrough .panel-description{font-size:14px;line-height:1.55;color:#596a80;margin-bottom:18px}
.walkthrough .answer-paper{padding:18px;margin-top:0;box-shadow:none}
.walkthrough .paper-head{font-size:12px;color:#526783;padding-bottom:12px;margin-bottom:12px}
.walkthrough .paper-head span:last-child{white-space:nowrap}
.walkthrough .answer-paper p{font-size:14px;line-height:1.6;color:#43566e;margin:0}
.step-attachments{margin-top:6px;font-size:12px;color:#4d6384}
.step-attachments summary{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;border-radius:4px}
.step-attachments summary::-webkit-details-marker{display:none}
.step-attachments summary:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.step-attachments .icon{width:16px;height:16px}
.attachment-toggle{margin-left:auto;font-size:20px;line-height:1}
.step-attachments[open] .attachment-toggle{transform:rotate(45deg)}
.step-attachments ul{margin:0;padding:4px 0 0 24px;display:grid;gap:8px;overflow-wrap:anywhere}
.walkthrough .panel-bottom{align-items:start;justify-content:start;gap:10px;padding:16px 24px;background:#edf3e5;border-color:#dce6d1}
.walkthrough .panel-bottom>.icon{width:18px;height:18px;color:#4a6933;margin-top:2px}
.walkthrough .panel-bottom span{display:block;font-size:10px;font-weight:600;letter-spacing:.4px;color:#4f663e;margin-bottom:3px}
.walkthrough .panel-bottom p{font-size:13px;color:#344c31;line-height:1.5}
.walkthrough .data-grid{gap:12px 18px;padding-top:14px}
.walkthrough .data-item small{color:#586c85;font-size:11px}
.walkthrough .data-item strong{color:#374e68;font-size:13px}
.walkthrough .demo-message{padding:12px 14px;margin-top:16px}
.walkthrough .demo-message p{font-size:13px;color:#43566e;line-height:1.55}
.walkthrough .demo-message small{font-size:10px;color:#687a93;margin-top:6px}
.walkthrough .material-list{margin-top:0;gap:8px}
.walkthrough .material-item{padding:12px;gap:10px}
.walkthrough .material-item strong{font-size:13px;color:#374e68}
.walkthrough .material-item small{font-size:11px;color:#66768b}
.walkthrough .material-status{font-size:11px;color:#47633d}
.walkthrough .material-item.pending .material-status{color:#836313}
.walkthrough .approval-people{margin:0 0 12px}
.walkthrough .approval-person{padding:12px}
.walkthrough .approval-person strong{font-size:13px;color:#374e68}
.walkthrough .approval-person small{font-size:11px;color:#61738b}
.walkthrough .comment-box{padding:14px}
.walkthrough .comment-author{font-size:11px;color:#536b90}
.walkthrough .comment-box p{font-size:14px;color:#43566e}
.walkthrough .complete-mark{display:none}
.walkthrough .completion-list{font-size:14px;color:#43566e;margin-top:18px;gap:12px}
.walkthrough .demo-footnote{color:#657268;font-size:11px;line-height:1.6;max-width:850px}

@media(max-width:900px) and (min-width:701px){
  .walkthrough .walkthrough-grid{grid-template-columns:.7fr 1.3fr;gap:20px}
  .walkthrough .step{padding:14px 10px;gap:10px}
  .walkthrough .step.selected{padding-left:10px}
  .walkthrough .step strong{font-size:14px}
  .walkthrough .step small{font-size:11px}
}
@media(max-width:700px){
  .walkthrough .scenario-tabs{display:flex;width:100%;margin-bottom:16px}
  .walkthrough .scenario-tabs button{flex:1;min-width:0;padding:10px 6px;font-size:12px;white-space:nowrap}
  .walkthrough .walkthrough-grid{display:block}
  .walkthrough .steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;overflow:visible;padding:0;margin:0 0 16px;scroll-snap-type:none}
  .walkthrough .step,.walkthrough .step:first-child,.walkthrough .step.selected{display:flex;flex-direction:column;justify-content:center;gap:5px;min-width:0;min-height:67px;margin:0;padding:8px 2px;border:1px solid #e0e5ed;border-radius:8px;background:#fff;color:#5d6b79}
  .walkthrough .step.selected{background:var(--blue);border-color:var(--blue);color:#fff}
  .walkthrough .step-num,.walkthrough .step.selected .step-num{font-size:16px;font-weight:600;min-width:0;height:auto;line-height:1.2;background:none;color:inherit;border-radius:0}
  .walkthrough .step-copy{display:none}
  .walkthrough .step-short{display:block;font-size:11px;line-height:1.25;letter-spacing:0}
  .walkthrough .panel-chrome{padding:11px 16px;font-size:10px}
  .step-toolbar{padding:16px 16px 0;gap:10px}
  .step-current>span{font-size:11px}
  .step-current strong{font-size:14px;max-width:180px}
  .step-control-next{min-width:84px;padding:10px 8px;gap:6px}
  .step-controls{gap:5px}
  .walkthrough .panel-body{padding:20px 16px 16px}
  .walkthrough .panel-body h3{font-size:23px;letter-spacing:-.6px;margin-bottom:10px}
  .walkthrough .panel-body .status{font-size:10px;margin-bottom:10px}
  .walkthrough .panel-description{font-size:14px;line-height:1.5;margin-bottom:16px}
  .walkthrough .answer-paper{padding:14px}
  .walkthrough .paper-head{font-size:11px;gap:8px}
  .walkthrough .answer-paper p{font-size:14px;line-height:1.55}
  .walkthrough .panel-bottom{padding:14px 16px}
  .walkthrough .data-grid{gap:10px 16px}
  .walkthrough .data-item strong{font-size:12px}
  .walkthrough .material-item{gap:8px;display:grid;grid-template-columns:18px 1fr}
  .walkthrough .material-item>.icon{width:18px;height:18px;grid-row:span 2}
  .walkthrough .material-status{grid-column:2;margin-left:0;line-height:1}
  .walkthrough .material-item small{font-size:11px}
  .walkthrough .approval-people{gap:8px}
  .walkthrough .approval-person{padding:10px}
  .walkthrough .approval-person strong{font-size:12px}
  .walkthrough .approval-person small{font-size:11px}
  .walkthrough .demo-footnote{font-size:10px}
}
@media print{.walkthrough .steps,.step-controls{display:none}}