/* Shared character states — stable cursor hotfix, v0.9.7-alpha.2.
 * Source U+0020, 1ch space advances and engine cursor remain unchanged.
 * The current frame is an out-of-flow 1.25em box, not the glyph/line box.
 */
:root{--typing-done:#436356;--typing-future:#505b6b;--typing-active:#173f73;--typing-active-bg:#e2edff;--typing-active-line:#245fc8;--typing-error:#a02337;--typing-error-bg:#fff0f2;--typing-done-line:#779488}
:root[data-theme="dark"],html.dark,[data-theme="dark"]{--typing-done:#a7c6b9;--typing-future:#c1c8d8;--typing-active:#ebf8ff;--typing-active-bg:#203e53;--typing-active-line:#8ed5ff;--typing-error:#ffb7c0;--typing-error-bg:#40262f;--typing-done-line:#829d92}
.ts-typing{font-kerning:none;font-variant-ligatures:none}
.ts-typing .ts-char[data-type-state]{color:var(--typing-future);background:transparent;border:0;border-radius:3px;outline:none;box-shadow:none;opacity:1;text-decoration:none;position:relative;z-index:0;font-size:inherit;font-weight:inherit;padding:0;transition:none;animation:none}
.ts-typing .ts-char[data-type-state="typed"]{color:var(--typing-done);text-decoration:underline;text-decoration-color:var(--typing-done-line);text-decoration-thickness:1px;text-underline-offset:.23em}
/* Keep letters inline: making every letter inline-block introduces word breaks.
 * A stacking context for every state keeps the frame behind, not over, its glyph.
 * The font-relative height also scales with user text size and browser zoom.
 */
.ts-typing .ts-char[data-type-state="current"]{color:var(--typing-active);background:transparent;outline:none;text-decoration:none;box-shadow:none}
.ts-typing .ts-char[data-type-state]::before{content:none}
.ts-typing .ts-char[data-type-state="current"]::before{
 content:"";position:absolute;pointer-events:none;z-index:-1;
 left:0;right:0;top:50%;bottom:auto;width:auto;min-width:0;max-width:none;
 height:1.25em;min-height:0;max-height:none;transform:translateY(-50%);
 margin:0;padding:0;box-sizing:border-box;border:1px solid var(--typing-active-line);
 border-bottom-width:3px;border-radius:3px;background:var(--typing-active-bg);
 opacity:1;box-shadow:none;outline:none;transition:none;animation:none;
}
.ts-typing .ts-char[data-type-state="error"],.ts-typing .ts-char[data-type-retry="true"]{color:var(--typing-error);background:var(--typing-error-bg);text-decoration:underline wavy var(--typing-error) 2px;text-underline-offset:.23em}
.ts-typing .ts-char[data-type-space="true"]{display:inline-block;width:1ch;min-width:1ch;max-width:1ch;padding:0;white-space:pre;vertical-align:baseline;height:1em;line-height:1;box-sizing:content-box;margin:0}
.ts-typing .ts-char[data-type-space="true"]::after{content:none}
.ts-typing .ts-char[data-type-space="true"][data-type-state="current"]::after,.ts-typing .ts-char[data-type-space="true"][data-type-state="error"]::after{
 /* Draw the familiar space tray without a fallback-font glyph. Reset every legacy
  * pseudo dimension explicitly (app.css formerly supplied a 2px underline height).
  * User-approved geometry: left20%, top80%, width60%.
  * The tray stays inside the space cell and cannot overlap the following letter.
  */
 content:"";position:absolute;pointer-events:none;z-index:1;display:block;
 left:20%;right:auto;top:80%;bottom:auto;width:60%;min-width:0;max-width:none;
 height:.18em;min-height:0;max-height:none;margin:0;padding:0;
 font:inherit;line-height:1;letter-spacing:0;transform:translateY(-50%);
 box-sizing:border-box;border:0;border-left:.065em solid currentColor;
 border-right:.065em solid currentColor;border-bottom:.065em solid currentColor;
 border-radius:0;background:none;color:inherit;opacity:1;
 box-shadow:none;outline:none;transition:none;animation:none;
}
.ts-typing .ts-char.has-first-error[data-type-state="typed"]{text-decoration-style:dotted;text-decoration-thickness:2px}
.ts-typing-legend{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;font:400 12px/1.8 var(--font-ui,system-ui);color:var(--text-2,#59647a);margin:12px 0 16px;letter-spacing:0}
.ts-typing-legend>span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}.ts-typing-legend [aria-hidden]{font-family:var(--font-mono,monospace);padding:0 3px}
.ts-legend-typed{color:var(--typing-done);text-decoration:underline solid var(--typing-done-line) 1px;text-underline-offset:3px}.ts-legend-current{background:var(--typing-active-bg);color:var(--typing-active);outline:2px solid var(--typing-active-line);border-radius:2px;text-decoration:underline;text-underline-offset:3px}.ts-legend-upcoming{color:var(--typing-future)}.ts-legend-error{color:var(--typing-error);text-decoration:underline wavy;text-underline-offset:3px}
/* A neutral target surface keeps the SAME character contrast in all modes. */
#flow-target.target-card{background:var(--surface);color:var(--text);border-color:var(--separator-strong)}
#flow-target.target-card.is-error{background:var(--surface);border-color:var(--typing-error)}
@media(forced-colors:active){.ts-typing .ts-char[data-type-state]{color:CanvasText;background:Canvas;forced-color-adjust:auto}.ts-typing .ts-char[data-type-state="typed"]{text-decoration:underline solid CanvasText 1px}.ts-typing .ts-char[data-type-state="current"]{outline:none;text-decoration:none}.ts-typing .ts-char[data-type-state="current"]::before{border-color:Highlight;background:Canvas}.ts-typing .ts-char[data-type-space="true"]::after{border-color:CanvasText}.ts-typing .ts-char[data-type-state="error"],.ts-typing .ts-char[data-type-retry="true"]{text-decoration:underline wavy CanvasText 2px}.ts-legend-current{outline-color:Highlight}.ts-typing-legend [aria-hidden]{color:CanvasText;background:Canvas}}

@media(prefers-color-scheme:dark){:root[data-theme="system"]{--typing-done:#a7c6b9;--typing-future:#c1c8d8;--typing-active:#ebf8ff;--typing-active-bg:#203e53;--typing-active-line:#8ed5ff;--typing-error:#ffb7c0;--typing-error-bg:#40262f;--typing-done-line:#829d92}}