*{box-sizing:border-box;margin:0;padding:0}body{display:flex;background:#f5f5f5;flex-direction:column;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}header{display:flex;background:#fff;border-bottom:1px solid #e0e0e0;justify-content:space-between;align-items: center;padding:.5rem 2rem}header .title{display:flex;flex-direction:row;gap:1rem}header .title button{cursor:pointer;background:0 0;border:none;padding:0}header .title button code{font-size:.8rem;font-weight:600}header .title button:hover code{background:#ddd}code{background:#f0f0f0;border-radius:4px;padding:.2rem .5rem;transition:background .3s;font-family:monospace}h1{color:#333;font-family:monospace;font-size:.8rem;font-weight:500}.status{display:flex;color:#666;align-items: center;gap:.5rem;font-family:monospace;font-size:.875rem}.status-indicator{background:#ccc;border-radius:50%;width:8px;height:8px}.status-indicator.connected{background:#4caf50}.status-indicator.connecting{background:#ff9800}.status-indicator.disconnected{background:#f44336}main{display:flex;overflow:hidden;flex:1;justify-content:center}.editor-container,.preview-container{display:flex;overflow:hidden;background:#fff;flex-direction:column;width:100%}.preview-container{background-color:#ddd}#editor,#preview{padding:2rem}#editor{outline:none;resize:none;color:#333;border:none;flex:1;font-family:Monaco,Menlo,Consolas,monospace;font-size:14px;line-height:1.6}#editor::placeholder{color:#999}#preview{overflow:auto;display:flex;flex-direction:column;gap:1.4rem;font-family:Courier New,Courier,monospace;font-size:.9rem}#preview .bold{font-weight:700}#preview .centered{text-align:center}#preview h2{text-align:right;font-size:1rem}#preview .dialogue{margin-left:2.5rem}#preview .dialogue h4{margin-left:2rem}.info{color:#999;display:flex;border-top:1px solid #e0e0e0;justify-content:space-between;align-items: center;padding:1rem 1.5rem;font-size:.75rem}