/* Typing tests and Krutidev converters */
@font-face{font-family:"KD Devanagari";src:url(/vendor/fonts/kd-devanagari.woff2) format("woff2");font-display:swap}
.kd{font-family:"KD Devanagari",var(--font)!important;font-size:1.12em}
.ty-opts{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:flex-end}
.ty-opts .field{min-width:0}
.ty-stats{margin-top:14px}
.ty-stats b{font-size:24px}
.ty-text{position:relative;margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;
  font-size:20px;line-height:1.75;max-height:13.5em;overflow:auto;color:var(--sub);overflow-wrap:break-word;user-select:none;-webkit-user-select:none}
.ty-text[lang=hi]{font-size:21px;line-height:1.9}
.ty-text span.ok{color:#2f7a3d}
.ty-text span.bad{color:#b3261e;background:#fde0de;border-radius:3px}
.ty-text span.cur{box-shadow:inset 0 -3px 0 var(--btn-orange,#e4551f);color:var(--text)}
.ty-text span.sp.bad{background:#f7b8b8}
textarea.ty-in{width:100%;margin-top:12px;min-height:110px;font-family:var(--font);font-size:18px;line-height:1.6;resize:vertical}
textarea.ty-in[lang=hi]{font-size:20px}
textarea.ty-in:disabled{opacity:.6}
.ty-hint{margin:8px 2px 0;font-size:13.5px;color:var(--muted)}
.ty-alt{margin:8px 2px 0;font-size:13.5px;color:var(--sub);display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.ty-alt code{background:var(--surface2);border:1px solid var(--line);border-radius:7px;padding:2px 7px;font-size:13px}
.ty-alt .kd{font-size:17px}
.ty-result{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.ty-result h3{margin:0 0 4px;font-size:18px}
.ty-big{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.ty-big b{font-size:46px;line-height:1.1;color:var(--brand);font-variant-numeric:tabular-nums}
.ty-big span{color:var(--muted);font-size:15px}
.ty-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:12px}
.ty-grid div{background:var(--surface2);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.ty-grid span{display:block;font-size:12.5px;color:var(--muted)}
.ty-grid b{font-size:20px;font-variant-numeric:tabular-nums}
.ty-keys{margin-top:14px;font-size:14px}
.ty-keys summary{cursor:pointer;font-weight:600}
.ty-keys table{border-collapse:collapse;margin-top:8px;width:100%;max-width:640px}
.ty-keys td,.ty-keys th{border:1px solid var(--line);padding:4px 8px;text-align:left}
.ty-keys th{background:var(--surface2)}
.ty-keys code{font-size:14px}
/* converters */
.kdc-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kdc-row{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-top:10px}
textarea.kdc-area{width:100%;min-height:220px;font-family:var(--font);font-size:17px;line-height:1.6}
textarea.kdc-area.kd{font-size:20px}
@media (max-width:700px){
  .kdc-two{grid-template-columns:1fr}
  .ty-text{font-size:18px;padding:12px 14px;max-height:11em}
  .ty-text[lang=hi]{font-size:19px}
  .ty-stats{grid-template-columns:1fr 1fr 1fr}
  .ty-stats div{padding:6px 10px 18px}
  .ty-stats b{font-size:20px}
  .ty-big b{font-size:38px}
}