/* StayOne account onboarding: interests screen and getting-started dashboard. */
.ob-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 26px; box-shadow: 0 9px 30px #14213b05; }
.ob-card h2 { margin: 0 0 6px; }
.ob-interests { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 24px; align-items: start; padding: 24px 0 48px; }
.ob-start { position: sticky; top: 16px; border-top: 5px solid #ef9bb5; }
.ob-start button { width: 100%; margin-top: 8px; }
.ob-picked { padding-left: 20px; margin: 12px 0; }
.ob-fine { font-size: 13px; color: var(--muted); margin: 10px 0 0; }
.ob-group { border: 0; border-top: 1px solid var(--line); padding: 12px 0 4px; margin: 0; }
.ob-group legend { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 700; padding: 0; }
.ob-pick { display: flex; gap: 12px; align-items: flex-start; font-weight: 500; margin: 10px 0; }
.ob-pick input { width: 22px; height: 22px; margin-top: 2px; flex: none; }
.ob-pick span { display: grid; }
.ob-pick small { margin: 0; }
.ob-head { padding: 20px 0 8px; max-width: 760px; }
.ob-head h1 { margin: 4px 0 8px; }
.ob-progress { font-weight: 700; margin: 0 0 8px; }
.ob-bar { height: 10px; border-radius: 6px; background: #e3e8f2; overflow: hidden; margin-bottom: 12px; }
.ob-bar span { display: block; height: 100%; background: var(--blue); transition: width .3s ease; }
.ob-home { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr); gap: 24px; align-items: start; padding-bottom: 48px; }
.ob-sections { display: grid; gap: 12px; }
.ob-section { background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.ob-section > summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; cursor: pointer; list-style: none; min-height: 56px; }
.ob-section > summary::-webkit-details-marker { display: none; }
.ob-section > summary::before { content: "▸"; color: var(--muted); margin-right: 2px; }
.ob-section[open] > summary::before { content: "▾"; }
.ob-titles { display: grid; flex: 1; }
.ob-titles strong { font-size: 17px; }
.ob-meta { margin: 2px 0 0; }
.ob-pill { border-radius: 999px; padding: 3px 10px; font-size: 13px; font-weight: 700; white-space: nowrap; background: #eef1f7; color: #3c4a63; }
.ob-pill.in_progress { background: #fff4dc; color: #7a5300; }
.ob-pill.complete { background: #e5f4e9; color: #1d6b35; }
.ob-form { padding: 4px 20px 20px; border-top: 1px solid var(--line); }
.ob-field { margin: 14px 0 0; }
.ob-field label { margin: 0; }
.ob-field small { display: block; margin-top: 4px; }
.ob-optional { color: var(--muted); font-weight: 400; }
.ob-form > button { margin-top: 16px; }
.ob-check { display: flex; gap: 10px; align-items: flex-start; font-weight: 500; margin: 14px 0 0; }
.ob-check input { width: 20px; height: 20px; flex: none; margin-top: 2px; }
.ob-radios { border: 0; padding: 0; margin: 14px 0 0; }
.ob-radios legend { font-weight: 600; font-size: 14px; padding: 0; }
.ob-radios .ob-check { margin-top: 8px; }
.ob-logo { max-width: 180px; max-height: 90px; object-fit: contain; display: block; background: #f6f8fc; border-radius: 8px; padding: 8px; margin-top: 14px; }
.ob-side .ob-card { position: sticky; top: 16px; }
.ob-svc { border-top: 1px solid var(--line); padding: 12px 0; }
.ob-svc p { margin: 4px 0 8px; font-size: 14px; }
.ob-ok { color: #1d6b35; font-weight: 700; }
.ob-all { display: block; margin-top: 10px; font-weight: 700; }
@media (max-width: 800px) {
  .ob-interests, .ob-home { grid-template-columns: 1fr; padding-top: 8px; }
  .ob-start, .ob-side .ob-card { position: static; }
  .ob-card { padding: 20px 16px; }
  .ob-section > summary { padding: 14px 16px; }
  .ob-form { padding: 4px 16px 16px; }
}
@media (prefers-reduced-motion: reduce) { .ob-bar span { transition: none; } }
