/* A single frame for all seven chapters. Only the copy region scrolls. */
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro]{--dialog-primary:#172b37;--dialog-primary-ink:#fff;height:min(700px,calc(var(--app-viewport-height) - var(--app-safe-top) - var(--app-safe-bottom) - 24px));padding:0;border:0;border-radius:28px;background:#fff;color:#172b37;box-shadow:0 28px 100px #071e3b40;color-scheme:light}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .app-dialog-content{display:flex;flex-direction:column;height:100%;max-height:none;padding:0;overflow:hidden;scrollbar-gutter:auto;flex:1;min-height:0}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .dialog-close{position:absolute;z-index:5;top:12px;right:12px;width:32px;height:32px;min-width:32px;border:0;border-radius:50%;background:#ffffff14;color:#dceaff;font-size:24px;line-height:1;padding:0}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] #dialog-title{order:2;flex:none;display:flex;align-items:center;min-height:84px;margin:0;padding:16px 24px 8px;color:#172b37;font:900 25px/1.13 Nunito,Arial,sans-serif;letter-spacing:-.65px;text-align:left}
.intro-hero{order:1;position:relative;flex:0 0 218px;overflow:hidden;color:#b3d8ff;background:radial-gradient(ellipse at 78% 22%,#49608c55 0%,transparent 46%),linear-gradient(135deg,#080f22,#172747 62%,#122039);border-radius:28px 28px 0 0;isolation:isolate}
.intro-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#b0d5ff0a 1px,transparent 1px),linear-gradient(90deg,#b0d5ff0a 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(transparent,#0009)}
.intro-brand{position:absolute;top:20px;left:24px;z-index:2;color:#e0edff;font:900 11px/1.15 Nunito,sans-serif;letter-spacing:1.7px}
.intro-brand>span{display:block;margin-top:5px;font-size:6px;font-weight:800;letter-spacing:1px;opacity:.65}
.intro-space-art{display:block;position:absolute;bottom:-5px;left:50%;width:360px;max-width:100%;height:200px;transform:translateX(-50%)}
.intro-moon{filter:drop-shadow(0 0 18px #f8e8ab30)}
.intro-gram{position:absolute;top:50px;left:34%;width:48px;height:48px;transform:rotate(-14deg);filter:drop-shadow(0 0 10px #30a1f538);pointer-events:none;user-select:none}
.intro-redo-seat{position:absolute;bottom:18px;left:22px;z-index:2;min-width:108px;text-align:center}
.intro-redo{position:absolute;bottom:calc(100% - 7px);left:50%;width:104px;height:104px;object-fit:contain;transform:translateX(-50%);filter:drop-shadow(0 7px 6px #0005);pointer-events:none;user-select:none}
.intro-sticker{position:relative;display:block;padding:8px 10px;border:1px solid #bfe5ff99;border-radius:7px;background:#d3eeff;color:#17304e;font:900 9px/1 Nunito,sans-serif;letter-spacing:1px;transform:rotate(-7deg);box-shadow:0 4px 12px #02081555}
.intro-orbit-icon{position:absolute;right:25px;bottom:24px;display:grid;place-items:center;width:45px;height:42px;border:1px solid #d1e6ff42;border-radius:12px;background:#e0eeff12;font-size:25px;transform:rotate(12deg);box-shadow:0 7px 16px #0002}
.intro-hero[data-chapter="1"],.intro-hero[data-chapter="5"]{background:radial-gradient(ellipse at 78% 22%,#6d618a4d,transparent 46%),linear-gradient(135deg,#0b1024,#222341)}
.intro-hero[data-chapter="2"],.intro-hero[data-chapter="6"]{background:radial-gradient(ellipse at 78% 22%,#3f777b40,transparent 46%),linear-gradient(135deg,#09131f,#18313d)}
.intro-hero[data-chapter="3"]{background:radial-gradient(ellipse at 78% 22%,#496a9b4d,transparent 46%),linear-gradient(135deg,#0a1024,#182c4a)}
.intro-hero[data-chapter="4"]{background:radial-gradient(ellipse at 78% 22%,#67598b55,transparent 46%),linear-gradient(135deg,#100e24,#2a2343)}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .intro-copy{order:3;flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#bfdae6 transparent;padding:4px 24px 12px;scroll-padding-block:8px;color:#536775;outline-offset:-3px}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .intro-copy>p{margin:0 0 12px;color:inherit;font:600 14px/1.55 Nunito,Arial,sans-serif;letter-spacing:0}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .intro-copy>p:last-child{margin-bottom:0}
.intro-footer{order:4;flex:none;padding:14px 24px 22px;background:#fff;border-top:1px solid #edf3f6}
.intro-step-label{display:flex;align-items:center;justify-content:space-between;color:#3f6e83;font:800 10px/1.4 Nunito,Arial,sans-serif;letter-spacing:.3px}
.intro-step-label small{font:inherit;color:#99adb8}
.intro-progress{display:flex;gap:5px;margin-top:10px}
.intro-progress>i{flex:1;height:4px;border-radius:3px;background:#e8f0f4}
.intro-progress>i.is-complete{background:#1aaeeb}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions{display:grid;grid-template-columns:1fr 1.65fr;gap:12px;margin:18px 0 0}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions>button{min-width:0;min-height:48px;border:0;border-radius:15px;font:800 14px/1 Nunito,Arial,sans-serif;cursor:pointer;padding:14px 10px;box-shadow:none}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions>.intro-next{display:flex;align-items:center;justify-content:center;gap:18px;background:#172b37;color:#fff}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions>.button-secondary{background:#f0f6f9;color:#4c6b7b}
html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions>.intro-skip{background:transparent;color:#81949e;font-weight:700}
.intro-rocket-float{animation:intro-float 3s ease-in-out infinite;transform-origin:center}
.intro-flame{animation:intro-flame .6s ease-in-out infinite alternate;transform-origin:0 36px}
@keyframes intro-float{50%{transform:translate(2px,-5px)}}
@keyframes intro-flame{to{transform:scaleY(.87)}}
@media(max-height:740px){.intro-hero{flex-basis:176px}.intro-space-art{height:172px;width:310px;left:54%}.intro-brand{top:18px;left:20px}.intro-gram{top:39px;left:37%;width:40px;height:40px}.intro-orbit-icon{right:21px;bottom:17px}.intro-redo-seat{bottom:15px;left:18px}.intro-redo{width:84px;height:84px}html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] #dialog-title{min-height:76px;font-size:23px;padding-inline:22px}.intro-footer{padding:12px 22px 18px}}
@media(max-height:580px){.intro-hero{flex-basis:110px}.intro-space-art{height:135px;width:244px;left:62%;bottom:-20px}.intro-brand{top:12px;left:18px;font-size:9px}.intro-brand>span{display:none}.intro-gram{top:24px;left:40%;width:34px;height:34px}.intro-redo-seat{bottom:12px;min-width:88px}.intro-redo{width:56px;height:56px}.intro-sticker{font-size:7px;padding:6px 8px}.intro-orbit-icon{display:none}html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] #dialog-title{min-height:64px;font-size:21px;padding-top:12px}.intro-footer{padding-top:10px;padding-bottom:14px}html[data-look] body[data-mode=mobile][data-screen] #dialog[data-kind=intro] .business-intro-actions{margin-top:12px}.intro-progress{margin-top:6px}}
@media(prefers-reduced-motion:reduce){.intro-rocket-float,.intro-flame{animation:none}}