.onboarding{z-index:10;position:relative}.onboarding{--ob-ground:var(--color-ground);--ob-surface:var(--color-surface);--ob-raised:var(--color-container-high);--ob-input:var(--color-ground);--ob-ink:var(--color-ink);--ob-secondary:var(--color-ink-2);--ob-muted:var(--color-ink-3);--ob-dim:var(--color-outline);--ob-outline:var(--color-outline-faint);--ob-emphasis:var(--color-outline);--ob-action:var(--color-primary);--ob-action-ink:var(--color-primary);--ob-action-on:var(--color-primary-on);--ob-action-wash:var(--color-primary-wash);--ob-working:var(--color-work);--ob-error:var(--color-error);--ob-error-wash:var(--color-error-wash);--ob-focus:var(--color-primary);--font-body:var(--t-font-sans);--font-heading:var(--t-font-display)}.onboarding *{box-sizing:border-box}.onboarding [hidden]{display:none!important}.onboarding{color:var(--ob-ink);font:15px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;background:0 0;margin:0}.onboarding a{color:inherit;text-decoration:none}.onboarding a:hover{color:var(--ob-ink)}.onboarding button,.onboarding input{font:inherit}.onboarding button,.onboarding .button{cursor:pointer}.onboarding button:disabled{cursor:wait;opacity:.6}.onboarding :focus-visible{outline:2px solid var(--ob-focus);outline-offset:5px}.onboarding .success-state:focus-visible{outline:none}.onboarding ::selection{background:var(--ob-action);color:var(--ob-ink)}.onboarding .page-shell{flex-direction:column;max-width:1440px;min-height:100svh;margin:auto;padding:0 64px;display:flex}.onboarding .page-header{justify-content:space-between;align-items:center;gap:24px;min-height:112px;display:flex}.onboarding .brand{font:800 20px/1.1 var(--font-heading);letter-spacing:-.3px;align-items:center;gap:12px;display:inline-flex}.onboarding .brand-mark{width:40px;height:40px}.onboarding .header-note{color:var(--ob-muted);font-size:12px}.onboarding .onboarding-layout{border:1px solid var(--ob-outline);border-radius:var(--radius-xl);background:color-mix(in oklab, var(--ob-ground) 70%, transparent);box-shadow:var(--shadow-raise);flex:1;grid-template-columns:1.1fr 1fr;align-items:stretch;margin:24px 0;display:grid;overflow:hidden}.onboarding .story{flex-direction:column;min-width:0;padding:48px 48px 32px;display:flex}.onboarding .eyebrow{color:var(--ob-muted);font:750 11px/1.6 var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);letter-spacing:1.6px;align-items:center;gap:12px;display:flex}.onboarding .small-rule{background:var(--ob-action);width:24px;height:3px;box-shadow:0 0 10px var(--ob-action);border-radius:3px}.onboarding .story h2{font:900 clamp(36px, 4.3vw, 60px)/1.06 var(--font-heading);letter-spacing:-1.2px;word-spacing:.04em;text-wrap:balance;margin:28px 0 20px}.onboarding .soft-ink{color:var(--ob-action)}.onboarding p{text-wrap:pretty}.onboarding .story-copy{color:var(--ob-secondary);margin:0;font-size:14px}.onboarding .story-art{margin:auto 0 24px;padding-top:32px}.onboarding .frame-caption,.onboarding .frame-time,.onboarding .frame-label,.onboarding .track-name{font:750 10px/1.4 var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);letter-spacing:1px;color:var(--ob-muted)}.onboarding .frame-caption{justify-content:space-between;margin-bottom:12px;display:flex}.onboarding .viewfinder{border-radius:var(--radius-lg);box-shadow:var(--shadow-raise);position:relative;overflow:hidden}.onboarding .frame-drawing{width:100%;display:block}.onboarding .art-sky{fill:var(--c-art-sky)}.onboarding .art-far{fill:var(--c-art-far)}.onboarding .art-mid{fill:var(--c-art-mid)}.onboarding .art-near{fill:var(--c-art-near)}.onboarding .art-sun{fill:var(--c-sun)}.onboarding .art-halo{fill:var(--c-art-halo)}.onboarding .art-star{fill:var(--c-star)}.onboarding .art-spark{fill:var(--c-spark)}.onboarding .art-planet{fill:var(--ob-action)}.onboarding .art-shade{fill:var(--ob-ground);opacity:.18}.onboarding .art-ring{fill:none;stroke:var(--c-sun);stroke-width:5px;stroke-linecap:round}.onboarding .art-play{fill:var(--ob-action-on)}.onboarding .frame-time,.onboarding .frame-label{background:color-mix(in oklab, var(--ob-ground) 72%, transparent);color:var(--ob-ink);border-radius:999px;padding:2px 8px;position:absolute;bottom:10px}.onboarding .frame-time{font-variant-numeric:tabular-nums;left:12px}.onboarding .frame-label{right:12px}.onboarding .mini-timeline{align-items:center;gap:4px;height:24px;margin-top:16px;display:flex;position:relative}.onboarding .track-name{flex-shrink:0;width:24px}.onboarding .clip{background:var(--ob-raised);border-radius:var(--radius-sm);border:1px solid var(--ob-outline);height:100%}.onboarding .clip-a{width:28%}.onboarding .clip-b{background:var(--ob-action-wash);border-color:color-mix(in oklab, var(--ob-action) 40%, transparent);width:45%}.onboarding .clip-c{flex:1}.onboarding .playhead{background:var(--ob-action-ink);width:1px;height:51px;position:absolute;top:-7px;left:48%}.onboarding .playhead:before{content:"";background:var(--ob-action-ink);border-radius:50%;width:7px;height:7px;position:absolute;left:-3px}.onboarding .audio-track{height:16px;margin-top:4px}.onboarding .waveform{opacity:.25;background:repeating-linear-gradient(90deg, var(--ob-secondary) 0 1px, transparent 1px 4px);clip-path:polygon(0 40%,4% 20%,8% 40%,12% 0,17% 30%,21% 10%,25% 35%,30% 0,35% 30%,40% 15%,45% 40%,50% 0,55% 25%,60% 10%,65% 35%,70% 0,75% 20%,80% 40%,85% 10%,90% 30%,95% 0,100% 40%,100% 60%,95% 100%,90% 70%,85% 90%,80% 60%,75% 80%,70% 100%,65% 65%,60% 90%,55% 75%,50% 100%,45% 60%,40% 85%,35% 70%,30% 100%,25% 65%,21% 90%,17% 70%,12% 100%,8% 60%,4% 80%,0 60%);flex:1;height:12px}.onboarding .story-bottom{color:var(--ob-muted);font:750 9px var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);letter-spacing:1.4px;align-items:center;gap:16px;display:flex}.onboarding .dash{background:var(--ob-emphasis);width:16px;height:1px}.onboarding .entry-panel{background:var(--ob-surface);border-left:1px solid var(--ob-outline);flex-direction:column;justify-content:center;gap:40px;min-width:0;padding:48px;display:flex}.onboarding .entry-content{width:100%;max-width:384px;margin:auto;animation:.24s cubic-bezier(.23,1,.32,1) onboarding-enter}.onboarding .entry-kicker{color:var(--ob-action-ink);font:750 11px var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);letter-spacing:1.6px;margin:0 0 24px}.onboarding .entry-icon{border:1px solid var(--ob-outline);border-radius:var(--radius-lg);background:var(--ob-raised);width:48px;height:48px;box-shadow:var(--shadow-rim);place-items:center;margin-bottom:24px;display:grid}.onboarding .entry-icon svg{width:22px;height:22px;color:var(--ob-secondary)}.onboarding h1{font:800 32px/1.15 var(--font-heading);letter-spacing:-.6px;text-wrap:balance;margin:0 0 12px}.onboarding .description{color:var(--ob-muted);margin:0 0 32px;font-size:14px}.onboarding .button{border-radius:var(--radius-md);border:1px solid #0000;justify-content:center;align-items:center;gap:12px;width:100%;min-height:48px;padding:12px 16px;font-size:14px;font-weight:600;transition:transform .14s cubic-bezier(.23,1,.32,1),filter .14s,background-color .14s,box-shadow .14s,opacity .14s;display:inline-flex}.onboarding .button:active:not(:disabled){transform:scale(.98)}.onboarding .button svg{flex-shrink:0;width:18px;height:18px}.onboarding .google-button{background:var(--color-container);color:var(--ob-ink);border-color:var(--ob-emphasis);box-shadow:var(--shadow-rim)}.onboarding .google-button:hover{background:var(--ob-raised)}.onboarding .primary-button{background:var(--ob-action);color:var(--ob-action-on);box-shadow:var(--shadow-band)}.onboarding .primary-button:hover{filter:brightness(1.1);box-shadow:var(--shadow-band), 0 0 24px var(--ob-action-wash)}.onboarding .secondary-button{color:var(--ob-secondary);border-color:var(--ob-emphasis);background:0 0}.onboarding .secondary-button:hover{background:var(--ob-raised)}.onboarding .button-arrow{margin-left:auto}.onboarding .signin-divider{font:750 10px var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);color:var(--ob-muted);align-items:center;gap:16px;margin:32px 0 24px;display:flex}.onboarding .signin-divider:before,.onboarding .signin-divider:after{content:"";background:var(--ob-outline);flex:1;height:1px}.onboarding .workspace-note{color:var(--ob-muted);gap:12px;font-size:12px;display:flex}.onboarding .workspace-note svg{flex-shrink:0;width:18px;height:18px;margin-top:2px}.onboarding .workspace-note strong{color:var(--ob-secondary);margin-bottom:4px;font-weight:550;display:block}.onboarding .workspace-note p{margin:0}.onboarding .legal-copy{color:var(--ob-muted);margin:32px 0 0;font-size:11px;line-height:1.8}.onboarding .legal-copy a,.onboarding .text-link{color:var(--ob-secondary);text-underline-offset:4px;text-decoration:underline}.onboarding .panel-footnote{text-align:center;color:var(--ob-muted);font-size:11px}.onboarding .page-footer{min-height:72px;color:var(--ob-muted);justify-content:space-between;align-items:center;gap:16px;font-size:11px;display:flex}.onboarding .page-footer nav{gap:24px;display:flex}.onboarding .page-footer a{align-items:center;min-height:44px;display:inline-flex}.onboarding .message{color:var(--ob-secondary);overflow-wrap:anywhere;margin:16px 0 0;font-size:13px}.onboarding .message:empty{display:none}.onboarding .consent-client{border:1px solid var(--ob-emphasis);border-radius:var(--radius-lg);background:var(--ob-input);overflow-wrap:anywhere;padding:20px}.onboarding .consent-client strong{font:650 24px/1.25 var(--font-heading);letter-spacing:-.5px;margin-top:8px;display:block}.onboarding .consent-client p{color:var(--ob-secondary);margin:12px 0 0;font-size:12px}.onboarding .consent-client p span{color:var(--ob-ink)}.onboarding .consent-scope{color:var(--ob-secondary);margin:24px 0 12px;font-size:13px}.onboarding .consent-permissions{gap:12px;margin:0 0 28px;padding:0;font-size:13px;list-style:none;display:grid}.onboarding .consent-permissions li{align-items:flex-start;gap:12px;display:flex}.onboarding .consent-permissions svg{width:16px;height:16px;color:var(--ob-secondary);flex-shrink:0;margin-top:2px}.onboarding .consent-cancel{margin-top:12px}.onboarding .error{color:var(--ob-error);background:var(--ob-error-wash);border-left:3px solid var(--ob-error);border-radius:var(--radius-sm);padding:12px 16px}.onboarding .step-strip{font:750 11px var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);color:var(--ob-muted);align-items:center;gap:12px;margin-bottom:36px;display:flex}.onboarding .step-strip span{align-items:center;gap:8px;display:flex}.onboarding .step-strip b{border:1px solid var(--ob-emphasis);border-radius:50%;place-items:center;width:20px;height:20px;font-size:10px;font-weight:400;display:grid}.onboarding .step-strip .current{color:var(--ob-ink)}.onboarding .current b{background:var(--ob-action-wash);border-color:var(--ob-action);color:var(--ob-action-ink)}.onboarding .step-line{background:var(--ob-emphasis);flex:1;height:1px}.onboarding .code-box{background:var(--ob-input);border:1px solid var(--ob-emphasis);border-radius:var(--radius-lg);text-align:center;margin:24px 0;padding:20px;transition:border-color .15s,box-shadow .15s}.onboarding .code-box:focus-within{border-color:var(--ob-action);box-shadow:0 0 0 3px var(--ob-action-wash)}.onboarding .code-box label{font:750 10px var(--t-font-label);font-variation-settings:"wdth" var(--t-label-width);color:var(--ob-muted);letter-spacing:1.5px;margin-bottom:12px;display:block}.onboarding .code-box input{width:100%;color:var(--ob-ink);font:500 28px/1.4 var(--t-font-mono);text-align:center;letter-spacing:4px;text-transform:uppercase;font-variant-numeric:tabular-nums;background:0 0;border:0;border-radius:2px;padding:4px 0}.onboarding .code-box input::placeholder{color:var(--ob-dim)}.onboarding .code-box p{color:var(--ob-muted);margin:8px 0 0;font-size:11px}.onboarding .device-details{margin:0 0 24px}.onboarding .device-details div{border-bottom:1px solid var(--ob-outline);justify-content:space-between;align-items:baseline;gap:20px;padding:10px 0;font-size:12px;display:flex}.onboarding .device-details dt{color:var(--ob-muted)}.onboarding .device-details dd{text-align:right;color:var(--ob-ink);overflow-wrap:anywhere;min-width:0;margin:0}.onboarding .notice{color:var(--ob-working);background:var(--ob-input);border-left:3px solid var(--ob-working);border-radius:var(--radius-sm);overflow-wrap:anywhere;margin:0 0 20px;padding:12px 16px;font-size:12px}.onboarding .pair-note{color:var(--ob-muted);margin:16px 0;font-size:11px}.onboarding .success-icon{color:var(--ob-ink);border-color:var(--ob-action);background:var(--ob-action-wash);font-size:24px}.onboarding .success-copy{color:var(--ob-secondary);margin-bottom:24px;font-size:14px}.onboarding .success-title{letter-spacing:-.7px;margin:0 0 12px;font-size:24px;line-height:1.2}.onboarding .return-link{text-align:center;min-height:44px;color:var(--ob-muted);justify-content:center;align-items:center;margin-top:12px;font-size:12px;display:flex}@media (min-width:1600px){.onboarding .onboarding-layout{flex:0 auto;min-height:760px;margin-block:auto}.onboarding .page-header,.onboarding .page-footer{flex-shrink:0}}@media (max-width:1100px){.onboarding .page-shell{padding-inline:32px}.onboarding .story,.onboarding .entry-panel{padding:32px}.onboarding .story h2{letter-spacing:-2px}.onboarding .story-bottom{gap:8px}}@media (max-width:760px){.onboarding .page-shell{max-width:560px;padding-inline:20px}.onboarding .page-header{min-height:88px}.onboarding .header-note{display:none}.onboarding .onboarding-layout{flex-direction:column;flex:none;margin:8px 0;display:flex}.onboarding .story{border-bottom:1px solid var(--ob-outline);padding:20px 28px}.onboarding .story h2{letter-spacing:-.8px;margin:16px 0 0;font-size:24px}.onboarding .story h2 br{display:none}.onboarding .story h2 .soft-ink:before{content:" "}.onboarding .story-copy,.onboarding .story-art,.onboarding .story-bottom{display:none}.onboarding .entry-panel{border-left:0;gap:32px;padding:32px 28px 24px}.onboarding .entry-content{max-width:none}.onboarding .entry-kicker{margin-bottom:20px}.onboarding h1{font-size:28px}.onboarding .entry-icon{display:none}.onboarding .description{margin-bottom:24px}.onboarding .page-footer{font-size:10px}.onboarding .page-footer nav{gap:16px}.onboarding .page-footer>span{max-width:170px}.onboarding .step-strip{margin-bottom:28px}}@media (max-width:360px){.onboarding .page-shell{padding-inline:12px}.onboarding .story,.onboarding .entry-panel{padding-inline:20px}.onboarding .code-box input{letter-spacing:2px;font-size:24px}}@media (prefers-reduced-motion:reduce){.onboarding *,.onboarding :before,.onboarding :after{transition:none!important;animation:none!important}.onboarding .button:active:not(:disabled){transform:none}}@keyframes onboarding-enter{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}