:root{font-family:system-ui,-apple-system,Segoe UI,Microsoft YaHei,sans-serif;line-height:1.6;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#1a1a1a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;padding:20px;min-width:320px;min-height:100vh}#app{width:100%;max-width:1600px;margin:0 auto}.container{width:100%}h1{text-align:center;margin-bottom:30px;color:#646cff;font-size:2.5em}h2{font-size:1.2em;margin-bottom:12px;color:#888}.editor-container{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}.editor-panel,.preview-panel{display:flex;flex-direction:column;height:500px}#markdown-input{flex:1;width:100%;padding:15px;border:1px solid #444;border-radius:8px;background-color:#2a2a2a;color:#fff;font-family:Consolas,Monaco,Courier New,monospace;font-size:14px;resize:vertical;line-height:1.6}#markdown-input:focus{outline:none;border-color:#646cff}.preview-content{flex:1;width:100%;padding:15px;border:1px solid #444;border-radius:8px;background-color:#2a2a2a;overflow-y:auto;text-align:left}.preview-content h1{color:#fff;font-size:2em;margin:20px 0 16px;text-align:left}.preview-content h2{color:#fff;font-size:1.5em;margin:16px 0 12px}.preview-content h3{color:#fff;font-size:1.3em;margin:14px 0 10px}.preview-content p{margin:12px 0;line-height:1.7}.preview-content ul,.preview-content ol{margin:12px 0;padding-left:30px}.preview-content li{margin:6px 0}.preview-content pre{background-color:#1a1a1a;padding:15px;border-radius:6px;overflow-x:auto;margin:12px 0}.preview-content code{background-color:#1a1a1a;padding:2px 6px;border-radius:3px;font-family:Consolas,Monaco,Courier New,monospace;font-size:.9em}.preview-content pre code{background-color:transparent;padding:0}.preview-content blockquote{border-left:4px solid #646cff;padding-left:16px;margin:12px 0;color:#aaa;font-style:italic}.preview-content a{color:#646cff;text-decoration:none}.preview-content a:hover{text-decoration:underline}.preview-content hr{border:none;border-top:1px solid #444;margin:20px 0}.preview-content strong{font-weight:600;color:#fff}.preview-content em{font-style:italic}.preview-content table{width:100%;border-collapse:collapse;margin:12px 0}.preview-content table th,.preview-content table td{border:1px solid #444;padding:8px 12px;text-align:left}.preview-content table th{background-color:#333;font-weight:600}.button-container{text-align:center;margin-top:20px}.copy-button{padding:10px 24px;background-color:#646cff;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease}.copy-button:hover{background-color:#535bf2;transform:translateY(-2px)}.copy-button:active{transform:translateY(0)}.copy-button.copied{background-color:#4caf50}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb{background:#444;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}@media(max-width:1024px){.editor-container{grid-template-columns:1fr}.editor-panel,.preview-panel{height:400px}}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}#markdown-input,.preview-content,#html-output{background-color:#f5f5f5;color:#213547;border-color:#ddd}.preview-content h1,.preview-content h2,.preview-content h3,.preview-content strong{color:#213547}.preview-content pre,.preview-content code{background-color:#e8e8e8;color:#213547}.preview-content pre code{background-color:transparent}.preview-content blockquote{color:#666}.preview-content table th{background-color:#e8e8e8}.preview-content table th,.preview-content table td{border-color:#ddd}.preview-content hr{border-top-color:#ddd}::-webkit-scrollbar-track{background:#f5f5f5}::-webkit-scrollbar-thumb{background:#ccc}::-webkit-scrollbar-thumb:hover{background:#aaa}}