:root{--bg-primary: #ffffff;--bg-surface: #f8fafc;--bg-elevated: #ffffff;--text-main: #0f172a;--text-muted: #64748b;--border-color: #e2e8f0;--accent-color: #0284c7;--accent-hover: #0369a1;--accent-light: #e0f2fe;--code-bg: #f1f5f9;--table-border: #cbd5e1;--table-stripe: #f8fafc;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "JetBrains Mono", Consolas, "Liberation Mono", Menlo, Courier, monospace;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--shadow-sm: 0 1px 3px rgba(0,0,0,.05);--shadow-md: 0 4px 6px -1px rgba(0,0,0,.08), 0 2px 4px -2px rgba(0,0,0,.05);--header-height: 64px}[data-theme=github-dark]{--bg-primary: #0d1117;--bg-surface: #161b22;--bg-elevated: #21262d;--text-main: #c9d1d9;--text-muted: #8b949e;--border-color: #30363d;--accent-color: #38bdf8;--accent-hover: #7dd3fc;--accent-light: #0c4a6e;--code-bg: #161b22;--table-border: #30363d;--table-stripe: #161b22}[data-theme=sepia]{--bg-primary: #fbf7ee;--bg-surface: #f4ecd8;--bg-elevated: #fcf9f2;--text-main: #3d3731;--text-muted: #7d7265;--border-color: #e4d8bc;--accent-color: #b45309;--accent-hover: #92400e;--accent-light: #fef3c7;--code-bg: #f2e7cd;--table-border: #e4d8bc;--table-stripe: #f6eedb}[data-theme=cyber]{--bg-primary: #0f172a;--bg-surface: #1e293b;--bg-elevated: #334155;--text-main: #f8fafc;--text-muted: #94a3b8;--border-color: #334155;--accent-color: #38bdf8;--accent-hover: #7dd3fc;--accent-light: #0369a1;--code-bg: #1e293b;--table-border: #334155;--table-stripe: #1e293b}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-main);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}.app-header{height:var(--header-height);background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem}.brand{display:flex;align-items:center;gap:.625rem;text-decoration:none;color:var(--text-main);font-weight:700;font-size:1.2rem}.brand-icon{width:32px;height:32px}.brand-badge{font-size:.75rem;padding:.15rem .45rem;background-color:var(--accent-light);color:var(--accent-color);border-radius:var(--radius-sm);font-weight:600}.header-actions{display:flex;align-items:center;gap:.75rem}.btn-group{display:flex;background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:2px}.btn-icon-text{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .75rem;font-size:.875rem;font-weight:500;color:var(--text-main);background:transparent;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s ease;white-space:nowrap}.btn-icon-text:hover{background-color:var(--border-color)}.btn-group .btn-icon-text.active{background-color:var(--accent-color);color:#fff}.btn-primary{background-color:var(--accent-color);color:#fff;border:1px solid transparent}.btn-primary:hover{background-color:var(--accent-hover)}.btn-outline{background-color:var(--bg-elevated);border:1px solid var(--border-color)}.btn-outline:hover{background-color:var(--border-color)}.select-control{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:.4rem 1.8rem .4rem .75rem;font-size:.875rem;font-weight:500;color:var(--text-main);background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:1rem}.workspace-toolbar{background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:.4rem 1.25rem;display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;color:var(--text-muted)}.toolbar-stats{display:flex;align-items:center;gap:1.25rem}.stat-item{display:inline-flex;align-items:center;gap:.35rem}.stat-value{font-weight:600;color:var(--text-main)}.toolbar-controls{display:flex;align-items:center;gap:.5rem}.workspace-container{display:flex;height:calc(100vh - var(--header-height) - 37px);min-height:520px;background-color:var(--bg-primary);position:relative}.pane{flex:1;height:100%;overflow:hidden;display:flex;flex-direction:column}.pane-editor{border-right:1px solid var(--border-color);background-color:var(--bg-primary)}.editor-textarea{width:100%;height:100%;padding:1.25rem;border:none;outline:none;resize:none;background-color:transparent;color:var(--text-main);font-family:var(--font-mono);font-size:.9375rem;line-height:1.6;white-space:pre-wrap;word-break:break-word;-moz-tab-size:2;tab-size:2}.pane-preview{background-color:var(--bg-primary);overflow:hidden!important;display:flex;flex-direction:column;padding:0!important}.mode-split .pane-editor{width:var(--editor-width, 50%);flex:none;min-width:220px;max-width:calc(100% - 220px);border-right:none}.mode-split .pane-preview{flex:1 1 0;min-width:220px}.pane-resizer{width:9px;margin:0 -4px;background-color:transparent;cursor:col-resize;position:relative;z-index:10;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;touch-action:none;transition:background-color .15s ease}.pane-resizer:before{content:"";position:absolute;top:0;bottom:0;left:4px;width:1px;background-color:var(--border-color);transition:background-color .15s ease}.resizer-handle{width:4px;height:24px;border-radius:9999px;background-color:var(--text-muted);opacity:.5;z-index:2;transition:all .15s ease}.pane-resizer:hover,.pane-resizer.is-dragging{background-color:var(--accent-light)}.pane-resizer:hover:before,.pane-resizer.is-dragging:before{background-color:var(--accent-color)}.pane-resizer:hover .resizer-handle,.pane-resizer.is-dragging .resizer-handle{background-color:var(--accent-color);opacity:1;height:38px}body.is-resizing{cursor:col-resize!important;-webkit-user-select:none!important;user-select:none!important}body.is-resizing .pane-editor textarea,body.is-resizing .pane-preview{pointer-events:none!important;-webkit-user-select:none!important;user-select:none!important}.mode-editor .pane-preview,.mode-editor .pane-resizer{display:none!important}.mode-editor .pane-editor{width:100%!important;flex:1 1 100%!important;border-right:none}.mode-preview .pane-editor,.mode-preview .pane-resizer{display:none!important}.mode-preview .pane-preview{width:100%!important;flex:1 1 100%!important}.markdown-body{max-width:860px;margin:0 auto;color:var(--text-main);font-size:1rem}.markdown-body h1,.markdown-body .md-preview-h1,.markdown-body h2,.markdown-body .md-preview-h2,.markdown-body h3,.markdown-body .md-preview-h3,.markdown-body h4,.markdown-body .md-preview-h4,.markdown-body h5,.markdown-body .md-preview-h5,.markdown-body h6,.markdown-body .md-preview-h6{margin-top:1.5rem;margin-bottom:.75rem;font-weight:600;line-height:1.3}.markdown-body h1,.markdown-body .md-preview-h1{font-size:2rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.markdown-body h2,.markdown-body .md-preview-h2{font-size:1.5rem;padding-bottom:.35rem;border-bottom:1px solid var(--border-color)}.markdown-body h3,.markdown-body .md-preview-h3{font-size:1.25rem}.markdown-body h4,.markdown-body .md-preview-h4{font-size:1.1rem}.markdown-body h5,.markdown-body .md-preview-h5{font-size:1rem}.markdown-body h6,.markdown-body .md-preview-h6{font-size:.875rem;color:var(--text-muted)}.markdown-body p,.markdown-body ul,.markdown-body ol{margin-bottom:1rem}.markdown-body ul,.markdown-body ol{padding-left:2rem}.markdown-body li+li{margin-top:.25rem}.markdown-body blockquote{padding:.5rem 1rem;margin:1rem 0;color:var(--text-muted);border-left:4px solid var(--accent-color);background-color:var(--code-bg);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.markdown-body code{padding:.2em .4em;font-family:var(--font-mono);font-size:.875em;background-color:var(--code-bg);border-radius:var(--radius-sm)}.markdown-body pre{margin:1rem 0;position:relative;background-color:var(--code-bg);border:1px solid var(--border-color);border-radius:var(--radius-md);overflow:hidden}.markdown-body pre code{display:block;padding:1.25rem;overflow-x:auto;background:transparent;font-size:.875rem}.code-header{display:flex;align-items:center;justify-content:space-between;padding:.35rem .75rem;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);font-size:.75rem;color:var(--text-muted);font-family:var(--font-mono)}.btn-copy-code{background:transparent;border:none;color:var(--text-muted);cursor:pointer;padding:.2rem .5rem;border-radius:var(--radius-sm);font-size:.75rem}.btn-copy-code:hover{background-color:var(--border-color);color:var(--text-main)}.markdown-body table{width:100%;border-collapse:collapse;margin:1.25rem 0;font-size:.9375rem}.markdown-body th,.markdown-body td{padding:.6rem .85rem;border:1px solid var(--table-border);text-align:left}.markdown-body th{background-color:var(--table-stripe);font-weight:600}.markdown-body tr:nth-child(2n) td{background-color:var(--table-stripe)}.markdown-body hr{height:2px;background-color:var(--border-color);border:none;margin:2rem 0}.markdown-body a{color:var(--accent-color);text-decoration:underline;text-underline-offset:3px}.markdown-body a:hover{color:var(--accent-hover)}.markdown-body img{max-width:100%;height:auto;border-radius:var(--radius-md);margin:1rem 0}.task-list-item{list-style-type:none;margin-left:-1.25rem;display:flex;align-items:center;gap:.5rem}.task-list-item input[type=checkbox]{accent-color:var(--accent-color);width:1rem;height:1rem}.seo-section{background-color:var(--bg-surface);border-top:1px solid var(--border-color);padding:4rem 1.5rem}.seo-container{max-width:1000px;margin:0 auto}.section-header{text-align:center;margin-bottom:3rem}.section-title{font-size:2rem;font-weight:700;margin-bottom:.75rem}.section-subtitle{color:var(--text-muted);font-size:1.125rem;max-width:680px;margin:0 auto}.feature-card{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease}.feature-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.feature-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.feature-desc{color:var(--text-muted);font-size:.9375rem;line-height:1.5}.cheatsheet-box{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);margin-bottom:4rem}.cheatsheet-tabs{display:flex;overflow-x:auto;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color)}.tab-btn{padding:.85rem 1.25rem;font-size:.9375rem;font-weight:600;color:var(--text-muted);background:transparent;border:none;cursor:pointer;white-space:nowrap;border-bottom:2px solid transparent;transition:all .15s ease}.tab-btn:hover{color:var(--text-main)}.tab-btn.active{color:var(--accent-color);border-bottom-color:var(--accent-color);background-color:var(--bg-elevated)}.tab-content{display:none;padding:1.5rem}.cheatsheet-tab-title{font-size:1.125rem;font-weight:600;color:var(--text-main);margin-bottom:1rem}.tab-content.active{display:block}.syntax-table{width:100%;border-collapse:collapse}.syntax-table th,.syntax-table td{padding:.75rem 1rem;border-bottom:1px solid var(--border-color);text-align:left;font-size:.9375rem}.syntax-table th{color:var(--text-muted);font-weight:600;font-size:.8125rem;text-transform:uppercase;letter-spacing:.05em}.syntax-code{font-family:var(--font-mono);background-color:var(--code-bg);padding:.25rem .5rem;border-radius:var(--radius-sm);display:inline-block;cursor:pointer;border:1px solid var(--border-color)}.syntax-code:hover{border-color:var(--accent-color)}.faq-heading{margin:0;padding:0;font-size:inherit;font-weight:inherit;line-height:inherit}.faq-list{display:flex;flex-direction:column;gap:1rem;margin-bottom:3rem}.faq-item{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-md);overflow:hidden}.faq-question{width:100%;padding:1.25rem;text-align:left;background:transparent;border:none;font-size:1.05rem;font-weight:600;color:var(--text-main);display:flex;align-items:center;justify-content:space-between;cursor:pointer}.faq-icon{transition:transform .2s ease;font-size:1.2rem;color:var(--text-muted)}.faq-item.open .faq-icon{transform:rotate(180deg)}.faq-answer{display:none;padding:0 1.25rem 1.25rem;color:var(--text-muted);font-size:.9375rem;line-height:1.6}.faq-item.open .faq-answer{display:block}.app-footer{background-color:var(--bg-primary);border-top:1px solid var(--border-color);padding:3rem 1.5rem;margin-top:auto}.footer-container{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:2rem}.footer-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem}.footer-brand{max-width:320px}.footer-brand p{color:var(--text-muted);font-size:.875rem;margin-top:.5rem}.footer-links-group{display:flex;gap:3rem}.footer-col h4,.footer-col .footer-col-title{font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;color:var(--text-main)}.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:.4rem}.footer-col a{color:var(--text-muted);text-decoration:none;font-size:.875rem;transition:color .15s ease}.footer-col a:hover{color:var(--accent-color)}.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;border-top:1px solid var(--border-color);padding-top:1.5rem;color:var(--text-muted);font-size:.8125rem}.lang-selector{display:flex;align-items:center;gap:.5rem}.lang-link{color:var(--text-muted);text-decoration:none;padding:.2rem .5rem;border-radius:var(--radius-sm);font-size:.8125rem}.lang-link:hover,.lang-link.active{color:var(--accent-color);background-color:var(--accent-light);font-weight:600}.page-wrapper{max-width:800px;margin:3rem auto;padding:0 1.5rem}.page-header{margin-bottom:2rem;border-bottom:1px solid var(--border-color);padding-bottom:1rem}.page-header h1{font-size:2.25rem;font-weight:700;margin-bottom:.5rem}.page-header p{color:var(--text-muted);font-size:1rem}.page-content section{margin-bottom:2rem}.page-content h2{font-size:1.35rem;font-weight:600;margin-bottom:.75rem;color:var(--text-main)}.page-content p{color:var(--text-main);line-height:1.7;margin-bottom:1rem}.page-content ul{padding-left:1.5rem;margin-bottom:1rem}.page-content li{margin-bottom:.5rem}.toast{position:fixed;bottom:2rem;right:2rem;background-color:#0f172a;color:#fff;padding:.75rem 1.25rem;border-radius:var(--radius-md);font-size:.875rem;font-weight:500;box-shadow:var(--shadow-md);z-index:100;opacity:0;transform:translateY(10px);transition:all .25s ease;pointer-events:none}.toast.show{opacity:1;transform:translateY(0)}@media (max-width: 768px){.app-header{padding:0 .75rem}.brand span{display:none}.workspace-container{flex-direction:column;height:auto}.pane{height:50vh}.pane-editor{border-right:none;border-bottom:1px solid var(--border-color)}.footer-top{flex-direction:column}.footer-links-group{flex-wrap:wrap;gap:1.5rem}}.nav-ecosystem{display:flex;align-items:center;gap:.5rem;margin-left:1.5rem}.nav-link{text-decoration:none;font-size:.8125rem;font-weight:500;color:var(--text-muted);padding:.3rem .6rem;border-radius:var(--radius-sm);transition:all .15s ease;display:inline-flex;align-items:center;gap:.35rem}.nav-link:hover,.nav-link.active{color:var(--text-main);background-color:var(--bg-elevated)}.nav-link .tag-soon{font-size:.65rem;font-weight:600;background-color:var(--accent-light);color:var(--accent-color);padding:.1rem .35rem;border-radius:4px}.editor-header-bar{display:flex;align-items:center;justify-content:space-between;padding:.35rem .65rem;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);font-size:.8125rem;min-height:40px;gap:.75rem;overflow:hidden}.format-btn-group{display:flex;align-items:center;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:.25rem;padding:.1rem 0}.format-btn-group::-webkit-scrollbar{display:none}.toolbar-group{display:inline-flex;align-items:center;gap:.2rem;flex-shrink:0}.toolbar-divider{width:1px;height:18px;background-color:var(--border-color);margin:0 .35rem;flex-shrink:0;opacity:.8}.btn-format{background:transparent;border:1px solid transparent;color:var(--text-muted);cursor:pointer;width:28px;height:28px;padding:0;border-radius:var(--radius-sm);font-size:.95rem;display:inline-flex;align-items:center;justify-content:center;position:relative;flex-shrink:0;transition:all .15s cubic-bezier(.4,0,.2,1)}.btn-format:hover{background-color:var(--bg-elevated);border-color:var(--border-color);color:var(--accent-color);box-shadow:0 1px 2px #0000000d;transform:translateY(-1px)}.btn-format:active{transform:translateY(0);background-color:var(--accent-light)}.btn-format .btn-text-badge{font-size:.65rem;font-weight:800;position:absolute;bottom:2px;right:2px;line-height:1;font-family:var(--font-mono);color:var(--text-muted)}.btn-format:hover .btn-text-badge{color:var(--accent-color)}.editor-mode-label{font-size:.75rem;color:var(--text-muted);white-space:nowrap;flex-shrink:0;padding-left:.5rem;-webkit-user-select:none;user-select:none}.preview-header-bar{display:flex;align-items:center;justify-content:space-between;padding:.35rem .75rem;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);font-size:.8125rem;color:var(--text-muted)}.tool-page{max-width:1200px;margin:1.5rem auto 4rem;padding:0 1.5rem}.tool-hero{text-align:center;max-width:760px;margin:1.5rem auto 2.5rem}.tool-badge{display:inline-flex;align-items:center;gap:.4rem;background-color:var(--accent-light);color:var(--accent-color);font-size:.8125rem;font-weight:600;padding:.35rem .85rem;border-radius:9999px;margin-bottom:1rem}.tool-title{font-size:2.25rem;font-weight:800;letter-spacing:-.025em;color:var(--text-main);margin-bottom:.75rem;line-height:1.25}.tool-desc{font-size:1.05rem;color:var(--text-muted);line-height:1.6}.tool-card-box{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;margin-bottom:3.5rem}.drop-zone{border:2px dashed var(--border-color);border-radius:var(--radius-lg);margin:2rem;padding:4rem 2rem;text-align:center;background-color:var(--bg-surface);cursor:pointer;transition:all .2s ease}.drop-zone:hover,.drop-zone.drag-over{border-color:var(--accent-color);background-color:var(--accent-light)}.drop-icon{font-size:3.5rem;color:var(--accent-color);margin-bottom:1rem}.drop-title{font-size:1.25rem;font-weight:600;color:var(--text-main);margin-bottom:.5rem}.drop-hint{font-size:.875rem;color:var(--text-muted);margin-bottom:1.5rem}.drop-actions{display:flex;justify-content:center;gap:.75rem;flex-wrap:wrap}.options-bar{display:flex;justify-content:center;gap:1.5rem;padding:1rem 2rem;background-color:var(--bg-surface);border-top:1px solid var(--border-color);flex-wrap:wrap}.checkbox-label{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--text-main);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:1rem;height:1rem;accent-color:var(--accent-color);cursor:pointer}.progress-container{padding:4rem 2rem;text-align:center}.progress-bar-wrapper{max-width:480px;height:8px;background-color:var(--border-color);border-radius:9999px;margin:0 auto 1rem;overflow:hidden}.progress-bar-inner{height:100%;width:0%;background-color:var(--accent-color);transition:width .2s ease;border-radius:9999px}.progress-status-text{font-size:.9375rem;color:var(--text-muted);font-weight:500}.result-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);flex-wrap:wrap;gap:.75rem}.result-stats{display:flex;align-items:center;gap:.5rem}.stat-pill{font-size:.8125rem;color:var(--text-muted);background-color:var(--bg-elevated);padding:.25rem .6rem;border-radius:var(--radius-sm);border:1px solid var(--border-color)}.stat-pill strong{color:var(--text-main)}.tab-switch{display:flex;background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:2px}.tab-btn{background:transparent;border:none;font-size:.8125rem;font-weight:500;color:var(--text-muted);padding:.35rem .75rem;border-radius:4px;cursor:pointer;transition:all .15s ease}.tab-btn.active{background-color:var(--bg-elevated);color:var(--text-main);box-shadow:var(--shadow-sm);font-weight:600}.result-actions{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.output-container{height:580px;overflow:hidden;position:relative}.md-result-textarea{width:100%;height:100%;border:none;outline:none;resize:none;padding:1.5rem;font-family:var(--font-mono);font-size:.9375rem;line-height:1.6;background-color:var(--bg-elevated);color:var(--text-main)}.md-result-preview{height:100%;overflow-y:auto;padding:2rem;background-color:var(--bg-elevated)}.card-workspace{display:grid;grid-template-columns:420px 1fr;gap:2rem;align-items:start;margin-bottom:3.5rem}.card-control-panel{display:flex;flex-direction:column;gap:1.25rem}.control-box{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.25rem;box-shadow:var(--shadow-sm)}.control-box-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.control-box-header h4{font-size:.9375rem;font-weight:600;color:var(--text-main);display:flex;align-items:center;gap:.4rem}.btn-text-sm{background:transparent;border:none;color:var(--accent-color);font-size:.8125rem;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .4rem;border-radius:var(--radius-sm)}.btn-text-sm:hover{background-color:var(--accent-light)}.sample-chips{display:flex;gap:.4rem;margin-bottom:.75rem;flex-wrap:wrap}.chip-btn{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:9999px;font-size:.75rem;padding:.25rem .6rem;color:var(--text-muted);cursor:pointer;transition:all .15s ease}.chip-btn:hover{border-color:var(--accent-color);color:var(--accent-color);background-color:var(--bg-elevated)}.card-input-textarea{width:100%;height:220px;border:1px solid var(--border-color);border-radius:var(--radius-md);padding:.875rem;font-family:var(--font-mono);font-size:.875rem;line-height:1.5;background-color:var(--bg-surface);color:var(--text-main);resize:vertical;outline:none;transition:border-color .15s ease}.card-input-textarea:focus{border-color:var(--accent-color)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:.75rem}.form-row.checkboxes-row{display:flex;flex-direction:column;gap:.6rem;margin-top:.5rem;margin-bottom:0}.form-group label{display:block;font-size:.75rem;font-weight:500;color:var(--text-muted);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.04em}.input-control{width:100%;padding:.45rem .65rem;border:1px solid var(--border-color);border-radius:var(--radius-sm);background-color:var(--bg-surface);color:var(--text-main);font-size:.875rem;outline:none;transition:border-color .15s ease}.input-control:focus{border-color:var(--accent-color)}.card-preview-panel{position:sticky;top:calc(var(--header-height) + 1.5rem);display:flex;flex-direction:column;gap:1rem}.card-action-bar{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;flex-wrap:wrap}.preview-stage{background-color:var(--bg-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:2.5rem 1.5rem;display:flex;justify-content:center;align-items:center;overflow:auto;box-shadow:inset 0 2px 4px #00000008}.card-export-wrapper{padding:2.5rem;border-radius:20px;display:inline-block;box-sizing:border-box;transition:background .3s ease}.card-export-wrapper.theme-minimal{background:#f1f5f9}.card-export-wrapper.theme-midnight{background:linear-gradient(135deg,#0b0f19,#1e1b4b,#0f172a)}.card-export-wrapper.theme-sunset{background:linear-gradient(135deg,#ffedd5,#fecdd3,#fed7aa)}.card-export-wrapper.theme-emerald{background:linear-gradient(135deg,#ecfdf5,#d1fae5,#a7f3d0)}.card-export-wrapper.theme-sepia{background:linear-gradient(135deg,#fef3c7,#fae8b4,#f5e0a6)}.card-export-wrapper.theme-aurora{background:linear-gradient(135deg,#4f46e5,#7c3aed,#db2777)}.social-card{box-sizing:border-box;border-radius:16px;transition:all .3s ease;overflow:hidden;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000000d}.card-style-minimal{background-color:#fff;color:#0f172a;border:1px solid #e2e8f0}.card-style-midnight{background-color:#0d1117;color:#f1f5f9;border:1px solid rgba(255,255,255,.12);box-shadow:0 25px 50px -12px #0009}.card-style-sunset{background-color:#fffffff0;color:#1e293b;border:1px solid rgba(255,255,255,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.card-style-emerald{background-color:#fff;color:#064e3b;border:1px solid #a7f3d0}.card-style-sepia{background-color:#fbf7ee;color:#3d3731;border:1px solid #e4d8bc}.card-style-aurora{background-color:#0f172aeb;color:#f8fafc;border:1px solid rgba(255,255,255,.2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.social-card[data-ratio=auto]{width:640px;max-width:100%}.social-card[data-ratio=square]{width:640px;min-height:640px;aspect-ratio:1 / 1;display:flex;flex-direction:column;justify-content:space-between}.social-card[data-ratio=portrait]{width:580px;min-height:770px;aspect-ratio:3 / 4;display:flex;flex-direction:column;justify-content:space-between}.social-card[data-ratio=landscape]{width:760px;min-height:428px;aspect-ratio:16 / 9;display:flex;flex-direction:column;justify-content:space-between}.social-card[data-font=sans]{font-family:var(--font-sans)}.social-card[data-font=serif]{font-family:Georgia,Cambria,Times New Roman,Times,serif}.social-card[data-font=mono]{font-family:var(--font-mono)}.social-card[data-padding=compact]{padding:24px}.social-card[data-padding=normal]{padding:36px}.social-card[data-padding=spacious]{padding:48px}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;border-bottom:1px solid currentColor;opacity:.9;padding-bottom:1rem}.author-info{display:flex;align-items:center;gap:.75rem}.author-avatar{width:42px;height:42px;border-radius:50%;background:var(--accent-color);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.15rem;box-shadow:var(--shadow-sm)}.author-meta{display:flex;flex-direction:column}.author-name{font-weight:700;font-size:1rem;line-height:1.2}.author-handle{font-size:.8125rem;opacity:.65}.card-date{font-size:.8125rem;opacity:.65;font-weight:500}.card-body{flex-grow:1}.card-body.markdown-body{font-size:1.05rem;line-height:1.7}.card-body.markdown-body h1,.card-body.markdown-body h2,.card-body.markdown-body h3{margin-top:1rem;margin-bottom:.5rem}.card-body.markdown-body blockquote{border-left-width:4px;margin:1rem 0;padding:.5rem 1rem;opacity:.9}.card-body.markdown-body pre{margin:1rem 0;border-radius:8px}.card-footer-watermark{display:flex;align-items:center;justify-content:flex-end;gap:.4rem;font-size:.75rem;opacity:.55;margin-top:1.5rem;padding-top:.75rem;border-top:1px dashed currentColor}.watermark-logo{opacity:.75}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-bottom:4rem}.feature-card{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.75rem;box-shadow:var(--shadow-sm)}.feature-icon{font-size:2rem;color:var(--accent-color);margin-bottom:1rem}.feature-title{font-size:1.15rem;font-weight:700;color:var(--text-main);margin-bottom:.5rem}.feature-desc{font-size:.9375rem;color:var(--text-muted);line-height:1.6}.guide-section{margin-bottom:4rem}.section-title{font-size:1.75rem;font-weight:700;color:var(--text-main);text-align:center;margin-bottom:2rem}.steps-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}.step-card{background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.75rem;position:relative}.step-number{font-size:2.25rem;font-weight:800;color:var(--accent-color);opacity:.3;display:block;margin-bottom:.5rem}.step-card h4{font-size:1.1rem;font-weight:600;color:var(--text-main);margin-bottom:.5rem}.step-card p{font-size:.9375rem;color:var(--text-muted);line-height:1.6}.faq-section{margin-bottom:4rem}.faq-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem}.faq-grid .faq-item{padding:1.5rem;background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-lg)}.faq-grid .faq-item h4{font-size:1.05rem;font-weight:600;color:var(--text-main);margin-bottom:.5rem}.faq-grid .faq-item p{font-size:.9375rem;color:var(--text-muted);line-height:1.6}@media (max-width: 900px){.card-workspace{grid-template-columns:1fr}.card-preview-panel{position:static}.social-card[data-ratio=auto],.social-card[data-ratio=square],.social-card[data-ratio=portrait],.social-card[data-ratio=landscape]{width:100%;min-height:auto}}.toolbar-checkbox{display:inline-flex;align-items:center;gap:.4rem;font-size:.8125rem;font-weight:500;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:.3rem .6rem;border-radius:var(--radius-sm);transition:all .15s ease}.toolbar-checkbox:hover{background-color:var(--bg-surface);color:var(--text-main)}.toolbar-checkbox input[type=checkbox]{accent-color:var(--accent-color);width:.95rem;height:.95rem;cursor:pointer}.toolbar-checkbox span{display:inline-flex;align-items:center;gap:.3rem}.pane-card-header{display:flex;align-items:center;justify-content:space-between;padding:.4rem .85rem;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);-webkit-user-select:none;user-select:none;min-height:38px;box-sizing:border-box}.pane-title-group{display:flex;align-items:center;gap:.5rem}.pane-badge{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;padding:.15rem .45rem;border-radius:4px;background-color:var(--accent-light);color:var(--accent-color)}.pane-badge.badge-preview{background-color:#ecfdf5;color:#059669}[data-theme=github-dark] .pane-badge.badge-preview,[data-theme=cyber] .pane-badge.badge-preview{background-color:#064e3b;color:#34d399}.pane-subinfo{font-size:.75rem;color:var(--text-muted)}.pane-actions{display:flex;align-items:center;gap:.35rem}.btn-pane-action{background:transparent;border:1px solid transparent;color:var(--text-muted);cursor:pointer;padding:.25rem .4rem;border-radius:var(--radius-sm);font-size:.95rem;display:inline-flex;align-items:center;justify-content:center;transition:all .15s ease}.btn-pane-action:hover{background-color:var(--bg-elevated);border-color:var(--border-color);color:var(--text-main)}.pane-card-footer{display:flex;align-items:center;justify-content:space-between;padding:.35rem .85rem;background-color:var(--bg-surface);border-top:1px solid var(--border-color);font-size:.75rem;color:var(--text-muted);-webkit-user-select:none;user-select:none;min-height:28px;box-sizing:border-box}.pane-footer-badge{font-size:.7rem;font-weight:600;padding:.1rem .4rem;border-radius:4px;background-color:var(--bg-elevated);border:1px solid var(--border-color)}.pane-footer-badge.badge-success{background-color:#f0fdf4;color:#16a34a;border-color:#bbf7d0}[data-theme=github-dark] .pane-footer-badge.badge-success,[data-theme=cyber] .pane-footer-badge.badge-success{background-color:#064e3b;color:#4ade80;border-color:#047857}.preview-scroll-container{flex:1 1 0;min-height:0;height:100%;overflow-y:auto!important;overflow-x:hidden;scroll-behavior:auto!important;-webkit-overflow-scrolling:touch}.pane-preview .markdown-body{padding:2rem;box-sizing:border-box;min-height:100%}.mobile-symbols-bar{display:none;overflow-x:auto;white-space:nowrap;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:.3rem .5rem;gap:.35rem;-webkit-overflow-scrolling:touch}.mobile-symbols-bar::-webkit-scrollbar{display:none}.sym-btn{background:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);font-family:var(--font-mono);font-size:.8125rem;padding:.25rem .55rem;cursor:pointer;transition:all .15s ease;-webkit-user-select:none;user-select:none}.sym-btn:active{background-color:var(--accent-light);color:var(--accent-color)}@media (max-width: 768px){.app-header{height:auto;padding:.6rem .75rem;flex-wrap:wrap;gap:.5rem}.nav-ecosystem{display:none}.header-actions{width:100%;justify-content:space-between;gap:.4rem;overflow-x:auto;padding-bottom:.2rem}.workspace-toolbar{padding:.5rem .75rem;height:auto;flex-direction:column;align-items:stretch;gap:.5rem}.toolbar-stats{justify-content:space-between;font-size:.75rem}.toolbar-controls{justify-content:flex-end;overflow-x:auto}.workspace-container{flex-direction:column!important;height:auto!important;min-height:0!important;padding:.75rem;gap:1rem;background-color:var(--bg-surface)}.pane{height:auto!important;min-height:380px;border-radius:var(--radius-md);border:1px solid var(--border-color)!important;box-shadow:var(--shadow-sm);overflow:hidden;background-color:var(--bg-elevated)}.pane-editor{width:100%!important;max-width:100%!important;min-width:0!important}.pane-preview{width:100%!important;min-width:0!important}.editor-textarea{height:320px!important;min-height:280px;padding:1rem}.preview-scroll-container{height:380px!important;min-height:320px}.pane-preview .markdown-body{padding:1.25rem}.mobile-symbols-bar{display:flex}.pane-resizer{display:none!important}}@media print{body{background:#fff!important;color:#000!important;padding:0!important}.app-header,.workspace-toolbar,.pane-editor,.pane-resizer,.pane-card-header,.pane-card-footer,.seo-section,.app-footer,.toast,.editor-header-bar,.btn-copy-code{display:none!important}.workspace-container{display:block!important;height:auto!important;min-height:0!important;padding:0!important;background:transparent!important}.pane-preview{display:block!important;width:100%!important;height:auto!important;overflow:visible!important;padding:0!important}.preview-scroll-container{height:auto!important;overflow:visible!important}.markdown-body{max-width:100%!important;padding:0!important;color:#000!important;background:transparent!important}.markdown-body pre,.markdown-body code{white-space:pre-wrap!important;word-break:break-all!important}.markdown-body h1,.markdown-body h2,.markdown-body h3{page-break-after:avoid}.markdown-body table,.markdown-body pre,.markdown-body blockquote{page-break-inside:avoid}}.app-header{height:56px;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem;box-sizing:border-box}.header-left{display:flex;align-items:center;gap:1.25rem}.brand{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-weight:700;font-size:1.1rem;color:var(--text-main);-webkit-user-select:none;user-select:none}.brand-badge{font-size:.65rem;font-weight:800;letter-spacing:.05em;background-color:var(--accent-light);color:var(--accent-color);padding:.15rem .4rem;border-radius:4px}.nav-ecosystem{display:flex;align-items:center;gap:.35rem}.nav-link{text-decoration:none;font-size:.8125rem;font-weight:500;color:var(--text-muted);padding:.35rem .65rem;border-radius:var(--radius-sm);display:inline-flex;align-items:center;gap:.35rem;transition:all .15s ease}.nav-link:hover{color:var(--text-main);background-color:var(--bg-elevated)}.nav-link.active{color:var(--accent-color);background-color:var(--accent-light);font-weight:600}.header-actions{display:flex;align-items:center;gap:.6rem}.header-control-item .select-control{height:32px;padding:.25rem 1.6rem .25rem .65rem;font-size:.8125rem;font-weight:500;color:var(--text-main);background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;background-position:right .45rem center;transition:all .15s ease}.header-control-item .select-control:hover{border-color:var(--accent-color)}.view-mode-segmented{display:inline-flex;background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:2px;gap:2px}.view-mode-segmented .btn-icon-text{border:none;background:transparent;color:var(--text-muted);font-size:.8125rem;font-weight:500;padding:.25rem .65rem;height:26px;border-radius:4px;cursor:pointer;display:inline-flex;align-items:center;gap:.35rem;transition:all .15s ease}.view-mode-segmented .btn-icon-text:hover{color:var(--text-main)}.view-mode-segmented .btn-icon-text.active{background-color:var(--accent-color);color:#fff;font-weight:600;box-shadow:var(--shadow-sm)}.header-primary-actions{display:flex;align-items:center;gap:.4rem}.btn-header-action{height:32px;font-size:.8125rem;font-weight:600;padding:0 .75rem;border-radius:var(--radius-sm);display:inline-flex;align-items:center;gap:.35rem;text-decoration:none;cursor:pointer;transition:all .15s ease}.workspace-toolbar{height:38px;background-color:var(--bg-surface);border-bottom:1px solid var(--border-color);padding:0 1.25rem;display:flex;align-items:center;justify-content:space-between;font-size:.8125rem;color:var(--text-muted);box-sizing:border-box}.toolbar-stats{display:flex;align-items:center;gap:.5rem}.toolbar-stats .stat-item{display:inline-flex;align-items:center;gap:.35rem;font-size:.8125rem}.toolbar-stats .stat-sep{opacity:.4;font-size:.75rem}.toolbar-stats .stat-value{color:var(--text-main);font-weight:600}.toolbar-controls{display:flex;align-items:center;gap:.35rem}.toolbar-controls .btn-icon-text{height:28px;padding:0 .55rem;font-size:.775rem;font-weight:500;border-radius:var(--radius-sm);display:inline-flex;align-items:center;gap:.3rem;background-color:var(--bg-elevated);border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;transition:all .15s ease}.toolbar-controls .btn-icon-text:hover{background-color:var(--bg-surface);border-color:var(--accent-color);color:var(--accent-color)}.toolbar-divider{width:1px;height:16px;background-color:var(--border-color);margin:0 .25rem}.btn-mobile-menu{display:none;background:transparent;border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);font-size:1.25rem;width:34px;height:34px;align-items:center;justify-content:center;cursor:pointer;transition:all .15s ease}.btn-mobile-menu:hover{background-color:var(--bg-elevated);border-color:var(--accent-color);color:var(--accent-color)}.mobile-drawer{position:fixed;top:0;right:-320px;width:300px;height:100vh;background-color:var(--bg-surface);border-left:1px solid var(--border-color);box-shadow:-4px 0 20px #00000026;z-index:1000;display:flex;flex-direction:column;transition:right .25s cubic-bezier(.4,0,.2,1)}.mobile-drawer.open{right:0}.mobile-drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0006;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;opacity:0;pointer-events:none;transition:opacity .25s ease}.mobile-drawer-backdrop.open{opacity:1;pointer-events:auto}.mobile-drawer-header{height:52px;padding:0 1.25rem;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-color)}.mobile-drawer-title{font-weight:700;font-size:1rem;color:var(--text-main)}.btn-drawer-close{background:transparent;border:none;font-size:1.25rem;color:var(--text-muted);cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center}.btn-drawer-close:hover{color:var(--text-main)}.mobile-drawer-content{flex:1;overflow-y:auto;padding:1.25rem;display:flex;flex-direction:column;gap:1.5rem}.drawer-group-title{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:.75rem;display:block}.drawer-links{display:flex;flex-direction:column;gap:.5rem}.drawer-link{display:flex;align-items:center;gap:.6rem;padding:.6rem .85rem;border-radius:var(--radius-sm);text-decoration:none;font-size:.875rem;font-weight:500;color:var(--text-main);background-color:var(--bg-elevated);border:1px solid var(--border-color);transition:all .15s ease}.drawer-link.active{background-color:var(--accent-light);color:var(--accent-color);font-weight:600;border-color:var(--accent-color)}.drawer-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.drawer-btn{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem .5rem;background-color:var(--bg-elevated);border:1px solid var(--border-color);border-radius:var(--radius-sm);color:var(--text-main);font-size:.8125rem;font-weight:500;cursor:pointer;transition:all .15s ease}.drawer-btn:hover{border-color:var(--accent-color);color:var(--accent-color)}@media (max-width: 768px){.app-header{height:50px;padding:0 .85rem}.nav-ecosystem,.header-control-item,.header-primary-actions{display:none!important}.btn-mobile-menu{display:inline-flex}.view-mode-segmented .btn-icon-text span{display:none}.view-mode-segmented .btn-icon-text{padding:.25rem .5rem;height:28px;font-size:.95rem}.workspace-toolbar{height:34px;padding:0 .85rem}.toolbar-stats .stat-item:nth-child(n+4),.toolbar-stats .stat-sep:nth-child(n+3){display:none}.toolbar-controls .toolbar-divider:nth-child(n+4),.toolbar-controls .btn-icon-text:nth-child(n+5){display:none}}