/* Learning continuity release (V1.2): next steps, clearer gating and mobile study space. */
.flow-hint{display:block;margin-top:8px;color:#5b6f66;font-size:12px;line-height:1.45}
.form-error{margin:10px 0 0;padding:10px 12px;border:1px solid #f1b9b4;border-radius:10px;background:#fff4f2;color:#9b2c22;font-size:14px}
.form-error[hidden]{display:none}
#study-next{margin-left:auto;white-space:nowrap;min-height:44px;padding:11px 17px;border:1px solid #225f4b;border-radius:10px;background:#225f4b;color:#fff;font-weight:650}
#study-next:hover{background:#1b4d3d}
#study-next:focus-visible{outline:3px solid #9bbf9e;outline-offset:2px}
#study-next[hidden]{display:none}
#study-next:not([hidden])+#study-close{margin-left:0}

/* On phones a study session uses the full width; the study bar's Back button is the way out. */
@media(max-width:600px){
 body:has(#study-screen:not([hidden])) #nav{display:none}
 #study-screen{left:0!important}
 .study-bar{min-height:0;gap:8px;padding:8px 10px}
 .study-bar strong{flex:1 1 100%;order:-1;font-size:14px;line-height:1.3}
 .study-bar button{min-height:40px;padding:8px 12px;font-size:14px}
 #study-next{margin-left:0}
}

/* A smaller floating Menu button on phones covers less of the page. */
@media(max-width:600px){#nav .nav-toggle{min-height:40px;padding:8px 14px;font-size:14px}}

/* Reminder for learners who chose "Find my gaps first". */
.starting-reminder{margin-top:24px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;border-color:#9ec8ae;background:#f7fbf5}
.starting-reminder>div:first-child{flex:1 1 320px;min-width:0}
.starting-reminder h2{margin:6px 0}

.setting-note{color:#5b6f66;font-size:12.5px;line-height:1.45}
.storage-notice{margin-top:24px;display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;justify-content:space-between}
.storage-notice>div{flex:1 1 320px;min-width:0}
.storage-notice p{margin:6px 0 0;color:#47594f}
.storage-notice summary{cursor:pointer;color:#225f4b;font-weight:600;margin-top:6px}

/* First-time questionnaire: three short sections in one dialog. */
.setting-group{margin-top:16px;padding-top:14px;border-top:1px solid #e1e9e3}
.setting-group h3{margin:0 0 8px;font-size:15px;color:#1f4d3d}
.setting-group .setting-note{display:block;margin-top:4px}
.grade .grade-target{display:block;margin-top:4px;color:#225f4b;font-weight:600}
.profile-prompt{margin-top:24px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;border-color:#9ec8ae;background:#f7fbf5}
.profile-prompt>div:first-child{flex:1 1 320px;min-width:0}
.profile-prompt h2{margin:6px 0}

/* Welcome card: equal space above and below the two buttons, and no extra space under the last line. */
.first-setup .actions{margin:0 0 26px}
.first-setup>:last-child{margin-bottom:0}

/* The plan questionnaire is a full-screen page with a pinned header and pinned Save / Cancel. */
#settings.setup-full{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;inset:0;padding:0;border:0;border-radius:0;overflow:auto;background:#fff}
#settings.setup-full::backdrop{background:#f4f6f1}
#settings.setup-full .setup-page{box-sizing:border-box;max-width:640px;min-height:100%;margin:0 auto;padding:0 20px;display:flex;flex-direction:column}
#settings.setup-full .dialog-head{position:sticky;top:0;z-index:2;background:#fff;padding:max(18px,env(safe-area-inset-top)) 0 10px;border-bottom:1px solid #e1e9e3;gap:12px}
#settings.setup-full .dialog-head h2{margin:4px 0 0}
#settings.setup-full .actions{position:sticky;bottom:0;z-index:2;margin-top:auto;background:#fff;padding:12px 0 max(16px,env(safe-area-inset-bottom));border-top:1px solid #e1e9e3}
#settings.setup-full .form-error{margin-bottom:12px}

/* Two-step topic card: Learn & practise, then Topic Test. */
.flow-track.flow-track-2{grid-template-columns:repeat(2,1fr)}
.flow-track.flow-track-2:before{left:25%;right:25%}
.flow-track.flow-track-2:after{left:25%;width:calc(50% * min(var(--step),1))}
.flow-cards.flow-cards-2{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.flow-text-link{display:inline;min-height:0;padding:0;border:0;background:none;color:#225f4b;font:inherit;font-weight:650;text-decoration:underline;cursor:pointer}