/* Launch layout: group the learning task and keep the main controls in reach. */
.phone-app{overflow:clip}
.app-header{background:#fff;min-height:60px;padding-inline:18px}
.header-actions{gap:6px}.font-button{min-height:44px;padding-inline:12px}
.screen:has(.question-body){gap:10px;padding-top:6px}
.question-body{justify-content:center;gap:12px;padding-bottom:5px;scroll-padding:12px}
.screen .question-body .question-image{height:auto;flex:1 1 120px;min-height:100px;max-height:260px;border-radius:18px}
.question-body .question-image img{object-position:center 24%}
.question-body .english-question{font-size:1.12rem;line-height:1.4;letter-spacing:-.025em;padding:0 3px}
.question-body .listen-row{gap:10px}
.lesson-button{min-height:52px;border-radius:15px;background:#f0f8ff;color:#116c9e}
.question-body .answer-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 12px;text-align:left;align-items:center;padding:15px;border-radius:18px;background:#f1f8fe;box-shadow:none}
.question-body .answer-card>span{grid-column:1;font-size:.6rem;color:#567c96}
.question-body .answer-card strong{grid-column:1;font-size:1.08rem;line-height:1.4}
.question-body .answer-card .lesson-button{grid-column:2;grid-row:1/3;width:auto;min-width:96px;margin:0;background:#fff;font-size:.78rem;padding:10px}
.question-actions{background:#f6faff;border:1px solid #dcebf5;border-radius:21px;padding:10px;gap:9px;flex-shrink:0}
.question-actions .live-recorder{background:transparent;border:0;padding:0 2px 5px;border-radius:0}
.question-actions .live-recorder:not(.is-recording){padding:0 2px 3px}
.question-actions .mic-orb{background:#e0f1fc}.question-actions .record-clock{font-size:.76rem}
.question-actions .primary{min-height:60px;border-radius:15px;box-shadow:0 3px 0 #086aa9;font-size:1.05rem}
.question-actions .secondary{min-height:52px;background:#fff;border-color:#d5e6f1;font-size:.92rem;border-radius:14px}
.question-actions .playback-actions .lesson-button{background:#fff;min-height:48px}
.question-body.has-result{justify-content:initial;padding:0}.question-body.has-result .score-stage{flex-shrink:1}
.inline-chinese{border:1px solid #f1deb5;border-radius:16px}
.question-body:has(.inline-chinese){justify-content:flex-start}
.question-body:has(.inline-chinese) .question-image{display:none!important}
.question-body:has(.inline-result:not(.score-stage)){justify-content:flex-start}
.screen.mock-question .question-body{justify-content:center}
.screen.mock-question .question-image{display:none!important}
.question-body.has-result .score-stage{border-radius:20px}

/* The membership invitation belongs on the home page, away from the lesson. */
.member-hero{position:relative;display:flex;align-items:center;flex-shrink:0;min-height:128px;width:100%;padding:18px;border:0;border-radius:20px;overflow:hidden;text-align:left;background:#e7f4fc;color:#123958}
.member-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%}
.member-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f2f9ffff 0%,#edf7fff5 28%,#e8f4ffca 60%,#eff8ff08 100%)}
.member-hero-copy{position:relative;z-index:1;display:grid;gap:8px;max-width:78%}
.member-hero-copy small{font-size:.48rem;letter-spacing:.08em;color:#527994}
.member-hero-copy strong{font-size:.94rem;line-height:1.4;text-wrap:balance}
.member-hero-copy>span{font-size:.6rem;color:#47738e;line-height:1.4}.member-hero-copy b{margin-left:12px;color:#007ec6}
.membership{gap:12px}.member-page-body{min-height:0;flex:1;overflow:auto;display:flex;flex-direction:column;gap:14px;scrollbar-width:thin}
.member-page-body>*{flex-shrink:0}.member-cover{height:clamp(120px,23dvh,205px);position:relative;border-radius:20px;overflow:hidden;background:#fff0d1}
.member-cover img{width:100%;height:100%;object-fit:cover;object-position:center 20%}.member-cover>span{position:absolute;bottom:7px;right:9px;font-size:.42rem;color:#fff;background:#43392380;border-radius:4px;padding:2px 4px}
.member-tag{font-size:.6rem;color:#287aab;letter-spacing:.03em}.member-page-body h1{font-size:1.45rem;line-height:1.4;color:#123958;text-wrap:balance}
.member-description{font-size:.8rem;line-height:1.7;color:#436b87}
.member-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px 0;border-block:1px solid #e4eef6}
.member-benefits span{display:flex;flex-direction:column;gap:5px;font-size:.54rem;color:#668296;line-height:1.5;text-align:center}.member-benefits b{font-size:.83rem;color:#156b9e}
.member-terms{font-size:.57rem;line-height:1.7;color:#668296}
.member-offer{border:1px solid #d8eaf8;background:#f1f8ff;border-radius:15px;padding:13px;display:grid;gap:6px}.member-offer strong{font-size:.75rem;color:#176b9e}.member-offer p,.member-offer>span{font-size:.68rem;line-height:1.5}.member-offer small{font-size:.55rem;line-height:1.5;color:#628198}
.member-page-actions button:disabled{cursor:default}
.member-page-body.is-exchange{gap:10px}.is-exchange .member-cover,.is-exchange .member-benefits{display:none}.is-exchange h1{font-size:1.25rem}.is-exchange .member-description{font-size:.75rem}.is-exchange .member-offer p{font-size:.85rem;font-weight:650}.member-aux{display:grid;grid-template-columns:1fr 1fr;gap:6px}.member-aux .text-button{border-radius:12px;background:#f1f8ff;text-align:center;padding:8px}
.member-page-actions{display:flex;flex-direction:column;gap:7px;flex-shrink:0;padding-top:5px}
.member-page-actions .primary,.member-page-actions .secondary{min-height:54px;font-size:.87rem}
.member-page-actions .text-button{font-size:.66rem;min-height:44px}.member-page-actions>p{text-align:center;color:#7290a6;font-size:.51rem;line-height:1.5}
.home{overflow:auto;scrollbar-width:thin}.home .page-head h1{font-size:1.12rem}.home .lesson-list{flex-shrink:0}
.settings{overflow:auto;scrollbar-width:thin}.settings>*{flex-shrink:0}
@media(min-height:741px){.screen .question-body .question-image{display:block!important}.question-body:has(.inline-result) .question-image,.question-body:has(.inline-chinese) .question-image{display:none!important}}
@media(max-height:740px){
 .question-body{gap:9px}.question-body .english-question{font-size:1.05rem}.question-body .answer-card{padding:12px}.question-body .answer-card strong{font-size:1.04rem}
 .question-actions{gap:7px;padding:8px}.question-actions .primary{min-height:58px}.question-actions .secondary{min-height:50px}
 .member-hero{min-height:98px;padding:12px 15px;border-radius:16px}.member-hero-copy{gap:5px}.member-hero-copy strong{font-size:.84rem}
 .home{gap:8px}.home .page-head{gap:4px}.home .lesson-tile{min-height:67px}.home .pagination{min-height:32px}.home .home-foot{padding:8px 10px}
 .member-page-body{gap:10px}.member-cover{height:140px}.member-page-body h1{font-size:1.2rem}.member-description{font-size:.73rem}.member-benefits{padding:10px 0}
}
@media(max-height:610px){
 .app-header{min-height:52px;height:52px}.screen:has(.question-body){gap:6px}.question-body{gap:7px;justify-content:flex-start;padding-bottom:0}
 .question-body .english-question{font-size:.98rem;line-height:1.35}.lesson-button{min-height:48px;padding:8px 10px;font-size:.79rem}
 .question-body .answer-card{padding:10px;gap:3px 8px}.question-body .answer-card .lesson-button{min-width:80px;min-height:46px;font-size:.7rem}
 .question-actions{gap:6px;padding:7px}.question-actions .primary{min-height:54px}.question-actions .secondary{min-height:48px}
 .question-actions .live-recorder:not(.is-recording){padding:0}.question-actions .mic-status{font-size:.57rem}.question-actions .record-clock{font-size:.68rem}
 .home{gap:5px}.home .page-head .eyebrow{display:none}.home .page-head h1{font-size:.95rem}.member-hero{min-height:83px}.member-hero-copy{gap:4px}.member-hero-copy strong{font-size:.77rem}.member-hero-copy>span{font-size:.55rem}
 .home .lesson-tile{min-height:60px}.home .home-foot{padding:6px 8px}.home .pagination{min-height:28px}.home .bank-info{font-size:.56rem}
 .member-cover{height:100px}.member-page-body{gap:8px}.member-page-body h1{font-size:1.08rem}.member-description{font-size:.67rem}.member-benefits{padding:8px 0}.member-terms{font-size:.54rem}
 .member-page-actions .primary,.member-page-actions .secondary{min-height:48px}.member-page-actions{gap:4px}
}
@media(max-height:610px) and (max-width:359px){.large-font .question-body .english-question{font-size:.9rem}.large-font .question-body .answer-card strong{font-size:.91rem}.large-font .question-body .answer-card{padding:8px}}
@media(max-height:450px){.screen:has(.question-body){overflow:auto}.question-body{flex:none;overflow:visible}.question-actions{margin-top:8px}.membership .member-cover{display:none}}

/* 首页：继续学习卡片 + 已开通会员一行 */
.continue-card{flex-shrink:0;display:grid;gap:6px;padding:14px 16px;border-radius:18px;background:linear-gradient(135deg,#0b73b8,#1292dc);color:#fff;box-shadow:0 8px 22px -14px #0b73b8}
.continue-card .eyebrow{color:#cfe9fb;font-size:.58rem;letter-spacing:.08em}
.continue-card strong{font-size:.98rem;line-height:1.35}
.continue-card small{font-size:.62rem;color:#dcefff;line-height:1.4}
.continue-actions{display:flex;gap:8px;margin-top:4px}
.continue-actions .primary{flex:1;background:#fff;color:#0b6db0;min-height:46px}
.continue-actions .secondary{background:#ffffff26;color:#fff;border:1px solid #ffffff66;min-height:46px;padding:0 14px}
.continue-card.is-done{background:linear-gradient(135deg,#13835a,#1fa374)}
.continue-card.is-done .continue-actions .primary{color:#117a52}
.member-line{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:38px;padding:7px 12px;border:0;border-radius:12px;background:#e9f6ee;color:#1d6b46;font-size:.66rem;font-weight:600;text-align:left}
.member-line small{font-weight:500;color:#4d8a6b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:45%}
@media(max-height:650px){.continue-card{padding:10px 12px;gap:4px}.continue-card strong{font-size:.86rem}.continue-actions .primary,.continue-actions .secondary{min-height:40px}}
/* 窄屏：头部四个控件挤不下时收紧；账号 chip 可以被压缩，其他控件不行 */
.header-actions{min-width:0}.account-chip{flex:0 1 auto;min-width:0}
@media(max-width:399px){.app-header{padding:8px 12px;gap:6px}.header-actions{gap:5px}.font-button{padding:6px 8px;font-size:.6rem;min-height:34px}.wordmark small{display:none}.account-chip{max-width:96px}}
@media(max-width:359px){.app-header{padding:8px 10px;gap:5px}.header-actions{gap:4px}.font-button{padding:6px 7px;font-size:.58rem}.wordmark{font-size:.95rem}.account-chip{max-width:78px}.app-header>img{width:26px;height:26px}}
@media(max-width:329px){.app-header .font-button[data-action="cycle-font"]{display:none}}
.large-font .app-header .wordmark{font-size:.9rem}
@media(max-width:399px){.large-font .app-header .font-button[data-action="cycle-font"]{display:none}}

/* 自愿打赏入口 */
.support-card{flex-shrink:0;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:#fff4ec;border:1px solid #ffd9c2;color:#7a3d14;text-decoration:none}
.support-card>span:nth-child(2){flex:1;display:grid;gap:3px;min-width:0}
.support-card strong{font-size:.78rem;color:#8a3f0f}
.support-card small{font-size:.6rem;line-height:1.4;color:#9b5a2e}
.support-card b{white-space:nowrap;font-size:.68rem;color:#c2410c}
.support-heart{width:36px;height:36px;border-radius:50%;background:#ffe3d3;color:#e4572e;display:grid;place-items:center;font-size:1rem;flex-shrink:0}
.support-button{display:flex;align-items:center;justify-content:center;text-decoration:none;color:#c2410c;background:#fff4ec;border:1px solid #ffd9c2}
@media(max-height:650px){.support-card{padding:9px 11px;gap:9px}.support-card small{display:none}}