.tbe-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:22px;transition:border-color .2s}.tbe-card:focus-within{border-color:#00d4ff66}.tbe-card.tbe-error{animation:.25s tbeShake}@keyframes tbeShake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.tbe-display{letter-spacing:.02em;word-break:break-word;user-select:none;min-height:60px;margin-bottom:18px;font-size:1.05rem;line-height:1.95}.tbe-char{white-space:pre-wrap;display:inline}.tbe-correct{color:var(--accent)}.tbe-wrong{color:var(--red);background:#ff4d6d21;border-radius:2px}.tbe-pending{color:var(--muted)}.tbe-cursor{color:var(--muted);position:relative}.tbe-cursor:before{content:"";background:var(--accent);border-radius:1px;width:2px;animation:.9s infinite tbeBlink;position:absolute;top:.15em;bottom:.15em;left:-1px}.tbe-trail:before{left:0}@keyframes tbeBlink{0%,49%{opacity:1}50%,to{opacity:0}}.tbe-input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);font-family:var(--font-mono);caret-color:var(--accent);border-radius:8px;outline:none;padding:12px 15px;font-size:.92rem;transition:border-color .2s}.tbe-input:focus{border-color:var(--accent)}.tbe-input-err{border-color:var(--red)}.tbe-input::placeholder{color:var(--muted)}.tbe-hint{color:var(--muted);text-align:center;letter-spacing:.05em;margin-top:10px;font-size:.7rem}.oe-card{background:var(--surface);border:1px solid var(--border);cursor:text;border-radius:12px;padding:28px 28px 20px;transition:border-color .2s;position:relative}.oe-card:focus-within{border-color:#00d4ff66;box-shadow:0 0 0 1px #00d4ff26}.oe-card.oe-error{animation:.22s oeShake}@keyframes oeShake{0%,to{transform:translate(0)}20%{transform:translate(-5px)}60%{transform:translate(5px)}80%{transform:translate(-3px)}}.oe-hidden{opacity:0;pointer-events:none;width:1px;height:1px;font-size:16px;position:absolute;top:0;left:0}.oe-wrap{font-family:var(--font-mono);letter-spacing:.02em;word-break:break-word;user-select:none;min-height:80px;font-size:1.12rem;line-height:2;position:relative}.oe-char{white-space:pre-wrap;display:inline;position:relative}.oe-src{color:var(--oe-src-color,#2e3d4a)}.oe-ok{color:#d4e8f5}.oe-ok.oe-space{color:#0000}.oe-err{color:var(--red);text-underline-offset:3px;text-decoration:underline wavy #ff4d6da6}.oe-err.oe-space{color:#0000;background:#ff4d6d38;border-radius:3px}.oe-caret{background:var(--accent);pointer-events:none;border-radius:2px;width:2.5px;animation:1.1s infinite oeBlink;display:inline-block;position:absolute;top:.14em;bottom:.14em;left:-1.5px;box-shadow:0 0 8px #00d4ffb3}.oe-caret-end{position:relative;left:0}@keyframes oeBlink{0%,44%{opacity:1}56%,to{opacity:0}}.oe-hint{color:var(--muted);text-align:center;letter-spacing:.05em;margin-top:14px;font-size:.7rem}.tbe-mobile-wrap{flex-direction:column;gap:0;width:calc(100% + 24px);min-width:0;margin-left:-12px;margin-right:-12px;display:flex}.mobile-layout .tbe-input{opacity:.85;cursor:default;height:44px;padding:10px 12px;font-size:16px!important}.mobile-layout .tbe-display{margin-bottom:12px;font-size:1.2rem;line-height:1.65}.oe-mobile-wrap{flex-direction:column;gap:0;width:calc(100% + 24px);min-width:0;margin-left:-12px;margin-right:-12px;display:flex}.mobile-layout .oe-wrap{font-size:1.25rem;line-height:1.9}.mobile-layout .oe-card{padding:18px 18px 14px}.mobile-layout .oe-hidden{opacity:0;pointer-events:none;width:1px;height:1px;position:fixed;top:-9999px;left:-9999px;font-size:16px!important}.screen-header__actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.mobile-layout .screen-header .mode-title{font-size:1rem}.mobile-layout .screen-header .mode-nick{font-size:.68rem}.mobile-layout .screen-header__actions{flex-wrap:wrap;gap:5px;width:100%}.mobile-layout .screen-header__actions .btn{white-space:nowrap;flex-shrink:0}.mobile-layout.keyboard-active .screen-header .mode-title{font-size:.85rem}.mobile-layout.keyboard-active .screen-header .mode-nick{font-size:.58rem}.mobile-layout.keyboard-active .screen-header{margin-bottom:6px}.mobile-layout.keyboard-active .screen-header__actions .btn{min-height:28px;padding:4px 8px;font-size:.63rem}.mobile-layout.vkb-present .mode-bar--inline{flex-flow:row;align-items:center}.mobile-layout.vkb-present .mode-bar--inline .mode-left{min-width:0;overflow:hidden}.mobile-layout.vkb-present .mode-bar--inline .mode-title,.mobile-layout.vkb-present .mode-bar--inline .mode-nick{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.mobile-layout.vkb-present .mode-bar--inline .screen-header__actions{flex-wrap:nowrap;flex-shrink:0;width:auto}
