/* 打字練習頁專用樣式；分頁與欄位沿用 site.css 的 .qr-tabs .qr-field */
.tt-tabs { grid-template-columns: repeat(2, 1fr); }
.tt-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.tt-row > * { min-width: 0; }
.tt-chk { display: flex; align-items: center; gap: 8px; margin: 8px 0; font-weight: 600; cursor: pointer; }
.tt-chk input { width: 22px; height: 22px; flex: none; }
.tt-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 0 8px; text-align: center; }
.tt-stats > div { background: #eff4ff; border: 1px solid var(--brand); border-radius: 10px; padding: 6px 4px; min-width: 0; }
.tt-stats dt { font-size: .9rem; color: var(--muted); }
.tt-stats dd { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--brand-dark); overflow-wrap: anywhere; }
.tt-stats small { font-size: .8rem; font-weight: 600; color: var(--muted); margin-left: 2px; }
.tt-text { border: 2px solid var(--line); border-radius: 12px; padding: 12px 14px; font-size: 1.25rem; line-height: 2; max-height: 12.5em; overflow-y: auto; background: #fff; overflow-wrap: anywhere; }
.tt-text[lang=en] { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.1rem; line-height: 1.9; }
.tt-text span { border-radius: 3px; }
.tt-text .ok { color: #15803d; }
.tt-text .bad { color: #b91c1c; background: #fee2e2; text-decoration: underline wavy #b91c1c; }
.tt-text .cur { background: #fde68a; box-shadow: 0 2px 0 var(--brand); }
.tt-input { width: 100%; box-sizing: border-box; min-height: 110px; margin-top: 10px; padding: 10px 12px; font-size: 1.2rem; line-height: 1.7; border: 2px solid var(--brand); border-radius: 12px; resize: vertical; font-family: inherit; }
.tt-input:disabled { background: #f3f4f6; }
.tt-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.tt-go { min-height: 50px; font-size: 1.05rem; flex: 1 1 150px; }
.tt-result { margin-top: 12px; background: #ecfdf5; border: 2px solid var(--ok); border-radius: 12px; padding: 4px 14px 14px; }
.tt-result dl { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 0; }
.tt-result dl > div { min-width: 0; }
.tt-result dt { color: var(--muted); font-size: .95rem; }
.tt-result dd { margin: 0; font-weight: 700; font-size: 1.15rem; overflow-wrap: anywhere; }
.tt-big dd { font-size: 1.8rem; color: var(--brand-dark); }
.tt-h2 { font-size: 1.05rem; margin: .8rem 0 .3rem; }
.tt-wrong { margin: 0; padding-left: 1.2em; }
.tt-warn { background: #fff7ed; border-left: 4px solid #ea580c; padding: 10px 14px; border-radius: 6px; font-size: 1rem; }
@media (max-width: 480px) { .tt-stats dd { font-size: 1.25rem; } .tt-text { font-size: 1.15rem; } }