.typ{position:absolute;inset:0;display:flex;flex-direction:column;font-family:var(--mono);color:var(--text);background:radial-gradient(120% 80% at 50% -10%,rgba(255,111,181,.08),transparent 55%),var(--ink);overflow:hidden}.typ-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 18px;padding:13px 20px 12px;border-bottom:1px solid var(--line)}.typ-title{display:flex;align-items:center;font-size:14px;letter-spacing:.24em;color:var(--text)}.typ-dot{width:8px;height:8px;border-radius:50%;margin-right:9px;background:var(--accent);box-shadow:0 0 9px var(--accent)}.typ-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px}.typ-seg{display:inline-flex;border:1px solid var(--line-2);border-radius:var(--r-sm);overflow:hidden}.typ-seg-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;background:var(--ink-2);border:none;border-right:1px solid var(--line-2);color:var(--text-dim);font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .12s,color .12s}.typ-seg-btn:last-child{border-right:none}.typ-seg-btn:hover{color:var(--text);background:#ffffff0a}.typ-seg-btn.on{color:var(--ink);background:var(--accent)}.typ-seg-btn:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.typ-seg-n{font-style:normal;font-size:8.5px;opacity:.65}.typ-seg-btn.on .typ-seg-n{opacity:.8}.typ-stats{display:flex;gap:16px}.typ-stat{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}.typ-stat i{font-style:normal;font-size:8px;letter-spacing:.14em;color:var(--text-faint);text-transform:uppercase}.typ-stat b{font-family:var(--serif);font-weight:500;font-size:18px;color:var(--text)}.typ-stat b em{font-style:normal;font-size:11px;color:var(--text-faint)}.typ-mono{font-variant-numeric:tabular-nums}.typ-new{padding:7px 14px;background:transparent;border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--text-dim);font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .12s,color .12s,background .12s}.typ-new:hover{color:var(--text);border-color:var(--accent);background:#ff6fb514}.typ-new:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.typ-stage{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:clamp(18px,4vh,34px);padding:clamp(16px,4vh,40px) clamp(20px,6vw,80px);overflow:auto;cursor:text}.typ-lanes{display:flex;flex-direction:column;gap:12px;width:100%;max-width:860px;margin:0 auto}.typ-lane{display:flex;align-items:center;gap:12px}.typ-lane-tag{flex:0 0 auto;width:52px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}.typ-lane-tag.ghost{color:var(--text-faint)}.typ-track{position:relative;flex:1;height:8px;background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-pill);overflow:visible}.typ-fill{position:absolute;inset:0 auto 0 0;height:100%;border-radius:var(--r-pill);transition:width .12s linear}.typ-fill.you{background:var(--accent);box-shadow:0 0 10px #ff6fb566}.typ-fill.ghost{background:var(--line-2)}.typ-runner{position:absolute;top:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;transform:translateY(-50%);transition:left .12s linear}.typ-runner.you{background:var(--accent);box-shadow:0 0 10px var(--accent)}.typ-runner.ghost{background:var(--text-dim);border:1px solid var(--text-faint)}.typ-passage-wrap{width:100%;max-width:860px;margin:0 auto}.typ-passage{margin:0;font-family:var(--mono);font-size:clamp(18px,2.6vw,28px);line-height:1.7;letter-spacing:.01em;word-break:break-word;transition:opacity .2s}.typ-passage.dim{opacity:.9}.typ-ch{position:relative;color:var(--text-faint);transition:color .06s}.typ-ch.space{white-space:pre}.typ-ch.pending{color:var(--text-faint)}.typ-ch.correct{color:var(--accent)}.typ-ch.wrong{color:var(--warn);background:#ff6b8529;border-radius:3px}.typ-ch.wrong.space{background:#ff6b8547}.typ-ch.caret{color:var(--text)}.typ-ch.caret:before{content:"";position:absolute;left:-2px;top:.1em;bottom:.1em;width:2px;background:var(--accent);border-radius:1px;animation:typ-blink 1s steps(1) infinite}@keyframes typ-blink{0%,49%{opacity:1}50%,to{opacity:0}}.typ-cite{display:block;margin-top:16px;font-style:normal;font-size:11px;letter-spacing:.06em;color:var(--text-faint)}.typ-hint{margin:0 auto;max-width:860px;width:100%;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);text-align:center}.typ-capture{position:absolute;width:1px;height:1px;padding:0;border:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;opacity:0}.typ-overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:24px;background:#07090ebd;backdrop-filter:blur(6px);animation:typ-fade .25s ease}@keyframes typ-fade{0%{opacity:0}to{opacity:1}}.typ-result{width:min(440px,100%);text-align:center;padding:30px 28px 26px;background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-lg);box-shadow:var(--sh-2)}.typ-result-mark{font-size:40px;color:var(--text-dim)}.typ-result-mark.win{color:var(--accent);text-shadow:0 0 24px rgba(255,111,181,.5)}.typ-result-title{margin:8px 0 4px;font-family:var(--serif);font-weight:500;font-size:26px;color:var(--text)}.typ-result-sub{margin:0 0 20px;font-size:11px;letter-spacing:.04em;color:var(--text-faint)}.typ-result-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:0 0 22px}.typ-result-stats div{padding:12px 6px;background:var(--ink-3);border:1px solid var(--line);border-radius:var(--r-sm)}.typ-result-stats dt{font-size:8px;letter-spacing:.14em;color:var(--text-faint);text-transform:uppercase}.typ-result-stats dd{margin:5px 0 0;font-family:var(--serif);font-size:24px;color:var(--text)}.typ-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.typ-result-btn{padding:9px 16px;background:transparent;border:1px solid var(--line-2);border-radius:var(--r-sm);color:var(--text-dim);font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .12s,color .12s,background .12s}.typ-result-btn:hover{color:var(--text);border-color:var(--accent)}.typ-result-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.typ-result-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--ink);font-weight:600}.typ-result-btn.primary:hover{filter:brightness(1.08);color:var(--ink)}.typ-foot{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 14px;padding:9px 20px;border-top:1px solid var(--line);font-size:9px;letter-spacing:.06em;color:var(--text-faint);text-transform:uppercase}.typ-cred{color:var(--text-faint);opacity:.7}@media(max-width:640px){.typ-head{padding:11px 14px}.typ-stats{gap:12px}.typ-stat b{font-size:16px}.typ-stage{padding:16px 18px}.typ-result-stats{grid-template-columns:repeat(2,1fr)}.typ-foot .typ-cred{display:none}}@media(prefers-reduced-motion:reduce){.typ-ch.caret:before{animation:none}.typ-overlay{animation:none}.typ-fill,.typ-runner,.typ-passage,.typ-ch{transition:none}}