:root{--bg: #0d1117;--bg-panel: #101722;--bg-raised: #161f2e;--border: #1f2a3a;--text: #dce3ec;--text-dim: #7d8a9c;--accent: #4da3ff;--accent-soft: rgba(77, 163, 255, .14);--danger: #ff6b6b;--mono: "SF Mono", "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;--sans: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{height:100%}body{margin:0;display:flex;flex-direction:column;background:var(--bg);color:var(--text);font-family:var(--sans);overflow:hidden}#toolbar{display:flex;align-items:center;gap:16px;padding:8px 14px;border-bottom:1px solid var(--border);background:var(--bg-panel);flex-wrap:wrap}.brand{font-weight:700;font-size:14px;letter-spacing:-.2px;color:var(--accent);-webkit-user-select:none;user-select:none}.brand-dim{color:var(--text-dim);font-weight:500}#modes{display:flex;gap:2px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:2px}button{font:inherit;font-size:12.5px;color:var(--text);background:transparent;border:none;border-radius:6px;padding:4px 10px;cursor:pointer;transition:background .1s ease}button:hover{background:var(--bg-raised)}.mode.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.actions{display:flex;gap:6px;margin-left:auto}.actions button{border:1px solid var(--border);background:var(--bg-raised)}.actions button:hover{border-color:var(--accent);color:var(--accent)}.actions button.flash{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.actions button.active{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);font-weight:600}.actions #help-btn{width:26px;padding:4px 0;border-radius:50%;font-weight:700;color:var(--text-dim)}.actions #help-btn:hover{color:var(--accent)}#help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#04080ea6;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}#help-overlay.hidden{display:none}.help-dialog{position:relative;width:min(560px,calc(100vw - 32px));background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;padding:20px 22px 16px;box-shadow:0 18px 48px #00000080;outline:none}.help-close{position:absolute;top:10px;right:10px;font-size:18px;line-height:1;padding:4px 8px;color:var(--text-dim)}.help-close:hover{color:var(--text)}.help-title{margin:0 24px 6px 0;font-size:16px}.help-desc{margin:0 0 14px;color:var(--text-dim);font-size:13px;line-height:1.5;min-height:2.6em}.help-media{position:relative;aspect-ratio:16 / 9;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--bg);margin-bottom:14px}.help-media video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;opacity:0}.help-media.loaded video{opacity:1}.help-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-family:var(--mono);font-size:12px;letter-spacing:.4px;-webkit-user-select:none;user-select:none}.help-footer{display:flex;align-items:center;justify-content:center;gap:14px}.help-nav{font-size:18px;line-height:1;padding:4px 12px;border:1px solid var(--border);background:var(--bg-raised)}.help-nav:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.help-nav:disabled{opacity:.35;cursor:default}.help-indicator{font-family:var(--mono);font-size:12px;color:var(--text-dim);min-width:5ch;text-align:center;-webkit-user-select:none;user-select:none}#palette-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:11;display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;background:#04080ea6;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}#palette-overlay.hidden{display:none}.palette-dialog{width:min(520px,calc(100vw - 32px));background:var(--bg-panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 18px 48px #00000080;overflow:hidden}.palette-input{width:100%;padding:12px 14px;border:none;border-bottom:1px solid var(--border);border-radius:0;outline:none;background:transparent;color:var(--text);font:inherit;font-size:14px}.palette-input::placeholder{color:var(--text-dim);opacity:.6}.palette-list{margin:0;padding:6px;list-style:none;max-height:min(340px,50vh);overflow-y:auto}.palette-item{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:7px 10px;border-radius:6px;font-size:13px;cursor:pointer}.palette-item:hover{background:var(--bg-raised)}.palette-item.selected{background:var(--accent-soft);color:var(--accent)}.palette-key{font-family:var(--mono);font-size:11px;color:var(--text-dim);white-space:nowrap}.palette-item.selected .palette-key{color:var(--accent)}.palette-empty{padding:10px;color:var(--text-dim);font-size:13px}#panes{flex:1;display:grid;grid-template-columns:1fr 1fr;min-height:0;position:relative}#find-bar{position:absolute;top:8px;right:12px;z-index:5;display:flex;align-items:center;gap:4px;padding:4px 6px;background:var(--bg-raised);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px #0006;animation:find-slide .12s ease-out}#find-bar.hidden{display:none}@keyframes find-slide{0%{opacity:0;transform:translateY(-8px)}}.find-input{width:180px;padding:3px 6px;border:none;border-radius:0;outline:none;background:transparent;color:var(--text);font:inherit;font-size:13px}.find-input::placeholder{color:var(--text-dim);opacity:.6}.find-count{font-family:var(--mono);font-size:11px;color:var(--text-dim);min-width:6ch;text-align:right;white-space:nowrap;-webkit-user-select:none;user-select:none}#find-bar button{padding:3px 7px;color:var(--text-dim)}#find-bar button:hover{color:var(--text)}.find-case{font-size:11.5px;font-family:var(--mono)}#find-bar .find-case.active{background:var(--accent-soft);color:var(--accent)}.find-nav,.find-close{font-size:15px;line-height:1}::highlight(preview-find){background-color:#ffd54f66;color:#0d1117}#editor{resize:none;border:none;outline:none;background:var(--bg);color:var(--text);font-family:var(--mono);font-size:13px;line-height:1.55;padding:16px;border-right:1px solid var(--border);white-space:pre;overflow:auto;-moz-tab-size:2;tab-size:2}#editor::placeholder{color:var(--text-dim);opacity:.6}#editor-b{display:none;resize:none;border:none;outline:none;background:var(--bg);color:var(--text);font-family:var(--mono);font-size:13px;line-height:1.55;padding:16px;border-right:1px solid var(--border);white-space:pre;overflow:auto;-moz-tab-size:2;tab-size:2}#editor-b::placeholder{color:var(--text-dim);opacity:.6}#panes.diff{grid-template-rows:1fr 1fr}#panes.diff #editor{grid-column:1;grid-row:1;border-bottom:1px solid var(--border)}#panes.diff #editor-b{display:block;grid-column:1;grid-row:2}#panes.diff #preview{grid-column:2;grid-row:1 / span 2}#preview{overflow:auto;padding:16px;background:var(--bg-panel);font-size:13px;line-height:1.55}#preview:empty:before{content:"Preview appears here";color:var(--text-dim);opacity:.5}#preview pre{margin:0;font-family:var(--mono);font-size:13px;white-space:pre}#preview code{font-family:var(--mono)}body.wrap #editor,body.wrap #editor-b,body.wrap #preview pre{white-space:pre-wrap;overflow-wrap:anywhere}body.wrap #preview .lined pre{white-space:pre}.lined{display:flex;align-items:flex-start}.lined .gutter{flex:none;padding-right:14px;text-align:right;color:var(--text-dim);opacity:.6;-webkit-user-select:none;user-select:none}.lined-rows{counter-reset:cline;font-family:var(--mono);font-size:13px}.lrow{counter-increment:cline;white-space:pre-wrap;overflow-wrap:anywhere;padding-left:calc(var(--ln-w, 4ch) + 14px);text-indent:calc(-1 * (var(--ln-w, 4ch) + 14px))}.lrow:before{content:counter(cline);display:inline-block;width:var(--ln-w, 4ch);margin-right:14px;text-align:right;text-indent:0;color:var(--text-dim);opacity:.6;-webkit-user-select:none;user-select:none}.json-tree{counter-reset:jline;font-family:var(--mono);font-size:13px}.j-row{white-space:pre;counter-increment:jline}body.wrap .j-row{white-space:pre-wrap;overflow-wrap:anywhere;padding-left:calc(var(--ln-w, 4ch) + 14px);text-indent:calc(-1 * (var(--ln-w, 4ch) + 14px))}body.wrap .j-row:before{text-indent:0}.j-row:before{content:counter(jline);display:inline-block;width:var(--ln-w, 4ch);margin-right:14px;text-align:right;color:var(--text-dim);opacity:.6}.j-caret{display:inline-block;width:13px;color:var(--text-dim);-webkit-user-select:none;user-select:none}.j-caret.j-toggle{cursor:pointer}.j-caret.j-toggle:before{content:"▾"}.j-row.collapsed .j-caret.j-toggle:before{content:"▸"}.j-caret.j-toggle:hover,.j-bracket:hover{color:var(--accent)}.j-bracket{cursor:pointer}.j-summary{display:none;color:var(--text-dim)}.j-row.collapsed .j-summary{display:inline}.j-group.hidden{display:none}.parse-error{color:var(--danger);font-family:var(--mono);font-size:12.5px;padding:8px 10px;border:1px solid rgba(255,107,107,.35);border-radius:6px;background:#ff6b6b12;margin-bottom:12px}.md{font-size:14px;max-width:780px}.md h1,.md h2{border-bottom:1px solid var(--border);padding-bottom:6px}.md a{color:var(--accent)}.md blockquote{margin:0;padding:2px 14px;border-left:3px solid var(--border);color:var(--text-dim)}.md code{background:var(--bg-raised);padding:1.5px 5px;border-radius:4px;font-size:12.5px}.md pre{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:12px;overflow:auto;white-space:pre}.md pre code{background:none;padding:0}.md table{border-collapse:collapse}.md th,.md td{border:1px solid var(--border);padding:5px 10px}.md img{max-width:100%}.csv-note{color:var(--text-dim);font-family:var(--mono);font-size:11.5px;margin-bottom:10px}table.csv{border-collapse:separate;border-spacing:0;font-family:var(--mono);font-size:12.5px}table.csv th,table.csv td{border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:4px 10px;text-align:left;white-space:pre;max-width:480px;overflow:hidden;text-overflow:ellipsis}table.csv th:first-child,table.csv td:first-child{border-left:1px solid var(--border)}table.csv th{position:sticky;top:0;z-index:1;background:var(--bg-raised);border-top:1px solid var(--border);font-weight:600}table.csv tbody tr:nth-child(2n) td{background:#ffffff05}table.diff{border-collapse:collapse;width:100%;font-family:var(--mono);font-size:12.5px;line-height:1.5}table.diff td{padding:0 8px;vertical-align:top}table.diff td.diff-ln{color:var(--text-dim);text-align:right;-webkit-user-select:none;user-select:none;width:1%;min-width:34px;border-right:1px solid var(--border)}table.diff td.diff-text{white-space:pre-wrap;word-break:break-all;width:50%}body:not(.wrap) table.diff td.diff-text{white-space:pre;word-break:normal}table.diff td.diff-add{background:#3fb95021}table.diff td.diff-del{background:#f8514921}table.diff td.diff-empty{background:#7d8a9c0f}table.diff .diff-word-add{background:#3fb95061;border-radius:2px}table.diff .diff-word-del{background:#f8514961;border-radius:2px}#statusbar{display:flex;gap:14px;align-items:center;padding:4px 14px;border-top:1px solid var(--border);background:var(--bg-panel);font-family:var(--mono);font-size:11px;color:var(--text-dim);-webkit-user-select:none;user-select:none}#status-mode{color:var(--accent);text-transform:uppercase;letter-spacing:.5px}#status-note{color:var(--danger)}.spacer{flex:1}#sync-btn{font-family:var(--mono);font-size:11px;color:var(--text-dim);border:1px solid var(--border);border-radius:999px;padding:1px 9px}#sync-btn:hover{color:var(--text)}#sync-btn.active{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}.hljs{color:var(--text)}.hljs-comment,.hljs-quote{color:#8b949e}.hljs-keyword,.hljs-selector-tag,.hljs-tag,.hljs-doctag{color:#ff7b72}.hljs-string,.hljs-regexp,.hljs-addition{color:#a5d6ff}.hljs-number,.hljs-literal{color:#79c0ff}.hljs-title,.hljs-section,.hljs-name{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-variable,.hljs-template-variable{color:#79c0ff}.hljs-built_in,.hljs-type,.hljs-symbol{color:#ffa657}.hljs-meta{color:#8b949e}.hljs-deletion{color:#ffa198}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}@media(max-width:760px){#panes{grid-template-columns:1fr;grid-template-rows:1fr 1fr}#editor{border-right:none;border-bottom:1px solid var(--border)}#panes.diff{grid-template-rows:1fr 1fr 2fr}#panes.diff #editor-b{grid-column:1;grid-row:2;border-right:none;border-bottom:1px solid var(--border)}#panes.diff #preview{grid-column:1;grid-row:3}}
