/* One viewport; only the fields may scroll on short screens or at high zoom. */
.onboarding-page{height:100vh;height:100dvh;min-height:0;overflow:hidden;overscroll-behavior:none}
.onboarding-layout{display:grid;grid-template-columns:300px minmax(0,720px);gap:48px;width:100%;max-width:1180px;height:100%;min-height:0;margin:0 auto;padding:max(24px,env(safe-area-inset-top)) max(28px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(28px,env(safe-area-inset-left));align-items:center}
.onboarding-layout .onboarding-main{display:flex;flex-direction:column;width:100%;height:100%;max-height:720px;max-width:none;min-width:0;min-height:0;margin:0;padding:0}
.onboarding-main:focus{outline:none}
.onboarding-main .page-heading{flex-shrink:0;margin-bottom:12px;gap:10px}
.onboarding-main h1{font-size:clamp(24px,2.5vw,32px)}
.onboarding-main .lead{margin-top:7px;font-size:11px;overflow-wrap:anywhere}
.onboarding-main .journey-count{font-size:11px}
.onboarding-main .onboarding-stepper{flex-shrink:0;margin-bottom:18px}
.onboarding-main .onboarding-stepper li{padding:9px 0 12px}
.onboarding-main .journey-card{display:flex;flex-direction:column;flex:1;min-height:0;padding:24px}
.onboarding-main .journey-form{display:flex;flex-direction:column;gap:0;flex:1;min-height:0}
.journey-fields{display:flex;flex-direction:column;gap:18px;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:3px;scroll-padding-block:12px;scrollbar-width:thin}
.journey-fields:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.onboarding-main .journey-card-heading{margin:0}
.onboarding-main .journey-card-heading h2{font-size:21px;line-height:1.3}
.onboarding-main .journey-card-heading p{font-size:12px;line-height:1.6;margin-top:8px}
.onboarding-main .welcome-milestones{gap:20px;margin:0}
.onboarding-main .welcome-milestones article{gap:16px}
.onboarding-main .welcome-milestones h3{font-size:13px}
.onboarding-main .welcome-milestones p{font-size:12px;line-height:1.6;margin-top:3px}
.onboarding-main .journey-actions{flex-shrink:0;flex-wrap:nowrap;padding-top:16px;margin-top:16px;gap:12px}
.onboarding-main .journey-actions .hint{font-size:10px;max-width:180px}
.onboarding-main .journey-actions button,.onboarding-main .journey-actions .button{min-height:42px!important;padding:10px 14px!important;white-space:normal;text-align:center}
.onboarding-main .form-pair{gap:16px}
.onboarding-main .form-pair-equal{grid-template-columns:repeat(2,minmax(0,1fr))}
.onboarding-main .form-field{gap:7px}
.onboarding-main .form-field label{font-size:12px;min-height:19px}
.onboarding-main .form-field input{min-width:0;width:100%;min-height:42px}
.onboarding-main .form-field .hint{font-size:10px}
.onboarding-main .studio-recap{padding:12px 14px}
.onboarding-main .studio-initial{width:34px;height:34px;font-size:17px}
.onboarding-main .completion-card{justify-content:center;overflow:auto;flex:0 1 auto;max-height:100%;margin-block:auto}
.onboarding-main .completion-card>p{margin:12px auto}
.onboarding-main .completion-mark{margin-bottom:12px}
.onboarding-companion{display:flex;flex-direction:column;align-items:center;min-width:0;min-height:0;max-height:100%}
.onboarding-guide{width:100%;min-width:0;min-height:0}
.guide-introduction{display:flex;align-items:center;gap:8px;color:var(--accent);font:9px var(--mono);letter-spacing:.08em;margin:0 0 14px 8px}
.guide-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0}
.guide-speech{position:relative;background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px 24px;min-height:172px;box-shadow:0 4px 14px #13131604;opacity:1;transform:translateY(0);transition:opacity 180ms cubic-bezier(.23,1,.32,1),transform 180ms cubic-bezier(.23,1,.32,1)}
.guide-speech::after{content:"";position:absolute;width:18px;height:18px;bottom:-10px;left:calc(50% - 9px);border-right:1px solid var(--border);border-bottom:1px solid var(--border);background:#fff;transform:rotate(45deg)}
.guide-speech h2{font-size:21px;line-height:1.3;letter-spacing:-.035em;font-weight:600;margin:0 0 10px}
.guide-speech p{font-size:12px;line-height:1.75;color:var(--muted);margin:0}
.onboarding-page[data-guide-phase=waiting] .guide-speech,.onboarding-page[data-guide-phase=walking] .guide-speech{opacity:0;transform:translateY(6px);visibility:hidden}
.guide-character{position:relative;margin:12px auto 0;width:min(100%,36dvh);max-width:300px;isolation:isolate}
.guide-stage{position:relative;width:100%;aspect-ratio:1}
.guide-ground{position:absolute;bottom:12%;left:23%;width:54%;height:7%;border-radius:50%;background:radial-gradient(ellipse,#13131626 0%,#13131608 55%,transparent 72%);z-index:-1}
.onboarding-mascot-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.guide-stage:not([data-state=ready]){visibility:hidden}
.guide-status{text-align:center;font-size:10px;line-height:1.6;color:var(--muted);margin:0 0 5px}
.guide-controls{display:flex;justify-content:center;align-items:center;gap:10px;font-size:11px;color:var(--faint);flex-wrap:wrap}
.onboarding-page .guide-controls button,.onboarding-page .guide-toggle{min-height:28px;border:0;border-radius:3px;background:transparent;color:var(--muted);padding:5px 0;font:10px Geist,system-ui,sans-serif;line-height:1.5;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.onboarding-page .guide-toggle{margin-top:3px;color:var(--faint);text-decoration:none}
.onboarding-page .guide-controls button:disabled{cursor:default;text-decoration:none;opacity:.65}
.guide-toggle:focus-visible,.guide-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.onboarding-page button,.onboarding-page .button{touch-action:manipulation;user-select:none;-webkit-user-select:none}
.onboarding-page button:active{filter:brightness(.9)}
.onboarding-page[data-guide-hidden=true] .onboarding-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);max-width:820px;gap:8px}
.onboarding-page[data-guide-hidden=true] .onboarding-companion{align-items:flex-end}
.onboarding-page [hidden]{display:none!important}
@media(hover:hover) and (pointer:fine){.onboarding-page .guide-controls button:hover,.onboarding-page .guide-toggle:hover{background:transparent;color:var(--ink)}}
@media(max-width:1050px) and (min-width:761px){.onboarding-layout{grid-template-columns:240px minmax(0,1fr);gap:28px;padding:24px}.guide-speech{padding:18px;min-height:172px}.guide-speech h2{font-size:19px}.onboarding-main .journey-card{padding:20px}}
@media(max-height:690px) and (min-width:761px){.onboarding-layout{padding-block:18px}.onboarding-main .journey-card{padding:20px}.journey-fields{gap:14px}.onboarding-main .welcome-milestones{gap:14px}.guide-introduction{margin-bottom:10px}.guide-speech{min-height:150px;padding:18px}.guide-character{width:min(100%,33dvh)}}
@media(max-width:760px){
 .onboarding-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:16px;padding:max(14px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
 .onboarding-companion{width:100%;position:relative}
 .onboarding-guide{display:grid;grid-template-columns:minmax(0,1fr) 120px;align-items:center;gap:0 10px}
 .guide-introduction,.guide-status{display:none}
 .guide-speech{grid-column:1;grid-row:1;border-radius:12px;padding:14px 16px;min-height:0}
 .guide-speech h2{font-size:18px;margin-bottom:6px}
 .guide-speech p{font-size:11px;line-height:1.6}
 .guide-speech::after{left:auto;right:-7px;bottom:calc(50% - 7px);width:12px;height:12px;transform:rotate(-45deg)}
 .guide-character{grid-column:2;grid-row:1;margin:0;width:120px}
 .guide-controls{grid-column:1/-1;margin-top:4px}
 .onboarding-page .guide-toggle{position:absolute;right:0;bottom:0;font-size:9px;min-height:24px}
 .guide-controls{justify-content:flex-start;padding-right:90px}
 .onboarding-page .guide-controls button{font-size:9px;min-height:24px}
 .onboarding-main .page-heading{margin-bottom:6px}
 .onboarding-main h1{font-size:24px}
 .onboarding-main .lead{font-size:10px;margin-top:4px}
 .onboarding-main .onboarding-stepper{margin-bottom:12px}
 .onboarding-main .onboarding-stepper li{padding:6px 0 9px}
 .onboarding-main .journey-card{padding:16px}
 .onboarding-main .journey-card-heading h2{font-size:18px}
 .onboarding-main .journey-card-heading p{font-size:11px;margin-top:5px}
 .journey-fields{gap:12px}
 .onboarding-main .welcome-milestones{gap:12px}
 .onboarding-main .welcome-milestones h3{font-size:12px}
 .onboarding-main .welcome-milestones p{font-size:11px}
 .onboarding-main .form-pair{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .onboarding-main .form-field input{font-size:16px;min-height:40px}
 .onboarding-main .journey-actions{margin-top:12px;padding-top:12px;gap:10px}
 .onboarding-main .journey-actions button,.onboarding-main .journey-actions .button{font-size:11px!important;padding:8px 12px!important}
 .onboarding-main .journey-actions .hint{font-size:9px}
 .onboarding-page[data-guide-hidden=true] .onboarding-companion{min-height:24px}
}
@media(max-width:480px){.onboarding-guide{grid-template-columns:minmax(0,1fr) 94px;gap:0 6px}.guide-character{width:94px}.guide-speech{padding:12px}.guide-speech h2{font-size:16px}.guide-speech p{font-size:11px}.onboarding-main .form-pair{grid-template-columns:1fr}.onboarding-main .form-field label{font-size:11px}.onboarding-main .welcome-milestones article{gap:10px}}
@media(prefers-reduced-motion:reduce){.onboarding-guide *{scroll-behavior:auto;animation:none;transition:none}.guide-speech{transform:none!important}}

/* Financial onboarding stays in the same full-page guided journey. */
.connect-summary{display:grid;gap:10px;padding:16px;background:var(--panel);border-radius:8px}
.connect-summary>div{display:flex;justify-content:space-between;gap:16px;font-size:12px}
.connect-summary span{color:var(--muted)}.connect-summary strong{font-weight:550;overflow-wrap:anywhere;text-align:right}
.connect-entity{padding:0;border:0;display:grid;gap:10px;min-width:0}
.connect-entity legend{font-size:12px;font-weight:550;margin-bottom:10px}
.journey-form .connect-entity label{justify-content:flex-start;font-size:12px;line-height:1.5}
.journey-form .connect-entity input{width:17px;height:17px;min-height:17px;flex-shrink:0;accent-color:var(--accent)}
.connect-refresh{border:0;padding:0;background:transparent;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer}
.studio-details+.studio-details{margin-top:20px}
@media(max-width:480px){.onboarding-stepper li{gap:5px}.onboarding-stepper strong{font-size:10px}.onboarding-stepper li>span{width:20px;height:20px}}
