*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;font-family:Arial,Helvetica,sans-serif}button{font:inherit}.compiler{display:flex;width:100%;height:100vh;min-height:320px;overflow:hidden;color:#333;background:#fff}.editor-panel{display:flex;flex-direction:column;flex-shrink:0;min-width:0;height:100%}.toolbar{height:67px;min-height:67px;display:flex;align-items:center;justify-content:space-between;border:1px solid #d7e0ea;background:#fff}.file-tab{height:100%;min-width:120px;display:flex;align-items:center;justify-content:center;color:#626b91;font-size:18px;border-right:1px solid #d7e0ea;border-bottom:1px solid #d7e0ea}.editor-actions{display:flex;align-items:center;gap:10px;padding:0 10px}.clear-btn,.run-btn{height:44px;padding:0 17px;border-radius:4px;font-size:18px;cursor:pointer}.clear-btn{color:#626b91;background:#fff;border:1px solid #cbd5e1}.run-btn{display:flex;align-items:center;gap:7px;color:#fff;background:#0755e9;border:1px solid #0755e9}.run-btn:hover{background:#0648c9}.clear-btn:hover{background:#f5f7fa}.code-area{flex:1;min-height:0;background:#fff;border-left:1px solid #e0e5ec}.resize-divider{width:7px;flex-shrink:0;background:#edf0f4;border-left:1px solid #d7e0ea;border-right:1px solid #d7e0ea;display:flex;align-items:center;justify-content:center;cursor:col-resize;touch-action:none;z-index:2}.resize-handle{width:21px;height:75px;display:flex;align-items:center;justify-content:center;color:#aab4c5;background:#fff;border:1px solid #cbd5e1;border-radius:5px}.resize-divider:hover{background:#dce7f7}.output-panel{flex:1;min-width:0;height:100%;display:flex;flex-direction:column}.output-toolbar{height:67px;min-height:67px;display:flex;align-items:center;justify-content:space-between;padding:0 17px 0 24px;border:1px solid #d7e0ea;color:#626b91;font-size:19px;background:#fff}.output-actions{display:flex;align-items:center;gap:20px}.icon-btn{display:flex;align-items:center;justify-content:center;padding:5px;border:none;background:transparent;color:#a0a7bf;cursor:pointer}.icon-btn:hover{color:#0755e9}.output-content{flex:1;min-height:0;overflow:auto;padding:18px;background:#f5f5f5;border:1px solid #d7e0ea;font-family:monospace;font-size:15px;line-height:25px;white-space:pre-wrap;overflow-wrap:anywhere}.output-line{margin-bottom:3px;color:#333}.output-line.error{color:#dc3545}.output-line.warn{color:#b7791f}.output-line.info{color:#2563eb}.menu-container{position:relative}.dropdown-menu{position:absolute;right:0;top:40px;min-width:165px;padding:6px;background:#fff;border:1px solid #e0e5ec;box-shadow:0 4px 15px #0000001f;border-radius:5px;z-index:10}.dropdown-menu button{display:flex;align-items:center;width:100%;gap:8px;padding:10px;border:0;background:#fff;text-align:left;cursor:pointer;color:#444}.dropdown-menu button:hover{background:#f1f5f9}.execution-frame{display:none}@media(max-width:700px){.compiler{flex-direction:column}.editor-panel{width:100%!important;height:60%;min-height:0}.resize-divider{width:100%;height:7px;cursor:row-resize}.resize-handle{width:65px;height:20px}.output-panel{width:100%;height:40%}.file-tab{min-width:90px;font-size:15px}.clear-btn,.run-btn{height:38px;font-size:14px;padding:0 12px}}