@media (max-width:768px){
  .feed{padding:16px}
  .gen-bar{padding:12px 16px 8px}
  .sp-grid{gap:8px 12px;flex-wrap:wrap}
  /* 窄屏：并排改为上下堆叠；勿隐藏 .gen-align-bar，否则靠左/靠右无法操作 */
  #panel-video.align-left,#panel-video.align-right,#panel-image.align-left,#panel-image.align-right{flex-direction:column;align-items:center}
  #panel-video.align-left .gen-bar,#panel-video.align-right .gen-bar,#panel-image.align-left .gen-bar,#panel-image.align-right .gen-bar{width:780px;max-width:calc(100% - 32px);border-left:none;border-right:none}
  #panel-video.align-left .feed,#panel-video.align-right .feed,#panel-image.align-left .feed,#panel-image.align-right .feed{width:780px;max-width:calc(100% - 32px)}
  .api-body{padding:24px 20px 64px}
  .overlay-panel{width:100vw}
}

@media (max-width:640px){
  .topbar{padding:0 12px;gap:6px;height:48px}
  .topbar-logo{max-height:34px;max-width:min(140px,46vw)}
  .topbar-logo .topbar-logo-img{max-height:34px}
  .topbar-brand{display:none}
  .topbar-nav{margin-left:12px;gap:0}
  .topbar-tab{font-size:calc(12 * 1rem / 16);padding:6px 10px}
  .topbar-balance span{font-size:calc(11 * 1rem / 16)}
  .topbar-balance{padding:4px 8px}
  .theme-hub-popover{right:-4px;width:min(340px,calc(100vw - 16px))}
  .user-menu{width:calc(100vw - 24px);right:-8px}

  #panel-video .feed,#panel-video .gen-bar,#panel-image .feed,#panel-image .gen-bar{max-width:100%}
  .panel{padding-bottom:0}
  .feed{padding:16px 12px}
  .result-card{padding:14px}
  .rc-prompt-wrap .rc-prompt,
  .rc-prompt-wrap .rc-prompt-detail{font-size:calc(12 * 1rem / 16)}
  .rc-media img{max-width:100%;max-height:200px}
  .rc-actions .btn{min-height:36px;font-size:calc(11 * 1rem / 16)}

  .gen-bar{padding:10px 12px 8px}
  .gen-row{padding:6px 6px 6px 10px;border-radius:12px}
  .prompt-area textarea{font-size:calc(16 * 1rem / 16);min-height:96px;max-height:min(300px,48vh)}
  .prompt-area .ce-prompt{min-height:96px;max-height:min(300px,48vh)}
  /* 图片 #img-prompt：不受上一行 .prompt-area textarea 的 max-height 裁切 */
  #panel-image .prompt-area #img-prompt{max-height:none;min-height:96px}
  .gen-submit-btn{width:40px;height:40px}
  .gen-align-bar{flex-wrap:wrap;gap:6px;margin-top:10px;margin-bottom:0}
  .tb-select{font-size:calc(13 * 1rem / 16);padding:6px 28px 6px 10px;min-height:36px}
  #panel-video .tb-cs-trigger{font-size:calc(13 * 1rem / 16);min-height:36px;padding:6px 10px}
  #panel-video .tb-cs-option{font-size:calc(13 * 1rem / 16)}
  .tb-btn{font-size:calc(12 * 1rem / 16);padding:6px 12px;min-height:36px}
  .sp-row{flex:1 1 calc(33% - 8px);min-width:80px}

  .ref-thumb{width:40px;height:40px}

  .api-body{padding:16px 12px 24px}
  .api-section h2{font-size:calc(16 * 1rem / 16);flex-wrap:wrap;gap:4px}
  .api-section h3{font-size:calc(14 * 1rem / 16);margin:12px 0 6px}
  .api-section p,.api-section li{font-size:calc(13 * 1rem / 16)}
  .endpoint-bar{font-size:calc(11 * 1rem / 16);word-break:break-all}
  .param-table{font-size:calc(11 * 1rem / 16);display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .param-table th,.param-table td{padding:6px 8px;white-space:nowrap}
  .param-table td:last-child{white-space:normal}
  .code-block pre{font-size:calc(11.5 * 1rem / 16);padding:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;-webkit-text-size-adjust:none}
  .api-tip,.api-warn{font-size:calc(12 * 1rem / 16);padding:10px 12px}
  .pricing-channel{padding:14px 12px}
  .pricing-channel-head .ch-name{font-size:calc(14 * 1rem / 16)}
  .pricing-channel-head .ch-desc{margin-left:0;width:100%}

  .overlay-panel{width:100vw}
  .ov-body{padding:12px}
  .acct-hero{padding:16px 14px}
  .acct-hero-balance .amt{font-size:calc(22 * 1rem / 16)}
  .acct-hero-sub{gap:10px}
  .acct-hero-sub .sub-val{font-size:calc(13 * 1rem / 16)}
  .acct-hero-sub .sub-label{font-size:calc(10 * 1rem / 16)}
  .acct-card{padding:14px 12px}
  .acct-row2{grid-template-columns:1fr}
  .acct-recharge-row{flex-wrap:wrap}
  .acct-recharge-row .input{min-width:0;flex:1 1 100%}
  .acct-recharge-row .btn{flex:1;min-height:44px}

  .task-card{flex-direction:column;gap:10px}
  .task-card .thumb{width:100%;height:120px}

  .tx-table{font-size:calc(11 * 1rem / 16);display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  .tx-table th,.tx-table td{padding:6px 6px}
  .tx-header{flex-direction:column;align-items:flex-start;gap:8px}
  .tx-filters{gap:3px}
  .tx-fbtn{padding:4px 10px;font-size:calc(11 * 1rem / 16);min-height:32px}
}

@media (min-width:1200px){
  .acct-row2{grid-template-columns:1fr 1fr 1fr}
}
