:root{--bg:#12111a;--surface:#1b1a26;--text:#f4f1ea;--muted:#8b869c;--accent:#a78bfa;--good:#4ade80;--again:#fb7185;--border:#2a2836;--sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--serif:ui-serif, Georgia, "Times New Roman", serif;font:17px/1.5 var(--sans);color:var(--text);background:var(--bg);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:var(--bg);overscroll-behavior:none;min-height:100svh;margin:0}#root{flex-direction:column;min-height:100svh;display:flex}button{font:inherit;color:inherit;border:1px solid var(--border);background:var(--surface);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:12px;padding:14px 20px}button:active{transform:translateY(1px)}.app{width:100%;max-width:34rem;padding:max(12px, env(safe-area-inset-top)) 20px max(16px, env(safe-area-inset-bottom)) 20px;flex-direction:column;flex:1;margin:0 auto;display:flex}.state{text-align:center;color:var(--muted);flex:1;place-content:center;padding:24px;display:grid}.state .detail{opacity:.7;margin-top:8px;font-size:14px}.bar{letter-spacing:.04em;color:var(--muted);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:13px;display:flex}.card{flex-direction:column;flex:1;justify-content:center;gap:24px;padding:24px 0;display:flex}.sentence{font-family:var(--serif);text-wrap:balance;margin:0;font-size:clamp(1.5rem,6vw,2rem);line-height:1.45}.blank{border-bottom:2px solid var(--accent);color:var(--muted);font-family:var(--sans);margin:0 .1em;padding:0 .35em;font-size:.75em;font-style:italic;display:inline-block}.blank--free{opacity:.55;border-bottom-style:dashed}.answer{color:var(--accent);font-weight:600}.translation{color:var(--muted);text-wrap:pretty;margin:0;font-size:1rem}.reveal{width:100%}.grades{grid-template-columns:1fr 1fr;gap:12px;display:grid}.grades button{padding:18px 20px;font-weight:500}.again{color:var(--again);border-color:color-mix(in srgb, var(--again) 35%, transparent)}.good{color:var(--good);border-color:color-mix(in srgb, var(--good) 35%, transparent)}.done .sentence{color:var(--muted)}.backup{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:flex}.backup button{color:var(--muted);background:0 0;border-radius:8px;padding:6px 12px;font-size:13px}.backup-message{text-align:right;margin-left:auto}
