/* AZRA Composer v57 — spacing, real staged-video upload, unlocked trim and transparent metadata. */
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline,
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  margin-bottom: 0 !important;
}
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline { margin-top: 14px !important; padding: 0 !important; }
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline input#cTitle,
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline input#cTitle:focus,
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf textarea#cBody,
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf textarea#cBody:focus {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background-clip: padding-box !important;
}
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline input#cTitle {
  margin: 0 0 18px !important;
  padding: 8px 0 12px !important;
  line-height: 1.42 !important;
  color: #f5f5f7 !important;
  caret-color: #ffd60a !important;
}
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf {
  margin-top: 0 !important;
  padding: 0 !important;
}
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf textarea#cBody {
  min-height: 150px !important;
  margin: 0 !important;
  padding: 5px 0 16px !important;
  line-height: 1.86 !important;
  color: #e5e5e9 !important;
  caret-color: #ffd60a !important;
  resize: vertical !important;
}
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline input#cTitle::placeholder,
html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-bodyf textarea#cBody::placeholder { color: #777780 !important; opacity: 1 !important; }
/* The tags panel is metadata, not a card. Keep the chips visible but remove the boxed inputs. */
html body .overlay.az-ov .modal.az-studio .az-side .az-tagsec,
html body .overlay.az-ov .modal.az-studio .az-side .az-tagsec:focus-within {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 12px 0 14px !important;
  margin: 0 !important;
}
html body .overlay.az-ov .modal.az-studio .az-side .az-tagin,
html body .overlay.az-ov .modal.az-studio .az-side .az-tagin:focus-within {
  display: flex !important;
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 8px 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  gap: 7px !important;
}
html body .overlay.az-ov .modal.az-studio .az-side .az-tagin input,
html body .overlay.az-ov .modal.az-studio .az-side .az-tagin input:focus {
  min-width: 70px !important;
  max-width: 100% !important;
  padding: 9px 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  color: #f4f4f5 !important;
  caret-color: #ffd60a !important;
}
html body .overlay.az-ov .modal.az-studio .az-side .az-tagin input::placeholder { color: #77777e !important; }
html body .overlay.az-ov .modal.az-studio .az-side .az-chips { display:flex; flex-wrap:wrap; gap:6px; min-width:0; max-width:100%; }
/* Explicit Back control: arrow, label, sufficient tap target, no clipped icon. */
.az-studio .az-top .az-back {
  display:inline-flex !important;
  flex:0 0 auto !important;
  min-height:40px !important;
  min-width:88px !important;
  max-width:124px !important;
  gap:7px !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 10px !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:transparent !important;
  border-radius:13px !important;
  color:#f5f5f5 !important;
  overflow:hidden !important;
}
.az-studio .az-top .az-back .az-i { width:21px !important; height:21px !important; flex:0 0 21px !important; }
.az-studio .az-top .az-back span { display:block !important; min-width:0 !important; max-width:80px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px !important; font-weight:650 !important; }
.az-studio .az-top .az-back:active { transform:scale(.97); }
/* Actual upload percentage: the fill is driven by XMLHttpRequest.upload.onprogress, never animation. */
#cUpl.azra-upl,
html body .overlay.az-ov .modal.az-studio #cUpl {
  display:block;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  margin:14px 0 10px !important;
  padding:12px 0 !important;
  background:transparent !important;
  background-color:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow:hidden;
}
#cUpl[hidden] { display:none !important; }
#cUpl .azra-upl-top { display:flex; justify-content:space-between; align-items:center; gap:12px; min-width:0; margin-bottom:9px; color:#c7c7ce; font-size:13px; }
#cUpl .azra-upl-top span { min-width:0; overflow-wrap:anywhere; }
#cUpl .azra-upl-top b { flex:0 0 auto; color:#ffd60a; font-variant-numeric:tabular-nums; font-size:15px; }
#cUpl .azra-upl-bar { height:7px !important; width:100%; border:0 !important; border-radius:99px !important; overflow:hidden; background:#26262a !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.035); }
#cUpl .azra-upl-bar i, #cUpl #cUplFill { display:block; height:100%; width:0; border:0; border-radius:99px; background:linear-gradient(90deg,#b99a00,#ffd60a) !important; transition:width .18s linear !important; transform:none !important; }
#cUpl.azc-uploaded .azra-upl-bar i, #cUpl.azc-uploaded #cUplFill { background:linear-gradient(90deg,#b4a13b,#ffd60a) !important; }
#cUpl.azc-upload-error .azra-upl-bar i, #cUpl.azc-upload-error #cUplFill { background:#d26b58 !important; }
#cUpl .azra-upl-sub { margin-top:7px; color:#888890; font-size:12px; line-height:1.55; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
#cUpl .azra-upl-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
#cUpl .azra-upl-actions button { min-height:34px; max-width:100%; padding:6px 11px; border:1px solid rgba(255,214,10,.32); border-radius:10px; background:transparent; color:#ffd60a; font:inherit; font-size:12px; overflow-wrap:anywhere; }
#cUpl .azra-upl-actions button[hidden] { display:none !important; }
.cp-upload-wait { padding:12px 0 14px; color:#aaaab2; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.cp-upload-wait[hidden], .cp-tl[hidden] { display:none !important; }
.cp-video-locked .cp-stage::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 68%,rgba(0,0,0,.24)); }
.cp-video-uploaded .cp-upload-wait { display:none; }
@media (max-width:390px) {
  .az-studio .az-top .az-back { min-width:78px !important; padding-inline:7px !important; gap:5px !important; }
  .az-studio .az-top .az-back span { font-size:12px !important; }
  html body .overlay.az-ov .modal.az-studio .modal-body.az-body .az-main .field.az-titlef-inline input#cTitle { margin-bottom:14px !important; }
}
@media(prefers-reduced-motion:reduce) {
  #cUpl .azra-upl-bar i, #cUpl #cUplFill, .az-studio .az-top .az-back { transition:none !important; animation:none !important; }
}
