@font-face{font-family:Manrope;src:url('./fonts/manrope-variable.ttf') format('truetype');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:Nunito;src:url('./fonts/nunito-variable.ttf') format('truetype');font-weight:200 1000;font-style:normal;font-display:swap}
:root{color-scheme:dark;font-family:Manrope,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;--background:#1c1d1f;--surface:#242628;--ink:#dededb;--secondary:#a8ada9;--muted:#929894;--line:#3b3f3e;--accent:#6ec6f0;--accent-text:#6ec6f0;--accent-soft:#6ec6f014;--button-ink:#1c3040;--choice-line:#454b47;--icon:#fff;--correct-bg:#26372d;--correct-line:#54795e;--correct-ink:#a8d5b5;--wrong-bg:#392b2a;--wrong-line:#8b5752;--wrong-ink:#eab2a9;color:var(--ink);background:var(--background)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;padding-bottom:calc(76px + env(safe-area-inset-bottom,0px));background:var(--background);color:var(--ink);-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;min-height:44px}button:disabled{cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.header{max-width:1320px;margin:auto;padding:18px 48px;display:flex;align-items:center}
/* Keep the established wordmark typography and dot. */
.brand{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:2.25rem;font-weight:800;letter-spacing:-.09em;text-decoration:none;line-height:1;color:var(--ink)}
.main{width:min(560px,calc(100% - 40px));margin:0 auto}.landing{width:min(480px,100%);margin:0 auto;min-height:calc(100svh - 148px);display:flex;flex-direction:column;justify-content:center;padding:24px 0 70px}.landing h1{font-size:clamp(1.75rem,4vw,2.375rem);font-weight:550;letter-spacing:-.045em;line-height:1.2;margin:0 0 28px}.input-label{display:block;font-size:.8125rem;color:var(--secondary);margin-bottom:10px;font-weight:450}
.search-box{display:flex;align-items:center;gap:10px;min-height:56px;padding:5px 6px 5px 17px;background:var(--surface);border:1px solid var(--line);border-radius:12px;transition:border-color .15s,box-shadow .15s}.search-box:focus-within{border-color:var(--accent-text);box-shadow:0 0 0 3px var(--accent-soft)}.search-box input{background:transparent;border:0;outline:none!important;box-shadow:none;min-width:0;width:100%;padding:10px 0;font-size:1rem;font-weight:450;color:var(--accent-text);caret-color:var(--accent-text)}.search-box input::placeholder{color:var(--muted);opacity:1}.submit{flex:none;background:var(--accent);color:var(--button-ink);border:0;width:40px;min-height:40px;height:40px;border-radius:8px;display:grid;place-items:center}.submit:hover,.next:hover{filter:brightness(1.08)}.submit svg{width:20px;height:20px}
.suggestions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:13px;font-size:.8125rem;color:var(--muted)}.suggestions button{border:0;background:transparent;padding:5px 7px;min-height:32px;font-size:.8125rem;color:var(--secondary);border-radius:6px}.suggestions button:hover{background:var(--accent-soft);color:var(--accent-text)}.availability{font-size:.75rem;color:var(--muted);margin:17px 0 0;line-height:1.5}.search-result{margin-top:16px;font-size:.875rem;line-height:1.6;color:var(--secondary)}.search-result:empty{display:none}.search-result p{margin:0 0 10px}.matches{display:flex;gap:8px;flex-wrap:wrap}.match{background:var(--surface);border:1px solid var(--line);padding:10px 14px;border-radius:10px;text-align:left}.match strong{display:block;font-size:1rem;font-weight:600;color:var(--accent-text)}.match span{font-size:.8125rem;color:var(--secondary)}
.practice{padding:24px 0 16px}.practice-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:14px}.practice-toolbar h1{font-size:1.5rem;font-weight:550;letter-spacing:-.035em;margin:0;color:var(--accent-text)}.plain-button{border:0;background:transparent;font-size:.8125rem;padding:8px 0;color:var(--secondary)}.plain-button:hover{color:var(--accent-text)}.question-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:25px 26px}.target{display:flex;flex-wrap:wrap;gap:8px;align-items:center;line-height:1.5;font-size:.8125rem;color:var(--secondary)}.target-name{font-weight:550}.subject{background:var(--accent-soft);color:var(--accent-text);padding:3px 8px;border-radius:6px}.region{font-size:.75rem;line-height:1.5;color:var(--muted);margin-top:8px}
.question{font-size:1.625rem;font-weight:450;line-height:1.6;letter-spacing:-.025em;margin:23px 0 25px;overflow-wrap:anywhere}.question:focus{outline:none}.blank{display:inline-block;min-width:64px;text-align:center;vertical-align:baseline;line-height:1.15;border-bottom:1px solid var(--accent);color:var(--accent-text);padding:0 5px 2px}.blank.is-filled{font-weight:550}
.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.answer-choice{padding:12px 14px;border:1px solid var(--choice-line);border-radius:9px;background:transparent;font-size:.9375rem;min-height:48px;text-align:left;display:flex;align-items:center;justify-content:space-between;gap:10px;overflow-wrap:anywhere;transition:background .15s,border-color .15s}.answer-choice:hover:not(:disabled){background:var(--accent-soft);border-color:var(--accent-text);color:var(--accent-text)}.answer-choice.correct{background:var(--correct-bg);border-color:var(--correct-line);color:var(--correct-ink)}.answer-choice.wrong{background:var(--wrong-bg);border-color:var(--wrong-line);color:var(--wrong-ink)}.choice-mark{font-weight:700;flex:none}
.feedback{border-top:1px solid var(--line);padding-top:17px;margin-top:20px;line-height:1.55}.feedback h2{font-size:.9375rem;font-weight:650;margin:0 0 8px;color:var(--correct-ink)}.question-card:has(.wrong) .feedback h2{color:var(--wrong-ink)}.feedback p{font-size:.9375rem;margin:7px 0;color:var(--secondary)}.feedback .correct-form{font-weight:550;color:var(--ink)}.correct-form span{color:var(--accent-text)}.feedback .subtle{font-size:.8125rem;color:var(--muted)}.next{margin-top:18px;border:0;background:var(--accent);color:var(--button-ink);border-radius:9px;padding:12px 20px;min-height:44px;width:100%;font-size:.875rem;font-weight:650}.loading{padding:20vh 0;text-align:center;font-size:.9375rem;line-height:1.7;color:var(--secondary)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(max-width:620px){
 .header{padding:10px 14px}.brand{font-size:1.5rem;letter-spacing:-.075em}.main{width:calc(100% - 32px)}.landing{min-height:calc(100svh - 120px);padding:16px 0 48px}.landing h1{font-size:1.8125rem;margin-bottom:23px}.search-box{min-height:50px;padding:4px 5px 4px 13px;border-radius:10px}.search-box input{padding:8px 0;font-size:1rem}.submit{width:36px;min-height:36px;height:36px;border-radius:7px}.input-label{font-size:.8125rem;margin-bottom:9px}.availability{margin-top:13px}.suggestions{margin-top:9px}.practice{padding:6px 0 10px}.practice-toolbar{margin-bottom:8px}.practice-toolbar h1{font-size:1.3125rem}.plain-button{min-height:34px;padding:5px 0}.question-card{padding:16px;border-radius:13px}.target{gap:5px 6px;font-size:.8125rem;line-height:1.35}.subject{padding:2px 7px}.region{font-size:.6875rem;line-height:1.4;margin-top:6px}.question{font-size:1.3125rem;line-height:1.5;margin:17px 0}.blank{min-width:54px;padding:0 4px 2px}.answer-grid{gap:8px}.answer-choice{min-height:44px;padding:10px 11px;font-size:.9375rem}.feedback{margin-top:14px;padding-top:12px;line-height:1.5}.feedback p{margin:6px 0}.feedback .subtle{display:none}.next{margin-top:13px;padding:10px 18px}.question-card:has(.feedback) .answer-choice:not(.correct):not(.wrong){display:none}.question-card:has(.feedback) .answer-grid:has(.correct):not(:has(.wrong)){grid-template-columns:1fr}
}
@media(max-width:620px) and (max-height:720px){.question-card{padding:12px 14px}.question{margin:12px 0;font-size:1.25rem}.feedback{margin-top:11px;padding-top:9px}.feedback p{margin:5px 0}.next{margin-top:10px}.region{margin-top:5px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Rounded display typography; small interface text and the logo retain their fonts. */
.landing h1,.practice-toolbar h1,.question{font-family:Nunito,Manrope,ui-sans-serif,system-ui,sans-serif}
.landing h1{font-weight:900;letter-spacing:-.035em}
.practice-toolbar h1{font-weight:800}
.question{font-weight:700;letter-spacing:-.02em}

/* Flag language picker; exercise feedback keeps its own red and green palette. */
.header{justify-content:space-between}
.landing{min-height:calc(100svh - 156px)}
.language-toggle{display:flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:10px;border:0;border-radius:10px;background:transparent;color:var(--icon)}
.language-toggle:hover{background:var(--surface)}
.language-option img{display:block;flex:none;width:32px;height:32px}
.language-toggle .globe-icon{width:24px;height:24px}
.language-menu{position:fixed;inset:70px max(20px,calc((100vw - 1224px)/2)) auto auto;margin:0;width:min(276px,calc(100vw - 28px));max-height:calc(100dvh - 100px);overflow-y:auto;padding:10px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 36px #00000045}
.language-menu::backdrop{background:transparent}
.language-section h3{margin:5px 9px 8px;font-size:.6875rem;font-weight:650;letter-spacing:.045em;color:var(--secondary)}
.language-section+.language-section{border-top:1px solid var(--line);margin-top:10px;padding-top:14px}
.language-option{display:flex;align-items:center;gap:11px;width:100%;padding:10px 8px;min-height:54px;background:transparent;border:0;border-radius:9px;text-align:left;font-size:.875rem}
.language-option:hover,.language-option[aria-pressed="true"]{background:var(--accent-soft)}
.language-check{margin-left:auto;color:var(--accent-text);font-weight:700}
@media(max-width:620px){.landing{min-height:calc(100svh - 140px)}.language-menu{top:60px;right:14px}}

/* Warm paper light theme. Soft blue accents complement the green/red answer feedback. */
html[data-theme="light"]{color-scheme:light;--background:#f5f1e8;--surface:#fcf9f2;--ink:#302e29;--secondary:#646158;--muted:#767268;--line:#d8d1c4;--choice-line:#c5bdaf;--accent:#2c3780;--accent-text:#2c3780;--button-ink:#ffffff;--accent-soft:#2c378014;--icon:#39372f;--correct-bg:#e6f0e3;--correct-line:#8eac88;--correct-ink:#285f37;--wrong-bg:#f7e7e1;--wrong-line:#c48e83;--wrong-ink:#993e34}
html[data-theme="light"] .search-box input{color:var(--ink)}
html[data-theme="light"] :is(.answer-choice:hover:not(:disabled),.search-box:focus-within){border-color:var(--accent-text)}
html[data-theme="light"] .language-menu{box-shadow:0 12px 36px #44371c18}
html[data-theme="light"] :is(button,a,input):focus-visible{outline-color:var(--accent-text)}
.theme-dock{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);z-index:10}
.theme-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:84px;height:44px;min-height:44px;padding:4px;border:1px solid var(--line);border-radius:999px;background:var(--surface);box-shadow:0 2px 8px #0000000a;isolation:isolate}
.theme-switch::before{content:"";position:absolute;left:4px;top:4px;width:34px;height:34px;border-radius:50%;background:#414342;box-shadow:0 1px 4px #00000025;transform:translateX(40px);transition:transform .28s cubic-bezier(.22,.8,.25,1),background .25s}
.theme-icon{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;color:var(--muted);transition:color .25s}
.theme-icon svg{width:18px;height:18px}
.theme-moon{color:#f1efdf}
html[data-theme="light"] .theme-switch::before{transform:translateX(0);background:#fffdf7;box-shadow:0 1px 4px #66543320}
html[data-theme="light"] .theme-sun{color:#2c3780}
html[data-theme="light"] .theme-moon{color:#8e877b}
body,.question-card,.search-box,.language-menu{transition:background-color .22s,color .22s,border-color .22s}
@media(prefers-reduced-motion:reduce){.theme-switch::before,.theme-icon,body,.question-card,.search-box,.language-menu{transition:none}}

/* Optional grammar hint, hidden until requested for each exercise. */
.hint-toolbar{display:flex;justify-content:flex-end;margin:-7px -5px 0 0}
.hint-toggle{display:flex;align-items:center;gap:9px;min-height:36px;padding:5px;border:0;border-radius:8px;background:transparent;color:var(--secondary);font-size:.75rem;font-weight:550}
.hint-toggle:hover{color:var(--ink)}
.hint-track{position:relative;width:34px;height:20px;border:1px solid var(--line);border-radius:999px;background:var(--background);transition:background-color .2s,border-color .2s}
.hint-track::before{content:"";position:absolute;left:3px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--muted);transition:transform .22s cubic-bezier(.22,.8,.25,1),background-color .2s}
.hint-toggle[aria-checked="true"] .hint-track{background:var(--accent);border-color:var(--accent)}
.hint-toggle[aria-checked="true"] .hint-track::before{transform:translateX(14px);background:var(--button-ink)}
.hint-details{margin-top:9px;padding:12px 13px;border:1px solid var(--line);border-radius:10px}
.hint-details[hidden]{display:none}
@media(max-width:620px){.hint-toolbar{margin:-5px -4px 0 0}.hint-details{padding:10px}}
@media(prefers-reduced-motion:reduce){.hint-track,.hint-track::before{transition:none}}

/* The optional hint shows only the tense in the active blue accent. */
.hint-details{padding:0;border:0;border-radius:0}
.tense-hint{display:inline-block;padding:5px 9px;border-radius:6px;background:var(--accent-soft);color:var(--accent-text);font-size:.8125rem;font-weight:550;line-height:1.5}

.feedback .sentence-translation{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);color:var(--ink);line-height:1.6}
.translation-label{display:block;margin-bottom:4px;font-size:.6875rem;font-weight:600;color:var(--muted)}

.verb-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.verb-shortcuts button{min-height:44px;padding:8px 16px;border:1px solid transparent;border-radius:9px;background:var(--accent-soft);color:var(--accent-text);font-size:.9375rem;font-weight:550;transition:border-color .15s,background .15s}
.verb-shortcuts button:hover{border-color:var(--accent-text)}
@media(max-width:620px){.verb-shortcuts{gap:7px;margin-top:14px}.verb-shortcuts button{padding:8px 13px;font-size:.875rem}}

/* Keep the revealed tense and Hint switch together in one responsive row. */
.hint-toolbar{align-items:center;gap:12px}
.hint-toolbar .hint-details{flex:1;min-width:0;margin-top:0}
.hint-toolbar .hint-toggle{flex-shrink:0;margin-left:auto}