.container{max-width:800px;margin:0 auto;padding-top:60px}.wrapper{flex-direction:column;gap:10px;display:flex}.row{align-items:flex-start;gap:0 24px;display:flex}.axis-label{text-align:right;color:#0009;flex:0 0 80px;padding-top:10px;font-size:12px;line-height:1.3}.axis-label__en{text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px;font-size:10px}.axis-label__cn{font-size:12px}.common-text{white-space:pre-wrap;word-break:break-word;box-sizing:border-box;color:#000;background:0 0;border:none;outline:none;width:100%;min-height:100px;line-height:1.5}.input-area{resize:vertical;caret-color:#00e5ff;padding:0;font-size:32px}.output-area{font-size:32px}.output-area.char-grid{min-height:100px;padding:0}.char-grid{--cell-size:32px;flex-wrap:wrap;gap:0;display:flex}.char-box{width:var(--cell-size);height:var(--cell-size);box-sizing:border-box;display:inline-block}.char-box--empty{color:#0000}.hidden-char{visibility:hidden}.placeholder{opacity:.3}