/* Beginner connection guidance and two role-specific guides. No business state styling outside these pages. */
.connection-page .comic-masthead { flex-wrap:wrap; align-items:start; }
.connection-page .comic-header-links { flex-wrap:wrap; justify-content:flex-end; gap:8px 18px; }
.connection-page .comic-header-links a { min-height:38px; display:inline-flex; align-items:center; }
.connection-page .onboarding-welcome { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:22px 24px; background:#fff6d7; border:2px solid var(--comic-ink); margin:20px 0 28px; box-shadow:4px 4px 0 #d9d0af; }
.connection-page .onboarding-welcome > div { min-width:0; }
.connection-page .onboarding-welcome h2 { margin:13px 0 8px; font-size:22px; font-weight:850; line-height:1.6; }
.connection-page .onboarding-welcome p { margin:0; font-size:12px; color:#6b624c; line-height:1.9; }
.connection-page .onboarding-welcome .btn { flex-shrink:0; min-height:44px; font-size:12px; }
.connection-page .connection-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 10px; }
.connection-page .connection-steps li { min-width:0; font-size:11px; }
.connection-page .onboarding-preparation { padding:14px; margin-bottom:17px; border:1px solid #c7d4eb; background:#f1f5fe; }
.connection-page .onboarding-preparation strong { display:block; font-size:12px; line-height:1.9; }
.connection-page .onboarding-preparation p { font-size:11px; line-height:1.9; color:#60738e; margin:7px 0 0; }
.connection-page .onboarding-auto-note { padding:13px 0; margin:0 0 12px; border-top:1px dashed #b7c3d9; }
.connection-page .onboarding-auto-note strong { display:block; color:#315b9c; font-size:12px; margin-bottom:5px; }
.connection-page .onboarding-auto-note span { display:block; color:#64738a; font-size:11px; line-height:1.9; }
.connection-page .connection-config .field-footnote { font-size:10px; line-height:1.9; }
.connection-page .connection-config .label { flex-wrap:wrap; gap:3px 8px; }
.connection-page .onboarding-first-message { padding:14px; background:#f3f5f9; border:1px dashed #bbc7d9; margin-top:16px; }
.connection-page .onboarding-first-message strong { font-size:12px; }
.connection-page .onboarding-first-message p { font-size:11px; line-height:1.9; color:#66778f; margin:7px 0 0; }
.connection-page .onboarding-first-message.is-ready { background:#eef8f0; border-color:#8eb8a0; }
.connection-page .onboarding-help-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 16px; margin-top:18px; }
.connection-page .onboarding-help-actions > .btn { min-height:44px; font-size:12px; }
.connection-page .onboarding-help-actions > a { font-size:11px; }
.connection-page .onboarding-copy-note { font-size:10px; line-height:1.9; color:#4c6b58; margin:9px 0 0; overflow-wrap:anywhere; }
.connection-page .secondary-actions .btn { min-height:44px; }
.connection-page #stack-error { line-height:1.9; }
.onboarding-guide { max-width:980px; padding-bottom:30px; }
.onboarding-guide *, .onboarding-guide *::before,.onboarding-guide *::after { min-width:0; }
.onboarding-guide-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; border-bottom:3px solid var(--comic-ink); padding-bottom:18px; }
.onboarding-guide-header .comic-brand { font-size:23px; }
.onboarding-guide-header .comic-brand-sub { font-size:8px; letter-spacing:1px; }
.onboarding-guide-header > a:last-child { display:inline-flex; align-items:center; min-height:44px; font-size:12px; font-weight:750; }
.onboarding-guide-intro { padding:28px; background:#ffe58f; border:3px solid var(--comic-ink); box-shadow:5px 5px 0 var(--comic-ink); margin:25px 0; }
.onboarding-guide-intro h1 { font-size:34px; line-height:1.45; font-weight:900; letter-spacing:-1px; margin:20px 0 12px; }
.onboarding-guide-intro p { margin:0 0 19px; color:#685b38; font-size:14px; line-height:1.9; }
.onboarding-guide .guide-actions { display:flex; flex-wrap:wrap; gap:12px; }
.onboarding-guide .btn { min-height:44px; font-size:12px; }
.onboarding-guide-nav { display:flex; flex-wrap:wrap; gap:8px 18px; padding:14px 0 17px; border-bottom:1px dashed #aebdd5; }
.onboarding-guide-nav a { display:inline-flex; align-items:center; min-height:36px; font-size:12px; font-weight:700; }
.onboarding-guide article { padding:25px; background:#fffefa; border:2px solid var(--comic-ink); margin:23px 0; scroll-margin-top:18px; }
.onboarding-guide .guide-step { color:#587395; font-size:10px; font-weight:800; letter-spacing:1px; }
.onboarding-guide article h2 { font-size:22px; font-weight:850; line-height:1.6; margin:10px 0 16px; overflow-wrap:anywhere; }
.onboarding-guide article p,.onboarding-guide article li { font-size:13px; line-height:1.95; }
.onboarding-guide article p { margin:13px 0; }
.onboarding-guide article ol,.onboarding-guide article ul { padding-left:23px; margin:14px 0; }
.onboarding-guide article li { padding-left:3px; margin-bottom:9px; }
.onboarding-guide .guide-note { padding:13px 16px; border-left:4px solid #315ee7; background:#edf3ff; color:#476180; font-size:12px; }
.guide-preparation { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:0; }
.guide-preparation > div { padding:16px; border:1px solid #c5d1e4; background:#f5f7fc; }
.guide-preparation dt { font-size:13px; font-weight:800; line-height:1.8; }
.guide-preparation dd { margin:7px 0 0; color:#5d708c; font-size:12px; line-height:1.9; }
.guide-table-wrap { width:100%; overflow-wrap:anywhere; }
.onboarding-guide table { width:100%; border-collapse:collapse; table-layout:fixed; margin:12px 0 18px; }
.onboarding-guide th,.onboarding-guide td { text-align:left; vertical-align:top; padding:11px 13px; border:1px solid #c4d0e3; font-size:12px; line-height:1.9; overflow-wrap:anywhere; }
.onboarding-guide th { background:#edf2fc; font-weight:800; }
.onboarding-guide th:first-child,.onboarding-guide td:first-child { width:34%; }
.guide-admin-command { padding:15px 17px; border:1px dashed #a8bbd9; margin-top:18px; background:#f2f5fc; }
.guide-admin-command summary { min-height:34px; font-size:13px; font-weight:750; cursor:pointer; }
.guide-admin-command pre { padding:13px; background:#fffefa; border:1px solid #d2ddef; font-size:12px; line-height:1.9; white-space:pre-wrap; overflow-wrap:anywhere; }
.onboarding-guide-footer { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 20px; border-top:2px solid var(--comic-ink); padding-top:16px; margin-top:28px; color:#647793; font-size:10px; }
.onboarding-guide-footer > a { display:inline-flex; align-items:center; min-height:44px; }
.help-page .onboarding-legacy-entry { padding:20px; margin:22px 0; border:2px solid var(--comic-ink); background:#eef4ff; }
.help-page .onboarding-legacy-entry > strong { font-size:17px; }
.help-page .onboarding-legacy-entry > p { font-size:12px; line-height:1.9; color:#546c8b; }
.help-page .onboarding-legacy-entry > div { display:flex; flex-wrap:wrap; gap:12px; }
.help-page .onboarding-legacy-entry .btn { min-height:44px; font-size:12px; }
@media(max-width:640px) {
 .connection-page .comic-header-links { justify-content:flex-start; gap:3px 15px; font-size:10px; }
 .connection-page .comic-header-links a { min-height:44px; }
 .connection-page .onboarding-welcome { display:block; padding:19px 17px; margin-top:17px; }
 .connection-page .onboarding-welcome .chapter-label { font-size:8px; }
 .connection-page .onboarding-welcome h2 { font-size:19px; }
 .connection-page .onboarding-welcome p { font-size:11px; }
 .connection-page .onboarding-welcome .btn { margin-top:16px; }
 .connection-page .connection-config .input { font-size:16px; }
 .connection-page .onboarding-preparation { padding:12px; }
 .connection-page .onboarding-preparation strong { font-size:11px; }
 .connection-page .onboarding-preparation p { font-size:10px; }
 .connection-page .connection-steps li { font-size:10px; }
 .onboarding-guide-header .comic-brand { font-size:20px; }
 .onboarding-guide-header .comic-brand > img { width:38px; height:38px; }
 .onboarding-guide-header .comic-brand-sub { font-size:7px; letter-spacing:0; }
 .onboarding-guide-header > a:last-child { font-size:10px; }
 .onboarding-guide-intro { padding:23px 20px; }
 .onboarding-guide-intro .chapter-label { font-size:8px; }
 .onboarding-guide-intro h1 { font-size:27px; }
 .onboarding-guide-intro p { font-size:12px; }
 .onboarding-guide article { padding:20px 17px; }
 .onboarding-guide article h2 { font-size:19px; }
 .onboarding-guide article p,.onboarding-guide article li { font-size:12px; }
 .onboarding-guide-nav { gap:5px 15px; }
 .onboarding-guide-nav a { font-size:11px; min-height:44px; }
 .guide-preparation { grid-template-columns:1fr; gap:11px; }
 .onboarding-guide .guide-note { padding:12px; font-size:11px; }
 .onboarding-guide th,.onboarding-guide td { padding:9px; font-size:10px; }
 .guide-admin-command { padding:13px; }
 .guide-admin-command pre { padding:10px; font-size:11px; }
}
@media(max-width:359px) {
 .onboarding-guide-header .comic-brand { font-size:18px; }
 .onboarding-guide-header .comic-brand > img { width:34px; height:34px; }
 .onboarding-guide-intro { padding:20px 16px; }
 .onboarding-guide-intro h1 { font-size:24px; }
 .onboarding-guide article { padding:18px 14px; }
 .onboarding-guide article h2 { font-size:18px; }
 .connection-page .connection-steps { gap:10px 7px; }
}
@media print {
 .onboarding-guide .guide-actions,.onboarding-guide-nav,.onboarding-guide-header > a:last-child,.onboarding-guide-footer,.onboarding-guide .dfy-mood-corner { display:none!important; }
 .onboarding-guide { max-width:none; padding:0; }
 .onboarding-guide article { break-inside:avoid; border-color:#b8bec8; }
 .onboarding-guide-intro { box-shadow:none; }
 .onboarding-guide .guide-admin-command:not([open]) > *:not(summary) { display:block; }
}