/* First-run onboarding (/welcome) and the dashboard setup plan */
.ob-page { margin: 0; background: #f5f7fa; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; color: #182235; }
.ob-wrap { max-width: 760px; margin: 0 auto; padding: 24px 16px 48px; box-sizing: border-box; }
.ob-wrap h1 { font-size: 28px; line-height: 1.2; margin: 4px 0 8px; }
.ob-kicker { margin: 0 !important; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #1d4ed8; }
.ob-carried { background: #eef2ff; border-left: 3px solid #6366f1; padding: 6px 10px; font-size: 14px; }
.ob-q { border: 0; padding: 0; margin: 26px 0 0; min-width: 0; }
.ob-q legend { font-weight: 700; font-size: 17px; padding: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ob-num { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #17263c; color: #fff; font-size: 13px; }
.ob-optional { font-weight: 400; font-size: 13px; color: #526174; }
.ob-sub { font-weight: 600; font-size: 14px; margin: 14px 0 6px !important; }
.ob-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; margin-top: 10px; }
.ob-options.ob-compact { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.initiative-assistant .ob-option { display: flex !important; align-items: flex-start; gap: 10px; margin: 0 !important; padding: 12px; border: 1px solid #c9d3df; border-radius: 10px; background: #fff; cursor: pointer; font-weight: 500 !important; font-size: 15px !important; line-height: 1.35; }
.ob-compact .ob-option { padding: 9px 10px; font-size: 14px !important; }
.ob-option input { margin: 2px 0 0 !important; width: auto !important; flex: 0 0 auto; display: inline-block !important; accent-color: #17263c; }
.ob-option:has(input:checked) { border-color: #17263c; background: #f1f5fb; box-shadow: inset 0 0 0 1px #17263c; }
.ob-option:has(input:disabled) { opacity: .5; cursor: not-allowed; }
.ob-option:has(input:focus-visible) { outline: 3px solid #2563eb; outline-offset: 2px; }
.initiative-assistant .ob-text { margin-top: 16px !important; }

.ob-steps { list-style: none; padding: 0; margin: 18px 0; counter-reset: step; }
.ob-step { border: 1px solid #dde4ec; border-radius: 12px; padding: 14px 16px 12px 56px; margin: 10px 0; position: relative; background: #fff; counter-increment: step; }
.ob-step::before { content: counter(step); position: absolute; left: 16px; top: 14px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #17263c; color: #fff; font-weight: 700; font-size: 14px; }
.ob-step.is-done::before { content: "✓"; background: #16a34a; }
.ob-step.is-next { border: 2px solid #17263c; }
.ob-step h3, .ob-step h4 { margin: 0 0 2px !important; font-size: 17px; overflow-wrap: anywhere; }
.ob-step .ob-why { margin: 6px 0 !important; }
.ob-step ul { margin: 6px 0; padding-left: 18px; font-size: 14px; color: #334155; }
.ob-step li { margin: 2px 0; }
.ob-step .ob-meta { font-size: 13px; color: #526174; }
.ob-tag { display: inline-block; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 1px 8px; margin-left: 6px; background: #dbeafe; color: #1e3a8a; vertical-align: 2px; }
.ob-tag.ob-done { background: #dcf5e4; color: #14532d; }
.ob-later-h { font-size: 16px; margin: 18px 0 6px; }
.ob-later { padding-left: 18px; font-size: 14px; }
.ob-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0 8px; }
.ob-actions button { margin: 0 !important; }
a.ob-primary, a.ob-step-cta { display: inline-block; background: #17263c; color: #fff !important; text-decoration: none !important; padding: 10px 16px; border-radius: 8px; font-weight: 600; }
a.ob-step-cta { padding: 7px 12px; font-size: 14px; margin-top: 4px; }
.ob-step:not(.is-next) a.ob-step-cta { background: #fff; color: #17263c !important; border: 1px solid #17263c; }
a.ob-secondary { color: #1d4ed8; padding: 10px 6px; }

/* Dashboard card */
.setup-plan .ob-step { padding-top: 10px; padding-bottom: 10px; }
.setup-plan .ob-step::before { top: 10px; }
.setup-plan details summary { cursor: pointer; font-weight: 600; font-size: 15px; overflow-wrap: anywhere; }
.setup-progress { height: 8px; background: #e7ecf3; border-radius: 999px; overflow: hidden; margin: 8px 0 4px; }
.setup-progress span { display: block; height: 100%; background: #16a34a; border-radius: 999px; }

@media (max-width: 640px) {
  .ob-wrap h1 { font-size: 23px; }
  .ob-options { grid-template-columns: 1fr; }
  .ob-step { padding-left: 50px; }
  .ob-step::before { left: 12px; }
}
