/* Synchronous MiniMax uses the same stage and fixed-width composer as Studio. */
.native-media-panel {
  display: flex; flex: 1 1 auto; flex-direction: column;
  width: 100%; min-width: 0; min-height: 0; margin: 0; padding: 0;
  color: var(--ink);
}
.native-media-stage { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; padding: 0 28px 14px; }
.native-media-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex: 0 0 auto; }
.native-media-heading h1 { margin: 0; font-size: 14px; font-weight: 500; color: #aab2bf; }
.native-media-heading .quiet { font-size: 11px; }
.native-media-preview { position: relative; flex: 1 1 auto; min-width: 0; min-height: 0; }
.native-media-empty { display: flex; height: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; color: #8e96a3; }
.native-media-empty img { width: 96px; height: 96px; object-fit: contain; margin-bottom: 12px; }
.native-media-empty p { margin: 0; color: #d9dfe8; font-size: 18px; }
.native-media-empty span { font-size: 12px; }
.native-media-outputs { position: absolute; inset: 0; display: grid; grid-auto-rows: 100%; gap: 20px; overflow-y: auto; overscroll-behavior: contain; scroll-snap-type: y proximity; }
.native-media-outputs:empty { display: none; }
.native-media-output { display: grid; grid-template-rows: minmax(0,1fr) auto auto; justify-items: center; min-height: 0; min-width: 0; padding: 0; border: 0; background: transparent; scroll-snap-align: start; }
.native-media-output img { width: 100%; height: 100%; min-height: 0; min-width: 0; object-fit: contain; }
.native-media-output audio { width: min(100%,520px); align-self: center; }
.native-media-output p { margin: 8px 0 0; color: #8e96a3; font-size: 11px; }
.native-media-output a { padding: 8px; color: #7ad7e6; font-size: 12px; }
.native-media-retention { flex: 0 0 auto; margin: 10px 0 0; color: #929aa7; font-size: 11px; text-align: center; line-height: 1.6; }
.native-media-editor { flex: 0 0 auto; width: 100%; min-width: 0; padding: 0 75.6px 21px; }
.native-media-form { position: relative; display: flex; flex-direction: column; width: min(1176px,100%); min-width: 0; min-height: 189px; margin: 0 auto; padding: 16px 14px 10px; border: 1px solid #21232a; border-radius: 20px; background: #1b1c21; }
.native-media-prompt { display: block; flex: 1 1 auto; min-width: 0; }
.native-media-form textarea { display: block; width: 100%; height: 90px; min-height: 90px; max-height: 90px; margin: 0; padding: 0; resize: none; border: 0; border-radius: 4px; background: transparent; color: #e8ecf2; font: inherit; font-size: 13px; line-height: 1.65; overflow-y: auto; overscroll-behavior: contain; }
.native-media-tools { display: flex; align-items: center; gap: 10px; margin-top: 12px; min-width: 0; }
.native-media-settings { display: flex; flex: 1 1 auto; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.native-media-settings .control { display: inline-flex; }
.native-media-settings select { max-width: 180px; }
#native-media-count { flex-shrink: 0; color: #7f8794; font-size: 10px; font-variant-numeric: tabular-nums; }
#native-media-send { flex: 0 0 36px; font-size: 0; }
#native-media-send::before { content: '↑'; font-size: 23px; line-height: 1; font-weight: 600; }
.native-media-help { position: static; font-size: 11px; color: #929aa7; }
.native-media-help summary { cursor: pointer; padding: 7px 4px; }
.native-media-help[open] p { position: absolute; z-index: 5; bottom: calc(100% - 8px); left: 14px; right: 14px; width: auto; max-height: min(260px,35dvh); overflow-y: auto; margin: 0; padding: 14px 16px; border: 1px solid #343944; border-radius: 12px; background: #23262e; color: #c1c8d3; line-height: 1.8; box-shadow: 0 8px 28px #0004; }
.native-media-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 10px; max-height: 76px; overflow-y: auto; font-size: 11px; line-height: 1.7; color: #aeb6c2; }
.native-media-feedback p { margin: 7px 0 0; }
.native-media-feedback p:empty { display: none; }
.native-media-feedback .quiet { font-size: 11px; }
.native-media-status:not(:empty) { flex-basis: 100%; }
.native-media-clear-confirm { flex: 0 0 auto; margin: 10px auto; max-width: 680px; padding: 14px 16px; border: 1px solid #41444e; border-radius: 12px; background: #202229; color: var(--ink); }
.native-media-clear-confirm p { font-size: 12px; line-height: 1.7; margin: 8px 0; }
.native-media-clear-actions { display: flex; flex-wrap: wrap; gap: 16px; }
.native-media-clear-actions button { min-height: 38px; }
@media (max-width: 760px) {
  .native-media-stage { padding: 0 14px 14px; }
  .native-media-heading h1 { font-size: 12px; }
  .native-media-empty img { width: 68px; height: 68px; margin-bottom: 0; }
  .native-media-empty p { font-size: 15px; }
  .native-media-empty span { font-size: 11px; }
  .native-media-editor { padding: 0 8px 9px; }
  .native-media-form { min-height: 225px; padding: 22px 14px 13px; border-radius: 18px; }
  .native-media-form textarea { height: 90px; min-height: 90px; max-height: 90px; }
  .native-media-settings { gap: 6px; }
  .native-media-settings .model-badge { max-width: 160px; overflow: hidden; text-overflow: ellipsis; }
  #native-media-count { display: none; }
  .native-media-retention { font-size: 10px; }
}
@media (max-height: 500px) {
  .workspace:has(.native-media-panel:not([hidden])) { overflow-y: auto; }
  .native-media-panel { flex: 0 0 auto; min-height: calc(100dvh - 90px); }
  .native-media-stage { flex: 0 0 auto; height: 230px; }
}

.native-media-custom-fields{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.native-media-custom-fields label{display:inline-flex;align-items:center;gap:6px;font-size:12px}.native-media-custom-fields input{width:92px;min-height:34px;color:inherit;background:#25272e;border:1px solid #41444e;border-radius:6px;padding:6px}.native-media-size-help{margin:6px 0;font-size:11px;line-height:1.6;color:#929aa7}