*{box-sizing:border-box;margin:0;padding:0}
body,html{height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background-color:#f1f1f1;overflow:hidden}
.header{height:50px;background-color:#fff;border-bottom:1px solid #ddd;display:flex;align-items:center;justify-content:space-between;padding:0 20px}
.logo{font-size:18px;font-weight:700;color:#333}
.btn{background-color:#f15922;color:#fff;border:none;padding:4px 20px;font-size:14px;cursor:pointer;border-radius:4px;font-weight:700;transition:background .2s}
.btn:hover{background-color:#ff4742;}

.container{display:flex;height:calc(100% - 80px);width:100%}
.pane{flex:1;display:flex;flex-direction:column;height:100%;position:relative;}
.pane-title{height:40px;background-color:#e3e3e3;padding:5px 15px;font-size:18px;color:#555;font-weight:600;text-transform:uppercase;border-bottom:1px solid #ccc;}
#code-editor{flex:1;width:100%;resize:none;border:none;outline:0;font-family:"Courier New",Courier,monospace;font-size:15px;padding:15px;line-height:1.5;background-color:#fff;color:#000}
.divider{width:6px;background-color:#dae0e5;height:100%}
#preview-window{flex:1;width:100%;border:none;background-color:#fff}