@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--bg-primary:#f9fafb;--bg-secondary:#fff;--text-primary:#0f172a;--text-secondary:#334155;--accent-color:#3b82f6;--accent-hover:#2563eb;--border-color:#e5e7eb;--danger-color:#ef4444;--success-color:#10b981;--sidebar-active-color:#10b981;--card-bg:#ffffffb3;--card-border:#ffffff80;--card-shadow:0 4px 6px -1px #0000000d, 0 2px 4px -1px #00000008;--glass-blur:blur(12px);--sidebar-w:240px;--header-h:72px;--transition-fast:.2s ease;--transition-normal:.3s ease;--syntax-default:#0f172a;--syntax-bracket:#000;--syntax-punctuation:#334155;--syntax-key:#0369a1;--syntax-string:#a31515;--syntax-number:#098658;--syntax-literal:#00f;--syntax-tag-bracket:#5c6bc0;--syntax-tag:maroon;--syntax-attr:red;--syntax-attr-value:#00f;--syntax-gutter:#64748b;--syntax-selection:#264f7840;--editor-placeholder:#475569;--btn-format-bg:var(--accent-color);--btn-format-text:white;--btn-format-border:none;--btn-format-hover:var(--accent-hover)}[data-theme=dark]{--bg-primary:#0f111a;--bg-secondary:#161822;--text-primary:#e4e5e8;--text-secondary:#9ca3af;--accent-color:#0ea5e9;--accent-hover:#38bdf8;--border-color:#2b2d38;--danger-color:#ef4444;--success-color:#10b981;--sidebar-active-color:#10b981;--card-bg:#161822bf;--card-border:#2b2d3880;--card-shadow:0 10px 15px -3px #00000080, 0 4px 6px -2px #0000004d;--syntax-default:#d4d4d4;--syntax-bracket:gold;--syntax-punctuation:#d4d4d4;--syntax-key:#9cdcfe;--syntax-string:#ce9178;--syntax-number:#b5cea8;--syntax-literal:#569cd6;--syntax-tag-bracket:gray;--syntax-tag:#569cd6;--syntax-attr:#9cdcfe;--syntax-attr-value:#ce9178;--syntax-gutter:#858585;--syntax-selection:#264f7880;--editor-placeholder:#6b7280;--btn-format-bg:var(--accent-color);--btn-format-text:white;--btn-format-border:none;--btn-format-hover:var(--accent-hover)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);transition:background-color var(--transition-normal), color var(--transition-normal);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;line-height:1.5}h1,h2,h3,h4,h5,h6{color:var(--text-primary);font-weight:600}a{color:var(--accent-color);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--accent-hover);text-decoration:underline}button{cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:1rem}.glass{background:var(--card-bg);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--card-border);box-shadow:var(--card-shadow)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.btn{transition:all var(--transition-fast);border-radius:.375rem;justify-content:center;align-items:center;gap:.5rem;padding:.5rem 1rem;font-weight:500;display:inline-flex}.btn-primary{background-color:var(--accent-color);color:#fff}.btn-primary:not(:disabled):hover{background-color:var(--accent-hover);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.tool-action-btn{cursor:pointer;transition:all var(--transition-fast);border-radius:.75rem;align-items:center;gap:.5rem;padding:.75rem 2rem;font-weight:600;display:flex}.tool-action-btn.primary{background:var(--accent-color);color:#fff;border:none}.tool-action-btn.primary:not(:disabled):hover{background:var(--accent-hover);transform:translateY(-1px)}.tool-action-btn.format{background:var(--btn-format-bg);color:var(--btn-format-text);border:var(--btn-format-border)}.tool-action-btn.format:not(:disabled):hover{background:var(--btn-format-hover);transform:translateY(-1px)}.tool-action-btn:active{transform:translateY(0)}.btn-icon{color:var(--text-secondary);transition:all var(--transition-fast);border-radius:.375rem;justify-content:center;align-items:center;padding:.5rem;display:inline-flex}.btn-icon:hover{color:var(--accent-color);background-color:var(--bg-secondary)}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}@media (width<=768px){.sidebar{border-right:none;border-bottom:1px solid var(--border-color);z-index:10;width:100%;height:auto;padding:1.25rem;position:relative}.sidebar-header{margin-bottom:1rem}.sidebar-nav ul{scrollbar-width:none;flex-direction:row;gap:.5rem;padding-bottom:.75rem;overflow-x:auto}.sidebar-nav ul::-webkit-scrollbar{display:none}.category-btn{white-space:nowrap;background:var(--bg-secondary);border:1px solid var(--border-color);width:auto;padding:.5rem 1rem}.category-btn.active{border-color:var(--sidebar-active-color)}.sidebar-sub-nav{border-left:none;flex-direction:row;gap:.5rem;margin-top:0;margin-left:0;padding-left:0;overflow-x:auto}.sub-category-btn{white-space:nowrap;background:var(--bg-primary);border:1px solid var(--border-color);width:auto;padding:.375rem .75rem}.sidebar-footer{display:none}}@media (width<=1024px){:root{--sidebar-w:240px}}@media (width<=768px){.app-container{flex-direction:column}.app-main-view{width:100%;padding-top:var(--header-h);margin-left:0}.main-content{min-height:auto}}.code-viewer{white-space:pre;color:var(--syntax-default);font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.9rem;line-height:1.6}.hljs-bracket{color:var(--syntax-bracket)}.hljs-punctuation{color:var(--syntax-punctuation)}.hljs-key{color:var(--syntax-key)}.hljs-string{color:var(--syntax-string)}.hljs-number{color:var(--syntax-number)}.hljs-literal{color:var(--syntax-literal)}.hljs-tag-bracket{color:var(--syntax-tag-bracket)}.hljs-tag{color:var(--syntax-tag)}.hljs-attr{color:var(--syntax-attr)}.hljs-attr-value{color:var(--syntax-attr-value)}.hljs-content{color:var(--syntax-default)}.code-viewer-container{width:100%;height:100%;overflow:auto}.code-viewer ::selection{background:var(--syntax-selection)}.code-editor-textarea::selection{background:var(--syntax-selection)}.code-editor-outer{border:1px solid var(--border-color);background:var(--bg-secondary);border-radius:.75rem;flex:1;width:100%;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:14px;line-height:22px;display:flex;overflow:hidden}.code-editor-lines{color:var(--syntax-gutter);text-align:right;-webkit-user-select:none;user-select:none;background:0 0;flex-shrink:0;width:3rem;padding:1rem .5rem 1rem 1rem;overflow:hidden;box-shadow:none!important;border-right:none!important}.code-editor-line-number{justify-content:flex-end;align-items:center;height:22px;font-size:12px;line-height:22px;display:flex}.code-editor-line-number.error{color:#f85149;opacity:1;font-weight:600}.code-editor-error-overlay{pointer-events:none;z-index:0;background:#f8514926;border-left:3px solid #f85149;height:22px;position:absolute;left:0;right:0}.code-editor-container{flex:1;position:relative}.code-editor-highlight{pointer-events:none;white-space:pre;width:100%;height:100%;color:var(--syntax-default);tab-size:2;margin:0;padding:1rem 1rem 1rem .5rem;position:absolute;top:0;left:0;overflow:hidden}.code-editor-textarea{color:#0000;width:100%;height:100%;caret-color:var(--text-primary);resize:none;font-family:inherit;font-size:inherit;line-height:inherit;white-space:pre;tab-size:2;background:0 0;margin:0;padding:1rem 1rem 1rem .5rem;position:absolute;top:0;left:0;overflow:auto;box-shadow:none!important;border:none!important;outline:none!important}.code-editor-textarea:focus,.code-editor-textarea:active,.code-editor-textarea:focus-visible{box-shadow:none!important;border:none!important;outline:none!important}.code-editor-outer:before,.code-editor-outer:after,.code-editor-lines:before,.code-editor-lines:after,.code-editor-container:before,.code-editor-container:after{display:none!important}.tools-grid{grid-template-columns:repeat(2,1fr);gap:2rem;display:grid}@media (width<=900px){.tools-grid{grid-template-columns:1fr}}.main-content{animation:.4s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.loader-overlay{width:100%;height:100%;color:var(--text-secondary);justify-content:center;align-items:center;font-size:1.125rem;display:flex}.sidebar{width:var(--sidebar-w);border-right:1px solid var(--border-color);z-index:50;background-color:var(--bg-primary);height:100vh;transition:transform var(--transition-normal);flex-direction:column;padding:1.5rem;display:flex;position:fixed;top:0;left:0;overflow-y:auto}.sidebar-header{margin-bottom:2rem}.logo{color:var(--accent-color);align-items:center;gap:.5rem;display:flex}.nav-title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);margin-bottom:.75rem;font-size:.75rem}.sidebar-nav ul{flex-direction:column;gap:.25rem;list-style:none;display:flex}.category-btn{width:100%;color:var(--text-secondary);transition:all var(--transition-fast);text-align:left;border-radius:.375rem;align-items:center;gap:.75rem;padding:.5rem .75rem;display:flex}.category-btn:hover{background-color:var(--bg-secondary);color:var(--text-primary);transform:translate(2px)}.expand-icon{opacity:.6;transition:all var(--transition-fast);border-radius:4px;justify-content:center;align-items:center;padding:.25rem;display:flex}.expand-icon:hover{opacity:1;background-color:#ffffff0d}.category-btn.active{color:var(--sidebar-active-color);background-color:#10b9811a;font-weight:600}.sidebar-sub-nav{border-left:1px solid var(--border-color);flex-direction:column;gap:.125rem;margin-top:.125rem;margin-left:1.25rem;padding-left:.5rem;list-style:none;animation:.2s ease-out slideIn;display:flex}.sub-category-btn{width:100%;color:var(--text-secondary);transition:all var(--transition-fast);text-align:left;border-radius:.25rem;align-items:center;gap:.625rem;padding:.375rem .625rem;font-size:.8125rem;display:flex}.sub-category-btn:hover{background-color:var(--bg-secondary);color:var(--text-primary)}.sub-category-btn.active{color:var(--sidebar-active-color);font-weight:500}.sidebar-footer{border-top:1px solid var(--border-color);flex-direction:column;gap:.5rem;margin-top:auto;padding-top:1rem;display:flex}.theme-toggle{color:var(--text-secondary);border-radius:.375rem;align-items:center;gap:.75rem;width:100%;padding:.5rem .75rem;display:flex}.version-btn{opacity:.7}@media (width<=768px){.sidebar{border-right:none;border-bottom:1px solid var(--border-color);z-index:10;width:100%;height:auto;padding:1.25rem;position:relative}.sidebar-header{margin-bottom:1rem}.sidebar-nav ul{scrollbar-width:none;flex-direction:row;gap:.5rem;padding-bottom:.75rem;overflow-x:auto}.sidebar-nav ul::-webkit-scrollbar{display:none}.category-btn{white-space:nowrap;background:var(--bg-secondary);border:1px solid var(--border-color);width:auto;padding:.5rem 1rem}.category-btn.active{border-color:var(--sidebar-active-color)}.sidebar-sub-nav{border-left:none;flex-direction:row;gap:.5rem;margin-top:0;margin-left:0;padding-left:0;overflow-x:auto}.sub-category-btn{white-space:nowrap;background:var(--bg-primary);border:1px solid var(--border-color);width:auto;padding:.375rem .75rem}.sidebar-footer{display:none}}.app-container{width:100%;min-height:100vh;display:flex;overflow-x:hidden}.app-main-view{min-height:100vh;margin-left:var(--sidebar-w);transition:margin-left var(--transition-normal);width:calc(100% - var(--sidebar-w));flex-direction:column;flex:1;padding-top:1.5rem;display:flex}.main-content{flex-direction:column;flex:1;width:100%;display:flex}@media (width<=1024px){:root{--sidebar-w:240px}}@media (width<=768px){.app-container{flex-direction:column}.app-main-view{width:100%;padding-top:var(--header-h);margin-left:0}.main-content{min-height:auto}}