.gpp-beats-manager{
  --gpp-beat-red:#ed1737;
  --gpp-beat-panel:#111319;
  --gpp-beat-line:rgba(255,255,255,.09);
  color:#fff;
}
.gpp-beats-manager *{box-sizing:border-box}
.gpp-beats-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:34px;
  border:1px solid var(--gpp-beat-line);
  border-radius:22px;
  background:radial-gradient(circle at 88% 20%,rgba(237,23,55,.25),transparent 30%),#111319;
}
.gpp-beats-hero span,.gpp-beat-modal header span{
  color:var(--gpp-beat-red);
  font-size:10px;
  font-weight:900;
  letter-spacing:.16em;
}
.gpp-beats-hero h1{
  margin:7px 0;
  color:#fff;
  font-size:50px;
  letter-spacing:-.045em;
}
.gpp-beats-hero p{max-width:680px;margin:0;color:#a8afbb}
.gpp-beats-hero>button,.gpp-beats-empty button{
  min-height:48px;
  padding:0 18px;
  border:0;
  border-radius:11px;
  background:var(--gpp-beat-red);
  color:#fff;
  font-weight:900;
}
.gpp-beats-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:16px 0;
}
.gpp-beats-metrics article{
  padding:18px;
  border:1px solid var(--gpp-beat-line);
  border-radius:14px;
  background:var(--gpp-beat-panel);
}
.gpp-beats-metrics strong,.gpp-beats-metrics span{display:block}
.gpp-beats-metrics strong{font-size:30px}
.gpp-beats-metrics span{margin-top:5px;color:#8e96a2;font-size:10px}
.gpp-beats-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.gpp-beat-card{
  overflow:hidden;
  border:1px solid var(--gpp-beat-line);
  border-radius:17px;
  background:var(--gpp-beat-panel);
}
.gpp-beat-card__cover{
  position:relative;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  background:#0a0c11;
}
.gpp-beat-card__cover img{width:100%;height:100%;object-fit:cover}
.gpp-beat-card__cover>span{font-size:50px}
.gpp-beat-card__cover button{
  position:absolute;
  left:50%;
  top:50%;
  width:58px;
  height:58px;
  transform:translate(-50%,-50%);
  border:0;
  border-radius:50%;
  background:rgba(237,23,55,.94);
  color:#fff;
  font-size:18px;
}
.gpp-beat-card__body{padding:18px}
.gpp-beat-card__body h3{margin:9px 0 5px;color:#fff;font-size:21px}
.gpp-beat-card__body p{min-height:18px;margin:0 0 12px;color:#929aa6;font-size:11px}
.gpp-beat-card__body>strong{display:block;font-size:18px}
.gpp-beat-status{
  display:inline-flex;
  padding:5px 8px;
  border-radius:999px;
  background:#2a2e37;
  color:#c3cad4;
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
}
.gpp-beat-status.is-publish{background:rgba(34,197,94,.14);color:#86efac}
.gpp-beat-card__actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:15px}
.gpp-beat-card__actions button,.gpp-beat-card__actions a{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border:1px solid var(--gpp-beat-line);
  border-radius:8px;
  background:#191c23;
  color:#fff;
  font-size:9px;
  font-weight:800;
  text-decoration:none;
}
.gpp-beat-card__actions .is-danger{color:#fda4af}
.gpp-beats-empty{
  display:grid;
  justify-items:center;
  gap:9px;
  padding:70px 24px;
  border:1px solid var(--gpp-beat-line);
  border-radius:18px;
  background:var(--gpp-beat-panel);
  text-align:center;
}
.gpp-beats-empty>span{font-size:52px}
.gpp-beats-empty h2{margin:4px 0;color:#fff}
.gpp-beats-empty p{max-width:500px;margin:0 0 12px;color:#929aa6}

.gpp-beat-modal{
  position:fixed;
  inset:0;
  z-index:100000;
  overflow-y:auto;
  padding:18px;
}
.gpp-beat-modal__backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.84);
  backdrop-filter:blur(7px);
}
.gpp-beat-modal__panel{
  position:relative;
  width:min(920px,100%);
  margin:0 auto 30px;
  padding:24px;
  border:1px solid var(--gpp-beat-line);
  border-radius:21px;
  background:#0f1117;
  box-shadow:0 35px 100px rgba(0,0,0,.5);
}
.gpp-beat-modal__panel>header{
  position:sticky;
  top:-18px;
  z-index:20;
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:8px 0 18px;
  background:#0f1117;
}
.gpp-beat-modal header h2{margin:5px 0 0;color:#fff;font-size:30px}
.gpp-beat-modal header button{
  width:42px;
  height:42px;
  border:1px solid var(--gpp-beat-line);
  border-radius:50%;
  background:#1a1d25;
  color:#fff;
  font-size:24px;
}
.gpp-beat-step{
  margin-bottom:16px;
  padding:20px;
  border:1px solid var(--gpp-beat-line);
  border-radius:16px;
  background:#12151c;
}
.gpp-beat-section-title{
  display:flex;
  gap:12px;
  align-items:flex-start;
  margin-bottom:18px;
}
.gpp-beat-section-title>span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 34px;
  border-radius:10px;
  background:var(--gpp-beat-red);
  font-weight:900;
}
.gpp-beat-section-title h3{margin:0;color:#fff}
.gpp-beat-section-title p{margin:3px 0 0;color:#8f97a3;font-size:11px}
.gpp-beat-cover{
  position:relative;
  min-height:250px;
  display:grid;
  place-items:center;
  margin-bottom:16px;
  overflow:hidden;
  border:1px dashed rgba(255,255,255,.18);
  border-radius:15px;
  background:#0b0d12;
}
.gpp-beat-cover>span{font-size:45px}
.gpp-beat-cover img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.gpp-beat-cover>div{
  position:absolute;
  right:14px;
  bottom:14px;
  z-index:2;
  display:flex;
  gap:7px;
}
.gpp-beat-cover button,.gpp-beat-upload-grid button{
  min-height:34px;
  padding:0 11px;
  border:1px solid var(--gpp-beat-line);
  border-radius:8px;
  background:rgba(10,12,17,.92);
  color:#fff;
  font-size:9px;
  font-weight:800;
}
.gpp-beat-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px;
}
.gpp-beat-fields label{
  display:grid;
  gap:7px;
  color:#d8dce2;
  font-size:11px;
  font-weight:800;
}
.gpp-beat-fields label.full{grid-column:1/-1}
.gpp-beat-fields input,.gpp-beat-fields textarea,.gpp-beat-fields select{
  width:100%;
  min-height:47px;
  padding:12px;
  border:1px solid var(--gpp-beat-line);
  border-radius:11px;
  background:#0b0d12;
  color:#fff;
  -webkit-text-fill-color:#fff;
}
.gpp-beat-upload-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.gpp-beat-upload-grid article{
  display:grid;
  gap:9px;
  padding:17px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:13px;
  background:#0b0d12;
}
.gpp-beat-upload-grid small{color:#858e9a}
.gpp-beat-upload-grid audio{width:100%}
.gpp-beat-form-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding-top:4px;
}
.gpp-beat-form-actions button{
  min-height:46px;
  padding:0 16px;
  border:1px solid var(--gpp-beat-line);
  border-radius:10px;
  background:#1a1d25;
  color:#fff;
  font-weight:900;
}
.gpp-beat-form-actions button[type="submit"]{
  border-color:var(--gpp-beat-red);
  background:var(--gpp-beat-red);
}
.gpp-beat-feedback{
  margin-top:12px;
  padding:11px 13px;
  border-radius:10px;
}
.gpp-beat-feedback.is-success{background:rgba(34,197,94,.12);color:#86efac}
.gpp-beat-feedback.is-error{background:rgba(239,68,68,.12);color:#fca5a5}

@media(max-width:1000px){
  .gpp-beats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  .gpp-beats-hero{align-items:flex-start;flex-direction:column}
  .gpp-beats-hero h1{font-size:38px}
  .gpp-beats-metrics,.gpp-beats-grid,.gpp-beat-fields,.gpp-beat-upload-grid{grid-template-columns:1fr}
  .gpp-beat-fields label.full{grid-column:auto}
  .gpp-beat-modal{padding:8px}
  .gpp-beat-modal__panel{padding:15px}
}


/* v14.3.2 - Exact Chrome/Edge autofill fix for Mes beats modal.
   Important: the real wrapper is .gpp-beats-manager (plural). */
.gpp-beats-manager [data-beat-form] input:-webkit-autofill,
.gpp-beats-manager [data-beat-form] input:-webkit-autofill:hover,
.gpp-beats-manager [data-beat-form] input:-webkit-autofill:focus,
.gpp-beats-manager [data-beat-form] input:-webkit-autofill:active,
.gpp-beats-manager [data-beat-form] textarea:-webkit-autofill,
.gpp-beats-manager [data-beat-form] textarea:-webkit-autofill:hover,
.gpp-beats-manager [data-beat-form] textarea:-webkit-autofill:focus,
.gpp-beats-manager [data-beat-form] select:-webkit-autofill,
.gpp-beats-manager [data-beat-form] select:-webkit-autofill:hover,
.gpp-beats-manager [data-beat-form] select:-webkit-autofill:focus {
  -webkit-text-fill-color:#fff !important;
  caret-color:#fff !important;
  background-color:#0b0d12 !important;
  -webkit-box-shadow:0 0 0 1000px #0b0d12 inset !important;
  box-shadow:0 0 0 1000px #0b0d12 inset !important;
  border-color:rgba(255,255,255,.09) !important;
  transition:background-color 600000s 0s,color 600000s 0s !important;
}

/* Also keep programmatically-filled fields visually identical. */
.gpp-beats-manager [data-beat-form] input,
.gpp-beats-manager [data-beat-form] textarea,
.gpp-beats-manager [data-beat-form] select {
  background-color:#0b0d12 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  caret-color:#fff !important;
}

/* Standard autofill selector for supporting browsers. */
.gpp-beats-manager [data-beat-form] input:autofill,
.gpp-beats-manager [data-beat-form] textarea:autofill,
.gpp-beats-manager [data-beat-form] select:autofill {
  background-color:#0b0d12 !important;
  color:#fff !important;
}


/* v14.5.7 — Beatmaker sales dashboard */
.gpp-beats-metrics{
  grid-template-columns:repeat(6,minmax(0,1fr));
}
.gpp-beats-metrics article strong{
  overflow-wrap:anywhere;
}

.gpp-beat-card__sales{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:12px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:#0c0f14;
}
.gpp-beat-card__sales span{
  color:#9aa3af;
  font-size:10px;
}
.gpp-beat-card__sales b{
  color:#86efac;
  font-size:11px;
}

.gpp-beat-sales-panel{
  margin-top:18px;
  padding:22px;
  border:1px solid var(--gpp-beat-line);
  border-radius:18px;
  background:var(--gpp-beat-panel);
}
.gpp-beat-sales-panel__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
}
.gpp-beat-sales-panel__head>div>span{
  color:var(--gpp-beat-red);
  font-size:9px;
  font-weight:900;
  letter-spacing:.15em;
}
.gpp-beat-sales-panel h2{
  margin:5px 0 4px;
  color:#fff;
  font-size:25px;
}
.gpp-beat-sales-panel p{
  margin:0;
  color:#8e96a2;
  font-size:11px;
}
.gpp-beat-license-breakdown{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:7px;
}
.gpp-beat-license-breakdown b{
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  background:#191c23;
  color:#d8dde6;
  font-size:9px;
}
.gpp-beat-sales-table-wrap{
  overflow-x:auto;
}
.gpp-beat-sales-table{
  width:100%;
  min-width:720px;
  border-collapse:collapse;
}
.gpp-beat-sales-table th,
.gpp-beat-sales-table td{
  padding:13px 12px;
  border-top:1px solid rgba(255,255,255,.08);
  text-align:left;
  color:#d7dce5;
  font-size:10px;
}
.gpp-beat-sales-table th{
  color:#7f8794;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.gpp-beat-sales-table td:last-child{
  color:#86efac;
  font-weight:800;
}

@media(max-width:1100px){
  .gpp-beats-metrics{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
  .gpp-beats-metrics{grid-template-columns:repeat(2,1fr)}
  .gpp-beat-sales-panel__head{display:block}
  .gpp-beat-license-breakdown{justify-content:flex-start;margin-top:14px}
}