.app{width: min(1280px, calc(100% - 32px));margin: 22px auto 20px;background:#fffdf8;border:1px solid #e2d8c8;
    border-radius: 14px;
    box-shadow: 0 8px 30px rgba(20, 30, 50, .08);
    display: flex;
    flex-direction: column;
    overflow: hidden;}
.top{padding:18px 20px;border-bottom:1px solid #e5e9f0}h1{font-size:20px;margin:0 0 6px}.sub{font-size:13px;color:#697386}
.content{padding:20px}.panel{border:1px solid #e5e9f0;border-radius:10px}
.panel-head{height:42px;background:#fafbfc;border-bottom:1px solid #e5e9f0;display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:13px;font-weight:600}
.box{padding:20px}.upload{display:block;text-align:center;padding:40px;border:2px dashed #cfd6e4;border-radius:10px;background:#fbfcfe;cursor:pointer}
.upload:hover{background:#f5f8ff}.upload strong{display:block;font-size:16px;margin-bottom:8px}.upload span{font-size:13px;color:#697386}
input[type=file]{display:none}.file{margin-top:12px;color:#667085;font-size:13px}h4{font-size:13px;margin:20px 0 10px}
.sizes{display:flex;gap:8px;flex-wrap:wrap}.size{border:1px solid #d5dbe5;border-radius:7px;padding:7px 12px;font-size:13px;cursor:pointer}
button{width:100%;margin-top:22px;padding:10px;border:0;border-radius:7px;background:#1f2937;color:#fff;cursor:pointer;font-size:13px}
button:disabled{opacity:.6;cursor:wait}.status{display:none;margin-top:14px;padding:10px 12px;border-radius:7px;background:#f5f7fa;border:1px solid #e5e9f0;font-size:13px;color:#667085}
.status.show{display:block}.status.error{color:#b42318;background:#fff5f5;border-color:#f1c0c0}
.note{margin-top:18px;padding:12px;background:#fafbfc;border:1px solid #e5e9f0;border-radius:8px;font-size:12px;color:#667085;line-height:1.7}

@media(max-width:850px){
  body{padding:0}
  .app{width:100%;height:auto;min-height:100vh;margin:0;border-radius:0;overflow:visible}
  .workspace{display:flex;flex-direction:column;height:auto;overflow:visible;flex:none}
  .workspace>.panel{height:auto;min-height:0;flex:none}
  .panel+.panel{border-left:0;border-top:1px solid #e5e9f0}
  .workspace .editor-wrap{height:220px;min-height:220px;flex:none}
  .status{width:100%;margin:0}
  .toolbar{margin:8px 0 2px}
}
@media(max-width:480px){
  .top{padding:14px 12px 10px}
  h1{font-size:18px}
  .sub{font-size:12px}
  .toolbar{gap:6px}
  button,.file-label{font-size:12px;padding:7px 9px}
  .line-numbers{flex-basis:42px;padding-right:7px}
  textarea,pre{padding:12px;font-size:12px}
}