:root{color-scheme:dark;--bg: #050505;--panel: #090909;--panel-2: #0f0f0f;--line: #2b2b2b;--line-strong: #3f3f3f;--border: var(--line);--fg: #e7e7e7;--fg-dim: #b3b3b3;--muted: #b3b3b3;--accent: #2ca58d;--accent-soft: #13241f;--error: #ff8e8e;--ok: #9fe6a5}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:IBM Plex Mono,ui-monospace,SFMono-Regular,Menlo,monospace}button,input,select,textarea{font:inherit}.page{min-height:100vh;display:grid;grid-template-rows:auto 1fr}.topbar{border-bottom:1px solid var(--line);padding:16px 20px;display:flex;gap:14px;align-items:flex-start;justify-content:space-between;background:linear-gradient(180deg,#101010,#090909)}.topbar h1{margin:0;font-size:1.5rem}.topbar p{margin:8px 0 0;color:var(--muted);font-size:.92rem}.link-btn{border:1px solid var(--line-strong);background:var(--panel-2);color:var(--fg);text-decoration:none;padding:8px 12px;align-self:center}.link-btn:hover{border-color:var(--accent);background:#151515}.panel{border:1px solid var(--line);background:var(--panel);min-width:0}.panel-head h2{margin:0;font-size:1.05rem}.panel-head p{margin:6px 0 0;color:var(--muted);font-size:.83rem}[hidden]{display:none!important}.layout{padding:14px;display:grid;gap:12px;grid-template-columns:minmax(420px,1fr) minmax(420px,1fr);grid-template-areas:"keyboard macro" "mappings commands" "preview commands"}.panel{padding:12px}.keyboard-panel{grid-area:keyboard}.macro-panel{grid-area:macro}.mapping-panel{grid-area:mappings}.command-panel{grid-area:commands}.preview-panel{grid-area:preview}.keyboard-layout{margin-top:10px;display:grid;gap:7px}.key-row{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}.key{width:calc(var(--u, 1) * 42px);min-width:calc(var(--u, 1) * 42px);min-height:36px;border:1px solid #3b3b3b;background:#111;color:var(--fg);font:inherit;font-size:.82rem;cursor:pointer;position:relative}.key:hover{border-color:#666}.key.is-selected{border-color:var(--accent);background:#1a1a1a}.key.is-mapped:after{content:"";position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:#9be89f}.key:disabled{cursor:not-allowed;opacity:.45}.selected-key{margin:10px 0 0;color:var(--muted);font-size:.86rem}.selected-key code{color:var(--fg);font-size:.95rem}.live-detect{margin-top:10px;border:1px solid #272727;background:#0a0a0a;padding:10px;display:grid;gap:6px}.live-line{margin:0;font-size:.85rem;color:#d6d6d6}.live-line.is-match{color:var(--ok);font-weight:700}.live-line.is-progress{color:#f0dda0}.live-line.is-miss{color:var(--error)}.live-cooldown{color:var(--muted)}.live-settings{margin-top:4px;display:grid;gap:8px;grid-template-columns:repeat(2,minmax(140px,1fr))}.live-settings label{display:grid;gap:4px;font-size:.75rem;color:var(--muted)}.live-settings input{border:1px solid #3f3f3f;background:#111;color:var(--fg);font:inherit;font-size:.8rem;padding:6px 8px}.macro-form{margin-top:10px;display:grid;gap:10px}.macro-form label{display:grid;gap:5px;font-size:.85rem;color:var(--muted)}.macro-form input,.macro-form select{border:1px solid #3f3f3f;background:var(--panel-2);color:var(--fg);font:inherit;padding:7px 8px}.macro-actions{display:grid;grid-template-columns:repeat(3,minmax(90px,1fr));gap:8px}.macro-actions button{border:1px solid #3f3f3f;background:#141414;color:var(--fg);font:inherit;padding:7px 9px;cursor:pointer}.macro-status{margin:10px 0 0;font-size:.84rem;min-height:1.2em;color:var(--muted)}.macro-status.is-error{color:var(--error)}.macro-status.is-ok{color:var(--ok)}.mapping-scroll,.command-scroll{margin-top:10px;border:1px solid #252525;max-height:320px;overflow:auto}.mapping-table,.command-table{width:100%;border-collapse:collapse}.mapping-table th,.mapping-table td,.command-table th,.command-table td{padding:7px 8px;border-bottom:1px solid #1c1c1c;text-align:left;font-size:.82rem;vertical-align:top}.mapping-table th,.command-table th{position:sticky;top:0;background:#111;z-index:1;font-size:.74rem;letter-spacing:.03em;text-transform:uppercase}.mapping-table code,.command-table code{color:#f1f1f1}.mini-btn{border:1px solid #3f3f3f;background:#131313;color:var(--fg);font:inherit;font-size:.78rem;padding:4px 8px;cursor:pointer}.command-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.search-wrap{display:grid;gap:4px;min-width:250px;font-size:.76rem;color:var(--muted)}.search-wrap input{border:1px solid #3f3f3f;background:var(--panel-2);color:var(--fg);font:inherit;padding:7px 8px}.vimrc-preview{margin:10px 0 0;border:1px solid #252525;background:#0a0a0a;padding:10px;font-size:.83rem;line-height:1.55;min-height:150px;max-height:260px;overflow:auto}@media(max-width:1180px){.layout{grid-template-columns:1fr;grid-template-areas:"keyboard" "macro" "mappings" "commands" "preview"}.search-wrap{min-width:0;width:100%}.command-head{align-items:stretch;flex-direction:column}.live-settings{grid-template-columns:1fr}}