.spb-demo { max-width: 680px; margin: 24px auto; font-family: -apple-system, "Segoe UI", "Microsoft JhengHei", sans-serif; }
.spb-demo h2 { text-align: center; }
.spb-preview { text-align: center; border: 1px dashed #bbb; border-radius: 10px; padding: 16px; background: #fafafa; }
.spb-preview img { max-width: 100%; height: auto; }
.spb-preview p { color: #888; font-size: 13px; margin: 8px 0 0; }
.spb-btn { display: inline-block; background: #2271b1; color: #fff; border: 0; border-radius: 6px; padding: 12px 22px; font-size: 16px; cursor: pointer; margin-top: 16px; }
.spb-btn:hover { background: #185a92; }
#spb-demo-finish { display: block; margin: 16px auto; }
.spb-result-card { margin: 20px auto; max-width: 520px; border: 2px solid #2271b1; border-radius: 12px; padding: 24px; text-align: center; background: #f0f6fc; }
.spb-result-check { color: #1a7f37; font-size: 20px; font-weight: bold; margin-bottom: 8px; }
.spb-result-label { color: #555; margin: 8px 0 4px; }
.spb-code { font-size: 30px; font-weight: bold; letter-spacing: 2px; color: #0b3d63; margin: 6px 0 14px; font-family: monospace; }
.spb-copy { background: #1a7f37; }
.spb-copy:hover { background: #145c28; }
.spb-steps { margin-top: 18px; text-align: left; font-size: 14px; line-height: 1.7; }
.spb-note { color: #a33667; font-size: 12px; }