.onboarding{--onb-accent:#f49f99;z-index:150;background:var(--bg);color:var(--ink);width:100%;padding:max(28px, env(safe-area-inset-top)) 16px max(28px, env(safe-area-inset-bottom));flex-direction:column;display:flex;position:fixed;inset:0;overflow:auto}.onboarding-sleep{--onb-accent:#6185a8}.onboarding-close{width:40px;color:inherit;background:0 0;border:0;flex:0 0 40px;place-items:center;margin-left:-8px;display:grid}.onboarding-heading{margin:28px 0 0;animation:.28s ease-out onboarding-heading-in}.onboarding-heading h1{white-space:pre-line;letter-spacing:-.5px;margin:0;font-family:system-ui,sans-serif;font-size:clamp(26px,7.8vw,32px);font-weight:750;line-height:1.32}.onboarding-heading h1 em{color:#f49f99;font-style:normal}.onboarding-heading p{color:var(--muted);margin:15px 0 0;font-size:16px;line-height:1.35}.onboarding-content{flex:1 1 0;place-items:center;min-height:225px;margin:18px 0;display:grid;position:relative}.onboarding-art{width:min(100%,330px);height:100%;max-height:470px;position:relative}.onboarding-glow{filter:blur(8px);background:radial-gradient(at 35% 40%,#ffe3a280,#ffc3b070 50%,#0000 70%);border-radius:50%;transition:opacity .5s;position:absolute;inset:25% 8% 15%}.onboarding-axis{opacity:0;background:#f49f9950;width:2px;transition:opacity .5s;position:absolute;top:0;bottom:0;left:22%}.onboarding-orbit{left:var(--x);top:var(--y);width:var(--w);height:var(--h);transition:left .6s cubic-bezier(.22,1,.36,1),top .6s cubic-bezier(.22,1,.36,1),height .6s,width .6s,opacity .3s;position:absolute;transform:translate(-50%,-50%)}.onboarding-orb{background:radial-gradient(ellipse at 40% 55%, color-mix(in srgb, var(--orb-color) 55%, white), var(--orb-color) 76%);color:#fff;border-radius:100px;place-items:center;width:100%;height:100%;min-height:34px;display:grid}.onboarding-art-label{opacity:0;flex-direction:column;width:190px;font-size:14px;transition:opacity .3s;display:flex;position:absolute;top:50%;left:calc(100% + 24px);transform:translateY(-50%)}.onboarding-art-label small{color:var(--muted);font-size:10px}.onboarding-art-label strong{font-weight:650}.as-timeline .onboarding-glow,.as-timeline .decoration-orbit{opacity:0}.as-timeline .onboarding-axis,.as-timeline .onboarding-art-label{opacity:1}.as-timeline .task-orbit{left:22%;top:var(--ty);width:14%;height:var(--th)}.onboarding-footer{text-align:center;flex:none;padding:0 16px}.onboarding-footer p{color:var(--muted);margin:0 0 16px;font-size:14px;line-height:1.35}.onboarding-primary{background:var(--onb-accent);color:#fff;border:0;border-radius:8px;width:100%;min-height:52px;padding:10px 12px;font-size:20px;font-weight:700;box-shadow:0 4px 5px #0002}.onboarding-primary:disabled,.onboarding-close:disabled{opacity:.55}.onboarding-skip{color:var(--muted);background:0 0;border:0;padding:0 4px 24px;font-size:20px;font-weight:700}.onboarding-time{--accent:var(--onb-accent);width:min(100%,320px)}.onboarding-time .time-wheel-frame{background:0 0}.onboarding-time .time-wheel-selection{border-radius:8px;width:80%;height:48px;top:71px;box-shadow:0 4px 5px #0002}.onboarding-notification-art{width:min(85%,300px);height:230px;position:relative}.onboarding-bell{color:#eaaa00;position:absolute;top:22px;left:40px;transform:rotate(24deg)}.onboarding-notification-pill{background:#aac3d1;border-radius:28px;align-items:center;gap:6px;width:125px;height:40px;padding:10px;display:flex;position:absolute;top:75px;right:0}.onboarding-notification-pill i{background:#6185a8;border-radius:8px;width:58px;height:9px}.onboarding-notification-pill i+i{width:25px}.onboarding-notification-pill b{background:#ff9e74;border-radius:50%;width:22px;height:22px;position:absolute;top:-6px;right:-2px}.onboarding-rays{color:#b99add;font-size:42px;position:absolute;bottom:0;left:20px}@keyframes onboarding-heading-in{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}@media (min-width:600px){.onboarding{padding-left:max(16px,50vw - 250px);padding-right:max(16px,50vw - 250px)}}@media (max-height:750px){.onboarding{padding-top:12px;padding-bottom:16px}.onboarding-heading{margin-top:12px}.onboarding-heading h1{font-size:27px}.onboarding-content{min-height:170px;margin:14px 0}.onboarding-footer p{margin-bottom:12px;font-size:12px}}@media (prefers-reduced-motion:reduce){.onboarding *{transition:none!important;animation:none!important}}.onboarding .onboarding-primary:hover:not(:disabled){background:var(--onb-accent)}.onboarding .onboarding-close:hover:not(:disabled),.onboarding .onboarding-skip:hover:not(:disabled){background:0 0}.onboarding-time .time-wheel [role=option]{font-size:17px}
