/* PK-SCADA 快速上手（開專案精靈） */
.qs-steps { display: flex; gap: 4px; margin: 0 0 10px; font-size: 12px; color: var(--mute); }
.qs-steps span { flex: 1; text-align: center; padding: 6px 2px; border-bottom: 3px solid var(--line); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qs-steps .done { border-color: var(--ok); color: var(--ok); }
.qs-steps .on { border-color: var(--acc); color: var(--ink); font-weight: 700; }
.qs-tpls { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 10px; }
.qs-tpl, .qs-src { display: flex; flex-direction: column; gap: 4px; text-align: left; width: 100%; font: inherit; color: var(--ink); cursor: pointer; margin: 0 0 8px; }
.qs-tpl { margin: 0; }
.qs-tpl.on, .qs-src.on { border: 2px solid var(--acc); background: color-mix(in srgb, var(--acc) 8%, var(--card)); }
.qs-tpl.on b::before { content: '✓ '; color: var(--acc); }
.qs-2 { display: flex; gap: 8px; } .qs-2 > * { flex: 1; min-width: 0; } .qs-2 label { display: block; min-height: 2.6em; }
.qs-row { padding: 10px 12px; margin-bottom: 8px; }
.qs-row input { margin: 6px 0 0; padding: 10px; font-family: ui-monospace, Menlo, monospace; }
.qs-rh { display: flex; flex-direction: column; } .qs-rh .mute { font-family: ui-monospace, Menlo, monospace; font-size: 12px; }
.qs-lim input { font-family: inherit; }
.qs-cmd { background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 10px; font-size: 12px; white-space: pre-wrap; word-break: break-all; margin: 6px 0; user-select: all; }
.qs-li { display: flex; gap: 10px; padding: 6px 0; color: var(--mute); } .qs-li span { width: 18px; font-weight: 700; }
.qs-li.ok { color: var(--ink); } .qs-li.ok span { color: var(--ok); }
.qs-hero { display: flex; flex-direction: column; gap: 6px; } .qs-hero .btn { margin-top: 6px; }
.qs-bar { display: flex; align-items: center; gap: 10px; } .qs-bar span { flex: 1; }
.qs-bar .btn { min-height: 36px; padding: 6px 12px; } .banner.qs-bar .btn { background: #fff; color: var(--acc); }
.qs-bar.plain, .qs-bar.demo { margin: 0 0 8px; }
/* 示範資料只用低調小灰標籤標示（取代原本整條大藍橫幅） */
.qs-bar.demo .chip { flex: none; background: var(--line); color: var(--mute); border-radius: 999px; padding: 3px 11px; font-size: 12px; font-weight: 700; }
.qs-bar.demo .btn { margin-left: auto; }
/* 登入頁的次要「申請試用」連結 */
.qs-slot { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.qs-slot span { flex: 1; }
.qs-cred { background: var(--bg); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; font-size: 18px; line-height: 1.8; }
.qs-cred b { font-family: ui-monospace, Menlo, monospace; margin-left: 8px; }