/* Scoped production onboarding; prototype-only controls removed. */
.chineo-onboarding {--blue: #2852e8; --ink: #172944; --muted: #69778b; --line: #e3e8f0; --soft: #edf2ff; --red: #b64659; --green: #267568; font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; color: var(--ink); font-synthesis: none;}
.chineo-onboarding * {box-sizing: border-box;}
.chineo-onboarding {margin: 0; background: #e9edf4;}
.chineo-onboarding button,.chineo-onboarding a {-webkit-tap-highlight-color: transparent;}
.chineo-onboarding button {font: inherit; cursor: pointer;}
.chineo-onboarding button:focus-visible,.chineo-onboarding a:focus-visible {outline: 3px solid #8faaff; outline-offset: 4px;}
.chineo-onboarding button {color: inherit;}
.chineo-onboarding svg {width: 20px; height: 20px; stroke-width: 1.7; flex-shrink: 0;}
.chineo-onboarding a {color: inherit; text-decoration: none;}
.chineo-onboarding .phone {width: min(100%,430px); min-height: 820px; margin: auto; background: #f8f9fc; border-radius: 32px; overflow: hidden; border: 1px solid white; box-shadow: 0 18px 60px #24395c13; display: flex; flex-direction: column;}
.chineo-onboarding .top {display: flex; align-items: center; justify-content: space-between; padding: 23px 25px 18px; gap: 12px;}
.chineo-onboarding .brand {font-size: 29px; letter-spacing: -1.7px; font-weight: 800; color: var(--blue); line-height: 1;}
.chineo-onboarding .brand span {color: var(--ink);}
.chineo-onboarding .icon-button {border: 0; background: transparent; padding: 8px; display: grid; place-items: center;}
.chineo-onboarding .back[hidden] {display: none;}
.chineo-onboarding .language {display: flex; align-items: center; gap: 6px; background: transparent; border: 0; font-size: 12px; padding: 9px 0; color: var(--muted); margin-left: auto;}
.chineo-onboarding .language svg {width: 16px; height: 16px;}
.chineo-onboarding .progress {display: flex; gap: 6px; margin: 0 26px 23px;}
.chineo-onboarding .progress button {border: 0; background: #e1e6ef; height: 3px; border-radius: 8px; flex: 1; padding: 0; position: relative;}
.chineo-onboarding .progress button:before {content: ""; position: absolute; inset: -9px 0;}
.chineo-onboarding .progress button.active {background: var(--blue);}
.chineo-onboarding main {padding: 0 26px; flex: 1; min-width: 0;}
.chineo-onboarding .eyebrow {font-size: 11px; font-weight: 700; letter-spacing: 1.4px; color: var(--blue); margin: 0 0 12px; display: flex; align-items: center; gap: 8px; text-transform: uppercase;}
.chineo-onboarding .eyebrow span {height: 1px; width: 22px; background: var(--blue);}
.chineo-onboarding h1 {font-size: 33px; letter-spacing: -1px; font-weight: 720; line-height: 1.25; margin: 0 0 14px; outline: none;}
.chineo-onboarding h1 em {color: var(--blue); font-style: normal;}
.chineo-onboarding .lede {font-size: 14px; line-height: 1.8; color: var(--muted); margin: 0 0 25px; max-width: 340px;}
.chineo-onboarding .demo {border: 1px solid var(--line); border-radius: 23px; background: white; overflow: hidden;}
.chineo-onboarding .demo-top {padding: 15px 18px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px;}
.chineo-onboarding .identity {display: flex; align-items: center; gap: 10px;}
.chineo-onboarding .avatar {width: 32px; height: 32px; background: var(--soft); border-radius: 50%; display: grid; place-items: center; color: var(--blue);}
.chineo-onboarding .identity strong {font-weight: 650;}
.chineo-onboarding .identity small {display: block; margin-top: 3px; color: var(--muted); font-size: 10px;}
.chineo-onboarding .tiny {font-size: 10px; color: var(--muted); letter-spacing: .3px;}
.chineo-onboarding .chat {padding: 21px 16px 17px; background: #f0f4fc;}
.chineo-onboarding .ai-bubble {background: var(--blue); color: white; border-radius: 18px; padding: 18px 17px; max-width: 93%;}
.chineo-onboarding .phrase {font-size: 23px; line-height: 1.6; margin: 0; letter-spacing: .3px;}
.chineo-onboarding .demo-caption {font-size: 11px; word-spacing: 7px; letter-spacing: .3px; opacity: .7; line-height: 1.8; margin-bottom: 2px;}
.chineo-onboarding .translation {font-size: 11px; opacity: .7; margin: 7px 0 0; line-height: 1.5;}
.chineo-onboarding .user-bubble {background: white; border-radius: 18px; padding: 14px 16px; margin: 13px 0 0 auto; max-width: 83%; box-shadow: 0 3px 12px #152a4b04;}
.chineo-onboarding .user-bubble .phrase {font-size: 20px;}
.chineo-onboarding .help-row {margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 8px;}
.chineo-onboarding .text-action {border: 0; background: transparent; padding: 9px 0; color: var(--blue); font-size: 12px; display: flex; align-items: center; gap: 7px;}
.chineo-onboarding .text-action svg {width: 16px; height: 16px;}
.chineo-onboarding .mic-demo {width: 40px; height: 40px; background: var(--blue); color: white; border-radius: 50%; display: grid; place-items: center;}
.chineo-onboarding .mic-demo svg {width: 21px; height: 21px;}
.chineo-onboarding .hint {font-size: 12px; line-height: 1.7; background: #fff; padding: 13px 15px; border-radius: 12px; margin-top: 8px; color: var(--muted);}
.chineo-onboarding .hint b {color: var(--ink); display: block; font-size: 16px; font-weight: 500;}
.chineo-onboarding .under-demo {display: flex; align-items: flex-start; gap: 9px; margin: 17px 2px 0; color: var(--muted); font-size: 12px; line-height: 1.65;}
.chineo-onboarding .under-demo svg {width: 17px; height: 17px; margin-top: 1px; color: var(--blue);}
.chineo-onboarding footer {padding: 24px 26px 19px;}
.chineo-onboarding .primary {width: 100%; display: flex; align-items: center; justify-content: center; gap: 12px; background: var(--blue); color: white; min-height: 54px; border: 0; border-radius: 16px; font-size: 15px; font-weight: 650;}
.chineo-onboarding .primary svg {width: 18px;}
.chineo-onboarding .secondary-row {text-align: center; margin-top: 12px; min-height: 28px;}
.chineo-onboarding .quiet {border: 0; background: transparent; padding: 7px 10px; font-size: 12px; color: var(--muted);}
.chineo-onboarding .demo-tabs {display: flex; padding: 6px; gap: 4px; margin: 16px 16px 0; background: #eef2f8; border-radius: 12px;}
.chineo-onboarding .demo-tabs button {border: 0; flex: 1; background: transparent; border-radius: 8px; padding: 10px 5px; font-size: 12px; display: flex; justify-content: center; gap: 7px; align-items: center; color: var(--muted);}
.chineo-onboarding .demo-tabs button svg {width: 16px; height: 16px;}
.chineo-onboarding .demo-tabs .selected {background: white; color: var(--ink); box-shadow: 0 2px 5px #1b2b4510;}
.chineo-onboarding .feedback-body {padding: 22px 20px 20px; min-height: 263px;}
.chineo-onboarding .label {font-size: 11px; color: var(--muted); margin: 0 0 8px; line-height: 1.5;}
.chineo-onboarding .original {font-size: 21px; margin: 0 0 18px; line-height: 1.7;}
.chineo-onboarding .mark-error {color: var(--red); text-decoration: underline; text-decoration-color: #ebbfca; text-decoration-thickness: 3px; text-underline-offset: 6px;}
.chineo-onboarding .correction {padding: 15px 16px; background: #eff6f3; border-radius: 14px;}
.chineo-onboarding .correction .phrase {font-size: 23px;}
.chineo-onboarding .correction .label {color: var(--green);}
.chineo-onboarding .explain {font-size: 12px; line-height: 1.8; margin: 15px 0 0; color: var(--muted);}
.chineo-onboarding .status {display: flex; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--line); font-size: 11px; color: var(--muted);}
.chineo-onboarding .status span {display: flex; align-items: center; gap: 5px;}
.chineo-onboarding .status svg {width: 13px; height: 13px;}
.chineo-onboarding .red {color: var(--red);}
.chineo-onboarding .green {color: var(--green);}
.chineo-onboarding .tone-pair {display: grid; grid-template-columns: 1fr 1fr; gap: 10px;}
.chineo-onboarding .tone {padding: 17px; text-align: center; background: #f2f5fc; border-radius: 14px;}
.chineo-onboarding .tone b {font-size: 43px; display: block; font-weight: 500; line-height: 1.4;}
.chineo-onboarding .tone span {color: var(--blue); font-size: 18px;}
.chineo-onboarding .tone small {display: block; color: var(--muted); font-size: 11px; margin-top: 5px;}
.chineo-onboarding .tone-guide {display: flex; justify-content: center; gap: 8px; color: var(--blue); font-size: 11px; margin-top: 18px;}
.chineo-onboarding .tone-guide svg {width: 16px; height: 16px;}
.chineo-onboarding .review-wrap {padding: 20px;}
.chineo-onboarding .review-summary {font-size: 16px; line-height: 1.9; margin: 14px 0 17px;}
.chineo-onboarding .review-summary em {font-style: normal; color: var(--red);}
.chineo-onboarding .review-meta {display: flex; align-items: center; justify-content: space-between; font-size: 10px; color: var(--muted);}
.chineo-onboarding .voice-label {display: flex; align-items: center; gap: 5px; color: var(--blue); font-size: 10px;}
.chineo-onboarding .voice-label svg {width: 15px; height: 15px;}
.chineo-onboarding .practice-item {display: flex; gap: 12px; padding-top: 16px; border-top: 1px solid var(--line);}
.chineo-onboarding .number {font-size: 11px; color: var(--blue); padding-top: 3px;}
.chineo-onboarding .practice-item strong {font-size: 13px; font-weight: 600;}
.chineo-onboarding .practice-item p {font-size: 19px; line-height: 1.6; margin: 6px 0 4px;}
.chineo-onboarding .practice-item small {color: var(--muted); font-size: 11px; line-height: 1.6; display: block;}
.chineo-onboarding .shelf {display: flex; gap: 13px; font-size: 11px; color: var(--muted); padding: 14px 20px; border-top: 1px solid var(--line); background: #fcfdff;}
.chineo-onboarding .shelf span {display: flex; align-items: center; gap: 4px;}
.chineo-onboarding .shelf svg {width: 13px; height: 13px;}
.chineo-onboarding .selected .radio {border: 5px solid var(--blue); background: white;}
.chineo-onboarding .note {font-size: 12px; color: var(--muted); line-height: 1.7; margin: 18px 0;}
.chineo-onboarding main.enter {animation: ob-enter .25s ease-out;}
@keyframes ob-enter { 
  from {opacity: .3; transform: translateY(7px);} 
  to {opacity: 1; transform: translateY(0);} 
}
@media (max-width:480px) {
.chineo-onboarding {background: #f8f9fc;}
.chineo-onboarding .phone {border: 0; border-radius: 0; box-shadow: none; width: 100%; min-height: calc(100svh - 27px);}
.chineo-onboarding .top {padding-top: max(18px,env(safe-area-inset-top));}
.chineo-onboarding footer {padding-bottom: max(18px,env(safe-area-inset-bottom));}
.chineo-onboarding h1 {font-size: 32px;}
}
@media (max-width:360px) {
.chineo-onboarding main {padding: 0 20px;}
.chineo-onboarding .top {padding-left: 20px; padding-right: 20px;}
.chineo-onboarding footer {padding-left: 20px; padding-right: 20px;}
.chineo-onboarding h1 {font-size: 29px;}
.chineo-onboarding .lede {font-size: 13px;}
.chineo-onboarding .shelf {gap: 9px; font-size: 10px;}
.chineo-onboarding .phrase {font-size: 21px;}
}
@media (prefers-reduced-motion:reduce) {
.chineo-onboarding main.enter {animation: none;}
}
.chineo-onboarding {position: fixed; inset: 0; z-index: 10000; overflow: auto; overscroll-behavior: contain; background: #f8f9fc; color: #172944; font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; -webkit-text-size-adjust: 100%;}
.chineo-onboarding .phone {min-height: 100dvh; border: 0; border-radius: 0; box-shadow: none; margin-inline: auto;}
.chineo-onboarding .top {padding-top: max(22px,env(safe-area-inset-top));}
.chineo-onboarding .progress span {height: 3px; border-radius: 5px; flex: 1; background: #e1e6ef;}
.chineo-onboarding .progress span.active {background: var(--blue);}
.chineo-onboarding .language select {font: inherit; border: 0; background: transparent; color: inherit; max-width: 150px; min-height: 38px; padding: 0 5px;}
.chineo-onboarding .progress {margin: 0 26px 23px;}
.chineo-onboarding .ob-content {padding: 0 26px;}
.chineo-onboarding footer {padding-bottom: max(20px,env(safe-area-inset-bottom));}
.chineo-onboarding .status {flex-wrap: wrap;}
.chineo-onboarding .shelf {flex-wrap: wrap;}
.chineo-onboarding .brand {margin-right: auto;}
.chineo-onboarding[dir=rtl] .brand {margin-left: auto; margin-right: 0;}
.chineo-onboarding .original {direction: ltr;}
.chineo-onboarding [lang=zh-CN] {text-align: left;}
.chineo-onboarding .poster-art {position: relative; min-height: 330px; overflow: hidden; border-radius: 28px; background: linear-gradient(158deg,#dfeaff 0%,#eef3ff 60%,#f7f9ff 100%); border: 1px solid #dbe5fb; isolation: isolate;}
.chineo-onboarding .poster-conversation .poster-glow {position: absolute; width: 260px; height: 260px; border-radius: 50%; top: -105px; right: -55px; background: #c4d7ff; filter: blur(5px);}
.chineo-onboarding .poster-person {position: absolute; top: 22px; right: 14px; width: 180px; height: 180px; border-radius: 50%; overflow: hidden; background: #d2e1ff; box-shadow: 0 18px 36px #2045a829;}
.chineo-onboarding .poster-person img {width: 100%; height: 100%; object-fit: cover; object-position: center 22%;}
.chineo-onboarding .poster-time {position: absolute; top: 27px; left: 23px; padding: 8px 13px; border-radius: 999px; background: #fff; color: #2852e8; font-size: 14px; font-weight: 750; box-shadow: 0 8px 24px #2045a81a;}
.chineo-onboarding .poster-chat {position: absolute; max-width: 80%; padding: 12px 16px; border-radius: 18px; font-size: 15px; line-height: 1.4; box-shadow: 0 10px 22px #20396d17; direction: ltr; text-align: left;}
.chineo-onboarding .poster-chat-ai {top: 166px; left: 16px; background: #2852e8; color: #fff; border-bottom-left-radius: 5px;}
.chineo-onboarding .poster-chat-learner {top: 231px; right: 16px; background: #fff; border-bottom-right-radius: 5px;}
.chineo-onboarding .poster-mic {position: absolute; bottom: 16px; left: 18px; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #2852e8; color: #fff;}
.chineo-onboarding .poster-conversation {min-height: 380px;}
.chineo-onboarding .poster-conversation .poster-person {top: 12px; width: 138px; height: 138px;}
.chineo-onboarding .poster-conversation .poster-chat-ai {top: 143px;}
.chineo-onboarding .poster-conversation .poster-chat-learner {top: 207px;}
.chineo-onboarding .poster-conversation .poster-mic {top: 81px; bottom: auto;}
.chineo-onboarding .poster-native {position: absolute; bottom: 14px; left: 14px; right: 14px; padding: 10px 13px; border: 1px solid #d7e4fb; border-radius: 15px; background: #fff; box-shadow: 0 8px 20px #20396d12;}
.chineo-onboarding .poster-native span {display: flex; align-items: center; gap: 6px; color: #2852e8; font-size: 12px; font-weight: 750;}
.chineo-onboarding .poster-native svg {width: 15px; height: 15px;}
.chineo-onboarding .poster-native p {margin: 5px 0 0; color: #253c60; font-size: 13px; line-height: 1.35; direction: ltr; text-align: left;}
.chineo-onboarding .poster-modes {display:flex;flex-direction:column;justify-content:center;gap:14px;padding:18px;background:linear-gradient(152deg,#dce9ff 0%,#f4f7ff 55%,#e8f3f1 100%);}
.chineo-onboarding .poster-modes-glow {position:absolute;inset:auto -75px -120px auto;width:250px;height:250px;border-radius:50%;background:#c9e4e0;filter:blur(24px);opacity:.7;}
.chineo-onboarding .poster-mode-card {position:relative;z-index:1;min-width:0;padding:15px 17px;border:1px solid #dce6f6;border-radius:20px;background:#fff;box-shadow:0 12px 28px #1f46731a;}
.chineo-onboarding .poster-mode-free {margin-right:20px;}
.chineo-onboarding .poster-mode-topic {margin-left:20px;background:#f7faff;}
.chineo-onboarding .poster-mode-label {display:flex;align-items:center;gap:9px;color:#203b68;font-size:15px;}
.chineo-onboarding .poster-mode-icon {display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#e8efff;color:#2852e8;}
.chineo-onboarding .poster-mode-topic .poster-mode-icon {background:#e5f2ef;color:#27846f;}
.chineo-onboarding .poster-mode-icon svg {width:17px;height:17px;}
.chineo-onboarding .poster-mode-arrow {margin-left:auto;color:#7993bd;}
.chineo-onboarding .poster-mode-arrow svg {width:16px;height:16px;}
.chineo-onboarding .poster-mode-card p {margin:10px 0 0;font-size:12px;line-height:1.45;color:#667994;direction:ltr;text-align:left;}
.chineo-onboarding .poster-mode-chat {display:inline-block;max-width:100%;margin-top:8px;padding:9px 11px;border-radius:11px 11px 11px 3px;background:#2852e8;color:#fff;font-size:12px;line-height:1.35;direction:ltr;text-align:left;}
.chineo-onboarding .poster-topic-lines {display:flex;gap:5px;margin-top:13px;}
.chineo-onboarding .poster-topic-lines span {height:5px;width:37px;border-radius:5px;background:#b9d0f8;}
.chineo-onboarding .poster-topic-lines span:nth-child(2) {width:53px;background:#a3c4e9;}
.chineo-onboarding .poster-topic-lines span:nth-child(3) {width:26px;background:#d1deee;}
.chineo-onboarding[dir=rtl] .poster-mode-free {margin-right:0;margin-left:20px;}
.chineo-onboarding[dir=rtl] .poster-mode-topic {margin-left:0;margin-right:20px;}
.chineo-onboarding[dir=rtl] .poster-mode-arrow {margin-left:0;margin-right:auto;}
.chineo-onboarding .poster-feedback {display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 20px; background: linear-gradient(155deg,#e9f0ff,#f8f9ff);}
.chineo-onboarding .poster-feedback-card {background: #fff; border-radius: 22px; padding: 19px 20px 16px; box-shadow: 0 16px 35px #28497c12;}
.chineo-onboarding .poster-type {display: flex; align-items: center; gap: 8px; color: #47628b; font-size: 13px; font-weight: 700;}
.chineo-onboarding .poster-type svg {width: 17px; height: 17px;}
.chineo-onboarding .poster-feedback-card p {margin: 13px 0 0; font-size: 20px; line-height: 1.4; letter-spacing: -.3px; direction: ltr; text-align: left;}
.chineo-onboarding .poster-feedback-card .mark-error {color: #b64659; background: #fff0f2; padding: 2px 3px; border-radius: 5px;}
.chineo-onboarding .poster-feedback-card .poster-fixed {color: #173358; margin-top: 6px;}
.chineo-onboarding .poster-fixed span {color: #267568; font-weight: 750;}
.chineo-onboarding .poster-arrow {color: #8da5ca; height: 13px; margin-top: 3px;}
.chineo-onboarding .poster-arrow svg {width: 16px; height: 16px;}
.chineo-onboarding .poster-sound-card {display: flex; align-items: center; gap: 9px; padding: 15px 18px; border-radius: 18px; background: #fff; color: #2852e8; font-size: 13px; font-weight: 700;}
.chineo-onboarding .poster-wave {margin-left: auto; letter-spacing: 2px; color: #86a5ed; font-size: 15px; direction: ltr;}
.chineo-onboarding[dir=rtl] .poster-time {left: auto; right: 23px;}
.chineo-onboarding[dir=rtl] .poster-person {right: auto; left: 14px;}
.chineo-onboarding[dir=rtl] .poster-chat-ai {left: auto; right: 16px;}
.chineo-onboarding[dir=rtl] .poster-chat-learner {right: auto; left: 16px;}
@media (max-width:360px) {.chineo-onboarding .poster-art {min-height: 300px;} .chineo-onboarding .poster-conversation {min-height: 390px;} .chineo-onboarding .poster-conversation .poster-person {width: 122px; height: 122px;} .chineo-onboarding .poster-conversation .poster-chat-ai {top: 137px;} .chineo-onboarding .poster-conversation .poster-chat-learner {top: 207px;} .chineo-onboarding .poster-feedback-card p {font-size: 17px;} .chineo-onboarding .poster-wave {letter-spacing: 0;}}
@media (min-width:700px) {
.chineo-onboarding {background: #e9edf4;}
.chineo-onboarding .phone {border-inline: 1px solid #e1e6ef;}
}
.app-product[data-screen=onboarding] .app-header {max-width: 430px; margin: auto; padding: 22px 26px 12px; height: auto; min-height: 70px; background: #f8f9fc;}
.app-product[data-screen=onboarding] .app-header h2 {color: #2852e8; font-size: 28px; letter-spacing: -1px;}
.app-product[data-screen=onboarding] {background: #f8f9fc;}
.app-product[data-screen=onboarding] .setup {max-width: 430px; padding: 12px 26px 30px; margin: auto;}
.app-product[data-screen=onboarding] .setup-heading h1 {font-size: 32px; line-height: 1.25; letter-spacing: -.7px; color: #172944; margin: 0 0 13px;}
.app-product[data-screen=onboarding] .setup-heading p {font-size: 14px; line-height: 1.8; color: #69778b; margin: 0 0 22px;}
.app-product[data-screen=onboarding] .setup-heading .eyebrow {font-size: 11px; letter-spacing: 1.2px; color: #2852e8; margin-bottom: 13px;}
.app-product[data-screen=onboarding] .setup-card {background: transparent; border: 0; box-shadow: none; padding: 0; border-radius: 0;}
.app-product[data-screen=onboarding] fieldset {border: 0; padding: 0; margin: 0 0 22px; min-width: 0;}
.app-product[data-screen=onboarding] legend {font-size: 13px; font-weight: 650; padding: 0; margin-bottom: 12px;}
.app-product[data-screen=onboarding] .level-options {display: grid; grid-template-columns: 1fr; gap: 11px;}
.app-product[data-screen=onboarding] .choice {display: flex; gap: 13px; align-items: center; min-height: 85px; padding: 18px; border: 1px solid #e3e8f0; border-radius: 16px; background: white;}
.app-product[data-screen=onboarding] .choice input {appearance: auto; position: static; opacity: 1; width: 18px; height: 18px; accent-color: #2852e8; flex-shrink: 0;}
.app-product[data-screen=onboarding] .choice span {padding: 0; border: 0; background: transparent; display: block; min-height: 0;}
.app-product[data-screen=onboarding] .choice:has(input:checked) {border-color: #2852e8; background: #edf2ff;}
.app-product[data-screen=onboarding] .choice b {font-size: 16px; font-weight: 650; color: #172944;}
.app-product[data-screen=onboarding] .choice small {font-size: 12px; color: #69778b; line-height: 1.6; margin-top: 5px;}
.app-product[data-screen=onboarding] #learning-focus .level-options {grid-template-columns: 1fr 1fr;}
.app-product[data-screen=onboarding] #learning-focus .choice {padding: 12px 10px; gap: 8px; min-height: 65px;}
.app-product[data-screen=onboarding] #learning-focus .choice b {font-size: 13px;}
.app-product[data-screen=onboarding] #learning-focus svg {width: 17px; height: 17px; display: none;}
.app-product[data-screen=onboarding] .goal-options {display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px;}
.app-product[data-screen=onboarding] .goal-choice span {border: 1px solid #e3e8f0; border-radius: 13px; padding: 15px 5px; background: white; color: #172944; font-size: 11px; text-align: center; min-height: 75px;}
.app-product[data-screen=onboarding] .goal-choice input:checked+span {background: #edf2ff; border-color: #2852e8; color: #2852e8;}
.app-product[data-screen=onboarding] .goal-choice b {display: block; font-size: 23px;}
.app-product[data-screen=onboarding] .goal-choice small {display: none;}
.app-product[data-screen=onboarding] .ob-options {margin: 20px 0; border-top: 1px solid #e3e8f0; padding-top: 16px;}
.app-product[data-screen=onboarding] .ob-options summary {font-size: 12px; color: #69778b; cursor: pointer;}
.app-product[data-screen=onboarding] .ob-options[open] summary {margin-bottom: 18px;}
.app-product[data-screen=onboarding] .ob-options label {display: block; font-size: 13px; margin: 12px 0 7px;}
.app-product[data-screen=onboarding] .ob-options .muted {font-size: 12px; line-height: 1.6;}
.app-product[data-screen=onboarding] .ob-options select,.app-product[data-screen=onboarding] .ob-options input {width: 100%; min-height: 44px; font-size: 16px;}
.app-product[data-screen=onboarding] .form-actions {margin: 24px 0 0; gap: 10px;}
.app-product[data-screen=onboarding] .primary {border-radius: 16px; min-height: 54px; font-size: 15px;}
.app-product[data-screen=onboarding] .secondary {border-radius: 16px; font-size: 13px;}
.app-product[data-screen=onboarding] .flow-setup-progress {gap: 6px; margin: 0 0 22px;}
.app-product[data-screen=onboarding] .flow-setup-progress span {height: 3px; border-radius: 5px;}
.app-product[data-screen=onboarding] [hidden] {display: none !important;}
.app-product[data-screen=setup-ready] .flow-setup-ready {max-width: 430px; margin: auto; padding: 30px 26px;}
.app-product[data-screen=setup-ready] .flow-setup-ready h1 {font-size: 32px; line-height: 1.25;}
.app-product[data-screen=setup-ready] .flow-setup-ready>p {font-size: 14px; line-height: 1.8; color: #69778b;}
.app-product[data-screen=setup-ready] .flow-setup-summary {padding: 8px 20px; border-radius: 20px; border: 1px solid #e3e8f0;}
.app-product[data-screen=setup-ready] .flow-setup-summary>div {padding: 17px 0;}
.app-product[data-screen=setup-ready] .flow-setup-summary strong {font-size: 14px;}
.app-product[data-screen=setup-ready] .flow-setup-summary span {font-size: 12px;}
.app-product[data-screen=setup-ready] .primary {border-radius: 16px; font-size: 15px; min-height: 54px;}
@media (max-width:360px) {
.chineo-onboarding .ob-content {padding-inline: 20px;}
.app-product[data-screen=onboarding] .setup {padding-inline: 20px;}
.app-product[data-screen=onboarding] .setup-heading h1 {font-size: 29px;}
}
.chineo-onboarding .phrase,.chineo-onboarding .original,.chineo-onboarding .review-summary,.chineo-onboarding .practice-item p {color: #172944;}
.chineo-onboarding .ai-bubble .phrase,.chineo-onboarding .ai-bubble .translation {color: #fff;}
.chineo-onboarding .user-bubble .translation {color: #69778b;}
.chineo-onboarding .top .language {min-width: 0;}
.chineo-onboarding .top .brand {flex-shrink: 0;}
@media (max-width:360px) {
.chineo-onboarding .top .language select {max-width: 98px;}
.chineo-onboarding .top .brand {font-size: 26px;}
}

.chineo-onboarding .top .brand img{display:block;width:132px;height:auto;max-width:34vw}
