/* First-run account setup (ui-next/account-onboarding.js): one card, three rows of icon tiles. */
.onb-view{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:28px 20px 32px}
.onb{width:min(920px,100%);display:flex;flex-direction:column}
.onb-card{width:100%;margin:clamp(24px,6vh,64px) auto 0;padding:34px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 18px 50px rgba(77,65,111,.1);animation:onb-arrive .32s ease-out both}
@keyframes onb-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.onb-title{margin:6px 0 0;font-size:28px;line-height:1.15;letter-spacing:-.03em;font-weight:700;color:var(--ink);text-wrap:balance}
.onb-title:focus,.onb-title:focus-visible{outline:none;box-shadow:none}
.onb-sub{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.5}

.onb-rows{display:grid;gap:14px;margin-top:26px}
.onb-row{display:grid;grid-template-columns:200px minmax(0,1fr);gap:8px 18px;align-items:start;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);transition:border-color .16s,background .16s}
.onb-row.is-answered{border-color:#ddd3ea;background:#fcfbfe}
.onb-row-label{display:grid;gap:3px;padding-top:7px}
.onb-row-label strong{font-size:14px;line-height:1.3;font-weight:650}
.onb-row-label small{color:var(--muted);font-size:12px}
.onb-options{display:flex;flex-wrap:wrap;gap:8px;min-width:0}

.onb-option{appearance:none;display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:12px;padding:6px 14px 6px 6px;font:inherit;font-size:13px;font-weight:600;line-height:1.2;text-align:left;cursor:pointer;transition:border-color .12s,background .12s,color .12s,box-shadow .12s}
.onb-option-icon{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:9px;background:var(--brand-soft);color:var(--brand-deep);transition:background .12s,color .12s}
.onb-icon{display:block;width:17px;height:17px}
.onb-option:hover{border-color:var(--brand-hover);background:var(--brand-soft)}
.onb-option:hover .onb-option-icon{background:var(--surface)}
.onb-option.is-selected,.onb-option[aria-checked="true"]{border-color:var(--brand-deep);background:var(--brand-deep);color:#fff;box-shadow:0 6px 16px rgba(77,65,111,.18)}
.onb-option.is-selected .onb-option-icon,.onb-option[aria-checked="true"] .onb-option-icon{background:rgba(255,255,255,.16);color:#fff}
.onb-option:focus-visible{outline:2px solid var(--brand-deep);outline-offset:2px}
.onb-option.onb-other{border-style:dashed;color:var(--brand-deep)}
.onb-option.onb-other .onb-option-icon{background:transparent;border:1px dashed var(--brand-hover)}
.onb-other-input{flex:1 1 200px;min-width:0;min-height:46px;border:1px solid var(--brand-deep);border-radius:12px;padding:8px 14px;font:inherit;font-size:13px;color:var(--ink);background:var(--surface);outline:0}
.onb-other-input:focus{border-color:var(--brand-deep);box-shadow:0 0 0 3px var(--focus-ring)}

.onb-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:24px}
.onb-hint{flex:1;margin:0;color:var(--muted);font-size:13px;text-align:right}
.onb-hint:empty{display:none}
.onb-continue{min-width:140px;min-height:44px;border-radius:12px}
/* Uses the design-system primary button; disabled reads as waiting, not broken. */
.onb .btn.primary.onb-continue:disabled{opacity:1;background:#EEEAF4;color:#7A7385;box-shadow:inset 0 0 0 1px var(--line);cursor:not-allowed}
.onb-skip{border:0;background:none;color:var(--brand-deep);font:inherit;font-size:13px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:8px 4px;white-space:nowrap}
.onb-skip:hover{color:var(--brand-strong)}

.onb-view .preference-account{margin-top:20px}

@media(max-width:760px){
  .onb-view{padding:18px 16px 24px}
  .onb-card{padding:24px 20px}
  .onb-title{font-size:24px}
  .onb-row{grid-template-columns:1fr;padding:14px}
  .onb-row-label{padding-top:0}
  .onb-footer{flex-direction:column-reverse;align-items:stretch}
  .onb-hint{text-align:center}
  .onb-continue{width:100%}
  .onb-skip{text-align:center}
}
@media(prefers-reduced-motion:reduce){.onb-card{animation:none}.onb-option,.onb-row{transition:none}}