:root{--color-primary:#1769c2;--color-primary-light:#e7f4ff;--color-secondary:#2c823c;--color-accent:#a94c00;--color-accent-fill:#ffba45;--color-background:#f4f9ee;--color-surface:#fffdf6;--color-text:#26354a;--color-text-muted:#536477;--color-success:#28743a;--color-success-bg:#e4f5df;--color-practice:#914400;--color-practice-bg:#fff0d7;--color-warning:#8b4500;--color-warning-bg:#fff1d0;--color-border:#ceddcb;--color-focus:#124fa1;--radius-sm:12px;--radius-card:20px;--radius-pill:999px;--shadow-card:0 4px 12px rgba(41,68,49,.12);font-family:'PingFang SC','Microsoft YaHei','Noto Sans SC',system-ui,sans-serif;color:var(--color-text);background:var(--color-background)}
*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}[hidden]{display:none!important}.launch-loading{min-height:100dvh;padding:20vh 24px;text-align:center}.launch-loading button{min-height:48px;padding:0 24px}#toast{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%,20px);z-index:1000;background:#26354a;color:white;padding:12px 18px;border-radius:12px;max-width:90vw;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s,bottom .2s}#toast[data-layout="nav"]{bottom:calc(94px + env(safe-area-inset-bottom))}#toast[data-layout="actions"]{bottom:calc(102px + env(safe-area-inset-bottom))}#toast.is-visible{opacity:1;transform:translate(-50%,0)}.welcome{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:linear-gradient(#a8dbff 0%,#dff3ff 38%,#dbefc6 38%,#f4f9ee 100%)}.welcome-card{width:min(100%,440px);background:var(--color-surface);border-radius:28px;padding:24px;box-shadow:0 12px 32px #44724533}.welcome-icon{font-size:48px;text-align:center}.welcome-kicker{color:#28743a;font-weight:700;text-align:center}.welcome h1{text-align:center;font-size:28px;margin:8px 0}.welcome-card>p{text-align:center}.welcome-tabs{display:flex;gap:12px;margin:24px 0 20px}.welcome-tabs button{flex:1;border:0;border-radius:14px;min-height:52px;background:#eef4ec;color:#344c3c;font-weight:700}.welcome-tabs button.active{background:#1769c2;color:#fff}.welcome form{display:grid;gap:16px}.welcome label{display:grid;gap:8px;font-weight:700}.welcome input{width:100%;min-height:52px;border:1px solid #9fb3a3;border-radius:12px;padding:10px 14px;background:#fff}.welcome-error{margin:0;color:#a33b12}.welcome-submit{border:0;border-radius:16px;min-height:56px;color:white;background:#1769c2;font-size:18px;font-weight:700}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Welcome page uses the same exploration-journal visual language. */
.welcome{background:linear-gradient(180deg,rgba(16,48,60,.2),rgba(233,242,224,.76)),url('/assets/quest-hero.jpg') center/cover fixed no-repeat}
.welcome-card{position:relative;background:rgba(255,253,247,.96);border:1px solid rgba(255,255,255,.8);box-shadow:0 20px 60px rgba(23,50,77,.22);color:#17324d}
.welcome-icon{height:130px;display:flex;align-items:center;justify-content:center}
.welcome-icon img{height:145px;max-width:140px;object-fit:contain;filter:drop-shadow(0 7px 6px rgba(23,50,77,.18))}
.welcome-kicker{color:#15766f;letter-spacing:.05em}
.welcome h1{color:#17324d}.welcome-card>p{line-height:1.5}.welcome-tabs button:not(.active){background:#e7f1ed;color:#245e68}

/* First-use screen: one clear step at a time, with the same illustrated world. */
.welcome{padding:24px 14px;background:linear-gradient(180deg,rgba(12,56,76,.27),rgba(234,247,225,.89)),url('/assets/quest-hero.jpg') center/cover fixed no-repeat}
.welcome-card{width:min(100%,480px);padding:0;overflow:hidden;background:#fffdf7;border:2px solid rgba(255,255,255,.86);border-radius:26px;box-shadow:0 20px 60px rgba(14,48,59,.24)}
.welcome-scene{height:170px;position:relative;background:linear-gradient(0deg,rgba(19,54,53,.6),transparent 57%),url('/assets/quest-dictation.jpg') center 39%/cover no-repeat}
.welcome-scene span{position:absolute;left:18px;bottom:14px;color:white;font-weight:800;font-size:15px;text-shadow:0 1px 4px #1b4035}
.welcome-copy{padding:20px 22px 24px}.welcome-copy .welcome-kicker{margin:0;color:#17726b;font-size:13px;font-weight:800;letter-spacing:.08em;text-align:left}
.welcome-copy h1{text-align:left;margin:7px 0;font-size:28px;color:#17324d}.welcome-description{text-align:left;margin:0;color:#536477;line-height:1.5;font-size:16px}
.welcome-tabs{margin:20px 0 18px;padding:4px;background:#eaf2ed;border-radius:15px;gap:4px}.welcome-tabs button{min-height:48px;border-radius:12px}.welcome-tabs button.active{background:#1769c2;color:#fff;box-shadow:0 3px 8px rgba(23,105,194,.2)}
.welcome form{gap:12px}.welcome label{color:#253b4b}.welcome input{min-height:54px;border-color:#b8cfc7}.welcome-tip{font-size:14px;line-height:1.5;color:#536477;margin:0}.welcome-submit{margin-top:2px;box-shadow:0 4px 0 #0d4c90}

/* Illustrated family gateway */
.welcome{padding:18px 14px;background:linear-gradient(180deg,rgba(16,54,70,.2),rgba(239,247,229,.78)),url('/assets/quest-hero.jpg') center/cover fixed no-repeat}
.welcome-card{width:min(100%,500px);border:1px solid rgba(255,255,255,.92);border-radius:30px;box-shadow:0 24px 70px rgba(17,49,61,.28)}
.welcome-scene{height:210px;background:linear-gradient(0deg,rgba(18,54,62,.76),rgba(18,54,62,.02) 72%),url('/assets/quest-dictation.jpg') center 42%/cover no-repeat}
.welcome-scene:after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(transparent,rgba(12,44,54,.42));pointer-events:none}
.welcome-scene>img{position:absolute;z-index:2;right:7px;bottom:-8px;width:128px;height:158px;object-fit:contain;filter:drop-shadow(0 8px 8px rgba(19,47,54,.26))}
.welcome-scene-copy{position:absolute;z-index:3;left:22px;bottom:20px;max-width:66%;display:grid;gap:4px;color:#fff;text-shadow:0 2px 8px rgba(19,47,54,.55)}
.welcome-scene-copy span{position:static;left:auto;bottom:auto;color:inherit;font-size:12px;font-weight:800;letter-spacing:.14em;text-shadow:inherit}
.welcome-scene-copy strong{font-size:21px;line-height:1.3}
.welcome-copy{padding:23px 24px 27px}
.welcome-description{color:#526579}
.welcome-tabs{border:1px solid #d7e4df;background:#edf4ef}
.welcome-tabs button{transition:color .2s ease,background-color .2s ease,box-shadow .2s ease}
.welcome label small{font-size:12px;font-weight:500;color:#687988}
.welcome input{border:1px solid #aebfbd;background:#fffefa;transition:border-color .2s ease,box-shadow .2s ease}
.welcome input:hover{border-color:#6f9ea5}
.welcome-submit{background:linear-gradient(180deg,#2e86d5,#1769c2);transition:filter .2s ease,transform .2s ease}
.welcome-submit:hover{filter:brightness(1.04)}
.welcome-submit:active{transform:translateY(2px);box-shadow:0 2px 0 #0d4c90}
@media(max-width:420px){.welcome{padding:0;background:#f4f9ee}.welcome-card{min-height:100dvh;border:0;border-radius:0;box-shadow:none}.welcome-scene{height:196px}.welcome-copy{padding:21px 20px 28px}.welcome-scene>img{width:112px;height:145px}.welcome-scene-copy{left:20px;bottom:18px}.welcome-copy h1{font-size:27px}}

/* Connection failure keeps the same illustrated, reassuring visual language. */
.launch-error{display:grid;place-items:center;padding:24px 16px;background:linear-gradient(180deg,rgba(16,54,70,.18),rgba(239,247,229,.88)),url('/assets/quest-hero.jpg') center/cover fixed no-repeat;color:#17324d}
.launch-error-card{overflow:hidden;width:min(100%,460px);border:1px solid rgba(255,255,255,.9);border-radius:28px;background:#fffdf7;box-shadow:0 24px 70px rgba(17,49,61,.25);text-align:left}
.launch-error-art{position:relative;height:190px;background:linear-gradient(0deg,rgba(17,52,61,.55),transparent 70%),url('/assets/quest-dictation.jpg') center 40%/cover no-repeat}
.launch-error-art img{position:absolute;right:20px;bottom:-9px;width:132px;height:164px;object-fit:contain;filter:drop-shadow(0 8px 8px rgba(19,47,54,.24))}
.launch-error-copy{display:grid;gap:12px;padding:24px}
.launch-error-copy>span{color:#15766f;font-size:13px;font-weight:900;letter-spacing:.08em}
.launch-error-copy h1{margin:0;color:#17324d;font-size:28px;line-height:1.25}
.launch-error-copy p{margin:0;color:#536477;line-height:1.65}
.launch-error-copy button{min-height:54px;border:0;border-radius:16px;background:linear-gradient(180deg,#2e86d5,#1769c2);box-shadow:0 4px 0 #0d4c90;color:#fff;font-size:17px;font-weight:900}
.launch-error-copy small{color:#687988;line-height:1.5}
@media(max-width:420px){.launch-error{padding:0;background:#f4f9ee}.launch-error-card{min-height:100dvh;border:0;border-radius:0;box-shadow:none}.launch-error-art{height:220px}.launch-error-copy{padding:26px 22px}.launch-error-copy h1{font-size:27px}}

/* B 版：家庭入口和连接失败页共用明亮的闯关世界。 */
:root{--color-primary:#0876d1;--color-primary-light:#e1f5ff;--color-secondary:#368e24;--color-accent:#b4550b;--color-accent-fill:#ffd33f;--color-background:#e8f7d0;--color-surface:#fff9e9;--color-text:#57301b;--color-text-muted:#705742;--color-border:#f2d797;--color-focus:#005fb5;--radius-card:24px;--shadow-card:0 5px 0 rgba(180,117,29,.18),0 10px 22px rgba(60,107,53,.14)}
.welcome,.launch-error{min-height:100dvh;padding:24px 14px;background:linear-gradient(180deg,rgba(108,205,255,.06),rgba(153,218,72,.2)),url('/assets/b-landscape.webp') center center/cover fixed no-repeat;color:#57301b}
.welcome-card,.launch-error-card{width:min(100%,480px);overflow:hidden;border:5px solid #ffce39;border-radius:30px;background:#fff9e9;box-shadow:0 8px 0 #eb9d17,0 18px 32px #225c2b50;color:#57301b}
.welcome-scene,.launch-error-art{height:202px;background:linear-gradient(0deg,#f6c74433,transparent 48%),url('/assets/b-adventure-hero.webp') center 48%/cover no-repeat}
.welcome-scene:after{height:40%;background:linear-gradient(transparent,#5f8d1a55)}
.welcome-scene>img,.launch-error-art img{display:none}
.welcome-scene-copy{left:auto;right:16px;bottom:17px;max-width:57%;text-align:right;color:#fff;text-shadow:0 3px 1px #a85a10,0 0 8px #623406b5}
.welcome-scene-copy span{font-size:13px;letter-spacing:.08em}.welcome-scene-copy strong{font-size:23px}
.welcome-copy{padding:21px 23px 26px}.welcome-copy .welcome-kicker{color:#419028;letter-spacing:.04em}.welcome-copy h1,.launch-error-copy h1{color:#663713;font-weight:900}.welcome-description,.welcome-tip,.launch-error-copy p{color:#72523b}
.welcome-tabs{gap:5px;padding:5px;border:2px solid #eecf7c;border-radius:18px;background:#fff0bd}
.welcome-tabs button{border-radius:13px;color:#865021;background:#fff9e7;font-weight:900}
.welcome-tabs button.active{background:linear-gradient(#ffd55b,#ff9c17);color:#6a3600;box-shadow:0 4px 0 #d77900,inset 0 2px 0 #fff4a4}
.welcome label{color:#6a3d1d}.welcome label small{color:#816850}.welcome input{border:2px solid #eed697;border-radius:15px;background:#fffdf5;color:#57301b}
.welcome-submit,.launch-error-copy button{min-height:56px;border:2px solid #48a321;border-radius:18px;background:linear-gradient(#9de54a,#54bb22);box-shadow:0 5px 0 #368d1b,inset 0 3px 0 #d5ff9a;color:#fff;font-size:18px;font-weight:900;text-shadow:0 2px 1px #33871b}
.welcome-submit:hover{filter:brightness(1.04)}.welcome-submit:active{transform:translateY(3px);box-shadow:0 2px 0 #368d1b}
.launch-error-copy>span{color:#398929}.launch-error-copy small{color:#705742}
#toast{border:2px solid #ffda72;border-radius:18px;background:#644021;color:#fff9e7;box-shadow:0 4px 0 #ad781f,0 8px 18px #3f421a40;font-weight:800}
#toast[data-kind="success"]{background:#327c2c;border-color:#b4ed72;box-shadow:0 4px 0 #245f22,0 8px 18px #3f421a40}
#toast[data-kind="error"]{background:#9f4631;border-color:#ffbd90;box-shadow:0 4px 0 #793727,0 8px 18px #3f421a40}
@media(max-width:420px){.welcome,.launch-error{padding:12px 10px 26px;background-position:center;background-size:auto 100%;background-attachment:scroll}.welcome-card,.launch-error-card{min-height:0;border:4px solid #ffce39;border-radius:26px}.welcome-scene{height:188px}.welcome-copy{padding:19px 18px 24px}.welcome-scene>img{width:128px;height:165px}.launch-error-art{height:200px}.launch-error-copy{padding:23px 19px}}