.guide-wrap { padding: 1rem 0; font-family: var(--font-mono); }
.step-card { background: var(--color-background-primary); border: 0.5px solid var(--color-border-tertiary); border-radius: var(--border-radius-lg); padding: 1rem 1.25rem; margin-bottom: 12px; }
.step-header { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.step-num { width: 28px; height: 28px; border-radius: 50%; background: #E6F1FB; color: #0C447C; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; flex-shrink: 0; }
.step-title { font-size: 14px; font-weight: 500; color: var(--color-text-primary); font-family: var(--font-sans); }
.step-body { font-size: 13px; color: var(--color-text-secondary); font-family: var(--font-sans); line-height: 1.6; }
.code-pill { background: var(--color-background-secondary); border: 0.5px solid var(--color-border-secondary); border-radius: 4px; padding: 2px 6px; font-family: var(--font-mono); font-size: 12px; color: var(--color-text-primary); }
.section-label { font-size: 11px; font-weight: 500; color: var(--color-text-tertiary); letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 8px; font-family: var(--font-sans); }
.browser-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.badge { font-size: 12px; padding: 3px 10px; border-radius: var(--border-radius-md); font-family: var(--font-sans); }
.badge-chrome { background: #EAF3DE; color: #27500A; }
.badge-edge { background: #E6F1FB; color: #0C447C; }
.badge-brave { background: #FAECE7; color: #712B13; }
.badge-ff { background: #FAEEDA; color: #633806; }
.warn-box { background: #FAEEDA; border: 0.5px solid #EF9F27; border-radius: var(--border-radius-md); padding: 8px 12px; font-size: 12px; color: #633806; font-family: var(--font-sans); margin-top: 8px; }