*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{color:#e0e0e0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0a0a0a;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{cursor:pointer;background:0 0;border:none;font-family:inherit}:root{--gem-sys-typography-type-scale--title-s-font-weight:500;--_gray-100:53 12% 87%;--border-400:var(--_gray-100)}.app{max-width:1400px;margin:0 auto;padding:40px 80px 80px}.input-section{background:#111;border:1px solid #222;border-radius:10px;width:712px;margin:0 auto 40px;overflow:hidden}.input-top{border-bottom:1px solid #1e1e1e;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;display:flex}.input-label{color:#444;text-transform:uppercase;letter-spacing:.6px;flex-shrink:0;font-size:12px;font-weight:500}.lang-badge{color:#555;letter-spacing:.3px;background:#1e1e1e;border:1px solid #2e2e2e;border-radius:5px;padding:3px 9px;font-family:"ui-monospace",Menlo,Consolas,monospace;font-size:11px;font-weight:500}.code-textarea{color:#d4d4d4;resize:vertical;tab-size:2;background:0 0;border:none;outline:none;width:100%;min-height:200px;padding:16px;font-family:"ui-monospace",Cascadia Code,Source Code Pro,Menlo,Consolas,monospace;font-size:13.5px;line-height:1.6}.code-textarea::placeholder{color:#3a3a3a}.code-textarea{scrollbar-width:thin;scrollbar-color:#ffffff1a transparent}.code-textarea::-webkit-scrollbar{width:4px;height:4px}.code-textarea::-webkit-scrollbar-track{background:0 0}.code-textarea::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:99px}.blocks-section{flex-direction:column;align-items:center;gap:16px;display:flex}.blocks-toolbar{justify-content:space-between;align-items:center;width:712px;display:flex}.style-tabs{gap:6px;display:flex}.style-tab{color:#555;background:0 0;border:1px solid #0000;border-radius:8px;padding:6px 16px;font-size:13px;font-weight:500;transition:color .15s,background .15s,border-color .15s}.style-tab:hover{color:#bbb;background:#1a1a1a}.style-tab.active{color:#e0e0e0;background:#1e1e1e;border-color:#2e2e2e}.style-tab--chatgpt.active{color:#10a37f;border-color:#10a37f4d}.style-tab--gemini.active{color:#8ab4f8;border-color:#8ab4f84d}.style-tab--claude.active{color:#d4a574;border-color:#d4a5744d}.block-col{flex-direction:column;gap:10px;display:flex}.block-col-label{letter-spacing:.9px;text-transform:uppercase;font-size:11px;font-weight:600}.chatgpt-col-label{color:#10a37f}.gemini-col-label{color:#8ab4f8}.claude-col-label{color:#d4a574}.block-container{flex-direction:column;flex:1;gap:10px;display:flex}.export-buttons{gap:8px;display:flex}.export-btn{color:#666;background:#111;border:1px solid #222;border-radius:6px;align-items:center;gap:5px;padding:5px 11px;font-size:12px;font-weight:500;transition:color .15s,background .15s,border-color .15s;display:flex}.export-btn:hover{color:#ccc;background:#181818;border-color:#2e2e2e}.chatgpt-block{background:#181818;border:1px solid #ffffff14;border-radius:20px;flex-direction:column;width:712px;font-family:ui-monospace,SF Mono,Cascadia Code,Menlo,Consolas,monospace;display:flex;overflow:hidden;box-shadow:0 2px 8px #0006,0 1px 2px #0000004d}.chatgpt-header{background:#181818;justify-content:space-between;align-items:center;height:52px;padding:0 16px;display:flex}.chatgpt-lang-label{color:#f3f3f3;letter-spacing:-.01em;align-items:center;gap:10px;font-family:ui-monospace,SF Mono,Cascadia Code,Menlo,Consolas,monospace;font-size:14px;font-weight:600;display:flex}.chatgpt-copy-btn{color:#737373;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;line-height:0;transition:color .2s,background .2s;display:flex}.chatgpt-copy-btn:hover{color:#e5e5e5;background:#ffffff0f}.chatgpt-pre{scrollbar-width:thin;scrollbar-color:#ffffff1a transparent;margin:0;padding:20px 20px 22px;overflow-x:auto}.chatgpt-pre::-webkit-scrollbar{height:4px}.chatgpt-pre::-webkit-scrollbar-track{background:0 0}.chatgpt-pre::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:99px}.chatgpt-pre code{color:#d4d4d4;white-space:pre;letter-spacing:-.01em;background:0 0;font-family:ui-monospace,SF Mono,Cascadia Code,Menlo,Consolas,monospace;font-size:12.25px;font-weight:400;line-height:1.7;display:block}.chatgpt-pre .hljs-keyword,.chatgpt-pre .hljs-built_in{color:#7dd3fc}.chatgpt-pre .hljs-type{color:#c4b5fd}.chatgpt-pre .hljs-literal,.chatgpt-pre .hljs-number{color:#fca5a5}.chatgpt-pre .hljs-string{color:#86efac}.chatgpt-pre .hljs-comment{color:#737373;font-style:italic}.chatgpt-pre .hljs-variable{color:#d4d4d4}.chatgpt-pre .hljs-title,.chatgpt-pre .hljs-function{color:#c4b5fd}.chatgpt-pre .hljs-params{color:#d4d4d4}.chatgpt-pre .hljs-attr,.chatgpt-pre .hljs-attribute{color:#7dd3fc}.chatgpt-pre .hljs-meta{color:#a3a3a3}.chatgpt-pre .hljs-tag,.chatgpt-pre .hljs-name{color:#7dd3fc}.chatgpt-pre .hljs-symbol{color:#86efac}.chatgpt-pre .hljs-bullet{color:#fca5a5}.chatgpt-pre .hljs-section,.chatgpt-pre .hljs-selector-id{color:#c4b5fd}.chatgpt-pre .hljs-selector-class{color:#7dd3fc}.chatgpt-pre .hljs-operator,.chatgpt-pre .hljs-punctuation{color:#a3a3a3}.chatgpt-pre .hljs-addition{color:#86efac;background:#86efac0f}.chatgpt-pre .hljs-deletion{color:#fca5a5;background:#fca5a50f}.chatgpt-pre .chatgpt-flag{color:#f9a825}.gemini-block{background:0 0;flex-direction:column;gap:2px;width:712px;font-family:Google Sans Code,ui-monospace,Menlo,Consolas,monospace;display:flex}.gemini-header{background:#1e1f20;border-radius:16px 16px 4px 4px;justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.gemini-lang-label{font-size:14px;font-weight:var(--gem-sys-typography-type-scale--title-s-font-weight);color:#c4c7c5;align-items:center;gap:8px;font-family:Google Sans Flex,Google Sans,sans-serif;display:flex}.gemini-actions{align-items:center;gap:2px;display:flex}.gemini-action-btn{color:#6c7086;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;transition:color .15s,background .15s;display:flex}.gemini-action-btn:hover{color:#cdd6f4;background:#cdd6f414}.gemini-status{color:#cdd6f4;font-family:system-ui,sans-serif;font-size:11px}.gemini-body{background:#1e1f20;border-radius:4px 4px 16px 16px;flex-direction:column;display:flex;overflow:hidden}.gemini-pre{scrollbar-width:thin;scrollbar-color:#ffffff1a transparent;margin:0;padding:16px;overflow-x:auto}.gemini-pre::-webkit-scrollbar{width:4px;height:4px}.gemini-pre::-webkit-scrollbar-track{background:0 0}.gemini-pre::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:99px}.gemini-pre code{color:#cdd6f4;white-space:pre;background:0 0;font-family:Google Sans Code,ui-monospace,Menlo,Consolas,monospace;font-size:14px;line-height:1.65;display:block}.gemini-pre .hljs-keyword{color:#cba6f7}.gemini-pre .hljs-built_in{color:#89b4fa}.gemini-pre .hljs-type{color:#cba6f7}.gemini-pre .hljs-literal,.gemini-pre .hljs-number{color:#fab387}.gemini-pre .hljs-string{color:#a6e3a1}.gemini-pre .hljs-comment{color:#6c7086;font-style:italic}.gemini-pre .hljs-variable{color:#cdd6f4}.gemini-pre .hljs-title,.gemini-pre .hljs-function{color:#89b4fa}.gemini-pre .hljs-params{color:#cdd6f4}.gemini-pre .hljs-attr,.gemini-pre .hljs-attribute{color:#89dceb}.gemini-pre .hljs-meta,.gemini-pre .hljs-tag{color:#f38ba8}.gemini-pre .hljs-name{color:#89b4fa}.gemini-pre .hljs-symbol{color:#a6e3a1}.gemini-pre .hljs-bullet{color:#fab387}.gemini-pre .hljs-section{color:#cba6f7}.gemini-pre .hljs-operator{color:#89dceb}.gemini-pre .hljs-punctuation{color:#9399b2}.gemini-pre .hljs-addition{color:#a6e3a1;background:#a6e3a10f}.gemini-pre .hljs-deletion{color:#f38ba8;background:#f38ba80f}.gemini-pre .gemini-flag{color:#f9a825}.claude-block{border:.5px solid hsl(var(--border-400) / .15);background:#252524;border-radius:.5rem;flex-direction:column;width:712px;font-family:JetBrains Mono,ui-monospace,Menlo,Consolas,monospace;display:flex;overflow:hidden}.claude-header{background:#252524;justify-content:space-between;align-items:center;padding:10px 14px;display:flex}.claude-lang-label{color:#9a9a9a;font-family:JetBrains Mono,ui-monospace,Menlo,Consolas,monospace;font-size:12px;font-weight:400}.claude-copy-btn{color:#9a9a9a;cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;padding:4px;line-height:0;transition:color .15s,background .15s;display:flex}.claude-copy-btn:hover{color:#e0e0e0;background:#ffffff0f}.claude-pre{scrollbar-width:thin;scrollbar-color:#ffffff1a transparent;margin:0;padding:4px 14px 16px;overflow-x:auto}.claude-pre::-webkit-scrollbar{width:4px;height:4px}.claude-pre::-webkit-scrollbar-track{background:0 0}.claude-pre::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:99px}.claude-pre code{color:#c9c9c9;white-space:pre;background:0 0;font-family:JetBrains Mono,ui-monospace,Menlo,Consolas,monospace;font-size:14px;line-height:1.65;display:block}.claude-pre .hljs-keyword{color:#b8a9c9}.claude-pre .hljs-built_in{color:#9bafc4}.claude-pre .hljs-type{color:#b8a9c9}.claude-pre .hljs-literal,.claude-pre .hljs-number{color:#c4a882}.claude-pre .hljs-string{color:#9bb89b}.claude-pre .hljs-comment{color:#5a5a5a;font-style:italic}.claude-pre .hljs-variable{color:#c9c9c9}.claude-pre .hljs-title,.claude-pre .hljs-function{color:#9bafc4}.claude-pre .hljs-params{color:#c9c9c9}.claude-pre .hljs-attr,.claude-pre .hljs-attribute{color:#a8c4c4}.claude-pre .hljs-meta{color:#888}.claude-pre .hljs-tag,.claude-pre .hljs-name{color:#9bafc4}.claude-pre .hljs-symbol{color:#9bb89b}.claude-pre .hljs-bullet{color:#c4a882}.claude-pre .hljs-section{color:#b8a9c9}.claude-pre .hljs-operator{color:#888}.claude-pre .hljs-punctuation{color:#777}.claude-pre .hljs-addition{color:#9bb89b;background:#9bb89b0f}.claude-pre .hljs-deletion{color:#c4a882;background:#c4a8820f}.claude-pre .claude-flag{color:#f9a825}@media (width<=900px){.app{padding:24px 16px 60px}.app-title{font-size:22px}.blocks-grid{min-width:unset;grid-template-columns:1fr}.blocks-section{overflow-x:visible}}