.onboarding { width:min(100% - 2rem, 980px); margin:2rem auto 4rem; color:var(--text-color-primary); }
.onboarding *, .account-flow * { box-sizing:border-box; min-width:0; }
.onboarding h1 { font-size:clamp(1.8rem,4vw,2.6rem); letter-spacing:-.035em; line-height:1.1; margin:.3rem 0 .65rem; }
.onboarding p { line-height:1.55; }
.onboarding-heading { display:flex; justify-content:space-between; gap:.75rem; align-items:start; margin-bottom:.25rem; }
.onboarding-muted, .onboarding small, .account-flow small { color:var(--text-color-secondary); line-height:1.5; }
.onboarding-status { display:inline-flex; padding:.4rem .75rem; border:1px solid var(--bg-color-quaternary); border-radius:999px; white-space:nowrap; font-size:.85rem; }
.onboarding-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.5rem; margin:0; padding:0; list-style:none; }
.onboarding-steps button { display:flex; align-items:center; gap:.625rem; width:100%; min-height:64px; text-align:left; padding:.625rem; border:1px solid var(--dm-line); border-radius:12px; background:var(--dm-bg); color:inherit; font:inherit; cursor:pointer; }
.onboarding-steps button[aria-current="step"] { border-color:var(--text-color-primary); font-weight:650; box-shadow:inset 0 0 0 1px var(--text-color-primary); }
.onboarding-step-number { display:grid; place-items:center; flex:none; width:2rem; height:2rem; border-radius:9px; background:var(--dm-hover); color:var(--dm-secondary); font-size:.75rem; font-weight:650; font-variant-numeric:tabular-nums; }
.onboarding-steps [aria-current="step"] .onboarding-step-number { background:var(--dm-button); color:var(--dm-button-text); }
.onboarding-step-label { font-size:.875rem; line-height:1.35; }
.onboarding-step-label small { display:block; font-size:.6875rem; font-weight:400; margin-top:.125rem; }
.onboarding-progress { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.onboarding-progress #ad-step-summary { margin:0; font-size:.75rem; color:var(--dm-secondary); }
.onboarding-progress progress { width:6rem; height:4px; border:0; border-radius:99px; overflow:hidden; background:var(--dm-line); color:var(--dm-button); accent-color:var(--dm-button); }
.onboarding-progress progress::-webkit-progress-bar { background:var(--dm-line); }
.onboarding-progress progress::-webkit-progress-value { background:var(--dm-button); }
.onboarding-progress progress::-moz-progress-bar { background:var(--dm-button); }
.onboarding-card { border:1px solid var(--dm-line); border-radius:16px; padding:clamp(1rem,2vw,1.5rem); background:var(--dm-bg); box-shadow:0 4px 20px #00000004; }
.onboarding-card h2 { font-size:1.4rem; font-weight:650; letter-spacing:-.02em; margin:0 0 .5rem; }
.onboarding-card h3 { font-size:1.05rem; font-weight:600; margin:1rem 0 .5rem; }
.onboarding-form label, .account-flow .field-label { display:block; font-weight:550; margin:.6rem 0 .3rem; line-height:1.4; }
.onboarding-form input:not([type=checkbox]), .onboarding-form select, .onboarding-form textarea, .account-flow input:not([type=checkbox]):not([type=radio]) { width:100%; max-width:100%; min-height:46px; padding:.7rem .8rem; border:1px solid var(--bg-color-quaternary); border-radius:10px; background:var(--bg-color-secondary); color:var(--text-color-primary); font:inherit; }
.onboarding-form textarea { resize:vertical; min-height:110px; }
.onboarding-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.625rem 1rem; align-items:start; }
.onboarding-field { margin-top:.75rem; }
.onboarding-field > label { margin-top:0; }
.onboarding-field small, .onboarding-upload small { display:block; margin-top:.25rem; font-size:.75rem; }
.onboarding-group { margin-top:1rem; }
.onboarding .onboarding-group h3 { margin:0 0 .375rem; font-size:.9375rem; }
.onboarding-contact { display:flex; align-items:stretch; gap:.5rem; }
.onboarding-contact input { flex:1; }
.onboarding-contact button { flex:none; }
.onboarding-upload { margin-top:1rem; padding:1rem; border:1px dashed var(--dm-muted); border-radius:12px; background:var(--dm-sidebar); }
.onboarding-upload label { margin-top:0; }
.onboarding #ad-services { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.25rem .75rem; }
.onboarding-check { display:flex !important; gap:.65rem; align-items:flex-start; font-weight:400 !important; }
.onboarding-check input { flex:none; width:20px; height:20px; margin:1px 0 0; accent-color:var(--text-color-primary); }
.onboarding-check small { display:block; }
.onboarding-actions { display:flex; justify-content:space-between; gap:.5rem; flex-wrap:wrap; margin-top:1rem; padding-top:1rem; border-top:1px solid var(--dm-line); }
.onboarding-actions > div { margin-left:auto; }
.onboarding-actions > div { display:flex; gap:.65rem; flex-wrap:wrap; }
.onboarding button, .account-flow button { touch-action:manipulation; }
.onboarding button:active, .account-flow button:active { opacity:.76; }
.onboarding button:disabled { cursor:wait; opacity:.55; }
.onboarding button:focus-visible, .onboarding input:focus-visible, .onboarding select:focus-visible, .onboarding textarea:focus-visible, .account-flow :focus-visible { outline:2px solid var(--text-color-primary); outline-offset:3px; }
.onboarding-message { min-height:1.25rem; margin:0; font-size:.8125rem; overflow-wrap:anywhere; }
.onboarding-message[data-error=true], .account-flow [role=alert]:not(:empty) { padding:.75rem; border-left:3px solid #bd354e; background:var(--bg-color-secondary); }
.onboarding details { margin-top:1rem; border-top:1px solid var(--bg-color-quaternary); padding-top:.8rem; }
.onboarding summary { cursor:pointer; min-height:30px; font-weight:550; }
.onboarding-hours { display:grid; grid-template-columns:minmax(95px,1fr) 1fr 1fr; gap:.4rem .75rem; align-items:center; margin-top:.65rem; }
.onboarding-hours label { margin:0; font-size:.85rem; }
.onboarding-photos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1rem; }
.onboarding-photo { border:1px solid var(--bg-color-quaternary); border-radius:12px; overflow:hidden; }
.onboarding-photo img { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; background:var(--bg-color-secondary); }
.onboarding-photo > div { padding:.6rem; display:flex; flex-wrap:wrap; gap:.45rem; }
.onboarding-photo button { border:0; background:var(--bg-color-secondary); color:inherit; padding:.55rem; border-radius:6px; cursor:pointer; font:inherit; font-size:.8rem; }
.onboarding-preview { display:grid; grid-template-columns:minmax(140px,240px) 1fr; gap:1.25rem; margin-top:1rem; }
.onboarding-preview img { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:12px; background:var(--bg-color-secondary); }
.onboarding-preview dl { margin-top:1rem; }
.onboarding-preview dl > div { display:flex; gap:1rem; justify-content:space-between; padding:.55rem 0; border-bottom:1px solid var(--bg-color-quaternary); }
.onboarding-preview dd { text-align:right; }
.onboarding-preview p { overflow-wrap:anywhere; white-space:pre-wrap; }
.onboarding-success { padding:1.2rem; border:1px solid var(--bg-color-quaternary); border-radius:14px; margin-bottom:1rem; }
.onboarding [hidden], .account-flow [hidden] { display:none !important; }
.account-flow .register-tab { max-width:520px; margin:1rem auto; padding:1.4rem; }
.account-flow .register-tab button { min-height:46px; }
.account-flow .register-title { margin-bottom:1rem; }
.account-flow .account-goals { display:grid; gap:.7rem; margin:1rem 0; }
.account-goals label { display:flex; align-items:center; gap:.75rem; padding:1rem; border:1px solid var(--bg-color-quaternary); border-radius:12px; cursor:pointer; }
.account-goals input { accent-color:var(--text-color-primary); }
.account-goals label:has(input:checked) { border-color:var(--text-color-primary); background:var(--bg-color-secondary); }
.account-flow .account-buttons { display:grid; gap:.7rem; margin-top:1rem; }
.account-flow details { margin-top:1rem; font-size:.85rem; }
.account-flow .checkbox-line { margin:.8rem 0; }
/* Override the old registration ID rules and the shared roomy page defaults. */
.apple-site-refinement body.dm-shell:not(.dm-home-page):not(.status-page) > main:is(.account-flow,.onboarding) { padding-top:5.5rem; padding-bottom:2rem; gap:.75rem; }
.apple-site-refinement body.dm-shell > main.onboarding { display:flex; flex-direction:column; }
.onboarding > * { width:100%; max-width:56rem; margin-inline:auto; }
.page-auth > main.account-flow :is(#register-tab-1,#register-tab-2) { width:100%; max-width:35rem; margin:0 auto; padding:1.5rem; gap:.75rem; align-items:stretch; border-radius:1rem; background:var(--dm-bg); box-shadow:0 6px 24px #00000005; }
.account-flow .register-title { gap:.375rem; margin:0 0 .25rem; padding:0; max-width:none; }
.account-flow :is(#register-tab-1,#register-tab-2) .register-title :is(h1,h2) { font-size:clamp(1.5rem,3vw,1.875rem); line-height:1.15; margin:0; }
.account-flow .register-title .page-eyebrow,.onboarding .onboarding-heading .page-eyebrow { font-size:.6875rem; line-height:1.5; letter-spacing:.1em; }
.account-flow .register-title p:not(.page-eyebrow) { font-size:.875rem; line-height:1.5; }
.account-flow #emailForm { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; gap:.75rem; }
.account-flow #emailForm:has([data-email-credential][hidden]) { grid-template-columns:1fr; }
.account-flow #emailForm .field-label { margin:0 0 .3rem; font-size:.8125rem; line-height:1.4; color:var(--dm-text); }
.account-flow #emailForm input { width:100%; min-height:2.75rem; padding:.625rem .75rem; font-size:1rem; line-height:1.35; border-radius:.625rem; }
.account-flow #phone-help { font-size:.75rem; line-height:1.5; }
.account-flow #register-tab-1 .checkbox-line { gap:.625rem; margin:0; padding:.25rem 0; align-items:flex-start; }
.account-flow #register-tab-1 .checkbox-line input { width:1.125rem; height:1.125rem; margin-top:.125rem; flex:none; }
.account-flow #register-tab-1 .checkbox-line label { font-size:.75rem; line-height:1.5; }
.account-flow details { margin:0; border-top:1px solid var(--dm-line); }
.account-flow details summary { display:list-item; align-content:center; cursor:pointer; min-height:2.75rem; font-size:.75rem; line-height:1.4; }
.account-flow :is(#register-error,#register-final-error):empty { display:none; }
.account-flow .account-buttons { gap:.5rem; margin:0; }
.account-flow :is(#register-tab-1,#register-tab-2) button { width:100%; min-height:2.75rem; max-width:none; margin:0; padding:.625rem .875rem; border-radius:.625rem; }
.account-divider { display:flex; align-items:center; gap:.75rem; color:var(--dm-muted); font-size:.75rem; }
.account-divider::before,.account-divider::after { content:""; height:1px; background:var(--dm-line); flex:1; }
.account-flow #register-tab-1 .already-register { width:100%; max-width:none; height:auto; min-height:2.75rem; font-size:.8125rem; }
.account-flow .account-goals { margin:0; gap:.625rem; }
.account-flow .account-goals label { padding:.875rem; line-height:1.5; }
.account-flow .account-goals input { width:1.125rem; height:1.125rem; flex:none; }
#announcement-form :is(input:not([type=checkbox]),select,textarea) { min-height:2.75rem; padding:.625rem .75rem; border-radius:.625rem; font-size:1rem; line-height:1.4; }
.onboarding .onboarding-form label { font-size:.8125rem; }
#announcement-form textarea { height:7.5rem; min-height:7rem; }
.onboarding .onboarding-form section > .onboarding-muted { margin:0 0 .875rem; font-size:.8125rem; line-height:1.5; }
.onboarding .onboarding-actions button,.onboarding .onboarding-contact button { min-height:2.75rem; padding:.625rem .875rem; font-size:.8125rem; border-radius:.625rem; }
.onboarding .onboarding-heading h1 { font-size:clamp(1.65rem,3vw,2.1rem); margin:.25rem 0 .375rem; }
.onboarding .onboarding-heading p { line-height:1.5; }
.onboarding .onboarding-heading .onboarding-muted { font-size:.875rem; }
.onboarding #announcement-message { font-size:.8125rem; line-height:1.5; }
.onboarding .onboarding-hours label { margin:0; }
.announcement-panel-entry { width:min(100% - 2rem,1100px); margin:0 auto 1.25rem; padding:1.25rem; border:1px solid var(--bg-color-quaternary); border-radius:16px; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.announcement-panel-entry h2 { font-size:1.2rem; margin-bottom:.4rem; }
.announcement-panel-entry[hidden] { display:none !important; }
@media(max-width:620px) {
 .onboarding { width:calc(100% - 1.25rem); margin-top:1.2rem; }
 .onboarding-heading { flex-direction:column; gap:.65rem; }
 .onboarding-grid { grid-template-columns:1fr; gap:.625rem; }
 .onboarding-steps { gap:.3rem; }
 .onboarding-steps button { flex-direction:column; justify-content:center; gap:.3rem; padding:.5rem .2rem; text-align:center; word-break:normal; }
 .onboarding-step-number { width:1.625rem; height:1.625rem; font-size:.6875rem; }
 .onboarding-step-label { font-size:.6875rem; }
 .onboarding-step-label small { display:none; }
 .onboarding-contact { flex-direction:column; }
 .onboarding-hours { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.375rem .625rem; }
 .onboarding .onboarding-hours > label { grid-column:1 / -1; margin-top:.375rem; }
 .onboarding #ad-prices { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .onboarding #ad-services { grid-template-columns:1fr; }
 .onboarding .onboarding-actions { flex-wrap:nowrap; align-items:stretch; gap:.5rem; }
 .onboarding .onboarding-actions > div { width:auto; flex:1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:.5rem; }
 .onboarding .onboarding-actions > #ad-back { flex:0 0 auto; }
 .onboarding .onboarding-actions button { padding:.625rem .5rem; font-size:.75rem; }
 .onboarding .onboarding-grid > .onboarding-field { margin-top:0; }
 .onboarding .onboarding-grid:has(>.onboarding-field) { margin-top:.75rem; }
 .page-auth > main.account-flow :is(#register-tab-1,#register-tab-2) { padding:1rem; gap:.625rem; }
 .account-flow #emailForm { grid-template-columns:1fr; gap:.625rem; }
 .onboarding-photos { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
 .onboarding-preview { grid-template-columns:1fr; }
 .onboarding-preview img { max-width:220px; }
 .onboarding-actions, .onboarding-actions > div { width:100%; }
 .onboarding-actions button { flex:1; min-height:46px; }
 .announcement-panel-entry { flex-direction:column; align-items:stretch; }
}
@media(prefers-reduced-motion:reduce) { .onboarding *, .account-flow * { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }