.toolbar{display:flex;flex-wrap:wrap;gap:4px;padding:12px;background:#f8f9fa;border-bottom:1px solid #dee2e6;align-items:center}.toolbar-group{display:flex;gap:2px;align-items:center}.toolbar-divider{width:1px;height:24px;background:#dee2e6;margin:0 4px}.toolbar button{background:#fff;border:1px solid #dee2e6;border-radius:4px;padding:6px 10px;cursor:pointer;font-size:14px;color:#495057;transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:32px;height:32px}.toolbar button:hover:not(:disabled){background:#e9ecef;border-color:#adb5bd}.toolbar button:active:not(:disabled){background:#dee2e6}.toolbar button:disabled{opacity:.5;cursor:not-allowed}.toolbar button.is-active{background:#0d6efd;color:#fff;border-color:#0d6efd}.toolbar button.is-active:hover{background:#0b5ed7;border-color:#0b5ed7}.heading-select{background:#fff;border:1px solid #dee2e6;border-radius:4px;padding:6px 8px;font-size:14px;color:#495057;cursor:pointer;min-width:100px;height:32px}.heading-select:hover{border-color:#adb5bd}.heading-select:focus{outline:none;border-color:#0d6efd;box-shadow:0 0 0 .2rem #0d6efd40}.color-picker-wrapper{position:relative}.color-button,.highlight-button{font-weight:700;position:relative}.color-button:after{content:"";position:absolute;bottom:2px;left:50%;transform:translate(-50%);width:16px;height:3px;background:currentColor}.color-picker-panel{position:absolute;top:100%;left:0;margin-top:4px;background:#fff;border:1px solid #dee2e6;border-radius:4px;padding:8px;box-shadow:0 2px 8px #00000026;display:flex;flex-wrap:wrap;gap:4px;width:200px;z-index:1000}.color-swatch{width:24px;height:24px;border:1px solid #dee2e6;border-radius:3px;cursor:pointer;padding:0;min-width:24px}.color-swatch:hover{border-color:#0d6efd;transform:scale(1.1)}.color-clear{flex:1 0 100%;background:#fff!important;color:#dc3545;font-size:12px;padding:4px;height:auto;min-width:auto}.punctuation-wrapper{position:relative}.punctuation-trigger{min-width:40px;font-weight:700}.punctuation-panel{position:absolute;top:100%;left:0;margin-top:4px;background:#fff;border:1px solid #dee2e6;border-radius:8px;padding:12px;box-shadow:0 4px 12px #00000026;z-index:1000;min-width:300px;max-width:400px}.punctuation-section{margin-bottom:12px}.punctuation-section:last-child{margin-bottom:0}.punctuation-label{font-size:12px;color:#6c757d;margin-bottom:6px;font-weight:500}.punctuation-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:4px}.punctuation-item{background:#fff;border:1px solid #dee2e6;border-radius:4px;padding:8px;cursor:pointer;font-size:16px;color:#212529;transition:all .2s;min-width:40px;height:40px;display:flex;align-items:center;justify-content:center}.punctuation-item:hover{background:#e9ecef;border-color:#0d6efd;transform:translateY(-2px);box-shadow:0 2px 4px #0000001a}.punctuation-item:active{transform:translateY(0)}.punctuation-item.bracket{font-size:14px;letter-spacing:-2px}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000}.modal-content{background:#fff;border-radius:8px;padding:24px;min-width:400px;box-shadow:0 4px 20px #0000004d}.modal-content h3{margin:0 0 16px;font-size:18px;color:#212529}.modal-content input{width:100%;padding:8px 12px;border:1px solid #dee2e6;border-radius:4px;font-size:14px;margin-bottom:16px}.modal-content input:focus{outline:none;border-color:#0d6efd;box-shadow:0 0 0 .2rem #0d6efd40}.modal-buttons{display:flex;gap:8px;justify-content:flex-end}.modal-buttons button{padding:8px 16px;min-width:80px}.modal-buttons button:first-child{background:#0d6efd;color:#fff;border-color:#0d6efd}.modal-buttons button:first-child:hover{background:#0b5ed7;border-color:#0b5ed7}.modal-buttons button:last-child{background:#6c757d;color:#fff;border-color:#6c757d}.modal-buttons button:last-child:hover{background:#5c636a;border-color:#5c636a}@media(max-width:768px){.toolbar{padding:8px;gap:2px}.toolbar button{min-width:28px;height:28px;padding:4px 6px;font-size:12px}.heading-select{min-width:80px;font-size:12px;height:28px}.punctuation-panel{min-width:250px}.modal-content{min-width:300px;margin:0 16px}}.align-icon{display:inline-block;font-size:16px;line-height:1;transform-origin:center}.align-left{transform:scaleX(.8);margin-right:auto}.align-center{transform:scale(.8);opacity:.9}.align-right{transform:scaleX(.8);margin-left:auto}.align-justify{transform:scaleX(1.2);font-weight:700}.toolbar button .align-icon{transition:all .2s}.toolbar button:hover .align-icon{transform:scale(1.1)}.toolbar button.is-active .align-left{transform:scaleX(.9)}.toolbar button.is-active .align-center{transform:scale(.9)}.toolbar button.is-active .align-right{transform:scaleX(.9)}.toolbar button.is-active .align-justify{transform:scaleX(1.3)}.document-editor{border:1px solid #ddd;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;height:100%;min-height:500px}.editor-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.ProseMirror{outline:none;min-height:400px;font-size:16px;line-height:1.6;color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}.ProseMirror:focus{outline:none}.ProseMirror p.is-editor-empty:first-child:before{content:attr(data-placeholder);float:left;color:#adb5bd;pointer-events:none;height:0}.ProseMirror h1{font-size:2em;font-weight:700;margin:1em 0 .5em;line-height:1.2}.ProseMirror h2{font-size:1.5em;font-weight:700;margin:.8em 0 .4em;line-height:1.3}.ProseMirror h3{font-size:1.3em;font-weight:700;margin:.6em 0 .3em;line-height:1.4}.ProseMirror h4{font-size:1.1em;font-weight:700;margin:.5em 0 .2em}.ProseMirror h5,.ProseMirror h6{font-size:1em;font-weight:700;margin:.4em 0 .2em}.ProseMirror p{margin:.5em 0}.ProseMirror ul,.ProseMirror ol{padding-left:2em;margin:.5em 0}.ProseMirror ol{list-style:none;counter-reset:list-counter;padding-left:2.5em}.ProseMirror ol>li{counter-increment:list-counter;position:relative;list-style:none}.ProseMirror ol>li::marker{content:none;display:none}.ProseMirror ol>li:before{content:counter(list-counter,trad-chinese-informal) "、";position:absolute;left:-2.5em;width:2em;text-align:right;color:#495057;font-weight:500}.ProseMirror ol ol{counter-reset:list-counter;padding-left:2.5em}.ProseMirror ol ol>li:before{content:"(" counter(list-counter,trad-chinese-informal) ")"}.ProseMirror ol ol ol{counter-reset:list-counter}.ProseMirror ol ol ol>li:before{content:counter(list-counter,decimal) "."}.ProseMirror li{margin:.2em 0;list-style:none}.ProseMirror li p{margin:0}.ProseMirror blockquote{border-left:4px solid #ddd;padding-left:1em;margin:1em 0;color:#666;font-style:italic}.ProseMirror code{background:#f5f5f5;padding:.2em .4em;border-radius:3px;font-family:Courier New,Courier,monospace;font-size:.9em}.ProseMirror pre{background:#2d2d2d;color:#f8f8f2;padding:1em;border-radius:5px;overflow-x:auto;margin:1em 0}.ProseMirror pre code{background:none;color:inherit;padding:0}.ProseMirror hr{border:none;border-top:2px solid #ddd;margin:2em 0}.ProseMirror a{color:#06c;text-decoration:underline;cursor:pointer}.ProseMirror a:hover{color:#0052a3}.ProseMirror img{max-width:100%;height:auto;border-radius:4px;margin:.5em 0}.ProseMirror table{border-collapse:collapse;width:100%;margin:1em 0;overflow:hidden}.ProseMirror th,.ProseMirror td{border:1px solid #ddd;padding:.5em .75em;text-align:left;min-width:100px}.ProseMirror th{background:#f5f5f5;font-weight:700}.ProseMirror td{vertical-align:top}.ProseMirror .selectedCell{background:#e3f2fd}.ProseMirror [style*="text-align: left"]{text-align:left}.ProseMirror [style*="text-align: center"]{text-align:center}.ProseMirror [style*="text-align: right"]{text-align:right}.ProseMirror [style*="text-align: justify"]{text-align:justify}.ProseMirror mark{background-color:#ffeb3b;padding:0 .2em;border-radius:2px}.ProseMirror ::selection{background:#b3d4fc}.editor-container::-webkit-scrollbar{width:8px}.editor-container::-webkit-scrollbar-track{background:#f1f1f1}.editor-container::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.editor-container::-webkit-scrollbar-thumb:hover{background:#555}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:#f5f7fa;color:#333}.app{display:flex;flex-direction:column;height:100vh;max-width:1400px;margin:0 auto}.app-header{background:#fff;padding:16px 24px;border-bottom:1px solid #dee2e6;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 4px #0000000d}.app-header h1{font-size:24px;color:#212529;font-weight:600}.header-actions{display:flex;gap:12px}.btn-primary,.btn-secondary{padding:8px 16px;border-radius:6px;border:none;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#0d6efd;color:#fff}.btn-primary:hover{background:#0b5ed7;transform:translateY(-1px);box-shadow:0 2px 4px #0d6efd4d}.btn-secondary{background:#6c757d;color:#fff}.btn-secondary:hover{background:#5c636a;transform:translateY(-1px);box-shadow:0 2px 4px #6c757d4d}.app-main{flex:1;padding:24px;overflow:auto;display:flex;gap:24px}.editor-section{flex:1;min-width:0}.output-section{flex:1;display:flex;flex-direction:column;gap:16px;min-width:0}.output-panel{background:#fff;border:1px solid #dee2e6;border-radius:8px;padding:16px;flex:1;display:flex;flex-direction:column;overflow:hidden}.output-panel h3{font-size:16px;margin-bottom:12px;color:#495057;font-weight:600}.output-code{flex:1;background:#f8f9fa;padding:12px;border-radius:4px;font-family:Courier New,Courier,monospace;font-size:12px;overflow:auto;white-space:pre-wrap;word-wrap:break-word;line-height:1.5;color:#212529}.app-footer{background:#fff;padding:12px 24px;border-top:1px solid #dee2e6;text-align:center;font-size:14px;color:#6c757d}.app-footer a{color:#0d6efd;text-decoration:none}.app-footer a:hover{text-decoration:underline}@media(max-width:1024px){.app-main{flex-direction:column}.output-section{max-height:400px}}@media(max-width:768px){.app-header{flex-direction:column;gap:12px;align-items:flex-start}.app-header h1{font-size:20px}.header-actions{width:100%;justify-content:flex-end}.app-main{padding:16px}.btn-primary,.btn-secondary{font-size:12px;padding:6px 12px}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{height:100vh}