html,body{max-width:100%;overflow-x:hidden}main{padding-bottom:60px}.preview-note{color:#8a4b08;background:#fff7e4;padding:10px 14px;border-radius:10px}.expression-grid,.grammar-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.expression-grid article,.grammar-grid article,.question-card{background:#fff;padding:16px;border-radius:14px;border:1px solid #dbe4ed}.expression-grid b{display:block;color:#123f8c;font-size:18px}.expression-grid span{display:block;color:#111827}.grammar-grid h3{color:#123f8c;margin-top:0}.question-mode{display:flex;justify-content:center;gap:8px;margin:14px 0}.question-mode button{font-weight:800}.question-mode button.active{color:#fff;background:#123f8c;border-color:#123f8c}.question-card{text-align:center}.question-card button{margin:4px}#questionText{font-size:clamp(21px,3vw,30px);font-weight:900;color:#123f8c}#questionMeaning{font-size:clamp(19px,2.7vw,26px);font-weight:800;line-height:1.65;color:#111827;background:#fff7d6;border:2px solid #e2bc52;border-radius:12px;padding:14px;margin:12px auto 16px;max-width:780px}#questionMeaning::before{content:attr(data-label);display:block;color:#8a4b08;font-size:.72em;margin-bottom:4px}.question-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}#promptText{white-space:pre-wrap;background:#f5f7fa;padding:14px;border-radius:10px;max-height:320px;overflow:auto}.breadcrumbs,.return-navigation,.trial-banner,#shareSection,.back-top{display:none!important}@media(max-width:600px){main{padding:18px 10px}.expression-grid,.grammar-grid{grid-template-columns:1fr}.controls.modes{display:grid;grid-template-columns:1fr}.controls.modes button{width:100%}.question-mode,.question-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.question-mode button,.question-actions button{width:100%;min-width:0}}
.question-speed{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin:4px 0 12px;font-weight:800}.question-speed select{min-width:86px}.review-loop{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:8px 12px;border:1px solid #a8bacd;background:#fff;border-radius:9px}.review-loop input{width:18px;height:18px}.reset-progress{color:#8a210e;background:#fff8eb}
.question-review-summary,.question-rating{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:8px 0}.question-review-summary button,.question-rating button{min-height:44px}.question-rating button{min-width:120px;font-weight:900}.question-rating button[aria-pressed=true],#questionReviewOnly[aria-pressed=true]{color:#fff;background:#174c72}
@media(max-width:600px){.question-review-summary,.question-rating{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.question-review-summary button,.question-rating button{width:100%;min-width:0}}
@media(max-width:600px){.question-actions,.question-rating{position:sticky;z-index:8;background:rgba(255,255,255,.97);border:1px solid #dbe4ed;box-shadow:0 -6px 18px rgba(21,40,59,.12);padding:6px;border-radius:12px}.question-actions{bottom:max(142px,calc(env(safe-area-inset-bottom,0px) + 70px));margin-bottom:8px}.question-rating{bottom:max(72px,env(safe-area-inset-bottom,0px));margin:0}.question-card{padding-bottom:18px}}

/* Color follows the speaker, independently of voice selection. */
#stageContent .text-en{color:#111!important}#stageContent[data-speaker="Hanako"] .text-en{color:#b31b1b!important}

/* Demo v2: keep the measured silence beside its label, with no duplicate row. */
.stage .frame-waits .wait-label{display:flex;align-items:baseline;justify-content:center;gap:8px;white-space:nowrap;font-size:14px;font-weight:800;line-height:1.4;margin:0 0 6px}
.stage .frame-waits .wait-label #waitSetting{display:inline-block;flex:0 0 auto;font-size:16px;font-weight:900;line-height:1.4;margin:0;padding:0;color:#174c72;font-variant-numeric:tabular-nums}
@media(orientation:landscape) and (max-height:600px){.stage .frame-waits .wait-label{font-size:13px;gap:6px;margin-bottom:3px}.stage .frame-waits .wait-label #waitSetting{font-size:15px}}
