:root{--accent: #7a6fd0;--accent-2: #9b91e6;--bg: #14121f;--panel: #211d33;--panel-2: #2c2746;--text: #ece9f7;--muted: #a59fc4;--good: #4cc78a;--kin: #d7b24a;--bad: #d9596b}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#2a2444,var(--bg));color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;min-height:100vh}.tt-app{max-width:640px;margin:0 auto;padding:22px 16px 48px}.tt-head h1{margin:0;font-size:30px;letter-spacing:4px;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.tt-sub{color:var(--muted);margin:6px 0 0;font-size:14px;line-height:1.4}.tt-controls{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:18px 0 10px}.tt-modes,.tt-diffs{display:flex;gap:6px}.tt-pill{background:var(--panel);color:var(--muted);border:1px solid #38335a;border-radius:999px;padding:7px 14px;font-size:13px;cursor:pointer;transition:all .15s}.tt-pill:hover{color:var(--text);border-color:var(--accent)}.tt-pill.on{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#fff;border-color:transparent}.tt-status{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px}.tt-chip{background:var(--panel);border:1px solid #38335a;border-radius:8px;padding:5px 10px;font-size:12px;color:var(--muted)}.tt-card{background:var(--panel);border:1px solid #38335a;border-radius:16px;padding:22px;box-shadow:0 18px 40px #00000059}.tt-greeting{font-size:38px;font-weight:700;text-align:center;padding:18px 8px 6px;letter-spacing:.5px}.tt-prompt{text-align:center;color:var(--text);margin:6px 0 18px;font-size:15px}.tt-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}.tt-opt{background:var(--panel-2);color:var(--text);border:1px solid #423b66;border-radius:10px;padding:12px 10px;font-size:15px;cursor:pointer;transition:all .12s}.tt-opt:hover:not(:disabled){border-color:var(--accent);transform:translateY(-1px)}.tt-opt:disabled{cursor:default;opacity:.9}.tt-opt.correct{background:#4cc78a38;border-color:var(--good);color:#d6ffe8}.tt-opt.wrong{background:#d9596b33;border-color:var(--bad);color:#ffd9df}.tt-opt.kin{border-color:var(--kin);color:#ffedbf}.tt-feedback{margin-top:16px;font-size:14px;line-height:1.5;color:var(--muted);min-height:0;opacity:0;transition:opacity .2s}.tt-feedback.show{opacity:1}.tt-feedback.exact{color:#b9f3d4}.tt-feedback.family{color:#ffe6a6}.tt-feedback.miss{color:#f3c0c9}.tt-foot{margin-top:16px;display:flex;justify-content:center}.tt-next{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:15px;font-weight:600;cursor:pointer}.tt-next:hover{filter:brightness(1.08)}.tt-summary{text-align:center;padding:14px 4px}.tt-bigscore{font-size:56px;font-weight:800;background:linear-gradient(90deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.tt-bigscore span{font-size:24px;color:var(--muted);-webkit-text-fill-color:var(--muted)}@media(max-width:420px){.tt-options{grid-template-columns:1fr}.tt-greeting{font-size:30px}}