:root{--bg: #0f0f17;--bg-elevated: #181825;--bg-surface: #1e1e2e;--bg-input: #262637;--text: #cdd6f4;--text-muted: #6c7086;--text-dim: #45475a;--accent: #89b4fa;--accent-dim: rgba(137, 180, 250, .1);--border: rgba(255, 255, 255, .06);--border-focus: rgba(137, 180, 250, .4);--radius: 6px;--radius-lg: 10px;--mono: "JetBrains Mono", "Fira Code", "Cascadia Code", "SF Mono", monospace;--transition: .15s ease}[data-theme=light]{--bg: #eff1f5;--bg-elevated: #ffffff;--bg-surface: #e6e9ef;--bg-input: #dce0e8;--text: #4c4f69;--text-muted: #6c6f85;--text-dim: #9ca0b0;--accent: #1e66f5;--accent-dim: rgba(30, 102, 245, .1);--border: rgba(0, 0, 0, .08);--border-focus: rgba(30, 102, 245, .4)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,Inter,system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{max-width:1280px;margin:0 auto;padding:2.5rem 2rem}.url-conflict-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;margin-bottom:1.5rem;background:var(--accent-dim);border:1.5px solid var(--accent);border-radius:var(--radius-lg);font-size:.9rem;font-weight:500;color:var(--text);box-shadow:0 0 16px var(--accent-dim)}.url-conflict-actions{display:flex;gap:.5rem;flex-shrink:0}header{margin-bottom:2.5rem}.header-row{display:flex;justify-content:space-between;align-items:center}header h1{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;color:var(--text)}.theme-toggle{display:flex;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.theme-btn{background:transparent;color:var(--text-muted);border:none;border-radius:0;padding:.3rem .6rem;font-size:.7rem;font-weight:500;cursor:pointer;transition:background var(--transition),color var(--transition);letter-spacing:.02em}.theme-btn:hover{color:var(--text);opacity:1}.theme-btn.active{background:var(--accent);color:var(--bg)}.theme-btn+.theme-btn{border-left:1px solid var(--border)}header h1 code{font-family:var(--mono);font-size:.9em;background:var(--accent-dim);color:var(--accent);padding:.1em .4em;border-radius:var(--radius);font-weight:600}header p{color:var(--text-muted);font-size:.875rem;margin-top:.25rem}header p code{font-family:var(--mono);font-size:.9em;color:var(--text)}header p a{text-decoration:none}header p a:hover code{text-decoration:underline}.byline-link{color:var(--accent);text-decoration:none}.byline-link:hover{text-decoration:underline}.right-col{position:sticky;top:1.5rem;display:flex;flex-direction:column;gap:1rem;max-height:calc(100vh - 3rem)}.preview-section{display:flex;justify-content:center}.kitty-preview{width:100%;max-width:640px;border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 0 0 1px #ffffff0d,0 8px 40px #0009;--p-fg: #dddddd;--p-bg: #000000;--p-bg-rgba: #000000;--p-cursor: #cccccc;--p-font: monospace;--p-font-size: 11px;--p-padding: 0px;--p-c0: #000000;--p-c1: #cc0403;--p-c2: #19cb00;--p-c3: #cecb00;--p-c4: #0d73cc;--p-c5: #cb1ed1;--p-c6: #0dcdcd;--p-c7: #dddddd;--p-c8: #767676;--p-c9: #f2201f;--p-c10: #23fd00;--p-c11: #fffd00;--p-c12: #1a8fff;--p-c13: #fd28ff;--p-c14: #14ffff;--p-c15: #ffffff}.kitty-preview.floating{position:fixed;z-index:100;box-shadow:0 0 0 1px #ffffff14,0 24px 80px #000c}.kitty-preview.no-radius{border-radius:0}.kitty-titlebar{height:38px;background:#2d2d2d;display:flex;align-items:center;padding:0 12px;position:relative;-webkit-user-select:none;user-select:none}.kitty-titlebar.transparent{background:transparent;position:absolute;top:0;left:0;right:0;z-index:1}.kitty-titlebar.hidden{display:none}.traffic-lights{display:flex;gap:8px}.traffic-lights span{width:12px;height:12px;border-radius:50%}.tl-close{background:#ff5f57}.tl-minimize{background:#febc2e}.tl-zoom{background:#28c840}.kitty-title{position:absolute;left:50%;transform:translate(-50%);font-family:-apple-system,system-ui,sans-serif;font-size:13px;color:#999;font-weight:400}.kitty-titlebar.transparent .kitty-title{display:none}.kitty-tab-bar{background:var(--p-bg-rgba);font-family:var(--p-font);font-size:calc(var(--p-font-size) * .9);line-height:1}.kitty-tab-bar.hidden{display:none}.kitty-tabs{display:flex;height:24px;align-items:stretch;justify-content:var(--p-tab-align, flex-start)}.kitty-tab{display:flex;align-items:center;padding:0 12px;white-space:nowrap}.kitty-tab.active{background:var(--p-active-tab-bg, #eeeeee);color:var(--p-active-tab-fg, #000000);font-weight:700;font-style:italic}.kitty-tab.inactive{background:var(--p-inactive-tab-bg, #999999);color:var(--p-inactive-tab-fg, #444444)}[data-style=fade] .kitty-tab.active{background:linear-gradient(to right,var(--p-bg-rgba) 0%,var(--p-active-tab-bg, #eeeeee) 20%,var(--p-active-tab-bg, #eeeeee) 80%,var(--p-bg-rgba) 100%)}[data-style=fade] .kitty-tab.inactive{background:linear-gradient(to right,var(--p-bg-rgba) 0%,var(--p-inactive-tab-bg, #999999) 20%,var(--p-inactive-tab-bg, #999999) 80%,var(--p-bg-rgba) 100%)}[data-style=powerline] .kitty-tabs{gap:0}[data-style=powerline] .kitty-tab{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%,10px 50%);padding:0 20px}[data-style=powerline] .kitty-tab:first-child{clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);padding-left:12px}[data-style=slant] .kitty-tab{clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);padding:0 16px;margin-left:-4px}[data-style=slant] .kitty-tab:first-child{margin-left:0}[data-style=slant] .kitty-tab.active{z-index:1}[data-style=separator] .kitty-tabs{gap:0}[data-style=separator] .kitty-tab{padding:0 8px}[data-style=separator] .kitty-tab.inactive+.kitty-tab:before{content:"┇";color:var(--p-inactive-tab-fg, #444444);margin-right:8px}.kitty-terminal{background:var(--p-bg-rgba);min-height:200px;position:relative}.kitty-bg-tint{display:none;position:absolute;inset:0;pointer-events:none;z-index:0}.kitty-terminal-inner{position:relative;z-index:1;font-family:var(--p-font);font-size:var(--p-font-size);line-height:1.4;color:var(--p-fg);padding:max(var(--p-padding),8px)}.kitty-terminal-inner .line{white-space:pre;min-height:1.4em}.kitty-terminal-inner .fg{color:var(--p-fg)}.kitty-terminal-inner .c0{color:var(--p-c0)}.kitty-terminal-inner .c1{color:var(--p-c1)}.kitty-terminal-inner .c2{color:var(--p-c2)}.kitty-terminal-inner .c3{color:var(--p-c3)}.kitty-terminal-inner .c4{color:var(--p-c4)}.kitty-terminal-inner .c5{color:var(--p-c5)}.kitty-terminal-inner .c6{color:var(--p-c6)}.kitty-terminal-inner .c7{color:var(--p-c7)}.kitty-terminal-inner .c8{color:var(--p-c8)}.kitty-terminal-inner .c9{color:var(--p-c9)}.kitty-terminal-inner .c10{color:var(--p-c10)}.kitty-terminal-inner .c11{color:var(--p-c11)}.kitty-terminal-inner .c12{color:var(--p-c12)}.kitty-terminal-inner .c13{color:var(--p-c13)}.kitty-terminal-inner .c14{color:var(--p-c14)}.kitty-terminal-inner .c15{color:var(--p-c15)}.kitty-terminal-inner .url{color:var(--p-fg);text-decoration:none;text-underline-offset:2px}.kitty-terminal-inner .url[data-url-mode=always],.kitty-terminal-inner .url[data-url-mode=hover]:hover{text-decoration:var(--p-url-decoration, underline);text-decoration-style:var(--p-url-style, wavy);text-decoration-color:var(--p-url-decoration-color, #0087bd);color:var(--p-url-decoration-color, #0087bd)}.cursor-char{display:inline-block;width:.6em;height:1.2em;vertical-align:text-bottom;animation:var(--p-cursor-blink, none)}.cursor-block{background:var(--p-cursor)}.cursor-beam{width:2px;background:var(--p-cursor)}.cursor-underline{background:transparent;border-bottom:2px solid var(--p-cursor)}@keyframes cursor-blink{0%,49%{opacity:1}50%,to{opacity:0}}main{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:start}@media(max-width:900px){main{grid-template-columns:1fr}}.controls-group{margin-bottom:1.25rem;padding:1rem;background:var(--bg-elevated);border-radius:var(--radius-lg);border:1px solid var(--border);min-width:0}.controls-group>summary{font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;-webkit-user-select:none;user-select:none;opacity:.7;transition:opacity var(--transition)}.controls-group>summary:hover{opacity:1}.controls-group>summary::-webkit-details-marker{display:none}.controls-group>summary:after{content:"";width:6px;height:6px;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(-45deg);transition:transform var(--transition),opacity var(--transition);flex-shrink:0;opacity:.5}.controls-group>summary:hover:after{opacity:1}.controls-group[open]>summary:after{transform:rotate(45deg)}.controls-group:not([open])>summary{margin-bottom:0}.controls-group[open]>summary{margin-bottom:.5rem}.field{display:flex;align-items:center;margin-bottom:.35rem;gap:.75rem;padding:.2rem 0}.field label{font-size:.8rem;flex:1 1 auto;min-width:0;color:var(--text-muted)}.field input,.field select{background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font-size:.8rem;width:55%;flex:0 0 55%;transition:border-color var(--transition)}.field input:focus,.field select:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-dim)}.field input[type=color]{width:28px;height:28px;flex:0 0 28px;padding:2px;cursor:pointer;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-input)}.file-pair{display:flex;gap:.5rem;align-items:center;width:55%;flex:0 0 55%}.file-pair input[type=file]{flex:1 1 auto;font-size:.75rem;color:var(--text-muted);width:0;min-width:0}.file-pair input[type=file]::file-selector-button{background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.25rem .5rem;font-size:.7rem;cursor:pointer;margin-right:.5rem}.btn-sm{padding:.25rem .5rem;font-size:.65rem}.color-pair{display:flex;gap:.5rem;align-items:center;width:55%;flex:0 0 55%}.color-pair input[type=text]{flex:1 1 auto;width:auto}.output{background:var(--bg-elevated);border-radius:var(--radius-lg);padding:1rem;overflow-y:auto;min-height:0;min-width:0;border:1px solid var(--border)}.output-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.output-header h2{font-size:.85rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.output-buttons{display:flex;gap:.35rem}.permalink-toggle{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--text-muted);cursor:pointer;margin-bottom:.5rem}.permalink-toggle input[type=checkbox]{accent-color:var(--accent)}.output pre{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;overflow-x:auto;font-size:.8rem;line-height:1.6;max-height:70vh;overflow-y:auto}.output code{font-family:var(--mono);color:var(--text);white-space:pre}.import-section{margin-bottom:.75rem}.import-section.hidden{display:none}.import-tabs{display:flex;gap:0;margin-bottom:.5rem;border-bottom:1px solid var(--border)}.import-tab{background:transparent;color:var(--text-muted);border:none;border-radius:0;padding:.4rem .75rem;font-size:.75rem;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}.import-tab:hover{color:var(--text);opacity:1}.import-tab.active{color:var(--accent);border-bottom-color:var(--accent)}.import-panel.hidden{display:none}.import-section textarea{width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.75rem;font-family:var(--mono);font-size:.8rem;resize:vertical;margin-bottom:.5rem;transition:border-color var(--transition)}.import-section textarea:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-dim)}.import-url-input{width:100%;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .75rem;font-size:.8rem;margin-bottom:.5rem;transition:border-color var(--transition)}.import-url-input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-dim)}.import-panel input[type=file]{font-size:.75rem;color:var(--text-muted);margin-bottom:.5rem}.import-panel input[type=file]::file-selector-button{background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.25rem .5rem;font-size:.7rem;cursor:pointer;margin-right:.5rem}.import-actions{display:flex;gap:.35rem;justify-content:flex-end}button{background:var(--accent);color:var(--bg);border:none;border-radius:var(--radius);padding:.4rem .85rem;font-size:.75rem;font-weight:600;cursor:pointer;transition:opacity var(--transition),background var(--transition);letter-spacing:.01em}button:hover{opacity:.9}button:active{opacity:.8}.btn-secondary{background:transparent;color:var(--text-muted);border:1px solid var(--border)}.btn-secondary:hover{color:var(--text);border-color:var(--border-focus);background:var(--accent-dim);opacity:1}.btn-icon{display:inline-flex;align-items:center;justify-content:center;padding:.35rem;line-height:0}.btn-icon svg{display:block}.btn-icon.btn-success{border-color:#28c840;color:#28c840;background:#28c8401a}.btn-icon.btn-error{border-color:#ff5f57;color:#ff5f57;background:#ff5f571a}footer{text-align:center;padding:2.5rem 0 1rem;font-size:.75rem;color:var(--text-dim)}footer code{font-family:var(--mono);font-size:inherit;color:inherit}footer a{font-family:var(--mono);color:var(--text-muted);text-decoration:none}footer a:hover{color:var(--accent)}.mapping-advanced-toggle{display:flex;align-items:center;gap:.4rem;font-size:.75rem;color:var(--text-muted);cursor:pointer;margin-bottom:.5rem}.mapping-advanced-toggle input[type=checkbox]{accent-color:var(--accent)}.mappings-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.mapping-row{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap}.mapping-keys{flex:3 1 0;min-width:0;font-family:var(--mono);background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font-size:.8rem;transition:border-color var(--transition)}.mapping-mods{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}.mod-pill{font-family:var(--mono);font-size:.65rem;font-weight:500;padding:.2rem .4rem;border-radius:var(--radius);border:1px solid var(--border);background:transparent;color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none;line-height:1;transition:background var(--transition),color var(--transition),border-color var(--transition)}.mod-pill:hover{color:var(--text-muted);border-color:var(--border-focus);opacity:1}.mod-pill.active{background:var(--accent);color:var(--bg);border-color:var(--accent)}.mapping-key-select{flex:1 1 0;min-width:4rem;background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font-size:.8rem;transition:border-color var(--transition)}.mapping-key-select:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-dim)}.mapping-action{flex:4 1 0;min-width:0;background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font-size:.8rem;transition:border-color var(--transition)}.mapping-args{flex:2 1 0;min-width:0;font-family:var(--mono);background:var(--bg-input);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.35rem .5rem;font-size:.8rem;transition:border-color var(--transition)}.mapping-keys:focus,.mapping-action:focus,.mapping-args:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-dim)}.mapping-delete{flex:0 0 auto}.hidden{display:none!important}