:root,[data-theme=paper]{--bg: #f3efe6;--bg-elevated: #fffdf8;--bg-key: #e8e2d6;--bg-key-active: #2f6f5e;--border: #d4ccc0;--text: #2a2620;--text-dim: #7a7268;--text-muted: #a89f93;--caret: #2f6f5e;--correct: #1f8a6e;--typed-dim: #a89f93;--error: #b54a3c;--accent: #2f6f5e;--accent-soft: color-mix(in srgb, var(--accent) 18%, transparent);--key-label: #3a342c;--key-label-active: #fffdf8;--shadow: 0 12px 36px rgba(42, 38, 32, .08);--radius-key: 8px;--font-ui: "Outfit", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, monospace}[data-theme=catppuccin-latte]{--bg: #eff1f5;--bg-elevated: #e6e9ef;--bg-key: #ccd0da;--bg-key-active: #8839ef;--border: #bcc0cc;--text: #4c4f69;--text-dim: #6c6f85;--text-muted: #9ca0b0;--caret: #dc8a78;--correct: #40a02b;--typed-dim: #9ca0b0;--error: #d20f39;--accent: #8839ef;--accent-soft: color-mix(in srgb, var(--accent) 18%, transparent);--key-label: #5c5f77;--key-label-active: #eff1f5;--shadow: 0 12px 36px rgba(76, 79, 105, .1)}[data-theme=catppuccin-frappe]{--bg: #303446;--bg-elevated: #292c3c;--bg-key: #414559;--bg-key-active: #ca9ee6;--border: #51576d;--text: #c6d0f5;--text-dim: #a5adce;--text-muted: #737994;--caret: #f2d5cf;--correct: #a6d189;--typed-dim: #737994;--error: #e78284;--accent: #ca9ee6;--accent-soft: color-mix(in srgb, var(--accent) 22%, transparent);--key-label: #b5bfe2;--key-label-active: #232634;--shadow: 0 12px 40px rgba(0, 0, 0, .35)}[data-theme=catppuccin-macchiato]{--bg: #24273a;--bg-elevated: #1e2030;--bg-key: #363a4f;--bg-key-active: #c6a0f6;--border: #494d64;--text: #cad3f5;--text-dim: #a5adcb;--text-muted: #6e738d;--caret: #f4dbd6;--correct: #a6da95;--typed-dim: #6e738d;--error: #ed8796;--accent: #c6a0f6;--accent-soft: color-mix(in srgb, var(--accent) 22%, transparent);--key-label: #b8c0e0;--key-label-active: #181926;--shadow: 0 12px 40px rgba(0, 0, 0, .4)}[data-theme=catppuccin-mocha]{--bg: #1e1e2e;--bg-elevated: #181825;--bg-key: #313244;--bg-key-active: #cba6f7;--border: #45475a;--text: #cdd6f4;--text-dim: #a6adc8;--text-muted: #6c7086;--caret: #f5e0dc;--correct: #a6e3a1;--typed-dim: #6c7086;--error: #f38ba8;--accent: #cba6f7;--accent-soft: color-mix(in srgb, var(--accent) 22%, transparent);--key-label: #bac2de;--key-label-active: #11111b;--shadow: 0 12px 40px rgba(0, 0, 0, .45)}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-ui);background:radial-gradient(ellipse 80% 50% at 50% -10%,var(--accent-soft),transparent),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}button,select,input{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{position:relative;min-height:100%;display:grid;grid-template-rows:1fr auto 1fr;padding:2.75rem 1.5rem 1.75rem;gap:0}.top-bar{position:absolute;top:.85rem;left:1.25rem;right:1.25rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;z-index:1}.upper-half,.lower-half{display:flex;align-items:center;justify-content:center;min-height:0}.brand{font-family:Outfit,system-ui,sans-serif;font-size:1.15rem;font-weight:600;letter-spacing:-.02em;text-transform:none;color:var(--text);-webkit-user-select:none;user-select:none}.chrome{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.field{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--text-dim)}.field select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;padding:.35rem 1.75rem .35rem .65rem;color:var(--text);background-image:linear-gradient(45deg,transparent 50%,var(--text-dim) 50%),linear-gradient(135deg,var(--text-dim) 50%,transparent 50%);background-position:calc(100% - 12px) calc(50% - 2px),calc(100% - 7px) calc(50% - 2px);background-size:5px 5px;background-repeat:no-repeat}.mode-controls{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem}.mode-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.65rem 1rem}.modifiers{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem .85rem}.modifier{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--text-dim);-webkit-user-select:none;user-select:none}.modifier input{accent-color:var(--accent)}.typing-stage{display:flex;align-items:center;justify-content:center;padding:.5rem 0}.typing-area{width:min(56rem,100%);min-height:9.3em;font-family:var(--font-mono);font-size:clamp(1.55rem,2.8vw,2.05rem);line-height:1.55;letter-spacing:.01em;text-align:left;overflow-wrap:normal;word-break:normal;-webkit-hyphens:none;hyphens:none;cursor:text}.typing-area.is-centered{text-align:center}.type-line{min-height:1.55em}.typing-area .word{display:inline-block;white-space:nowrap}.typing-area .space{white-space:normal}.char.is-newline{display:inline;margin-left:.15em;font-size:.7em;vertical-align:.15em;color:var(--text-muted);white-space:nowrap}.char.is-newline.is-correct,.char.is-newline.is-typed.is-correct{color:var(--correct)}.char.is-newline.is-error{color:var(--error)}.typing-area:focus{outline:none}.char{color:var(--text)}.char.is-typed:not(.is-correct):not(.is-error){color:var(--typed-dim)}.char.is-correct,.char.is-typed.is-correct{color:var(--correct)}.char.is-error,.char.is-typed.is-error{color:var(--error);text-decoration:underline;text-underline-offset:3px}.char.is-caret{position:relative}.char.is-caret:before{content:"";position:absolute;left:-1px;top:.1em;bottom:.1em;width:2px;background:var(--caret);border-radius:1px;animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}.keyboard-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem}.keyboard-stage.is-hidden{visibility:hidden}.corne{position:relative;display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1rem,2.5vw,2rem);filter:drop-shadow(var(--shadow))}.layer-badge{position:absolute;top:-1.35rem;left:50%;transform:translate(-50%);font-size:.65rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}.corne-half{display:flex;flex-direction:column;gap:.28rem}.corne-row,.corne-thumbs{display:flex;gap:.26rem}.corne-thumbs{margin-top:.4rem;justify-content:flex-end;padding-inline:.35rem}.corne-half.is-right .corne-thumbs{justify-content:flex-start}.key{position:relative;width:2.05rem;height:2.05rem;display:grid;place-items:center;border-radius:calc(var(--radius-key) - 1px);background:var(--bg-key);border:1px solid var(--border);color:var(--key-label);font-family:var(--font-mono);font-size:.62rem;font-weight:500;transition:background .12s ease,color .12s ease,border-color .12s ease,transform .12s ease}.key.is-empty{opacity:.28}.key-hold{position:absolute;top:2px;right:3px;font-size:.45rem;line-height:1;color:var(--text-muted);font-weight:600}.key.is-next .key-hold{color:var(--key-label-active);opacity:.85}.key-label{line-height:1}.key.is-hebrew-dual .key-label{display:block;position:absolute;top:0;right:0;bottom:0;left:0}.key.is-hebrew-dual .key-hebrew{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:1.15rem;font-weight:600;line-height:1}.key.is-hebrew-dual .key-latin{position:absolute;right:4px;bottom:3px;font-size:.58rem;font-weight:600;line-height:1;opacity:.72;text-transform:lowercase}.key.is-hebrew-dual.is-next .key-latin{opacity:.88}.corne.is-hebrew-mode{gap:clamp(1.35rem,3vw,2.75rem)}.corne.is-hebrew-mode .corne-row,.corne.is-hebrew-mode .corne-thumbs{gap:.32rem}.corne.is-hebrew-mode .key.is-hebrew-dual{width:2.9rem;height:2.9rem}.corne.is-hebrew-mode .key.is-hebrew-dual .key-hebrew{font-size:1.35rem}.macbook.is-hebrew-mode,.k6.is-hebrew-mode{gap:.3rem}.macbook.is-hebrew-mode .mac-row,.k6.is-hebrew-mode .k6-row{gap:.28rem}.macbook.is-hebrew-mode .mac-key.is-hebrew-dual,.k6.is-hebrew-mode .k6-key.is-hebrew-dual{height:2.4rem;min-width:2.4rem}.macbook.is-hebrew-mode .mac-key.is-hebrew-dual .key-hebrew,.k6.is-hebrew-mode .k6-key.is-hebrew-dual .key-hebrew{font-size:1.25rem}.macbook.is-hebrew-mode .mac-key.is-hebrew-dual .key-latin,.k6.is-hebrew-mode .k6-key.is-hebrew-dual .key-latin{font-size:.62rem;right:5px;bottom:4px}.key.is-thumb{width:2.25rem}.key.is-next{background:var(--bg-key-active);border-color:var(--bg-key-active);color:var(--key-label-active);transform:translateY(-1px)}.hint{font-size:.75rem;color:var(--text-muted)}.k6{position:relative;display:flex;flex-direction:column;align-items:center;gap:.22rem;filter:drop-shadow(var(--shadow));margin-top:.5rem}.k6-row{display:flex;gap:.2rem;justify-content:center}.k6-key{width:1.55rem;height:1.55rem;font-size:.55rem}.k6-key .key-label{font-size:inherit}.macbook{position:relative;display:flex;flex-direction:column;align-items:center;gap:.22rem;filter:drop-shadow(var(--shadow));margin-top:.5rem}.mac-row{display:flex;gap:.2rem;justify-content:center}.mac-key{width:1.55rem;height:1.55rem;font-size:.55rem}.mac-key .key-label{font-size:inherit}.typing-stage.hebrew-stage,.typing-stage.english-stage{display:flex;flex-direction:column;align-items:center;gap:1rem}.english-panel,.hebrew-panel{display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem 2rem;width:min(56rem,100%);padding:.25rem .5rem}.hebrew-hint{display:flex;flex-direction:column;gap:.2rem;min-width:8rem}.hebrew-hint-label{font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}.hebrew-hint-value{font-family:var(--font-mono);font-size:1rem;color:var(--text)}.hebrew-typing{direction:rtl;text-align:right;unicode-bidi:isolate}.hebrew-typing.is-centered{text-align:center}.hebrew-line{display:inline-block;direction:rtl;unicode-bidi:isolate;text-align:inherit}.hebrew-typing .char{unicode-bidi:isolate}.hebrew-typing .char.is-caret:before{left:auto;right:-1px}.hebrew-kb-note{margin:0 0 .35rem;font-size:.72rem;color:var(--text-muted);text-align:center}@media(max-width:720px){.app{grid-template-rows:auto auto auto;padding:3.5rem 1rem 1rem}.top-bar{flex-wrap:wrap}.key{width:1.85rem;height:1.85rem;font-size:.58rem}.key.is-thumb{width:2rem}.k6-key,.mac-key{height:1.35rem;font-size:.48rem}.corne.is-hebrew-mode .key.is-hebrew-dual{width:2.45rem;height:2.45rem}.corne.is-hebrew-mode .key.is-hebrew-dual .key-hebrew{font-size:1.15rem}.macbook.is-hebrew-mode .mac-key.is-hebrew-dual,.k6.is-hebrew-mode .k6-key.is-hebrew-dual{height:2rem;min-width:2rem}}
