.keyboard.svelte-w1xbm9{--key-hc: #0077b6;--key-mc: #2a9d8f;--key-lc1: #e76f51;--key-lc2: #457b9d;--key-vowel: #5a6478;--key-mark: #6b4c8a;--key-bg: #f8fafd;--key-border: #dce8f0;--key-radius: 8px;display:flex;flex-direction:column;gap:10px;padding:12px;background:#fff;border:1px solid var(--color-border, #e2eaf2);border-radius:16px;box-shadow:0 4px 20px #0077b614;max-width:600px;margin:0 auto;font-family:inherit}.text-area.svelte-w1xbm9{position:relative;min-height:56px;padding:10px 14px;background:#f0f7ff;border:1px solid #c6ddf0;border-radius:10px;display:flex;align-items:center}.text-display.svelte-w1xbm9{font-size:2rem;line-height:1.4;letter-spacing:.05em;color:#1a1a2e;word-break:break-all}.text-placeholder.svelte-w1xbm9{font-size:.9rem;color:#9ab4c8;font-style:italic}.controls.svelte-w1xbm9{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}.mode-tabs.svelte-w1xbm9{display:flex;gap:4px}.mode-tabs.svelte-w1xbm9 button:where(.svelte-w1xbm9){padding:6px 12px;font-size:.82rem;font-weight:600;border:1.5px solid #c6ddf0;border-radius:20px;background:#fff;color:#5a6478;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.mode-tabs.svelte-w1xbm9 button.active:where(.svelte-w1xbm9){background:var(--key-hc, #0077b6);color:#fff;border-color:var(--key-hc, #0077b6)}.mode-tabs.svelte-w1xbm9 button:where(.svelte-w1xbm9):hover:not(.active){background:#e8f4fc;border-color:#a8c8e0}.toggle-row.svelte-w1xbm9{display:flex;gap:6px}.toggle-btn.svelte-w1xbm9{padding:5px 10px;font-size:.76rem;font-weight:600;border:1.5px solid #c6ddf0;border-radius:16px;background:#fff;color:#5a6478;cursor:pointer;transition:background .15s}.toggle-btn.on.svelte-w1xbm9{background:#e8f4fc;border-color:#89b8d8;color:#005f91}.grid.svelte-w1xbm9{display:flex;flex-direction:column;gap:5px}.key-row.svelte-w1xbm9{display:flex;gap:4px;justify-content:center}.key.svelte-w1xbm9{min-width:44px;min-height:44px;flex:1;display:flex;align-items:center;justify-content:center;font-size:1.3rem;border-radius:var(--key-radius);border:1.5px solid var(--key-border);background:var(--key-bg);cursor:pointer;transition:transform .08s,background .1s;user-select:none;-webkit-user-select:none}.key.svelte-w1xbm9:active{transform:scale(.93)}.key-empty.svelte-w1xbm9{background:transparent;border-color:transparent;pointer-events:none}.consonant-key.svelte-w1xbm9{background:color-mix(in srgb,var(--key-color) 10%,#fff);border-color:color-mix(in srgb,var(--key-color) 30%,#e0e0e0);color:var(--key-color);font-weight:700}.consonant-key.svelte-w1xbm9:hover{background:color-mix(in srgb,var(--key-color) 20%,#fff)}.vowel-key.svelte-w1xbm9{background:color-mix(in srgb,var(--key-vowel) 8%,#fff);border-color:color-mix(in srgb,var(--key-vowel) 25%,#e0e0e0);color:var(--key-vowel);font-size:1rem}.vowel-key.svelte-w1xbm9:hover{background:color-mix(in srgb,var(--key-vowel) 16%,#fff)}.special-key.svelte-w1xbm9{background:#fdf6e3;border-color:#e8d8a0;color:#7c6010;font-size:1.3rem}.marks-bar.svelte-w1xbm9{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:4px 0;border-top:1px solid var(--key-border)}.marks-label.svelte-w1xbm9{font-size:.7rem;color:#9ab4c8;text-transform:uppercase;letter-spacing:.05em;margin-right:2px}.marks-sep.svelte-w1xbm9{color:#c6ddf0;font-size:1rem;margin:0 2px}.mark-key.svelte-w1xbm9{min-width:50px;min-height:40px;font-size:1.1rem;flex:0 0 auto}.tone-key.svelte-w1xbm9{background:color-mix(in srgb,var(--key-mark) 8%,#fff);border-color:color-mix(in srgb,var(--key-mark) 25%,#e0e0e0);color:var(--key-mark)}.tone-key.svelte-w1xbm9:hover{background:color-mix(in srgb,var(--key-mark) 16%,#fff)}.special-mark-key.svelte-w1xbm9{background:#f5f0fb;border-color:#d5c8eb;color:#5a3a8a}.command-bar.svelte-w1xbm9{display:flex;gap:8px;padding-top:4px;border-top:1px solid var(--key-border)}.cmd-btn.svelte-w1xbm9{flex:1;padding:8px 10px;font-size:.82rem;font-weight:600;border-radius:8px;border:1.5px solid #c6ddf0;background:#fff;color:#005f91;cursor:pointer;transition:background .12s}.cmd-btn.svelte-w1xbm9:hover:not(:disabled){background:#e8f4fc}.cmd-btn.svelte-w1xbm9:disabled{opacity:.4;cursor:default}.delete-btn.svelte-w1xbm9{flex:2;color:#c0392b;border-color:#f5c6c2}.delete-btn.svelte-w1xbm9:hover{background:#fdf0ef!important}@media(max-width:480px){.keyboard.svelte-w1xbm9{padding:8px;gap:7px;border-radius:12px}.key.svelte-w1xbm9{min-width:36px;min-height:40px;font-size:1.1rem}.mode-tabs.svelte-w1xbm9 button:where(.svelte-w1xbm9){padding:5px 9px;font-size:.76rem}.text-display.svelte-w1xbm9{font-size:1.6rem}}.page.svelte-1ivt4cu{padding:2rem 1rem 4rem}.container.svelte-1ivt4cu{max-width:700px;margin:0 auto}.page-header.svelte-1ivt4cu{margin-bottom:2rem;text-align:center}.page-header.svelte-1ivt4cu h1:where(.svelte-1ivt4cu){font-size:2.2rem;font-weight:800;color:var(--color-text);margin-bottom:.6rem}.subtitle.svelte-1ivt4cu{color:var(--color-text-muted);font-size:1rem;line-height:1.6;max-width:540px;margin:0 auto}.keyboard-wrapper.svelte-1ivt4cu{margin-bottom:1.5rem}.info-row.svelte-1ivt4cu{display:flex;align-items:baseline;gap:10px;padding:10px 16px;background:#f0f7ff;border-radius:10px;margin-bottom:2rem;flex-wrap:wrap}.info-label.svelte-1ivt4cu{font-size:.8rem;color:#7a9ab8;text-transform:uppercase;letter-spacing:.05em}.info-text.svelte-1ivt4cu{font-size:1.4rem;color:#1a1a2e;flex:1;word-break:break-all}.info-length.svelte-1ivt4cu{font-size:.78rem;color:#9ab4c8}.help-grid.svelte-1ivt4cu{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin-top:.5rem}.help-card.svelte-1ivt4cu{background:#fff;border:1px solid var(--color-border, #e2eaf2);border-radius:12px;padding:16px 18px}.help-card.svelte-1ivt4cu h3:where(.svelte-1ivt4cu){font-size:.85rem;font-weight:700;color:var(--color-text);text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px}.help-card.svelte-1ivt4cu ul:where(.svelte-1ivt4cu),.help-card.svelte-1ivt4cu ol:where(.svelte-1ivt4cu){padding-left:1.1rem;color:var(--color-text-muted, #5a6478);font-size:.88rem;line-height:1.7}.help-card.svelte-1ivt4cu li:where(.svelte-1ivt4cu){display:flex;align-items:center;gap:6px}.help-card.svelte-1ivt4cu ol:where(.svelte-1ivt4cu) li:where(.svelte-1ivt4cu){display:list-item}.swatch.svelte-1ivt4cu{display:inline-block;width:10px;height:10px;border-radius:3px;flex-shrink:0}.swatch.hc.svelte-1ivt4cu{background:#0077b6}.swatch.mc.svelte-1ivt4cu{background:#2a9d8f}.swatch.lc1.svelte-1ivt4cu{background:#e76f51}.swatch.lc2.svelte-1ivt4cu{background:#457b9d}